From 5d2f42acba6b1ac3c6f1e0de69aa7f5ba4fab217 Mon Sep 17 00:00:00 2001 From: Jimmy C Date: Sat, 22 Dec 2018 16:48:43 +1100 Subject: [PATCH 1/3] Added input boxes --- Arduino/BTCDieselHeater/src/WiFi/mainpage.cpp | 120 ++---------------- 1 file changed, 14 insertions(+), 106 deletions(-) diff --git a/Arduino/BTCDieselHeater/src/WiFi/mainpage.cpp b/Arduino/BTCDieselHeater/src/WiFi/mainpage.cpp index 58b76e1..06bb2a1 100644 --- a/Arduino/BTCDieselHeater/src/WiFi/mainpage.cpp +++ b/Arduino/BTCDieselHeater/src/WiFi/mainpage.cpp @@ -108,6 +108,10 @@ const char* MAIN_PAGE PROGMEM = R"=====( } } +function setSchedule(){ +//clearly need to add some code here to send the Json formatted data to the esp + console.log("Set Schedule Button Press") +} function sendJSONobject(obj){ var str = JSON.stringify(obj); console.log("JSON Tx:", str); @@ -136,110 +140,6 @@ function setcurrentdate(){ } -// Date Picker Script - -window.onload = function() { - // IE11 forEach, padStart - (function () { - if ( typeof NodeList.prototype.forEach === "function" ) return false; - NodeList.prototype.forEach = Array.prototype.forEach; - })(); - - (function () { - if ( typeof String.prototype.padStart === "function" ) return false; - String.prototype.padStart = function padStart(length, value) { - var res = String(this); - if(length >= (value.length + this.length)) { - for (var i = 0; i <= (length - (value.length + this.length)); i++) { - res = value + res; - } - } - return res; - }; - })(); - - var datePickerTpl = '
{y}-{m}
12345678910111213141516171819202122232425262728293031'; - - function daysInMonth(month, year) { - return new Date(year, month, 0).getDate(); - } - - function hideInvalidDays(dp, month, year){ - dp.querySelectorAll(".days a").forEach(function(a){ - a.style.display = "inline-block"; - }); - var days = daysInMonth(month, year); - var invalidCount = 31 - days; - if(invalidCount > 0) { - for (var j = 1; j <= invalidCount; j++) { - dp.querySelector(".days a:nth-last-child(" + j + ")").style.display = "none"; - } - } - } - - function clearSelected(dp) { - dp.querySelectorAll(".days a.selected").forEach(function(e){ - e.classList.remove("selected"); - }); - } - - function setMonthYear(dp, month, year, input) { - dp.querySelector(".month").textContent = String(month).padStart(2, "0"); - dp.querySelector(".year").textContent = year; - clearSelected(dp); - hideInvalidDays(dp, month, year); - if(input && input.value) { - var date = input.value.split("-"); - var curYear = parseInt(dp.querySelector(".year").textContent), curMonth = parseInt(dp.querySelector(".month").textContent); - if(date[0] == curYear && date[1] == curMonth) { - dp.querySelector(".days a:nth-child(" + parseInt(date[2]) + ")").className = "selected"; - } - } - } - - document.querySelectorAll(".datepicker").forEach(function(input) { - input.setAttribute("readonly", "true"); - var dp = document.createElement("div"); - dp.className = "contextmenu"; - dp.style.left = input.offsetLeft + "px"; - dp.style.top = input.offsetTop + input.offsetHeight + "px"; - var now = new Date(); - dp.insertAdjacentHTML('beforeEnd', datePickerTpl.replace("{m}", String(now.getMonth() + 1).padStart(2, "0")).replace("{y}", now.getFullYear())); - hideInvalidDays(dp, now.getMonth() + 1, now.getFullYear()); - - dp.querySelector("a.previous").addEventListener("click", function(e){ - var curYear = parseInt(dp.querySelector(".year").textContent), curMonth = parseInt(dp.querySelector(".month").textContent); - var firstMonth = curMonth - 1 == 0; - setMonthYear(dp, firstMonth ? 12 : curMonth - 1, firstMonth ? curYear - 1 : curYear, input); - }); - - dp.querySelector("a.next").addEventListener("click", function(e){ - var curYear = parseInt(dp.querySelector(".year").textContent), curMonth = parseInt(dp.querySelector(".month").textContent); - var lastMonth = curMonth + 1 == 13; - setMonthYear(dp, lastMonth ? 1 : curMonth + 1, lastMonth ? curYear + 1 : curYear, input); - }); - - dp.querySelectorAll(".days a").forEach(function(a){ - a.addEventListener("click", function(e) { - clearSelected(dp); - e.target.className = "selected"; - input.value = dp.querySelector(".year").textContent + "-" + dp.querySelector(".month").textContent + "-" + this.text.padStart(2, "0"); - }); - }); - - input.parentNode.insertBefore(dp, input.nextSibling); - - input.addEventListener("focus", function(){ - if (input.value){ - var date = input.value.split("-"); - setMonthYear(dp, date[1], date[0]); - dp.querySelector(".days a:nth-child(" + parseInt(date[2]) + ")").className = "selected"; - } - }); - }); -}; -// End date Picker Script - function funcNavLinks() { var x = document.getElementById("myLinks"); if (x.style.display === "block") { @@ -607,8 +507,16 @@ Advanced Settings Current Time (24 Hour Format):
-
-

+
+

+Mon:
+Tue:
+Wed:
+Thu:
+Fri:
+Sat:
+Sun:
+
From d378d902ac454277ff90f838fc4f0cd802dcd4d7 Mon Sep 17 00:00:00 2001 From: Jimmy C Date: Sun, 23 Dec 2018 02:27:17 +1100 Subject: [PATCH 2/3] Added date picker and time setup input boxes Added two start and stop timers - No code attached - Simply UI at this stage --- Arduino/BTCDieselHeater/src/WiFi/mainpage.cpp | 553 +++++++++--------- 1 file changed, 279 insertions(+), 274 deletions(-) diff --git a/Arduino/BTCDieselHeater/src/WiFi/mainpage.cpp b/Arduino/BTCDieselHeater/src/WiFi/mainpage.cpp index 06bb2a1..03440c7 100644 --- a/Arduino/BTCDieselHeater/src/WiFi/mainpage.cpp +++ b/Arduino/BTCDieselHeater/src/WiFi/mainpage.cpp @@ -25,405 +25,415 @@ const char* MAIN_PAGE PROGMEM = R"=====( - - - - - -