From 7e6bb584c477cb56f3aa810035376257f84b9340 Mon Sep 17 00:00:00 2001 From: Robert Schumann Date: Tue, 2 Jan 2018 17:21:00 +0100 Subject: [PATCH] layout changes to webclient --- public_html/css/raumserver_app.css | 25 ++++++++++++++++++----- public_html/index.html | 9 +++++---- public_html/js/main.js | 32 +++++++++++++++++++++--------- 3 files changed, 48 insertions(+), 18 deletions(-) diff --git a/public_html/css/raumserver_app.css b/public_html/css/raumserver_app.css index cffb66f..c7388dd 100644 --- a/public_html/css/raumserver_app.css +++ b/public_html/css/raumserver_app.css @@ -10,19 +10,34 @@ and open the template in the editor. th.zone-room-list { padding: 2px; - border-spacing: 2px; + border-spacing: 0px; } + td.zone-room-list { padding-left: 2px; padding-right: 2px; text-align: center; } + td.zone-room-list-status { - padding-left: 2px; - padding-right: 2px; + padding-left: 4px; + padding-right: 4px; text-align: center; font-style: italic; } -tr.zone-room-list { - background: #D0D0D0; + +.zone-room-list-head { + background: #E2E2E2; +} + +table.zone-room-list { + border-radius:8px; + border:1px solid #CCCCCC; + background: #efefef; +} + +table.player-control { + border-radius:8px; + border:1px solid #CCCCCC; + background: #efefef; } \ No newline at end of file diff --git a/public_html/index.html b/public_html/index.html index ae6f9c1..029b133 100644 --- a/public_html/index.html +++ b/public_html/index.html @@ -1,10 +1,11 @@ - + Raumserver App + - + @@ -34,12 +35,12 @@

Controller

-
+

Quick Source

Rooms

- +
diff --git a/public_html/js/main.js b/public_html/js/main.js index 59438df..0a9311c 100644 --- a/public_html/js/main.js +++ b/public_html/js/main.js @@ -175,6 +175,23 @@ window.RoomView = Backbone.View.extend({ } }); +function tableHeadRow(className) { + head = document.createElement("thead"); + head.classname = className; + row = document.createElement("tr"); + row.className = className; + + row.appendChild(tableHead('zone-room-list', 'Name')); + row.appendChild(tableHead('zone-room-list', 'On')); + row.appendChild(tableHead('zone-room-list', 'Zone')); + row.appendChild(tableHead('zone-room-list', 'Mute')); + row.appendChild(tableHead('zone-room-list', 'Status')); + + head.appendChild(row); + + return head; +} + function tableHead(className, title) { th = document.createElement("th"); th.className = className; @@ -182,7 +199,7 @@ function tableHead(className, title) { return th; } -function tableEntry(name, id, online, roomZoneId, isMute, transportState, currentZoneId, event) { +function tableEntry(name, id, online, roomZoneId, isMute, transportState = "n/a", currentZoneId, event) { online_icon = online ? "fa-check-circle-o" : "fa-circle-o"; toggle_zone_icon = (roomZoneId === currentZoneId) ? "fa-toggle-on" : "fa-toggle-off"; @@ -270,7 +287,7 @@ function playerButton(awesomeIcon, raumfeldAction, raumfeldValues = {}) { var button = document.createElement("td"); button.className = "ui-btn-text"; var button_style = document.createElement("button"); - button_style.setAttribute("style", "font-size:110%"); + button_style.setAttribute("style", "font-size:108%"); var button_icon = document.createElement("i"); button_icon.className = "fa " + awesomeIcon; button_icon.setAttribute("onclick","javascript:queryRaumserver('/controller/"+raumfeldAction+"',"+ JSON.stringify(raumfeldValues) +")"); @@ -458,12 +475,9 @@ var AppRouter = Backbone.Router.extend({ // XXX: need smarter update function here... roomList.innerHTML = ""; - roomList.appendChild(tableHead('zone-room-list', 'Name')); - roomList.appendChild(tableHead('zone-room-list', 'On')); - roomList.appendChild(tableHead('zone-room-list', 'Zone')); - roomList.appendChild(tableHead('zone-room-list', 'Mute')); - roomList.appendChild(tableHead('zone-room-list', 'Status')); - + roomList.appendChild(tableHeadRow('zone-room-list-head')); + tbody = document.createElement("tbody"); + roomList.appendChild(tbody); raumfeldRooms.forEach(function(room){ var found = false; currentRooms.forEach(function(listedRoom) { @@ -483,7 +497,7 @@ var AppRouter = Backbone.Router.extend({ zoneId, "javascript:queryRaumserver('/controller/toggleMute'," + JSON.stringify(params) + ")" ); - roomList.appendChild(entry); + tbody.appendChild(entry); //} });