unicode-input-toolconverter 0.2.0

package/browser_action/index.js

@@ -0,0 +1,95 @@
+import {i18n, setJSONExtra} from '../vendor/intl-dom/dist/index.esm.js';
+// Currently not bundling json-6
+import jsonExtra from '../vendor/json-6/dist/index.mjs';
+
+import {makeTabBox} from './templatesElementCustomization/widgets.js';
+import {code, link} from './templateUtils/elements.js';
+
+import {setPrefDefaultVars} from
+  './preferences/prefDefaults.js';
+import {getUnicodeConverter} from './unicode/UnicodeConverter.js';
+import unicodecharref, {shareVars as shareVarsUresults} from
+  './unicodecharref.js';
+import indexTemplate from './templates/index.js';
+
+import setupServiceWorker from './utils/setupServiceWorker.js';
+
+import activateCallback from
+  './service-worker/sw-activateCallback.js';
+
+import {
+  shareVars as shareVarsEntity, setupEntityEvents
+} from './entityBehaviors.js';
+import {
+  shareVars as shareVarsCharrefConverter
+} from './charrefConverters.js';
+import characterSelection from './characterSelection.js';
+// import {setupEncodingEvents} from './encodingBehaviors.js';
+
+setJSONExtra(jsonExtra);
+
+// SETUP
+
+// Todo: Support hash searchParams / streamline with `pushState`
+const {searchParams} = new URL(location);
+
+const lang = searchParams.get('lang');
+
+// ['sv-SE']; // ['pt-BR']; // ['hu-HU'];
+const locales = [...new Set([
+  // Ensure there is at least one working language!
+  ...(lang ? [lang] : [...navigator.languages]),
+  'en-US'
+])];
+
+// eslint-disable-next-line unicorn/prefer-top-level-await -- No iife export
+(async () => {
+const _ = await i18n({
+  locales, defaults: false, localesBasePath: '../',
+  substitutions: {code, link}
+});
+
+if (searchParams.get('serviceWorker')) {
+  // Doesn't work in FF as SW using ESM so putting behind switch for now
+  await setupServiceWorker();
+} else if (searchParams.get('characterDescriptions')) {
+  const namespace = 'unicode-input-toolconverter';
+  await activateCallback({
+    namespace
+  });
+}
+
+setPrefDefaultVars({_});
+const charrefunicodeConverter = new (getUnicodeConverter())({_});
+shareVarsUresults({_, charrefunicodeConverter});
+shareVarsEntity({charrefunicodeConverter});
+shareVarsCharrefConverter({charrefunicodeConverter});
+
+// MAIN TEMPLATE
+// Slows down loading so putting behind switch
+const fonts = searchParams.get('fonts')
+  ? await (await fetch('/fonts')).json()
+  : [];
+
+indexTemplate({_, fonts});
+
+// ADD GENERAL BEHAVIORS
+makeTabBox('.tabbox');
+
+// TAB-SPECIFIC
+await characterSelection({
+  _, charrefunicodeConverter
+});
+// setupEncodingEvents({_});
+setupEntityEvents();
+
+// Todo: Move functionality to relevant files
+await unicodecharref.initialize({
+  customProtocol: searchParams.get('customProtocol'),
+  options: searchParams.get('options'),
+  // Todo: Add-ons API for conversions
+  // convert: window.getSelection().toString()
+  convert: searchParams.get('convert'),
+  targetid: searchParams.get('targetid')
+});
+})();

package/browser_action/preferences/prefDefaults.js

