var punches, punchList, listLength, object; function isItArray(object) { console.log(`is ${object} Array = ${Array.isArray(object)}`); // return Array.isArray(object); } function putJson(data) { let req = new XMLHttpRequest(); req.onreadystatechange = () => { if (req.readyState == XMLHttpRequest.DONE) { document.getElementById("result").innerHTML = new Date().getTime() + " - " + req.status; getJson(genList); } }; req.open("PUT", jsonUrl, true); req.setRequestHeader("Content-type", "application/json"); req.send(data); } function getJson(callback) { console.log(`getJson`); let req = new XMLHttpRequest(); req.onreadystatechange = () => { if (req.readyState == XMLHttpRequest.DONE) { window.punches = JSON.parse(req.responseText); window.punches.sort(function(a, b){return a.priority - b.priority}); callback(window.punches); } }; req.open("GET", jsonUrl, true); req.send(); } function genList(punchList) { console.log(`inside gen list `); disableElement("punchDetail"); enableElement("punchList"); var itemStyle = "punches"; isItArray(punchList); // punchList.sort(function(a, b){return new Date(a.date).getTime() - new Date(b.date).getTime()}); listLength = punchList.length; list = ""; for (i = 0; i < listLength; i++) { list += ""; } list += "
Punch ItemStatusPriorityAction
" + punchList[i].subject + "" + punchList[i].progress + "" + punchList[i].priority + "start | done | edit | delete
"; document.getElementById("punchList").innerHTML = list; } function startPunch(item) { var punchList = window.punches; punchList[item].progress = "In Progress"; jsonStr = JSON.stringify(punchList); putJson(jsonStr); } function completePunch(item) { var punchList = window.punches; punchList[item].progress = "Done"; jsonStr = JSON.stringify(punchList); putJson(jsonStr); } function enablePunchDetail(item) { var punchList = window.punches; console.log(`inside enablePunchDetail`); disableElement("punchList"); console.log(`punchList Disabled`); enableElement("punchDetail"); console.log(`punchDetail Enabled`); // html = ""; html = "

subject: " + punchList[item].subject + "
Created: " + punchList[item].cDate + "
Modified Date: " + punchList[item].mDate + "
Priority: " + punchList[item].priority + "
Progress: " + punchList[item].progress + "

"; document.getElementById("punchDetail").innerHTML = html; } function createNewEvent() { // console.log(`${punchList}`); // console.log(`${window.punches}`); // disableElement("punchList"); // disableElement("punchDetail"); punchList = window.punches; var subjectField = document.getElementById("newSubject").value; var priorityField = document.getElementById("newPriority").value; var progressField = document.getElementById("newProgress").value; var nDateField = document.getElementById("timepickerCreate").value; var notesField = document.getElementById("newNotes").value; var newEventJson = { nDate: nDateField, subject: subjectField, priority: priorityField, progress: progressField, notes: notesField }; punchList.push(newEventJson); jsonStr = JSON.stringify(punchList); putJson(jsonStr); disableElement("newEvent"); enableElement("punchList"); // document.getElementById("newEventList").innerHTML = jsonStr; } function deletePunch(item) { // console.log(`${punchList}`); // console.log(`${window.punches}`); punchList = window.punches; console.log(`splicing ${item}`); punchList.splice(item, 1); jsonStr = JSON.stringify(punchList); putJson(jsonStr); // document.getElementById("newEventList").innerHTML = jsonStr; } function enableElement(element) { console.log(`enabling ${element}`); document.getElementById(element).style.display = "block"; } function disableElement(element) { console.log(`disabling ${element}`); document.getElementById(element).style.display = "none"; }