gitoria

3.1 KB

1. // login.js — the small bridge between ident's <ident-selector> and gitoria's shell (components/main.hl;
2. // gitoria#14, the same as tickets' login.js). Plain JS because hl:web cannot listen to a custom DOM event:
3. // `ident-login` (event.detail.code, the one-time code) goes into the hidden input #identcode, whose `change`
4. // the shell handles (→ face gitoriaLogin, server-side exchange). The shell keeps the selector element's class
5. // at `in` / `out`; it is mirrored here into the selector's `loggedIn` (false = back to "choose ident").
6. // ident answers the selector only for a REGISTERED origin — the main address. On a repo address the shell gives
7. // the selector the class `onrepo` (server-side, from the request's host) and styles.hl hides it; "Log in with
8. // ident" stays the way in on every address.
9. // BACK TO THE PAGE: the "Log in with ident" click gets `?next=<this page>` in its return URL — a path on the main
10. // address, the full URL on a repo address (project.hl safeNext checks both). At the click, so it is the page the
11. // address bar shows after any hl:web navigation.
12. // RUNS ONCE PER DOCUMENT: hl:web re-creates the header and its <script>s when the login state flips, the
13. // selector element is then a NEW one; listeners sit on `document`, the CURRENT #selector is looked up each
14. // time, and a one-time code is handed to the shell at most once.
15. (() => {
16. if (window.__gitoriaLogin) { window.__gitoriaLogin.sync(); return; }
17. const sync = () => {
18. const sel = document.getElementById('selector');
19. // not upgraded yet: a property set now would shadow the element's own accessor
20. if (!sel || !window.customElements || !customElements.get('ident-selector')) return;
21. const want = sel.classList.contains('in');
22. if (sel.loggedIn !== want) sel.loggedIn = want;
23. };
24. new MutationObserver(sync).observe(document.documentElement, { subtree: true, childList: true, attributes: true, attributeFilter: ['class'] });
25. if (window.customElements) customElements.whenDefined('ident-selector').then(sync);
27. const handed = new Set();
28. document.addEventListener('ident-login', (e) => {
29. const code = e.detail && e.detail.code;
30. const input = document.getElementById('identcode');
31. if (!input || !code || handed.has(code)) return; // a one-time code is exchanged once
32. handed.add(code);
33. input.value = code;
34. input.dispatchEvent(new Event('change', { bubbles: true }));
35. });
36. const withNext = (a) => {
37. try {
38. const u = new URL(a.href);
39. const ret = new URL(u.searchParams.get('return'));
40. const main = ret.host === location.host;
41. const here = main ? location.pathname + location.search : location.href;
42. ret.search = '';
43. if (here !== '/' && here.length <= 500) ret.searchParams.set('next', here);
44. u.searchParams.set('return', ret.href);
45. a.href = u.href;
46. } catch (err) { /* keep the server's href: the login still works, it returns to / */ }
47. };
48. const onButton = (e) => {
49. const a = e.target && e.target.closest && e.target.closest('#loginbutton');
50. if (a) withNext(a);
51. };
52. for (const t of ['click', 'auxclick', 'contextmenu']) document.addEventListener(t, onButton, true);
53. window.__gitoriaLogin = { sync };
54. })();