78 lines
2.2 KiB
JavaScript
78 lines
2.2 KiB
JavaScript
var socket;
|
|
var timer;
|
|
var timeout;
|
|
var modal = new bootstrap.Modal(document.getElementById("reconnectBackdrop"));
|
|
var slectedChannel = 8;
|
|
|
|
function addLabelAndListener(name, callback) {
|
|
let rootElement = document.getElementById(name + "-input")
|
|
rootElement.addEventListener('click', callback);
|
|
|
|
let inputArray = rootElement.elements[name + "-selection"];
|
|
for (let inputIndex = 0; inputIndex < inputArray.length; inputIndex++) {
|
|
let element = inputArray[inputIndex]
|
|
let label = document.createElement("label");
|
|
label.classList.add("btn");
|
|
label.classList.add("btn-outline-primary");
|
|
label.classList.add("text-capitalize");
|
|
label.setAttribute("for", element.id);
|
|
labelText = element.id.split('-')[0];
|
|
element.value = inputIndex;
|
|
label.innerHTML = labelText;
|
|
element.insertAdjacentElement("afterend", label);
|
|
}
|
|
}
|
|
|
|
addLabelAndListener("ws", buttonSelectCallback);
|
|
addLabelAndListener("mode", buttonSelectCallback);
|
|
addLabelAndListener("pattern", buttonSelectCallback);
|
|
addLabelAndListener("channel", buttonSelectCallback);
|
|
// addLabelAndListener("channelGlobal", channelSelectCallback);
|
|
|
|
var colorPicker = new iro.ColorPicker('#mainPicker', {
|
|
colors: [
|
|
'hsl(0, 100, 50)', // pure red
|
|
],
|
|
layout: [{
|
|
component: iro.ui.Wheel,
|
|
options: {
|
|
wheelLightness: false
|
|
}
|
|
}, {
|
|
component: iro.ui.Slider,
|
|
options: {
|
|
sliderType: 'value'
|
|
}
|
|
}],
|
|
layoutDirection: 'horizontal',
|
|
// display: "flex",
|
|
width: 250,
|
|
margin: 0,
|
|
handleRadius: 14
|
|
});
|
|
|
|
// var modulationPicker = new iro.ColorPicker('#modulationPicker', {
|
|
// colors: [
|
|
// 'hsl(0, 100, 50)', // pure red
|
|
// ],
|
|
// layout: [{
|
|
// component: iro.ui.Wheel,
|
|
// options: {
|
|
// wheelLightness: false
|
|
// }
|
|
// }, {
|
|
// component: iro.ui.Slider,
|
|
// options: {
|
|
// sliderType: 'value'
|
|
// }
|
|
// }],
|
|
// layoutDirection: 'horizontal',
|
|
// // display: "flex",
|
|
// width: 250,
|
|
// margin: 0,
|
|
// handleRadius: 14
|
|
// });
|
|
|
|
reconnect();
|
|
colorPicker.on("color:change", colorChangeCallback);
|
|
// modulationPicker.on("color:change", modulationColorChangeCallback);
|