48 lines
1.4 KiB
JavaScript
48 lines
1.4 KiB
JavaScript
Element.prototype.insertChildAtIndex = function(child, index) {
|
|
if (!index) index = 0;
|
|
|
|
if (index >= this.children.length) {
|
|
this.appendChild(child);
|
|
} else {
|
|
this.insertBefore(child, this.children[index]);
|
|
}
|
|
}
|
|
|
|
Element.prototype.clearChildren = function() {
|
|
while (this.firstChild) {
|
|
this.removeChild(this.lastChild);
|
|
}
|
|
}
|
|
|
|
Number.prototype.pad = function(size) {
|
|
var s = String(this);
|
|
while (s.length < (size || 2)) {s = "0" + s;}
|
|
return s;
|
|
}
|
|
|
|
window.addEventListener("load", init);
|
|
|
|
function init() {
|
|
const sliders = document.querySelectorAll('input[type="range"]');
|
|
for (let slider of sliders) {
|
|
let changeFunction = event => {
|
|
const progress = event.target.value;
|
|
const max = event.target.max;
|
|
const value = Math.round(progress / max * 100);
|
|
slider.style.background = `linear-gradient(90deg, rgba(200,55,55,1) ${value}%, #333 ${value}%)`;
|
|
};
|
|
|
|
slider.setValue = value => {
|
|
if (slider.mousedown) return;
|
|
slider.value = value;
|
|
changeFunction({target: slider});
|
|
}
|
|
|
|
slider.addEventListener("mousedown", event => slider.mousedown = true);
|
|
slider.addEventListener("mouseup", event => slider.mousedown = false);
|
|
|
|
slider.addEventListener("input", changeFunction);
|
|
slider.addEventListener("change", changeFunction);
|
|
changeFunction({target: slider});
|
|
}
|
|
} |