diff options
author | Simon Rettberg | 2017-04-18 14:32:57 +0200 |
---|---|---|
committer | Simon Rettberg | 2017-04-18 14:32:57 +0200 |
commit | c2e03de614cda0317628310b6b072c65fa7a7cf9 (patch) | |
tree | 3a53e6618c29e9595478cbe7babfaef8c34b1f9f /modules-available | |
parent | [locationinfo] Davinci: Fix requested timespan, use single quotes for regex w... (diff) | |
download | slx-admin-c2e03de614cda0317628310b6b072c65fa7a7cf9.tar.gz slx-admin-c2e03de614cda0317628310b6b072c65fa7a7cf9.tar.xz slx-admin-c2e03de614cda0317628310b6b072c65fa7a7cf9.zip |
[locationinfo] frontend: fix indentation, convert to LF only
Diffstat (limited to 'modules-available')
-rwxr-xr-x | modules-available/locationinfo/frontend/doorsign.html | 3622 | ||||
-rw-r--r-- | modules-available/locationinfo/frontend/panel.html | 816 |
2 files changed, 2222 insertions, 2216 deletions
diff --git a/modules-available/locationinfo/frontend/doorsign.html b/modules-available/locationinfo/frontend/doorsign.html index 6919d2aa..7017fe0b 100755 --- a/modules-available/locationinfo/frontend/doorsign.html +++ b/modules-available/locationinfo/frontend/doorsign.html @@ -1,1811 +1,1811 @@ -<!--
-
-parameter
-
-required:
- id: [integer] room id, see in admin panel
-optional:
-
- lang:[en,de] set the language
- mode:[1,2,3,4] sets the displaying
- 1: Calendar & Room
- 2: only Calendar
- 3: only Room
- 4: Calendar & Room alternately
- 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.
- 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
- configupdate: Time interval the config gets updated (in minutes)
- scaledaysauto: [true] if true it finds automaticly the daystoshow parameter depending on display size
-
--->
-<!DOCTYPE html>
-<html lang="de">
-<meta name="viewport" content="width=device-width, initial-scale=1.0" charset="utf-8">
-<head>
- <title>DoorSign</title>
- <script type='text/javascript' src='../../../script/jquery.js'></script>
- <script type='text/javascript' src='../../js_jqueryui/clientscript.js'></script>
- <link rel='stylesheet' type='text/css' href='../../js_jqueryui/style.css'/>
- <link rel='stylesheet' type='text/css' href='jquery-week-calendar/jquery.weekcalendar.css'/>
-
- <script type='text/javascript' src="jquery-week-calendar/jquery.weekcalendar.js"></script>
- <style type='text/css'>
-
- body {
- font-family: "Lucida Grande", Helvetica, Arial, Verdana, sans-serif;
- margin: 0;
- width: 100%;
- height: 100%;
- float: left;
- box-sizing: border-box;
-
- background-color: #cacaca;
- overflow: hidden;
- position: absolute;
- display: table;
-
- }
-
- .row {
- background-color: #404040;
- box-shadow: 0 0.1875rem 0.375rem rgba(0, 0, 0, 0.25);
- margin-bottom: 4px;
-
- width: 100%;
-
- }
-
- .header {
- display: table;
- color: white;
- padding: 0;
- height: 8vw;
-
- }
-
- .progressbar {
- width: 0px;
- height: 2px;
- position: absolute;
- background-color: red;
- bottom: 2px;
- z-index: 1;
- }
-
- .font {
- display: table-cell;
- vertical-align: middle;
- font-size: 3vw;
- font-weight: bold
- }
-
- .courseText {
- text-align: center;
- }
-
- .row::after {
- content: "";
- clear: both;
- display: block;
- }
-
- [class*="col-"] {
- float: left;;
- padding: 0;
- box-sizing: border-box;
- }
-
- .col-1 {
- width: 33%;
- }
-
- .col-2 {
- width: 33%;
- }
-
- .roomLayoutDesign {
- position: relative;
- float: left;
- boxSizing: border-box;
- }
-
- .roompadding {
- float: left;
- position: relative;
- }
-
- .room {
- position: relative;
- background-color: white;
- width: 100%;
- height: 100%;
- overflow: hidden;
- border-width: 1px;
- border-color: darkgrey;
- border-style: solid;
-
- }
-
- .calendar {
- float: left;
- padding: 0;
- dboxSizing: border-box;
- background: linear-gradient(#cccccc, white);
-
- }
-
- .free-busy-busy {
- background: grey;
- }
-
- .ui-widget-content {
- color: white;
- }
-
- .wc-header {
- background-color: #404040;
- font-weight: bold;
- }
-
- .ui-state-default {
- text-shadow: none;
- }
-
- .square {
- display: table;
- float: right;
- padding: 0;
- width: 8vw;
- height: 8vw;
- }
-
- .FreeSeatsFont {
- display: table-cell;
- vertical-align: middle;
- font-size: 6vw;
- color: white;
- top: 0;
- margin: 0 auto;
- position: relative;
- text-align: center;
- font-weight: bold;
- overflow: visible;
- }
-
- .PCImgDiv {
- position: absolute;
- left: 0;
- bottom: 0;
- display: inline-block;
-
- }
-
- .OverlayDiv {
- position: absolute;
- left: 0;
- bottom: 0;
- width: 100%;
- height: 100%;
- display: table;
- }
-
- .pcImg {
- position: absolute;
- left: 0;
- top: 0;
- width: 100%;
- height: 100%;
-
- }
-
- .overlay {
- position: relative;
- width: 50%;
- height: 50%;
- opacity: 0.5;
- float: left;
- z-index: 5;
- }
-
- .overlay-rollstuhl {
- width: 25%;
- height: 50%;
- background-color: white;
- opacity: 0.5;
- float: left;
- }
-
- .wc-scrollable-grid {
-
- }
-
- .ui-widget-content .ui-state-active {
- font-weight: bold;
- color: black;
- }
-
- .wc-container {
- font-weight: bold;
- }
-
- .wc-today {
- background-color: white;
- }
-
- .wc-time-header-cell {
- background-color: #eeeeee;
- border: none;
- }
-
- .ui-corner-all {
- moz-border-radius-bottomright: 0;
- webkit-border-bottom-right-radius: 0;
- -khtml-border-bottom-right-radius: 0;
- border-bottom-right-radius: 0;
-
- moz-border-radius-topright: 0;
- webkit-border-top-right-radius: 0;
- -khtml-border-top-right-radius: 0;
- border-top-right-radius: 0;
-
- moz-border-radius-bottomleft: 0;
- webkit-border-bottom-left-radius: 0;
- -khtml-border-bottom-left-radius: 0;
- border-bottom-left-radius: 0;
-
- moz-border-radius-topleft: 0;
- webkit-border-left-right-radius: 0;
- -khtml-border-left-right-radius: 0;
- border-top-left-radius: 0;
- }
-
- .wc-scrollable-grid .wc-day-column-first {
- border-style: solid;
-
- }
-
- [class*="wc-day-"] {
- border-color: grey;
- }
-
-
- </style>
- <script type='text/javascript'>
-
- var rooms = {};
- var lastSwitchTime;
- var roomsToshow = 0;
- var roomIds;
- //Todo change these
- var date;
- var supportSvg = typeof SVGRect != "undefined";
- var calendarQueryUrl;
- var translation = {
- "en": {
- "room": "Room",
- "closed": "Closed",
- "free": "Free",
- "shortDays": ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
- "longDays": ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
- "to": "to"
-
- },
- "de": {
- "room": "Raum",
- "closed": "Geschlossen",
- "free": "Frei",
- "shortDays": ["Son", "Mon", "Die", "Mit", "Don", "Frei", "Sam"],
- "longDays": ["Sonntag", "Montag", "Dienstag", "Mittwoch", "Donnerstag", "Freitag", "Samstag"],
- "to": "bis"
- },
- "pt": {
- "room": "Quarto",
- "closed": "Fechado",
- "free": "Livre",
- "shortDays": ['Dom', 'Seg', 'Ter', 'Qua', 'Qui', 'Se', 'Sáb'],
- "longDays": ['Domingo', 'Segunda-feira', 'Terça-feira', 'Quarta-feira', 'Quinta-feira',
- 'Sexta-feira', 'Sábado'],
- "to": "para"
-
- }
- };
-
-
- $(document).ready(function () {
- if (!getId()) {
-
- }
- });
-
-
- /**
- * Downloads the config of a room, also reloads the page if the config hase changed over time
- * @param id ID of the room
- * @param room Room Object, only needed if it already exists
- */
-
- function getConfig(id, room) {
- $.ajax({
- url: "../../../api.php?do=locationinfo&action=config&id=" + id,
- dataType: 'json',
- cache: false,
- timeout: 30000,
- success: function (result) {
-
- if (room == null) {
-
- if (result.room == null) {
-
- for (var i = roomIds.length - 1; i >= 0; i--) {
- if (roomIds[i] === id) {
- roomIds.splice(i, 1);
- }
- }
- if (roomsToshow == roomIds.length) {
-
- initRooms();
-
- }
- return;
- }
-
- var time = new Date(result.time);
- if (isNaN(time.getTime())) {
- time = new Date();
- }
- SetUpDate(time);
- delete result.time;
-
- room = addRoom(id, result.room, result);
- roomsToshow++;
- if (roomsToshow == roomIds.length) {
-
- initRooms();
-
- }
-
-
- } else {
-
- delete result.time;
- if (JSON.stringify(rooms[id].config) != JSON.stringify(result)) {
- // reload Page if someone changed config
- location.reload(true);
- }
- }
- // check for config changes from time to time
- setTimeout(function () {
- getConfig(id, room);
- }, room.config.configupdate);
-
-
- }, error: function () {
- //Todo Error handling:
- }
- })
- }
-
-
- /**
- * gets the Parameter IDs from the Urls
- */
- function getId() {
- roomIds = getUrlParameter("id");
- if (roomIds == null) {
-
- var text = "<h1>Error: No Room Id's given in parameter </h1>";
- $("body").append(text);
-
- return false;
- }
-
- roomIds = roomIds.split(',');
- if (roomIds.length > 4) {
- roomIds.length = 4;
- }
-
- for (var i = 0; i < roomIds.length; i++) {
- getConfig(roomIds[i], null);
-
- }
-
- }
-
-
- /**
- * gets Additional Parameters from the URL, and from the
- * downloaded json.
- * also makes sure parameters are in a given range
- * @param room Room Object
- */
-
- function getParamerter(room) {
-
-
- if (room.config != null) {
- room.config.switchtime = room.config.switchtime * 1000;
- room.config.calupdate = room.config.calupdate * 60 * 1000;
- room.config.roomupdate = room.config.roomupdate * 1000;
- room.config.configupdate = room.config.configupdate * 60 * 1000;
- }
-
- if (getUrlParameter("mode") != null) {
- room.config.mode = parseInt(getUrlParameter("mode"));
- }
- if (getUrlParameter("calupdate") != null) {
- room.config.calupdate = (parseInt(getUrlParameter("calupdate")) * 60 * 1000);
- }
- if (getUrlParameter("roomupdate") != null) {
- room.config.roomupdate = (parseInt(getUrlParameter("roomupdate")) * 1000);
- }
- if (getUrlParameter("daystoshow") != null) {
- room.config.daystoshow = parseInt(getUrlParameter("daystoshow"));
- }
- if (getUrlParameter("scaledaysauto") == "true") {
- room.config.scaledaysauto = true;
- } else if (getUrlParameter("scaledaysauto") == "false") {
- room.config.scaledaysauto = false;
- }
- if (getUrlParameter("vertical") == "true") {
- room.config.vertical = true;
- } else if (getUrlParameter("vertical") == "false") {
- room.config.vertical = false;
- }
- if (getUrlParameter("einkmode") == "true") {
- room.config.einkmode = true;
- } else if (getUrlParameter("einkmode") == "false") {
- room.config.einkmode = false;
- }
-
- if (getUrlParameter("scale") != null) {
- room.config.scale = parseInt(getUrlParameter("scale"));
- }
- if (getUrlParameter("rotation") != null) {
- room.config.rotation = parseInt(getUrlParameter("rotation"));
- }
- if (getUrlParameter("switchtime") != null) {
- room.config.switchtime = (parseInt(getUrlParameter("switchtime")) * 1000);
- }
- if (getUrlParameter("configupdate") != null) {
- room.config.configupdate = (parseInt(getUrlParameter("configupdate")) * 60 * 1000);
- }
-
- // parameter validation
- if (room.config.switchtime == null || isNaN(room.config.switchtime) || room.config.switchtime > 120*1000
- || room.config.switchtime < 1*1000) {
- room.config.switchtime = 5*1000;
- }
- if (room.config.scale == null || isNaN(room.config.scale) || room.config.scale > 90 || room.config.scale < 10) {
- room.config.scale = 50;
- }
- if (room.config.vertical == null) {
- room.config.vertical = false;
- }
- if (room.config.daystoshow == null || isNaN(room.config.daystoshow) || room.config.daystoshow > 7
- || room.config.daystoshow < 1) {
- room.config.daystoshow = 7;
- }
-
- if (room.config.roomupdate == null || isNaN(room.config.roomupdate) || room.config.roomupdate < 1000) {
- room.config.roomupdate = 20 * 1000;
- }
- if (room.config.configupdate == null || isNaN(room.config.configupdate) || (room.config.configupdate < 1)) {
- room.config.configupdate = 30 * 60 * 1000;
- }
-
- if (room.config.calupdate == null || isNaN(room.config.calupdate) || room.config.calupdate < 60 * 1000) {
- room.config.calupdate = 30 * 60 * 1000;
- }
- if (room.config.mode == null || isNaN(room.config.mode) || room.config.mode > 4 || room.config.mode < 1) {
- room.config.mode = 1;
- }
- if (room.config.rotation == null || isNaN(room.config.rotation) || room.config.rotation < 0
- || room.config.rotation > 4) {
- room.config.rotation = 0;
- }
-
- if (getUrlParameter("lang") != null && getUrlParameter("lang") in translation) {
- room.config.language = getUrlParameter("lang");
- }
- $('html').attr('lang', room.config.language);
- }
-
- /**
- * generates the Room divs and calls the needed functions depending on the rooms mode
- */
- function initRooms() {
-
- var width = "100%";
- var height = "100%";
- if (roomsToshow == 2 || roomsToshow == 4) {
- width = "50%";
- }
- if (roomsToshow == 3) {
- width = "33%";
- }
- if (roomsToshow == 4) {
- height = "50%";
- }
- var i = 0;
- for (var t = 0; t < roomIds.length; t++) {
- var property = roomIds[t];
- var text = "<div class='roompadding' id ='roompadding_" + rooms[property].id + "'></div>";
- $("body").append(text);
-
-
- var obj = document.getElementById("roompadding_" + rooms[property].id);
- obj.style.height = height;
- obj.style.width = width;
- text = "<div class='room' id ='room_" + rooms[property].id + "'></div>";
-
- $("#roompadding_" + rooms[property].id).append(text);
-
-
- text = "<div id='header_" + rooms[property].id + "' class='row'>" +
- "<div class='header col-2'>" +
- "<div class='font' id='roomHeader_" + rooms[property].id + "'></div>" +
- "</div>" +
- "<div class='col-1 courseText header'>" +
- "<div class='font' id='courseHeading_" + rooms[property].id + "'></div>" +
- "</div>" +
- "<div class='square .col-2' id='square_" + rooms[property].id + "'>" +
- "<div class='FreeSeatsFont' id='freeSeatsHeader_" + rooms[property].id + "'></div>" +
- "</div>" +
- "</div>";
- $("#room_" + rooms[property].id).append(text);
-
- if (rooms[property].name != null) {
- $("#roomHeader_" + rooms[property].id).text(rooms[property].name);
- }
-
- if (roomsToshow == 2) {
- document.getElementById("square_" + rooms[property].id).style.width = "6vw";
- document.getElementById("square_" + rooms[property].id).style.height = "6vw";
- document.getElementById("roomHeader_" + rooms[property].id).style.fontSize = "1.8vw";
- document.getElementById("freeSeatsHeader_" + rooms[property].id).style.fontSize = "4.5vw";
- document.getElementById("courseHeading_" + rooms[property].id).style.fontSize = "1.8vw";
- var headers = document.getElementsByClassName('header');
- for (var j = 0; j < headers.length; j++) {
- headers[j].style.height = "6vw";
- }
- }
- if (roomsToshow == 3) {
- document.getElementById("square_" + rooms[property].id).style.width = "4vw";
- document.getElementById("square_" + rooms[property].id).style.height = "4vw";
- document.getElementById("roomHeader_" + rooms[property].id).style.fontSize = "1.2vw";
- document.getElementById("freeSeatsHeader_" + rooms[property].id).style.fontSize = "2.5vw";
- document.getElementById("courseHeading_" + rooms[property].id).style.fontSize = "1.2vw";
- var headers = document.getElementsByClassName('header');
- for (var j = 0; j < headers.length; j++) {
- headers[j].style.height = "4vw";
- }
-
- }
- if (roomsToshow == 4) {
- document.getElementById("square_" + rooms[property].id).style.width = "4vw";
- document.getElementById("square_" + rooms[property].id).style.height = "4vw";
- document.getElementById("roomHeader_" + rooms[property].id).style.fontSize = "1.5vw";
- document.getElementById("freeSeatsHeader_" + rooms[property].id).style.fontSize = "2.5vw";
- document.getElementById("courseHeading_" + rooms[property].id).style.fontSize = "1.5vw";
-
- var headers = document.getElementsByClassName('header');
- for (var j = 0; j < headers.length; j++) {
- headers[j].style.height = "4vw";
- }
- }
-
-
- if (rooms[property].config.mode == 1) {
- setUpCalendar(rooms[property].config.scale + "%", rooms[property].config.daystoshow, rooms[property]);
- preInitRoom(rooms[property]);
-
- } else if (rooms[property].config.mode == 2) {
- setUpCalendar("100%", rooms[property].config.daystoshow, rooms[property]);
-
- } else if (rooms[property].config.mode == 3) {
- preInitRoom(rooms[property]);
- getOpeningTimes(rooms[property]);
- } else if (rooms[property].config.mode == 4) {
-
- setUpCalendar("100%", rooms[property].config.daystoshow, rooms[property]);
- preInitRoom(rooms[property]);
- generateProgressBar(rooms[property].id);
- }
-
- i++;
- }
-
- setInterval(mainUpdateLoop, 1000);
- }
-
- /**
- * Helper function to generate id string used in query functions
- * @param list A string, wicht contains ids or not(for now)
- * @param id An ID which should be added to the list
- */
- function addIdToUpdateList(list, id) {
- if (list == "") {
- list += id;
- } else {
- list += ("," + id);
- }
- return list;
- }
-
-
- var timeSteps = 10;
- /**
- * Main Update loop, this loop runs every 1 seconds and calls all
- * function which should be called periodically
- */
- function mainUpdateLoop() {
-
- // check ervery 10 sec if rooms need new calendar data or room data
- // groups request
-
- if (timeSteps > 9) {
- timeSteps = 0;
-
- var calendarUpdateIds = "";
- var rommUpdateIds = "";
- for (var property in rooms) {
- if (rooms[property].config.lastCalendarUpdate == null || rooms[property].config.lastCalendarUpdate + rooms[property].config.calupdate < MyDate().getTime()) {
-
- calendarUpdateIds = addIdToUpdateList(calendarUpdateIds, rooms[property].id);
- rooms[property].config.lastCalendarUpdate = MyDate().getTime();
- }
- if (rooms[property].config.lastRoomUpdate == null || rooms[property].config.lastRoomUpdate + rooms[property].config.roomupdate < MyDate().getTime()) {
- rommUpdateIds = addIdToUpdateList(rommUpdateIds, rooms[property].id);
- rooms[property].config.lastRoomUpdate = MyDate().getTime();
- }
- }
-
-
- if (calendarUpdateIds != "") {
- queryCalendars(calendarUpdateIds);
- }
- if (rommUpdateIds != "") {
- queryRooms(rommUpdateIds);
- }
- }
-
-
- // switches calendar and roomlayout in mode 4
-
- for (var property in rooms) {
- if (rooms[property].config.mode == 4) {
- if (rooms[property].lastSwitchTime == null
- || rooms[property].lastSwitchTime + rooms[property].config.switchtime < MyDate().getTime()) {
-
-
- switchLayout(rooms[property]);
- MoveProgressBar(rooms[property].id, rooms[property].config.switchtime);
-
- if (rooms[property].lastSwitchTime == null) {
- rooms[property].lastSwitchTime = MyDate().getTime();
- } else {
- rooms[property].lastSwitchTime = rooms[property].lastSwitchTime + rooms[property].config.switchtime;
- }
- }
-
- //
- }
- // Updateing All room Headers
-
- UpdateRoomHeader(rooms[property]);
- }
-
-
- // reload site at midnight
- var now = new MyDate();
- if (date != null) {
- if (date.getDate() != now.getDate()) {
- location.reload(true);
- }
- }
- date = now;
- timeSteps++;
-
- }
-
- /**
- * Generates a room Object and adds it to the rooms array
- * @param id ID of the room
- * @param name Name of the room
- * @param config Config Json of the room
- */
- function addRoom(id, name, config) {
- var room = {
- id: id,
- name: name,
- timetable: null,
- currentEvent: null,
- nextEventEnd: null,
- timeTilFree: null,
- state: null,
- openingTimes: null,
- config: config,
- currentfreePcs: 0,
- layout: null,
- freePcs: 0,
- resized: true,
- lastCalendarUpdate: null,
- lastRoomUpdate: null,
- getState: function () {
- if (this.state == null) {
- ComputeCurrentState(this);
- return this.state;
- }
- if (this.state.end != "") {
- if (this.state.end < new MyDate()) {
- ComputeCurrentState(this);
- }
- }
- return this.state;
- }
-
-
- };
- getParamerter(room);
- rooms[id] = room;
- return room;
-
- }
-
- /**
- * inilizes the Calendar for an room
- * @param percent Percentages of how mucht width the Calendar div should get (only used in mode 1)
- * @param daysToShow How many days the calendar should show
- * @param room Room Object
- */
- function setUpCalendar(percent, daysToShow, room) {
- generateCalendarDiv(percent, room);
- var $calendar = $("#calendar_" + room.id).weekCalendar({
- timeslotsPerHour: 1,
- timeslotHeight: 30,
- daysToShow: daysToShow,
- height: function ($calendar) {
- var height = $(window).height();
- if (roomsToshow == 4) {
- height = height / 2;
- }
-
- height = height - document.getElementById('header_' + room.id).clientHeight - 5;
- if (room.config.mode == 1 && room.config.vertical) {
- height = height * (room.config.scale / 100)
- }
- return height;
- },
- eventRender: function (calEvent, $event) {
- if (calEvent.end.getTime() < new MyDate().getTime()) {
- $event.css("backgroundColor", "#aaa");
- $event.find(".time").css({"backgroundColor": "#999", "border": "1px solid #888"});
- } else if (calEvent.end.getTime() > new MyDate().getTime() && calEvent.start.getTime() < new MyDate().getTime()) {
- $event.css("backgroundColor", "#25B002");
- $event.find(".time").css({"backgroundColor": "#25B002", "border": "1px solid #888"});
- }
- },
- date: MyDate(),
- dateFormat: "j.n",
- timeFormat: "G:i",
- scrollToHourMillis: 500,
- use24Hour: true,
- readonly: true,
- showHeader: false,
- hourLine: true,
- shortDays: t("shortDays", room.config.language),
- longDays: t("longDays", room.config.language),
- buttons: false,
- timeSeparator: " " + t("to", room.config.language) + " ",
- startOnFirstDayOfWeek: false,
- displayFreeBusys: true,
- defaultFreeBusy: {free: false}
- });
- getOpeningTimes(room);
-
-
- }
-
- /**
- * downloads openingTimes for an room
- * @param room Room Object
- */
- function getOpeningTimes(room) {
- $.getJSON("../../../api.php?do=locationinfo&action=openingtime&id=" + room.id, function (result) {
- if (Object.prototype.toString.call(result) === '[object Array]') {
- if (result.length > 0) {
- SetOpeningTimes(result[0].openingtime, room);
- }
- }
- scaleCalendar(room);
-
- })
- .error(function () {
- scaleCalendar(room);
-
- })
- }
-
-
- /**
- * Generates the Calendar Div, depending on it's width
- * @param width width of the Calendar Div
- * @param room Room Object
- */
-
- function generateCalendarDiv(width, room) {
- var div = document.createElement("div");
- div.id = "calendar_" + room.id;
- div.className = "calendar";
- if (room.config.vertical && room.config.mode == 1) {
- width = 100 + "%";
- div.float = "Top";
- }
- div.style.width = width;
- //document.body.appendChild(div);
- $("#room_" + room.id).append(div);
-
- }
-
- /**
- * sets the opening Time in the calendar plugin and saves it in the room object
- * @param parsedOpenings Dictonary of Opening times.
- * @param room Room Object
- */
-
- function SetOpeningTimes(parsedOpenings, room) {
- var opening = 24;
- var close = 0;
- room.openingTimesCalendar = [];
- room.openingTimes = [parsedOpenings['Sunday'], parsedOpenings['Monday'], parsedOpenings['Tuesday'],
- parsedOpenings['Wednesday'], parsedOpenings['Thursday'],
- parsedOpenings['Friday'], parsedOpenings['Saturday']];
- if (room.config.mode == 3) {
- return;
- }
- for (var i = 0; i < 7; i++) {
- var tmp = room.openingTimes[i];
- if (tmp != null) {
- for (var d = 0; d < tmp.length; d++) {
- var day = getNextDayOfWeek(new MyDate(), i);
- room.openingTimesCalendar.push({
- "start": new Date(day.getFullYear(), day.getMonth(), day.getDate(),
- tmp[d]['HourOpen'], tmp[d]['MinutesOpen']),
- "end": new Date(day.getFullYear(), day.getMonth(),
- day.getDate(), tmp[d]['HourClose'], tmp[d]['MinutesClose']),
- "free": true
- });
- if (parseInt(tmp[d]['HourOpen']) < opening) {
- opening = tmp[d]['HourOpen'];
- }
- if (parseInt(tmp[d]['HourClose']) > close) {
- close = tmp[d]['HourClose'];
- if (parseInt(tmp[d]['MinutesClose']) != 0) {
- close++;
- }
- }
- }
- }
- }
- if (parsedOpenings.length == 0) {
- opening = 0;
- close = 24;
- }
- room.openTimes = close - opening;
- $('#calendar_' + room.id).weekCalendar("option", "businessHours", {
- start: parseInt(opening),
- end: parseInt(close),
- limitDisplay: true
- });
- }
-
- /**
- * querys the Calendar data
- * @param ids ID'S of rooms to query as string, for e.g.: "5,17,8" or "5"
- */
- function queryCalendars(ids) {
- var url = "../../../api.php?do=locationinfo&action=calendar&id=" + ids;
-
- // Todo reimplement Frontend methode if needed
- /*
- if(!(room.config.calendarqueryurl === undefined)) {
- url = room.config.calendarqueryurl;
- }
- */
- $.ajax({
- url: url,
- dataType: 'json',
- cache: false,
- timeout: 30000,
- success: function (result) {
- var l = result.length;
- for (var i = 0; i < l; i++) {
- updateCalendar(result[i].calendar, rooms[result[i].id]);
- }
-
-
- }, error: function () {
-
- }
- });
- }
-
- /**
- * applays new calendar data to the calendar plugin and also saves it to the room object
- * @param json Calendar data JSON
- * @param room Room Object
- */
- function updateCalendar(json, room) {
-
- if (json == "") {
- console.log("Error: Calendar data was an empty string.");
- return;
- }
- try {
- room.timetable = json;
- if (room.config.mode != 3) {
- var cal = $('#calendar_' + room.id);
- cal.weekCalendar("option", "data", json);
- cal.weekCalendar("refresh");
- cal.weekCalendar("option", "defaultFreeBusy", {free: false});
- cal.weekCalendar("updateFreeBusy", room.openingTimesCalendar);
- }
- ComputeCurrentState(room);
- } catch (e) {
- console.log("Error: Couldnt add calendar data");
- console.log(e);
- }
- }
-
- /**
- * scales calendar, called once on create and on window resize
- * @param room Room Object
- */
- function scaleCalendar(room) {
- if (room.config.mode == 3) {
- return;
- }
- if (room.openTimes == null) {
- room.openTimes = 24;
- }
- var cal = $('#calendar_' + room.id);
- var columnWidth = document.getElementById("calendar_" + room.id).getElementsByClassName("wc-day-1")[0].clientWidth;
-
- if (room.config.scaledaysauto) {
- var result = (cal.weekCalendar("option", "daysToShow") * columnWidth) / 100;
- result = parseInt(Math.min(Math.max(Math.abs(result), 1), 7));
- if (result != parseInt(cal.weekCalendar("option", "daysToShow"))) {
-
- cal.weekCalendar("option", "daysToShow", Math.abs(result));
- }
- }
- if (((!room.config.scaledaysauto) || cal.weekCalendar("option", "daysToShow") == 1) && columnWidth < 85) {
- cal.weekCalendar("option", "useShortDayNames", true);
- } else {
- cal.weekCalendar("option", "useShortDayNames", false);
- }
- var clientHeight = $(window).height();
- if (roomsToshow == 4) {
- clientHeight = clientHeight / 2;
- }
-
- clientHeight = clientHeight - document.getElementById('header_' + room.id).clientHeight
- - document.getElementsByClassName("wc-time-column-header")[0].clientHeight - 2;
-
- if (room.config.mode == 1 && room.config.vertical) {
-
- clientHeight = clientHeight * (room.config.scale / 100);
- clientHeight -= 22;
- }
- clientHeight -= 6;
- var height = clientHeight / (room.openTimes * cal.weekCalendar("option", "timeslotsPerHour"));
-
-
- if (height < 30) {
- height = 30;
- }
- // Scale calendar font
- if(height > 120){
- cal.weekCalendar("option","textSize",28);
- }
- else if(height > 100){
- cal.weekCalendar("option","textSize",24);
- } else if(height > 80) {
- cal.weekCalendar("option","textSize",22);
- } else if(height > 70) {
- cal.weekCalendar("option","textSize",20);
- } else if (height > 60) {
- cal.weekCalendar("option","textSize",14);
- } else {
- cal.weekCalendar("option","textSize",13);
- }
- cal.weekCalendar("option", "timeslotHeight", height);
- if (room.openingTimesCalendar != null) {
- cal.weekCalendar("updateFreeBusy", room.openingTimesCalendar);
- }
- cal.weekCalendar("resizeCalendar");
- cal.weekCalendar("scrollToHour");
-
- }
-
- /**
- * used for countdown
- * computes the time difference between 2 Date objects
- * @param a Date Object
- * @param b Date Object
- * @param room Room Object
- * @returns time string
- */
- function GetTimeDiferenceAsString(a, b, room) {
- if (a == null || b == null) {
- return "";
- }
- var milliseconds = a.getTime() - b.getTime();
- var seconds = Math.floor((milliseconds / 1000) % 60);
- milliseconds -= seconds * 1000;
- var minutes = Math.floor((milliseconds / (1000 * 60)) % 60);
- milliseconds -= minutes * 1000 * 60;
- var hours = Math.floor((milliseconds / (1000 * 60 * 60)) % 24);
-
- var days = Math.floor((milliseconds / (1000 * 60 * 60 * 24)) % 31);
- if (seconds < 10) {
- seconds = "0" + seconds;
- }
- if (minutes < 10) {
- minutes = "0" + minutes;
- }
- if (days != 0) {
- // dont show?
- return "";
- }
- if (room.config.einkmode) {
- return hours + ":" + minutes;
- }
- return hours + ":" + minutes + ":" + seconds;
- }
-
- /**
- * returns next closing time of a given room
- * @param room
- * @returns Date Object of next closing
- */
- function GetNextClosing(room) {
- var now = new MyDate();
- var day = now.getDay();
- var offset = 0;
- var bestdate;
- for (var a = 0; a < 7; a++) {
- var tmp = room.openingTimes[day];
- if (tmp != null) {
- for (var i = 0; i < tmp.length; i++) {
- var closeDate = new MyDate();
- closeDate.setDate(now.getDate() + offset);
- closeDate.setHours(tmp[i].HourClose);
- closeDate.setMinutes(tmp[i].MinutesClose);
- closeDate.setSeconds(0);
- if (closeDate > now) {
- if (!IsOpen(new Date(closeDate.getTime() + 60000), room)) {
- if (bestdate == null || bestdate > closeDate) {
- bestdate = closeDate;
- }
- }
- }
- }
- }
- offset++;
- day++;
- if (day > 6) {
- day = 0;
- }
- }
- return bestdate;
- }
-
-
- /**
- * checks if a room is on a given date/time open
- * @param date Date Object
- * @param room Room object
- * @returns bool for open or not
- */
- function IsOpen(date, room) {
- if (room.openingTimes == null) {
- return false;
- }
- var tmp = room.openingTimes[date.getDay()];
- if (tmp == null) {
- return false;
- }
- for (var i = 0; i < tmp.length; i++) {
- var openDate = new MyDate();
- openDate.setHours(tmp[i].HourOpen);
- openDate.setMinutes(tmp[i].MinutesOpen);
- var closeDate = new MyDate();
- closeDate.setHours(tmp[i].HourClose);
- closeDate.setMinutes(tmp[i].MinutesClose);
- if (openDate < date && closeDate > date) {
- return true;
- }
- }
- return false;
- }
-
-
- /**
- * Retruns next Opening
- * @param room Room Object
- * @returns bestdate Date Object of next opening
- */
- function GetNextOpening(room) {
- var now = new MyDate();
- var day = now.getDay();
- var offset = 0;
- var bestdate;
- for (var a = 0; a < 7; a++) {
- if (room.openingTimes == null) {
- return null;
- }
- var tmp = room.openingTimes[day];
- if (tmp != null) {
- for (var i = 0; i < tmp.length; i++) {
- var openDate = new MyDate();
- openDate.setDate(now.getDate() + offset);
- openDate.setHours(tmp[i].HourOpen);
- openDate.setMinutes(tmp[i].MinutesOpen);
- if (openDate > now) {
- if (!IsOpen(new Date(openDate.getTime() - 60000), room)) {
- if (bestdate == null || bestdate > openDate) {
- bestdate = openDate;
- }
- }
- }
- }
- }
- offset++;
- day++;
- if (day > 6) {
- day = 0;
- }
- }
- return bestdate;
- }
-
-
- /**
- * Sets the free PCs number in the right corner and updates the sqare color acordingly
- * @param id Room id
- * @param seats Number of free PC's in the room
- */
- function SetFreeSeats(id, seats) {
- if (seats > 0) {
- $("#freeSeatsHeader_" + id).text(seats);
- $("#square_" + id).css('background-color', '#00dd10');
- } else if (seats == -1) {
- $("#freeSeatsHeader_" + id).text("");
- $("#square_" + id).css('background-color', 'red');
- } else {
- $("#freeSeatsHeader_" + id).text("0");
- $("#square_" + id).css('background-color', 'red');
- }
- }
-
- /**
- * Updates the Header of an Room
- * @param room Room Object
- */
- function UpdateRoomHeader(room) {
- var tmp = room.getState();
- if (tmp.state == "closed") {
- $("#courseHeading_" + room.id).text(t("closed", room.config.language) + " " + GetTimeDiferenceAsString(tmp.end, new MyDate(), room));
- SetFreeSeats(room.id, room.freePcs);
- } else if (tmp.state == "ClaendarEvent") {
- $("#courseHeading_" + room.id).text(tmp.title);
- SetFreeSeats(room.id, -1);
- } else if (tmp.state == "Free") {
- $("#courseHeading_" + room.id).text(t("free", room.config.language) + " " + GetTimeDiferenceAsString(tmp.end, new MyDate(), room));
- SetFreeSeats(room.id, room.freePcs);
- } else if (tmp.state == "FreeNoEnd") {
- $("#courseHeading_" + room.id).text(t("free", room.config.language));
- SetFreeSeats(room.id, room.freePcs);
- }
- }
-
- /**
- * computes state of a room, states are:
- * closed, FreeNoEnd, Free, ClaendarEvent.
- * @param Room Object
- */
- function ComputeCurrentState(room) {
- if (!IsOpen(new MyDate(), room)) {
- room.state = {state: "closed", end: GetNextOpening(room), title: "", next: ""};
-
- return;
- }
- var closing = GetNextClosing(room);
-
- var event = getNextEvent(room.timetable);
-
- // no event and no closing
- if (closing == null && event == null) {
- room.state = {state: "FreeNoEnd", end: "", title: "", next: ""};
- return;
- }
-
- // no event so closing is next
- if (event == null) {
- room.state = {state: "Free", end: closing, title: "", next: "closing"};
- return;
- }
-
- // event is at the moment
- if ((closing == null || event.start.getTime() < closing.getTime()) && event.start.getTime() < new MyDate()) {
- room.state = {state: "ClaendarEvent", end: event.end, title: event.title, next: ""};
- return;
- }
-
- // no closing so event is next
- if (closing == null) {
- room.state = {state: "Free", end: event.start, title: "", next: "event"};
- return;
- }
-
- // event sooner then closing
- if (event.start.getTime() < closing) {
- room.state = {state: "Free", end: event.start, title: "", next: "event"};
- } else if (event.start.getTime() > closing) {
- room.state = {state: "Free", end: closing, title: "", next: "closing"};
- }
-
- }
-
-
- /**
- * returns next event from a given json of events
- * @param json Json which contains the calendar data.
- * @returns event next Carlendar Event
- */
- function getNextEvent(json) {
- var event;
- var now = new MyDate();
- if (json == null) {
- return;
- }
- for (var i = 0; i < json.length; i++) {
- //event is now active
- if (json[i].start.getTime() < now.getTime() && json[i].end.getTime() > now.getTime()) {
- return json[i];
- }
- //first element to consider
- if (event == null) {
- if (json[i].start.getTime() > now.getTime()) {
- event = json[i];
- }
- }
- if (json[i].start.getTime() > now.getTime() && event.start.getTime() > json[i].start.getTime()) {
- event = json[i];
- }
- }
- return event;
- }
-
- function getNextDayOfWeek(date, dayOfWeek) {
- // Code to check that date and dayOfWeek are valid left as an exercise ;)
-
- var resultDate = new Date(date.getTime());
-
- resultDate.setDate(date.getDate() + (7 + dayOfWeek - date.getDay()) % 7);
-
- return resultDate;
- }
- /*
- /========================================== Room Layout =============================================
- */
-
-
- var picSizeX = 3.8;
- var picSizeY = 3;
-
- /**
- * Generates the RoomLayout Div
- * @param width The width the RoomLayout should have (in percent).
- * @param room Room Object
- */
- function generateRoomLayoutDiv(width, room) {
- var div = document.createElement("div");
- div.id = "roomLayout_" + room.id;
- div.className = "roomLayoutDesign";
- if ((room.config.vertical && room.config.mode == 1) || (room.config.mode == 3) || (room.config.mode == 4)) {
- width = 100 + "%";
- div.float = "Top";
- }
-
- div.style.width = width;
- if(room.config.mode == 4){
- div.style.display = "none";
- }
- //document.body.appendChild(div);
- $("#room_" + room.id).append(div);
-
-
- }
- /**
- * Donwloads Room Layout Json (which contains the pc information for a given room)
- * @param room Room Object
- */
- function preInitRoom(room) {
-
- $.getJSON("../../../api.php?do=locationinfo&action=roominfo&id=" + room.id + "&coords=1", function (result) {
- generateRoomLayoutDiv((100 - room.config.scale) + "%", room);
- if (result[0] == null) {
-
- return;
- }
- initRoom(result[0].computer, room);
-
- }).error(function () {
-
- generateRoomLayoutDiv((100 - room.config.scale) + "%", room);
- })
- }
-
-
- /**
- * Main funciton for generating the Room Layout
- * @param layout Layout Json
- * @param room Room Object
- */
- function initRoom(layout, room) {
- var maxX;
- var maxY;
- var minY;
- var minX;
- var xDifference;
- var yDifference;
- room.layout = layout;
- if (layout == null || layout.length == 0) {
- return;
- }
- if (room.config.rotation != 0) {
- rotateRoom(room.config.rotation, layout);
- }
-
-
- for (var i = 0; i < layout.length; i++) {
- if (!isNaN(parseInt(layout[i].x)) && !isNaN(parseInt(layout[i].y)) && layout[i].y != null && layout[i].y != null) {
- if (minX === undefined) {
- minX = parseInt(layout[i].x);
- }
- if (minY === undefined) {
- minY = parseInt(layout[i].y);
- }
- if (maxX === undefined) {
- maxX = parseInt(layout[i].x);
- }
- if (maxY === undefined) {
- maxY = parseInt(layout[i].y);
- }
- if (parseInt(layout[i].x) < parseInt(minX)) {
- minX = parseInt(layout[i].x);
- }
- if (parseInt(layout[i].y) < parseInt(minY)) {
- minY = parseInt(layout[i].y);
- }
- if (parseInt(layout[i].x) > parseInt(maxX)) {
- maxX = parseInt(layout[i].x);
- }
- if (parseInt(layout[i].y) > parseInt(maxY)) {
- maxY = parseInt(layout[i].y);
- }
- }
- }
-
- xDifference = maxX - minX;
- yDifference = maxY - minY;
-
- room.xDifference = xDifference;
- room.yDifference = yDifference;
- room.minX = minX;
- room.minY = minY;
- room.maxX = maxX;
- room.maxY = maxY;
-
- generateOffsetAndScale(room);
- setUpRoom(room, layout);
- scaleRoom(room);
- UpdatePc(layout, room);
-
- }
-
- /**
- * Computes offsets and scaling's for the RoomLayout
- * @param room Room Object
- */
- function generateOffsetAndScale(room) {
-
- var clientHeight = $(window).height();
- if (roomsToshow == 4) {
- clientHeight = clientHeight / 2;
- }
-
- clientHeight = clientHeight - document.getElementById('header_' + room.id).clientHeight - 5;
-
- if (roomsToshow > 1) {
- clientHeight -= 5;
- }
- if (room.config.vertical && room.config.mode == 1) {
- clientHeight = clientHeight * (1 - (room.config.scale / 100));
- }
- var roomLayout = document.getElementById('roomLayout_' + room.id);
-
- var clientWidth = roomLayout.clientWidth;
- //roomLayout.style.height = clientHeight + "px";
-
- var scaleX;
- if (room.xDifference != 0) {
- scaleX = clientWidth / room.xDifference;
- } else {
- scaleX = clientWidth;
- }
- var scaleY;
- if (room.yDifference != 0) {
- scaleY = clientHeight / room.yDifference;
- } else {
- scaleY = clientHeight;
- }
- var scaleYs = (clientHeight - (picSizeY * scaleY)) / room.yDifference;
- var scaleXs = (clientWidth - (picSizeX * scaleX)) / room.xDifference;
- if (scaleYs <= 0) {
- scaleYs = 9999;
- }
- if (scaleXs <= 0) {
- scaleXs = 9999;
- }
-
-
- var tmp = [scaleYs, scaleY, scaleXs, scaleX, (clientHeight * 0.9) / picSizeY, (clientWidth * 0.9) / picSizeX];
- room.scale = Math.min.apply(Math, tmp);
- room.xOffset = 0 - room.minX;
- room.yOffset = 0 - room.minY;
- room.xOffset += ((1 / 2 * (clientWidth - (((room.maxX + room.xOffset) * room.scale) + picSizeX * room.scale))) / room.scale);
- room.yOffset += ((1 / 2 * (clientHeight - (((room.maxY + room.yOffset) * room.scale) + picSizeY * room.scale))) / room.scale);
- }
-
-
- /**
- * adds images for each pc to Room Layout
- * @param room Room Object
- * @param layout Layout json
- */
- function setUpRoom(room, layout) {
- for (var i = 0; i < layout.length; i++) {
-
- if (layout[i].y != null && layout[i].x != null && !isNaN(layout[i].y) && !isNaN(layout[i].x)) {
- var text = "<div class= 'PCImgDiv' id ='layout_PC_div_" + room.id + "_" + layout[i].id + "'>" +
-
- "<div class= 'OverlayDiv' id ='layout_PC_overlay_" + room.id + "_" + layout[i].id + "'>" +
- "</div>" +
- "<img class= 'pcImg' id ='layout_PC_" + room.id + "_" + layout[i].id + "'> </img>" +
- "</div>";
-
- $('#roomLayout_' + room.id).append(text);
- if (layout[i].hasOwnProperty('overlay')) {
- for (var a = 0; a < layout[i].overlay.length; a++) {
- addOverlay($('#layout_PC_overlay_' + room.id + "_" + layout[i].id), layout[i].overlay[a]);
- }
- }
- }
- }
- }
-
- /**
- * Adds an overlay to an div(here the PC's shown in the RoomLayout).
- * @param object Object where the overlay should be added
- * @param overlayName name of the overlay (image name without ending)
- */
- function addOverlay(object, overlayName) {
- var a = [".svg", ".png", "jpg"];
- var imgname;
- for (var i = 0; i < a.length; a++) {
- if (imageExists("img/overlay/" + overlayName + a[i])) {
- imgname = "img/overlay/" + overlayName + a[i];
- break;
- }
-
- }
- if (imgname == null) {
- return;
- }
- var text = $("<img class='overlay' src='" + imgname + "'></img>");
- text.addClass("overlay-" + overlayName);
-
- object.append(text);
-
-
- }
-
-
- var imgExists = {};
-
- /**
- * checks if images exists on the webserver(chaches it also)
- * @param image_url Path to the image
- */
- function imageExists(image_url) {
- if (!imgExists.hasOwnProperty(image_url)) {
- var http = new XMLHttpRequest();
- http.open('HEAD', image_url, false);
- http.send();
- imgExists[image_url] = http.status != 404;
- }
- return imgExists[image_url];
-
- }
-
- /**
- * Querys Pc states
- * @param ids Room ID's which should be queried. Format for e.g.: "20,5,6"
- */
- function queryRooms(ids) {
- $.ajax({
- url: "../../../api.php?do=locationinfo&action=roominfo&id=" + ids + "&coords=0",
- dataType: 'json',
- cache: false,
- timeout: 30000,
- success: function (result) {
- var l = result.length;
- if (result[0] == null) {
- console.log("Error: Backend reported null back for RoomUpdate, this might happend if the room isn't" +
- "configurated.");
- return;
- }
- for (var i = 0; i < l; i++) {
-
- UpdatePc(result[i].computer, rooms[result[i].id]);
- }
- }, error: function () {
-
- }
- })
- }
-
-
- /**
- * Adjust pc coordinate depending on room rotation
- * @param r Rotation, from 0 - 3 (int)
- * @param layout Layout json
- */
- function rotateRoom(r, layout) {
- for (var z = 0; z < r; z++) {
- for (var i = 0; i < layout.length; i++) {
- var x = parseInt(layout[i].x);
- var y = parseInt(layout[i].y);
- layout[i].x = y;
- layout[i].y = -x;
- }
- }
- }
-
- /**
- * Positions the computer images in the roomLayout div accoring to ther potion and div size
- * @param room Room object
- */
- function scaleRoom(room) {
- if (room.layout == null) {
- return;
- }
- for (var i = 0; i < room.layout.length; i++) {
- if (room.layout[i].y != null && room.layout[i].x != null && !isNaN(room.layout[i].y) && !isNaN(room.layout[i].x)) {
- var tmp = document.getElementById("layout_PC_div_" + room.id + "_" + room.layout[i].id);
- var img = document.getElementById("layout_PC_" + room.id + "_" + room.layout[i].id);
- if (tmp != null) {
- tmp.style.width = (picSizeX * room.scale);
- tmp.setAttribute("style", "width:" + (picSizeX * room.scale) + "px");
- tmp.style.height = (picSizeY * room.scale) + "px";
- tmp.style.left = ((parseInt(room.layout[i].x) + room.xOffset) * room.scale) + "px";
- tmp.style.top = ((parseInt(room.layout[i].y) + room.yOffset) * room.scale ) + "px";
- }
- }
- }
- }
-
-
- /**
- * Updates the PC's (images) in the room layout. Also Updates how many pc's are free.
- * @param update Update Json from query for one(!) room
- * @param room Room object
- */
- function UpdatePc(update, room) {
- if (update === undefined || update == null) {
- return;
- }
- var freePcs = 0;
- for (var i = 0; i < update.length; i++) {
- var imgobj = document.getElementById("layout_PC_" + room.id + "_" + update[i].id);
-
-
- var img;
- // Pc free
- if (update[i].pcState == "IDLE") {
- if (supportSvg) {
- img = "img/pc_free";
- } else {
- imgobj.style.backgroundColor = "green";
- }
- freePcs++;
- // Pc in use
- } else if (update[i].pcState == "OCCUPIED") {
- if (supportSvg) {
- img = "img/pc_used";
- } else {
- imgobj.style.backgroundColor = "red";
- }
- // PC off
- } else if (update[i].pcState == "OFF") {
- if (supportSvg) {
- img = "img/pc_off";
- } else {
- imgobj.style.backgroundColor = "black";
- }
- freePcs++;
- } else {
- if (supportSvg) {
- img = "img/pc_defect";
- } else {
- imgobj.style.backgroundColor = "black";
- }
- }
-
- if (imgobj != null && supportSvg) {
- if (room.config.einkmode) {
- img = img + "_eink";
- }
- imgobj.src = img + ".svg";
- }
-
- }
-
- room.freePcs = freePcs;
-
-
- }
-
- /*
- /========================================== Misc =============================================
- */
- var resizeTimeout;
-
- // called when browser window changes size
- // scales calendar and room layout acordingly
-
- $(window).resize(function () {
- clearTimeout(resizeTimeout);
- resizeTimeout = setTimeout(function () {
-
- for (var property in rooms) {
-
- rooms[property].resized = true;
- if (rooms[property].config.mode != null) {
- if (rooms[property].config.mode != 3) {
- scaleCalendar(rooms[property]);
-
- }
- if (rooms[property].config.mode != 2) {
- generateOffsetAndScale(rooms[property]);
- scaleRoom(rooms[property]);
- }
- }
- }
- }, 50);
- });
-
-
- /**
- * returns parameter value from the url
- * @param sParam
- * @returns value for given parameter
- */
- var getUrlParameter = function getUrlParameter(sParam) {
- var sPageURL = decodeURIComponent(window.location.search.substring(1)),
- sURLVariables = sPageURL.split('&'),
- sParameterName,
- i;
-
- for (i = 0; i < sURLVariables.length; i++) {
- sParameterName = sURLVariables[i].split('=');
-
- if (sParameterName[0] === sParam) {
- return sParameterName[1] === undefined ? true : sParameterName[1];
- }
- }
- };
-
- /**
- * Function for translation
- * @param toTranslate key which we wan't to translate
- * @param lang languages in which should be translated
- * @returns r translated string
- */
- function t(toTranslate, lang) {
-
- var r;
- if (lang === undefined) {
- r = translation['en'][toTranslate];
- } else {
- r = translation[lang][toTranslate];
- }
- return r;
- }
-
-
- /**
- * Used in Mode 4, switches given room from Timetable to Roomlayout and vice versa
- * @param room
- */
- function switchLayout(room) {
- var car = document.getElementById("calendar_" + room.id);
- var roomLayout = document.getElementById("roomLayout_" + room.id);
-
- if (car.style.display == "none") {
- roomLayout.style.display = "none";
- car.style.display = "block";
- if (room.resized) {
- scaleCalendar(room);
- room.resized = false;
- }
- } else {
- car.style.display = "none";
- roomLayout.style.display = "block";
- if (room.resized) {
- generateOffsetAndScale(room);
- scaleRoom(room);
- room.resized = false;
- }
- }
- }
-
-
- /**
- * adds a progressbar to a given room (id) used in mode 4
- * @param id room id
- */
- function generateProgressBar(id) {
-
- var div = document.createElement("div");
- div.id = "progressBar_" + id;
- div.classList.add("progressbar");
- //document.body.appendChild(div);
- $("#room_" + id).append(div);
-
- }
- /**
- * Animates the progressbar used in mode 4
- * @param roomId
- * @param time
- * @constructor
- */
- function MoveProgressBar(roomId, time) {
- var elem = document.getElementById("progressBar_" + roomId);
- var width = 1;
- var id = setInterval(frame, time /100);
-
- function frame() {
- if (width >= 100) {
- clearInterval(id);
- } else {
- width++;
- elem.style.width = width + '%';
- }
- }
- }
-
-
- </script>
-</head>
-<body>
-</body>
-</html>
+<!-- + +parameter + +required: + id: [integer] room id, see in admin panel +optional: + + lang:[en,de] set the language + mode:[1,2,3,4] sets the displaying + 1: Calendar & Room + 2: only Calendar + 3: only Room + 4: Calendar & Room alternately + 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. + 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 + configupdate: Time interval the config gets updated (in minutes) + scaledaysauto: [true] if true it finds automaticly the daystoshow parameter depending on display size + +--> +<!DOCTYPE html> +<html lang="de"> +<meta name="viewport" content="width=device-width, initial-scale=1.0" charset="utf-8"> +<head> + <title>DoorSign</title> + <script type='text/javascript' src='../../../script/jquery.js'></script> + <script type='text/javascript' src='../../js_jqueryui/clientscript.js'></script> + <link rel='stylesheet' type='text/css' href='../../js_jqueryui/style.css'/> + <link rel='stylesheet' type='text/css' href='jquery-week-calendar/jquery.weekcalendar.css'/> + + <script type='text/javascript' src="jquery-week-calendar/jquery.weekcalendar.js"></script> + <style type='text/css'> + + body { + font-family: "Lucida Grande", Helvetica, Arial, Verdana, sans-serif; + margin: 0; + width: 100%; + height: 100%; + float: left; + box-sizing: border-box; + + background-color: #cacaca; + overflow: hidden; + position: absolute; + display: table; + + } + + .row { + background-color: #404040; + box-shadow: 0 0.1875rem 0.375rem rgba(0, 0, 0, 0.25); + margin-bottom: 4px; + + width: 100%; + + } + + .header { + display: table; + color: white; + padding: 0; + height: 8vw; + + } + + .progressbar { + width: 0px; + height: 2px; + position: absolute; + background-color: red; + bottom: 2px; + z-index: 1; + } + + .font { + display: table-cell; + vertical-align: middle; + font-size: 3vw; + font-weight: bold + } + + .courseText { + text-align: center; + } + + .row::after { + content: ""; + clear: both; + display: block; + } + + [class*="col-"] { + float: left;; + padding: 0; + box-sizing: border-box; + } + + .col-1 { + width: 33%; + } + + .col-2 { + width: 33%; + } + + .roomLayoutDesign { + position: relative; + float: left; + boxSizing: border-box; + } + + .roompadding { + float: left; + position: relative; + } + + .room { + position: relative; + background-color: white; + width: 100%; + height: 100%; + overflow: hidden; + border-width: 1px; + border-color: darkgrey; + border-style: solid; + + } + + .calendar { + float: left; + padding: 0; + dboxSizing: border-box; + background: linear-gradient(#cccccc, white); + + } + + .free-busy-busy { + background: grey; + } + + .ui-widget-content { + color: white; + } + + .wc-header { + background-color: #404040; + font-weight: bold; + } + + .ui-state-default { + text-shadow: none; + } + + .square { + display: table; + float: right; + padding: 0; + width: 8vw; + height: 8vw; + } + + .FreeSeatsFont { + display: table-cell; + vertical-align: middle; + font-size: 6vw; + color: white; + top: 0; + margin: 0 auto; + position: relative; + text-align: center; + font-weight: bold; + overflow: visible; + } + + .PCImgDiv { + position: absolute; + left: 0; + bottom: 0; + display: inline-block; + + } + + .OverlayDiv { + position: absolute; + left: 0; + bottom: 0; + width: 100%; + height: 100%; + display: table; + } + + .pcImg { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + + } + + .overlay { + position: relative; + width: 50%; + height: 50%; + opacity: 0.5; + float: left; + z-index: 5; + } + + .overlay-rollstuhl { + width: 25%; + height: 50%; + background-color: white; + opacity: 0.5; + float: left; + } + + .wc-scrollable-grid { + + } + + .ui-widget-content .ui-state-active { + font-weight: bold; + color: black; + } + + .wc-container { + font-weight: bold; + } + + .wc-today { + background-color: white; + } + + .wc-time-header-cell { + background-color: #eeeeee; + border: none; + } + + .ui-corner-all { + moz-border-radius-bottomright: 0; + webkit-border-bottom-right-radius: 0; + -khtml-border-bottom-right-radius: 0; + border-bottom-right-radius: 0; + + moz-border-radius-topright: 0; + webkit-border-top-right-radius: 0; + -khtml-border-top-right-radius: 0; + border-top-right-radius: 0; + + moz-border-radius-bottomleft: 0; + webkit-border-bottom-left-radius: 0; + -khtml-border-bottom-left-radius: 0; + border-bottom-left-radius: 0; + + moz-border-radius-topleft: 0; + webkit-border-left-right-radius: 0; + -khtml-border-left-right-radius: 0; + border-top-left-radius: 0; + } + + .wc-scrollable-grid .wc-day-column-first { + border-style: solid; + + } + + [class*="wc-day-"] { + border-color: grey; + } + + + </style> + <script type='text/javascript'> + + var rooms = {}; + var lastSwitchTime; + var roomsToshow = 0; + var roomIds; + //Todo change these + var date; + var supportSvg = typeof SVGRect != "undefined"; + var calendarQueryUrl; + var translation = { + "en": { + "room": "Room", + "closed": "Closed", + "free": "Free", + "shortDays": ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'], + "longDays": ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'], + "to": "to" + + }, + "de": { + "room": "Raum", + "closed": "Geschlossen", + "free": "Frei", + "shortDays": ["Son", "Mon", "Die", "Mit", "Don", "Frei", "Sam"], + "longDays": ["Sonntag", "Montag", "Dienstag", "Mittwoch", "Donnerstag", "Freitag", "Samstag"], + "to": "bis" + }, + "pt": { + "room": "Quarto", + "closed": "Fechado", + "free": "Livre", + "shortDays": ['Dom', 'Seg', 'Ter', 'Qua', 'Qui', 'Se', 'Sáb'], + "longDays": ['Domingo', 'Segunda-feira', 'Terça-feira', 'Quarta-feira', 'Quinta-feira', + 'Sexta-feira', 'Sábado'], + "to": "para" + + } + }; + + + $(document).ready(function () { + if (!getId()) { + + } + }); + + + /** + * Downloads the config of a room, also reloads the page if the config hase changed over time + * @param id ID of the room + * @param room Room Object, only needed if it already exists + */ + + function getConfig(id, room) { + $.ajax({ + url: "../../../api.php?do=locationinfo&action=config&id=" + id, + dataType: 'json', + cache: false, + timeout: 30000, + success: function (result) { + + if (room == null) { + + if (result.room == null) { + + for (var i = roomIds.length - 1; i >= 0; i--) { + if (roomIds[i] === id) { + roomIds.splice(i, 1); + } + } + if (roomsToshow == roomIds.length) { + + initRooms(); + + } + return; + } + + var time = new Date(result.time); + if (isNaN(time.getTime())) { + time = new Date(); + } + SetUpDate(time); + delete result.time; + + room = addRoom(id, result.room, result); + roomsToshow++; + if (roomsToshow == roomIds.length) { + + initRooms(); + + } + + + } else { + + delete result.time; + if (JSON.stringify(rooms[id].config) != JSON.stringify(result)) { + // reload Page if someone changed config + location.reload(true); + } + } + // check for config changes from time to time + setTimeout(function () { + getConfig(id, room); + }, room.config.configupdate); + + + }, error: function () { + //Todo Error handling: + } + }) + } + + + /** + * gets the Parameter IDs from the Urls + */ + function getId() { + roomIds = getUrlParameter("id"); + if (roomIds == null) { + + var text = "<h1>Error: No Room Id's given in parameter </h1>"; + $("body").append(text); + + return false; + } + + roomIds = roomIds.split(','); + if (roomIds.length > 4) { + roomIds.length = 4; + } + + for (var i = 0; i < roomIds.length; i++) { + getConfig(roomIds[i], null); + + } + + } + + + /** + * gets Additional Parameters from the URL, and from the + * downloaded json. + * also makes sure parameters are in a given range + * @param room Room Object + */ + + function getParamerter(room) { + + + if (room.config != null) { + room.config.switchtime = room.config.switchtime * 1000; + room.config.calupdate = room.config.calupdate * 60 * 1000; + room.config.roomupdate = room.config.roomupdate * 1000; + room.config.configupdate = room.config.configupdate * 60 * 1000; + } + + if (getUrlParameter("mode") != null) { + room.config.mode = parseInt(getUrlParameter("mode")); + } + if (getUrlParameter("calupdate") != null) { + room.config.calupdate = (parseInt(getUrlParameter("calupdate")) * 60 * 1000); + } + if (getUrlParameter("roomupdate") != null) { + room.config.roomupdate = (parseInt(getUrlParameter("roomupdate")) * 1000); + } + if (getUrlParameter("daystoshow") != null) { + room.config.daystoshow = parseInt(getUrlParameter("daystoshow")); + } + if (getUrlParameter("scaledaysauto") == "true") { + room.config.scaledaysauto = true; + } else if (getUrlParameter("scaledaysauto") == "false") { + room.config.scaledaysauto = false; + } + if (getUrlParameter("vertical") == "true") { + room.config.vertical = true; + } else if (getUrlParameter("vertical") == "false") { + room.config.vertical = false; + } + if (getUrlParameter("einkmode") == "true") { + room.config.einkmode = true; + } else if (getUrlParameter("einkmode") == "false") { + room.config.einkmode = false; + } + + if (getUrlParameter("scale") != null) { + room.config.scale = parseInt(getUrlParameter("scale")); + } + if (getUrlParameter("rotation") != null) { + room.config.rotation = parseInt(getUrlParameter("rotation")); + } + if (getUrlParameter("switchtime") != null) { + room.config.switchtime = (parseInt(getUrlParameter("switchtime")) * 1000); + } + if (getUrlParameter("configupdate") != null) { + room.config.configupdate = (parseInt(getUrlParameter("configupdate")) * 60 * 1000); + } + + // parameter validation + if (room.config.switchtime == null || isNaN(room.config.switchtime) || room.config.switchtime > 120 * 1000 + || room.config.switchtime < 1 * 1000) { + room.config.switchtime = 5 * 1000; + } + if (room.config.scale == null || isNaN(room.config.scale) || room.config.scale > 90 || room.config.scale < 10) { + room.config.scale = 50; + } + if (room.config.vertical == null) { + room.config.vertical = false; + } + if (room.config.daystoshow == null || isNaN(room.config.daystoshow) || room.config.daystoshow > 7 + || room.config.daystoshow < 1) { + room.config.daystoshow = 7; + } + + if (room.config.roomupdate == null || isNaN(room.config.roomupdate) || room.config.roomupdate < 1000) { + room.config.roomupdate = 20 * 1000; + } + if (room.config.configupdate == null || isNaN(room.config.configupdate) || (room.config.configupdate < 1)) { + room.config.configupdate = 30 * 60 * 1000; + } + + if (room.config.calupdate == null || isNaN(room.config.calupdate) || room.config.calupdate < 60 * 1000) { + room.config.calupdate = 30 * 60 * 1000; + } + if (room.config.mode == null || isNaN(room.config.mode) || room.config.mode > 4 || room.config.mode < 1) { + room.config.mode = 1; + } + if (room.config.rotation == null || isNaN(room.config.rotation) || room.config.rotation < 0 + || room.config.rotation > 4) { + room.config.rotation = 0; + } + + if (getUrlParameter("lang") != null && getUrlParameter("lang") in translation) { + room.config.language = getUrlParameter("lang"); + } + $('html').attr('lang', room.config.language); + } + + /** + * generates the Room divs and calls the needed functions depending on the rooms mode + */ + function initRooms() { + + var width = "100%"; + var height = "100%"; + if (roomsToshow == 2 || roomsToshow == 4) { + width = "50%"; + } + if (roomsToshow == 3) { + width = "33%"; + } + if (roomsToshow == 4) { + height = "50%"; + } + var i = 0; + for (var t = 0; t < roomIds.length; t++) { + var property = roomIds[t]; + var text = "<div class='roompadding' id ='roompadding_" + rooms[property].id + "'></div>"; + $("body").append(text); + + + var obj = document.getElementById("roompadding_" + rooms[property].id); + obj.style.height = height; + obj.style.width = width; + text = "<div class='room' id ='room_" + rooms[property].id + "'></div>"; + + $("#roompadding_" + rooms[property].id).append(text); + + + text = "<div id='header_" + rooms[property].id + "' class='row'>" + + "<div class='header col-2'>" + + "<div class='font' id='roomHeader_" + rooms[property].id + "'></div>" + + "</div>" + + "<div class='col-1 courseText header'>" + + "<div class='font' id='courseHeading_" + rooms[property].id + "'></div>" + + "</div>" + + "<div class='square .col-2' id='square_" + rooms[property].id + "'>" + + "<div class='FreeSeatsFont' id='freeSeatsHeader_" + rooms[property].id + "'></div>" + + "</div>" + + "</div>"; + $("#room_" + rooms[property].id).append(text); + + if (rooms[property].name != null) { + $("#roomHeader_" + rooms[property].id).text(rooms[property].name); + } + + if (roomsToshow == 2) { + document.getElementById("square_" + rooms[property].id).style.width = "6vw"; + document.getElementById("square_" + rooms[property].id).style.height = "6vw"; + document.getElementById("roomHeader_" + rooms[property].id).style.fontSize = "1.8vw"; + document.getElementById("freeSeatsHeader_" + rooms[property].id).style.fontSize = "4.5vw"; + document.getElementById("courseHeading_" + rooms[property].id).style.fontSize = "1.8vw"; + var headers = document.getElementsByClassName('header'); + for (var j = 0; j < headers.length; j++) { + headers[j].style.height = "6vw"; + } + } + if (roomsToshow == 3) { + document.getElementById("square_" + rooms[property].id).style.width = "4vw"; + document.getElementById("square_" + rooms[property].id).style.height = "4vw"; + document.getElementById("roomHeader_" + rooms[property].id).style.fontSize = "1.2vw"; + document.getElementById("freeSeatsHeader_" + rooms[property].id).style.fontSize = "2.5vw"; + document.getElementById("courseHeading_" + rooms[property].id).style.fontSize = "1.2vw"; + var headers = document.getElementsByClassName('header'); + for (var j = 0; j < headers.length; j++) { + headers[j].style.height = "4vw"; + } + + } + if (roomsToshow == 4) { + document.getElementById("square_" + rooms[property].id).style.width = "4vw"; + document.getElementById("square_" + rooms[property].id).style.height = "4vw"; + document.getElementById("roomHeader_" + rooms[property].id).style.fontSize = "1.5vw"; + document.getElementById("freeSeatsHeader_" + rooms[property].id).style.fontSize = "2.5vw"; + document.getElementById("courseHeading_" + rooms[property].id).style.fontSize = "1.5vw"; + + var headers = document.getElementsByClassName('header'); + for (var j = 0; j < headers.length; j++) { + headers[j].style.height = "4vw"; + } + } + + + if (rooms[property].config.mode == 1) { + setUpCalendar(rooms[property].config.scale + "%", rooms[property].config.daystoshow, rooms[property]); + preInitRoom(rooms[property]); + + } else if (rooms[property].config.mode == 2) { + setUpCalendar("100%", rooms[property].config.daystoshow, rooms[property]); + + } else if (rooms[property].config.mode == 3) { + preInitRoom(rooms[property]); + getOpeningTimes(rooms[property]); + } else if (rooms[property].config.mode == 4) { + + setUpCalendar("100%", rooms[property].config.daystoshow, rooms[property]); + preInitRoom(rooms[property]); + generateProgressBar(rooms[property].id); + } + + i++; + } + + setInterval(mainUpdateLoop, 1000); + } + + /** + * Helper function to generate id string used in query functions + * @param list A string, wicht contains ids or not(for now) + * @param id An ID which should be added to the list + */ + function addIdToUpdateList(list, id) { + if (list == "") { + list += id; + } else { + list += ("," + id); + } + return list; + } + + + var timeSteps = 10; + /** + * Main Update loop, this loop runs every 1 seconds and calls all + * function which should be called periodically + */ + function mainUpdateLoop() { + + // check ervery 10 sec if rooms need new calendar data or room data + // groups request + + if (timeSteps > 9) { + timeSteps = 0; + + var calendarUpdateIds = ""; + var rommUpdateIds = ""; + for (var property in rooms) { + if (rooms[property].config.lastCalendarUpdate == null || rooms[property].config.lastCalendarUpdate + rooms[property].config.calupdate < MyDate().getTime()) { + + calendarUpdateIds = addIdToUpdateList(calendarUpdateIds, rooms[property].id); + rooms[property].config.lastCalendarUpdate = MyDate().getTime(); + } + if (rooms[property].config.lastRoomUpdate == null || rooms[property].config.lastRoomUpdate + rooms[property].config.roomupdate < MyDate().getTime()) { + rommUpdateIds = addIdToUpdateList(rommUpdateIds, rooms[property].id); + rooms[property].config.lastRoomUpdate = MyDate().getTime(); + } + } + + + if (calendarUpdateIds != "") { + queryCalendars(calendarUpdateIds); + } + if (rommUpdateIds != "") { + queryRooms(rommUpdateIds); + } + } + + + // switches calendar and roomlayout in mode 4 + + for (var property in rooms) { + if (rooms[property].config.mode == 4) { + if (rooms[property].lastSwitchTime == null + || rooms[property].lastSwitchTime + rooms[property].config.switchtime < MyDate().getTime()) { + + + switchLayout(rooms[property]); + MoveProgressBar(rooms[property].id, rooms[property].config.switchtime); + + if (rooms[property].lastSwitchTime == null) { + rooms[property].lastSwitchTime = MyDate().getTime(); + } else { + rooms[property].lastSwitchTime = rooms[property].lastSwitchTime + rooms[property].config.switchtime; + } + } + + // + } + // Updateing All room Headers + + UpdateRoomHeader(rooms[property]); + } + + + // reload site at midnight + var now = new MyDate(); + if (date != null) { + if (date.getDate() != now.getDate()) { + location.reload(true); + } + } + date = now; + timeSteps++; + + } + + /** + * Generates a room Object and adds it to the rooms array + * @param id ID of the room + * @param name Name of the room + * @param config Config Json of the room + */ + function addRoom(id, name, config) { + var room = { + id: id, + name: name, + timetable: null, + currentEvent: null, + nextEventEnd: null, + timeTilFree: null, + state: null, + openingTimes: null, + config: config, + currentfreePcs: 0, + layout: null, + freePcs: 0, + resized: true, + lastCalendarUpdate: null, + lastRoomUpdate: null, + getState: function () { + if (this.state == null) { + ComputeCurrentState(this); + return this.state; + } + if (this.state.end != "") { + if (this.state.end < new MyDate()) { + ComputeCurrentState(this); + } + } + return this.state; + } + + + }; + getParamerter(room); + rooms[id] = room; + return room; + + } + + /** + * inilizes the Calendar for an room + * @param percent Percentages of how mucht width the Calendar div should get (only used in mode 1) + * @param daysToShow How many days the calendar should show + * @param room Room Object + */ + function setUpCalendar(percent, daysToShow, room) { + generateCalendarDiv(percent, room); + var $calendar = $("#calendar_" + room.id).weekCalendar({ + timeslotsPerHour: 1, + timeslotHeight: 30, + daysToShow: daysToShow, + height: function ($calendar) { + var height = $(window).height(); + if (roomsToshow == 4) { + height = height / 2; + } + + height = height - document.getElementById('header_' + room.id).clientHeight - 5; + if (room.config.mode == 1 && room.config.vertical) { + height = height * (room.config.scale / 100) + } + return height; + }, + eventRender: function (calEvent, $event) { + if (calEvent.end.getTime() < new MyDate().getTime()) { + $event.css("backgroundColor", "#aaa"); + $event.find(".time").css({"backgroundColor": "#999", "border": "1px solid #888"}); + } else if (calEvent.end.getTime() > new MyDate().getTime() && calEvent.start.getTime() < new MyDate().getTime()) { + $event.css("backgroundColor", "#25B002"); + $event.find(".time").css({"backgroundColor": "#25B002", "border": "1px solid #888"}); + } + }, + date: MyDate(), + dateFormat: "j.n", + timeFormat: "G:i", + scrollToHourMillis: 500, + use24Hour: true, + readonly: true, + showHeader: false, + hourLine: true, + shortDays: t("shortDays", room.config.language), + longDays: t("longDays", room.config.language), + buttons: false, + timeSeparator: " " + t("to", room.config.language) + " ", + startOnFirstDayOfWeek: false, + displayFreeBusys: true, + defaultFreeBusy: {free: false} + }); + getOpeningTimes(room); + + + } + + /** + * downloads openingTimes for an room + * @param room Room Object + */ + function getOpeningTimes(room) { + $.getJSON("../../../api.php?do=locationinfo&action=openingtime&id=" + room.id, function (result) { + if (Object.prototype.toString.call(result) === '[object Array]') { + if (result.length > 0) { + SetOpeningTimes(result[0].openingtime, room); + } + } + scaleCalendar(room); + + }) + .error(function () { + scaleCalendar(room); + + }) + } + + + /** + * Generates the Calendar Div, depending on it's width + * @param width width of the Calendar Div + * @param room Room Object + */ + + function generateCalendarDiv(width, room) { + var div = document.createElement("div"); + div.id = "calendar_" + room.id; + div.className = "calendar"; + if (room.config.vertical && room.config.mode == 1) { + width = 100 + "%"; + div.float = "Top"; + } + div.style.width = width; + //document.body.appendChild(div); + $("#room_" + room.id).append(div); + + } + + /** + * sets the opening Time in the calendar plugin and saves it in the room object + * @param parsedOpenings Dictonary of Opening times. + * @param room Room Object + */ + + function SetOpeningTimes(parsedOpenings, room) { + var opening = 24; + var close = 0; + room.openingTimesCalendar = []; + room.openingTimes = [parsedOpenings['Sunday'], parsedOpenings['Monday'], parsedOpenings['Tuesday'], + parsedOpenings['Wednesday'], parsedOpenings['Thursday'], + parsedOpenings['Friday'], parsedOpenings['Saturday']]; + if (room.config.mode == 3) { + return; + } + for (var i = 0; i < 7; i++) { + var tmp = room.openingTimes[i]; + if (tmp != null) { + for (var d = 0; d < tmp.length; d++) { + var day = getNextDayOfWeek(new MyDate(), i); + room.openingTimesCalendar.push({ + "start": new Date(day.getFullYear(), day.getMonth(), day.getDate(), + tmp[d]['HourOpen'], tmp[d]['MinutesOpen']), + "end": new Date(day.getFullYear(), day.getMonth(), + day.getDate(), tmp[d]['HourClose'], tmp[d]['MinutesClose']), + "free": true + }); + if (parseInt(tmp[d]['HourOpen']) < opening) { + opening = tmp[d]['HourOpen']; + } + if (parseInt(tmp[d]['HourClose']) > close) { + close = tmp[d]['HourClose']; + if (parseInt(tmp[d]['MinutesClose']) != 0) { + close++; + } + } + } + } + } + if (parsedOpenings.length == 0) { + opening = 0; + close = 24; + } + room.openTimes = close - opening; + $('#calendar_' + room.id).weekCalendar("option", "businessHours", { + start: parseInt(opening), + end: parseInt(close), + limitDisplay: true + }); + } + + /** + * querys the Calendar data + * @param ids ID'S of rooms to query as string, for e.g.: "5,17,8" or "5" + */ + function queryCalendars(ids) { + var url = "../../../api.php?do=locationinfo&action=calendar&id=" + ids; + + // Todo reimplement Frontend methode if needed + /* + if(!(room.config.calendarqueryurl === undefined)) { + url = room.config.calendarqueryurl; + } + */ + $.ajax({ + url: url, + dataType: 'json', + cache: false, + timeout: 30000, + success: function (result) { + var l = result.length; + for (var i = 0; i < l; i++) { + updateCalendar(result[i].calendar, rooms[result[i].id]); + } + + + }, error: function () { + + } + }); + } + + /** + * applays new calendar data to the calendar plugin and also saves it to the room object + * @param json Calendar data JSON + * @param room Room Object + */ + function updateCalendar(json, room) { + + if (!json) { + console.log("Error: Calendar data was an empty string."); + return; + } + try { + room.timetable = json; + if (room.config.mode != 3) { + var cal = $('#calendar_' + room.id); + cal.weekCalendar("option", "data", json); + cal.weekCalendar("refresh"); + cal.weekCalendar("option", "defaultFreeBusy", {free: false}); + cal.weekCalendar("updateFreeBusy", room.openingTimesCalendar); + } + ComputeCurrentState(room); + } catch (e) { + console.log("Error: Couldnt add calendar data"); + console.log(e); + } + } + + /** + * scales calendar, called once on create and on window resize + * @param room Room Object + */ + function scaleCalendar(room) { + if (room.config.mode == 3) { + return; + } + if (room.openTimes == null) { + room.openTimes = 24; + } + var cal = $('#calendar_' + room.id); + var columnWidth = document.getElementById("calendar_" + room.id).getElementsByClassName("wc-day-1")[0].clientWidth; + + if (room.config.scaledaysauto) { + var result = (cal.weekCalendar("option", "daysToShow") * columnWidth) / 100; + result = parseInt(Math.min(Math.max(Math.abs(result), 1), 7)); + if (result != parseInt(cal.weekCalendar("option", "daysToShow"))) { + + cal.weekCalendar("option", "daysToShow", Math.abs(result)); + } + } + if (((!room.config.scaledaysauto) || cal.weekCalendar("option", "daysToShow") == 1) && columnWidth < 85) { + cal.weekCalendar("option", "useShortDayNames", true); + } else { + cal.weekCalendar("option", "useShortDayNames", false); + } + var clientHeight = $(window).height(); + if (roomsToshow == 4) { + clientHeight = clientHeight / 2; + } + + clientHeight = clientHeight - document.getElementById('header_' + room.id).clientHeight + - document.getElementsByClassName("wc-time-column-header")[0].clientHeight - 2; + + if (room.config.mode == 1 && room.config.vertical) { + + clientHeight = clientHeight * (room.config.scale / 100); + clientHeight -= 22; + } + clientHeight -= 6; + var height = clientHeight / (room.openTimes * cal.weekCalendar("option", "timeslotsPerHour")); + + + if (height < 30) { + height = 30; + } + // Scale calendar font + if (height > 120) { + cal.weekCalendar("option", "textSize", 28); + } + else if (height > 100) { + cal.weekCalendar("option", "textSize", 24); + } else if (height > 80) { + cal.weekCalendar("option", "textSize", 22); + } else if (height > 70) { + cal.weekCalendar("option", "textSize", 20); + } else if (height > 60) { + cal.weekCalendar("option", "textSize", 14); + } else { + cal.weekCalendar("option", "textSize", 13); + } + cal.weekCalendar("option", "timeslotHeight", height); + if (room.openingTimesCalendar != null) { + cal.weekCalendar("updateFreeBusy", room.openingTimesCalendar); + } + cal.weekCalendar("resizeCalendar"); + cal.weekCalendar("scrollToHour"); + + } + + /** + * used for countdown + * computes the time difference between 2 Date objects + * @param a Date Object + * @param b Date Object + * @param room Room Object + * @returns time string + */ + function GetTimeDiferenceAsString(a, b, room) { + if (a == null || b == null) { + return ""; + } + var milliseconds = a.getTime() - b.getTime(); + var seconds = Math.floor((milliseconds / 1000) % 60); + milliseconds -= seconds * 1000; + var minutes = Math.floor((milliseconds / (1000 * 60)) % 60); + milliseconds -= minutes * 1000 * 60; + var hours = Math.floor((milliseconds / (1000 * 60 * 60)) % 24); + + var days = Math.floor((milliseconds / (1000 * 60 * 60 * 24)) % 31); + if (seconds < 10) { + seconds = "0" + seconds; + } + if (minutes < 10) { + minutes = "0" + minutes; + } + if (days != 0) { + // dont show? + return ""; + } + if (room.config.einkmode) { + return hours + ":" + minutes; + } + return hours + ":" + minutes + ":" + seconds; + } + + /** + * returns next closing time of a given room + * @param room + * @returns Date Object of next closing + */ + function GetNextClosing(room) { + var now = new MyDate(); + var day = now.getDay(); + var offset = 0; + var bestdate; + for (var a = 0; a < 7; a++) { + var tmp = room.openingTimes[day]; + if (tmp != null) { + for (var i = 0; i < tmp.length; i++) { + var closeDate = new MyDate(); + closeDate.setDate(now.getDate() + offset); + closeDate.setHours(tmp[i].HourClose); + closeDate.setMinutes(tmp[i].MinutesClose); + closeDate.setSeconds(0); + if (closeDate > now) { + if (!IsOpen(new Date(closeDate.getTime() + 60000), room)) { + if (bestdate == null || bestdate > closeDate) { + bestdate = closeDate; + } + } + } + } + } + offset++; + day++; + if (day > 6) { + day = 0; + } + } + return bestdate; + } + + + /** + * checks if a room is on a given date/time open + * @param date Date Object + * @param room Room object + * @returns bool for open or not + */ + function IsOpen(date, room) { + if (room.openingTimes == null) { + return false; + } + var tmp = room.openingTimes[date.getDay()]; + if (tmp == null) { + return false; + } + for (var i = 0; i < tmp.length; i++) { + var openDate = new MyDate(); + openDate.setHours(tmp[i].HourOpen); + openDate.setMinutes(tmp[i].MinutesOpen); + var closeDate = new MyDate(); + closeDate.setHours(tmp[i].HourClose); + closeDate.setMinutes(tmp[i].MinutesClose); + if (openDate < date && closeDate > date) { + return true; + } + } + return false; + } + + + /** + * Retruns next Opening + * @param room Room Object + * @returns bestdate Date Object of next opening + */ + function GetNextOpening(room) { + var now = new MyDate(); + var day = now.getDay(); + var offset = 0; + var bestdate; + for (var a = 0; a < 7; a++) { + if (room.openingTimes == null) { + return null; + } + var tmp = room.openingTimes[day]; + if (tmp != null) { + for (var i = 0; i < tmp.length; i++) { + var openDate = new MyDate(); + openDate.setDate(now.getDate() + offset); + openDate.setHours(tmp[i].HourOpen); + openDate.setMinutes(tmp[i].MinutesOpen); + if (openDate > now) { + if (!IsOpen(new Date(openDate.getTime() - 60000), room)) { + if (bestdate == null || bestdate > openDate) { + bestdate = openDate; + } + } + } + } + } + offset++; + day++; + if (day > 6) { + day = 0; + } + } + return bestdate; + } + + + /** + * Sets the free PCs number in the right corner and updates the sqare color acordingly + * @param id Room id + * @param seats Number of free PC's in the room + */ + function SetFreeSeats(id, seats) { + if (seats > 0) { + $("#freeSeatsHeader_" + id).text(seats); + $("#square_" + id).css('background-color', '#00dd10'); + } else if (seats == -1) { + $("#freeSeatsHeader_" + id).text(""); + $("#square_" + id).css('background-color', 'red'); + } else { + $("#freeSeatsHeader_" + id).text("0"); + $("#square_" + id).css('background-color', 'red'); + } + } + + /** + * Updates the Header of an Room + * @param room Room Object + */ + function UpdateRoomHeader(room) { + var tmp = room.getState(); + if (tmp.state == "closed") { + $("#courseHeading_" + room.id).text(t("closed", room.config.language) + " " + GetTimeDiferenceAsString(tmp.end, new MyDate(), room)); + SetFreeSeats(room.id, room.freePcs); + } else if (tmp.state == "ClaendarEvent") { + $("#courseHeading_" + room.id).text(tmp.title); + SetFreeSeats(room.id, -1); + } else if (tmp.state == "Free") { + $("#courseHeading_" + room.id).text(t("free", room.config.language) + " " + GetTimeDiferenceAsString(tmp.end, new MyDate(), room)); + SetFreeSeats(room.id, room.freePcs); + } else if (tmp.state == "FreeNoEnd") { + $("#courseHeading_" + room.id).text(t("free", room.config.language)); + SetFreeSeats(room.id, room.freePcs); + } + } + + /** + * computes state of a room, states are: + * closed, FreeNoEnd, Free, ClaendarEvent. + * @param Room Object + */ + function ComputeCurrentState(room) { + if (!IsOpen(new MyDate(), room)) { + room.state = {state: "closed", end: GetNextOpening(room), title: "", next: ""}; + + return; + } + var closing = GetNextClosing(room); + + var event = getNextEvent(room.timetable); + + // no event and no closing + if (closing == null && event == null) { + room.state = {state: "FreeNoEnd", end: "", title: "", next: ""}; + return; + } + + // no event so closing is next + if (event == null) { + room.state = {state: "Free", end: closing, title: "", next: "closing"}; + return; + } + + // event is at the moment + if ((closing == null || event.start.getTime() < closing.getTime()) && event.start.getTime() < new MyDate()) { + room.state = {state: "ClaendarEvent", end: event.end, title: event.title, next: ""}; + return; + } + + // no closing so event is next + if (closing == null) { + room.state = {state: "Free", end: event.start, title: "", next: "event"}; + return; + } + + // event sooner then closing + if (event.start.getTime() < closing) { + room.state = {state: "Free", end: event.start, title: "", next: "event"}; + } else if (event.start.getTime() > closing) { + room.state = {state: "Free", end: closing, title: "", next: "closing"}; + } + + } + + + /** + * returns next event from a given json of events + * @param json Json which contains the calendar data. + * @returns event next Carlendar Event + */ + function getNextEvent(json) { + var event; + var now = new MyDate(); + if (json == null) { + return; + } + for (var i = 0; i < json.length; i++) { + //event is now active + if (json[i].start.getTime() < now.getTime() && json[i].end.getTime() > now.getTime()) { + return json[i]; + } + //first element to consider + if (event == null) { + if (json[i].start.getTime() > now.getTime()) { + event = json[i]; + } + } + if (json[i].start.getTime() > now.getTime() && event.start.getTime() > json[i].start.getTime()) { + event = json[i]; + } + } + return event; + } + + function getNextDayOfWeek(date, dayOfWeek) { + // Code to check that date and dayOfWeek are valid left as an exercise ;) + + var resultDate = new Date(date.getTime()); + + resultDate.setDate(date.getDate() + (7 + dayOfWeek - date.getDay()) % 7); + + return resultDate; + } + /* + /========================================== Room Layout ============================================= + */ + + + var picSizeX = 3.8; + var picSizeY = 3; + + /** + * Generates the RoomLayout Div + * @param width The width the RoomLayout should have (in percent). + * @param room Room Object + */ + function generateRoomLayoutDiv(width, room) { + var div = document.createElement("div"); + div.id = "roomLayout_" + room.id; + div.className = "roomLayoutDesign"; + if ((room.config.vertical && room.config.mode == 1) || (room.config.mode == 3) || (room.config.mode == 4)) { + width = 100 + "%"; + div.float = "Top"; + } + + div.style.width = width; + if (room.config.mode == 4) { + div.style.display = "none"; + } + //document.body.appendChild(div); + $("#room_" + room.id).append(div); + + + } + /** + * Donwloads Room Layout Json (which contains the pc information for a given room) + * @param room Room Object + */ + function preInitRoom(room) { + + $.getJSON("../../../api.php?do=locationinfo&action=roominfo&id=" + room.id + "&coords=1", function (result) { + generateRoomLayoutDiv((100 - room.config.scale) + "%", room); + if (result[0] == null) { + + return; + } + initRoom(result[0].computer, room); + + }).error(function () { + + generateRoomLayoutDiv((100 - room.config.scale) + "%", room); + }) + } + + + /** + * Main funciton for generating the Room Layout + * @param layout Layout Json + * @param room Room Object + */ + function initRoom(layout, room) { + var maxX; + var maxY; + var minY; + var minX; + var xDifference; + var yDifference; + room.layout = layout; + if (layout == null || layout.length == 0) { + return; + } + if (room.config.rotation != 0) { + rotateRoom(room.config.rotation, layout); + } + + + for (var i = 0; i < layout.length; i++) { + if (!isNaN(parseInt(layout[i].x)) && !isNaN(parseInt(layout[i].y)) && layout[i].y != null && layout[i].y != null) { + if (minX === undefined) { + minX = parseInt(layout[i].x); + } + if (minY === undefined) { + minY = parseInt(layout[i].y); + } + if (maxX === undefined) { + maxX = parseInt(layout[i].x); + } + if (maxY === undefined) { + maxY = parseInt(layout[i].y); + } + if (parseInt(layout[i].x) < parseInt(minX)) { + minX = parseInt(layout[i].x); + } + if (parseInt(layout[i].y) < parseInt(minY)) { + minY = parseInt(layout[i].y); + } + if (parseInt(layout[i].x) > parseInt(maxX)) { + maxX = parseInt(layout[i].x); + } + if (parseInt(layout[i].y) > parseInt(maxY)) { + maxY = parseInt(layout[i].y); + } + } + } + + xDifference = maxX - minX; + yDifference = maxY - minY; + + room.xDifference = xDifference; + room.yDifference = yDifference; + room.minX = minX; + room.minY = minY; + room.maxX = maxX; + room.maxY = maxY; + + generateOffsetAndScale(room); + setUpRoom(room, layout); + scaleRoom(room); + UpdatePc(layout, room); + + } + + /** + * Computes offsets and scaling's for the RoomLayout + * @param room Room Object + */ + function generateOffsetAndScale(room) { + + var clientHeight = $(window).height(); + if (roomsToshow == 4) { + clientHeight = clientHeight / 2; + } + + clientHeight = clientHeight - document.getElementById('header_' + room.id).clientHeight - 5; + + if (roomsToshow > 1) { + clientHeight -= 5; + } + if (room.config.vertical && room.config.mode == 1) { + clientHeight = clientHeight * (1 - (room.config.scale / 100)); + } + var roomLayout = document.getElementById('roomLayout_' + room.id); + + var clientWidth = roomLayout.clientWidth; + //roomLayout.style.height = clientHeight + "px"; + + var scaleX; + if (room.xDifference != 0) { + scaleX = clientWidth / room.xDifference; + } else { + scaleX = clientWidth; + } + var scaleY; + if (room.yDifference != 0) { + scaleY = clientHeight / room.yDifference; + } else { + scaleY = clientHeight; + } + var scaleYs = (clientHeight - (picSizeY * scaleY)) / room.yDifference; + var scaleXs = (clientWidth - (picSizeX * scaleX)) / room.xDifference; + if (scaleYs <= 0) { + scaleYs = 9999; + } + if (scaleXs <= 0) { + scaleXs = 9999; + } + + + var tmp = [scaleYs, scaleY, scaleXs, scaleX, (clientHeight * 0.9) / picSizeY, (clientWidth * 0.9) / picSizeX]; + room.scale = Math.min.apply(Math, tmp); + room.xOffset = 0 - room.minX; + room.yOffset = 0 - room.minY; + room.xOffset += ((1 / 2 * (clientWidth - (((room.maxX + room.xOffset) * room.scale) + picSizeX * room.scale))) / room.scale); + room.yOffset += ((1 / 2 * (clientHeight - (((room.maxY + room.yOffset) * room.scale) + picSizeY * room.scale))) / room.scale); + } + + + /** + * adds images for each pc to Room Layout + * @param room Room Object + * @param layout Layout json + */ + function setUpRoom(room, layout) { + for (var i = 0; i < layout.length; i++) { + + if (layout[i].y != null && layout[i].x != null && !isNaN(layout[i].y) && !isNaN(layout[i].x)) { + var text = "<div class= 'PCImgDiv' id ='layout_PC_div_" + room.id + "_" + layout[i].id + "'>" + + + "<div class= 'OverlayDiv' id ='layout_PC_overlay_" + room.id + "_" + layout[i].id + "'>" + + "</div>" + + "<img class= 'pcImg' id ='layout_PC_" + room.id + "_" + layout[i].id + "'> </img>" + + "</div>"; + + $('#roomLayout_' + room.id).append(text); + if (layout[i].hasOwnProperty('overlay')) { + for (var a = 0; a < layout[i].overlay.length; a++) { + addOverlay($('#layout_PC_overlay_' + room.id + "_" + layout[i].id), layout[i].overlay[a]); + } + } + } + } + } + + /** + * Adds an overlay to an div(here the PC's shown in the RoomLayout). + * @param object Object where the overlay should be added + * @param overlayName name of the overlay (image name without ending) + */ + function addOverlay(object, overlayName) { + var a = [".svg", ".png", "jpg"]; + var imgname; + for (var i = 0; i < a.length; a++) { + if (imageExists("img/overlay/" + overlayName + a[i])) { + imgname = "img/overlay/" + overlayName + a[i]; + break; + } + + } + if (imgname == null) { + return; + } + var text = $("<img class='overlay' src='" + imgname + "'></img>"); + text.addClass("overlay-" + overlayName); + + object.append(text); + + + } + + + var imgExists = {}; + + /** + * checks if images exists on the webserver(chaches it also) + * @param image_url Path to the image + */ + function imageExists(image_url) { + if (!imgExists.hasOwnProperty(image_url)) { + var http = new XMLHttpRequest(); + http.open('HEAD', image_url, false); + http.send(); + imgExists[image_url] = http.status != 404; + } + return imgExists[image_url]; + + } + + /** + * Querys Pc states + * @param ids Room ID's which should be queried. Format for e.g.: "20,5,6" + */ + function queryRooms(ids) { + $.ajax({ + url: "../../../api.php?do=locationinfo&action=roominfo&id=" + ids + "&coords=0", + dataType: 'json', + cache: false, + timeout: 30000, + success: function (result) { + var l = result.length; + if (result[0] == null) { + console.log("Error: Backend reported null back for RoomUpdate, this might happend if the room isn't" + + "configurated."); + return; + } + for (var i = 0; i < l; i++) { + + UpdatePc(result[i].computer, rooms[result[i].id]); + } + }, error: function () { + + } + }) + } + + + /** + * Adjust pc coordinate depending on room rotation + * @param r Rotation, from 0 - 3 (int) + * @param layout Layout json + */ + function rotateRoom(r, layout) { + for (var z = 0; z < r; z++) { + for (var i = 0; i < layout.length; i++) { + var x = parseInt(layout[i].x); + var y = parseInt(layout[i].y); + layout[i].x = y; + layout[i].y = -x; + } + } + } + + /** + * Positions the computer images in the roomLayout div accoring to ther potion and div size + * @param room Room object + */ + function scaleRoom(room) { + if (room.layout == null) { + return; + } + for (var i = 0; i < room.layout.length; i++) { + if (room.layout[i].y != null && room.layout[i].x != null && !isNaN(room.layout[i].y) && !isNaN(room.layout[i].x)) { + var tmp = document.getElementById("layout_PC_div_" + room.id + "_" + room.layout[i].id); + var img = document.getElementById("layout_PC_" + room.id + "_" + room.layout[i].id); + if (tmp != null) { + tmp.style.width = (picSizeX * room.scale); + tmp.setAttribute("style", "width:" + (picSizeX * room.scale) + "px"); + tmp.style.height = (picSizeY * room.scale) + "px"; + tmp.style.left = ((parseInt(room.layout[i].x) + room.xOffset) * room.scale) + "px"; + tmp.style.top = ((parseInt(room.layout[i].y) + room.yOffset) * room.scale ) + "px"; + } + } + } + } + + + /** + * Updates the PC's (images) in the room layout. Also Updates how many pc's are free. + * @param update Update Json from query for one(!) room + * @param room Room object + */ + function UpdatePc(update, room) { + if (update === undefined || update == null) { + return; + } + var freePcs = 0; + for (var i = 0; i < update.length; i++) { + var imgobj = document.getElementById("layout_PC_" + room.id + "_" + update[i].id); + + + var img; + // Pc free + if (update[i].pcState == "IDLE") { + if (supportSvg) { + img = "img/pc_free"; + } else { + imgobj.style.backgroundColor = "green"; + } + freePcs++; + // Pc in use + } else if (update[i].pcState == "OCCUPIED") { + if (supportSvg) { + img = "img/pc_used"; + } else { + imgobj.style.backgroundColor = "red"; + } + // PC off + } else if (update[i].pcState == "OFF") { + if (supportSvg) { + img = "img/pc_off"; + } else { + imgobj.style.backgroundColor = "black"; + } + freePcs++; + } else { + if (supportSvg) { + img = "img/pc_defect"; + } else { + imgobj.style.backgroundColor = "black"; + } + } + + if (imgobj != null && supportSvg) { + if (room.config.einkmode) { + img = img + "_eink"; + } + imgobj.src = img + ".svg"; + } + + } + + room.freePcs = freePcs; + + + } + + /* + /========================================== Misc ============================================= + */ + var resizeTimeout; + + // called when browser window changes size + // scales calendar and room layout acordingly + + $(window).resize(function () { + clearTimeout(resizeTimeout); + resizeTimeout = setTimeout(function () { + + for (var property in rooms) { + + rooms[property].resized = true; + if (rooms[property].config.mode != null) { + if (rooms[property].config.mode != 3) { + scaleCalendar(rooms[property]); + + } + if (rooms[property].config.mode != 2) { + generateOffsetAndScale(rooms[property]); + scaleRoom(rooms[property]); + } + } + } + }, 50); + }); + + + /** + * returns parameter value from the url + * @param sParam + * @returns value for given parameter + */ + var getUrlParameter = function getUrlParameter(sParam) { + var sPageURL = decodeURIComponent(window.location.search.substring(1)), + sURLVariables = sPageURL.split('&'), + sParameterName, + i; + + for (i = 0; i < sURLVariables.length; i++) { + sParameterName = sURLVariables[i].split('='); + + if (sParameterName[0] === sParam) { + return sParameterName[1] === undefined ? true : sParameterName[1]; + } + } + }; + + /** + * Function for translation + * @param toTranslate key which we wan't to translate + * @param lang languages in which should be translated + * @returns r translated string + */ + function t(toTranslate, lang) { + + var r; + if (lang === undefined) { + r = translation['en'][toTranslate]; + } else { + r = translation[lang][toTranslate]; + } + return r; + } + + + /** + * Used in Mode 4, switches given room from Timetable to Roomlayout and vice versa + * @param room + */ + function switchLayout(room) { + var car = document.getElementById("calendar_" + room.id); + var roomLayout = document.getElementById("roomLayout_" + room.id); + + if (car.style.display == "none") { + roomLayout.style.display = "none"; + car.style.display = "block"; + if (room.resized) { + scaleCalendar(room); + room.resized = false; + } + } else { + car.style.display = "none"; + roomLayout.style.display = "block"; + if (room.resized) { + generateOffsetAndScale(room); + scaleRoom(room); + room.resized = false; + } + } + } + + + /** + * adds a progressbar to a given room (id) used in mode 4 + * @param id room id + */ + function generateProgressBar(id) { + + var div = document.createElement("div"); + div.id = "progressBar_" + id; + div.classList.add("progressbar"); + //document.body.appendChild(div); + $("#room_" + id).append(div); + + } + /** + * Animates the progressbar used in mode 4 + * @param roomId + * @param time + * @constructor + */ + function MoveProgressBar(roomId, time) { + var elem = document.getElementById("progressBar_" + roomId); + var width = 1; + var id = setInterval(frame, time / 100); + + function frame() { + if (width >= 100) { + clearInterval(id); + } else { + width++; + elem.style.width = width + '%'; + } + } + } + + + </script> +</head> +<body> +</body> +</html> diff --git a/modules-available/locationinfo/frontend/panel.html b/modules-available/locationinfo/frontend/panel.html index eb8c2fd8..89d1c144 100644 --- a/modules-available/locationinfo/frontend/panel.html +++ b/modules-available/locationinfo/frontend/panel.html @@ -5,59 +5,66 @@ <script type='text/javascript' src='../../../script/jquery.js'></script> <style type='text/css'> - body{ + body { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; background-color: lightgrey; } - .main{ + + .main { background-color: lightgrey; } - .child{ + .child { background-color: white; display: inline-block; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; padding: 1vmin; - float:left; + float: left; } - .parent{ + + .parent { background-color: white; display: inline-block; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; padding: 5px; - float:left; + float: left; } - .childWithBorder{ + + .childWithBorder { display: inline-flex; padding: 0.4vmin; } - .outermost{ + .outermost { } - .row{ - float:left + + .row { + float: left } - .border{ + + .border { display: inline-flex; padding: 5px; } - .borderout{ + + .borderout { display: inline-flex; padding: 0.4vmin; } - .courseFont{ + .courseFont { padding: 0.5vmin; font-size: 2vmin; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: bold; overflow: hidden; } - .headerFont{ + + .headerFont { font-size: 4vmin; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: bold; @@ -65,10 +72,11 @@ border-bottom: 0.2vmin; margin-bottom: 1vmin; border-color: grey; - border-style:solid; + border-style: solid; } - .divPcOn, .divPcPcUsed, .divPcPcOff, .divPcPcDefect{ + + .divPcOn, .divPcPcUsed, .divPcPcOff, .divPcPcDefect { width: 4vmin; height: 4vmin; text-align: center; @@ -78,30 +86,32 @@ } - .divPcOn { background-color: green; text-align: center; } - .divPcPcUsed{ + + .divPcPcUsed { background-color: red; } - .divPcPcOff{ + + .divPcPcOff { background-color: darkgrey; } - .divPcPcDefect{ + + .divPcPcDefect { background-color: black; color: white; } - .divAroundPcStates{ + .divAroundPcStates { display: flex; justify-content: flex-end; } - .paperEffect - { + + .paperEffect { margin: 0 auto; background-color: #fff; -webkit-box-shadow: 0 0 0.2vmin rgba(0, 0, 0, 0.4), inset 0 0 1vmin rgba(0, 0, 0, 0.1); @@ -111,7 +121,6 @@ } - </style> <script type='text/javascript'> @@ -123,7 +132,7 @@ // Todo change these var pcStateUpdateTime = 60; // in seconds - var TimeTableUpdateTime = 60*30; //in seconds + var TimeTableUpdateTime = 60 * 30; //in seconds $(document).ready(function () { @@ -137,8 +146,8 @@ $.getJSON("../../../api.php?do=locationinfo&action=roomtree&id=" + ids, function (result) { generateLayout(result); - setInterval(update,1000); - arrange(); + setInterval(update, 1000); + arrange(); }); } @@ -147,173 +156,172 @@ * Main Fuction for aranging the divs */ function arrange() { - var height = $( window ).height(); - var width = $( window ).width(); - var childs = $(".childWithBorder"); + var height = $(window).height(); + var width = $(window).width(); + var childs = $(".childWithBorder"); var parents = []; - for(var i = 0; i < childs.length;i++){ - var parent= $(childs[i]).parent(); - if($.inArray(parent[0],parents)==-1){ - parents.push(parent[0]); + for (var i = 0; i < childs.length; i++) { + var parent = $(childs[i]).parent(); + if ($.inArray(parent[0], parents) == -1) { + parents.push(parent[0]); } } - for (var i = 0; i < parents.length;i++) { - childs = $(parents[i]).children(); + for (var i = 0; i < parents.length; i++) { + childs = $(parents[i]).children(); - if(checkForLineBreak(parents[i],childs) > 0){ - makeItFit(parents[i],childs,childs.length/2); - } + if (checkForLineBreak(parents[i], childs) > 0) { + makeItFit(parents[i], childs, childs.length / 2); + } - } + } - } + } /** * rekursive calls itselfs and trys to find the best number off childs * which should be side by side. - * @param parent Parent div - * @param childs Child divs - * @param breakAfter number after the divs should go in the next row + * @param parent Parent div + * @param childs Child divs + * @param breakAfter number after the divs should go in the next row */ - function makeItFit(parent,childs,breakAfter) { - breakAfter= Math.abs(breakAfter); - var width = checkIfFit(parent,childs,breakAfter) - if(width > 0){ - $(parent).width(width+20); + function makeItFit(parent, childs, breakAfter) { + breakAfter = Math.abs(breakAfter); + var width = checkIfFit(parent, childs, breakAfter) + if (width > 0) { + $(parent).width(width + 20); } else { - makeItFit(parent, childs, breakAfter-1); - } - } + makeItFit(parent, childs, breakAfter - 1); + } + } /** * checks if a given number off divs(side by side) would fit on the screen - * @param parent Parent div - * @param childs Child divs + * @param parent Parent div + * @param childs Child divs * @param breakAfter number after the divs should go in the next row * @returns -1 if it wouldn't fit else the width the div should have */ - function checkIfFit(parent,childs,breakAfter) { - var parentWidth = $(parent).width(); - var maxWidth = 0; - var curWidth = 0; - var t = 0; - for (var i = 0; i < childs.length;i++) { - var childWidth = $(childs[i]).width(); - if((curWidth + childWidth > parentWidth && breakAfter > 1)){ - return -1; + function checkIfFit(parent, childs, breakAfter) { + var parentWidth = $(parent).width(); + var maxWidth = 0; + var curWidth = 0; + var t = 0; + for (var i = 0; i < childs.length; i++) { + var childWidth = $(childs[i]).width(); + if ((curWidth + childWidth > parentWidth && breakAfter > 1)) { + return -1; } - curWidth += childWidth; - t++; - if(t == breakAfter){ - maxWidth =Math.max(curWidth,maxWidth); - curWidth = 0; - t=0; + curWidth += childWidth; + t++; + if (t == breakAfter) { + maxWidth = Math.max(curWidth, maxWidth); + curWidth = 0; + t = 0; } - } - return maxWidth - } + } + return maxWidth + } - /** + /** * return the number of Linebreaks the divs would make * @param parent Parent div * @param childs Child divs * @returns the number of Linebreaks the divs would make */ - function checkForLineBreak (parent,childs){ - var linebreaks = 0; + function checkForLineBreak(parent, childs) { + var linebreaks = 0; var curWidth = 0; - var parentWidth = $(parent).width(); - for (var i = 0; i < childs.length;i++) { - var childWidth = $(childs[i]).width(); - if(curWidth + childWidth < parentWidth ){ - curWidth += childWidth; + var parentWidth = $(parent).width(); + for (var i = 0; i < childs.length; i++) { + var childWidth = $(childs[i]).width(); + if (curWidth + childWidth < parentWidth) { + curWidth += childWidth; } else { - linebreaks++; + linebreaks++; - curWidth = childWidth; + curWidth = childWidth; } - } - return linebreaks; + } + return linebreaks; } function SetUpDate(d) { - startdate = d.getTime()-new Date().getTime(); + startdate = d.getTime() - new Date().getTime(); } function MyDate() { - return new Date(startdate +new Date().getTime()); + return new Date(startdate + new Date().getTime()); } function generateLayout(json) { - var ids = getUrlParameter("id"); - ids = ids.split(','); - for(var t = 0; t< ids.length;t++) - { + var ids = getUrlParameter("id"); + ids = ids.split(','); + for (var t = 0; t < ids.length; t++) { - for (var i = 0; i < json.length; i++) { - if(ids[t]== json[i].id) { - var el = generateObject(json[i], ($("#main")), true); - } + for (var i = 0; i < json.length; i++) { + if (ids[t] == json[i].id) { + var el = generateObject(json[i], ($("#main")), true); + } - } - } + } + } } - /** - * generates the divs, decidecs if parent or child - * @param json Room tree json + /** + * generates the divs, decidecs if parent or child + * @param json Room tree json * @param myParent parent div - * @param outermost if the object is a root node - * @returns generated div - */ - function generateObject(json,myParent,outermost){ - var obj; - if(json.childs.length == 0) { - obj =generateChild(myParent,json.id,json.name,outermost); + * @param outermost if the object is a root node + * @returns generated div + */ + function generateObject(json, myParent, outermost) { + var obj; + if (json.childs.length == 0) { + obj = generateChild(myParent, json.id, json.name, outermost); } else { - obj = generateParent(myParent,json.id,json.name,outermost); - for (var i = 0; i < json.childs.length;i++){ + obj = generateParent(myParent, json.id, json.name, outermost); + for (var i = 0; i < json.childs.length; i++) { - generateObject(json.childs[i],$("#parent_"+json.id)); + generateObject(json.childs[i], $("#parent_" + json.id)); } } return obj; } - /** - * Retruns the number of childs of the current node (inklusive childs of childs) - * @param json Json of the room tree - * @returns number of childs of the current node - */ - function getAllchildsRekusivly(json){ - var childs = 0; - for (var i = 0; i < json.childs.length;i++){ - childs++; - if(json.childs[i].childs.length != 0){ - childs = getAllchildsRekusivly(json.childs[i]); - } - } - return childs; - } - - /** - * Retruns the number of leaveschilds of the current node (inklusive leaves childs of childs) - * @param json Json of the room tree - * @returns number of leaveschilds of the current node - */ - function getChildsRekusivly(json){ - var childs = 0; - for (var i = 0; i < json.childs.length;i++){ - if(json.childs[i].childs.length == 0){ - childs++; - } else { - childs = getChildsRekusivly(json.childs[i]); + /** + * Retruns the number of childs of the current node (inklusive childs of childs) + * @param json Json of the room tree + * @returns number of childs of the current node + */ + function getAllchildsRekusivly(json) { + var childs = 0; + for (var i = 0; i < json.childs.length; i++) { + childs++; + if (json.childs[i].childs.length != 0) { + childs = getAllchildsRekusivly(json.childs[i]); + } + } + return childs; + } + + /** + * Retruns the number of leaveschilds of the current node (inklusive leaves childs of childs) + * @param json Json of the room tree + * @returns number of leaveschilds of the current node + */ + function getChildsRekusivly(json) { + var childs = 0; + for (var i = 0; i < json.childs.length; i++) { + if (json.childs[i].childs.length == 0) { + childs++; + } else { + childs = getChildsRekusivly(json.childs[i]); } - } - return childs; + } + return childs; } /** @@ -323,72 +331,70 @@ */ function getChilds(json) { - var childs = 0; - for (var i = 0; i < json.childs.length;i++){ - if(json.childs[i].childs.length == 0){ - childs++; + var childs = 0; + for (var i = 0; i < json.childs.length; i++) { + if (json.childs[i].childs.length == 0) { + childs++; } - } - return childs; - } - - + } + return childs; + } - /** - * Helper function to generate id string used in query functions - * @param list A string, wicht contains ids or not(for now) - * @param id An ID which should be added to the list - */ - function addIdToUpdateList(list, id) { - if (list == "") { - list += id; - } else { - list += ("," + id); - } - return list; - } + /** + * Helper function to generate id string used in query functions + * @param list A string, wicht contains ids or not(for now) + * @param id An ID which should be added to the list + */ + function addIdToUpdateList(list, id) { + if (list == "") { + list += id; + } else { + list += ("," + id); + } + return list; + } - var timeSteps = 10; + var timeSteps = 10; function update() { - if (timeSteps > 9) { - timeSteps = 0; - var calendarUpdateIds = ""; - var rommUpdateIds = ""; - for (var property in rooms) { - if (rooms[property].lastCalendarUpdate == null || rooms[property].lastCalendarUpdate + rooms[property].config.calupdates< MyDate().getTime()) { - calendarUpdateIds = addIdToUpdateList(calendarUpdateIds, rooms[property].id); - rooms[property].lastCalendarUpdate = MyDate().getTime(); - } - if (rooms[property].lastRoomUpdate == null || rooms[property].lastRoomUpdate + rooms[property].config.roomupdate < MyDate().getTime()) { - rommUpdateIds = addIdToUpdateList(rommUpdateIds, rooms[property].id); - rooms[property].lastRoomUpdate = MyDate().getTime(); - - } - } - if (calendarUpdateIds != "") { - queryCalendars(calendarUpdateIds); - } - if (rommUpdateIds != "") { - queryRooms(rommUpdateIds); - } - } - // TODO + if (timeSteps > 9) { + timeSteps = 0; + var calendarUpdateIds = ""; + var rommUpdateIds = ""; for (var property in rooms) { - upDateRoomState(rooms[property]); - } - timeSteps++; + if (rooms[property].lastCalendarUpdate == null || rooms[property].lastCalendarUpdate + rooms[property].config.calupdates < MyDate().getTime()) { + calendarUpdateIds = addIdToUpdateList(calendarUpdateIds, rooms[property].id); + rooms[property].lastCalendarUpdate = MyDate().getTime(); + } + if (rooms[property].lastRoomUpdate == null || rooms[property].lastRoomUpdate + rooms[property].config.roomupdate < MyDate().getTime()) { + rommUpdateIds = addIdToUpdateList(rommUpdateIds, rooms[property].id); + rooms[property].lastRoomUpdate = MyDate().getTime(); + + } + } + if (calendarUpdateIds != "") { + queryCalendars(calendarUpdateIds); + } + if (rommUpdateIds != "") { + queryRooms(rommUpdateIds); + } + } + // TODO + for (var property in rooms) { + upDateRoomState(rooms[property]); + } + timeSteps++; } function UpdateTimeTables(json) { var l = json.length; - for (var i = 0; i < l;i++){ + for (var i = 0; i < l; i++) { rooms[json[i].id].timetable = json[i].calendar; - for (var property in rooms[json[i].id].timetable ) { + for (var property in rooms[json[i].id].timetable) { rooms[json[i].id].timetable[property].start = new Date(rooms[json[i].id].timetable[property].start); rooms[json[i].id].timetable[property].end = new Date(rooms[json[i].id].timetable[property].end); } @@ -396,55 +402,55 @@ } } - /** - * Querys Pc states - * @param ids Room ID's which should be queried. Format for e.g.: "20,5,6" - */ - function queryRooms(ids) { - $.ajax({ - url: "../../../api.php?do=locationinfo&action=pcstates&id=" + ids, - dataType: 'json', - cache: false, - timeout: 30000, - success: function (result) { - var l = result.length; - if (result[0] == null) { - console.log("Error: Backend reported null back for RoomUpdate, this might happend if the room isn't" + - "configurated."); - return; - } - updatePcStates(result); - }, error: function () { - - } - }) - } + /** + * Querys Pc states + * @param ids Room ID's which should be queried. Format for e.g.: "20,5,6" + */ + function queryRooms(ids) { + $.ajax({ + url: "../../../api.php?do=locationinfo&action=pcstates&id=" + ids, + dataType: 'json', + cache: false, + timeout: 30000, + success: function (result) { + var l = result.length; + if (result[0] == null) { + console.log("Error: Backend reported null back for RoomUpdate, this might happend if the room isn't" + + "configurated."); + return; + } + updatePcStates(result); + }, error: function () { + + } + }) + } /** * Updates a room visualy * @param room A room to update */ - function upDateRoomState(room) { - if(room === undefined){ + function upDateRoomState(room) { + if (room === undefined) { console.log("error"); return; } var state = room.getState(); - if(state.state == "ClaendarEvent") { - updateCourseText(room.id,state.titel); - updateCoursTimer(room.id,GetTimeDiferenceAsString(state.end,MyDate())); - } else if(state.state == "Free") { - updateCourseText(room.id,"Frei"); - updateCoursTimer(room.id,GetTimeDiferenceAsString(state.end,MyDate())); - } else if(state.state == "FreeNoEnd") { - updateCourseText(room.id,"Frei"); - updateCoursTimer(room.id,""); + if (state.state == "ClaendarEvent") { + updateCourseText(room.id, state.titel); + updateCoursTimer(room.id, GetTimeDiferenceAsString(state.end, MyDate())); + } else if (state.state == "Free") { + updateCourseText(room.id, "Frei"); + updateCoursTimer(room.id, GetTimeDiferenceAsString(state.end, MyDate())); + } else if (state.state == "FreeNoEnd") { + updateCourseText(room.id, "Frei"); + updateCoursTimer(room.id, ""); } - else if(state.state == "closed") { - updateCourseText(room.id,"Geschlossen"); - updateCoursTimer(room.id,""); + else if (state.state == "closed") { + updateCourseText(room.id, "Geschlossen"); + updateCoursTimer(room.id, ""); } } @@ -453,20 +459,20 @@ * Updates for all rooms the PC's states * @param json Json with information about the PC's states */ - function updatePcStates(json){ + function updatePcStates(json) { var l = json.length; - for (var i = 0; i < l;i++){ - updateRoomUsage(json[i].id,json[i].idle,json[i].occupied,json[i].off,json[i].broken) + for (var i = 0; i < l; i++) { + updateRoomUsage(json[i].id, json[i].idle, json[i].occupied, json[i].off, json[i].broken) } } - /** - * Generates a room Object and adds it to the rooms array - * @param id ID of the room - * @param name Name of the room - * @param config Config Json of the room - */ - function addRoom(id,name,config) { + /** + * Generates a room Object and adds it to the rooms array + * @param id ID of the room + * @param name Name of the room + * @param config Config Json of the room + */ + function addRoom(id, name, config) { var room = { id: id, name: name, @@ -476,9 +482,9 @@ timeTilFree: null, state: null, openingTimes: null, - config: config, - lastCalendarUpdate: null, - lastRoomUpdate: null, + config: config, + lastCalendarUpdate: null, + lastRoomUpdate: null, getState: function () { if (this.state == null) { ComputeCurrentState(this); @@ -494,30 +500,30 @@ }; - if( room.config.calupdate === undefined || room.config.calupdate < 1){ - room.config.calupdate = 1; - } - room.config.calupdate = room.config.calupdate * 60 * 1000; - if( room.config.roomupdate === undefined || room.config.roomupdate < 1){ - room.config.roomupdate = 1; - } - room.config.roomupdate = room.config.roomupdate * 1000; - - rooms[id]=room; - - if(roomidsString == "") { + if (room.config.calupdate === undefined || room.config.calupdate < 1) { + room.config.calupdate = 1; + } + room.config.calupdate = room.config.calupdate * 60 * 1000; + if (room.config.roomupdate === undefined || room.config.roomupdate < 1) { + room.config.roomupdate = 1; + } + room.config.roomupdate = room.config.roomupdate * 1000; + + rooms[id] = room; + + if (roomidsString == "") { roomidsString = id; } else { - roomidsString = roomidsString +","+id; + roomidsString = roomidsString + "," + id; } } - /** - * computes state of a room, states are: - * closed, FreeNoEnd, Free, ClaendarEvent. - * @param Room Object - */ + /** + * computes state of a room, states are: + * closed, FreeNoEnd, Free, ClaendarEvent. + * @param Room Object + */ function ComputeCurrentState(room) { if (!IsOpenNow(room)) { room.state = {state: "closed", end: GetNextOpening(room), titel: "", next: ""}; @@ -540,7 +546,7 @@ } // event is at the moment - if ((closing==null||event.start.getTime() < closing.getTime()) && event.start.getTime() < new MyDate()) { + if ((closing == null || event.start.getTime() < closing.getTime()) && event.start.getTime() < new MyDate()) { room.state = {state: "ClaendarEvent", end: event.end, titel: event.title, next: ""}; return; } @@ -558,11 +564,11 @@ room.state = {state: "Free", end: closing, titel: "", next: "closing"}; } } - /** - * checks if a room is open - * @param room Room object - * @returns bool for open or not - */ + /** + * checks if a room is open + * @param room Room object + * @returns bool for open or not + */ function IsOpenNow(room) { var now = new MyDate(); if (room.openingTimes == null) { @@ -588,15 +594,15 @@ return false; } - /** - * returns next event from a given json of events - * @param json Json which contains the calendar data. - * @returns event next Carlendar Event - */ + /** + * returns next event from a given json of events + * @param json Json which contains the calendar data. + * @returns event next Carlendar Event + */ function getNextEvent(json) { - if (json == null) { - return; - } + if (json == null) { + return; + } var event; var now = new MyDate(); for (var i = 0; i < json.length; i++) { @@ -606,7 +612,7 @@ } //first element to consider if (event == null) { - if(json[i].start.getTime() > now.getTime()) { + if (json[i].start.getTime() > now.getTime()) { event = json[i]; } } @@ -617,11 +623,11 @@ return event; } - /** - * Retruns next Opening - * @param room Room Object - * @returns bestdate Date Object of next opening - */ + /** + * Retruns next Opening + * @param room Room Object + * @returns bestdate Date Object of next opening + */ function GetNextOpening(room) { var now = new MyDate(); var day = now.getDay(); @@ -656,11 +662,11 @@ return bestdate; } - /** - * returns next closing time of a given room - * @param room - * @returns Date Object of next closing - */ + /** + * returns next closing time of a given room + * @param room + * @returns Date Object of next closing + */ function GetNextClosing(room) { var now = new MyDate(); var day = now.getDay(); @@ -668,7 +674,7 @@ var bestdate; for (var a = 0; a < 7; a++) { //Test - if(room.openingTimes=== null) { + if (room.openingTimes === null) { return null; } var tmp = room.openingTimes[day]; @@ -696,28 +702,28 @@ return bestdate; } - /** - * Updates the Course Text of a child - * @param id of the child - * @param on PC's on + /** + * Updates the Course Text of a child + * @param id of the child + * @param on PC's on * @param used PC's used * @param off PC's that are off * @param defect PC's that are defect - */ - function updateRoomUsage(id,on,used,off,defect){ - $("#div_pc_On_"+id).text(on); - $("#div_pc_Used_"+id).text(used); - $("#div_pc_Off_"+id).text(off); - $("#div_pc_Defect_"+id).text(defect); + */ + function updateRoomUsage(id, on, used, off, defect) { + $("#div_pc_On_" + id).text(on); + $("#div_pc_Used_" + id).text(used); + $("#div_pc_Off_" + id).text(off); + $("#div_pc_Defect_" + id).text(defect); } - /** - * Updates the Course Text of a child - * @param id of the child - * @param text Text - */ - function updateCourseText(id,text) { - $("#div_course"+id).text(text); + /** + * Updates the Course Text of a child + * @param id of the child + * @param text Text + */ + function updateCourseText(id, text) { + $("#div_course" + id).text(text); } /** @@ -725,49 +731,49 @@ * @param id of the child * @param time Time value */ - function updateCoursTimer(id,time) { - $("#div_Time_"+id).text(time); + function updateCoursTimer(id, time) { + $("#div_Time_" + id).text(time); } /** * generates a new Div - * @param target Div it should be inserted - * @returns generated div + * @param target Div it should be inserted + * @returns generated div + */ + function generateRow(target) { + var text = "<div class='row' ></div>"; + return $(target).append(text); + } + + /** + * generates a Div, used for a child node + * @param target Div it should be inserted + * @param id ID of the Object it represents + * @param name Name of the Object it represents + * @param outermost if the object is a root node + * @returns generated div */ - function generateRow(target){ - var text="<div class='row' ></div>"; - return $(target).append(text); - } - - /** - * generates a Div, used for a child node - * @param target Div it should be inserted - * @param id ID of the Object it represents - * @param name Name of the Object it represents - * @param outermost if the object is a root node - * @returns generated div - */ - function generateChild(target,id,name,outermost) { - - var c=""; - if(outermost){ - c = "outermost"; - } - - var text="<div class='childWithBorder'>" + - "<div class='child paperEffect "+c+"'>" + - "<div class='headerFont'>"+name+"</div>" + - "<div class='divAroundPcStates'>" + - "<div id = 'div_pc_On_"+id+"' class='divPcOn '>"+0+"</div>" + - "<div id = 'div_pc_Used_"+id+"' class='divPcPcUsed'>"+0+"</div>" + - "<div id = 'div_pc_Off_"+id+"' class='divPcPcOff'>"+0+"</div>" + - "<div id = 'div_pc_Defect_"+id+"' class='divPcPcDefect'>"+0+"</div>" + - "</div>" + - "<div class='aroundCourse'>"+ - "<div id = 'div_course"+id+"'class='courseFont'></div>" + - "<div id = 'div_Time_"+id+"'class='courseFont'></div></div></div></div>"; + function generateChild(target, id, name, outermost) { + + var c = ""; + if (outermost) { + c = "outermost"; + } + + var text = "<div class='childWithBorder'>" + + "<div class='child paperEffect " + c + "'>" + + "<div class='headerFont'>" + name + "</div>" + + "<div class='divAroundPcStates'>" + + "<div id = 'div_pc_On_" + id + "' class='divPcOn '>" + 0 + "</div>" + + "<div id = 'div_pc_Used_" + id + "' class='divPcPcUsed'>" + 0 + "</div>" + + "<div id = 'div_pc_Off_" + id + "' class='divPcPcOff'>" + 0 + "</div>" + + "<div id = 'div_pc_Defect_" + id + "' class='divPcPcDefect'>" + 0 + "</div>" + + "</div>" + + "<div class='aroundCourse'>" + + "<div id = 'div_course" + id + "'class='courseFont'></div>" + + "<div id = 'div_Time_" + id + "'class='courseFont'></div></div></div></div>"; var obj = $(target).append(text); - getConfig((id)); - return obj + getConfig((id)); + return obj } @@ -779,51 +785,51 @@ * @param outermost if the object is a root node * @returns generated div */ - function generateParent(target,id,name,outermost) { - var c=""; - if(outermost){ - c = "outermost"; - } - - var text="<div class='border "+c+"'>" + - "<div class='parent paperEffect'>" + - "<div class='headerFont'>"+name+"</div>" + - "<div id='parent_"+ id +"'</div>"+ - "</div></div>"; + function generateParent(target, id, name, outermost) { + var c = ""; + if (outermost) { + c = "outermost"; + } + + var text = "<div class='border " + c + "'>" + + "<div class='parent paperEffect'>" + + "<div class='headerFont'>" + name + "</div>" + + "<div id='parent_" + id + "'</div>" + + "</div></div>"; return $(target).append(text); } - /** - * Downloads the config of a room - * @param id ID of the room - */ - function getConfig(id) { - $.ajax({ - url: "../../../api.php?do=locationinfo&action=config&id=" + id, - dataType: 'json', - cache: false, - timeout: 30000, - success: function (result) { - if (result.room != null) { - delete result.time; - room = addRoom(id, result.room, result); - } - }, error: function () { - //Todo Error handling: - } - }) - } - - /** - * returns parameter value from the url - * @param sParam - * @returns value for given parameter - */ + /** + * Downloads the config of a room + * @param id ID of the room + */ + function getConfig(id) { + $.ajax({ + url: "../../../api.php?do=locationinfo&action=config&id=" + id, + dataType: 'json', + cache: false, + timeout: 30000, + success: function (result) { + if (result.room != null) { + delete result.time; + room = addRoom(id, result.room, result); + } + }, error: function () { + //Todo Error handling: + } + }) + } + + /** + * returns parameter value from the url + * @param sParam + * @returns value for given parameter + */ var getUrlParameter = function getUrlParameter(sParam) { var sPageURL = decodeURIComponent(window.location.search.substring(1)), - sURLVariables = sPageURL.split('&'), - sParameterName, - i; + sURLVariables = sPageURL.split('&'), + sParameterName, + i; for (i = 0; i < sURLVariables.length; i++) { sParameterName = sURLVariables[i].split('='); @@ -835,42 +841,42 @@ }; - /** - * querys the Calendar data - * @param ids ID'S of rooms to query as string, for e.g.: "5,17,8" or "5" - */ - function queryCalendars(ids) { - var url = "../../../api.php?do=locationinfo&action=calendar&id=" + ids; + /** + * querys the Calendar data + * @param ids ID'S of rooms to query as string, for e.g.: "5,17,8" or "5" + */ + function queryCalendars(ids) { + var url = "../../../api.php?do=locationinfo&action=calendar&id=" + ids; - // Todo reimplement Frontend methode if needed + // Todo reimplement Frontend methode if needed /* if(!(room.config.calendarqueryurl === undefined)) { url = room.config.calendarqueryurl; } */ - $.ajax({ - url: url, - dataType: 'json', - cache: false, - timeout: 30000, - success: function (result) { - UpdateTimeTables(result); + $.ajax({ + url: url, + dataType: 'json', + cache: false, + timeout: 30000, + success: function (result) { + UpdateTimeTables(result); - }, error: function () { + }, error: function () { - } - }); - } + } + }); + } - /** - * used for countdown - * computes the time difference between 2 Date objects - * @param a Date Object - * @param b Date Object + /** + * used for countdown + * computes the time difference between 2 Date objects + * @param a Date Object + * @param b Date Object * @returns time string - */ + */ function GetTimeDiferenceAsString(a, b) { if (a == null || b == null) { return ""; @@ -898,7 +904,7 @@ </script> </head> <body class=""> - <h1>Raum Übersicht</h1> - <div id="main"></div> +<h1>Raum Übersicht</h1> +<div id="main"></div> </body> </html> |