diff --git a/src/main/webapp/WEB-INF/jsp/index.jsp b/src/main/webapp/WEB-INF/jsp/index.jsp index 3e109d2..18a6402 100644 --- a/src/main/webapp/WEB-INF/jsp/index.jsp +++ b/src/main/webapp/WEB-INF/jsp/index.jsp @@ -12,6 +12,7 @@ " rel="stylesheet" /> + @@ -26,45 +27,8 @@

CTDO Raumsteuerung

- -
- -
-
-
-
- -
-
- -
-
-
-
-
-
- - - - -
- -
-
- -
- Raumlicht:
- An Aus -
+
+
@@ -80,6 +44,20 @@
{{/each}} + + diff --git a/src/main/webapp/WEB-INF/jsp/index2.jsp b/src/main/webapp/WEB-INF/jsp/index2.jsp new file mode 100644 index 0000000..9740e38 --- /dev/null +++ b/src/main/webapp/WEB-INF/jsp/index2.jsp @@ -0,0 +1,77 @@ +<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %> + +<%@taglib prefix="spring" uri="http://www.springframework.org/tags" %> +<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> + + + + WebSockets + + " rel="stylesheet"/> + " rel="stylesheet"/> + + + + + + +

CTDO Raumsteuerung

+ +

Par56:
+ + + +

+

Lampel:
+ + + + + + +

