daily pastebin goal
35%
SHARE
TWEET

Untitled

a guest Feb 13th, 2018 71 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <title>Clock Widget 3</title>
  5.         <script>
  6. var hour = 0;
  7. var min = 0;
  8. var sec = 0;
  9. var year = 0;
  10. var month = 0
  11. var dayte = 0;
  12. var day = 0;
  13.  
  14. var days = ['Sun','Mon','Tue','Wed','Thr','Fri','Sat'];
  15. var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
  16.  
  17. function checkSize() {
  18.     var html = document.documentElement;
  19.     var divT = document.getElementById("theTime");
  20.     var divD = document.getElementById("theDate");
  21.    
  22.     // Assign font-size first to set div sizes.
  23.     divT.style.fontSize = Math.floor(html.clientHeight / 2.5) + "px";
  24.     divD.style.fontSize = Math.floor(html.clientHeight / 5) + "px";
  25.    
  26.     // Calculate horizontal spacing.
  27.     var divTX = Math.floor((html.clientWidth - divT.offsetWidth) / 2);
  28.     var divDX = Math.floor((html.clientWidth - divD.offsetWidth) / 2);
  29.    
  30.     // Calculate vertical spacing.
  31.     var divTY = Math.floor((html.clientHeight - (divT.offsetHeight+divD.offsetHeight)) / 2);
  32.     var divDY = divTY + divT.offsetHeight;
  33.  
  34.     // Assign positions to the two div elements.
  35.     divT.style.top = divTY + "px";
  36.     divT.style.left = divTX + "px";
  37.     divD.style.top = divDY + "px";
  38.     divD.style.left = divDX + "px";
  39. }
  40.  
  41. function setupPage() {
  42.     timerMinuteTick();
  43.     checkSize();
  44.     setInterval(timerSecondTick, 1000);
  45. }
  46.  
  47. function timerSecondTick() {
  48.     sec = sec + 1;
  49.    
  50.     if (sec == 60) {
  51.         timerMinuteTick();
  52.     } else {
  53.         updateClock();
  54.     }
  55. }
  56.  
  57. function timerMinuteTick() {
  58.     var d = new Date();
  59.     hour = d.getHours();
  60.     min = d.getMinutes();
  61.     sec = d.getSeconds();
  62.     year = d.getFullYear();
  63.     month = d.getMonth();
  64.     dayte = d.getDate();
  65.     day = d.getDay();
  66.     updateClock();
  67. }
  68.  
  69. function updateClock() {
  70.     var time = formatSegment(hour)+":"+formatSegment(min)+":"+formatSegment(sec);
  71.     var date = days[day]+", "+months[month]+" "+dayte+", "+year;
  72.    
  73.     var spanT = document.getElementById("theTime");
  74.     var spanD = document.getElementById("theDate");
  75.    
  76.     spanT.innerHTML = time;
  77.     spanD.innerHTML = date;
  78. }
  79.  
  80. function formatSegment(nmbr) {
  81.     if (nmbr < 10) {
  82.         return "0"+nmbr;
  83.     } else {
  84.         return ""+nmbr;
  85.     }
  86. }
  87.         </script>
  88.         <style>
  89. body { margin: 0px; background-color: #000000; color: #ffffff; }
  90. div { magin: auto; text-align: center; position: absolute; }
  91.         </style>
  92.     </head>
  93.     <body onresize="checkSize()" onload="setupPage()">
  94.         <div id="theTime"></div>
  95.         <div id="theDate"></div>
  96.     </body>
  97. </html>
RAW Paste Data
Top