diff --git a/src/index.js b/src/index.js index 6fbfc5b..6af313b 100644 --- a/src/index.js +++ b/src/index.js @@ -21,4 +21,4 @@ waitForKeyElements('.call-history-list call', (element) => { callHistory.showCal const status = new Status() // eslint-disable-next-line no-undef -waitForKeyElements('#status-change', (element) => { status.showStatus(element) }, false) +waitForKeyElements('wc-account-menu', (element) => { status.showStatus(element) }, false) diff --git a/src/status.ts b/src/status.ts index 20f9acb..fcc6217 100644 --- a/src/status.ts +++ b/src/status.ts @@ -18,54 +18,104 @@ export class Status { 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'); + this.checkStatus(); - 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'); + waitForKeyElements("wc-account-menu > div > ul", (element: HTMLElement) => { this.addZcStatusPopup(element) }, true); + } + + private async checkStatus() { + if (this._enabled) { + try { + var response = await axios.get('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.getElementsByTagName("wcavatar")[0] as HTMLAnchorElement).click(); + setTimeout(() => { + var statusId = this._currentStatus ? this._statusOn : this._statusOff; + (document.getElementById(statusId) as HTMLSpanElement).click(); + }, 1000); + } + } + } catch (error) { + console.log(error); + } + setTimeout(() => this.checkStatus(), 30000); } - div.appendChild(button); + } + + private addZcStatusPopup(element: HTMLElement) { + var divider = document.createElement('li'); + divider.classList.add('divider'); + divider.classList.add('dropdown-divider'); + element.appendChild(divider); + + var menu = document.createElement('li'); + element.appendChild(menu); + + var link = document.createElement('a'); + link.id = 'tapi-zc-button'; + link.innerText = 'ZeitConsens'; + link.classList.add('dropdown-item'); + link.classList.add('d-flex'); + link.onclick = () => { + document.getElementById('zc-modal').classList.toggle('show'); + } + menu.appendChild(link); var html = - '
' + - ' ' + - ' ' + - '
' + - '
' + - ' ' + - ' ' + - '
' + - '
' + - ' ' + - ' ' + - '
' + - '
' + - ' ' + ''; + var modal = document.createElement('modal-container'); + modal.id = 'zc-modal'; + modal.classList.add('modal'); + modal.classList.add('fade'); + modal.innerHTML = html; + var body = document.getElementsByTagName('body')[0].appendChild(modal); - 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 btnClose = document.getElementById('zc-btnClose'); + btnClose.onclick = () => { + document.getElementById('zc-modal').classList.toggle('show'); + } var zcUser = document.getElementById('tapi-zc-user') as HTMLInputElement; zcUser.value = this._user; @@ -103,31 +153,5 @@ export class Status { console.log('tapi-zc-off', this._statusOff); this._currentStatus = undefined; } - - this.checkStatus(); - } - - private async checkStatus() { - if (this._enabled) { - try { - var response = await axios.get('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); - } - } - } catch (error) { - console.log(error); - } - setTimeout(() => this.checkStatus(), 30000); - } } }