Backend
- Globale Javascripts

Gobale Javascripts

Für einige Aufgaben werden globale Javascripts zur Verfügung gestellt, damit jedes Backend Theme die Methoden nutzen kann und sie nicht selbst mitbringen muß.

session.js

Damit sich Benutzer nach Ablauf der Sessionzeit neu autorisieren können, ohne dass ihnen Daten verloren gehen, kann ein Login-Formular zur Verfügung gestellt werden, das z.B. als Bootstrap Modal angezeigt wird. (Siehe BackStrap Backend Theme.) Die session.js stellt hierfür einige Funktionen zur Verfügung. Die backend[_body].js des Admin Themes muss dann nur noch folgenden Aufruf beinhalten:

CATSessionSetTimer(CATTimeStringToSecs(<Sekunden>,<Callback>,<Ausgabe-Element>,<CSS-Klasse für Warnung>);

Zusätzlich sollte im Backend Theme der Timer, also die verbleibende Zeit, angezeigt werden. Hier ein Beispiel:

<div id="sessiontimer" class="pull-right text-muted">{translate('Remaining session time')}: <span id="sesstime">{$SESSION_TIME}</span></div>

Die Sessionzeit wird vom Backend automatisch in der Variablen SESSION_TIME zur Verfügung gestellt. (Im Template: {$SESSION_TIME}) Der Wert ist formatiert, z.B.: 00:24:00 für 24 Minuten. Verwendet man also ein Markup wie oben, kann man den aktuellen Wert per JavaScript aus dem HTML-Quellcode der Seite auslesen. Er muss dann nur noch in Sekunden umgerechnet werden. Auch hierfür bringt die session.js eine fertige Funktion mit.

<Sekunden> ⇒ CATTimeStringToSecs($('div#sessiontimer span#sesstime').text())

Der zweite Parameter ist der wichtigste; er beinhaltet den Namen einer Callback-Methode. Diese wird aufgerufen, sobald der Timer auf 0 gesetzt wurde, die Session also abgelaufen ist. Da nicht jedes Backend Theme Bootstrap-basiert sein muss, demnach also auch nicht immer das Bootstrap Modal zur Verfügung steht, muss die Callback-Methode im Admin Theme definiert sein. Ein Beispiel findet sich im BackStrap Theme.

<Callback> ⇒ CATSessionTimedOut

Der dritte Parameter beinhaltet den eindeutigen Selektor des Elements, welches die formatierte Restdauer anzeigt. Im obigen Beispiel ist das der <span> mit der ID "sesstime".

<Ausgabe-Element> ⇒ 'span#sesstime'

Der letzte Parameter ist der Name einer CSS-Klasse, die dem Element 20% vor Ablauf der Sessionzeit hinzugefügt wird. Beispielsweise könnte man die Schriftfarbe auf rot ändern. Standardmäßig wird die Bootstrap-Klasse "bg-danger" verwendet. Bootstrap-basierte Admin Themes können den Parameter also auch weglassen.

<CSS-Klasse für Warnung> ⇒ 'bg-info'

Vollständig sieht der Aufruf im BackStrap Theme also so aus:

CATSessionSetTimer(CATTimeStringToSecs($('div#sessiontimer span#sesstime').text()),CATSessionTimedOut,'span#sesstime');