Mercurial > xmpp-account-manager
view client.js @ 63:ee1df80a1715 default tip
Nicer-looking input form
author | mathieui |
---|---|
date | Sun, 24 May 2020 14:19:29 +0200 |
parents | 6d861d881b96 |
children |
line wrap: on
line source
// SPDX-License-Identifier: AGPL-3.0-only /* * Copyright © 2018-2020 Emmanuel Gil Peyrot <linkmauve@linkmauve.fr> * Copyright © 2020 Mathieu Pasquet <mathieui@mathieui.net> * * Released under GNU AGPL v3 only, read the file 'LICENSE' for more information. */ 'use strict'; document.addEventListener('DOMContentLoaded', function () { let connection = null; const jid_element = document.getElementById('jid'); const pass_element = document.getElementById('pass'); const connect_button = document.getElementById('connect'); const spinner_img = document.getElementById('connect-spinner'); const connected_div = document.getElementById('connected'); const avatar_img = document.getElementById('avatar'); const tabs = ['profile', 'mam', 'pep', 'account']; function onHashChange() { const hash = location.hash.substr(1); if (!tabs.includes(hash)) return; for (let tab of tabs) { const tab_name = 'tab-' + tab; const tab_element = document.getElementById(tab_name); if (tab == hash) { tab_element.classList.add('active') const content_elements = document.getElementsByClassName(tab_name); for (let element of content_elements) element.hidden = false; } else { tab_element.classList.remove('active') const content_elements = document.getElementsByClassName(tab_name); for (let element of content_elements) element.hidden = true; } } } onHashChange(); window.addEventListener('hashchange', onHashChange); function rawInput(data) { console.log('RECV', data); } function rawOutput(data) { console.log('SENT', data); } connect_button.addEventListener('click', function (evt) { if (!connect_button.classList.contains('disconnect')) { const jid = jid_element.value; getBOSHService(jid).then((bosh_service) => { connection = new Strophe.Connection(bosh_service); connection.rawInput = rawInput; connection.rawOutput = rawOutput; connection.connect(jid, pass_element.value, onConnect); }); } else if (connection != null) { connection.disconnect(); } evt.preventDefault(); }); function getBOSHService(jid) { return new Promise((resolve, reject) => { const [nodepart, domainpart] = jid.split('@', 2); const url = 'https://' + domainpart + '/.well-known/host-meta'; const xhr = new XMLHttpRequest(); xhr.onload = function (evt) { const xml = evt.target.responseXML; const links = parseXPath(xml, './xrd:XRD/xrd:Link', XPathResult.ORDERED_NODE_ITERATOR_TYPE); let bosh_service = null; let ws_service = null; while (true) { const link = links.iterateNext(); if (!link) break; const rel = link.getAttributeNS(null, 'rel'); if (rel == 'urn:xmpp:alt-connections:xbosh') bosh_service = link.getAttributeNS(null, 'href'); else if (rel == 'urn:xmpp:alt-connections:websocket') ws_service = link.getAttributeNS(null, 'href'); } console.log('bosh_service', bosh_service); console.log('ws_service', ws_service); resolve(ws_service || bosh_service); }; xhr.open('GET', url); xhr.send(); }); } function onConnect(status) { if (status == Strophe.Status.CONNECTING) { console.log('Strophe is connecting.'); connect_button.value = `{% trans 'Log out' %}`; connect_button.classList.add('disconnect'); jid_element.disabled = true; pass_element.disabled = true; displaySpinner(spinner_img); } else if (status == Strophe.Status.CONNFAIL) { console.log('Strophe failed to connect.'); onDisconnected(); } else if (status == Strophe.Status.DISCONNECTING) { console.log('Strophe is disconnecting.'); displaySpinner(spinner_img); } else if (status == Strophe.Status.DISCONNECTED) { console.log('Strophe is disconnected.'); onDisconnected(); } else if (status == Strophe.Status.CONNECTED) { console.log('Strophe is connected.'); onConnected(); } } function onConnected() { const connection_form = document.getElementById('connection'); connection_form.classList.remove('initial-login'); const new_node = document.createElementNS('http://www.w3.org/1999/xhtml', 'span'); const parent_node = connect.parentNode; const text = document.createTextNode(`{% trans 'Logged in as ${connection.authzid} ' %}`); new_node.appendChild(text); parent_node.insertBefore(new_node, connect); jid_element.hidden = true; pass_element.hidden = true; connected_div.hidden = false; hideSpinner(spinner_img); initRoster(connection); initPEP(connection); initNickname(connection); initAvatar(connection); initVCard(connection); initMAM(connection); } function onDisconnected() { connect_button.value = `{% trans 'Log in' %}`; connect_button.classList.remove('disconnect'); jid_element.hidden = false; jid_element.disabled = false; pass_element.hidden = false; pass_element.disabled = false; hideSpinner(spinner_img); connected_div.hidden = true; let table = document.getElementById('roster-table'); while (table.hasChildNodes()) { table.removeChild(table.lastChild); } table = document.getElementById('pep-table'); while (table.hasChildNodes()) { table.removeChild(table.lastChild); } location.reload(); } });