Last active
November 22, 2020 00:02
-
-
Save davidfcarr/849c64f3ddd14d002775ef75dbd8dc08 to your computer and use it in GitHub Desktop.
This file contains hidden or 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
<!DOCTYPE html> | |
<html lang="en-US" class="no-js no-svg"> | |
<head> | |
<meta charset="UTF-8"> | |
<title>Timezone Conversion Demo</title> | |
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> | |
</head> | |
<body> | |
<h3 class="dateblock"><span class="event-date">Saturday December 5, 2020</span> <span class="event_time">8:15 AM</span> EST</span></h3> | |
<div id="timezone_converted"></div> | |
<div class="rsvpcalendar_buttons"><button class="timezone_on" datetime="2020-12-05 08:15:00" timezone="EST">Show in my timezone</button></div> | |
<p>Click the button above to see the times converted for your timezone (based on your computer clock).</p> | |
<figure class="tz-table2"> | |
<table><tbody> | |
<tr><td>PST</td><td>EST</td><td>UTC</td><td>Event</td><td>Coordinators</td></tr> | |
<tr><td>5:15 AM</td><td>8:15 AM</td><td>1:15 PM</td><td>Warm up / Entry into event</td><td>Nik Lakhani</td></tr> | |
<tr><td>6:00 AM</td><td>9:00 AM</td><td>2:00 PM</td><td>Welcome to VTM Conference</td><td>Lois Margolin DTM / Nik Lakhani</td></tr> | |
<tr><td>6:10 AM</td><td>9:10 AM</td><td>2:10 PM</td><td><a href="https://vtm.toastmost.org/speaker-linda-marie-miller/">WORKSHOP – Linda-Marie Miller</a></td><td>Mathilde Fischer DTM</td></tr> | |
<tr><td>7:00 AM</td><td>10:00 AM</td><td>3:00 PM</td><td>Break</td><td></td></tr> | |
<tr><td>7:15 AM</td><td>10:15 AM</td><td>3:15 PM</td><td><a href="https://vtm.toastmost.org/rsvpmaker/evaluation-contest/">Evaluation Contest</a></td><td>Carol Prahinski DTM PID / Lukas Calafell</td></tr> | |
<tr><td>8:45 AM</td><td>11:45 AM</td><td>4:45 PM</td><td>Break</td><td></td></tr> | |
<tr><td>9:00 AM</td><td>12:00 PM</td><td>5:00 PM</td><td>Result and Interview with Winner</td><td>Carol Prahinski, DTM PID</td></tr> | |
<tr><td>9:05 AM</td><td>12:05 PM</td><td>5:05 PM</td><td><a href="https://vtm.toastmost.org/roger-courville/">WORKSHOP – Roger Courville</a></td><td>Mac Whyte</td></tr> | |
<tr><td>9:55 AM</td><td>12:55 PM</td><td>5:55 PM</td><td>Break</td><td></td></tr> | |
<tr><td>10:10 AM</td><td>1:10 PM</td><td>6:10 PM</td><td><a href="https://vtm.toastmost.org/speaker-derrick-trimble/">WORKSHOP – Derrick Trimble</a></td><td>Louis Brown DTM</td></tr> | |
<tr><td>11:00 AM</td><td>2:00 PM</td><td>7:00 PM</td><td>Break</td><td></td></tr> | |
<tr><td>11:15 AM</td><td>2:15 PM</td><td>7:15 PM</td><td><a href="https://vtm.toastmost.org/rsvpmaker/table-topics-contest/">Table Topics Contest</a></td><td>Carol Prahinski DTM PID / Lukas Calafell</td></tr> | |
<tr><td>12:15 PM</td><td>3:15 PM</td><td>8:15 PM</td><td>Break</td><td></td></tr> | |
<tr><td>12:30 PM</td><td>3:30 PM</td><td>8:30 PM</td><td>Result and Interview with Winner</td><td>Carol Prahinski, DTM PID</td></tr> | |
<tr><td>12:35 PM</td><td>3:35 PM</td><td>8:35 PM</td><td><a href="https://vtm.toastmost.org/speaker-fursey-gotuaco/">WORKSHOP – Fursey Gotuaco</a></td><td>Natalie Thomas</td></tr> | |
<tr><td>1:25 PM</td><td>4:25 PM</td><td>9:25 PM</td><td>Break</td><td></td></tr> | |
<tr><td>1:40 PM</td><td>4:40 PM</td><td>9:40 PM</td><td><a href="https://vtm.toastmost.org/marquesa-pettway-discover-your-zoom-speaker-brand/">WORKSHOP – Marquesa Pettway</a></td><td>Ilda Kuleba</td></tr> | |
<tr><td>3:30 PM</td><td>5:30 PM</td><td>10:30 PM</td><td>Thanks and credits</td><td>Lois Margolin DTM / Nik Lakhani</td></tr> | |
<tr><td>3:40 PM</td><td>5:40 PM</td><td>10:40 PM</td><td>END OF EVENT</td><td></td></tr> | |
</tbody></table> | |
</figure> | |
<script> | |
$('.timezone_on').click( function () { | |
var datetime = $(this).attr('datetime'); | |
var event_tz = $(this).attr('timezone'); | |
var localdate = new Date(datetime+' '+event_tz); | |
localstring = localdate.toString(); | |
$('#timezone_converted').html(localstring); | |
var match = localstring.match(/\(([^)]+)/); | |
var timeparts = datetime.split(' '); | |
var newtime; | |
var timecount = 0; | |
$('.tz-convert, .tz-convert table tr td, .tz-table1 table tr td:first-child, .tz-table2 table tr td:nth-child(2), .tz-table3 table tr td:nth-child(3)').each( | |
function () { | |
celltime = this.innerHTML.replace(' ',' '); | |
//if celltime contains time but not more html | |
if((celltime.search(/\d:\d\d/) >= 0) && (celltime.search('<') < 0)) { | |
timecount++; | |
newtime = timeparts[0]+' '+celltime+' '+event_tz; | |
console.log(newtime); | |
ts = Date.parse(newtime); | |
if(!Number.isNaN(ts)) //verify string parses to time | |
{ | |
localdate.setTime(ts); | |
newtime = localdate.toLocaleTimeString().replace(':00 ',' ');//get time for user's locale, stripping off seconds | |
this.innerHTML = newtime; | |
$(this).css('font-weight','bold'); | |
} | |
} | |
} | |
);//end tz_convert each | |
var checkrow = true; | |
$('.tz-table1 table tr td:first-child, .tz-table2 table tr td:nth-child(2), .tz-table3 table tr td:nth-child(3)').each( | |
function() { | |
if(checkrow && (this.innerHTML != '') && (this.innerHTML.search(':') < 0) ) // if this looks like a column header | |
this.innerHTML = '<strong>Your TZ</strong>'; | |
checkrow = false; | |
} | |
); | |
}); | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment