diff --git a/punch_list/css/custom.css b/punch_list/css/custom.css index beb951a..f09cc05 100644 --- a/punch_list/css/custom.css +++ b/punch_list/css/custom.css @@ -395,12 +395,14 @@ textarea { display: block; margin-top: 100px; margin-left: auto; - width: 25%; + width: 20%; height: 99%; background-color: #000; overflow: hidden; float: left; border-right: 3px solid #000; } - .column-right { display: block; width: 25%; overflow: hidden; float: left;} + .column-middle { display: block; width: 50%; overflow: hidden; float: left;} + .column-right { display: block; width: 25%; overflow: hidden; float: left; padding-top: 100px;} + #events-list { background-color: #000; } } diff --git a/punch_list/eventsList.js b/punch_list/eventsList.js new file mode 100644 index 0000000..e20707d --- /dev/null +++ b/punch_list/eventsList.js @@ -0,0 +1,218 @@ +var initialized = false; + +function getEvents() { + let req = new XMLHttpRequest(); + + req.onreadystatechange = () => { + console.log(`${req.readyState}`); + console.log(`${XMLHttpRequest.DONE}`); + if (req.readyState == XMLHttpRequest.DONE) { + console.log(`request done`); + let dataLoad = true; + window.eventsList = JSON.parse(req.responseText); + window.eventsLength = eventsList.length; + main(window.eventsList, dataLoad, window.eventsLength); + } + }; + req.open("GET", btJsonUrl , true); + req.send(); +} + +//sleep function +function sleep(delay) { + var start = new Date().getTime(); + while (new Date().getTime() < start + delay); +} + +function selectEvent(id) { + var events = window.eventsList; + console.log(`inside selectEvent()`); + + currentObject = id; + array_counter = id; + currentDate = events[currentObject].date; + currentSubject = events[currentObject].subject; + currentStart = currentDate; + currentEnd = nextDate; + nextObject = array_counter + 1; + if (nextObject >= window.eventsLength) { + nextStart = ""; + nextEnd = ""; + nextDate = ""; + nextSubject = "End"; + notes = ""; + } else { + nextStart = nextDate; + nextEnd = events[nextObject].date; + nextDate = events[nextObject].date; + nextSubject = events[nextObject].subject; + notes = events[currentObject].notes; + } + + countDownDate = new Date(nextDate).getTime(); + currentTimer = new Date(currentDate).getTime(); +} + +function incArray() { + var events = window.eventsList; + console.log("inside incArray"); + console.log(`array_counter = ${array_counter}`); + console.log(`window.eventsLength = ${window.eventsLength}`); + console.log(`events = ${events}`); + if (array_counter < window.eventsLength) { + array_counter++; + } + selectEvent(array_counter); +} + +function decArray() { + var events = window.eventsList; + console.log("inside decArray"); + console.log(`array_counter = ${array_counter}`); + console.log(`window.eventsLength = ${window.eventsLength}`); + console.log(`events = ${events}`); + + if (array_counter > 0) { + array_counter--; + } + selectEvent(array_counter); +} + +function genEventList() { + list = ""; + + var events = window.eventsList; + + if (window.eventsLength > 30) { + var listLength = 30; + var page = true; + } else { + var listLength = window.eventsLength; + } + + var count_to_end = window.eventsLength - array_counter; + + for (i = 0; i < listLength; i++) { + if (i === array_counter) { + eventStyle = "events-current"; + cdFunction = countdown(events[i].date, events[i + 1], "current"); + } else { + eventStyle = "events"; + cdFunction = countdown(events[i].date, "", "next"); + } + + counter_diff = i - array_counter; + + if (counter_diff < -2) { + list += ''; + if (listLength < window.eventsLength) { + listLength++; + } + } else { + list += ""; + } + } + + list += "
EventTimeTime Until
" + events[i].subject + "" + events[i].date + "" + cdFunction + "
"; + + return list; +} + +function main(array, dataLoad, aLen) { + var x = setInterval(function() { + document.getElementById("events-list").innerHTML = genEventList(); + }, 1000); +} + +var style = "green"; // reset style + +function countdown(targetDate, nextDate, current) { + var countDownDate = new Date(targetDate).getTime(); + var now = new Date().getTime(); + var distance = countDownDate - now; + + if (current === "current") { + var nextCountDownDate = new Date(nextDate).getTime(); + var nextDistance = nextCountDownDate - now; + var nextDays = Math.floor(nextDistance / (1000 * 60 * 60 * 24)); + var nextHours = Math.floor((nextDistance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); + var nextMinutes = Math.floor((nextDistance % (1000 * 60 * 60)) / (1000 * 60)); + var nextSeconds = Math.floor((nextDistance % (1000 * 60)) / 1000); + } + + var days = Math.floor(distance / (1000 * 60 * 60 * 24)); + var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); + var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60)); + var seconds = Math.floor((distance % (1000 * 60)) / 1000); + +// set style for countdown based on remaining time + style = "green"; // reset style + + if (current === "current") { + style = 'current'; + } else { + if (days < 1 && hours < 1) { + if (minutes < 0) { + style = 'over'; + } else if (minutes < 15) { + style = 'warn'; + } else { + style = 'green'; + } + } + } + + if (days < 0) { + days = (-days); + days--; + } + +// Day or Days? + if (days > 0) { + if (days === 1){ + rDays = (days + ' Day '); + } else { + rDays = (days + ' Days '); + } + } else { + rDays = ''; + } + +// pad single digits with a '0' prefix +// when time is out, start counting up by inverting + if (hours < 0) { + hours = (-hours); + hours--; + } + if (hours < 10 && hours >= 0) { + hours = ('0' + hours); + } + + if (minutes < 0) { + minutes = (-minutes); + minutes--; + } + if (minutes < 10 && minutes >= 0) { + minutes = ('0' + minutes); + } + + if (seconds < 0) { + seconds = (-seconds); + seconds--; + } + if (seconds < 10 && seconds >= 0) { + seconds = ('0' + seconds); + } + + if (initialized === false && distance < 0) { + incArray(); + } else if (initialized === false) { + initialized = true; + decArray(); + } + + var r = "
" + rDays + hours + ":" + minutes + ":" + seconds + "
"; + return r; +} + + diff --git a/punch_list/index.html b/punch_list/index.html index 6fda90b..8db2e38 100644 --- a/punch_list/index.html +++ b/punch_list/index.html @@ -12,6 +12,7 @@ + @@ -27,7 +28,7 @@ - +