@@ -0,0 +1,52 @@
+// hexstyleLwr:  return true; // Could use but better not to
+//   change for XML-compatibility
+
+import {SimplePrefs} from '../../vendor/simple-prefs/dist/index.esm.js';
+
+let _;
+export const setPrefDefaultVars = ({_: __}) => {
+  _ = __;
+};
+
+export const getUnicodeDefaults = () => {
+  return new SimplePrefs({
+    namespace: 'unicode-input-toolconverter-',
+    defaults: getPrefDefaults()
+  }).bind();
+};
+
+export const getPrefDefaults = () => ({
+  hexLettersUpper: false,
+  onlyentsyes: false,
+  asciiLt128: false,
+  startCharInMiddleOfChart: false,
+  multiline: false,
+  xhtmlentmode: false,
+  showImg: false,
+  ampspace: false,
+  // showComplexWindow: false,
+  hexyes: true,
+  decyes: true,
+  unicodeyes: true,
+  buttonyes: true,
+  entyes: true,
+  xmlentkeep: true,
+  ampkeep: true,
+  showAllDetailedView: true,
+  showAllDetailedCJKView: true,
+  cssUnambiguous: true,
+  appendtohtmldtd: true,
+  outerWidth: 0,
+  fontsizetextbox: 13,
+  tblrowsset: 4,
+  tblcolsset: 3,
+  tblfontsize: 13,
+  DTDtextbox: '',
+  font: '',
+  cssWhitespace: ' ',
+  initialTab: 'charts',
+  defaultStartCharCode: _('startCharCode').codePointAt() - 1, // 'a'
+  currentStartCharCode: _('startCharCode').codePointAt() - 1, // 'a'
+  lang: _('langCode'), // 'en-US'
+  dropdownArr: []
+});

package/browser_action/service-worker/sw-activateCallback.js

@@ -0,0 +1,53 @@
+import {UnicodeDatabase} from '../unicode/charrefunicodeDb.js';
+import {getText} from '../utils/FetchUtils.js';
+import semicolonSeparatedToArray from '../utils/semicolonSeparatedToArray.js';
+
+/**
+ * @param {string} db
+ * @returns {Promise<void>}
+ */
+function deleteDatabase (db) {
+  // eslint-disable-next-line promise/avoid-new -- No API
+  return new Promise((resolve) => {
+    const req = indexedDB.deleteDatabase(db);
+    req.addEventListener('success', () => {
+      resolve();
+    });
+    req.addEventListener(
+      'error',
+      /* istanbul ignore next -- Just for protection */
+      () => {
+        resolve();
+      }
+    );
+    req.addEventListener(
+      'blocked',
+      /* istanbul ignore next -- Just for protection */
+      () => {
+        resolve();
+      }
+    );
+  });
+}
+
+/**
+ * @param {PlainObject} cfg
+ * @param {string} cfg.namespace
+ * @returns {Promise<void>}
+ */
+async function activateCallback ({namespace /* , log */}) {
+  await deleteDatabase(namespace); // Chrome sometimes doesn't complete
+  const charrefunicodeDb = new UnicodeDatabase({
+    name: namespace,
+    // We don't peg to package major version as database version may vary
+    //  independently
+    version: 1
+  });
+  const unicodeData = (await getText('/download/UCD/UnicodeData.txt')).trim();
+  const updateUnicodeData = semicolonSeparatedToArray(unicodeData);
+  await charrefunicodeDb.connect({
+    updateUnicodeData
+  });
+}
+
+export default activateCallback;

package/browser_action/service-worker/sw-locales.json

@@ -0,0 +1,6 @@
+[
+  "/_locales/en-US/messages.json",
+  "/_locales/hu-HU/messages.json",
+  "/_locales/pt-BR/messages.json",
+  "/_locales/sv-SE/messages.json"
+]

package/browser_action/service-worker/sw-resources.json

