mirror of
https://github.com/s00500/ESPUI.git
synced 2024-10-31 22:10:54 +00:00
Fixing sliders not updating properly
Signed-off-by: Lukas Bachschwell <lukas@lbsfilm.at>
This commit is contained in:
parent
eec13e4934
commit
6506f6fe1c
GPG Key ID:
CCC6AA87CC8DF425
@ -135,114 +135,145 @@
|
||||
.container {
|
||||
width: 98%;
|
||||
}
|
||||
|
||||
.column,
|
||||
.columns {
|
||||
margin-right: 2%;
|
||||
}
|
||||
|
||||
.column:first-child,
|
||||
.columns:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.one.column,
|
||||
.one.columns {
|
||||
width: 4.66666666667%;
|
||||
}
|
||||
|
||||
.two.columns {
|
||||
width: 13.3333333333%;
|
||||
}
|
||||
|
||||
.three.columns {
|
||||
width: 22%;
|
||||
}
|
||||
|
||||
.four.columns {
|
||||
width: 30.6666666667%;
|
||||
}
|
||||
|
||||
.five.columns {
|
||||
width: 39.3333333333%;
|
||||
}
|
||||
|
||||
.six.columns {
|
||||
width: 48%;
|
||||
}
|
||||
|
||||
.seven.columns {
|
||||
width: 56.6666666667%;
|
||||
}
|
||||
|
||||
.eight.columns {
|
||||
width: 65.3333333333%;
|
||||
}
|
||||
|
||||
.nine.columns {
|
||||
width: 74%;
|
||||
}
|
||||
|
||||
.ten.columns {
|
||||
width: 82.6666666667%;
|
||||
}
|
||||
|
||||
.eleven.columns {
|
||||
width: 91.3333333333%;
|
||||
}
|
||||
|
||||
.twelve.columns {
|
||||
width: 100%;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.one-third.column {
|
||||
width: 30.6666666667%;
|
||||
}
|
||||
|
||||
.two-thirds.column {
|
||||
width: 65.3333333333%;
|
||||
}
|
||||
|
||||
.one-half.column {
|
||||
width: 48%;
|
||||
}
|
||||
|
||||
/* Offsets */
|
||||
.offset-by-one.column,
|
||||
.offset-by-one.columns {
|
||||
margin-left: 8.66666666667%;
|
||||
}
|
||||
|
||||
.offset-by-two.column,
|
||||
.offset-by-two.columns {
|
||||
margin-left: 17.3333333333%;
|
||||
}
|
||||
|
||||
.offset-by-three.column,
|
||||
.offset-by-three.columns {
|
||||
margin-left: 26%;
|
||||
}
|
||||
|
||||
.offset-by-four.column,
|
||||
.offset-by-four.columns {
|
||||
margin-left: 34.6666666667%;
|
||||
}
|
||||
|
||||
.offset-by-five.column,
|
||||
.offset-by-five.columns {
|
||||
margin-left: 43.3333333333%;
|
||||
}
|
||||
|
||||
.offset-by-six.column,
|
||||
.offset-by-six.columns {
|
||||
margin-left: 52%;
|
||||
}
|
||||
|
||||
.offset-by-seven.column,
|
||||
.offset-by-seven.columns {
|
||||
margin-left: 60.6666666667%;
|
||||
}
|
||||
|
||||
.offset-by-eight.column,
|
||||
.offset-by-eight.columns {
|
||||
margin-left: 69.3333333333%;
|
||||
}
|
||||
|
||||
.offset-by-nine.column,
|
||||
.offset-by-nine.columns {
|
||||
margin-left: 78%;
|
||||
}
|
||||
|
||||
.offset-by-ten.column,
|
||||
.offset-by-ten.columns {
|
||||
margin-left: 86.6666666667%;
|
||||
}
|
||||
|
||||
.offset-by-eleven.column,
|
||||
.offset-by-eleven.columns {
|
||||
margin-left: 95.3333333333%;
|
||||
}
|
||||
|
||||
.offset-by-one-third.column,
|
||||
.offset-by-one-third.columns {
|
||||
margin-left: 34.6666666667%;
|
||||
}
|
||||
|
||||
.offset-by-two-thirds.column,
|
||||
.offset-by-two-thirds.columns {
|
||||
margin-left: 69.3333333333%;
|
||||
}
|
||||
|
||||
.offset-by-one-half.column,
|
||||
.offset-by-one-half.columns {
|
||||
margin-left: 52%;
|
||||
@ -322,18 +353,23 @@ h6 {
|
||||
h1 {
|
||||
font-size: 5rem;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 4.2rem;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 3.6rem;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 3rem;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
h6 {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
@ -438,10 +474,8 @@ hr {
|
||||
|
||||
.control {
|
||||
background-color: #ddd;
|
||||
background-image: linear-gradient(
|
||||
hsla(0, 0%, 0%, 0.1),
|
||||
hsla(0, 0%, 100%, 0.1)
|
||||
);
|
||||
background-image: linear-gradient(hsla(0, 0%, 0%, 0.1),
|
||||
hsla(0, 0%, 100%, 0.1));
|
||||
border-radius: 50%;
|
||||
box-shadow: inset 0 1px 1px 1px hsla(0, 0%, 100%, 0.5),
|
||||
0 0 1px 1px hsla(0, 0%, 100%, 0.75), 0 0 1px 2px hsla(0, 0%, 100%, 0.25),
|
||||
@ -506,10 +540,8 @@ hr {
|
||||
|
||||
.control .confirm {
|
||||
background-color: #ddd;
|
||||
background-image: linear-gradient(
|
||||
hsla(0, 0%, 0%, 0.15),
|
||||
hsla(0, 0%, 100%, 0.25)
|
||||
);
|
||||
background-image: linear-gradient(hsla(0, 0%, 0%, 0.15),
|
||||
hsla(0, 0%, 100%, 0.25));
|
||||
box-shadow: inset 0 1px 1px 1px hsla(0, 0%, 100%, 0.5),
|
||||
0 0 1px 1px hsla(0, 0%, 100%, 0.25), 0 0 1px 2px hsla(0, 0%, 100%, 0.25),
|
||||
0 0 1px 3px hsla(0, 0%, 100%, 0.25), 0 0 1px 4px hsla(0, 0%, 100%, 0.25),
|
||||
@ -582,13 +614,11 @@ hr {
|
||||
.switch .in:before {
|
||||
background: #fff;
|
||||
background: -moz-linear-gradient(top, #fff 0%, #f0f0f0 100%);
|
||||
background: -webkit-gradient(
|
||||
linear,
|
||||
background: -webkit-gradient(linear,
|
||||
left top,
|
||||
left bottom,
|
||||
color-stop(0%, #fff),
|
||||
color-stop(100%, #f0f0f0)
|
||||
);
|
||||
color-stop(100%, #f0f0f0));
|
||||
background: -webkit-linear-gradient(top, #fff 0%, #f0f0f0 100%);
|
||||
background: -o-linear-gradient(top, #fff 0%, #f0f0f0 100%);
|
||||
background: -ms-linear-gradient(top, #fff 0%, #f0f0f0 100%);
|
||||
@ -607,13 +637,11 @@ hr {
|
||||
.switch .in:after {
|
||||
background: #f0f0f0;
|
||||
background: -moz-linear-gradient(top, #f0f0f0 0%, #fff 100%);
|
||||
background: -webkit-gradient(
|
||||
linear,
|
||||
background: -webkit-gradient(linear,
|
||||
left top,
|
||||
left bottom,
|
||||
color-stop(0%, #f0f0f0),
|
||||
color-stop(100%, #fff)
|
||||
);
|
||||
color-stop(100%, #fff));
|
||||
background: -webkit-linear-gradient(top, #f0f0f0 0%, #fff 100%);
|
||||
background: -o-linear-gradient(top, #f0f0f0 0%, #fff 100%);
|
||||
background: -ms-linear-gradient(top, #f0f0f0 0%, #fff 100%);
|
||||
@ -635,6 +663,7 @@ hr {
|
||||
font-size: 16px;
|
||||
font-family: "Roboto", sans-serif;
|
||||
}
|
||||
|
||||
.rkmd-slider input[type="range"] {
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
@ -642,7 +671,8 @@ hr {
|
||||
height: 1px;
|
||||
opacity: 0;
|
||||
}
|
||||
.rkmd-slider input[type="range"] + .slider {
|
||||
|
||||
.rkmd-slider input[type="range"]+.slider {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
@ -650,13 +680,15 @@ hr {
|
||||
border-radius: 13px;
|
||||
background-color: #bebebe;
|
||||
}
|
||||
|
||||
@media (pointer: fine) {
|
||||
.rkmd-slider input[type="range"] + .slider {
|
||||
.rkmd-slider input[type="range"]+.slider {
|
||||
height: 4px;
|
||||
border-radius: 0px;
|
||||
}
|
||||
}
|
||||
.rkmd-slider input[type="range"] + .slider .slider-fill {
|
||||
|
||||
.rkmd-slider input[type="range"]+.slider .slider-fill {
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: 0%;
|
||||
@ -664,7 +696,8 @@ hr {
|
||||
user-select: none;
|
||||
z-index: 1;
|
||||
}
|
||||
.rkmd-slider input[type="range"] + .slider .slider-handle {
|
||||
|
||||
.rkmd-slider input[type="range"]+.slider .slider-handle {
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
top: 12px;
|
||||
@ -677,50 +710,45 @@ hr {
|
||||
user-select: none;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
@media (pointer: fine) {
|
||||
.rkmd-slider input[type="range"] + .slider .slider-handle {
|
||||
.rkmd-slider input[type="range"]+.slider .slider-handle {
|
||||
top: -5.5px;
|
||||
}
|
||||
}
|
||||
.rkmd-slider input[type="range"]:disabled + .slider {
|
||||
|
||||
.rkmd-slider input[type="range"]:disabled+.slider {
|
||||
background-color: #b0b0b0 !important;
|
||||
}
|
||||
.rkmd-slider input[type="range"]:disabled + .slider .slider-fill,
|
||||
.rkmd-slider input[type="range"]:disabled + .slider .slider-handle {
|
||||
|
||||
.rkmd-slider input[type="range"]:disabled+.slider .slider-fill,
|
||||
.rkmd-slider input[type="range"]:disabled+.slider .slider-handle {
|
||||
cursor: default !important;
|
||||
background-color: #b0b0b0 !important;
|
||||
}
|
||||
.rkmd-slider input[type="range"]:disabled + .slider .slider-fill .slider-label,
|
||||
.rkmd-slider
|
||||
input[type="range"]:disabled
|
||||
+ .slider
|
||||
.slider-handle
|
||||
.slider-label {
|
||||
|
||||
.rkmd-slider input[type="range"]:disabled+.slider .slider-fill .slider-label,
|
||||
.rkmd-slider input[type="range"]:disabled+.slider .slider-handle .slider-label {
|
||||
display: none;
|
||||
background-color: #b0b0b0 !important;
|
||||
}
|
||||
.rkmd-slider input[type="range"]:disabled + .slider .slider-fill.is-active,
|
||||
.rkmd-slider input[type="range"]:disabled + .slider .slider-handle.is-active {
|
||||
|
||||
.rkmd-slider input[type="range"]:disabled+.slider .slider-fill.is-active,
|
||||
.rkmd-slider input[type="range"]:disabled+.slider .slider-handle.is-active {
|
||||
top: -5.5px;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
margin-left: -8px;
|
||||
}
|
||||
.rkmd-slider
|
||||
input[type="range"]:disabled
|
||||
+ .slider
|
||||
.slider-fill.is-active
|
||||
.slider-label,
|
||||
.rkmd-slider
|
||||
input[type="range"]:disabled
|
||||
+ .slider
|
||||
.slider-handle.is-active
|
||||
.slider-label {
|
||||
|
||||
.rkmd-slider input[type="range"]:disabled+.slider .slider-fill.is-active .slider-label,
|
||||
.rkmd-slider input[type="range"]:disabled+.slider .slider-handle.is-active .slider-label {
|
||||
display: none;
|
||||
border-radius: 50%;
|
||||
transform: none;
|
||||
}
|
||||
.rkmd-slider input[type="range"]:disabled + .slider .slider-handle:active {
|
||||
|
||||
.rkmd-slider input[type="range"]:disabled+.slider .slider-handle:active {
|
||||
box-shadow: none !important;
|
||||
transform: scale(1) !important;
|
||||
}
|
||||
@ -747,6 +775,7 @@ hr {
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
@media (pointer: fine) {
|
||||
.rkmd-slider.slider-discrete .slider .slider-handle .slider-label {
|
||||
left: -2px;
|
||||
@ -771,17 +800,20 @@ hr {
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
@media (pointer: fine) {
|
||||
.rkmd-slider.slider-discrete .slider .slider-handle .slider-label span {
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.rkmd-slider.slider-discrete .slider .slider-handle.is-active {
|
||||
top: 0px;
|
||||
margin-left: -2px;
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
}
|
||||
|
||||
.rkmd-slider.slider-discrete .slider .slider-handle.is-active .slider-label {
|
||||
top: -15px;
|
||||
left: -2px;
|
||||
@ -789,11 +821,8 @@ hr {
|
||||
-webkit-transform: rotate(-45deg) translate(23px, -25px);
|
||||
transform: rotate(-45deg) translate(23px, -25px);
|
||||
}
|
||||
.rkmd-slider.slider-discrete
|
||||
.slider
|
||||
.slider-handle.is-active
|
||||
.slider-label
|
||||
span {
|
||||
|
||||
.rkmd-slider.slider-discrete .slider .slider-handle.is-active .slider-label span {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
@ -898,20 +927,23 @@ input[id^="num"] {
|
||||
font-size: 115%;
|
||||
}
|
||||
|
||||
body div > ul.navigation {
|
||||
body div>ul.navigation {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border-bottom: 3px solid #666;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
ul.navigation li {
|
||||
list-style: none;
|
||||
float: left;
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
ul.navigation li.controls {
|
||||
float: right;
|
||||
}
|
||||
|
||||
ul.navigation li a {
|
||||
font-weight: bold;
|
||||
display: inline-block;
|
||||
@ -936,7 +968,7 @@ ul.navigation li.active a {
|
||||
-pie-background: linear-gradient(#888, #666);
|
||||
}
|
||||
|
||||
div.tabscontent > div {
|
||||
div.tabscontent>div {
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
||||
@ -947,9 +979,11 @@ div.tabscontent > div {
|
||||
.range-slider {
|
||||
margin: 0 0 0 0;
|
||||
}
|
||||
|
||||
.range-slider {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.range-slider__range {
|
||||
-webkit-appearance: none;
|
||||
width: calc(100% - (45px));
|
||||
@ -959,6 +993,8 @@ div.tabscontent > div {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
.range-slider__range::-webkit-slider-thumb {
|
||||
-webkit-appearance: none;
|
||||
appearance: none;
|
||||
@ -985,6 +1021,7 @@ div.tabscontent > div {
|
||||
.range-slider__range:focus::-webkit-slider-thumb {
|
||||
box-shadow: 0 0 0 3px #fff, 0 0 0 6px #1abc9c;
|
||||
}
|
||||
*/
|
||||
.range-slider__value {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
@ -996,6 +1033,7 @@ div.tabscontent > div {
|
||||
padding: 5px 5px;
|
||||
margin-left: 2px;
|
||||
}
|
||||
|
||||
.range-slider__value:after {
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
@ -1007,9 +1045,11 @@ div.tabscontent > div {
|
||||
border-bottom:1px solid transparent;*/
|
||||
content: "";
|
||||
}
|
||||
|
||||
::-moz-range-track {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
input::-moz-focus-inner,
|
||||
input::-moz-focus-outer {
|
||||
border: 0;
|
||||
@ -1051,7 +1091,7 @@ svg {
|
||||
stroke-width: 6;
|
||||
}
|
||||
|
||||
.data-points circle:hover + text {
|
||||
.data-points circle:hover+text {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
|
||||
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
4
data/js/controls.js
vendored
4
data/js/controls.js
vendored
@ -226,7 +226,7 @@ function start() {
|
||||
};
|
||||
|
||||
var handleEvent = function (evt) {
|
||||
//console.log(evt);
|
||||
console.log(evt);
|
||||
var data = JSON.parse(evt.data);
|
||||
var e = document.body;
|
||||
var center = "";
|
||||
@ -750,7 +750,7 @@ function start() {
|
||||
break;
|
||||
|
||||
case UPDATE_SLIDER:
|
||||
slider_move($("#sl" + data.id), data.value, "100", false);
|
||||
slider_move($("#id" + data.id), data.value, "100", false);
|
||||
break;
|
||||
|
||||
case UPDATE_NUMBER:
|
||||
|
||||
4
data/js/controls.min.js
vendored
4
data/js/controls.min.js
vendored
@ -7,7 +7,7 @@ function restart(){$(document).add("*").off();$("#row").html("");websock.close()
|
||||
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();}}
|
||||
function start(){document.addEventListener("visibilitychange",handleVisibilityChange,false);if(window.location.port!=""||window.location.port!=80||window.location.port!=443){websock=new WebSocket("ws://"+window.location.hostname+":"+window.location.port+"/ws");}else{websock=new WebSocket("ws://"+window.location.hostname+"/ws");}
|
||||
websock.onopen=function(evt){console.log("websock open");$("#conStatus").addClass("color-green");$("#conStatus").text("Connected");websockConnected=true;};websock.onclose=function(evt){console.log("websock close");conStatusError();};websock.onerror=function(evt){console.log(evt);conStatusError();};var handleEvent=function(evt){var data=JSON.parse(evt.data);var e=document.body;var center="";switch(data.type){case UI_INITIAL_GUI:$("#row").html("");$("#tabsnav").html("");$("#tabscontent").html("");if(data.sliderContinuous){sliderContinuous=data.sliderContinuous;}
|
||||
websock.onopen=function(evt){console.log("websock open");$("#conStatus").addClass("color-green");$("#conStatus").text("Connected");websockConnected=true;};websock.onclose=function(evt){console.log("websock close");conStatusError();};websock.onerror=function(evt){console.log(evt);conStatusError();};var handleEvent=function(evt){console.log(evt);var data=JSON.parse(evt.data);var e=document.body;var center="";switch(data.type){case UI_INITIAL_GUI:$("#row").html("");$("#tabsnav").html("");$("#tabscontent").html("");if(data.sliderContinuous){sliderContinuous=data.sliderContinuous;}
|
||||
data.controls.forEach(element=>{var fauxEvent={data:JSON.stringify(element),};handleEvent(fauxEvent);});break;case UI_RELOAD:window.location.reload();break;case UI_TITEL:document.title=data.label;$("#mainHeader").html(data.label);break;case UI_LABEL:var parent;if(data.parentControl){parent=$("#tab"+data.parentControl);}else{parent=$("#row");}
|
||||
parent.append("<div id='id"+
|
||||
data.id+
|
||||
@ -237,7 +237,7 @@ data.id+
|
||||
"'></div><pre class='accelerometeroutput"+
|
||||
data.id+
|
||||
"'></pre>"+
|
||||
"</div>");requestOrientationPermission();break;case UPDATE_LABEL:$("#l"+data.id).html(data.value);break;case UPDATE_SWITCHER:switcher(data.id,data.value=="0"?0:1);break;case UPDATE_SLIDER:slider_move($("#sl"+data.id),data.value,"100",false);break;case UPDATE_NUMBER:$("#num"+data.id).val(data.value);break;case UPDATE_TEXT_INPUT:$("#text"+data.id).val(data.value);break;case UPDATE_SELECT:$("#select"+data.id).val(data.value);break;case UPDATE_BUTTON:case UPDATE_PAD:case UPDATE_CPAD:break;case UPDATE_GAUGE:$("#gauge"+data.id).val(data.value);break;case UPDATE_ACCEL:break;default:console.error("Unknown type or event");break;}
|
||||
"</div>");requestOrientationPermission();break;case UPDATE_LABEL:$("#l"+data.id).html(data.value);break;case UPDATE_SWITCHER:switcher(data.id,data.value=="0"?0:1);break;case UPDATE_SLIDER:slider_move($("#id"+data.id),data.value,"100",false);break;case UPDATE_NUMBER:$("#num"+data.id).val(data.value);break;case UPDATE_TEXT_INPUT:$("#text"+data.id).val(data.value);break;case UPDATE_SELECT:$("#select"+data.id).val(data.value);break;case UPDATE_BUTTON:case UPDATE_PAD:case UPDATE_CPAD:break;case UPDATE_GAUGE:$("#gauge"+data.id).val(data.value);break;case UPDATE_ACCEL:break;default:console.error("Unknown type or event");break;}
|
||||
if(data.type>=UPDATE_OFFSET&&data.type<UI_INITIAL_GUI){var element=$("#id"+data.id);if(data.type==UPDATE_SLIDER){element.removeClass("slider-turquoise slider-emerald slider-peterriver slider-wetasphalt slider-sunflower slider-carrot slider-alizarin");element.addClass("slider-"+colorClass(data.color));}else{element.removeClass("turquoise emerald peterriver wetasphalt sunflower carrot alizarin");element.addClass(colorClass(data.color));}}};websock.onmessage=handleEvent;}
|
||||
function sliderchange(number){var val=$("#sl"+number).val();websock.send("slvalue:"+val+":"+number);}
|
||||
function numberchange(number){var val=$("#num"+number).val();websock.send("nvalue:"+val+":"+number);}
|
||||
|
||||
@ -10,7 +10,7 @@ function rkmd_rangeSlider(selector) {
|
||||
slider_offset = self.offset().left;
|
||||
sliderDiscrete = self;
|
||||
|
||||
sliderDiscrete.each(function(i, v) {
|
||||
sliderDiscrete.each(function (i, v) {
|
||||
curnt = $(this);
|
||||
curnt.append(sliderDiscrete_tmplt());
|
||||
range = curnt.find('input[type="range"]');
|
||||
@ -25,7 +25,7 @@ function rkmd_rangeSlider(selector) {
|
||||
slider_label.find("span").text(range_val);
|
||||
});
|
||||
|
||||
self.on("mousedown touchstart", ".slider-handle", function(e) {
|
||||
self.on("mousedown touchstart", ".slider-handle", function (e) {
|
||||
if (e.button === 2) {
|
||||
return false;
|
||||
}
|
||||
@ -37,14 +37,14 @@ function rkmd_rangeSlider(selector) {
|
||||
return false;
|
||||
}
|
||||
$(this).addClass("is-active");
|
||||
var moveFu = function(e) {
|
||||
var moveFu = function (e) {
|
||||
var pageX = e.pageX || e.changedTouches[0].pageX;
|
||||
var slider_new_width = pageX - slider_offset;
|
||||
if (slider_new_width <= slider_width && !(slider_new_width < "0")) {
|
||||
slider_move(parents, slider_new_width, slider_width, true);
|
||||
}
|
||||
};
|
||||
var upFu = function(e) {
|
||||
var upFu = function (e) {
|
||||
$(this).off(handlers);
|
||||
parents.find(".is-active").removeClass("is-active");
|
||||
};
|
||||
@ -53,12 +53,12 @@ function rkmd_rangeSlider(selector) {
|
||||
mousemove: moveFu,
|
||||
touchmove: moveFu,
|
||||
mouseup: upFu,
|
||||
touchend: upFu
|
||||
touchend: upFu,
|
||||
};
|
||||
$(document).on(handlers);
|
||||
});
|
||||
|
||||
self.on("mousedown touchstart", ".slider", function(e) {
|
||||
self.on("mousedown touchstart", ".slider", function (e) {
|
||||
if (e.button === 2) {
|
||||
return false;
|
||||
}
|
||||
@ -76,13 +76,13 @@ function rkmd_rangeSlider(selector) {
|
||||
if (slider_new_width <= slider_width && !(slider_new_width < "0")) {
|
||||
slider_move(parents, slider_new_width, slider_width, true);
|
||||
}
|
||||
var upFu = function(e) {
|
||||
var upFu = function (e) {
|
||||
$(this).off(handlers);
|
||||
};
|
||||
|
||||
var handlers = {
|
||||
mouseup: upFu,
|
||||
touchend: upFu
|
||||
touchend: upFu,
|
||||
};
|
||||
$(document).on(handlers);
|
||||
});
|
||||
@ -104,13 +104,14 @@ function slider_move(parents, newW, sliderW, send) {
|
||||
var slider_fill = parents.find(".slider-fill");
|
||||
var slider_handle = parents.find(".slider-handle");
|
||||
var range = parents.find('input[type="range"]');
|
||||
range.next().html(newW); // update value
|
||||
|
||||
slider_fill.css("width", slider_new_val + "%");
|
||||
slider_handle.css({
|
||||
left: slider_new_val + "%",
|
||||
transition: "none",
|
||||
"-webkit-transition": "none",
|
||||
"-moz-transition": "none"
|
||||
"-moz-transition": "none",
|
||||
});
|
||||
|
||||
range.val(slider_new_val);
|
||||
|
||||
6
data/js/slider.min.js
vendored
6
data/js/slider.min.js
vendored
@ -1,11 +1,11 @@
|
||||
function rkmd_rangeSlider(selector){var self,slider_width,slider_offset,curnt,sliderDiscrete,range,slider;self=$(selector);slider_width=self.width();slider_offset=self.offset().left;sliderDiscrete=self;sliderDiscrete.each(function(i,v){curnt=$(this);curnt.append(sliderDiscrete_tmplt());range=curnt.find('input[type="range"]');slider=curnt.find(".slider");slider_fill=slider.find(".slider-fill");slider_handle=slider.find(".slider-handle");slider_label=slider.find(".slider-label");var range_val=parseInt(range.val());slider_fill.css("width",range_val+"%");slider_handle.css("left",range_val+"%");slider_label.find("span").text(range_val);});self.on("mousedown touchstart",".slider-handle",function(e){if(e.button===2){return false;}
|
||||
var parents=$(this).parents(".rkmd-slider");var slider_width=parents.width();var slider_offset=parents.offset().left;var check_range=parents.find('input[type="range"]').is(":disabled");if(check_range===true){return false;}
|
||||
$(this).addClass("is-active");var moveFu=function(e){var pageX=e.pageX||e.changedTouches[0].pageX;var slider_new_width=pageX-slider_offset;if(slider_new_width<=slider_width&&!(slider_new_width<"0")){slider_move(parents,slider_new_width,slider_width,true);}};var upFu=function(e){$(this).off(handlers);parents.find(".is-active").removeClass("is-active");};var handlers={mousemove:moveFu,touchmove:moveFu,mouseup:upFu,touchend:upFu};$(document).on(handlers);});self.on("mousedown touchstart",".slider",function(e){if(e.button===2){return false;}
|
||||
$(this).addClass("is-active");var moveFu=function(e){var pageX=e.pageX||e.changedTouches[0].pageX;var slider_new_width=pageX-slider_offset;if(slider_new_width<=slider_width&&!(slider_new_width<"0")){slider_move(parents,slider_new_width,slider_width,true);}};var upFu=function(e){$(this).off(handlers);parents.find(".is-active").removeClass("is-active");};var handlers={mousemove:moveFu,touchmove:moveFu,mouseup:upFu,touchend:upFu,};$(document).on(handlers);});self.on("mousedown touchstart",".slider",function(e){if(e.button===2){return false;}
|
||||
var parents=$(this).parents(".rkmd-slider");var slider_width=parents.width();var slider_offset=parents.offset().left;var check_range=parents.find('input[type="range"]').is(":disabled");if(check_range===true){return false;}
|
||||
var slider_new_width=e.pageX-slider_offset;if(slider_new_width<=slider_width&&!(slider_new_width<"0")){slider_move(parents,slider_new_width,slider_width,true);}
|
||||
var upFu=function(e){$(this).off(handlers);};var handlers={mouseup:upFu,touchend:upFu};$(document).on(handlers);});}
|
||||
var upFu=function(e){$(this).off(handlers);};var handlers={mouseup:upFu,touchend:upFu,};$(document).on(handlers);});}
|
||||
function sliderDiscrete_tmplt(){var tmplt='<div class="slider">'+
|
||||
'<div class="slider-fill"></div>'+
|
||||
'<div class="slider-handle"><div class="slider-label"><span>0</span></div></div>'+
|
||||
"</div>";return tmplt;}
|
||||
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);}}
|
||||
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"]');range.next().html(newW);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);}}
|
||||
File diff suppressed because one or more lines are too long
@ -1,15 +1,15 @@
|
||||
const char JS_SLIDER[] PROGMEM = R"=====(
|
||||
function rkmd_rangeSlider(selector){var self,slider_width,slider_offset,curnt,sliderDiscrete,range,slider;self=$(selector);slider_width=self.width();slider_offset=self.offset().left;sliderDiscrete=self;sliderDiscrete.each(function(i,v){curnt=$(this);curnt.append(sliderDiscrete_tmplt());range=curnt.find('input[type="range"]');slider=curnt.find(".slider");slider_fill=slider.find(".slider-fill");slider_handle=slider.find(".slider-handle");slider_label=slider.find(".slider-label");var range_val=parseInt(range.val());slider_fill.css("width",range_val+"%");slider_handle.css("left",range_val+"%");slider_label.find("span").text(range_val);});self.on("mousedown touchstart",".slider-handle",function(e){if(e.button===2){return false;}
|
||||
var parents=$(this).parents(".rkmd-slider");var slider_width=parents.width();var slider_offset=parents.offset().left;var check_range=parents.find('input[type="range"]').is(":disabled");if(check_range===true){return false;}
|
||||
$(this).addClass("is-active");var moveFu=function(e){var pageX=e.pageX||e.changedTouches[0].pageX;var slider_new_width=pageX-slider_offset;if(slider_new_width<=slider_width&&!(slider_new_width<"0")){slider_move(parents,slider_new_width,slider_width,true);}};var upFu=function(e){$(this).off(handlers);parents.find(".is-active").removeClass("is-active");};var handlers={mousemove:moveFu,touchmove:moveFu,mouseup:upFu,touchend:upFu};$(document).on(handlers);});self.on("mousedown touchstart",".slider",function(e){if(e.button===2){return false;}
|
||||
$(this).addClass("is-active");var moveFu=function(e){var pageX=e.pageX||e.changedTouches[0].pageX;var slider_new_width=pageX-slider_offset;if(slider_new_width<=slider_width&&!(slider_new_width<"0")){slider_move(parents,slider_new_width,slider_width,true);}};var upFu=function(e){$(this).off(handlers);parents.find(".is-active").removeClass("is-active");};var handlers={mousemove:moveFu,touchmove:moveFu,mouseup:upFu,touchend:upFu,};$(document).on(handlers);});self.on("mousedown touchstart",".slider",function(e){if(e.button===2){return false;}
|
||||
var parents=$(this).parents(".rkmd-slider");var slider_width=parents.width();var slider_offset=parents.offset().left;var check_range=parents.find('input[type="range"]').is(":disabled");if(check_range===true){return false;}
|
||||
var slider_new_width=e.pageX-slider_offset;if(slider_new_width<=slider_width&&!(slider_new_width<"0")){slider_move(parents,slider_new_width,slider_width,true);}
|
||||
var upFu=function(e){$(this).off(handlers);};var handlers={mouseup:upFu,touchend:upFu};$(document).on(handlers);});}
|
||||
var upFu=function(e){$(this).off(handlers);};var handlers={mouseup:upFu,touchend:upFu,};$(document).on(handlers);});}
|
||||
function sliderDiscrete_tmplt(){var tmplt='<div class="slider">'+
|
||||
'<div class="slider-fill"></div>'+
|
||||
'<div class="slider-handle"><div class="slider-label"><span>0</span></div></div>'+
|
||||
"</div>";return tmplt;}
|
||||
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);}}
|
||||
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"]');range.next().html(newW);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[869] PROGMEM = { 31,139,8,0,19,56,231,94,2,255,237,86,77,143,155,48,16,189,231,87,100,173,237,6,186,196,155,238,49,196,185,180,170,212,67,79,173,212,74,171,85,228,128,89,172,16,131,176,73,218,102,243,223,59,254,128,0,33,171,109,79,61,244,4,246,60,143,103,222,60,123,156,84,34,82,60,23,227,114,179,141,87,37,21,79,236,75,198,99,86,122,146,101,44,82,121,233,31,118,180,28,195,40,9,164,177,172,246,60,86,105,61,200,147,68,50,21,68,85,41,148,155,251,192,101,84,50,197,2,227,206,77,134,218,3,185,62,185,13,219,222,136,182,98,243,235,53,22,235,218,154,236,191,231,227,140,37,42,236,238,99,16,189,57,204,104,148,122,137,203,206,227,193,206,63,152,24,33,4,149,114,233,135,102,132,105,81,48,17,123,221,197,43,181,45,50,216,204,15,77,6,196,66,19,14,192,9,23,69,165,30,212,207,130,17,100,172,232,113,82,71,220,6,34,108,231,80,147,78,194,179,140,216,255,46,100,170,45,39,92,74,69,156,177,97,164,181,157,176,25,93,179,11,78,141,9,144,186,122,38,208,213,142,102,164,160,165,100,159,132,242,204,20,134,41,157,102,43,66,28,73,233,33,83,9,20,52,235,110,209,155,126,128,22,168,203,113,9,103,34,112,81,201,130,10,228,99,197,126,184,173,53,218,15,143,126,104,203,43,60,180,205,43,201,226,124,47,198,42,175,162,84,42,90,130,235,126,234,65,83,83,230,31,120,226,49,188,174,148,202,5,33,228,222,63,64,245,160,4,227,132,102,146,133,199,145,206,29,50,102,66,201,186,238,216,141,129,40,45,249,105,83,37,163,242,182,36,29,176,81,101,11,224,148,89,35,186,226,212,184,40,101,209,198,30,167,6,245,130,126,48,135,120,230,49,151,116,157,177,24,130,129,196,218,46,8,81,101,197,206,210,171,83,162,113,252,62,163,186,28,92,78,41,176,179,99,46,161,109,190,99,31,43,210,230,204,114,242,196,190,19,134,205,247,249,25,106,153,234,125,226,175,154,120,38,31,102,143,214,212,206,89,176,125,67,12,152,166,29,42,116,192,125,220,130,180,233,188,185,185,58,71,160,25,242,253,131,155,214,177,122,142,172,160,15,237,222,61,134,141,240,120,52,241,85,69,47,195,154,22,8,205,179,170,41,225,188,119,202,128,112,139,41,92,50,189,247,0,133,118,131,218,7,57,24,137,106,236,220,18,27,24,165,182,39,12,162,42,230,58,40,107,133,235,197,140,142,225,181,23,231,81,181,133,40,124,45,248,83,104,175,63,5,255,229,223,75,239,76,156,78,212,255,130,60,71,127,160,206,65,165,253,133,142,142,163,122,175,241,112,79,51,231,223,252,147,201,34,230,187,113,164,101,79,144,19,194,114,114,59,26,152,183,45,106,185,184,3,203,37,136,187,160,151,3,38,219,139,150,11,221,5,150,179,197,157,249,90,103,141,75,100,255,80,232,170,108,98,60,207,167,91,7,40,192,55,199,61,124,129,34,247,90,57,149,167,211,244,62,83,149,226,50,175,64,137,158,94,122,231,150,250,111,223,205,102,126,71,227,166,91,247,238,140,110,187,110,129,93,203,30,134,55,61,187,233,196,175,57,19,23,123,114,55,183,75,141,249,160,207,226,252,28,11,218,164,66,114,77,232,28,137,92,64,67,69,211,61,91,111,184,154,158,76,232,100,219,230,191,6,12,71,247,52,50,15,136,238,46,230,244,190,196,196,184,253,22,240,175,72,111,249,225,213,107,251,251,106,126,69,181,93,195,67,172,246,65,149,42,225,74,135,59,5,203,106,45,85,201,197,147,119,111,66,52,106,129,204,101,30,109,176,30,192,35,37,3,63,21,155,163,219,62,113,48,101,61,235,174,243,27,27,117,74,231,52,11,0,0 };
|
||||
const uint8_t JS_SLIDER_GZIP[881] PROGMEM = { 31,139,8,0,150,187,70,95,2,255,237,86,77,143,218,48,16,189,243,43,88,107,187,196,93,240,210,61,18,204,165,85,165,30,122,106,165,86,90,173,144,73,156,141,69,112,162,216,129,182,44,255,189,227,143,132,36,192,106,219,83,15,61,37,246,60,143,223,204,60,123,156,84,50,210,34,151,195,114,189,137,151,37,147,79,252,75,38,98,94,6,138,103,60,210,121,137,247,91,86,14,97,148,140,149,181,44,119,34,214,105,61,200,147,68,113,61,142,170,82,106,63,247,65,168,168,228,154,143,173,59,63,25,26,15,244,250,232,54,108,123,163,198,74,236,111,208,88,156,107,103,114,255,1,38,25,79,116,216,221,199,34,122,115,132,179,40,13,18,31,93,32,198,91,188,183,28,129,130,78,133,194,161,29,17,86,20,92,198,65,119,241,82,111,138,12,54,195,161,141,128,58,104,34,0,56,18,178,168,244,131,254,89,112,138,172,21,61,142,106,198,109,32,34,110,14,53,225,36,34,203,168,251,239,66,38,198,114,196,165,76,198,25,63,143,116,182,35,54,99,43,126,193,169,53,1,210,84,207,18,93,110,89,70,11,86,42,254,73,234,192,78,17,152,50,97,182,24,146,72,169,0,217,74,160,113,179,238,22,189,233,19,116,64,83,142,75,56,203,192,179,82,5,147,8,19,205,127,248,173,13,26,135,7,28,186,242,202,0,109,242,74,241,56,223,201,161,206,171,40,85,154,149,224,186,31,250,184,169,41,199,123,145,4,156,172,42,173,115,73,41,189,199,123,168,30,148,96,152,176,76,241,240,48,48,177,67,196,92,106,85,215,157,248,49,36,202,72,126,210,84,201,170,188,45,73,15,108,84,217,2,120,101,214,136,174,56,13,46,74,121,180,118,199,169,65,189,160,31,34,128,207,44,22,138,173,50,30,3,25,8,172,237,130,82,93,86,252,36,188,58,36,22,199,239,51,102,202,33,212,132,65,118,182,220,7,180,201,183,252,99,69,219,57,115,57,121,226,223,41,39,246,251,252,12,181,76,205,62,241,87,147,120,174,30,166,143,206,212,142,89,242,93,147,24,48,77,58,169,48,132,251,184,57,109,167,243,230,230,234,20,129,166,8,227,189,159,54,92,3,159,172,113,31,218,189,123,108,54,194,195,193,242,171,138,94,132,117,90,128,90,224,84,83,194,121,239,148,1,145,86,166,72,201,205,222,103,82,232,54,168,125,208,189,149,168,193,206,92,98,199,86,169,237,9,139,168,138,153,33,229,172,112,189,184,209,33,188,14,226,60,170,54,64,3,27,197,31,185,189,254,24,252,215,127,47,188,19,117,122,85,255,11,250,28,252,129,60,207,74,237,111,132,116,24,212,155,13,207,119,53,123,3,216,127,58,154,199,98,59,140,140,240,41,242,74,88,140,110,7,103,230,93,147,90,204,239,192,114,9,226,175,232,197,25,147,235,70,139,185,233,3,139,233,252,206,126,157,179,198,37,114,127,40,244,101,182,28,79,227,233,22,2,42,240,205,39,31,190,144,35,255,94,57,214,167,211,246,62,51,157,146,50,175,64,138,129,89,122,231,151,226,183,239,166,83,220,17,185,237,215,189,91,163,219,176,91,96,223,180,207,195,155,174,221,244,226,215,28,10,247,248,32,210,180,76,76,82,189,201,44,227,203,221,186,27,243,165,150,189,55,135,116,118,138,5,209,50,169,132,73,244,12,201,92,66,171,69,147,29,95,173,133,158,28,77,232,104,219,228,191,206,25,14,53,113,243,182,232,110,99,207,245,75,41,26,182,159,9,248,138,246,150,239,95,189,182,191,175,73,188,172,54,43,120,163,213,62,152,214,37,220,246,112,219,16,85,173,148,46,133,124,10,238,45,69,43,35,8,93,229,209,154,152,1,188,95,50,240,83,241,25,186,237,103,14,166,156,103,211,144,126,3,128,124,107,46,79,11,0,0 };
|
||||
|
||||
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue
Block a user