summaryrefslogtreecommitdiffstats
path: root/modules-available/locationinfo/templates/frontend-default.html
diff options
context:
space:
mode:
Diffstat (limited to 'modules-available/locationinfo/templates/frontend-default.html')
-rwxr-xr-xmodules-available/locationinfo/templates/frontend-default.html195
1 files changed, 102 insertions, 93 deletions
diff --git a/modules-available/locationinfo/templates/frontend-default.html b/modules-available/locationinfo/templates/frontend-default.html
index 2388af42..cc62075e 100755
--- a/modules-available/locationinfo/templates/frontend-default.html
+++ b/modules-available/locationinfo/templates/frontend-default.html
@@ -15,7 +15,7 @@ optional:
daystoshow:[1,2,3,4,5,6,7] sets how many days the calendar shows
scale:[10-90] scales the calendar and Roomplan in mode 1
switchtime:[1-120] sets the time between switchen in mode 4 (in seconds)
- calupdate: Time the calender querys for updates,in minutes.
+ calupdate: Time the calendar queries for updates,in minutes.
roomupdate: Time the PCs in the room gets updated,in seconds.
rotation:[0-3] rotation of the roomplan
vertical:[true] only mode 1, sets the calendar above the roomplan
@@ -26,8 +26,8 @@ optional:
<meta name="viewport" content="width=device-width, initial-scale=1.0" charset="utf-8">
<head>
<title>DoorSign</title>
- <link rel='stylesheet' type='text/css' href='{{dirprefix}}modules/js_jqueryui/style.css'/>
- <link rel='stylesheet' type='text/css' href='{{dirprefix}}modules/js_weekcalendar/style.css'/>
+ <link rel='stylesheet' type='text/css' href='modules/js_jqueryui/style.css'/>
+ <link rel='stylesheet' type='text/css' href='modules/js_weekcalendar/style.css'/>
<style type="text/css">
@@ -51,12 +51,21 @@ optional:
box-shadow: 0 0.1875rem 0.375rem rgba(0, 0, 0, 0.25);
margin-bottom: 4px;
width: 100%;
- display: flex;
- flex-wrap: nowrap;
- align-items: center;
- justify-content: space-between;
+ font-size: 25pt;
+ font-size: 1.8vw;
+ font-weight: bold;
}
+ .count-3 {
+ font-size: 16pt;
+ font-size: 1.2vw;
+ }
+
+ .count-1 {
+ font-size: 30pt;
+ font-size: 2.25vw;
+ }
+
.pull-left {
float: left;
}
@@ -66,15 +75,11 @@ optional:
}
.col {
- padding: 0 4px;
+ padding: 3px 5px 0;
color: white;
overflow: hidden;
- flex: 1 1 auto;
text-overflow: ellipsis;
- position: relative;
- display: flex;
- flex-direction: column;
- justify-content: center;
+ line-height: 106%;
}
.col-square {
@@ -90,6 +95,9 @@ optional:
text-align: center;
padding: 0;
overflow: visible;
+ display: flex;
+ justify-content: center;
+ align-items: center;
}
.count-1 .col-square {
@@ -119,30 +127,19 @@ optional:
z-index: 100;
}
- .header-font {
- font-size: 25pt;
- font-size: 1.8vw;
- font-weight: bold;
- padding: 10px;
- }
-
.nowrap {
white-space: nowrap;
overflow: hidden;
}
- .timer {
- color: #ddd;
+ .location-name {
+ font-size: 80%;
+ font-weight: normal;
}
- .count-3 .header-font {
- font-size: 16pt;
- font-size: 1.2vw;
- }
-
- .count-1 .header-font {
- font-size: 30pt;
- font-size: 2.25vw;
+ .timer {
+ color: #ddd;
+ font-size: 80%;
}
.seats-counter {
@@ -215,13 +212,28 @@ optional:
.screen-frame {
position: relative;
- background: black;
+ background: #000;
border-radius: 11%;
width: 100%;
height: 83%;
padding: 6%;
}
+ .screen-foot1 {
+ margin: 0 auto;
+ width: 10%;
+ height: 7%;
+ background: #000;
+ }
+
+ .screen-foot2 {
+ margin: 0 auto;
+ width: 80%;
+ height: 7%;
+ background: #000;
+ border-radius: 30% 30% 0 0;
+ }
+
.screen-inner {
width: 100%;
height: 100%;
@@ -233,6 +245,17 @@ optional:
color: #fff;
}
+ .pcname {
+ display: block;
+ text-wrap: avoid;
+ white-space: nowrap;
+ position: relative;
+ overflow: visible;
+ height: 0;
+ font-size: 10pt;
+ text-shadow: #000 1px 1px;
+ }
+
.BROKEN .screen-inner {
background: #000;
}
@@ -243,31 +266,25 @@ optional:
.IDLE .screen-inner,
.STANDBY .screen-inner {
- background: #250;
+ background: linear-gradient(to bottom, #0d0, #0c0 10%, #250 13%, #050 100%);
}
.OCCUPIED .screen-inner {
background: #d23;
}
+ .OCCUPIED.rm-remoteaccess .screen-inner {
+ background: linear-gradient(to bottom, #d23, #f90 80%);
+ }
+
.OCCUPIED .screen-inner:after {
content: '\01F464';
font-weight: bold;
}
- .screen-foot1 {
- margin: 0 auto;
- width: 10%;
- height: 7%;
- background: black;
- }
-
- .screen-foot2 {
- margin: 0 auto;
- width: 80%;
- height: 7%;
- background: black;
- border-radius: 30% 30% 0 0;
+ .STANDBY .screen-inner:after {
+ content: '\01F319';
+ font-weight: bold;
}
.pc-overlay-container {
@@ -279,15 +296,6 @@ optional:
display: table;
}
- .pc-img {
- position: absolute;
- left: 0;
- top: 0;
- width: 100%;
- height: 100%;
-
- }
-
.overlay {
display: inline-block;
position: relative;
@@ -353,10 +361,10 @@ optional:
</style>
- <script type='text/javascript' src='{{dirprefix}}script/jquery.js'></script>
- <script type='text/javascript' src='{{dirprefix}}modules/js_jqueryui/clientscript.js'></script>
- <script type='text/javascript' src="{{dirprefix}}modules/js_weekcalendar/clientscript.js"></script>
- <script type='text/javascript' src='{{dirprefix}}modules/locationinfo/frontend/frontendscript.js'></script>
+ <script type='text/javascript' src='script/jquery.js'></script>
+ <script type='text/javascript' src='modules/js_jqueryui/clientscript.js'></script>
+ <script type='text/javascript' src="modules/js_weekcalendar/clientscript.js"></script>
+ <script type='text/javascript' src='modules/locationinfo/frontend/frontendscript.js'></script>
</head>
<body>
@@ -556,6 +564,8 @@ optional:
putInRange(config, 'rotation', 0, 3, 0);
}
+ var updateTimer = null;
+
/**
* generates the Room divs and calls the needed functions depending on the rooms mode
*/
@@ -593,16 +603,16 @@ optional:
$("body").append($loc);
room.$.container = $loc;
- room.$.locationName = $('<div>').addClass('col').addClass('header-font').addClass('pull-left');
+ room.$.locationName = $('<div>').addClass('col location-name nowrap');
room.$.currentEvent = $("<span>").addClass('nowrap');
- room.$.currentRemain = $("<span>").addClass('nowrap').addClass('timer');
+ room.$.currentRemain = $("<span>").addClass('nowrap timer');
room.$.seatsCounter = $('<span>').addClass('seats-counter');
room.$.seatsBackground = $('<div>').addClass('col col-square').append(room.$.seatsCounter);
- var $header = $('<div>').addClass('row').addClass('count-' + columns);
- $header.append(room.$.locationName);
+ var $header = $('<div>').addClass('row count-' + columns);
$header.append(room.$.seatsBackground);
- $header.append($('<div>').addClass('col header-font center').append(room.$.currentEvent).append(' ').append(room.$.currentRemain));
+ $header.append(room.$.locationName);
+ $header.append($('<div>').addClass('col center').append(room.$.currentEvent).append(' ').append(room.$.currentRemain));
room.$.header = $header;
$loc.append($header);
$header.append('<div class="clearfix">');
@@ -643,7 +653,7 @@ optional:
}
mainUpdateLoop();
- setInterval(mainUpdateLoop, 10000);
+ updateTimer = setInterval(mainUpdateLoop, 10000);
setInterval(updateHeaders, globalConfig.eco ? 10000 : 1000);
}
@@ -671,7 +681,14 @@ optional:
var today = date.getDate();
if (lastDate !== false) {
if (lastDate !== today) {
- location.reload(true);
+ if (updateTimer !== null) {
+ clearInterval(updateTimer);
+ updateTimer = null;
+ }
+ // Delay by a minute, sometimes the calendar shows the previous day if we load too quickly.
+ setTimeout(function() {
+ location.reload(true);
+ }, 60000);
}
} else {
lastDate = today;
@@ -936,11 +953,11 @@ optional:
}
/**
- * querys the Calendar data
+ * queries the Calendar data
*/
function queryCalendars() {
if (!panelUuid) return;
- var url = "{{dirprefix}}api.php?do=locationinfo&get=calendar&uuid=" + panelUuid;
+ var url = "{{{api}}}get=calendar&uuid=" + panelUuid;
$.ajax({
url: url,
dataType: 'json',
@@ -1016,7 +1033,7 @@ optional:
room.state = null;
UpdateRoomHeader(room);
} catch (e) {
- console.log("Error: Couldnt add calendar data");
+ console.log("Error: Couldn't add calendar data");
console.log(e);
}
}
@@ -1088,22 +1105,10 @@ optional:
if (height < 30) {
height = 30;
}
- var fontHeight = Math.min(height, columnWidth / 2.1);
+
// Scale calendar font
- if (fontHeight > 120) {
- $cal.weekCalendar("option", "textSize", 28);
- }
- else if (fontHeight > 100) {
- $cal.weekCalendar("option", "textSize", 24);
- } else if (fontHeight > 80) {
- $cal.weekCalendar("option", "textSize", 22);
- } else if (fontHeight > 70) {
- $cal.weekCalendar("option", "textSize", 20);
- } else if (fontHeight > 60) {
- $cal.weekCalendar("option", "textSize", 14);
- } else {
- $cal.weekCalendar("option", "textSize", 13);
- }
+ $cal.weekCalendar("option", "textSize", (columnWidth+height)/50+10);
+
$cal.weekCalendar("option", "timeslotHeight", height);
if (room.timetable) {
$cal.weekCalendar("option", "data", {events: room.timetable});
@@ -1213,7 +1218,7 @@ optional:
var newText = false, newTime = false;
var seats = room.freePcs;
if (tmp.state === 'closed' || tmp.state === 'CalendarEvent' || tmp.state === 'Free') {
- newTime = GetTimeDiferenceAsString(tmp.end, MyDate(), globalConfig);
+ newTime = GetTimeDiferenceAsString(tmp.end, MyDate(), room.config);
}
if (tmp.state === "closed") {
if (!same) newText = t("closed");
@@ -1330,7 +1335,6 @@ optional:
/========================================== Room Layout =============================================
*/
-
const picSizeX = 3.8;
const picSizeY = 3;
@@ -1436,10 +1440,9 @@ optional:
function setUpRoom(room, layout) {
for (var i = 0; i < layout.length; i++) {
if (!isNaN(layout[i].y) && !isNaN(layout[i].x)) {
- //var $img = $('<img>').prop('id', "pc-img_" + room.id + "_" + layout[i].id).addClass('pc-img');
var $overlays = $('<div>').addClass('pc-overlay-container');
layout[i].$div = $('<div>').prop('id', "pc_" + room.id + "_" + layout[i].id).addClass('pc-container');
- layout[i].$div.append($('<div>').addClass('screen-frame').append($('<div>').addClass('screen-inner')));
+ layout[i].$div.append($('<div>').addClass('screen-frame').append($('<div>').addClass('screen-inner').append($('<div>').addClass('pcname').text(layout[i].host))));
layout[i].$div.append($('<div>').addClass('screen-foot1'));
layout[i].$div.append($('<div>').addClass('screen-foot2'));
//layout[i].$div.append($overlays).append($img);
@@ -1505,13 +1508,13 @@ optional:
*/
function queryPanelChange() {
$.ajax({
- url: "{{dirprefix}}api.php?do=locationinfo&get=timestamp&uuid=" + panelUuid,
+ url: "{{{api}}}get=timestamp&uuid=" + panelUuid,
dataType: 'json',
cache: false,
timeout: 5000,
success: function (result) {
if (!result || !result.ts) {
- console.log('Warning: get=timestamp didnt return json with ts field');
+ console.log("Warning: get=timestamp didn't return json with ts field");
return;
}
if (globalConfig.ts && globalConfig.ts !== result.ts) {
@@ -1528,13 +1531,13 @@ optional:
*/
function queryRooms() {
$.ajax({
- url: "{{dirprefix}}api.php?do=locationinfo&get=machines&uuid=" + panelUuid,
+ url: "{{{api}}}get=machines&uuid=" + panelUuid,
dataType: 'json',
cache: false,
timeout: 30000,
success: function (result) {
if (!result || result.constructor !== Array) {
- console.log('Warning: get=machines didnt return array');
+ console.log("Warning: get=machines didn't return array");
return;
}
for (var i = 0; i < result.length; i++) {
@@ -1577,8 +1580,14 @@ optional:
freePcs++;
}
}
-
- $div.removeClass('BROKEN OFFLINE IDLE OCCUPIED STANDBY'.replace(update[i].pcState, '')).addClass(update[i].pcState);
+ if (!$div.hasClass(update[i].pcState)) {
+ $div.removeClass('BROKEN OFFLINE IDLE OCCUPIED STANDBY'.replace(update[i].pcState, '')).addClass(update[i].pcState);
+ }
+ if (!$div.hasClass('rm-' + update[i].runmode)) {
+ $div.removeClass(function (i, cn) {
+ return (cn.match(/\brm-\S*/g) || []).join(' ');
+ }).addClass('rm-' + update[i].runmode);
+ }
}
room.freePcs = freePcs;
room.numPcs = numPcs;
generated by cgit v1.2.3-55-g7522 (git 2.39.0) at 2024-05-04 13:30:21 +0200