mirror of
https://github.com/s00500/ESPUI.git
synced 2024-11-21 17:40:54 +00:00
Added the dropdown-Control
* added the Control * added the frontend-code * added the control to the examples "gui-newAPI.ino" and "tabbedGui.ino"
This commit is contained in:
Christian Riggenbach
parent
3c42b43fe6
commit
6178e4fc22
@ -873,6 +873,17 @@ input {
|
||||
background: rgba(255, 255, 255, 0.8);
|
||||
}
|
||||
|
||||
select {
|
||||
margin: 0 auto 1.2rem auto;
|
||||
padding: 2px 5px;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
|
||||
background: rgba(255, 255, 255, 0.8);
|
||||
}
|
||||
|
||||
input[id^="num"] {
|
||||
max-width: 6em;
|
||||
width: auto;
|
||||
|
||||
2
data/css/style.min.css
vendored
2
data/css/style.min.css
vendored
File diff suppressed because one or more lines are too long
51
data/js/controls.js
vendored
51
data/js/controls.js
vendored
@ -27,6 +27,11 @@ const CLEAR_GRAPH = 109;
|
||||
const UI_TAB = 11;
|
||||
const UPDATE_TAB = 111;
|
||||
|
||||
const UI_SELECT = 12;
|
||||
const UPDATE_SELECT = 112;
|
||||
const UI_OPTION = 13;
|
||||
const UPDATE_OPTION = 113;
|
||||
|
||||
const FOR = 0;
|
||||
const BACK = 1;
|
||||
const LEFT = 2;
|
||||
@ -477,6 +482,44 @@ function start() {
|
||||
e.preventDefault();
|
||||
});
|
||||
break;
|
||||
|
||||
case UI_SELECT:
|
||||
var element;
|
||||
if(data.parentControl) {
|
||||
element = $("#tab"+data.parentControl);
|
||||
} else {
|
||||
element = $("#row")
|
||||
}
|
||||
element.append(
|
||||
"<div class='two columns card tcenter " +
|
||||
colorClass(data.color) +
|
||||
"'>" +
|
||||
"<h5 id='" +
|
||||
data.id +
|
||||
"'>" +
|
||||
data.label +
|
||||
"</h5><hr />" +
|
||||
"<select style='color:black;' id='select" +
|
||||
data.id +
|
||||
"' onchange='selectchange(" +
|
||||
data.id +
|
||||
")' />" +
|
||||
"</div>"
|
||||
);
|
||||
break;
|
||||
|
||||
case UI_OPTION:
|
||||
if(data.parentControl) {
|
||||
var element = $("#select"+data.parentControl);
|
||||
element.append(
|
||||
"<option id='option" + data.id + "' value='" + data.value + "'>" + data.label + "</option>"
|
||||
);
|
||||
}
|
||||
break;
|
||||
|
||||
case UPDATE_SELECT:
|
||||
$("#select" + data.id).val(data.value);
|
||||
break;
|
||||
|
||||
default:
|
||||
console.error("Unknown type or event");
|
||||
@ -496,6 +539,14 @@ function numberchange(number) {
|
||||
function textchange(number) {
|
||||
var val = $("#text" + number).val();
|
||||
websock.send("tvalue:" + val + ":" + number);
|
||||
console.log("tvalue:" + val + ":" + number);
|
||||
console.log(val);
|
||||
}
|
||||
|
||||
function selectchange(number) {
|
||||
var val = $("#select" + number).val();
|
||||
websock.send("svalue:" + val + ":" + number);
|
||||
console.log("svalue:" + val + ":" + number);
|
||||
console.log(val);
|
||||
}
|
||||
|
||||
|
||||
22
data/js/controls.min.js
vendored
22
data/js/controls.min.js
vendored
@ -1,4 +1,4 @@
|
||||
const UI_INITIAL_GUI=200;const UI_TITEL=0;const UI_BUTTON=1;const UI_PAD=2;const UI_CPAD=3;const UI_LABEL=4;const UPDATE_LABEL=104;const UI_SWITCHER=5;const UPDATE_SWITCHER=105;const UI_SLIDER=6;const UPDATE_SLIDER=106;const UI_NUMBER=7;const UPDATE_NUMBER=107;const UI_TEXT_INPUT=8;const UPDATE_TEXT_INPUT=108;const UI_GRAPH=9;const ADD_GRAPH_POINT=10;const CLEAR_GRAPH=109;const UI_TAB=11;const UPDATE_TAB=111;const FOR=0;const BACK=1;const LEFT=2;const RIGHT=3;const CENTER=4;const C_TURQUOISE=0;const C_EMERALD=1;const C_PETERRIVER=2;const C_WETASPHALT=3;const C_SUNFLOWER=4;const C_CARROT=5;const C_ALIZARIN=6;const C_DARK=7;const C_NONE=255;function colorClass(colorId){colorId=Number(colorId);switch(colorId){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"";}}
|
||||
const UI_INITIAL_GUI=200;const UI_TITEL=0;const UI_BUTTON=1;const UI_PAD=2;const UI_CPAD=3;const UI_LABEL=4;const UPDATE_LABEL=104;const UI_SWITCHER=5;const UPDATE_SWITCHER=105;const UI_SLIDER=6;const UPDATE_SLIDER=106;const UI_NUMBER=7;const UPDATE_NUMBER=107;const UI_TEXT_INPUT=8;const UPDATE_TEXT_INPUT=108;const UI_GRAPH=9;const ADD_GRAPH_POINT=10;const CLEAR_GRAPH=109;const UI_TAB=11;const UPDATE_TAB=111;const UI_SELECT=12;const UPDATE_SELECT=112;const UI_OPTION=13;const UPDATE_OPTION=113;const FOR=0;const BACK=1;const LEFT=2;const RIGHT=3;const CENTER=4;const C_TURQUOISE=0;const C_EMERALD=1;const C_PETERRIVER=2;const C_WETASPHALT=3;const C_SUNFLOWER=4;const C_CARROT=5;const C_ALIZARIN=6;const C_DARK=7;const C_NONE=255;function colorClass(colorId){colorId=Number(colorId);switch(colorId){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 websock;var websockConnected=false;function restart(){$(document).add("*").off();$("#row").html("");websock.close();start();}
|
||||
function conStatusError(){websockConnected=false;$("#conStatus").removeClass("color-green");$("#conStatus").addClass("color-red");$("#conStatus").html("Error / No Connection ↻");$("#conStatus").off();$("#conStatus").on({click:restart});}
|
||||
function handleVisibilityChange(){if(!websockConnected&&!document.hidden){restart();}}
|
||||
@ -143,9 +143,25 @@ data.value+
|
||||
data.id+
|
||||
")' />"+
|
||||
"</div>");break;case UPDATE_TEXT_INPUT:$("#text"+data.id).val(data.value);break;case UI_TAB:$("#tabsnav").append("<li><a href='#tab"+data.id+"'>"+data.value+"</a></li>");$("#tabscontent").append("<div id='tab"+data.id+"'></div>");tabs=$('.tabscontent').tabbedContent({loop:true}).data('api');$('a').filter(function(){return $(this).attr('href')==='#click-to-switch';}).on('click',function(e){var tab=prompt('Tab to switch to (number or id)?');if(!tabs.switchTab(tab)){alert('That tab does not exist :\\');}
|
||||
e.preventDefault();});break;default:console.error("Unknown type or event");break;}};websock.onmessage=handleEvent;}
|
||||
e.preventDefault();});break;case UI_SELECT:var element;if(data.parentControl){element=$("#tab"+data.parentControl);}else{element=$("#row")}
|
||||
element.append("<div class='two columns card tcenter "+
|
||||
colorClass(data.color)+
|
||||
"'>"+
|
||||
"<h5 id='"+
|
||||
data.id+
|
||||
"'>"+
|
||||
data.label+
|
||||
"</h5><hr />"+
|
||||
"<select style='color:black;' id='select"+
|
||||
data.id+
|
||||
"' onchange='selectchange("+
|
||||
data.id+
|
||||
")' />"+
|
||||
"</div>");break;case UI_OPTION:if(data.parentControl){var element=$("#select"+data.parentControl);element.append("<option id='option"+data.id+"' value='"+data.value+"'>"+data.label+"</option>");}
|
||||
break;case UPDATE_SELECT:$("#select"+data.id).val(data.value);break;default:console.error("Unknown type or event");break;}};websock.onmessage=handleEvent;}
|
||||
function numberchange(number){var val=$("#num"+number).val();websock.send("nvalue:"+val+":"+number);console.log(val);}
|
||||
function textchange(number){var val=$("#text"+number).val();websock.send("tvalue:"+val+":"+number);console.log(val);}
|
||||
function textchange(number){var val=$("#text"+number).val();websock.send("tvalue:"+val+":"+number);console.log("tvalue:"+val+":"+number);console.log(val);}
|
||||
function selectchange(number){var val=$("#select"+number).val();websock.send("svalue:"+val+":"+number);console.log("svalue:"+val+":"+number);console.log(val);}
|
||||
function buttonclick(number,isdown){if(isdown)websock.send("bdown:"+number);else websock.send("bup:"+number);}
|
||||
function padclick(type,number,isdown){switch(type){case CENTER:if(isdown)websock.send("pcdown:"+number);else websock.send("pcup:"+number);break;case FOR:if(isdown)websock.send("pfdown:"+number);else websock.send("pfup:"+number);break;case BACK:if(isdown)websock.send("pbdown:"+number);else websock.send("pbup:"+number);break;case LEFT:if(isdown)websock.send("pldown:"+number);else websock.send("plup:"+number);break;case RIGHT:if(isdown)websock.send("prdown:"+number);else websock.send("prup:"+number);break;}}
|
||||
function switcher(number,state){if(state==null){if($("#s"+number).is(":checked")){websock.send("sactive:"+number);$("#sl"+number).addClass("checked");}else{websock.send("sinactive:"+number);$("#sl"+number).removeClass("checked");}}else if(state==1){$("#sl"+number).addClass("checked");$("#sl"+number).prop("checked",true);}else if(state==0){$("#sl"+number).removeClass("checked");$("#sl"+number).prop("checked",false);}}
|
||||
@ -118,7 +118,14 @@ void switchExample( Control* sender, int value ) {
|
||||
}
|
||||
|
||||
Serial.print( " " );
|
||||
Serial.println( sender.id );
|
||||
Serial.println( sender->id );
|
||||
}
|
||||
|
||||
void selectExample( Control* sender, int value ) {
|
||||
Serial.print("Select: ID: ");
|
||||
Serial.print(sender->id);
|
||||
Serial.print(", Value: ");
|
||||
Serial.println( sender->value );
|
||||
}
|
||||
|
||||
void otherSwitchExample( Control* sender, int value ) {
|
||||
@ -186,6 +193,12 @@ void setup( void ) {
|
||||
Serial.println( WiFi.getMode() == WIFI_AP ? WiFi.softAPIP() : WiFi.localIP() );
|
||||
|
||||
ESPUI.addControl( ControlType::Label, "Status:", "Stop", ControlColor::Turquoise );
|
||||
|
||||
uint16_t select1 = ESPUI.addControl( ControlType::Select, "Select:", "", ControlColor::Alizarin, Control::noParent, &selectExample );
|
||||
ESPUI.addControl( ControlType::Option, "Option1", "Opt1", ControlColor::Alizarin, select1 );
|
||||
ESPUI.addControl( ControlType::Option, "Option2", "Opt2", ControlColor::Alizarin, select1 );
|
||||
ESPUI.addControl( ControlType::Option, "Option3", "Opt3", ControlColor::Alizarin, select1 );
|
||||
|
||||
ESPUI.addControl( ControlType::Text, "Text Test:", "a Text Field", ControlColor::Alizarin, Control::noParent, &textCall );
|
||||
ESPUI.addControl( ControlType::Label, "Millis:", "0", ControlColor::Emerald, Control::noParent );
|
||||
ESPUI.addControl( ControlType::Button, "Push Button", "Press", ControlColor::Peterriver, Control::noParent, &buttonCallback );
|
||||
|
||||
@ -118,7 +118,14 @@ void switchExample( Control* sender, int value ) {
|
||||
}
|
||||
|
||||
Serial.print( " " );
|
||||
Serial.println( sender.id );
|
||||
Serial.println( sender->id );
|
||||
}
|
||||
|
||||
void selectExample( Control* sender, int value ) {
|
||||
Serial.print("Select: ID: ");
|
||||
Serial.print(sender->id);
|
||||
Serial.print(", Value: ");
|
||||
Serial.println( sender->value );
|
||||
}
|
||||
|
||||
void otherSwitchExample( Control* sender, int value ) {
|
||||
@ -191,6 +198,11 @@ void setup( void ) {
|
||||
|
||||
// shown above all tabs
|
||||
ESPUI.addControl( ControlType::Label, "Status:", "Stop", ControlColor::Turquoise );
|
||||
|
||||
uint16_t select1 = ESPUI.addControl( ControlType::Select, "Select:", "", ControlColor::Alizarin, tab1, &selectExample );
|
||||
ESPUI.addControl( ControlType::Option, "Option1", "Opt1", ControlColor::Alizarin, select1 );
|
||||
ESPUI.addControl( ControlType::Option, "Option2", "Opt2", ControlColor::Alizarin, select1 );
|
||||
ESPUI.addControl( ControlType::Option, "Option3", "Opt3", ControlColor::Alizarin, select1 );
|
||||
|
||||
ESPUI.addControl( ControlType::Text, "Text Test:", "a Text Field", ControlColor::Alizarin, tab1, &textCall );
|
||||
|
||||
|
||||
@ -370,6 +370,10 @@ void onWsEvent( AsyncWebSocket* server, AsyncWebSocketClient* client,
|
||||
String value = msg.substring( msg.indexOf( ':' ) + 1, msg.lastIndexOf( ':' ) );
|
||||
ESPUI.updateText( c->id, value, client->id() );
|
||||
c->callback( c, T_VALUE );
|
||||
} else if ( msg.startsWith( "svalue:" ) ) {
|
||||
String value = msg.substring( msg.indexOf( ':' ) + 1, msg.lastIndexOf( ':' ) );
|
||||
ESPUI.updateSelect( c->id, value, client->id() );
|
||||
c->callback( c, S_VALUE );
|
||||
} else {
|
||||
if ( ESPUI.verbosity ) {
|
||||
Serial.println( "Malformated message from the websocket" );
|
||||
@ -601,6 +605,14 @@ void ESPUIClass::updateText( String label, String text, int clientId ) {
|
||||
updateControl( label, text, clientId );
|
||||
}
|
||||
|
||||
void ESPUIClass::updateSelect( uint16_t id, String text, int clientId ) {
|
||||
updateControl( id, text, clientId );
|
||||
}
|
||||
|
||||
void ESPUIClass::updateSelect( String label, String text, int clientId ) {
|
||||
updateControl( label, text, clientId );
|
||||
}
|
||||
|
||||
/*
|
||||
Convert & Transfer Arduino elements to JSON elements
|
||||
Initially this function used to send the control element data individually.
|
||||
|
||||
@ -49,6 +49,8 @@ enum ControlType : uint8_t {
|
||||
Graph,
|
||||
GraphPoint,
|
||||
Tab,
|
||||
Select,
|
||||
Option,
|
||||
|
||||
UpdateOffset = 100,
|
||||
UpdateLabel = 104,
|
||||
@ -58,6 +60,8 @@ enum ControlType : uint8_t {
|
||||
UpdateText,
|
||||
ClearGraph,
|
||||
UpdateTab,
|
||||
UpdateSelection,
|
||||
UpdateOption,
|
||||
|
||||
InitialGui = 200
|
||||
};
|
||||
@ -157,6 +161,7 @@ class Control {
|
||||
#define SL_VALUE 8
|
||||
#define N_VALUE 9
|
||||
#define T_VALUE 10
|
||||
#define S_VALUE 11
|
||||
|
||||
enum Verbosity : uint8_t {
|
||||
Quiet = 0,
|
||||
@ -235,6 +240,9 @@ class ESPUIClass {
|
||||
void updateText( uint16_t id, String nValue, int clientId = -1 );
|
||||
void updateText( String label, String nValue, int clientId = -1 );
|
||||
|
||||
void updateSelect( uint16_t id, String nValue, int clientId = -1 );
|
||||
void updateSelect( String label, String nValue, int clientId = -1 );
|
||||
|
||||
void clearGraph( uint16_t id, int clientId = -1 );
|
||||
void clearGraph( String label, int clientId = -1 );
|
||||
|
||||
|
||||
File diff suppressed because one or more lines are too long
@ -2,4 +2,4 @@ const char HTML_INDEX[] PROGMEM = R"=====(
|
||||
<!DOCTYPE html><html> <head><meta charset=utf-8><title>Control</title><meta name=viewport content="width=device-width, initial-scale=1"><link rel="shortcut icon" href=data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAPFBMVEUAAACA1VWR21qQ2liR3FqR3FqS3VuR3VqR3VuR3VqO21mS21uS3FqS3FqS21uJ2GKQ21qR3FuR3FoAAAB/3Gu7AAAAEnRSTlMABoA3kPBwz8i5Kzioxg4NVcU3uEJHAAAAAWJLR0QAiAUdSAAAAAlwSFlzAAAN1wAADdcBQiibeAAAAAd0SU1FB+EFEhcEM+HpYwQAAABYSURBVBjThY/JDsAgCESt4lpX/v9jLQZJ6qF9t3khAyj1xXUKbQ4BVowDwqOYgExkkW4iY6lPaF06RqM8YItOuRbMaz6xjbsusDAW/drplBg47jP696cXE8bPA1eUDeK2AAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDE3LTA1LTE4VDIzOjA0OjUxKzAyOjAwxE59ewAAACV0RVh0ZGF0ZTptb2RpZnkAMjAxNy0wNS0xOFQyMzowNDo1MSswMjowMLUTxccAAAAZdEVYdFNvZnR3YXJlAHd3dy5pbmtzY2FwZS5vcmeb7jwaAAAAAElFTkSuQmCC><link rel=stylesheet href=/css/normalize.css><link rel=stylesheet href=/css/style.css><script src=/js/zepto.min.js></script><script src=/js/slider.js></script><script src=/js/controls.js></script><script src=/js/tabbedcontent.js></script></head> <body onload=javascript:start();> <div> <h4><div id=mainHeader>Control</div> <span id=conStatus class=label>Offline</span></h4></div> <hr> <div class=container> <div id=row class="row u-full-width"></div> <ul id=tabsnav class="nav nav-tabs u-full-width"></ul> <div id=tabscontent class="tabscontent u-full-width"></div> </div> </body> </html>
|
||||
)=====";
|
||||
|
||||
const uint8_t HTML_INDEX_GZIP[904] PROGMEM = { 31,139,8,0,174,85,124,92,2,255,133,84,109,147,162,56,16,254,43,156,159,238,106,119,6,81,199,153,217,21,171,130,130,51,42,34,32,40,126,11,144,145,96,120,25,18,68,253,245,151,200,204,237,94,237,213,158,85,73,58,221,207,243,116,211,66,143,254,152,90,147,77,176,214,165,132,101,100,60,186,237,210,40,65,48,30,143,50,196,160,20,37,176,162,136,169,53,123,187,123,26,143,24,102,4,141,39,69,206,170,130,140,228,246,218,34,115,152,33,245,132,81,83,22,21,147,34,14,65,57,83,59,13,142,89,162,198,232,132,35,116,119,187,124,149,112,142,25,134,228,142,70,144,32,85,233,140,71,4,231,71,169,66,68,237,208,132,211,163,154,73,152,75,116,164,164,66,111,106,12,25,252,134,51,120,64,114,153,31,190,135,144,162,225,224,43,246,53,203,105,186,139,217,161,0,252,183,114,189,68,247,14,220,210,196,21,216,19,96,138,179,88,218,207,27,97,104,179,88,219,120,58,0,203,217,122,34,159,19,205,230,206,137,150,186,198,124,197,163,195,57,231,30,94,185,115,45,244,38,96,200,247,88,48,173,82,168,14,51,190,25,253,73,84,19,253,73,232,173,13,205,244,117,239,134,85,252,173,211,83,222,237,30,193,78,223,120,23,203,237,251,181,211,247,185,221,158,86,79,201,220,158,82,187,183,24,95,220,158,247,102,11,155,243,56,158,99,12,145,87,147,251,179,250,81,232,235,185,227,110,136,9,180,2,244,143,107,173,185,62,225,135,197,21,23,231,195,96,229,71,94,191,214,231,47,183,39,221,206,151,78,215,6,24,120,177,123,115,144,198,53,200,85,244,68,105,0,152,198,145,102,99,28,162,91,44,238,186,158,98,104,95,116,67,79,34,221,252,242,82,6,141,104,132,22,184,158,163,249,90,186,73,2,121,62,165,224,48,209,93,54,32,229,78,62,61,167,75,123,63,31,190,27,207,172,127,76,192,37,85,206,59,111,17,218,3,205,47,154,105,243,110,5,7,253,124,60,110,7,56,24,146,53,52,186,67,231,221,124,10,94,153,85,59,161,9,175,195,115,26,210,154,78,193,86,142,171,146,104,135,193,99,186,30,62,15,163,157,254,20,174,129,130,188,41,90,244,68,117,243,157,99,108,95,156,99,176,115,136,149,173,46,251,173,209,221,219,224,98,78,245,254,114,3,148,229,70,31,248,211,215,171,149,130,174,149,122,231,197,21,92,184,221,156,245,135,103,212,136,191,194,239,58,126,210,221,207,56,111,83,178,176,231,148,251,252,8,204,20,156,87,151,110,179,114,187,103,203,176,47,230,181,104,86,211,66,49,93,218,152,105,209,152,75,111,115,142,34,81,194,62,214,253,32,54,86,167,125,238,244,131,221,156,128,151,184,31,95,30,202,48,99,215,160,103,52,123,247,225,20,101,40,124,76,27,120,107,169,78,140,205,209,173,237,108,50,249,233,77,166,236,66,16,77,16,98,237,75,44,71,148,202,121,81,101,144,224,43,186,231,183,255,3,223,156,45,144,70,21,46,153,68,171,72,149,83,42,95,81,201,138,251,12,231,247,41,15,202,109,244,23,20,37,56,70,213,111,33,81,251,37,211,223,130,24,12,67,20,127,124,209,255,70,202,183,81,33,141,194,34,190,72,69,78,10,24,171,41,60,193,54,254,141,50,88,177,63,255,250,206,17,49,62,137,201,50,24,11,75,194,177,154,65,156,191,112,54,170,126,204,147,22,68,75,152,11,4,207,232,50,200,106,42,69,4,82,170,18,24,34,50,182,222,222,120,219,16,175,129,195,68,5,92,242,131,152,84,109,162,15,188,168,152,39,65,159,94,46,89,21,205,71,176,35,204,250,238,173,38,164,29,75,157,127,100,106,34,160,252,169,105,14,63,181,58,194,228,235,78,184,127,225,213,228,71,10,1,248,232,213,39,247,103,215,127,167,252,60,68,31,197,217,14,226,191,1,165,144,19,235,159,5,0,0 };
|
||||
const uint8_t HTML_INDEX_GZIP[904] PROGMEM = { 31,139,8,0,92,132,125,92,2,255,133,84,109,147,162,56,16,254,43,156,159,238,106,119,6,81,199,153,217,21,171,130,130,51,42,34,32,40,126,11,144,145,96,120,25,18,68,253,245,151,200,204,237,94,237,213,158,85,73,58,221,207,243,116,211,66,143,254,152,90,147,77,176,214,165,132,101,100,60,186,237,210,40,65,48,30,143,50,196,160,20,37,176,162,136,169,53,123,187,123,26,143,24,102,4,141,39,69,206,170,130,140,228,246,218,34,115,152,33,245,132,81,83,22,21,147,34,14,65,57,83,59,13,142,89,162,198,232,132,35,116,119,187,124,149,112,142,25,134,228,142,70,144,32,85,233,140,71,4,231,71,169,66,68,237,208,132,211,163,154,73,152,75,116,164,164,66,111,106,12,25,252,134,51,120,64,114,153,31,190,135,144,162,225,224,43,246,53,203,105,186,139,217,161,0,252,183,114,189,68,247,14,220,210,196,21,216,19,96,138,179,88,218,207,27,97,104,179,88,219,120,58,0,203,217,122,34,159,19,205,230,206,137,150,186,198,124,197,163,195,57,231,30,94,185,115,45,244,38,96,200,247,88,48,173,82,168,14,51,190,25,253,73,84,19,253,73,232,173,13,205,244,117,239,134,85,252,173,211,83,222,237,30,193,78,223,120,23,203,237,251,181,211,247,185,221,158,86,79,201,220,158,82,187,183,24,95,220,158,247,102,11,155,243,56,158,99,12,145,87,147,251,179,250,81,232,235,185,227,110,136,9,180,2,244,143,107,173,185,62,225,135,197,21,23,231,195,96,229,71,94,191,214,231,47,183,39,221,206,151,78,215,6,24,120,177,123,115,144,198,53,200,85,244,68,105,0,152,198,145,102,99,28,162,91,44,238,186,158,98,104,95,116,67,79,34,221,252,242,82,6,141,104,132,22,184,158,163,249,90,186,73,2,121,62,165,224,48,209,93,54,32,229,78,62,61,167,75,123,63,31,190,27,207,172,127,76,192,37,85,206,59,111,17,218,3,205,47,154,105,243,110,5,7,253,124,60,110,7,56,24,146,53,52,186,67,231,221,124,10,94,153,85,59,161,9,175,195,115,26,210,154,78,193,86,142,171,146,104,135,193,99,186,30,62,15,163,157,254,20,174,129,130,188,41,90,244,68,117,243,157,99,108,95,156,99,176,115,136,149,173,46,251,173,209,221,219,224,98,78,245,254,114,3,148,229,70,31,248,211,215,171,149,130,174,149,122,231,197,21,92,184,221,156,245,135,103,212,136,191,194,239,58,126,210,221,207,56,111,83,178,176,231,148,251,252,8,204,20,156,87,151,110,179,114,187,103,203,176,47,230,181,104,86,211,66,49,93,218,152,105,209,152,75,111,115,142,34,81,194,62,214,253,32,54,86,167,125,238,244,131,221,156,128,151,184,31,95,30,202,48,99,215,160,103,52,123,247,225,20,101,40,124,76,27,120,107,169,78,140,205,209,173,237,108,50,249,233,77,166,236,66,16,77,16,98,237,75,44,71,148,202,121,81,101,144,224,43,186,231,183,255,3,223,156,45,144,70,21,46,153,68,171,72,149,83,42,95,81,201,138,251,12,231,247,41,15,202,109,244,23,20,37,56,70,213,111,33,81,251,37,211,223,130,24,12,67,20,127,124,209,255,70,202,183,81,33,141,194,34,190,72,69,78,10,24,171,41,60,193,54,254,141,50,88,177,63,255,250,206,17,49,62,137,201,50,24,11,75,194,177,154,65,156,191,112,54,170,126,204,147,22,68,75,152,11,4,207,232,50,200,106,42,69,4,82,170,18,24,34,50,182,222,222,120,219,16,175,129,195,68,5,92,242,131,152,84,109,162,15,188,168,152,39,65,159,94,46,89,21,205,71,176,35,204,250,238,173,38,164,29,75,157,127,100,106,34,160,252,169,105,14,63,181,58,194,228,235,78,184,127,225,213,228,71,10,1,248,232,213,39,247,103,215,127,167,252,60,68,31,197,217,14,226,191,1,165,144,19,235,159,5,0,0 };
|
||||
|
||||
@ -2,4 +2,4 @@ const char CSS_NORMALIZE[] PROGMEM = R"=====(
|
||||
html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:bold}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}
|
||||
)=====";
|
||||
|
||||
const uint8_t CSS_NORMALIZE_GZIP[861] PROGMEM = { 31,139,8,0,173,85,124,92,2,255,149,84,237,142,155,58,16,125,149,104,171,74,183,146,137,216,237,199,94,25,221,39,137,242,99,176,7,112,227,47,217,38,155,20,241,238,119,12,132,36,219,108,165,254,2,6,123,230,204,57,103,166,75,70,15,141,179,169,104,192,40,125,230,17,108,44,34,6,213,84,133,137,69,194,83,42,162,250,133,5,200,159,125,76,252,185,44,63,87,197,27,214,7,149,30,255,29,107,39,207,131,129,208,42,203,203,17,66,82,66,35,131,168,36,50,137,9,148,142,172,81,173,0,159,148,179,249,181,15,200,26,231,18,6,214,33,200,252,104,131,235,61,51,160,44,51,104,123,102,225,200,34,138,233,70,236,13,165,63,15,82,69,175,225,204,107,237,196,97,132,94,42,199,4,216,35,68,230,131,107,3,198,200,142,84,213,173,39,149,213,202,98,49,93,168,142,152,161,129,46,64,171,214,242,26,34,230,191,115,34,110,93,250,103,39,136,153,224,116,220,127,89,83,88,103,177,234,80,181,93,162,238,118,157,146,18,237,158,37,52,244,59,225,221,185,17,134,26,196,33,247,98,101,33,156,118,129,167,64,12,123,8,104,211,8,28,168,163,35,145,195,59,71,112,6,215,167,12,33,211,86,215,97,151,84,210,184,31,106,23,136,147,162,118,41,57,195,159,253,105,35,233,21,229,88,179,72,240,108,59,43,248,54,131,170,157,150,163,108,236,28,140,233,172,145,171,68,61,138,177,123,94,130,36,25,127,65,83,45,42,109,127,188,162,217,148,35,125,30,110,16,243,79,77,83,86,51,236,79,101,89,142,209,128,214,55,41,254,37,181,99,79,40,122,127,19,125,253,254,185,154,104,190,176,84,121,23,85,86,142,7,36,142,168,225,15,185,207,153,146,243,188,216,126,71,147,115,15,75,215,197,246,37,71,148,105,23,58,136,163,120,108,39,153,120,32,239,124,25,50,131,141,118,111,124,214,100,156,141,117,113,226,51,117,248,173,244,167,177,11,67,97,220,47,162,243,148,241,42,219,242,44,51,233,145,67,213,7,225,85,113,79,41,215,74,208,39,55,10,71,198,62,212,146,76,135,44,130,241,119,3,101,156,117,164,183,64,182,190,85,87,174,8,213,88,247,212,161,101,202,250,62,49,231,211,108,125,34,132,236,206,242,136,145,89,96,152,101,80,182,163,217,76,83,134,245,99,157,181,57,211,21,222,81,69,85,107,188,84,152,83,14,211,212,78,54,108,92,48,179,81,151,19,29,173,131,205,4,100,151,206,30,255,123,154,227,79,123,118,27,164,193,194,244,46,70,82,25,69,193,225,178,27,192,123,4,42,34,144,207,73,42,209,135,72,45,120,167,136,214,176,148,220,209,188,0,97,148,251,219,226,107,112,88,46,73,108,160,215,105,185,196,249,164,96,227,68,31,11,101,45,45,140,233,222,239,241,213,44,149,7,41,179,168,229,56,29,29,110,29,106,137,7,208,227,109,63,162,67,113,32,225,223,183,14,180,27,158,242,72,174,46,89,167,243,244,190,198,114,199,246,166,198,240,180,39,116,11,55,19,180,34,122,101,139,91,241,63,60,79,107,225,254,252,176,0,159,252,119,39,3,113,46,186,199,50,100,221,27,133,90,86,127,242,255,229,226,95,141,199,67,12,87,252,115,164,16,25,134,126,212,242,135,87,36,10,23,32,239,142,71,29,77,214,157,90,34,67,94,164,206,251,49,58,173,228,38,42,77,147,176,142,199,230,197,95,37,218,126,165,117,178,217,254,120,153,30,175,121,183,104,108,209,202,71,142,89,135,240,126,240,47,179,250,251,250,77,217,189,151,189,77,147,171,193,71,228,151,151,106,249,145,151,193,82,64,178,212,13,215,130,255,3,4,241,118,208,151,7,0,0 };
|
||||
const uint8_t CSS_NORMALIZE_GZIP[861] PROGMEM = { 31,139,8,0,92,132,125,92,2,255,149,84,237,142,155,58,16,125,149,104,171,74,183,146,137,216,237,199,94,25,221,39,137,242,99,176,7,112,227,47,217,38,155,20,241,238,119,12,132,36,219,108,165,254,2,6,123,230,204,57,103,166,75,70,15,141,179,169,104,192,40,125,230,17,108,44,34,6,213,84,133,137,69,194,83,42,162,250,133,5,200,159,125,76,252,185,44,63,87,197,27,214,7,149,30,255,29,107,39,207,131,129,208,42,203,203,17,66,82,66,35,131,168,36,50,137,9,148,142,172,81,173,0,159,148,179,249,181,15,200,26,231,18,6,214,33,200,252,104,131,235,61,51,160,44,51,104,123,102,225,200,34,138,233,70,236,13,165,63,15,82,69,175,225,204,107,237,196,97,132,94,42,199,4,216,35,68,230,131,107,3,198,200,142,84,213,173,39,149,213,202,98,49,93,168,142,152,161,129,46,64,171,214,242,26,34,230,191,115,34,110,93,250,103,39,136,153,224,116,220,127,89,83,88,103,177,234,80,181,93,162,238,118,157,146,18,237,158,37,52,244,59,225,221,185,17,134,26,196,33,247,98,101,33,156,118,129,167,64,12,123,8,104,211,8,28,168,163,35,145,195,59,71,112,6,215,167,12,33,211,86,215,97,151,84,210,184,31,106,23,136,147,162,118,41,57,195,159,253,105,35,233,21,229,88,179,72,240,108,59,43,248,54,131,170,157,150,163,108,236,28,140,233,172,145,171,68,61,138,177,123,94,130,36,25,127,65,83,45,42,109,127,188,162,217,148,35,125,30,110,16,243,79,77,83,86,51,236,79,101,89,142,209,128,214,55,41,254,37,181,99,79,40,122,127,19,125,253,254,185,154,104,190,176,84,121,23,85,86,142,7,36,142,168,225,15,185,207,153,146,243,188,216,126,71,147,115,15,75,215,197,246,37,71,148,105,23,58,136,163,120,108,39,153,120,32,239,124,25,50,131,141,118,111,124,214,100,156,141,117,113,226,51,117,248,173,244,167,177,11,67,97,220,47,162,243,148,241,42,219,242,44,51,233,145,67,213,7,225,85,113,79,41,215,74,208,39,55,10,71,198,62,212,146,76,135,44,130,241,119,3,101,156,117,164,183,64,182,190,85,87,174,8,213,88,247,212,161,101,202,250,62,49,231,211,108,125,34,132,236,206,242,136,145,89,96,152,101,80,182,163,217,76,83,134,245,99,157,181,57,211,21,222,81,69,85,107,188,84,152,83,14,211,212,78,54,108,92,48,179,81,151,19,29,173,131,205,4,100,151,206,30,255,123,154,227,79,123,118,27,164,193,194,244,46,70,82,25,69,193,225,178,27,192,123,4,42,34,144,207,73,42,209,135,72,45,120,167,136,214,176,148,220,209,188,0,97,148,251,219,226,107,112,88,46,73,108,160,215,105,185,196,249,164,96,227,68,31,11,101,45,45,140,233,222,239,241,213,44,149,7,41,179,168,229,56,29,29,110,29,106,137,7,208,227,109,63,162,67,113,32,225,223,183,14,180,27,158,242,72,174,46,89,167,243,244,190,198,114,199,246,166,198,240,180,39,116,11,55,19,180,34,122,101,139,91,241,63,60,79,107,225,254,252,176,0,159,252,119,39,3,113,46,186,199,50,100,221,27,133,90,86,127,242,255,229,226,95,141,199,67,12,87,252,115,164,16,25,134,126,212,242,135,87,36,10,23,32,239,142,71,29,77,214,157,90,34,67,94,164,206,251,49,58,173,228,38,42,77,147,176,142,199,230,197,95,37,218,126,165,117,178,217,254,120,153,30,175,121,183,104,108,209,202,71,142,89,135,240,126,240,47,179,250,251,250,77,217,189,151,189,77,147,171,193,71,228,151,151,106,249,145,151,193,82,64,178,212,13,215,130,255,3,4,241,118,208,151,7,0,0 };
|
||||
|
||||
@ -11,4 +11,4 @@ var upFu=function(e){$(this).off(handlers);};var handlers={mouseup:upFu,touchend
|
||||
function slider_move(parents,newW,sliderW,send){var slider_new_val=parseInt(Math.round(newW/sliderW*100));var slider_fill=parents.find('.slider-fill');var slider_handle=parents.find('.slider-handle');var range=parents.find('input[type="range"]');slider_fill.css('width',slider_new_val+'%');slider_handle.css({'left':slider_new_val+'%','transition':'none','-webkit-transition':'none','-moz-transition':'none'});range.val(slider_new_val);if(parents.find('.slider-handle span').text()!=slider_new_val){parents.find('.slider-handle span').text(slider_new_val);var number=parents.attr('id').substring(2);if(send)websock.send('slvalue:'+slider_new_val+':'+number);}}
|
||||
)=====";
|
||||
|
||||
const uint8_t JS_SLIDER_GZIP[865] PROGMEM = { 31,139,8,0,174,85,124,92,2,255,237,86,207,111,155,48,20,190,247,175,72,163,174,134,149,184,89,143,33,238,101,211,164,29,118,218,164,77,170,170,200,1,83,172,16,131,176,73,182,209,252,239,123,254,1,1,66,170,110,167,29,118,194,246,251,252,252,222,247,62,243,156,84,34,82,60,23,147,114,179,141,87,37,21,79,236,75,198,99,86,122,146,101,44,82,121,233,215,59,90,78,96,150,4,210,88,86,123,30,171,180,153,228,73,34,153,10,162,170,20,202,173,125,224,50,42,153,98,129,113,231,22,67,237,129,92,29,221,134,93,111,68,91,177,25,122,173,197,186,182,38,59,246,124,156,177,68,133,253,115,12,98,176,134,25,141,82,47,113,217,121,60,216,249,181,137,17,66,80,41,151,126,104,102,152,22,5,19,177,215,223,188,82,219,34,131,195,252,208,100,64,44,52,225,0,68,92,20,149,122,80,63,11,70,166,198,58,125,68,77,196,61,32,182,107,173,113,149,240,44,35,118,220,135,204,180,229,136,75,169,136,51,54,142,180,182,35,54,163,107,118,198,169,49,1,82,87,207,4,186,218,209,140,20,180,148,236,147,80,158,89,194,176,164,211,236,68,136,35,41,61,100,42,129,130,118,223,13,122,51,12,208,2,117,57,206,225,76,4,46,42,89,80,129,124,172,216,15,119,180,70,251,225,193,15,109,121,133,135,182,121,37,89,156,239,197,68,229,85,148,74,69,75,112,61,76,61,104,107,202,252,154,39,30,195,235,74,169,92,16,66,238,252,26,170,7,37,152,36,52,147,44,60,92,232,220,33,99,38,148,108,234,142,221,28,136,210,146,159,181,85,50,42,239,74,210,1,91,85,118,0,78,153,13,162,47,78,141,139,82,22,109,236,117,106,81,47,232,7,115,136,103,17,115,73,215,25,139,33,24,72,172,235,130,16,85,86,236,36,189,38,37,26,199,239,51,170,203,193,229,140,2,59,59,230,18,218,230,59,246,177,34,93,206,44,39,79,236,59,97,216,124,159,159,161,150,169,62,39,254,170,137,103,242,97,254,104,77,221,156,5,219,183,196,128,105,214,163,66,7,60,196,45,73,151,206,235,235,203,83,4,154,35,223,175,221,178,142,213,115,100,5,67,104,255,223,99,216,8,15,7,19,95,85,12,50,108,104,129,208,60,171,154,18,238,123,191,12,184,195,20,46,153,62,123,132,66,123,64,227,131,212,70,162,26,187,176,196,6,70,169,221,5,131,168,138,133,14,202,90,225,247,98,102,135,240,202,139,243,168,218,66,20,190,22,252,49,180,215,223,130,255,242,31,164,119,34,78,39,234,127,65,158,23,127,160,206,81,165,253,133,142,14,97,115,214,100,188,167,153,251,111,198,4,45,99,190,155,68,90,246,100,106,209,211,123,116,115,49,178,110,90,212,244,126,121,11,150,115,16,27,7,128,78,77,166,19,128,69,119,129,251,249,242,214,124,173,179,142,75,59,10,93,149,77,140,64,226,32,159,126,29,160,0,223,28,247,240,5,138,220,107,229,88,158,94,211,251,76,85,138,203,188,2,37,234,157,183,110,231,219,119,243,185,223,83,184,233,213,131,63,70,191,89,119,192,174,97,143,195,219,142,221,246,225,215,220,136,179,29,185,159,217,185,182,92,219,190,188,56,69,7,72,193,33,146,107,70,209,2,137,92,64,75,69,179,61,91,111,184,154,141,218,182,249,175,17,195,193,61,142,204,19,162,127,142,185,191,47,177,49,233,190,6,252,75,50,216,94,191,122,239,240,92,205,177,168,182,107,120,138,53,62,168,82,37,144,12,127,21,44,171,181,84,37,23,79,222,157,9,209,232,5,50,151,121,180,193,122,2,207,148,12,252,84,108,129,110,134,212,193,146,245,172,251,206,111,101,146,232,206,54,11,0,0 };
|
||||
const uint8_t JS_SLIDER_GZIP[865] PROGMEM = { 31,139,8,0,92,132,125,92,2,255,237,86,207,111,155,48,20,190,247,175,72,163,174,134,149,184,89,143,33,238,101,211,164,29,118,218,164,77,170,170,200,1,83,172,16,131,176,73,182,209,252,239,123,254,1,1,66,170,110,167,29,118,194,246,251,252,252,222,247,62,243,156,84,34,82,60,23,147,114,179,141,87,37,21,79,236,75,198,99,86,122,146,101,44,82,121,233,215,59,90,78,96,150,4,210,88,86,123,30,171,180,153,228,73,34,153,10,162,170,20,202,173,125,224,50,42,153,98,129,113,231,22,67,237,129,92,29,221,134,93,111,68,91,177,25,122,173,197,186,182,38,59,246,124,156,177,68,133,253,115,12,98,176,134,25,141,82,47,113,217,121,60,216,249,181,137,17,66,80,41,151,126,104,102,152,22,5,19,177,215,223,188,82,219,34,131,195,252,208,100,64,44,52,225,0,68,92,20,149,122,80,63,11,70,166,198,58,125,68,77,196,61,32,182,107,173,113,149,240,44,35,118,220,135,204,180,229,136,75,169,136,51,54,142,180,182,35,54,163,107,118,198,169,49,1,82,87,207,4,186,218,209,140,20,180,148,236,147,80,158,89,194,176,164,211,236,68,136,35,41,61,100,42,129,130,118,223,13,122,51,12,208,2,117,57,206,225,76,4,46,42,89,80,129,124,172,216,15,119,180,70,251,225,193,15,109,121,133,135,182,121,37,89,156,239,197,68,229,85,148,74,69,75,112,61,76,61,104,107,202,252,154,39,30,195,235,74,169,92,16,66,238,252,26,170,7,37,152,36,52,147,44,60,92,232,220,33,99,38,148,108,234,142,221,28,136,210,146,159,181,85,50,42,239,74,210,1,91,85,118,0,78,153,13,162,47,78,141,139,82,22,109,236,117,106,81,47,232,7,115,136,103,17,115,73,215,25,139,33,24,72,172,235,130,16,85,86,236,36,189,38,37,26,199,239,51,170,203,193,229,140,2,59,59,230,18,218,230,59,246,177,34,93,206,44,39,79,236,59,97,216,124,159,159,161,150,169,62,39,254,170,137,103,242,97,254,104,77,221,156,5,219,183,196,128,105,214,163,66,7,60,196,45,73,151,206,235,235,203,83,4,154,35,223,175,221,178,142,213,115,100,5,67,104,255,223,99,216,8,15,7,19,95,85,12,50,108,104,129,208,60,171,154,18,238,123,191,12,184,195,20,46,153,62,123,132,66,123,64,227,131,212,70,162,26,187,176,196,6,70,169,221,5,131,168,138,133,14,202,90,225,247,98,102,135,240,202,139,243,168,218,66,20,190,22,252,49,180,215,223,130,255,242,31,164,119,34,78,39,234,127,65,158,23,127,160,206,81,165,253,133,142,14,97,115,214,100,188,167,153,251,111,198,4,45,99,190,155,68,90,246,100,106,209,211,123,116,115,49,178,110,90,212,244,126,121,11,150,115,16,27,7,128,78,77,166,19,128,69,119,129,251,249,242,214,124,173,179,142,75,59,10,93,149,77,140,64,226,32,159,126,29,160,0,223,28,247,240,5,138,220,107,229,88,158,94,211,251,76,85,138,203,188,2,37,234,157,183,110,231,219,119,243,185,223,83,184,233,213,131,63,70,191,89,119,192,174,97,143,195,219,142,221,246,225,215,220,136,179,29,185,159,217,185,182,92,219,190,188,56,69,7,72,193,33,146,107,70,209,2,137,92,64,75,69,179,61,91,111,184,154,141,218,182,249,175,17,195,193,61,142,204,19,162,127,142,185,191,47,177,49,233,190,6,252,75,50,216,94,191,122,239,240,92,205,177,168,182,107,120,138,53,62,168,82,37,144,12,127,21,44,171,181,84,37,23,79,222,157,9,209,232,5,50,151,121,180,193,122,2,207,148,12,252,84,108,129,110,134,212,193,146,245,172,251,206,111,101,146,232,206,54,11,0,0 };
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue
Block a user