Status mit ZeitConsens synchronisieren

src/index.js

@@ -18,3 +18,7 @@ waitForKeyElements('call-view', (element) => { callNotification.showCallNotifica
 const callHistory = new CallHistory()
 // eslint-disable-next-line no-undef
 waitForKeyElements('.call-history-list call', (element) => { callHistory.showCallHistory(element) }, false)
+
+const status = new Status()
+// eslint-disable-next-line no-undef
+waitForKeyElements('#status-change', (element) => { status.showStatus(element) }, false)

src/status.ts

@@ -0,0 +1,129 @@
+import './status.css';
+import { axios } from './utils';
+import { ZcStatus } from './zc-status';
+
+declare function waitForKeyElements(selectorOrFunction: any, callback: any, waitOnce: boolean): any;
+
+export class Status {
+  private _user: string;
+  private _enabled = false;
+  private _statusOn = 'menuAvailable';
+  private _statusOff = 'menuAway';
+  private _currentStatus: boolean = undefined;
+
+  public async showStatus(element: HTMLElement) {
+    this._user = await GM.getValue('tapi-zc-user', '');
+    this._enabled = await GM.getValue('tapi-zc-enabled', false);
+    this._statusOn = await GM.getValue('tapi-zc-on', 'menuAvailable');
+    this._statusOff = await GM.getValue('tapi-zc-off', 'menuAvailable');
+    console.log('tapi-zc-user', this._user, 'tapi-zc-enabled', this._enabled, 'tapi-zc-on', this._statusOn, 'tapi-zc-off', this._statusOff);
+
+    var div = document.createElement('div');
+    div.classList.add('tapi-dropdown');
+
+    var button = document.createElement('button');
+    button.id = 'tapi-zc-button';
+    button.classList.add('btn');
+    button.classList.add('btn-default');
+    button.innerText = 'ZeitConsens';
+    button.onclick = () => {
+      document.getElementById('tapi-zc-dropdown').classList.toggle('show');
+    }
+    div.appendChild(button);
+
+    var html =
+      '<div class="form-group">' +
+      '  <label for="tapi-zc-user">Username</label>' +
+      '  <input type="text" class="form-control" name="tapi-zc-user" id="tapi-zc-user">' +
+      '</div>' +
+      '<div class="form-group">' +
+      '  <label for="tapi-zc-on">Signed in</label>' +
+      '  <select id="tapi-zc-on" class="form-control">' +
+      '    <option value="menuAvailable">Available</option>' +
+      '    <option value="menuOutofoffice">Do Not Disturb</option>' +
+      '    <option value="menuCustom1">Verfügbar DW</option>' +
+      '  </select>' +
+      '</div>' +
+      '<div class="form-group">' +
+      '  <label for="tapi-zc-off">Signed in</label>' +
+      '  <select id="tapi-zc-off" class="form-control">' +
+      '    <option value="menuAway">Away</option>' +
+      '    <option value="menuOutofoffice">Do Not Disturb</option>' +
+      '  </select>' +
+      '</div>' +
+      '<div class="checkbox">' +
+      '  <label class="i-checks" for="tapi-zc-enabled">' +
+      '    <input type="checkbox" id="tapi-zc-enabled">' +
+      '    <i></i><span>Enabled</span>' +
+      '</label>'
+    '</div>';
+
+    var dropdown = document.createElement('div');
+    dropdown.classList.add('tapi-dropdown-content');
+    dropdown.classList.add('panel-body');
+    dropdown.id = 'tapi-zc-dropdown';
+    dropdown.innerHTML = html;
+    div.appendChild(dropdown);
+
+    element.insertBefore(div, element.firstChild);
+
+    var zcUser = document.getElementById('tapi-zc-user') as HTMLInputElement;
+    zcUser.value = this._user;
+    zcUser.onchange = () => {
+      this._user = zcUser.value;
+      GM.setValue('tapi-zc-user', this._user);
+      console.log('tapi-zc-user', this._user);
+      this._currentStatus = undefined;
+    }
+
+    var zcEnabled = document.getElementById('tapi-zc-enabled') as HTMLInputElement;
+    zcEnabled.checked = this._enabled;
+    zcEnabled.onchange = () => {
+      this._enabled = zcEnabled.checked;
+      GM.setValue('tapi-zc-enabled', this._enabled);
+      console.log('tapi-zc-enabled', this._enabled);
+      this._currentStatus = undefined;
+      this.checkStatus();
+    }
+
+    var zcOn = document.getElementById('tapi-zc-on') as HTMLSelectElement;
+    zcOn.value = this._statusOn;
+    zcOn.onchange = () => {
+      this._statusOn = zcOn.value;
+      GM.setValue('tapi-zc-on', this._statusOn);
+      console.log('tapi-zc-on', this._statusOn);
+      this._currentStatus = undefined;
+    }
+
+    var zcOff = document.getElementById('tapi-zc-off') as HTMLSelectElement;
+    zcOff.value = this._statusOff;
+    zcOff.onchange = () => {
+      this._statusOff = zcOff.value;
+      GM.setValue('tapi-zc-off', this._statusOff);
+      console.log('tapi-zc-off', this._statusOff);
+      this._currentStatus = undefined;
+    }
+
+    this.checkStatus();
+  }
+
+  private async checkStatus() {
+    if (this._enabled) {
+      var response = await axios.get<ZcStatus>('http://cpatapi.cpsrvweb2016.cp-austria.at/availability/' + encodeURIComponent(this._user));
+
+      if (response.status == 200) {
+        var status = response.data;
+        if (this._currentStatus !== status.loggedIn) {
+          this._currentStatus = status.loggedIn;
+          console.log('New status, loggedIn', this._currentStatus);
+          (document.getElementsByClassName("current-status")[0] as HTMLAnchorElement).click();
+          setTimeout(() => {
+            var statusId = this._currentStatus ? this._statusOn : this._statusOff;
+            (document.getElementById(statusId) as HTMLAnchorElement).click();
+          }, 1000);
+        }
+      }
+      setTimeout(() => this.checkStatus(), 10000);
+    }
+  }
+}

src/zc-status.ts

@@ -0,0 +1,4 @@
+export class ZcStatus {
+  public user: string;
+  public loggedIn: boolean;
+}