/** * JavaScript code for the dashboard logic, refresh and other things * * Anatole SCHRAMM-HENRY - Th3maz1ng **/ //Variable needed for the app var sigStrenthInter = null; var rtcInter = null; var sysinfoInter = null; var ioModeLevelInter = null; var powerInfoInter = null; var execTimeStart = null; //XMLHttpRequest objects let ajaxReqPowerInfo = new XMLHttpRequest(); let ajaxReqGetIoMode = new XMLHttpRequest(); let ajaxReqRtc = new XMLHttpRequest(); //This function set the app up function init() { console.log("Body loaded - starting setup"); initAjaxRtc(); refreshRtc(ajaxReqRtc); rtcClockInter = setInterval(() => {refreshRtc(ajaxReqRtc)},1000); refreshSysInfo(); sysinfoInter = setInterval(refreshSysInfo,10000); refreshSigStrength(); sigStrenthInter = setInterval(refreshSigStrength,1000); sdCardSize(); getIoMode(ajaxReqGetIoMode); getIoLevel(); ioModeLevelInter = setInterval(() => {getIoMode(ajaxReqGetIoMode);getIoLevel();},1000); powerInfo(ajaxReqPowerInfo); powerInfoInter = setInterval(() => {powerInfo(ajaxReqPowerInfo);},10000); //We init the time boxes var curDate = new Date(); document.getElementById('hour').value = curDate.getHours(); document.getElementById('minute').value = curDate.getMinutes(); document.getElementById('second').value = curDate.getSeconds(); document.getElementById('day').value = curDate.getDate(); document.getElementById('month').value = curDate.getMonth() + 1; document.getElementById('year').value = curDate.getFullYear(); console.log("Ending setup"); } function initAjaxRtc() { ajaxReqRtc.timeout = 5000; ajaxReqRtc.onreadystatechange = function() { switch(this.readyState) { case 0: break; case 1: console.log("Connection established"); break; case 2: console.log("Request received"); break; case 3: console.log("Processing request"); break; case 4: console.log("Response is ready"); if(this.status != 0){onConnected(); document.getElementById('execTime').innerHTML = new Date().getTime() - execTimeStart;} if(this.status == 200) { console.log("Response : " + this.responseText); var rtcObj = JSON.parse(this.responseText); console.log(rtcObj); document.getElementById('rtcValue').innerHTML = rtcObj.time + ' ' + rtcObj.date; } else { console.log("Error, status is : " + this.status); document.getElementById('rtcValue').innerHTML = 'ERROR'; document.getElementById('execTime').innerHTML = 'NaN'; } break; default: console.log("Unknown state"); } } ajaxReqRtc.ontimeout = onTimeOut; } function onTimeOut(e) { console.error("Request timed out"); document.getElementById('imgConn').style.display = 'none'; document.getElementById('imgDisco').style.display = 'block'; } function onConnected() { if(document.getElementById('imgDisco').style.display != 'none' && document.getElementById('imgConn').style.display != 'block') { console.log("Connected to Swiss Army Board"); document.getElementById('imgDisco').style.display = 'none'; document.getElementById('imgConn').style.display = 'block'; refreshRtc(ajaxReqRtc); refreshSysInfo(); refreshSigStrength(); sdCardSize(); getIoMode(ajaxReqGetIoMode); getIoLevel(); powerInfo(ajaxReqPowerInfo); } } function powerInfo(ajaxReq) { console.log("Getting board power info"); ajaxReq.timeout = 5000; ajaxReq.onreadystatechange = function() { switch(this.readyState) { case 0: break; case 1: console.log("Connection established"); break; case 2: console.log("Request received"); break; case 3: console.log("Processing request"); break; case 4: console.log("Response is ready"); if(this.status == 200) { console.log("Response : " + this.responseText); var powerInfoObj = JSON.parse(this.responseText); console.log(powerInfoObj); document.getElementById('battLevel').innerHTML = powerInfoObj['power type'] == 'USB' ? 'USB' : 'BATTERY :
' + powerInfoObj.level + ' %'; } else { console.log("Error, status is : " + this.status); document.getElementById('battLevel').innerHTML = 'NaN %'; } break; default: console.log("Unknown state"); } } ajaxReq.ontimeout = onTimeOut; ajaxReq.open('GET',"/sab/power/info"); ajaxReq.send(); } function refreshRtc(ajaxReq) { console.log("Refreshing RTC"); ajaxReqRtc.open('GET',"/sab/rtc/get/datetime"); execTimeStart = new Date().getTime(); ajaxReq.send(); } function refreshSysInfo() { console.log("Refreshing Sys Infos"); var ajaxReq = new XMLHttpRequest(); ajaxReq.timeout = 5000; ajaxReq.onreadystatechange = function() { switch(this.readyState) { case 0: break; case 1: console.log("Connection established"); break; case 2: console.log("Request received"); break; case 3: console.log("Processing request"); break; case 4: console.log("Response is ready"); if(this.status == 200) { console.log("Response : " + this.responseText); var systemInfoObj = JSON.parse(this.responseText); console.log(systemInfoObj); document.getElementById('ramInfo').innerHTML = systemInfoObj['free RAM']; document.getElementById('cpuInfo').innerHTML = systemInfoObj['CPU freq']; document.getElementById('fragInfo').innerHTML = systemInfoObj['heap frag']; document.getElementById('blockInfo').innerHTML = systemInfoObj['max block']; document.getElementById('upTime').innerHTML = systemInfoObj['up time'].days + ' days ' + systemInfoObj['up time'].hours + ' hours ' + systemInfoObj['up time'].minutes + ' minutes ' + systemInfoObj['up time'].seconds + ' seconds '; document.getElementById('temperature').innerHTML = systemInfoObj['temperature'].level + systemInfoObj['temperature'].unit; } else { console.log("Error, status is : " + this.status); document.getElementById('ramInfo').innerHTML = 'NaN'; document.getElementById('cpuInfo').innerHTML = 'NaN'; document.getElementById('fragInfo').innerHTML = 'NaN'; document.getElementById('blockInfo').innerHTML = 'NaN'; document.getElementById('upTime').innerHTML = 'NaN'; document.getElementById('temperature').innerHTML = 'NaN'; } break; default: console.log("Unknown state"); } } ajaxReq.ontimeout = onTimeOut; ajaxReq.open('GET',"/sab/systeminfo"); ajaxReq.send(); } function refreshSigStrength() { console.log("Refreshing Sig Strength"); var ajaxReq = new XMLHttpRequest(); ajaxReq.timeout = 5000; ajaxReq.onreadystatechange = function() { switch(this.readyState) { case 0: break; case 1: console.log("Connection established"); break; case 2: console.log("Request received"); break; case 3: console.log("Processing request"); break; case 4: console.log("Response is ready"); if(this.status == 200) { console.log("Response : " + this.responseText); var wifiStaObj = JSON.parse(this.responseText); console.log(wifiStaObj); document.getElementById('sigStrength').innerHTML = wifiStaObj.RSSI; document.getElementById('sigStrengthPercent').innerHTML = wifiStaObj.RSSI2; document.getElementById('localIP').innerHTML = wifiStaObj['local IP']; setSigStrenthPicture(wifiStaObj.RSSI2); } else { console.log("Error, status is : " + this.status); document.getElementById('sigStrength').innerHTML = 'NaN'; document.getElementById('sigStrengthPercent').innerHTML = 'NaN'; document.getElementById('localIP').innerHTML = 'ERROR'; } break; default: console.log("Unknown state"); } } ajaxReq.ontimeout = onTimeOut; ajaxReq.open('GET',"/sab/wifi/stainfo"); ajaxReq.send(); } function setSigStrenthPicture(value) { if(value < 5) { document.getElementById('imgSig1').style.display = 'block'; document.getElementById('imgSig2').style.display = 'none'; document.getElementById('imgSig3').style.display = 'none'; document.getElementById('imgSig4').style.display = 'none'; document.getElementById('imgSig5').style.display = 'none'; } else if(value < 20) { document.getElementById('imgSig1').style.display = 'none'; document.getElementById('imgSig2').style.display = 'block'; document.getElementById('imgSig3').style.display = 'none'; document.getElementById('imgSig4').style.display = 'none'; document.getElementById('imgSig5').style.display = 'none'; } else if(value < 40) { document.getElementById('imgSig1').style.display = 'none'; document.getElementById('imgSig2').style.display = 'none'; document.getElementById('imgSig3').style.display = 'block'; document.getElementById('imgSig4').style.display = 'none'; document.getElementById('imgSig5').style.display = 'none'; } else if(value < 80) { document.getElementById('imgSig1').style.display = 'none'; document.getElementById('imgSig2').style.display = 'none'; document.getElementById('imgSig3').style.display = 'none'; document.getElementById('imgSig4').style.display = 'block'; document.getElementById('imgSig5').style.display = 'none'; } else { document.getElementById('imgSig1').style.display = 'none'; document.getElementById('imgSig2').style.display = 'none'; document.getElementById('imgSig3').style.display = 'none'; document.getElementById('imgSig4').style.display = 'none'; document.getElementById('imgSig5').style.display = 'block'; } } function sdCardMountUnmnout(action) { console.log("Sd card action : "+action); var ajaxReq = new XMLHttpRequest(); ajaxReq.timeout = 5000; ajaxReq.onreadystatechange = function() { switch(this.readyState) { case 0: break; case 1: console.log("Connection established"); break; case 2: console.log("Request received"); break; case 3: console.log("Processing request"); break; case 4: console.log("Response is ready"); if(this.status == 200) { console.log("Response : " + this.responseText); var sdCardObj = JSON.parse(this.responseText); console.log(sdCardObj); sdCardSize(); } else { console.log("Error, status is : " + this.status); } break; default: console.log("Unknown state"); } } ajaxReq.ontimeout = onTimeOut; ajaxReq.open('GET',"/sab/sdcard/"+action); ajaxReq.send(); } function sdCardSize() { console.log("Refreshing SD card size : "); var ajaxReq = new XMLHttpRequest(); ajaxReq.timeout = 5000; ajaxReq.onreadystatechange = function() { switch(this.readyState) { case 0: break; case 1: console.log("Connection established"); break; case 2: console.log("Request received"); break; case 3: console.log("Processing request"); break; case 4: console.log("Response is ready"); if(this.status == 200) { console.log("Response : " + this.responseText); var sdCardObj = JSON.parse(this.responseText); console.log(sdCardObj); document.getElementById('cardSize').innerHTML = sdCardObj.size == 0 ? 'NO CARD' : sdCardObj.size + ' GByte(s)'; } else { console.log("Error, status is : " + this.status); document.getElementById('cardSize').innerHTML = 'NaN GByte(s)'; } break; default: console.log("Unknown state"); } } ajaxReq.ontimeout = onTimeOut; ajaxReq.open('GET',"/sab/sdcard/size"); ajaxReq.send(); } function getIoMode(ajaxReq) { console.log("Getting IO mode for all IO's"); ajaxReq.timeout = 5000; ajaxReq.onreadystatechange = function() { switch(this.readyState) { case 0: break; case 1: console.log("Connection established"); break; case 2: console.log("Request received"); break; case 3: console.log("Processing request"); break; case 4: console.log("Response is ready"); if(this.status == 200) { console.log("Response : " + this.responseText); var ioModeObj = JSON.parse(this.responseText); console.log(ioModeObj); updateIoModeInfo(ioModeObj); } else { console.log("Error, status is : " + this.status); hideIoMode(); } break; default: console.log("Unknown state"); } } ajaxReq.ontimeout = onTimeOut; ajaxReq.open('GET',"/sab/io/get/mode"); ajaxReq.send(); } function updateIoModeInfo(obj) { document.getElementById('P0_MODE_I').style.display = obj.P0 == 'IN' ? 'block' : 'none'; document.getElementById('P0_MODE_O').style.display = obj.P0 == 'IN' ? 'none' : 'block'; document.getElementById('P1_MODE_I').style.display = obj.P1 == 'IN' ? 'block' : 'none'; document.getElementById('P1_MODE_O').style.display = obj.P1 == 'IN' ? 'none' : 'block'; document.getElementById('P2_MODE_I').style.display = obj.P2 == 'IN' ? 'block' : 'none'; document.getElementById('P2_MODE_O').style.display = obj.P2 == 'IN' ? 'none' : 'block'; document.getElementById('P3_MODE_I').style.display = obj.P3 == 'IN' ? 'block' : 'none'; document.getElementById('P3_MODE_O').style.display = obj.P3 == 'IN' ? 'none' : 'block'; document.getElementById('P4_MODE_I').style.display = obj.P4 == 'IN' ? 'block' : 'none'; document.getElementById('P4_MODE_O').style.display = obj.P4 == 'IN' ? 'none' : 'block'; document.getElementById('P5_MODE_I').style.display = obj.P5 == 'IN' ? 'block' : 'none'; document.getElementById('P5_MODE_O').style.display = obj.P5 == 'IN' ? 'none' : 'block'; document.getElementById('P6_MODE_I').style.display = obj.P6 == 'IN' ? 'block' : 'none'; document.getElementById('P6_MODE_O').style.display = obj.P6 == 'IN' ? 'none' : 'block'; document.getElementById('P7_MODE_I').style.display = obj.P7 == 'IN' ? 'block' : 'none'; document.getElementById('P7_MODE_O').style.display = obj.P7 == 'IN' ? 'none' : 'block'; } function hideIoMode() { document.getElementById('P0_MODE_I').style.display = 'none'; document.getElementById('P0_MODE_O').style.display = 'none'; document.getElementById('P1_MODE_I').style.display = 'none'; document.getElementById('P1_MODE_O').style.display = 'none'; document.getElementById('P2_MODE_I').style.display = 'none'; document.getElementById('P2_MODE_O').style.display = 'none'; document.getElementById('P3_MODE_I').style.display = 'none'; document.getElementById('P3_MODE_O').style.display = 'none'; document.getElementById('P4_MODE_I').style.display = 'none'; document.getElementById('P4_MODE_O').style.display = 'none'; document.getElementById('P5_MODE_I').style.display = 'none'; document.getElementById('P5_MODE_O').style.display = 'none'; document.getElementById('P6_MODE_I').style.display = 'none'; document.getElementById('P6_MODE_O').style.display = 'none'; document.getElementById('P7_MODE_I').style.display = 'none'; document.getElementById('P7_MODE_O').style.display = 'none'; } function updateIoLevelInfo(obj) { document.getElementById('P0_LEVEL_H').style.display = obj.P0 == '1' ? 'block' : 'none'; document.getElementById('P0_LEVEL_L').style.display = obj.P0 == '1' ? 'none' : 'block'; document.getElementById('P1_LEVEL_H').style.display = obj.P1 == '1' ? 'block' : 'none'; document.getElementById('P1_LEVEL_L').style.display = obj.P1 == '1' ? 'none' : 'block'; document.getElementById('P2_LEVEL_H').style.display = obj.P2 == '1' ? 'block' : 'none'; document.getElementById('P2_LEVEL_L').style.display = obj.P2 == '1' ? 'none' : 'block'; document.getElementById('P3_LEVEL_H').style.display = obj.P3 == '1' ? 'block' : 'none'; document.getElementById('P3_LEVEL_L').style.display = obj.P3 == '1' ? 'none' : 'block'; document.getElementById('P4_LEVEL_H').style.display = obj.P4 == '1' ? 'block' : 'none'; document.getElementById('P4_LEVEL_L').style.display = obj.P4 == '1' ? 'none' : 'block'; document.getElementById('P5_LEVEL_H').style.display = obj.P5 == '1' ? 'block' : 'none'; document.getElementById('P5_LEVEL_L').style.display = obj.P5 == '1' ? 'none' : 'block'; document.getElementById('P6_LEVEL_H').style.display = obj.P6 == '1' ? 'block' : 'none'; document.getElementById('P6_LEVEL_L').style.display = obj.P6 == '1' ? 'none' : 'block'; document.getElementById('P7_LEVEL_H').style.display = obj.P7 == '1' ? 'block' : 'none'; document.getElementById('P7_LEVEL_L').style.display = obj.P7 == '1' ? 'none' : 'block'; } function hideIoLevel() { document.getElementById('P0_LEVEL_H').style.display = 'none'; document.getElementById('P0_LEVEL_L').style.display = 'none'; document.getElementById('P1_LEVEL_H').style.display = 'none'; document.getElementById('P1_LEVEL_L').style.display = 'none'; document.getElementById('P2_LEVEL_H').style.display = 'none'; document.getElementById('P2_LEVEL_L').style.display = 'none'; document.getElementById('P3_LEVEL_H').style.display = 'none'; document.getElementById('P3_LEVEL_L').style.display = 'none'; document.getElementById('P4_LEVEL_H').style.display = 'none'; document.getElementById('P4_LEVEL_L').style.display = 'none'; document.getElementById('P5_LEVEL_H').style.display = 'none'; document.getElementById('P5_LEVEL_L').style.display = 'none'; document.getElementById('P6_LEVEL_H').style.display = 'none'; document.getElementById('P6_LEVEL_L').style.display = 'none'; document.getElementById('P7_LEVEL_H').style.display = 'none'; document.getElementById('P7_LEVEL_L').style.display = 'none'; } function getIoLevel() { console.log("Getting IO level for all IO's"); var ajaxReq = new XMLHttpRequest(); ajaxReq.timeout = 5000; ajaxReq.onreadystatechange = function() { switch(this.readyState) { case 0: break; case 1: console.log("Connection established"); break; case 2: console.log("Request received"); break; case 3: console.log("Processing request"); break; case 4: console.log("Response is ready"); if(this.status == 200) { console.log("Response : " + this.responseText); var ioLevelObj = JSON.parse(this.responseText); console.log(ioLevelObj); updateIoLevelInfo(ioLevelObj); } else { console.log("Error, status is : " + this.status); hideIoLevel(); } break; default: console.log("Unknown state"); } } ajaxReq.ontimeout = onTimeOut; ajaxReq.open('GET',"/sab/io/get/level"); ajaxReq.send(); } function setIoMode(pin,mode) { var pinOnly = pin.split('_')[0]; console.log("Setting IO mode : "+mode+" for " + pinOnly); var ajaxReq = new XMLHttpRequest(); ajaxReq.timeout = 5000; ajaxReq.onreadystatechange = function() { switch(this.readyState) { case 0: break; case 1: console.log("Connection established"); break; case 2: console.log("Request received"); break; case 3: console.log("Processing request"); break; case 4: console.log("Response is ready"); if(this.status == 200) { console.log("Response : " + this.responseText); var ioModeObj = JSON.parse(this.responseText); console.log(ioModeObj); updateIoModeInfo(ioModeObj); getIoLevel(); } else { console.log("Error, status is : " + this.status); hideIoMode(); } break; default: console.log("Unknown state"); } } ajaxReq.ontimeout = onTimeOut; ajaxReq.open('GET',"/sab/io/set/mode?"+pinOnly+'='+ (mode == 'OUTPUT' ? 'OUT' : 'IN')); ajaxReq.send(); } function setIoLevel(pin,mode) { var pinOnly = pin.split('_')[0]; console.log("Setting IO level : "+mode+" for " + pinOnly); var ajaxReq = new XMLHttpRequest(); ajaxReq.timeout = 5000; ajaxReq.onreadystatechange = function() { switch(this.readyState) { case 0: break; case 1: console.log("Connection established"); break; case 2: console.log("Request received"); break; case 3: console.log("Processing request"); break; case 4: console.log("Response is ready"); if(this.status == 200) { console.log("Response : " + this.responseText); var ioLevelObj = JSON.parse(this.responseText); console.log(ioLevelObj); updateIoLevelInfo(ioLevelObj); } else { console.log("Error, status is : " + this.status); hideIoLevel(); } break; default: console.log("Unknown state"); } } ajaxReq.ontimeout = onTimeOut; ajaxReq.open('GET',"/sab/io/set/level?"+pinOnly+'='+ (mode == 'HIGH' ? '1' : '0')); ajaxReq.send(); } function setRtcClock() { //First we chech the typeof the data var hour = parseInt(document.getElementById('hour').value); var minute = parseInt(document.getElementById('minute').value); var second = parseInt(document.getElementById('second').value); var day = parseInt(document.getElementById('day').value); var month = parseInt(document.getElementById('month').value); var year = parseInt(document.getElementById('year').value); if( isFinite(hour) && isFinite(minute) && isFinite(second) && isFinite(day) && isFinite(month) && isFinite(year) ) { //First, we create the request string : datetime=day_month_year_hours_minutes_seconds var data = day+"_"+month+"_"+year+"_"+hour+"_"+minute+"_"+second; var ajaxReq = new XMLHttpRequest(); ajaxReq.timeout = 5000; ajaxReq.onreadystatechange = function() { switch(this.readyState) { case 0: break; case 1: console.log("Connection established"); break; case 2: console.log("Request received"); break; case 3: console.log("Processing request"); break; case 4: console.log("Response is ready"); if(this.status != 0){onConnected(); document.getElementById('execTime').innerHTML = new Date().getTime() - execTimeStart;} if(this.status == 200) { console.log("Response : " + this.responseText); var rtcRespObj = JSON.parse(this.responseText); console.log(rtcRespObj); document.getElementById('rtcSetMsg').innerHTML = rtcRespObj.status; document.getElementById('rtcSetMsg').style.color = 'green'; } else { console.log("Error, status is : " + this.status); document.getElementById('rtcSetMsg').innerHTML = 'Failed to execute'; document.getElementById('rtcSetMsg').style.color = 'red'; } break; default: console.log("Unknown state"); } } ajaxReq.ontimeout = onTimeOut; ajaxReq.open('GET',"/sab/rtc/set/datetime?datetime="+data); console.log("datetime="+data); execTimeStart = new Date().getTime(); ajaxReq.send(); } else { console.error("Non numeric values encountered to set the rtc clock"); document.getElementById('rtcSetMsg').innerHTML = 'Failed to execute'; document.getElementById('rtcSetMsg').style.color = 'red'; } }