Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

MCH2022 raw changes #7

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open

MCH2022 raw changes #7

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
3cbaf8e
MCH2022 raw changes
bluemaex Jul 22, 2023
baa310d
remove accidentially added changes
bluemaex Aug 2, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ lib-cov
*.pid
*.gz

js
pids
logs
results
Expand Down
22 changes: 22 additions & 0 deletions dmx-web.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -52,6 +52,28 @@ function DMXWeb() {
res.sendFile(__dirname + '/index.html');
});


app.get('/index.html', (req, res) => {
res.sendFile(__dirname + '/index.html');
});

app.get('/js/jquery-ui.min.js', (req, res) => {
res.sendFile(__dirname + '/js/jquery-ui.min.js');
});

app.get('/js/bootstrap.min.js', (req, res) => {
res.sendFile(__dirname + '/js/bootstrap.min.js');
});

app.get('/js/jquery.min.js', (req, res) => {
res.sendFile(__dirname + '/js/jquery.min.js');
});

app.get('/js/bootstrap-combined.min.css', (req, res) => {
res.sendFile(__dirname + '/js/bootstrap-combined.min.css');
});


app.get('/config', (req, res) => {
const response = {'devices': dmx.devices, 'universes': {}};

Expand Down
143 changes: 129 additions & 14 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<title>DMX Lichtschalter</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="apple-mobile-web-app-capable" content="yes" />
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet">
<link href="/js/bootstrap-combined.min.css" rel="stylesheet">
<style>
body {
background: #222;
Expand All @@ -14,6 +14,10 @@
h1 {
clear: both;
}
h1 span {
font-size: small;
color: lightgrey;
}
input[type=range] {
-webkit-appearance: slider-vertical;
height: 100px;
Expand Down Expand Up @@ -42,14 +46,17 @@
text-align: center;
float: left;
}

.ranges {
float: left;
max-width: 200px;
}
.btn {
margin-bottom: 1em;
}
</style>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js"></script>
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<script src="/js/jquery.min.js"></script>
<script src="/js/jquery-ui.min.js"></script>
<script src="/js/bootstrap.min.js"></script>
<script src="/socket.io/socket.io.js"></script>
<script>
function get_html_id(universe, channel) {
Expand Down Expand Up @@ -121,15 +128,68 @@
}
});


/* sliders */
for(var universe in setup.universes) {
var html = "<div><h1>" + universe + "</h1>";
var html = "<div><h1>" + universe + " &nbsp; <span>(<a target=\"new\" href=\"/state/"+universe+"\">get state for preset</a>)</span></h1>";

/* global device type control */
var types = {}
for(var device in setup.universes[universe].devices) {
var dev = setup.universes[universe].devices[device];
types[dev.type] = (types[dev.type] || []).concat([dev.address])
}
html += '<h4 class="name">Same Device Type Control</h4>';
for (var type in types) {
html += '<div class="device">';
html += '<h5 class="name">'+type+'</h5>';

for(var channel in devices[type].channels) {
var channel_id = ''
for (var type_channel in types[type]) channel_id += (Number(types[type][type_channel]) + Number(channel)) + ','
var html_id = get_html_id(universe, channel_id);
html += '<div class="channel">'
html += '<label for="' + html_id + '">' + devices[type].channels[channel] + '</label>';
html += '<input id="' + html_id + '" type="range" min="0" value="0" max="255" orient="vertical">'
html += '</div>'
}

html += '<div class="ranges">'
// /* rgb */
if(devices[type].channels.includes('red') && devices[type].channels.includes('blue') && devices[type].channels.includes('green')) {
var html_id = get_html_id(universe, types[type].join(','));
html += '<input id="picker_'+html_id+'" type="color" data-red="'+devices[type].channels.indexOf('red');
html += '" data-green="'+devices[type].channels.indexOf('green')+'" data-blue="'+devices[type].channels.indexOf('blue')+'"/>';
}

/* ranges with options */
if (devices[type].ranges) {
for(var r in devices[type].ranges) {
const range = devices[type].ranges[r]
if (range.type !== 'option') continue

var html_id = get_html_id(universe, types[type].join(','));
html += '<select id="'+r+'_'+html_id+'">'
html += '<option values="">'+r+' values</option>'
for(var k in range.options) {
html += '<option value="' + range.options[k].value + '">'+ range.options[k].label +'</option>'
}
html += '</select>'
}
}
html += '</div>'

html += '</div>';
}
html += '</div>'

/* individual device control */
html += '<br style="clear: both;"/><br />'
html += '<h4 class="name">Individual Device Control</h4>';
for(var device in setup.universes[universe].devices) {
var dev = setup.universes[universe].devices[device];
html += '<div class="device">';
if(dev.name !== undefined) {
html += '<h4 class="name">'+dev.name+'</h4>'
html += '<h5 class="name">'+dev.name+'</h5>'
}
for(var channel in devices[dev.type].channels) {
var channel_id = dev.address + Number(channel)
Expand All @@ -139,13 +199,35 @@
html += '<input id="' + html_id + '" type="range" min="0" value="0" max="255" orient="vertical">'
html += '</div>'
}

html += '<div class="ranges">'

/* rgb */
if(devices[dev.type].channels.includes('red') && devices[dev.type].channels.includes('blue') && devices[dev.type].channels.includes('green')) {
var html_id = get_html_id(universe, dev.address);
html += '<input id="picker_'+html_id+'" type="color" data-red="'+devices[dev.type].channels.indexOf('red');
html += '" data-green="'+devices[dev.type].channels.indexOf('green')+'" data-blue="'+devices[dev.type].channels.indexOf('blue')+'"/>';
}

/* ranges with options */
if (devices[dev.type].ranges) {
for(var r in devices[dev.type].ranges) {
const range = devices[dev.type].ranges[r]
if (range.type !== 'option') continue

var html_id = get_html_id(universe, types[type].join(','));
html += '<select id="'+r+'_'+html_id+'">'
html += '<option values="">'+r+' values</option>'
for(var k in range.options) {
html += '<option value="' + range.options[k].value + '">'+ range.options[k].label +'</option>'
}
html += '</select>'
}
}
html += '</div>'
}
html += '</div>'

html += "</div>";
$(html).hide().appendTo('#sliders').fadeIn();
}
Expand Down Expand Up @@ -175,17 +257,48 @@
var u = {};
var tar = $(e.target);
var value = rgb_to_array(tar.val());
u[Number(i[3])+Number(tar.data('red'))] = value[0];
u[Number(i[3])+Number(tar.data('green'))] = value[1];
u[Number(i[3])+Number(tar.data('blue'))] = value[2];

i[3] = i[3].split(',')
for (var port in i[3]) {
u[Number(port)+Number(tar.data('red'))] = value[0];
u[Number(port)+Number(tar.data('green'))] = value[1];
u[Number(port)+Number(tar.data('blue'))] = value[2];
}

console.log(i[2], u)
socket.emit('update', i[2], u);
}
else {
} else {
var u = {};
u[i[2]] = e.target.value;
console.log(i)

i[2] = i[2].split(',')
for (var port in i[2]) {
u[i[2][Number(port)]] = Number(e.target.value)
}

console.log(i[1], u)
socket.emit('update', i[1], u);
}
});
$("select").live("change", function(e) {
var i = e.target.id.split('_');
var u = {};

i[3] = i[3].split(',')
for (var port in i[3]) {
if (i[0] === 'ctrl') {
u[i[3][Number(port)]] = Number(e.target.value)
} else {
console.log(i[3][port])
u[i[3][port]] = 11;
u[i[3][port]+1] = Number(e.target.value); // todo find number of option
}
}

console.log("update", i[2], u)
socket.emit('update', i[2], u);
})

socket.emit('request_refresh');
});
socket.on('update', function (universe, update) {
Expand Down Expand Up @@ -221,6 +334,7 @@
});

});
console.log(socket)
</script>
</head>
<body>
Expand Down Expand Up @@ -250,6 +364,7 @@
<div id="scripts" class="tab-pane">

</div>

</div>
</div>
</body>
Expand Down