buzzer works, some code removed

src/main/webapp/WEB-INF/jsp/index.jsp

@@ -18,15 +18,14 @@
     <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 rooms = [
-        var devices = [
+            {"roomId": 0, "roomName": "Raum 1"},
-            {"red":72,"green":69,"blue":255,"startAddress":1,"type":"Par56Spot","deviceId":0,"deviceName":"Par56 Lampe 1","picture":null},
+            {"roomId": 1, "roomName": "Raum 2"},
-            {"red":111,"green":222,"blue":23,"startAddress":6,"type":"Par56Spot","deviceId":1,"deviceName":"Par56 Lampe 2","picture":null},
+            {"roomId": 2, "roomName": "Raum 3"},
-            {"red":0,"green":0,"blue":0,"startAddress":11,"type":"Par56Spot","deviceId":2,"deviceName":"Par56 Lampe 3","picture":null},
+            {"roomId": 3, "roomName": "Raum 4"}
-            {"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 volumes = {"room1":0,"room2":0,"room3":0,"room4":0};
+        var devices;
         $(document).ready(
                 function() {
 
@@ -91,16 +90,16 @@
                     var colorpicker_raum1 = new jQuery.ColorPicker('#colorpicker-raum1', {
                         imagepath: '/resources/images/colorpicker/',
                         change: function(hexcolor) {
-                        red = hexcolor.substr(1,2);
+                            var red = hexcolor.substr(1,2);
-                        green = hexcolor.substr(3,2);
+                            var green = hexcolor.substr(3,2);
-                        blue = hexcolor.substr(5,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");
+                            console.log("data changed" + hexcolor);
 
                         }
                     });
@@ -113,10 +112,34 @@
                         }
 
                     });
+                    $('.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 hexstring = '#' + devices[$(this).attr('name')].red.toString(16) + devices[$(this).attr('name')].green.toString(16) + devices[$(this).attr('name')].blue.toString(16);
+                            var red = devices[$(this).attr('name')].red.toString(16);
-                        console.log(hexstring);
+                            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);
                         });
                     });
@@ -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">
@@ -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>