JSFiddle - React, Tailwind, and code Playground
HTML
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.5.1/moment.min.js"></script>
<div id="console"></div>
JavaScript
function log(input) {
$("#console").append(input + "<br />");
}
//Define the Game's Time Frame
var Game = new Object(); // Object that holds all game data
var end = { // what time does the game end?
"moment": moment().days(6).hour(0).minute(0).second(0)
};
var beginning = { // what time does the game start?
"moment": moment().days(1).hour(0).minute(0).second(0)
};
// I'm going to over-do the commenting here for debugging:
function generateInnings() { // assign start and end times to each of 10 innings
var inning = new Object(); // create an inning object to assign start and end to
Game.innings = new Array(); // create array to assign each of 10 inning objects to
var gameHours = 120; // shortcut for calculating game time span
var inningHours = gameHours / 10; // ten innings in a game. how many hours each?
log("Inning Durations: <br> ---------------------------------------");
for (x = 0; x < 10; x++) { // for 10 intervals of x, generate each inning
inning.start = beginning.moment.add("hours", (inningHours * x)); //inning start?
inning.end = inning.start.add("hours", inningHours); // inning end?
Game.innings[x] = inning; // attach inning object to Game.innings array
log("Inning " + x + " Starts: " + inning.start.format("dddd, hh:mm A")); // JSFiddle Output
log("Inning " + x + " Ends: " + inning.end.format("dddd, hh:mm A")); // JSFiddle Output
}
}
generateInnings();
log("<br> Inning End Delays: <br> ---------------------------------------");
function popBoard() {
for (x = 0; x < 10; x++) {
// skipping handler for passed innings
// generating time until inning x should be ended
timeTillEnd = moment(Game.innings[x].start).diff(moment(), "milliseconds");
// carrying out the deed
setTimeout(function () {
//endInning(x)
}, timeTillEnd);
// logging results to viewport
log("Ending Inning "...