A simple date picker with live 12/24hr clock, month/week names, 2/4 digits' year display and supported with configuration settings...
Live Date Lite v1.08
<html>
<head>
<title>Live Date Lite v1.08</title>
<script type="text/javascript">
<!-- BEGIN HIDING
/* By: essential -
Title: Live Date Lite v1.08
Supported with cofiguration settings. Save this as part of your .js files. */
var show = new Boolean('true');
var hide = null;
var today = new Date();
var cMonth = today.getMonth();
var cDate = today.getDate();
var cm = '';
var date_separator = ' ';
/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
////////CONFIGURATION/////////
\\\\\\\\\\\SETTINGS\\\\\\\\\\\\
///////////////////////////////*/
//Week Display -->
var short_name = hide;
//Month Display -->
var short__name = hide;
//Date Extention -->
var date_extention = show;
//Setting this to show will-
//convert all date items in numeric values.
//Numeric Display -->
var numeric_display = hide;
//12/24 Hour Format-->
var twenty_four_hour = hide;
Date.prototype.get_week_names = function( weekNames )
{ //--> WEEK NAMES <--\\
var week_names = [ 'Sunday','Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday' ];
if ( weekNames )
{
return week_names[this.getDay()].substr( 0, 3 );
}
else
{
return week_names[this.getDay()];
}
}
Date.prototype.get_month_names = function( monthNames, numericMonth )
{ //--> MONTH NAMES <--\\
var month_names = [ 'January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December' ];
if ( numericMonth )
{
cMonth = cMonth + 1;
return cMonth = ( cMonth < 10 ? '0' : '' ) + cMonth; }
if ( monthNames )
{ return month_names[this.getMonth()].substr( 0, 3 );
}
else
{ return month_names[this.getMonth()];
}
}
Date.prototype.get_date = function( extended )
{ //--> DATE EXTENTION <--\\
var extention = ['', 'st', 'nd', 'rd', 'th', 'th', 'th', 'th', 'th', 'th', 'th', 'th', 'th', 'th', 'th', 'th', 'th', 'th', 'th', 'th', 'th', 'st', 'nd', 'rd', 'th', 'th', 'th', 'th', 'th', 'th', 'th', 'st' ];
cDate = ( cDate < 10 ? '0' : '' ) + cDate;
if ( extended )
{
return this.getDate() + extention[this.getDate()];
}
else
{ return cDate;
}
}
Date.prototype.get_year = function (numeric_year)
{ //--> TWO DIGITS <--\\
if ( numeric_year )
{ var cYear = today.getYear();
cYear = cYear -100
if ( cYear < 10 ) { return cYear = '0' + cYear; } else { return cYear; }
}
else
{ return this.getFullYear();
}
}
Date.prototype.get_time = function(twenty_4)
{
var hour_12 = this.getHours();
var hour_24 = this.getHours();
var cMinute = this.getMinutes();
var cSeconds = this.getSeconds();
var ppoS = '';
cMinute = ( cMinute < 10 ? '0' : '' ) + cMinute;
cSeconds = ( cSeconds < 10 ? '0' : '' ) + cSeconds;
apoS = ( hour_12 < 12 ) ? '.am ' : '.pm ';
hour_12 = ( hour_12 > 12 ) ? hour_12 -12 : hour_12;
hour_12 = ( hour_12 == 0 ) ? 12 : hour_12;
hour_12 = ( hour_12 < 10 ? '0' : '' ) + hour_12;
ppoS = ( hour_24 > 0 && hour_24 < 12 ) ? '.am\' ' : '.pm" ';
if ( hour_24 >= 13 ) ppoS = '';
hour_24 = ( hour_24 < 10 ? '0' : '' ) + hour_24;
var hr12 = hour_12 + ':' + cMinute + ':' + cSeconds + apoS.fontcolor('#B42600');
var hr24 = hour_24 + ':' + cMinute + ':' + cSeconds + ppoS.fontcolor('#B42600');
if ( twenty_4 )
{
return hr24
}
else
{
return hr12
}
}
function live_date()
{ var now = new Date();
var week = now.get_week_names(short_name)
var month = now.get_month_names( short__name, numeric_display);
var date = now.get_date(date_extention);
var year = now.get_year(numeric_display);
var time = now.get_time(twenty_four_hour);
document.getElementById('clock').innerHTML = time;
date_items.date_container.value = week + ' | ' + month + date_separator + date + cm + date_separator + year;
}
cm = ( date_extention == null && numeric_display == null ) ? cm = ',' : cm;
date_separator = ( numeric_display == true ) ? date_separator = '-' : date_separator;
short__names = ( numeric_display == true ) ? short__names = hide : short__names;
date_extention = ( numeric_display == true ) ? date_extention = hide : date_extention;
// DONE HIDING -->
</script>
<style type="text/css">
<!--
/* Live Date */
* { margin: 0; padding: 0; }
body { }
#live { float: left; width: 270px; margin: 6px; padding: 2px; }
#live fieldset { margin: 2px; padding: 2px; width: 262px; color: #36393D; font: 16px Arial; border: none; }
#date_wrapper { margin: 0; padding: 1px; width: 240px; background: #000000; }
#date_wrapper form { margin: 0 2px 0 0; padding: 2px; height: 25px; width: 270px; background-color: #FFFFFF; color: #36393D; }
#date_wrapper input { color: #36393D; background-color: #FFFFFF; height: 16px; text-align: center; margin-top: 4px; border: none; }
#date_wrapper input[type=button] { background-color: #36393D; color: #CCE698; margin-top: 6px; }
-->
</style>
</head>
<body onLoad="setInterval('live_date()', 1000);">
<div id="live">
<fieldset>
<legend>
<div id="clock"> </div>
</legend>
<div id="date_wrapper">
<form name="date_items"> <input name="date_container" type="text" size="28" />
</form>
</div>
</fieldset>
</div>
</body>
</html>
uringinteristi 0 Newbie Poster
thank you
Be a part of the DaniWeb community
We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.