@@ -0,0 +1,73 @@
+[
+  "/browser_action/characterSelection.js",
+  "/browser_action/charrefConverters.js",
+  "/browser_action/chartBuild.js",
+  "/browser_action/encodingBehaviors.js",
+  "/browser_action/encodings.js",
+  "/browser_action/entities.js",
+  "/browser_action/entityBehaviors.js",
+  "/browser_action/index.html",
+  "/browser_action/index.iife.min.js",
+  "/browser_action/index.js",
+  "/browser_action/preferences/prefDefaults.js",
+  "/browser_action/styles/unicode-dialog.css",
+  "/browser_action/templateUtils/elements.js",
+  "/browser_action/templateUtils/fill.js",
+  "/browser_action/templateUtils/validation.js",
+  "/browser_action/templates/chartBuild.js",
+  "/browser_action/templates/index.js",
+  "/browser_action/templatesElementCustomization/widgets.js",
+  "/browser_action/unicode/UnicodeConverter.js",
+  "/browser_action/unicode/charrefunicodeDb.js",
+  "/browser_action/unicode/getScriptInfoForCodePoint.js",
+  "/browser_action/unicode/hangul.js",
+  "/browser_action/unicode/parseUnihanFromTextFileStrings.js",
+  "/browser_action/unicode/unicodeScripts.js",
+  "/browser_action/unicode/unihan.js",
+  "/browser_action/unicode/unihanDbPopulate.js",
+  "/browser_action/unicodecharref.js",
+  "/browser_action/utils/DOMUtils.js",
+  "/browser_action/utils/TextUtils.js",
+  "/browser_action/utils/TypedArrayUtils.js",
+  "/browser_action/utils/setupServiceWorker.js",
+  "/download/entities/html5-uppercase.ent",
+  "/download/entities/htmlmathml-f.ent",
+  "/download/entities/isoamsa.ent",
+  "/download/entities/isoamsb.ent",
+  "/download/entities/isoamsc.ent",
+  "/download/entities/isoamsn.ent",
+  "/download/entities/isoamso.ent",
+  "/download/entities/isoamsr.ent",
+  "/download/entities/isobox.ent",
+  "/download/entities/isocyr1.ent",
+  "/download/entities/isocyr2.ent",
+  "/download/entities/isodia.ent",
+  "/download/entities/isogrk1.ent",
+  "/download/entities/isogrk2.ent",
+  "/download/entities/isogrk3.ent",
+  "/download/entities/isogrk4.ent",
+  "/download/entities/isolat1.ent",
+  "/download/entities/isolat2.ent",
+  "/download/entities/isomfrk.ent",
+  "/download/entities/isomopf.ent",
+  "/download/entities/isomscr.ent",
+  "/download/entities/isonum.ent",
+  "/download/entities/isopub.ent",
+  "/download/entities/isotech.ent",
+  "/download/entities/mmlalias.ent",
+  "/download/entities/mmlextra.ent",
+  "/download/entities/predefined.ent",
+  "/download/entities/w3centities-f.ent",
+  "/download/entities/xhtml1-lat1.ent",
+  "/download/entities/xhtml1-special.ent",
+  "/download/entities/xhtml1-symbol.ent",
+  "/icons/openWindow24.png",
+  "/vendor/fflate/esm/browser.js",
+  "/vendor/intl-dom/dist/index.esm.js",
+  "/vendor/jamilih/dist/jml-es.js",
+  "/vendor/jquery/dist/jquery.js",
+  "/vendor/json-6/dist/index.mjs",
+  "/vendor/miller-columns/dist/index-es.min.js",
+  "/vendor/miller-columns/miller-columns.css",
+  "/vendor/simple-prefs/dist/index.esm.js"
+]

package/browser_action/service-worker/sw-unicode-data.json

@@ -0,0 +1,3 @@
+[
+  "/download/UCD/UnicodeData.txt"
+]

package/browser_action/styles/unicode-dialog.css

