JavaScript / DHTML / AJAX RSS JavaScript / DHTML / AJAX RSS

Live Date Lite v1.08

Please support our JavaScript / DHTML / AJAX advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases
essential essential is offline Offline Aug 12th, 2008, 12:01 pm |
0
A simple date picker with live 12/24hr clock, month/week names, 2/4 digits' year display and supported with configuration settings...
Show Printable Version Show Printable Version
Quick reply to this message  
Code Snippet
•
•
•
•
JavaScript / DHTML / AJAX Syntax
Toggle Plain Text
  1. <html>
  2. <head>
  3. <title>Live Date Lite v1.08</title>
  4. <script type="text/javascript">
  5. <!-- BEGIN HIDING
  6. /* By: essential -
  7. Title: Live Date Lite v1.08
  8. Supported with cofiguration settings. Save this as part of your .js files. */
  9. var show = new Boolean('true');
  10. var hide = null;
  11. var today = new Date();
  12. var cMonth = today.getMonth();
  13. var cDate = today.getDate();
  14. var cm = '';
  15. var date_separator = ' ';
  16. /*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
  17. ////////CONFIGURATION/////////
  18. \\\\\\\\\\\SETTINGS\\\\\\\\\\\\
  19. ///////////////////////////////*/
  20. //Week Display -->
  21. var short_name = hide;
  22. //Month Display -->
  23. var short__name = hide;
  24. //Date Extention --> 
  25. var date_extention = show;
  26. //Setting this to show will-
  27. //convert all date items in numeric values.
  28. //Numeric Display -->
  29. var numeric_display = hide; 
  30. //12/24 Hour Format-->
  31. var twenty_four_hour = hide;
  32. Date.prototype.get_week_names = function( weekNames )
  33. { //--> WEEK NAMES <--\\
  34. var week_names = [ 'Sunday','Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday' ];
  35. if ( weekNames )
  36. { 
  37.   return week_names[this.getDay()].substr( 0, 3 ); 
  38. }
  39. else
  40. {
  41.   return week_names[this.getDay()];
  42.   }
  43. } 
  44. Date.prototype.get_month_names = function( monthNames, numericMonth )
  45. { //--> MONTH NAMES <--\\
  46.   var month_names = [ 'January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December' ];
  47. if ( numericMonth ) 
  48. { 
  49. cMonth = cMonth + 1;
  50. return cMonth = ( cMonth < 10 ? '0' : '' ) + cMonth; }
  51. if ( monthNames )
  52. { return month_names[this.getMonth()].substr( 0, 3 );
  53. }
  54. else 
  55. { return month_names[this.getMonth()];
  56.   }
  57. }
  58. Date.prototype.get_date = function( extended )
  59. { //--> DATE EXTENTION <--\\
  60.   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' ];
  61. cDate = ( cDate < 10 ? '0' : '' ) + cDate;
  62. if ( extended ) 
  63. {  
  64. return this.getDate() + extention[this.getDate()];
  65. }
  66. else
  67. { return cDate;
  68.   }
  69. }
  70. Date.prototype.get_year = function (numeric_year)
  71. { //--> TWO DIGITS <--\\
  72. if ( numeric_year ) 
  73. { var cYear = today.getYear();
  74.   cYear = cYear -100
  75. if ( cYear < 10 ) { return  cYear = '0' + cYear; } else { return cYear; }
  76. }
  77. else
  78. { return this.getFullYear();
  79.   }
  80. }
  81. Date.prototype.get_time = function(twenty_4)
  82. {
  83. var hour_12 = this.getHours();
  84. var hour_24 = this.getHours();
  85. var cMinute = this.getMinutes();
  86. var cSeconds = this.getSeconds();
  87. var ppoS = '';
  88. cMinute = ( cMinute < 10 ? '0' : '' ) + cMinute;
  89. cSeconds = ( cSeconds < 10 ? '0' : '' ) + cSeconds;
  90. apoS = ( hour_12 < 12 ) ? '.am ' : '.pm ';
  91. hour_12 = ( hour_12 > 12 ) ? hour_12 -12 : hour_12;
  92. hour_12 = ( hour_12 == 0 ) ? 12 : hour_12;
  93. hour_12 = ( hour_12 < 10 ? '0' : '' ) + hour_12;
  94. ppoS = ( hour_24 > 0 && hour_24 < 12 ) ? '.am\' ' : '.pm" ';
  95. if ( hour_24 >= 13 ) ppoS = '';
  96. hour_24 = ( hour_24 < 10 ? '0' : '' ) + hour_24;
  97. var hr12 = hour_12 + ':' + cMinute + ':' + cSeconds + apoS.fontcolor('#B42600');
  98. var hr24 = hour_24 + ':' + cMinute + ':' + cSeconds + ppoS.fontcolor('#B42600');
  99. if ( twenty_4 )
  100. { 
  101. return hr24 
  102. }
  103. else
  104. { 
  105. return hr12
  106.   }
  107. }
  108. function live_date()
  109. { var now = new Date(); 
  110.       var week = now.get_week_names(short_name)
  111.       var month = now.get_month_names( short__name, numeric_display);
  112.       var date = now.get_date(date_extention);
  113.       var year = now.get_year(numeric_display);
  114.       var time = now.get_time(twenty_four_hour);
  115. document.getElementById('clock').innerHTML = time;
  116. date_items.date_container.value = week + ' | ' + month + date_separator + date + cm + date_separator + year; 
  117. }
  118. cm = ( date_extention == null && numeric_display == null ) ? cm = ',' : cm;
  119. date_separator = ( numeric_display == true ) ? date_separator = '-' : date_separator;
  120. short__names = ( numeric_display == true ) ? short__names = hide : short__names; 
  121. date_extention = ( numeric_display == true ) ? date_extention = hide : date_extention;
  122. // DONE HIDING -->
  123. </script>
  124. <style type="text/css">
  125. <!--
  126. /* Live Date */
  127. * { margin: 0; padding: 0; }
  128. body { }
  129. #live { float: left; width: 270px; margin: 6px; padding: 2px; }
  130. #live fieldset { margin: 2px; padding: 2px; width: 262px; color: #36393D; font: 16px Arial; border: none; }
  131. #date_wrapper { margin: 0; padding: 1px; width: 240px; background: #000000; }
  132. #date_wrapper form {  margin: 0 2px 0 0; padding: 2px; height: 25px; width: 270px; background-color: #FFFFFF; color: #36393D; }
  133. #date_wrapper input { color: #36393D; background-color: #FFFFFF; height: 16px; text-align: center; margin-top: 4px; border: none; }
  134. #date_wrapper input[type=button] { background-color: #36393D; color: #CCE698; margin-top: 6px; }
  135. -->
  136. </style>
  137. </head>
  138. <body onLoad="setInterval('live_date()', 1000);">
  139. <div id="live">
  140. <fieldset>
  141. <legend>&nbsp;
  142. <div id="clock">&nbsp;</div>
  143. </legend>
  144. <div id="date_wrapper">
  145. <form name="date_items">&nbsp;&nbsp;<input name="date_container" type="text" size="28" />
  146. </form>
  147. </div>
  148. </fieldset>
  149. </div>
  150. </body>
  151. </html>
Code Snippet Comments
0
uringinteristi uringinteristi is offline Offline | Dec 28th, 2008
•
•
•
•
thank you
 
 

Quick Comment
•
•
•
•
•
•
•
•
Message:
•
•
•
•


Similar Threads
Thread Tools Search this Thread



ajax ajaxexample ajaxjspservlets array browser bug captcha captchaformproblem cart checkbox child class close codes cookies createrange() cursor date debugger dependent disablefirebug dom dropdown editor element embed engine enter events explorer ext file firefox form forms frameworks getselection google gxt hiddenvalue highlightedword hint html ie7 ie8 iframe images internet java javascript javascripthelp2020 jquery jsf jsfile jsp jump libcurl maps marquee masterpage math matrixcaptcha media menu object onerror onmouseoutdivproblem onreadystatechange parent paypal pdf php position post programming progressbar prototype rated redirect runtime safari scale scriptlets scroll search security session shopping size software star stars synchronous toggle unicode variables web webservice wysiwyg \n
About Us | Contact Us | Advertise | DaniWeb | Acceptable Use Policy | RSS Feed

©2003 - 2009 DaniWeb® LLC