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