ESPUI/src/dataControlsJS.h

const char JS_CONTROLS[] PROGMEM = R"=====(
const UI_INITIAL_GUI=200,UI_RELOAD=201,UPDATE_OFFSET=100,UI_TITEL=0,UI_PAD=1,UPDATE_PAD=101,UI_CPAD=2,UPDATE_CPAD=102,UI_BUTTON=3,UPDATE_BUTTON=103,UI_LABEL=4,UPDATE_LABEL=104,UI_SWITCHER=5,UPDATE_SWITCHER=105,UI_SLIDER=6,UPDATE_SLIDER=106,UI_NUMBER=7,UPDATE_NUMBER=107,UI_TEXT_INPUT=8,UPDATE_TEXT_INPUT=108,UI_GRAPH=9,ADD_GRAPH_POINT=10,CLEAR_GRAPH=109,UI_TAB=11,UPDATE_TAB=111,UI_SELECT=12,UPDATE_SELECT=112,UI_OPTION=13,UPDATE_OPTION=113,UI_MIN=14,UPDATE_MIN=114,UI_MAX=15,UPDATE_MAX=115,UI_STEP=16,UPDATE_STEP=116,UI_GAUGE=17,UPDATE_GAUGE=117,UI_ACCEL=18,UPTDATE_ACCEL=117,UP=0,DOWN=1,LEFT=2,RIGHT=3,CENTER=4,C_TURQUOISE=0,C_EMERALD=1,C_PETERRIVER=2,C_WETASPHALT=3,C_SUNFLOWER=4,C_CARROT=5,C_ALIZARIN=6,C_DARK=7,C_NONE=255;var websock,graphData=new Array,hasAccel=!1,sliderContinuous=!1;function colorClass(e){switch(e=Number(e)){case C_TURQUOISE:return"turquoise";case C_EMERALD:return"emerald";case C_PETERRIVER:return"peterriver";case C_WETASPHALT:return"wetasphalt";case C_SUNFLOWER:return"sunflower";case C_CARROT:return"carrot";case C_ALIZARIN:return"alizarin";case C_NONE:return"dark";default:return""}}var websockConnected=!1;function requestOrientationPermission(){}function saveGraphData(){localStorage.setItem("espuigraphs",JSON.stringify(graphData))}function restoreGraphData(e){var a=localStorage.getItem("espuigraphs",graphData);return null!=a?(a=JSON.parse(a))[e]:[]}function restart(){$(document).add("*").off(),$("#row").html(""),websock.close(),start()}function conStatusError(){websockConnected=!1,$("#conStatus").removeClass("color-green"),$("#conStatus").addClass("color-red"),$("#conStatus").html("Error / No Connection &#8635;"),$("#conStatus").off(),$("#conStatus").on({click:restart})}function handleVisibilityChange(){websockConnected||document.hidden||restart()}function start(){document.addEventListener("visibilitychange",handleVisibilityChange,!1),(websock=""!=window.location.port||80!=window.location.port||443!=window.location.port?new WebSocket("ws://"+window.location.hostname+":"+window.location.port+"/ws"):new WebSocket("ws://"+window.location.hostname+"/ws")).onopen=function(e){console.log("websock open"),$("#conStatus").addClass("color-green"),$("#conStatus").text("Connected"),websockConnected=!0},websock.onclose=function(e){console.log("websock close"),conStatusError()},websock.onerror=function(e){console.log(e),conStatusError()};var e=function(a){console.log(a);var t=JSON.parse(a.data);document.body;switch(t.type){case UI_INITIAL_GUI:$("#row").html(""),$("#tabsnav").html(""),$("#tabscontent").html(""),t.sliderContinuous&&(sliderContinuous=t.sliderContinuous),t.controls.forEach(a=>{var t={data:JSON.stringify(a)};e(t)});break;case UI_RELOAD:window.location.reload();break;case UI_TITEL:document.title=t.label,$("#mainHeader").html(t.label);break;case UI_LABEL:(n=t.parentControl?$("#tab"+t.parentControl):$("#row")).append("<div id='id"+t.id+"' class='two columns card tcenter "+colorClass(t.color)+"'><h5>"+t.label+"</h5><hr/><span id='l"+t.id+"' class='label label-wrap'>"+t.value+"</span></div>");break;case UI_BUTTON:(n=t.parentControl?$("#tab"+t.parentControl):$("#row")).append("<div id='id"+t.id+"' class='one columns card tcenter "+colorClass(t.color)+"'><h5>"+t.label+"</h5><hr/><button id='btn"+t.id+"' onmousedown='buttonclick("+t.id+", true)' onmouseup='buttonclick("+t.id+", false)'>"+t.value+"</button></div>"),$("#btn"+t.id).on({touchstart:function(e){e.preventDefault(),buttonclick(t.id,!0)},touchend:function(e){e.preventDefault(),buttonclick(t.id,!1)}});break;case UI_SWITCHER:(n=t.parentControl?$("#tab"+t.parentControl):$("#row")).append("<div id='id"+t.id+"' class='one columns card tcenter "+colorClass(t.color)+"'><h5>"+t.label+"</h5><hr/><label id='sl"+t.id+"' class='switch "+("1"==t.value?"checked":"")+"'><div class='in'><input type='checkbox' id='s"+t.id+"' onClick='switcher("+t.id+",null)' "+("1"==t.value?"checked":"")+"/></div></label></div>"),switcher(t.id,t.value);break;case UI_CPAD:case UI_PAD:(n=t.parentControl?$("#tab"+t.parentControl):$("#row")).append("<div id='id"+t.id+"' class='two columns card 
)=====";

const uint8_t JS_CONTROLS_GZIP[3163] PROGMEM = { 31,139,8,0,0,0,0,0,0,3,221,90,11,83,219,72,18,254,43,66,217,2,233,80,108,43,9,217,68,70,80,142,113,18,239,26,204,129,217,108,93,54,71,141,173,49,86,69,150,180,163,17,14,11,254,239,215,243,146,70,178,77,30,228,246,42,87,84,25,205,76,247,215,61,61,61,61,61,143,73,18,103,212,184,232,95,246,79,250,163,126,103,112,249,230,162,239,63,105,181,28,168,58,235,13,134,157,35,40,185,206,197,233,81,103,212,187,28,190,126,125,222,27,249,174,104,31,245,71,189,129,207,63,79,129,174,160,226,5,198,212,191,236,178,239,39,170,161,43,90,158,176,150,87,23,163,209,240,196,127,170,218,100,217,109,61,101,173,131,206,43,128,126,166,26,69,209,109,61,99,109,231,239,250,163,238,219,222,153,191,167,154,139,26,183,181,199,41,6,253,35,40,61,47,218,69,217,109,61,103,173,39,23,199,175,160,244,179,106,149,101,183,245,51,239,84,239,247,17,24,227,244,98,228,191,80,20,90,157,219,122,193,168,222,156,117,78,223,250,47,157,206,209,145,248,190,60,29,246,79,88,179,211,29,244,58,103,146,192,109,189,228,152,157,87,190,91,152,71,148,184,121,206,123,131,94,23,184,10,11,169,10,151,219,104,120,58,234,51,155,20,70,82,21,46,55,210,113,31,62,11,27,241,146,203,45,116,220,249,221,119,11,235,240,146,43,12,51,234,157,250,110,105,23,94,116,185,85,222,116,46,222,244,124,183,176,138,44,187,220,40,157,110,151,217,159,25,100,196,91,101,5,39,7,15,56,26,190,3,225,206,160,247,122,4,163,125,214,127,243,118,4,35,219,237,157,140,192,176,207,156,238,229,232,226,236,159,23,195,254,121,15,136,187,151,189,227,222,89,103,192,60,166,123,121,218,3,154,179,254,111,64,248,4,138,239,122,163,206,249,233,219,206,128,3,92,158,95,156,188,30,12,223,73,148,110,231,236,108,56,130,113,239,94,118,6,253,127,117,206,160,203,207,161,112,212,57,251,21,198,179,123,121,50,60,233,249,79,246,246,218,215,136,24,11,60,206,146,201,71,231,138,160,116,118,132,40,242,99,188,48,58,132,160,27,103,134,178,206,100,130,35,127,203,117,178,40,12,48,233,38,49,13,227,60,201,51,168,107,79,243,120,66,195,36,54,38,73,148,144,110,132,178,204,194,246,109,182,8,233,100,102,97,255,36,159,143,49,129,42,251,118,130,50,108,104,61,244,8,166,57,137,77,248,249,51,79,194,12,155,109,73,34,187,173,8,240,28,19,20,5,69,115,105,9,69,145,98,138,9,9,175,49,41,136,74,251,40,162,5,166,40,75,103,40,162,5,81,97,53,69,147,229,241,52,74,22,26,142,48,165,106,159,32,66,146,146,95,25,87,53,163,40,252,11,145,48,46,8,152,157,85,99,128,200,71,179,29,224,41,202,35,170,42,205,229,82,27,2,176,109,140,39,20,7,21,211,18,252,103,142,51,58,36,33,142,41,98,85,167,152,204,195,44,131,47,203,190,93,22,132,25,186,198,111,212,32,66,75,148,76,80,116,78,19,130,174,112,35,195,180,79,241,220,50,113,150,230,33,31,235,204,116,126,57,31,158,52,50,10,58,95,133,211,27,171,112,1,219,94,106,242,51,192,208,144,97,128,153,210,200,175,8,184,90,43,160,68,108,139,46,27,113,30,69,91,62,58,180,144,207,165,167,136,100,216,2,137,239,241,7,239,253,135,170,92,68,40,116,228,39,43,72,38,249,28,186,111,55,80,16,88,230,63,76,187,145,76,167,150,237,252,100,153,143,72,178,128,242,140,206,35,203,52,109,71,26,179,49,137,18,0,182,29,137,178,212,124,53,62,7,67,230,89,15,70,147,0,254,26,243,115,224,130,16,224,9,158,39,215,88,120,184,201,189,253,241,21,193,56,54,237,21,82,80,177,66,71,112,176,134,74,232,203,85,48,154,198,73,98,72,241,76,195,237,71,47,158,63,221,107,175,225,42,123,93,169,141,173,219,73,20,78,62,122,210,104,75,173,187,51,20,7,17,254,45,204,194,113,24,133,244,166,11,21,87,120,77,183,239,238,148,153,27,179,48,8,112,124,119,87,140,129,230,101,114,80,10,90,232,110,239,26,62,6,97,70,113,12,179,221,188,46,100,77,184,44,211,89,175,131,179,229,218,142,37,213,240,77,115,203,95,132,113,144,44,26,204,177,152,176,70,154,16,122,119,247,162,181,169,229,217,179,167,235,155,14,89,12,123,135,199,231,128,140,169,101,46,50,175,217,52,119,235,164,179,36,163,49,154,227,93,211,91,109,100,56,187,102,115,1,22,246,190,22,142,115,177,129,73,82,28,251,202,120,108,234,192,184,101,73,132,129,233,10,112,68,223,13,70,245,5,158,180,201,227,40,254,4,74,21,3,89,78,2,205,165,91,203,98,102,36,49,159,27,159,87,139,147,1,90,125,198,232,80,152,85,109,132,194,107,152,249,170,163,73,