PolyTools Trade Cost 0.1.1 / src/popup/popup.js
| 1 | /* PolyTools — popup / options: settings + journal launcher (what is shown depends on the product build, src/flavor.js). */ |
| 2 | (function () { |
| 3 | 'use strict'; |
| 4 | const { i18n, flavor } = window.PWL; |
| 5 | const DEFAULTS = { lang: 'auto', panel: true, benchmarkApr: 5, collapsed: false }; |
| 6 | const SITE = 'https://polytools.vip'; |
| 7 | const $ = (id) => document.getElementById(id); |
| 8 | |
| 9 | // product build: Trade Cost has no journal, Journal has no panel settings; each links to the other one |
| 10 | document.title = flavor.name; |
| 11 | $('brand').textContent = flavor.name; |
| 12 | if (!flavor.cost) $('tagline').setAttribute('data-i18n', 'j.title'); |
| 13 | $('journal').hidden = !flavor.journal; |
| 14 | $('costSettings').hidden = !flavor.cost; |
| 15 | const other = flavor.cost && !flavor.journal ? { name: 'PolyTools Journal', path: '/journal/' } |
| 16 | : flavor.journal && !flavor.cost ? { name: 'PolyTools Trade Cost', path: '/trade-cost/' } : null; |
| 17 | |
| 18 | const siteUrl = (path) => SITE + (i18n.lang === 'en' ? '' : '/' + i18n.lang) + path; |
| 19 | |
| 20 | function applyI18n() { |
| 21 | document.documentElement.lang = i18n.lang; |
| 22 | for (const el of document.querySelectorAll('[data-i18n]')) el.textContent = i18n.t(el.getAttribute('data-i18n')); |
| 23 | $('privacyLink').href = siteUrl('/privacy/'); |
| 24 | if (other) { |
| 25 | $('also').hidden = false; |
| 26 | $('alsoLink').textContent = other.name; |
| 27 | $('alsoLink').href = siteUrl(other.path); |
| 28 | } |
| 29 | } |
| 30 | |
| 31 | let savedTimer = null; |
| 32 | function save(patch) { |
| 33 | chrome.storage.sync.set(patch, () => { |
| 34 | $('saved').textContent = i18n.t('popup.saved'); |
| 35 | clearTimeout(savedTimer); |
| 36 | savedTimer = setTimeout(() => { $('saved').textContent = ''; }, 1500); |
| 37 | }); |
| 38 | } |
| 39 | |
| 40 | chrome.storage.sync.get(DEFAULTS, (s) => { |
| 41 | i18n.setLang(s.lang); |
| 42 | applyI18n(); |
| 43 | $('lang').value = s.lang; |
| 44 | $('panel').checked = !!s.panel; |
| 45 | $('benchmark').value = s.benchmarkApr; |
| 46 | }); |
| 47 | |
| 48 | $('lang').addEventListener('change', (e) => { |
| 49 | i18n.setLang(e.target.value); |
| 50 | applyI18n(); |
| 51 | save({ lang: e.target.value }); |
| 52 | }); |
| 53 | $('panel').addEventListener('change', (e) => save({ panel: e.target.checked })); |
| 54 | $('benchmark').addEventListener('change', (e) => { |
| 55 | const v = Math.min(100, Math.max(0, Number(e.target.value) || 0)); |
| 56 | e.target.value = v; |
| 57 | save({ benchmarkApr: v }); |
| 58 | }); |
| 59 | $('journal').addEventListener('click', () => { |
| 60 | chrome.tabs.create({ url: chrome.runtime.getURL('src/journal/journal.html') }); |
| 61 | chrome.tabs.getCurrent((tab) => { if (!tab) window.close(); }); // close only when shown as the toolbar popup |
| 62 | }); |
| 63 | })(); |