+ + + diff --git a/src/main/webapp/resources/js/events.class.js b/src/main/webapp/resources/js/events.class.js new file mode 100644 index 0000000..6801ccf --- /dev/null +++ b/src/main/webapp/resources/js/events.class.js @@ -0,0 +1,51 @@ +//Copyright (c) 2010 Nicholas C. Zakas. All rights reserved. +//MIT License + +function EventTarget(){ + this._listeners = {}; +} + +EventTarget.prototype = { + + constructor: EventTarget, + + addListener: function(type, listener){ + if (typeof this._listeners[type] == "undefined"){ + this._listeners[type] = []; + } + + this._listeners[type].push(listener); + }, + + fire: function(event){ + if (typeof event == "string"){ + event = { type: event }; + } + if (!event.target){ + event.target = this; + } + + if (!event.type){ //falsy + throw new Error("Event object missing 'type' property."); + } + + if (this._listeners[event.type] instanceof Array){ + var listeners = this._listeners[event.type]; + for (var i=0, len=listeners.length; i < len; i++){ + listeners[i].call(this, event); + } + } + }, + + removeListener: function(type, listener){ + if (this._listeners[type] instanceof Array){ + var listeners = this._listeners[type]; + for (var i=0, len=listeners.length; i < len; i++){ + if (listeners[i] === listener){ + listeners.splice(i, 1); + break; + } + } + } + } +}; \ No newline at end of file diff --git a/src/main/webapp/resources/js/main.js b/src/main/webapp/resources/js/main.js index 9fb3d14..2e099a1 100644 --- a/src/main/webapp/resources/js/main.js +++ b/src/main/webapp/resources/js/main.js @@ -5,7 +5,9 @@ * Time: 00:51 * Main Javascript file */ - +var events = new EventTarget(); +var roomDevices = []; +var roomDeviceViews = []; Workspace = Backbone.Router.extend({ routes:{ "":"home", @@ -13,11 +15,27 @@ Workspace = Backbone.Router.extend({ }, home: function() { + function roomsLoadedHandler() { + rooms.each(function(room) { + var id = room.get('roomId'); + roomDevices[id] = new RoomDevices(); + roomDevices[id].url = '/resources/json/room' + id + '.json'; + roomDevices[id].fetch(); + }); + events.removeListener("roomsLoaded", roomsLoadedHandler); + } + events.addListener("roomsLoaded", roomsLoadedHandler); rooms.fetch(); + }, show_room: function(id) { this.home(); - window.roomTabsId = id; + function roomsLoadedHandlerTabSelect() { + $('#room-tabs').tabs('select', id); + events.removeListener("roomsLoaded", roomsLoadedHandlerTabSelect) + } + events.addListener("roomsLoaded", roomsLoadedHandlerTabSelect); + } }); $(document).ready(function() { diff --git a/src/main/webapp/resources/js/models.js b/src/main/webapp/resources/js/models.js index d29a530..9ea62da 100644 --- a/src/main/webapp/resources/js/models.js +++ b/src/main/webapp/resources/js/models.js @@ -4,4 +4,8 @@ model: Room, url: '/resources/json/rooms.json' }); + window.Device = Backbone.Model.extend({}); + window.RoomDevices = Backbone.Collection.extend({ + model: Device + }); })(jQuery); \ No newline at end of file diff --git a/src/main/webapp/resources/js/views.js b/src/main/webapp/resources/js/views.js index ce01f0b..ffe1eaa 100644 --- a/src/main/webapp/resources/js/views.js +++ b/src/main/webapp/resources/js/views.js @@ -3,12 +3,46 @@ window.RoomsView = Backbone.View.extend({ this.collection.bind('reset', this.render, this); }, render: function() { + $('#room-tabs').tabs('destroy'); this.template = Handlebars.compile($("#room-tabs-template").html()); var rooms = {'rooms': this.collection.toJSON()}; - $('#room-tabs').html(this.template(rooms)).tabs(); - if(typeof(window.roomTabsId) != "undefined") { - $('#room-tabs').tabs('select', window.roomTabsId); - } + $('#room-tabs').html(this.template(rooms)).tabs({ + select: function(event, ui) { + //set hashtag? + } + }); + events.fire("roomsLoaded"); + + return this; + } +}); +window.LampelView = Backbone.View.extend({ + initialize: function() { + this.collection.bind('reset', this.render, this); + }, + render: function() { + events.fire("lampelLoaded"); + + return this; + } +}); +window.BuzzerView = Backbone.View.extend({ + initialize: function() { + this.collection.bind('reset', this.render, this); + }, + render: function() { + events.fire("buzzerLoaded"); + + return this; + } +}); +window.Par56View = Backbone.View.extend({ + initialize: function() { + this.collection.bind('reset', this.render, this); + }, + render: function() { + events.fire("par56Loaded"); + return this; } }); diff --git a/src/main/webapp/resources/json/room0.json b/src/main/webapp/resources/json/room0.json new file mode 100644 index 0000000..b9911b0 --- /dev/null +++ b/src/main/webapp/resources/json/room0.json @@ -0,0 +1,11 @@ +[ + { + "type":"Buzzer", + "deviceId":0, + "deviceName":"Buzzer", + "picture":null, + "options": { + "state":0 + } + } +] \ No newline at end of file diff --git a/src/main/webapp/resources/json/room1.json b/src/main/webapp/resources/json/room1.json new file mode 100644 index 0000000..7f52483 --- /dev/null +++ b/src/main/webapp/resources/json/room1.json @@ -0,0 +1,85 @@ +[ + { + "startAddress":1, + "type":"Par56Spot", + "deviceId":0, + "deviceName":"Par56 Lampe 1", + "picture":null, + "options": { + "red":0, + "green":0, + "blue":0 + } + }, + { + "startAddress":6, + "type":"Par56Spot", + "deviceId":1, + "deviceName":"Par56 Lampe 2", + "picture":null, + "options": { + "red":0, + "green":0, + "blue":0 + } + }, + { + "startAddress":11, + "type":"Par56Spot", + "deviceId":2, + "deviceName":"Par56 Lampe 3", + "picture":null, + "options": { + "red":0, + "green":0, + "blue":0 + } + }, + { + "startAddress":16, + "type":"Par56Spot", + "deviceId":3, + "deviceName":"Par56 Lampe 5", + "picture":null, + "options": { + "red":0, + "green":0, + "blue":0 + } + }, + { + "startAddress":21, + "type":"Strobe1500", + "deviceId":4, + "deviceName":"Stroboskop 1", + "picture":null, + "options": { + "mode":0, + "speed":0, + "intensity":0 + } + }, + { + "startAddress":508, + "type":"Par56Spot", + "deviceId":5, + "deviceName":"Par56 Lampe 5", + "picture":null, + "options": { + "red":0, + "green":0, + "blue":0 + } + }, + { + "type":"Lampel", + "deviceId":6, + "deviceName":"Lampel", + "picture":null, + "options": { + "red":0, + "green":0, + "blue":0 + } + }, +] \ No newline at end of file