Last active
January 17, 2016 23:52
-
-
Save alwynallan/503a67f89d9121dc8c93 to your computer and use it in GitHub Desktop.
Javascript for IoT Clock Settings page. Page was too big for ESP8622 when it was included directly. Oops, can's serve .js out of a gist.
This file contains 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
| var xmlhttp = new XMLHttpRequest(); | |
| var url = "http://apa.hopto.org/tz_data.json"; // do we need the domain?? | |
| var tzArr; | |
| xmlhttp.onreadystatechange = function() { | |
| if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { | |
| tzArr = JSON.parse(xmlhttp.responseText); | |
| populateOptions(tzArr); | |
| } | |
| }; | |
| xmlhttp.open("GET", url, true); | |
| xmlhttp.send(); | |
| function friendly(region) { | |
| if (region == 'America') return 'Americas'; | |
| if (region == 'Atlantic' || region == 'Arctic' || region == 'Indian' || region == 'Pacific') | |
| return region + " Ocean"; | |
| return region; | |
| } | |
| function populateOptions(arr) { | |
| var out = "tz_data.json version: " + arr.version; | |
| document.getElementById('lead').innerHTML = out; | |
| var reg = document.getElementById('region'); | |
| //var matched = false; | |
| for(var i=0; i<arr.regions.length; i++){ | |
| appOp(reg, friendly(arr.regions[i].name), arr.regions[i].name); | |
| if(document.getElementById('set_region').value == arr.regions[i].name){ | |
| reg.value = arr.regions[i].name; // select this option | |
| //matched = true; | |
| } | |
| } | |
| appOp(reg, 'User Supplied TZ', 'User_TZ'); | |
| //if(matched) doRegion(); | |
| doRegion(); | |
| var srv = document.getElementById('server_ddl'); | |
| var matched = false; | |
| for(var i=0; i<arr.servers.length; i++){ | |
| appOp(srv, arr.servers[i].name, arr.servers[i].name); | |
| if(arr.servers[i].name == document.getElementById('server').value) { | |
| srv.value = arr.servers[i].name; | |
| document.getElementById('server').value = ""; | |
| matched = true; | |
| } | |
| } | |
| appOp(srv, 'Other...', 'txt'); | |
| if ( !matched ) { | |
| document.getElementById('server_txt').value = document.getElementById('server').value; | |
| document.getElementById('server_txt').style.display = ""; | |
| document.getElementById('server').value = ""; | |
| document.getElementById('server_ddl').value = "txt"; | |
| } | |
| } | |
| function DropDownChanged(oDDL) { | |
| var oTextbox = oDDL.form.elements["server_txt"]; | |
| if (oTextbox) { | |
| oTextbox.style.display = (oDDL.value == "txt") ? "" : "none"; | |
| if (oDDL.value == "") | |
| oTextbox.focus(); | |
| } | |
| } | |
| function FormSubmit(oForm) { | |
| var oHidden = oForm.elements["server"]; | |
| var oDDL = oForm.elements["server_ddl"]; | |
| var oTextbox = oForm.elements["server_txt"]; | |
| if (oHidden && oDDL && oTextbox) | |
| oHidden.value = (oDDL.value == "txt") ? oTextbox.value : oDDL.value; | |
| } | |
| function say_hi() { | |
| document.getElementById('lag').innerHTML = 'Lag paragraph.'; // can put the HTML of our choice in this <p> | |
| doRegion(); // attempt to get displayed after settings change | |
| doZone(); | |
| DropDownChanged(document.getElementById('server_ddl')); | |
| } | |
| function doRegion() { | |
| //var x = document.getElementById('region').value; | |
| var reg_i = document.getElementById('region').selectedIndex - 1; | |
| var zon = document.getElementById('zone'); | |
| clrOps(zon); // in case the user changes zone | |
| zon.selectedIndex = 0; // -- select -- | |
| if (0 <= reg_i && reg_i < tzArr.regions.length) { | |
| for(var i=0; i < tzArr.regions[reg_i].zones.length; i++){ | |
| appOp(zon, tzArr.regions[reg_i].zones[i].name, tzArr.regions[reg_i].zones[i].name); | |
| if(document.getElementById('set_zone').value == tzArr.regions[reg_i].zones[i].name){ | |
| zon.value = tzArr.regions[reg_i].zones[i].name; // select it | |
| } | |
| } | |
| doZone(); // fill tz_string | |
| document.getElementById('zone_div').style.display = 'inline'; | |
| document.getElementById('tz_div').style.display = 'none'; | |
| } // if | |
| else if (reg_i > 0) { // must be TZ | |
| document.getElementById('tz_div').style.display = 'inline'; | |
| document.getElementById('zone_div').style.display = 'none'; | |
| } | |
| } | |
| function doZone() { | |
| var reg_i = document.getElementById('region').selectedIndex - 1; | |
| var zon_i = document.getElementById('zone').selectedIndex - 1; | |
| var tz = document.getElementById('tz_string'); | |
| if (0 <= reg_i && reg_i < tzArr.regions.length) { | |
| if (0 <= zon_i && zon_i < tzArr.regions[reg_i].zones.length) { | |
| tz.value = tzArr.regions[reg_i].zones[zon_i].tz; | |
| } | |
| } | |
| } | |
| function clrOps(sel) { | |
| var len, par; | |
| len = sel.options.length; | |
| for (var i = len; i > 1; i--) { // leaves first option | |
| par = sel.options[i - 1].parentNode; | |
| par.removeChild(sel.options[i - 1]); | |
| } | |
| } | |
| function appOp(sel, txt, val) { | |
| var opt = document.createElement('option'); | |
| opt.appendChild(document.createTextNode(txt)); | |
| opt.value = val; | |
| sel.appendChild(opt); | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment