Line 314: | Line 314: | ||
</script> | </script> | ||
+ | |||
+ | <!-- COUNTDOWN --> | ||
+ | <div id="kyoto_alert">count down</div> | ||
+ | <style type="text/css"> | ||
+ | #kyoto_alert { | ||
+ | position: fixed; | ||
+ | top: 30px; | ||
+ | right: 10px; | ||
+ | height: 30px; | ||
+ | width: 300px; | ||
+ | padding: 30px 10px; | ||
+ | display: none; | ||
+ | |||
+ | /* text */ | ||
+ | line-height: 30px; | ||
+ | font-size: 30px; | ||
+ | font-family: sans-serif; | ||
+ | text-align: center; | ||
+ | text-decoration: none; | ||
+ | |||
+ | /* color */ | ||
+ | background-color: #aaa; | ||
+ | border: 4px solid #888; | ||
+ | color: #eee; | ||
+ | |||
+ | /* box sizing */ | ||
+ | box-sizing: content-box; | ||
+ | -webkit-box-sizing: content-box; | ||
+ | -moz-box-sizing: content-box; | ||
+ | |||
+ | /* border radius */ | ||
+ | border-radius: 20px; | ||
+ | -webkit-border-radius: 20px; | ||
+ | -moz-border-radius: 20px; | ||
+ | |||
+ | /* select cancel */ | ||
+ | user-select: none; | ||
+ | -webkit-user-select: none; | ||
+ | -moz-user-select: none; | ||
+ | -khtml-user-select: none; | ||
+ | } | ||
+ | </style> | ||
+ | <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> | ||
+ | <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/jquery-ui.min.js"></script> | ||
+ | <script> | ||
+ | $(function(){ | ||
+ | |||
+ | /* October 17 wiki FREEZE at 12:00PM EDT */ | ||
+ | var year = 2016; | ||
+ | var month = 10; | ||
+ | var day = 19; | ||
+ | var freeze = Date.UTC(year, month-1, day, 4, 00, 0); | ||
+ | |||
+ | function get_current_utc() { | ||
+ | var date = new Date(); | ||
+ | return Date.UTC( | ||
+ | date.getUTCFullYear(), | ||
+ | date.getUTCMonth(), | ||
+ | date.getUTCDate(), | ||
+ | date.getUTCHours(), | ||
+ | date.getUTCMinutes(), | ||
+ | date.getUTCSeconds() | ||
+ | ); | ||
+ | } | ||
+ | |||
+ | /* | ||
+ | * return array of the quoteient and remainder | ||
+ | */ | ||
+ | function qr(dividend, divisor) { | ||
+ | return [Math.floor(dividend/divisor), | ||
+ | dividend%divisor]; | ||
+ | } | ||
+ | |||
+ | function repeat_str(str, n) { | ||
+ | var retval = ''; | ||
+ | for (var i = 0; i < n; i++) { | ||
+ | retval += str; | ||
+ | } | ||
+ | return retval; | ||
+ | } | ||
+ | |||
+ | /* | ||
+ | * transfer Integer to String | ||
+ | */ | ||
+ | function itos(number, figures) { | ||
+ | return [repeat_str('0', figures-1),number] | ||
+ | .join('').slice(-figures); | ||
+ | } | ||
+ | |||
+ | var timer = setInterval(function() { | ||
+ | //var countdown = document.getElementById("kyoto_alert"); | ||
+ | var $countdown = $("#kyoto_alert"); | ||
+ | var current_utc = get_current_utc(); | ||
+ | var interval = (freeze - current_utc)/1000; | ||
+ | if (interval < 0) { | ||
+ | $countdown.hide(); | ||
+ | } else if (interval < 4 * 24 * 3600) { | ||
+ | if (interval < 1 * 3600) | ||
+ | $countdown.css("color", "#f00"); | ||
+ | else if (interval < 24 * 3600) | ||
+ | $countdown.css("color", "#ff0"); | ||
+ | |||
+ | var time = []; | ||
+ | var second_qr = qr(interval, 60); | ||
+ | time.push(itos(second_qr[1], 2) + 's'); | ||
+ | var minute_qr = qr(second_qr[0], 60); | ||
+ | time.push(itos(minute_qr[1], 2) + 'm'); | ||
+ | time.push(itos(minute_qr[0], 2) + 'h'); | ||
+ | $countdown.text(time.reverse().join(' : ')); | ||
+ | $countdown.show(); | ||
+ | } else { | ||
+ | var time = []; | ||
+ | interval = Math.floor(interval / 60); | ||
+ | var minute_qr = qr(interval, 60); | ||
+ | time.push(itos(minute_qr[1], 2) + 'm'); | ||
+ | var hour_qr = qr(minute_qr[0], 24); | ||
+ | time.push(itos(hour_qr[1], 2) + 'h'); | ||
+ | time.push(itos(hour_qr[0], 3) + 'd'); | ||
+ | $countdown.text(time.reverse().join(' : ')); | ||
+ | $countdown.show(); | ||
+ | } | ||
+ | }, 200); | ||
+ | |||
+ | $("#kyoto_alert").draggable(); | ||
+ | |||
+ | }); | ||
+ | </script> | ||
+ | |||
</html> | </html> |
Revision as of 09:44, 12 October 2016
count down