@@ -0,0 +1,391 @@
+/**
+ * @copyright 2007-2018 Brett Zamir
+
+This file is part of Unicode Input Tool/Converter.
+
+Unicode Input Tool/Converter is free software: you can redistribute it and/or modify
+it under the terms of the GNU Lesser General Public License as published by
+the Free Software Foundation, either version 3 of the License, or
+(at your option) any later version.
+
+Unicode Input Tool/Converter is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+GNU Lesser General Public License for more details.
+
+You should have received a copy of the GNU Lesser General Public License
+along with Unicode Input Tool/Converter.  If not, see <http://www.gnu.org/licenses/>.
+*/
+
+/*
+Find and load font(s) to capture as many as possible by default
+#tableholder {
+    font-family: 'Arial Unicode MS';
+}
+*/
+
+.searchBox {
+  min-height: 20px;
+}
+#rowsset, #colsset {
+  max-width: 50px;
+}
+#clearoutput {
+  margin-top: 2em;
+  height: 50px;
+  width: 50px;
+}
+#insertText {
+  height: 70px;
+}
+#insertText, #displayUnicodeDesc {
+  width: 400px;
+}
+.entity {
+  background-color: yellow;
+}
+/*
+.leftlabel {
+  float:left;
+  width: 15%;
+}
+#displayUnicodeDesc {
+  float:left;
+}
+*/
+a.text-link {
+  color: blue;
+  text-decoration: underline;
+}
+
+table.unicodetablecell {
+  border-collapse: collapse;
+  min-width: 500px;
+  width: 500px;
+  max-width: 500px;
+  /*
+  overflow: auto;
+  min-height: 300px;
+  height: 300px;
+  max-height: 300px;
+  */
+}
+td.unicodetablecell {
+  border-style: inset;
+  overflow: auto;
+  max-height: 20px !important;
+  height:20px !important;
+  min-height:20px !important;
+}
+.outputcopybutton {
+  width: 100px;
+}
+.fontsize, .charthbox, .dtdbutton {
+  display: inline; /* Doesn't seem to work on Mac at least */
+}
+.dtdbutton {
+  width: 100px;
+  padding-bottom: 7px;
+}
+#DTDtextbox {
+  width: 50%;
+  height: 300px;
+  margin-right: 10px;
+}
+.centered {
+  text-align: center;
+}
+button.reconvert {
+  color: black;
+  margin: 2px;
+}
+.buttonactive {
+  color: red;
+}
+/* Since the dialogheader doesn't seem to work on the Mac (and since I may switch away in the future away from a "dialog" window proper), I've changed it to a description tag with a "dialogheader" class and styled it similarly */
+.dialogheader {
+  text-align: center;
+  font-size: large;
+  background-color: aqua;
+  margin-top: 10px;
+  margin-bottom: 10px;
+  padding-top: 10px;
+  padding-bottom: 10px;
+}
+.aboutdescription {
+  display: block;
+  margin-bottom: 20px;
+  text-indent: 20px;
+}
+.notesdescription, .usage_notesdescription {
+  display: block;
+  margin-bottom: 20px;
+  text-indent: 20px;
+}
+.chartLayout {
+  margin-bottom: 10px;
+}
+#convertEncoding {
+  margin-top: 10px;
+}
+#convertFromEncoding {
+  margin-bottom: 10px;
+}
+/*
+.aboutdescription, .prefdescription, .conversionhbox {
+}
+*/
+.indentedradio {
+  margin-left: 70px;
+}
+.firstbox {
+  margin-top: 30px;
+}
+.chartBox {
+  width: 50%;
+}
+#DownloadButtonBox, #DownloadProgressBox, #UnihanInstalled {
+  text-align: center;
+}
+#DownloadButtonBox > div {
+  margin-bottom: 3px;
+}
+#resetdefaultbutton {
+  margin-top: 20px;
+}
+radiogroup {
+  border-left-style: solid;
+  border-left-width: 1px;
+  border-right-style: solid;
+  border-right-width: 1px;
+}
+#outputButtons {
+  margin-top: 5px;
+}
+.boxed {
+  border-style: solid;
+  border-width: 1px;
+  padding: 5px;
+}
+.boxed, .boxedbottom {
+  padding: 5px;
+  border-bottom-style: solid;
+  border-bottom-width: 1px;
+  border-left-style: solid;
+  border-left-width: 1px;
+  border-right-style: solid;
+  border-right-width: 1px;
+}
+
+.detailedViewContainer {
+  overflow: auto;
+  height: 550px;
+}
+
+/* .detailedView, .detailedCJKView {
+  overflow: auto;
+  height: 20px;
+} */
+.detailedView > .description.heading, .detailedCJKView > .description.heading  {
+  display: block;
+}
+
+.heading {
+  font-weight: bold;
+}
+
+#viewTabs {
+  overflow: auto;
+  min-height: 20px;
+}
+#searchGrid {
+  /* Makes longer (along with change below), but no dropmarkers  overflow-y:auto;max-height:180px;width:400px;overflow-x:hidden;*/
+  overflow: auto;
+  max-width: 400px;
+  width: 400px;
+}
+#searchGridCJK {
+  overflow: auto;
+  min-width: 330px;
+}
+
+/*
+.searchMenu {
+  /* -moz-box-flex: 1; *
+}
+*/
+
+#chart_selectchar_persist_vbox {
+  margin-right: 10px;
+  /* max-height: 630px; */
+}
+#chart_selectchar_persist {
+  overflow: auto;
+  margin-top: 10px;
+  min-height: 20px;
+}
+.miller-columns {
+  display: none;
+  overflow: hidden !important;
+}
+
+#chart_layout_persist {
+  overflow: auto;
+  min-height: 20px;
+}
+#charts {
+  /* Make this bigger than rest of tabbox */
+  min-width: 1200px;
+}
+
+#toconvert_persist {
+  margin-top: 10px;
+}
+.noteDescriptionBox {
+  overflow: auto;
+  width: 50%;
+  padding-bottom: 20px;
+  padding-right: 20px;
+  padding-left: 20px;
+}
+.convertBox {
+  width: 100%;
+  height: 200px;
+}
+.conversionSection {
+  width: 50%;
+}
+#conversion_buttons_persist {
+  margin-right: 10px;
+}
+
+#tabbox {
+  overflow: auto;
+  /* max-width: 1050px;
+  max-height: 710px; */
+}
+#chartcontent {
+  overflow: auto;
+  min-width: 500px;
+}
+#tableholder {
+  overflow: auto;
+  min-height: 20px;
+}
+#displayUnicodeDescContainer h3, #displayUnihanArea h3 {
+  /* Override Chrome default styling of 1em */
+  margin-block-start: 5px;
+  margin-block-end: 5px;
+}
+.displayUnicodeDescContainer {
+  margin-bottom: 10px;
+}
+.detailedViewRows, .detailedCJKViewRows {
+  min-height: 150px;
+}
+
+#unicodeDescArea {
+  overflow: auto;
+}
+#displayUnihanArea {
+  overflow: auto;
+}
+#displayUnicodeDesc2, #displayUnicodeDescUnihan {
+  width: 480px;
+  max-width: 500px;
+  min-width: 480px;
+}
+
+#conversion_buttons_persist {
+  min-width: 20px;
+  overflow: auto;
+}
+
+#unicodeTabBox > .tabs > .tab {
+  width: 100px;
+  padding: 6px;
+  border-radius: 5px 5px;
+}
+#tabboxSearch > .tabs > .tab {
+  width: 100px;
+  padding: 6px;
+  border-radius: 5px 5px;
+}
+#viewTabs > .tabs > .tab {
+  width: 150px;
+  height: 1em;
+  padding: 6px;
+  border-radius: 5px 5px;
+}
+#viewTabs > .tabs {
+  margin-top: 10px;
+  margin-bottom: 10px;
+}
+
+.tab {
+  float: left;
+  /* Although h1 for accessibility, reduce size */
+  font-weight: normal;
+  font-size: inherit !important;
+}
+.tab[data-selected] {
+  border-collapse: collapse;
+  border: black outset 1px;
+  background-color: lightblue;
+}
+.tab[data-selected]:hover {
+  background-color: blue;
+  color: white;
+}
+.tab:not([data-selected]) {
+  border-collapse: collapse;
+  border: black inset 1px;
+  background-color: lightgray;
+}
+.tab:not([data-selected]):hover {
+  background-color: blue;
+  color: white;
+}
+.tabpanel:not([data-selected]) {
+  display: none;
+}
+
+code {
+  border: 1px dotted black;
+  background-color: lightgray;
+}
+
+.vbox {
+  display: flex;
+  flex-direction: column;
+}
+.hbox {
+  display: flex;
+  flex-direction: row;
+}
+
+#chart_selectchar_persist_vbox > fieldset {
+  display: flex;
+  flex-direction: column;
+}
+
+#chart_selectchar_persist_vbox .hbox {
+  display: flex;
+}
+
+#chart_selectchar_persist_vbox .hbox > div {
+  flex: 1;
+}
+
+#chart_selectchar_persist_vbox .hbox > input {
+  flex: 1;
+}
+
+/* Odd behavior whereby hidden doesn't work with display: flex */
+[hidden] {
+  display:none;
+}
+
+#insertEntityFile {
+  width: 200px;
+}

package/browser_action/templateUtils/elements.js

@@ -0,0 +1,12 @@
+import {jml} from '../../vendor/jamilih/dist/jml-es.js';
+
+export const code = function ({arg}) {
+  return jml('code', [arg]);
+};
+export const link = function ({arg}) {
+  // Todo: Could parse arg for link different from text
+  return jml('a', {
+    href: arg,
+    target: '_blank'
+  }, [arg]);
+};

package/browser_action/templateUtils/fill.js

@@ -0,0 +1,3 @@
+export const fill = (items, filler = null) => {
+  return Array.from({length: items}).fill(filler);
+};

package/browser_action/templateUtils/validation.js

@@ -0,0 +1,6 @@
+export const safeLink = function (link) {
+  return (/https?:/u).test(link)
+    ? link
+    /* istanbul ignore next -- All links should be safe */
+    : '';
+};