Last active
October 2, 2015 09:18
-
-
Save robertpateii/2217636 to your computer and use it in GitHub Desktop.
We had a page that said "Come back in the morning for the live stream!". Obviously that text should go away when the stream starts. Unfortunately the stream starts around 3am (9am in Amsterdam). So I wrote this JavaScript to do it for me, and I'm sure I'll need this next year too.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <head> | |
| <style type="text/css"> | |
| div#livestream { | |
| width:560px; | |
| margin:0 auto; | |
| } | |
| div#comeback { | |
| background:url('/~/media/Images/Generic-Stream-Placeholder.ashx') no-repeat center center; | |
| width:560px; | |
| height:336px; | |
| margin:0 auto; | |
| } | |
| div#comeback p { | |
| color:white; | |
| font-size:22px; | |
| text-align:center; | |
| padding:28% 0; | |
| } | |
| </style> | |
| <script type="text/javascript"> | |
| // jquery ready function | |
| jQuery(function() { | |
| // #comeback should disappear at 9am CET (UTC + 1) and reappear at 6pm CET and never re-appear | |
| // once the show is over (Feb 6th is last day). | |
| var streamIsOn = (function () { | |
| var streamStartDate = new Date(Date.UTC(2014,1,4,8,0,0,0)); // February 4, 2014 08:00:00 9am CET = 8am UTC | |
| var streamEndDate = new Date(Date.UTC(2014,1,6,17,0,0,0)); // February 6, 2014 17:00:00 6pm CET = 5pm UTC | |
| var currentDate = new Date(); | |
| // If ISE has't started, stream is not on. | |
| if (currentDate < streamStartDate) { | |
| return false; | |
| } | |
| // If ISE is over, the stream is not on. | |
| if (currentDate > streamEndDate) { | |
| return false; | |
| } | |
| // This statement will only run if it's during the 3 days of ISE. | |
| // Check if it's within 8am to 5pm, if so then stream is on. | |
| if (currentDate.getUTCHours() >= streamStartDate.getUTCHours() && currentDate.getUTCHours() < streamEndDate.getUTCHours()) { | |
| return true; | |
| } | |
| else { | |
| return false; | |
| } | |
| })(); | |
| var iseIsOver = (function () { | |
| var streamEndDate = new Date(Date.UTC(2014,1,6,17,0,0,0)); // February 6, 2014 17:00:00 6pm CET = 5pm UTC | |
| var currentDate = new Date(); | |
| if (currentDate > streamEndDate) { | |
| return true; | |
| } | |
| else return false; | |
| })(); | |
| if (streamIsOn === true) { | |
| jQuery("#comeback").css("display","none"); | |
| } else { | |
| jQuery("#livestream").css("display","none"); | |
| } | |
| if (iseIsOver === true) { | |
| jQuery("#comeback p").text("Thanks for watching the live stream! See you next year."); | |
| jQuery("#livestream").css("display","none"); | |
| } | |
| }); // end jQuery ready function. | |
| </script> | |
| </head> | |
| <body> | |
| <h1>Live Stream</h1> | |
| <div id="comeback"> | |
| <p>Come back on Feb 4th at 9am CET for the live stream!.</p> | |
| </div> | |
| <div id="livestream" style="display: none;"> | |
| </div> | |
| </body> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment