buzzer works, some code removed
This commit is contained in:
parent
a833a3b6a4
commit
855efcd572
|
@ -18,109 +18,132 @@
|
|||
<script type="text/javascript" src="<c:url value="/resources/js/jquery.mousewheel.js" />"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
var volumes = $.parseJSON('{"room1":0,"room2":0,"room3":0,"room4":0}');
|
||||
var devices = [
|
||||
{"red":72,"green":69,"blue":255,"startAddress":1,"type":"Par56Spot","deviceId":0,"deviceName":"Par56 Lampe 1","picture":null},
|
||||
{"red":111,"green":222,"blue":23,"startAddress":6,"type":"Par56Spot","deviceId":1,"deviceName":"Par56 Lampe 2","picture":null},
|
||||
{"red":0,"green":0,"blue":0,"startAddress":11,"type":"Par56Spot","deviceId":2,"deviceName":"Par56 Lampe 3","picture":null},
|
||||
{"red":0,"green":0,"blue":0,"startAddress":16,"type":"Par56Spot","deviceId":3,"deviceName":"Par56 Lampe 4","picture":null},
|
||||
{"mode":0,"speed":0,"intensity":0,"startAddress":21,"type":"Strobe1500","deviceId":4,"deviceName":"Stroboskop 1","picture":null},
|
||||
{"red":0,"green":0,"blue":0,"startAddress":508,"type":"Par56Spot","deviceId":5,"deviceName":"Par56 Lampe 5","picture":null}
|
||||
var rooms = [
|
||||
{"roomId": 0, "roomName": "Raum 1"},
|
||||
{"roomId": 1, "roomName": "Raum 2"},
|
||||
{"roomId": 2, "roomName": "Raum 3"},
|
||||
{"roomId": 3, "roomName": "Raum 4"}
|
||||
];
|
||||
var volumes = {"room1":0,"room2":0,"room3":0,"room4":0};
|
||||
var devices;
|
||||
$(document).ready(
|
||||
function() {
|
||||
function() {
|
||||
|
||||
|
||||
function sendData(data) {
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: "/control/devices",
|
||||
contentType: "application/json",
|
||||
dataType: "json",
|
||||
data: JSON.stringify(data)
|
||||
});
|
||||
console.log(data);
|
||||
console.log(JSON.stringify(data));
|
||||
}
|
||||
|
||||
var senden = function sendOutAllDevices() {
|
||||
var changedDevs = new Array();
|
||||
for(var i=0;i<devices.length;i++) {
|
||||
if(devices[i].type=="Par56Spot" && devices[i].dirty) {
|
||||
delete devices[i].dirty;
|
||||
var dev = {"deviceId": i, "options":{"red":devices[i].red, "green":devices[i].green, "blue":devices[i].blue}};
|
||||
changedDevs.push(dev);
|
||||
}
|
||||
}
|
||||
if (changedDevs.length > 0) {
|
||||
sendData({"timeStamp": Math.round(new Date().getTime()/1000), "updates": changedDevs});
|
||||
}
|
||||
console.log("set new interval for sending");
|
||||
|
||||
};
|
||||
window.setInterval(senden, 100);
|
||||
|
||||
$("#slider1").slider({ min: 0, max: 100, slide: function(event, ui) {
|
||||
volumes.room1 = ui.value;
|
||||
dataChanged = true;
|
||||
} });
|
||||
|
||||
$("#slider2").slider({ min: 0, max: 100, slide: function(event, ui) {
|
||||
volumes.room2 = ui.value;
|
||||
dataChanged = true;
|
||||
} });
|
||||
|
||||
$("#slider3").slider({ min: 0, max: 100, slide: function(event, ui) {
|
||||
volumes.room3 = ui.value;
|
||||
dataChanged = true;
|
||||
} });
|
||||
|
||||
$("#slider4").slider({ min: 0, max: 100, slide: function(event, ui) {
|
||||
volumes.room4 = ui.value;
|
||||
dataChanged = true;
|
||||
} });
|
||||
$("#tabs").tabs();
|
||||
$("#v-tabs").tabs().addClass('ui-tabs-vertical');
|
||||
$(".lampel .circle").click(function() {
|
||||
if($(this).hasClass('black')){
|
||||
$(this).removeClass('black');
|
||||
} else {
|
||||
$(this).addClass('black');
|
||||
}
|
||||
});
|
||||
var colorpicker_raum1 = new jQuery.ColorPicker('#colorpicker-raum1', {
|
||||
imagepath: '/resources/images/colorpicker/',
|
||||
change: function(hexcolor) {
|
||||
red = hexcolor.substr(1,2);
|
||||
green = hexcolor.substr(3,2);
|
||||
blue = hexcolor.substr(5,2);
|
||||
$('#par56select option:selected').each(function() {
|
||||
devices[$(this).attr('name')].red = parseInt(red, 16);
|
||||
devices[$(this).attr('name')].green = parseInt(green, 16);
|
||||
devices[$(this).attr('name')].blue = parseInt(blue, 16);
|
||||
devices[$(this).attr('name')].dirty = true;
|
||||
function sendData(data) {
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: "/control/devices",
|
||||
contentType: "application/json",
|
||||
dataType: "json",
|
||||
data: JSON.stringify(data)
|
||||
});
|
||||
console.log("data changed");
|
||||
|
||||
console.log(data);
|
||||
console.log(JSON.stringify(data));
|
||||
}
|
||||
});
|
||||
$.getJSON('/control/devices', function(data) {
|
||||
devices = data;
|
||||
for(var i=0;i<devices.length;i++) {
|
||||
if(devices[i].type=="Par56Spot") {
|
||||
$('#par56select').append("<option name=" + devices[i].deviceId + ">" + devices[i].deviceName + "</option>");
|
||||
|
||||
var senden = function sendOutAllDevices() {
|
||||
var changedDevs = new Array();
|
||||
for(var i=0;i<devices.length;i++) {
|
||||
if(devices[i].type=="Par56Spot" && devices[i].dirty) {
|
||||
delete devices[i].dirty;
|
||||
var dev = {"deviceId": i, "options":{"red":devices[i].red, "green":devices[i].green, "blue":devices[i].blue}};
|
||||
changedDevs.push(dev);
|
||||
}
|
||||
}
|
||||
}
|
||||
if (changedDevs.length > 0) {
|
||||
sendData({"timeStamp": Math.round(new Date().getTime()/1000), "updates": changedDevs});
|
||||
}
|
||||
console.log("set new interval for sending");
|
||||
|
||||
});
|
||||
$('#par56select').change(function() {
|
||||
$('#par56select option:selected').each(function() {
|
||||
var hexstring = '#' + devices[$(this).attr('name')].red.toString(16) + devices[$(this).attr('name')].green.toString(16) + devices[$(this).attr('name')].blue.toString(16);
|
||||
console.log(hexstring);
|
||||
colorpicker_raum1.hex(hexstring);
|
||||
};
|
||||
window.setInterval(senden, 100);
|
||||
|
||||
$("#slider1").slider({ min: 0, max: 100, slide: function(event, ui) {
|
||||
volumes.room1 = ui.value;
|
||||
dataChanged = true;
|
||||
} });
|
||||
|
||||
$("#slider2").slider({ min: 0, max: 100, slide: function(event, ui) {
|
||||
volumes.room2 = ui.value;
|
||||
dataChanged = true;
|
||||
} });
|
||||
|
||||
$("#slider3").slider({ min: 0, max: 100, slide: function(event, ui) {
|
||||
volumes.room3 = ui.value;
|
||||
dataChanged = true;
|
||||
} });
|
||||
|
||||
$("#slider4").slider({ min: 0, max: 100, slide: function(event, ui) {
|
||||
volumes.room4 = ui.value;
|
||||
dataChanged = true;
|
||||
} });
|
||||
$("#tabs").tabs();
|
||||
$("#v-tabs").tabs().addClass('ui-tabs-vertical');
|
||||
$(".lampel .circle").click(function() {
|
||||
if($(this).hasClass('black')){
|
||||
$(this).removeClass('black');
|
||||
} else {
|
||||
$(this).addClass('black');
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
var colorpicker_raum1 = new jQuery.ColorPicker('#colorpicker-raum1', {
|
||||
imagepath: '/resources/images/colorpicker/',
|
||||
change: function(hexcolor) {
|
||||
var red = hexcolor.substr(1,2);
|
||||
var green = hexcolor.substr(3,2);
|
||||
var blue = hexcolor.substr(5,2);
|
||||
$('#par56select option:selected').each(function() {
|
||||
devices[$(this).attr('name')].red = parseInt(red, 16);
|
||||
devices[$(this).attr('name')].green = parseInt(green, 16);
|
||||
devices[$(this).attr('name')].blue = parseInt(blue, 16);
|
||||
devices[$(this).attr('name')].dirty = true;
|
||||
});
|
||||
console.log("data changed" + hexcolor);
|
||||
|
||||
}
|
||||
});
|
||||
$.getJSON('/control/devices', function(data) {
|
||||
devices = data;
|
||||
for(var i=0;i<devices.length;i++) {
|
||||
if(devices[i].type=="Par56Spot") {
|
||||
$('#par56select').append("<option name=" + devices[i].deviceId + ">" + devices[i].deviceName + "</option>");
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
$('.buzzer button').click(function() {
|
||||
var span = $(this).parent().find('span');
|
||||
span
|
||||
.toggleClass('red')
|
||||
.toggleClass('green');
|
||||
if(span.text() == "Auf") {
|
||||
span.text("Zu");
|
||||
} else {
|
||||
span.text("Auf");
|
||||
}
|
||||
|
||||
})
|
||||
$('#par56select').change(function() {
|
||||
$('#par56select option:selected').each(function() {
|
||||
var red = devices[$(this).attr('name')].red.toString(16);
|
||||
var green = devices[$(this).attr('name')].green.toString(16);
|
||||
var blue = devices[$(this).attr('name')].blue.toString(16);
|
||||
if(red.length == 1) {
|
||||
red += red;
|
||||
}
|
||||
if(green.length == 1) {
|
||||
green += green;
|
||||
}
|
||||
if(blue.length == 1) {
|
||||
blue += blue;
|
||||
}
|
||||
var hexstring = '#' + red + green + blue;
|
||||
console.log("lampe:" + hexstring);
|
||||
colorpicker_raum1.hex(hexstring);
|
||||
});
|
||||
});
|
||||
}
|
||||
);
|
||||
|
||||
</script>
|
||||
|
@ -132,9 +155,6 @@
|
|||
<ul>
|
||||
<li><a href="#tabs-1">Global</a></li>
|
||||
<li><a href="#tabs-2">Raum 1</a></li>
|
||||
<li><a href="#tabs-3">Raum 2</a></li>
|
||||
<li><a href="#tabs-4">Raum 3</a></li>
|
||||
<li><a href="#tabs-5">Raum 4</a></li>
|
||||
</ul>
|
||||
<div id="tabs-1">
|
||||
|
||||
|
@ -142,10 +162,6 @@
|
|||
<span class="circle red">Zu</span>
|
||||
<button>Buzzern</button>
|
||||
</div>
|
||||
<div class="buzzer">
|
||||
<span class="circle green">Auf</span>
|
||||
<button>Buzzern</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="tabs-2">
|
||||
<div id="v-tabs" class="inner-tabs-container">
|
||||
|
@ -155,10 +171,10 @@
|
|||
<li><a href="#v-tabs-3">Lampel</a></li>
|
||||
</ul>
|
||||
<div id="v-tabs-1">
|
||||
<div id="colorpicker-raum1"></div>
|
||||
<select multiple="multiple" id="par56select">
|
||||
<div id="colorpicker-raum1"></div>
|
||||
<select multiple="multiple" id="par56select">
|
||||
|
||||
</select>
|
||||
</select>
|
||||
</div>
|
||||
<div id="v-tabs-2">
|
||||
<label for="slider1">Lautstärke Raum 1:</label><div id="slider1" class="slider"></div>
|
||||
|
@ -180,29 +196,6 @@
|
|||
</div>
|
||||
|
||||
</div>
|
||||
<div id="tabs-3">
|
||||
|
||||
<label for="slider2">Lautstärke Raum 2:</label><div id="slider2" class="slider"></div>
|
||||
</div>
|
||||
|
||||
<div id="tabs-4">
|
||||
|
||||
<label for="slider3">Lautstärke Raum 3:</label><div id="slider3" class="slider"></div>
|
||||
|
||||
</div>
|
||||
|
||||
<div id="tabs-5">
|
||||
|
||||
<label for="slider4">Lautstärke Raum 4:</label><div id="slider4" class="slider"></div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<input type="button" value="Get Device 1" id="buttonLampe1" />
|
||||
|
||||
<div id="messages"></div>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
Loading…
Reference in New Issue