109 lines
4.5 KiB
HTML
109 lines
4.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport">
|
|
<meta charset="utf-8">
|
|
<title>DMX Settings</title>
|
|
<script>
|
|
var d=document;
|
|
var loc = false, locip, locproto = "http:";
|
|
function H(){window.open("https://github.com/Aircoookie/WLED/wiki/DMX");}
|
|
function B(){window.open(getURL("/settings"),"_self");}
|
|
function GCH(num) {
|
|
d.getElementById('dmxchannels').innerHTML += "";
|
|
for (i=0;i<num;i++) {
|
|
d.getElementById('dmxchannels').innerHTML += "<span id=CH" + (i+1) + "s >Channel " + (i+1) + ": <select name=CH" + (i+1) + " id=\"CH" + (i+1) + "\"><option value=0>Set to 0</option><option value=1>Red</option><option value=2>Green</option><option value=3>Blue</option><option value=4>White</option><option value=5>Shutter (Brightness)</option><option value=6>Set to 255</option></select></span><br />\n";
|
|
}
|
|
}
|
|
function mMap(){
|
|
numCh=document.Sf.CN.value;
|
|
numGap=document.Sf.CG.value;
|
|
if (parseInt(numCh)>parseInt(numGap)) {
|
|
d.getElementById("gapwarning").style.display="block";
|
|
} else {
|
|
d.getElementById("gapwarning").style.display="none";
|
|
}
|
|
for (i=0;i<15;i++) {
|
|
if (i>=numCh) {
|
|
d.getElementById("CH"+(i+1) + "s").style.opacity = "0.5";
|
|
d.getElementById("CH"+(i+1)).disabled = true;
|
|
|
|
} else {
|
|
d.getElementById("CH"+(i+1) + "s").style.opacity = "1";
|
|
d.getElementById("CH"+(i+1)).disabled = false;
|
|
}
|
|
}
|
|
}
|
|
// https://www.educative.io/edpresso/how-to-dynamically-load-a-js-file-in-javascript
|
|
function loadJS(FILE_URL, async = true) {
|
|
let scE = d.createElement("script");
|
|
scE.setAttribute("src", FILE_URL);
|
|
scE.setAttribute("type", "text/javascript");
|
|
scE.setAttribute("async", async);
|
|
d.body.appendChild(scE);
|
|
// success event
|
|
scE.addEventListener("load", () => {
|
|
//console.log("File loaded");
|
|
GCH(15);GetV();mMap();
|
|
});
|
|
// error event
|
|
scE.addEventListener("error", (ev) => {
|
|
console.log("Error on loading file", ev);
|
|
alert("Loading of configuration script failed.\nIncomplete page data!");
|
|
});
|
|
}
|
|
function S(){
|
|
let l = window.location;
|
|
if (l.protocol == "file:") {
|
|
loc = true;
|
|
locip = localStorage.getItem('locIp');
|
|
if (!locip) {
|
|
locip = prompt("File Mode. Please enter WLED IP!");
|
|
localStorage.setItem('locIp', locip);
|
|
}
|
|
} else {
|
|
// detect reverse proxy
|
|
let path = l.pathname;
|
|
let paths = path.slice(1,path.endsWith('/')?-1:undefined).split("/");
|
|
if (paths.length > 2) {
|
|
paths.pop(); // remove "dmx"
|
|
paths.pop(); // remove "settings"
|
|
locproto = l.protocol;
|
|
loc = true;
|
|
locip = l.hostname + (l.port ? ":" + l.port : "") + "/" + paths.join('/');
|
|
}
|
|
}
|
|
loadJS(getURL('/settings/s.js?p=7'), false); // If we set async false, file is loaded and executed, then next statement is processed
|
|
if (loc) d.Sf.action = getURL('/settings/dmx');
|
|
}
|
|
function getURL(path) {
|
|
return (loc ? locproto + "//" + locip : "") + path;
|
|
}
|
|
</script>
|
|
<style>@import url("style.css");</style>
|
|
</head>
|
|
<body onload="S()">
|
|
<form id="form_s" name="Sf" method="post">
|
|
<div class="toprow">
|
|
<div class="helpB"><button type="button" onclick="H()">?</button></div>
|
|
<button type="button" onclick="B()">Back</button><button type="submit">Save</button><hr>
|
|
</div>
|
|
<h2>Imma firin ma lazer (if it has DMX support)</h2><!-- TODO: Change to something less-meme-related //-->
|
|
|
|
Proxy Universe <input name=PU type=number min=0 max=63999 required> from E1.31 to DMX (0=disabled)<br>
|
|
<i>This will disable the LED data output to DMX configurable below</i><br><br>
|
|
<i>Number of fixtures is taken from LED config page</i><br>
|
|
|
|
Channels per fixture (15 max): <input type="number" min="1" max="15" name="CN" maxlength="2" onchange="mMap();"><br />
|
|
Start channel: <input type="number" min="1" max="512" name="CS" maxlength="2"><br />
|
|
Spacing between start channels: <input type="number" min="1" max="512" name="CG" maxlength="2" onchange="mMap();"> [ <a href="javascript:alert('if set to 10, first fixture will start at 10,\nsecond will start at 20 etc.\nRegardless of the channel count.\nMakes memorizing channel numbers easier.');">info</a> ]<br>
|
|
<div id="gapwarning" style="color: orange; display: none;">WARNING: Channel gap is lower than channels per fixture.<br />This will cause overlap.</div>
|
|
<button type="button" onclick="location.href='/dmxmap';">DMX Map</button><br>
|
|
DMX fixtures start LED: <input type="number" min="0" max="1500" name="SL">
|
|
<h3>Channel functions</h3>
|
|
<div id="dmxchannels"></div>
|
|
<hr><button type="button" onclick="B()">Back</button><button type="submit">Save</button>
|
|
</form>
|
|
</body>
|
|
</html>
|