Merge branch 'develop'
This commit is contained in:
commit
e680db96bd
10 changed files with 53 additions and 62 deletions
|
@ -427,10 +427,6 @@ container.innerHTML = "";
|
||||||
container.classList.add("pure-form");
|
container.classList.add("pure-form");
|
||||||
container.appendChild(table);
|
container.appendChild(table);
|
||||||
}
|
}
|
||||||
function rgb2Hex(r, g, b) {
|
|
||||||
var hex = "#" + ((1 << 24) | (r << 16) | (g << 8) | b).toString(16).slice(1);
|
|
||||||
return hex;
|
|
||||||
}
|
|
||||||
function createSlider(id, max, value, step) {
|
function createSlider(id, max, value, step) {
|
||||||
var input = document.createElement("input");
|
var input = document.createElement("input");
|
||||||
input.type = "range";
|
input.type = "range";
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<!-- middle -->
|
<!-- middle -->
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td class="top-align">
|
||||||
<div id="plot_chart" class="top-align"></div>
|
<div id="plot_chart" class="top-align"></div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
|
|
|
@ -25,5 +25,21 @@ output{{LIGHT_NUMBER_DEC}}.innerHTML = (Math.round((slider{{LIGHT_NUMBER_DEC}}.v
|
||||||
slider{{LIGHT_NUMBER_DEC}}.oninput = function() {
|
slider{{LIGHT_NUMBER_DEC}}.oninput = function() {
|
||||||
output{{LIGHT_NUMBER_DEC}}.innerHTML = (Math.round((this.value * 100.0 / 255.0) * 100) / 100).toFixed(2);
|
output{{LIGHT_NUMBER_DEC}}.innerHTML = (Math.round((this.value * 100.0 / 255.0) * 100) / 100).toFixed(2);
|
||||||
}
|
}
|
||||||
|
var lightNumber = {{LIGHT_NUMBER}};
|
||||||
|
var slider = document.getElementById("bri{{LIGHT_NUMBER_DEC}}");
|
||||||
|
var pwm = document.getElementById("light{{LIGHT_NUMBER_DEC}}_pwm");
|
||||||
|
if (lightNumber === 1) {
|
||||||
|
slider.style.background = "linear-gradient(to bottom, " + rgb2Hex(31, 119, 180) + ", white)";
|
||||||
|
pwm.style.background = "linear-gradient(to right, white, " + rgb2Hex(31, 119, 180) + ")";
|
||||||
|
} else if (lightNumber === 2) {
|
||||||
|
slider.style.background = "linear-gradient(to bottom, " + rgb2Hex(255, 127, 14) + ", white)";
|
||||||
|
pwm.style.background = "linear-gradient(to right, white, " + rgb2Hex(255, 127, 14) + ")";
|
||||||
|
} else if (lightNumber === 3) {
|
||||||
|
slider.style.background = "linear-gradient(to bottom, " + rgb2Hex(44, 160, 44) + ", white)";
|
||||||
|
pwm.style.background = "linear-gradient(to right, white, " + rgb2Hex(44, 160, 44) + ")";
|
||||||
|
} else if (lightNumber === 4) {
|
||||||
|
slider.style.background = "linear-gradient(to bottom, " + rgb2Hex(214, 39, 40) + ", white)";
|
||||||
|
pwm.style.background = "linear-gradient(to right, white, " + rgb2Hex(214, 39, 40) + ")";
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -74,27 +74,6 @@ background-color: #ddd;
|
||||||
input[type=range]:focus {
|
input[type=range]:focus {
|
||||||
outline: none;
|
outline: none;
|
||||||
}
|
}
|
||||||
/*
|
[id^="bri"] {
|
||||||
input[type=range]::-webkit-slider-thumb {
|
width: 50%;
|
||||||
-webkit-appearance: none;
|
}
|
||||||
appearance: none;
|
|
||||||
width: 15px;
|
|
||||||
height: 15px;
|
|
||||||
border-radius: 10%;
|
|
||||||
background-color: #a1a1a1;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
input[type=range]::-moz-range-thumb {
|
|
||||||
width: 15px;
|
|
||||||
height: 15px;
|
|
||||||
border-radius: 10%;
|
|
||||||
background-color: #a1a1a1;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
input[type=range]::-ms-thumb {
|
|
||||||
width: 15px;
|
|
||||||
height: 15px;
|
|
||||||
border-radius: 10%;
|
|
||||||
background-color: #a1a1a1;
|
|
||||||
cursor: pointer;
|
|
||||||
}*/
|
|
|
@ -96,4 +96,8 @@ showToast(`Error sending slider value to ${url}: ${error}`, 'error');
|
||||||
console.error(`Error sending slider value to ${url}: ${error}`);
|
console.error(`Error sending slider value to ${url}: ${error}`);
|
||||||
});
|
});
|
||||||
}, 500);
|
}, 500);
|
||||||
}
|
}
|
||||||
|
function rgb2Hex(r, g, b) {
|
||||||
|
var hex = "#" + ((1 << 24) | (r << 16) | (g << 8) | b).toString(16).slice(1);
|
||||||
|
return hex;
|
||||||
|
}
|
||||||
|
|
|
@ -509,12 +509,6 @@ function createTable() {
|
||||||
container.appendChild(table);
|
container.appendChild(table);
|
||||||
}
|
}
|
||||||
|
|
||||||
function rgb2Hex(r, g, b) {
|
|
||||||
// RGB-Werte in hexadezimale Werte umwandeln
|
|
||||||
var hex = "#" + ((1 << 24) | (r << 16) | (g << 8) | b).toString(16).slice(1);
|
|
||||||
return hex;
|
|
||||||
}
|
|
||||||
|
|
||||||
function createSlider(id, max, value, step) {
|
function createSlider(id, max, value, step) {
|
||||||
// Create a new input element of type range
|
// Create a new input element of type range
|
||||||
var input = document.createElement("input");
|
var input = document.createElement("input");
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<!-- middle -->
|
<!-- middle -->
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td class="top-align">
|
||||||
<div id="plot_chart" class="top-align"></div>
|
<div id="plot_chart" class="top-align"></div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
|
|
|
@ -25,5 +25,22 @@
|
||||||
slider{{LIGHT_NUMBER_DEC}}.oninput = function() {
|
slider{{LIGHT_NUMBER_DEC}}.oninput = function() {
|
||||||
output{{LIGHT_NUMBER_DEC}}.innerHTML = (Math.round((this.value * 100.0 / 255.0) * 100) / 100).toFixed(2);
|
output{{LIGHT_NUMBER_DEC}}.innerHTML = (Math.round((this.value * 100.0 / 255.0) * 100) / 100).toFixed(2);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
var lightNumber = {{LIGHT_NUMBER}};
|
||||||
|
var slider = document.getElementById("bri{{LIGHT_NUMBER_DEC}}");
|
||||||
|
var pwm = document.getElementById("light{{LIGHT_NUMBER_DEC}}_pwm");
|
||||||
|
if (lightNumber === 1) {
|
||||||
|
slider.style.background = "linear-gradient(to bottom, " + rgb2Hex(31, 119, 180) + ", white)";
|
||||||
|
pwm.style.background = "linear-gradient(to right, white, " + rgb2Hex(31, 119, 180) + ")";
|
||||||
|
} else if (lightNumber === 2) {
|
||||||
|
slider.style.background = "linear-gradient(to bottom, " + rgb2Hex(255, 127, 14) + ", white)";
|
||||||
|
pwm.style.background = "linear-gradient(to right, white, " + rgb2Hex(255, 127, 14) + ")";
|
||||||
|
} else if (lightNumber === 3) {
|
||||||
|
slider.style.background = "linear-gradient(to bottom, " + rgb2Hex(44, 160, 44) + ", white)";
|
||||||
|
pwm.style.background = "linear-gradient(to right, white, " + rgb2Hex(44, 160, 44) + ")";
|
||||||
|
} else if (lightNumber === 4) {
|
||||||
|
slider.style.background = "linear-gradient(to bottom, " + rgb2Hex(214, 39, 40) + ", white)";
|
||||||
|
pwm.style.background = "linear-gradient(to right, white, " + rgb2Hex(214, 39, 40) + ")";
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -74,27 +74,6 @@ background-color: #ddd;
|
||||||
input[type=range]:focus {
|
input[type=range]:focus {
|
||||||
outline: none;
|
outline: none;
|
||||||
}
|
}
|
||||||
/*
|
[id^="bri"] {
|
||||||
input[type=range]::-webkit-slider-thumb {
|
width: 50%;
|
||||||
-webkit-appearance: none;
|
}
|
||||||
appearance: none;
|
|
||||||
width: 15px;
|
|
||||||
height: 15px;
|
|
||||||
border-radius: 10%;
|
|
||||||
background-color: #a1a1a1;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
input[type=range]::-moz-range-thumb {
|
|
||||||
width: 15px;
|
|
||||||
height: 15px;
|
|
||||||
border-radius: 10%;
|
|
||||||
background-color: #a1a1a1;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
input[type=range]::-ms-thumb {
|
|
||||||
width: 15px;
|
|
||||||
height: 15px;
|
|
||||||
border-radius: 10%;
|
|
||||||
background-color: #a1a1a1;
|
|
||||||
cursor: pointer;
|
|
||||||
}*/
|
|
|
@ -105,4 +105,10 @@ function sendSliderValue(x) {
|
||||||
console.error(`Error sending slider value to ${url}: ${error}`);
|
console.error(`Error sending slider value to ${url}: ${error}`);
|
||||||
});
|
});
|
||||||
}, 500);
|
}, 500);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function rgb2Hex(r, g, b) {
|
||||||
|
// RGB-Werte in hexadezimale Werte umwandeln
|
||||||
|
var hex = "#" + ((1 << 24) | (r << 16) | (g << 8) | b).toString(16).slice(1);
|
||||||
|
return hex;
|
||||||
|
}
|
||||||
|
|
Loading…
Reference in a new issue