diff --git a/src/main/webapp/WEB-INF/jsp/index.jsp b/src/main/webapp/WEB-INF/jsp/index.jsp
index 204d0ea..1916e1e 100644
--- a/src/main/webapp/WEB-INF/jsp/index.jsp
+++ b/src/main/webapp/WEB-INF/jsp/index.jsp
@@ -20,15 +20,20 @@
     <script type="text/javascript">
         $(document).ready(
             function() {
-                var dataChanged = false;
-                var par56eins = $.parseJSON('{"deviceId":1, "options": {"red":0,"blue":0,"green":0} }');
-                var par56null = $.parseJSON('{"deviceId":0, "options": {"red":0,"blue":0,"green":0} }');
                 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}
+                ];
 
                 function sendData(data) {
                     $.ajax({
                         type: 'POST',
-                        url: "/control/devices/0",
+                        url: "/control/devices",
                         contentType: "application/json",
                         dataType: "json",
                         data: JSON.stringify(data)
@@ -36,13 +41,18 @@
                 }
 
                 var senden = function sendOutAllDevices() {
-                    if(dataChanged) {
-                        dataChanged = false;
-                        sendData(par56null);
-                        console.log("send data");
+                    var changedDevs = new Array();
+                    for(var i=0;i<devices.length;i++) {
+                        if(devices[i].type=="Par56Spot" && devices[i].dirty) {
+                            delete devices[i].dirty;
+                            changedDevs.push(devices[i]);
+                        }
+                    }
+                    if (changedDevs.length > 0) {
+                        sendData(changedDevs);
                     }
                     console.log("set new interval for sending");
-                    window.setTimeout(senden, 200);
+                    //window.setTimeout(senden, 100);
                 };
 
                 // vielleicht baut man lieber was mit setTimeout und setzt das jeweils neu wenn man daten ändert
@@ -68,39 +78,34 @@
                     volumes.room4 = ui.value;
                     dataChanged = true;
                 } });
-
-                $("#buttonLampe1").click(function() {
-
-                    $.getJSON('/control/devices/1', function(data) {
-
-                        $("#messages").append("type: " + data.type + " name=" + data.deviceName + "<br/>" );
-                    });
-
+                $("#tabs").tabs();
+                $("#v-tabs").tabs().addClass('ui-tabs-vertical');
+                $(".lampel .circle").click(function() {
+                    if($(this).hasClass('black')){
+                        $(this).removeClass('black');
+                    } else {
+                        $(this).addClass('black');
+                    }
                 });
-                $(document).ready(function() {
-                    $("#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);
-                            par56null.options.red = parseInt(red, 16);
-                            par56null.options.blue = parseInt(blue, 16);
-                            par56null.options.green = parseInt(green, 16);
-                            console.log("data changed");
-                            dataChanged = true;
+                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);
+                        console.log("data changed");
+                        dataChanged = true;
 
+                    }
+                });
+                $.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>");
                         }
-                    });
+                    }
+
                 });
             }
         );
@@ -138,14 +143,7 @@
                 </ul>
                 <div id="v-tabs-1">
                    <div id="colorpicker-raum1"></div>
-                   <select multiple="multiple">
-                       <option>Par 56 Lampe 1</option>
-                       <option>Par 56 Lampe 2</option>
-                       <option>Par 56 Lampe 3</option>
-                       <option>Par 56 Lampe 4</option>
-                       <option>Par 56 Lampe 5</option>
-                       <option>Par 56 Lampe 6</option>
-                       <option>Par 56 Lampe 7</option>
+                   <select multiple="multiple" id="par56select">
 
                    </select>
                 </div>