Ajout Converter
This commit is contained in:
@@ -0,0 +1,533 @@
|
||||
/*
|
||||
***************************************************************************
|
||||
** Program : index.js, part of ESP_ticker
|
||||
** Version : v1.6.0 (02-01-2021)
|
||||
**
|
||||
** Copyright (c) 2021 Willem Aandewiel
|
||||
**
|
||||
** TERMS OF USE: MIT License. See bottom of file.
|
||||
***************************************************************************
|
||||
*/
|
||||
const APIGW='http://'+window.location.host+'/api/';
|
||||
|
||||
"use strict";
|
||||
|
||||
let needReload = true;
|
||||
|
||||
window.onload=bootsTrapMain;
|
||||
window.onfocus = function() {
|
||||
if (needReload) {
|
||||
window.location.reload(true);
|
||||
}
|
||||
};
|
||||
|
||||
//============================================================================
|
||||
function bootsTrapMain() {
|
||||
console.log("bootsTrapMain()");
|
||||
document.getElementById('saveMsg').addEventListener('click',function()
|
||||
{saveMessages();});
|
||||
document.getElementById('M_FSexplorer').addEventListener('click',function()
|
||||
{ console.log("newTab: goFSexplorer");
|
||||
location.href = "/FSexplorer";
|
||||
});
|
||||
document.getElementById('S_FSexplorer').addEventListener('click',function()
|
||||
{ console.log("newTab: goFSexplorer");
|
||||
location.href = "/FSexplorer";
|
||||
});
|
||||
document.getElementById('back').addEventListener('click',function()
|
||||
{ console.log("newTab: goBack");
|
||||
location.href = "/";
|
||||
});
|
||||
document.getElementById('Settings').addEventListener('click',function()
|
||||
{settingsPage();});
|
||||
document.getElementById('saveSettings').addEventListener('click',function()
|
||||
{saveSettings();});
|
||||
needReload = false;
|
||||
refreshDevTime();
|
||||
refreshDevInfo();
|
||||
refreshMessages();
|
||||
|
||||
document.getElementById("displayMainPage").style.display = "block";
|
||||
document.getElementById("displaySettingsPage").style.display = "none";
|
||||
|
||||
} // bootsTrapMain()
|
||||
|
||||
function settingsPage()
|
||||
{
|
||||
document.getElementById("displayMainPage").style.display = "none";
|
||||
|
||||
var settingsPage = document.getElementById("settingsPage");
|
||||
refreshSettings();
|
||||
document.getElementById("displaySettingsPage").style.display = "block";
|
||||
|
||||
} // settingsPage()
|
||||
|
||||
|
||||
//============================================================================
|
||||
function refreshDevTime()
|
||||
{
|
||||
//console.log("Refresh api/v0/devtime ..");
|
||||
fetch(APIGW+"v0/devtime")
|
||||
.then(response => response.json())
|
||||
.then(json => {
|
||||
console.log("parsed .., data is ["+ JSON.stringify(json)+"]");
|
||||
for( let i in json.devtime ){
|
||||
if (json.devtime[i].name == "dateTime")
|
||||
{
|
||||
//console.log("Got new time ["+json.devtime[i].value+"]");
|
||||
document.getElementById('theTime').innerHTML = json.devtime[i].value;
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch(function(error) {
|
||||
var p = document.createElement('p');
|
||||
p.appendChild(
|
||||
document.createTextNode('Error: ' + error.message)
|
||||
);
|
||||
});
|
||||
|
||||
} // refreshDevTime()
|
||||
|
||||
|
||||
//============================================================================
|
||||
function refreshDevInfo()
|
||||
{
|
||||
document.getElementById('devName').innerHTML = "";
|
||||
fetch(APIGW+"v0/devinfo")
|
||||
.then(response => response.json())
|
||||
.then(json => {
|
||||
//console.log("parsed .., data is ["+ JSON.stringify(json)+"]");
|
||||
data = json.devinfo;
|
||||
for( let i in data )
|
||||
{
|
||||
if (data[i].name == "fwversion")
|
||||
{
|
||||
document.getElementById('devVersion').innerHTML = json.devinfo[i].value;
|
||||
|
||||
} else if (data[i].name == 'hostname')
|
||||
{
|
||||
document.getElementById('devName').innerHTML += data[i].value+" ";
|
||||
|
||||
} else if (data[i].name == 'ipaddress')
|
||||
{
|
||||
document.getElementById('devName').innerHTML += " ("+data[i].value+") ";
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch(function(error) {
|
||||
var p = document.createElement('p');
|
||||
p.appendChild(
|
||||
document.createTextNode('Error: ' + error.message)
|
||||
);
|
||||
});
|
||||
} // refreshDevInfo()
|
||||
|
||||
//============================================================================
|
||||
function refreshMessages()
|
||||
{
|
||||
console.log("refreshMessages() ..");
|
||||
data = {};
|
||||
fetch(APIGW+"v0/messages")
|
||||
.then(response => response.json())
|
||||
.then(json => {
|
||||
console.log("then(json => ..)");
|
||||
msg = json.messages;
|
||||
for( let i in msg )
|
||||
{
|
||||
msg[i].value = msg[i].value.replaceAll("@1@", ":");
|
||||
msg[i].value = msg[i].value.replaceAll("@2@", "{");
|
||||
msg[i].value = msg[i].value.replaceAll("@3@", "}");
|
||||
msg[i].value = msg[i].value.replaceAll("@4@", ",");
|
||||
msg[i].value = msg[i].value.replaceAll("@5@", "\\");
|
||||
msg[i].value = msg[i].value.replaceAll("@6@", "\%");
|
||||
|
||||
console.log("["+msg[i].name+"]=>["+msg[i].value+"]");
|
||||
var messages = document.getElementById('mainPage');
|
||||
if( ( document.getElementById("msgR_"+msg[i].name)) == null )
|
||||
{
|
||||
var rowDiv = document.createElement("div");
|
||||
rowDiv.setAttribute("class", "msgDiv");
|
||||
rowDiv.setAttribute("id", "msgR_"+msg[i].name);
|
||||
rowDiv.setAttribute("style", "text-align: right;");
|
||||
rowDiv.style.marginLeft = "10px";
|
||||
rowDiv.style.marginRight = "10px";
|
||||
rowDiv.style.width = "850px";
|
||||
rowDiv.style.border = "thick solid lightblue";
|
||||
rowDiv.style.background = "lightblue";
|
||||
//--- field Name ---
|
||||
var fldDiv = document.createElement("div");
|
||||
fldDiv.setAttribute("style", "margin-right: 10px;");
|
||||
fldDiv.style.width = "30px";
|
||||
fldDiv.style.float = 'left';
|
||||
fldDiv.textContent = msg[i].name;
|
||||
rowDiv.appendChild(fldDiv);
|
||||
//--- input ---
|
||||
var inputDiv = document.createElement("div");
|
||||
inputDiv.setAttribute("style", "text-align: left;");
|
||||
|
||||
var sInput = document.createElement("INPUT");
|
||||
sInput.setAttribute("id", "M_"+msg[i].name);
|
||||
sInput.setAttribute("style", "background: white");
|
||||
|
||||
if (msg[i].type == "s")
|
||||
{
|
||||
sInput.setAttribute("type", "text");
|
||||
sInput.setAttribute("maxlength", msg[i].maxlen);
|
||||
sInput.setAttribute("size", 100);
|
||||
|
||||
sInput.setAttribute("value", msg[i].value);
|
||||
//console.log("addEventListener(M_"+msg[i].name+")");
|
||||
sInput.addEventListener('change',
|
||||
function() { setBackGround("M_"+msg[i].name, "lightgray"); },
|
||||
false
|
||||
);
|
||||
}
|
||||
inputDiv.appendChild(sInput);
|
||||
|
||||
rowDiv.appendChild(inputDiv);
|
||||
messages.appendChild(rowDiv);
|
||||
}
|
||||
else
|
||||
{
|
||||
document.getElementById("M_"+msg[i].name).style.background = "white";
|
||||
document.getElementById("M_"+msg[i].name).value = data[i].value;
|
||||
}
|
||||
}
|
||||
document.getElementById("waiting").innerHTML = "";
|
||||
})
|
||||
.catch(function(error) {
|
||||
var p = document.createElement('p');
|
||||
p.appendChild(
|
||||
document.createTextNode('Error: ' + error.message)
|
||||
);
|
||||
});
|
||||
|
||||
} // refreshMessages()
|
||||
|
||||
|
||||
//============================================================================
|
||||
function refreshSettings()
|
||||
{
|
||||
console.log("refreshSettings() ..");
|
||||
data = {};
|
||||
fetch(APIGW+"v0/settings")
|
||||
.then(response => response.json())
|
||||
.then(json => {
|
||||
console.log("then(json => ..)");
|
||||
data = json.settings;
|
||||
for( let i in data )
|
||||
{
|
||||
console.log("["+data[i].name+"]=>["+data[i].value+"]");
|
||||
var settings = document.getElementById('settingsPage');
|
||||
if( ( document.getElementById("D_"+data[i].name)) == null )
|
||||
{
|
||||
var rowDiv = document.createElement("div");
|
||||
rowDiv.setAttribute("class", "settingDiv");
|
||||
//----rowDiv.setAttribute("id", "settingR_"+data[i].name);
|
||||
rowDiv.setAttribute("id", "D_"+data[i].name);
|
||||
rowDiv.setAttribute("style", "text-align: right;");
|
||||
rowDiv.style.marginLeft = "10px";
|
||||
rowDiv.style.marginRight = "10px";
|
||||
rowDiv.style.width = "800px";
|
||||
rowDiv.style.border = "thick solid lightblue";
|
||||
rowDiv.style.background = "lightblue";
|
||||
//--- field Name ---
|
||||
var fldDiv = document.createElement("div");
|
||||
fldDiv.setAttribute("style", "margin-right: 10px;");
|
||||
fldDiv.style.width = "270px";
|
||||
fldDiv.style.float = 'left';
|
||||
fldDiv.textContent = translateToHuman(data[i].name);
|
||||
rowDiv.appendChild(fldDiv);
|
||||
//--- input ---
|
||||
var inputDiv = document.createElement("div");
|
||||
inputDiv.setAttribute("style", "text-align: left;");
|
||||
|
||||
var sInput = document.createElement("INPUT");
|
||||
//----sInput.setAttribute("id", "setFld_"+data[i].name);
|
||||
sInput.setAttribute("id", data[i].name);
|
||||
|
||||
if (data[i].type == "s")
|
||||
{
|
||||
sInput.setAttribute("type", "text");
|
||||
sInput.setAttribute("maxlength", data[i].maxlen);
|
||||
sInput.setAttribute("size", 50);
|
||||
}
|
||||
else if (data[i].type == "f")
|
||||
{
|
||||
sInput.setAttribute("type", "number");
|
||||
sInput.max = data[i].max;
|
||||
sInput.min = data[i].min;
|
||||
sInput.step = (data[i].min + data[i].max) / 1000;
|
||||
}
|
||||
else if (data[i].type == "i")
|
||||
{
|
||||
sInput.setAttribute("type", "number");
|
||||
sInput.setAttribute("size", 10);
|
||||
sInput.max = data[i].max;
|
||||
sInput.min = data[i].min;
|
||||
//sInput.step = (data[i].min + data[i].max) / 1000;
|
||||
sInput.step = 1;
|
||||
}
|
||||
sInput.setAttribute("value", data[i].value);
|
||||
sInput.addEventListener('change',
|
||||
function() { setBackGround(data[i].name, "lightgray"); },
|
||||
false
|
||||
);
|
||||
inputDiv.appendChild(sInput);
|
||||
|
||||
rowDiv.appendChild(inputDiv);
|
||||
settings.appendChild(rowDiv);
|
||||
}
|
||||
else
|
||||
{
|
||||
//----document.getElementById("setFld_"+data[i].name).style.background = "white";
|
||||
document.getElementById(data[i].name).style.background = "white";
|
||||
//----document.getElementById("setFld_"+data[i].name).value = data[i].value;
|
||||
document.getElementById(data[i].name).value = data[i].value;
|
||||
}
|
||||
}
|
||||
//console.log("-->done..");
|
||||
})
|
||||
.catch(function(error) {
|
||||
var p = document.createElement('p');
|
||||
p.appendChild(
|
||||
document.createTextNode('Error: ' + error.message)
|
||||
);
|
||||
});
|
||||
|
||||
} // refreshSettings()
|
||||
|
||||
|
||||
//============================================================================
|
||||
function saveMessages()
|
||||
{
|
||||
console.log("Saving messages ..");
|
||||
let changes = false;
|
||||
|
||||
//--- has anything changed?
|
||||
var page = document.getElementById("mainPage");
|
||||
var mRow = page.getElementsByTagName("input");
|
||||
//var mRow = document.getElementById("mainPage").getElementsByTagName('div');
|
||||
for(var i = 0; i < mRow.length; i++)
|
||||
{
|
||||
//do something to each div like
|
||||
var msgId = mRow[i].getAttribute("id");
|
||||
var field = msgId.substr(2);
|
||||
//console.log("msgId["+msgId+", msgNr["+field+"]");
|
||||
value = document.getElementById(msgId).value;
|
||||
//console.log("==> name["+field+"], value["+value+"]");
|
||||
|
||||
changes = false;
|
||||
|
||||
if (getBackGround("M_"+field) == "lightgray")
|
||||
{
|
||||
setBackGround("M_"+field, "white");
|
||||
changes = true;
|
||||
}
|
||||
if (changes) {
|
||||
console.log("Changes where made in ["+field+"]["+value+"]");
|
||||
//processWithTimeout([(data.length -1), 0], 2, data, sendPostReading);
|
||||
sendPostMessages(field, value);
|
||||
}
|
||||
}
|
||||
|
||||
} // saveMessages()
|
||||
|
||||
|
||||
//============================================================================
|
||||
function saveSettings()
|
||||
{
|
||||
console.log("saveSettings() ...");
|
||||
let changes = false;
|
||||
|
||||
//--- has anything changed?
|
||||
var page = document.getElementById("settingsPage");
|
||||
var mRow = page.getElementsByTagName("input");
|
||||
//var mRow = document.getElementById("mainPage").getElementsByTagName('div');
|
||||
for(var i = 0; i < mRow.length; i++)
|
||||
{
|
||||
//do something to each div like
|
||||
var msgId = mRow[i].getAttribute("id");
|
||||
var field = msgId;
|
||||
//console.log("msgId["+msgId+", msgNr["+field+"]");
|
||||
value = document.getElementById(msgId).value;
|
||||
//console.log("==> name["+field+"], value["+value+"]");
|
||||
|
||||
changes = false;
|
||||
|
||||
if (getBackGround(field) == "lightgray")
|
||||
{
|
||||
setBackGround(field, "white");
|
||||
changes = true;
|
||||
}
|
||||
if (changes) {
|
||||
console.log("Changes where made in ["+field+"]["+value+"]");
|
||||
var value = value.replace(/,/g, " ");
|
||||
value = value.replace(/ /g, " ");
|
||||
value = value.replace(/ /g, " ");
|
||||
value = value.replace(/ /g, " ");
|
||||
//processWithTimeout([(data.length -1), 0], 2, data, sendPostReading);
|
||||
sendPostSetting(field, value);
|
||||
}
|
||||
}
|
||||
|
||||
} // saveSettings()
|
||||
|
||||
|
||||
//============================================================================
|
||||
function sendPostMessages(field, value)
|
||||
{
|
||||
//console.log("sendPostMessages(value): "+value+"]");
|
||||
value = value.replaceAll("\"", "'");
|
||||
value = value.replaceAll(":", "@1@");
|
||||
value = value.replaceAll("{", "@2@");
|
||||
value = value.replaceAll("}", "@3@");
|
||||
value = value.replaceAll(",", "@4@");
|
||||
value = value.replaceAll("\\", "@5@");
|
||||
value = value.replaceAll("\%", "@6@");
|
||||
console.log("sendPostMessages(value): "+value+"]");
|
||||
|
||||
const jsonString = {"name" : field, "value" : value};
|
||||
console.log("sendPostMessages(): "+JSON.stringify(jsonString));
|
||||
const other_params = {
|
||||
headers : { "content-type" : "application/json; charset=UTF-8"},
|
||||
body : JSON.stringify(jsonString),
|
||||
method : "POST",
|
||||
mode : "cors"
|
||||
};
|
||||
|
||||
fetch(APIGW+"v0/messages", other_params)
|
||||
.then(function(response) {
|
||||
}, function(error) {
|
||||
console.log("Error["+error.message+"]"); //=> String
|
||||
});
|
||||
|
||||
} // sendPostMessages()
|
||||
|
||||
|
||||
//============================================================================
|
||||
function sendPostSetting(field, value)
|
||||
{
|
||||
const jsonString = {"name" : field, "value" : value};
|
||||
console.log("sending: "+JSON.stringify(jsonString));
|
||||
const other_params = {
|
||||
headers : { "content-type" : "application/json; charset=UTF-8"},
|
||||
body : JSON.stringify(jsonString),
|
||||
method : "POST",
|
||||
mode : "cors"
|
||||
};
|
||||
|
||||
fetch(APIGW+"v0/settings", other_params)
|
||||
.then(function(response) {
|
||||
//console.log(response.status ); //=> number 100–599
|
||||
//console.log(response.statusText); //=> String
|
||||
//console.log(response.headers); //=> Headers
|
||||
//console.log(response.url); //=> String
|
||||
//console.log(response.text());
|
||||
//return response.text()
|
||||
}, function(error) {
|
||||
console.log("Error["+error.message+"]"); //=> String
|
||||
});
|
||||
|
||||
} // sendPostSetting()
|
||||
|
||||
|
||||
//============================================================================
|
||||
function translateToHuman(longName) {
|
||||
//for(var index = 0; index < (translateFields.length -1); index++)
|
||||
for(var index = 0; index < translateFields.length; index++)
|
||||
{
|
||||
if (translateFields[index][0] == longName)
|
||||
{
|
||||
return translateFields[index][1];
|
||||
}
|
||||
};
|
||||
return longName;
|
||||
|
||||
} // translateToHuman()
|
||||
|
||||
|
||||
|
||||
//============================================================================
|
||||
function setBackGround(field, newColor) {
|
||||
//console.log("setBackground("+field+", "+newColor+")");
|
||||
document.getElementById(field).style.background = newColor;
|
||||
|
||||
} // setBackGround()
|
||||
|
||||
|
||||
//============================================================================
|
||||
function getBackGround(field) {
|
||||
//console.log("getBackground("+field+")");
|
||||
return document.getElementById(field).style.background;
|
||||
|
||||
} // getBackGround()
|
||||
|
||||
|
||||
//============================================================================
|
||||
function round(value, precision) {
|
||||
var multiplier = Math.pow(10, precision || 0);
|
||||
return Math.round(value * multiplier) / multiplier;
|
||||
}
|
||||
|
||||
|
||||
//============================================================================
|
||||
function printAllVals(obj) {
|
||||
for (let k in obj) {
|
||||
if (typeof obj[k] === "object") {
|
||||
printAllVals(obj[k])
|
||||
} else {
|
||||
// base case, stop recurring
|
||||
console.log(obj[k]);
|
||||
}
|
||||
}
|
||||
} // printAllVals()
|
||||
|
||||
|
||||
var translateFields = [
|
||||
[ "author", "Auteur" ]
|
||||
,[ "localMaxMsg", "max. aantal boodschappen" ]
|
||||
,[ "textSpeed", "scroll snelheid" ]
|
||||
,[ "maxIntensity", "max. Intensiteit leds" ]
|
||||
,[ "LDRlowOffset", "LDR min. waarde" ]
|
||||
,[ "LDRhighOffset", "LDR max. waarde" ]
|
||||
,[ "weerliveAUTH", "weerlive.nl auth. token" ]
|
||||
,[ "weerliveLocation", "weerlive.nl locatie" ]
|
||||
,[ "weerliveInterval", "weerlive.nl refresh interval in minuten" ]
|
||||
,[ "newsapiAUTH", "newsapi.org auth. token" ]
|
||||
,[ "newsapiMaxMsg", "newsapi.nl max. items" ]
|
||||
,[ "newsapiInterval", "newapi.nl refresh interval in minuten" ]
|
||||
,[ "newsNoWords", "skip items met deze woorden" ]
|
||||
];
|
||||
|
||||
//============================================================================
|
||||
String.prototype.replaceAll = function(str1, str2, ignore)
|
||||
{
|
||||
return this.replace(new RegExp(str1.replace(/([\/\,\!\\\^\$\{\}\[\]\(\)\.\*\+\?\|\<\>\-\&])/g,"\\$&"),(ignore?"gi":"g")),(typeof(str2)=="string")?str2.replace(/\$/g,"$$$$"):str2);
|
||||
//return this.replace(new RegExp(str1.replace(/([\/\,\!\\\^\$\[\]\(\)\.\*\+\?\|\<\>\-\&])/g,"\\$&"),(ignore?"gi":"g")),(typeof(str2)=="string")?str2.replace(/\$/g,"$$$$"):str2);
|
||||
}
|
||||
|
||||
/*
|
||||
***************************************************************************
|
||||
*
|
||||
* Permission is hereby granted, free of charge, to any person obtaining a
|
||||
* copy of this software and associated documentation files (the
|
||||
* "Software"), to deal in the Software without restriction, including
|
||||
* without limitation the rights to use, copy, modify, merge, publish,
|
||||
* distribute, sublicense, and/or sell copies of the Software, and to permit
|
||||
* persons to whom the Software is furnished to do so, subject to the
|
||||
* following conditions:
|
||||
*
|
||||
* The above copyright notice and this permission notice shall be included
|
||||
* in all copies or substantial portions of the Software.
|
||||
*
|
||||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
|
||||
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
||||
* MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
|
||||
* IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY
|
||||
* CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT
|
||||
* OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR
|
||||
* THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||
*
|
||||
***************************************************************************
|
||||
*/
|
||||
Reference in New Issue
Block a user