diff options
| -rw-r--r-- | ext/bg/js/backend.js | 5 | ||||
| -rw-r--r-- | ext/bg/js/query-parser-generator.js | 96 | ||||
| -rw-r--r-- | ext/bg/js/query-parser.js | 13 | ||||
| -rw-r--r-- | ext/bg/query-parser-templates.html | 11 | ||||
| -rw-r--r-- | ext/mixed/js/api.js | 4 | ||||
| -rw-r--r-- | ext/mixed/js/display.js | 2 | 
6 files changed, 54 insertions, 77 deletions
| diff --git a/ext/bg/js/backend.js b/ext/bg/js/backend.js index 5462d4c9..fe9c9c76 100644 --- a/ext/bg/js/backend.js +++ b/ext/bg/js/backend.js @@ -100,7 +100,6 @@ class Backend {              ['clipboardGet',                 {async: true,  contentScript: true,  handler: this._onApiClipboardGet.bind(this)}],              ['clipboardGetImage',            {async: true,  contentScript: true,  handler: this._onApiClipboardImageGet.bind(this)}],              ['getDisplayTemplatesHtml',      {async: true,  contentScript: true,  handler: this._onApiGetDisplayTemplatesHtml.bind(this)}], -            ['getQueryParserTemplatesHtml',  {async: true,  contentScript: true,  handler: this._onApiGetQueryParserTemplatesHtml.bind(this)}],              ['getZoom',                      {async: true,  contentScript: true,  handler: this._onApiGetZoom.bind(this)}],              ['getDefaultAnkiFieldTemplates', {async: false, contentScript: true,  handler: this._onApiGetDefaultAnkiFieldTemplates.bind(this)}],              ['getDictionaryInfo',            {async: true,  contentScript: false, handler: this._onApiGetDictionaryInfo.bind(this)}], @@ -594,10 +593,6 @@ class Backend {          return await this._fetchAsset('/mixed/display-templates.html');      } -    async _onApiGetQueryParserTemplatesHtml() { -        return await this._fetchAsset('/bg/query-parser-templates.html'); -    } -      _onApiGetZoom(params, sender) {          if (!sender || !sender.tab) {              return Promise.reject(new Error('Invalid tab')); diff --git a/ext/bg/js/query-parser-generator.js b/ext/bg/js/query-parser-generator.js index 3f49184b..d53183ba 100644 --- a/ext/bg/js/query-parser-generator.js +++ b/ext/bg/js/query-parser-generator.js @@ -15,76 +15,78 @@   * along with this program.  If not, see <https://www.gnu.org/licenses/>.   */ -/* global - * HtmlTemplateCollection - * api - */ -  class QueryParserGenerator { -    constructor() { -        this._templates = null; -    } - -    async prepare() { -        const html = await api.getQueryParserTemplatesHtml(); -        this._templates = new HtmlTemplateCollection(html); -    } - -    createParseResult(terms, preview=false) { +    createParseResult(terms, preview) { +        const type = preview ? 'preview' : 'normal';          const fragment = document.createDocumentFragment();          for (const term of terms) { -            const termContainer = this._templates.instantiate(preview ? 'term-preview' : 'term'); +            const termNode = document.createElement('span'); +            termNode.className = 'query-parser-term'; +            termNode.dataset.type = type;              for (const segment of term) {                  if (!segment.text.trim()) { continue; }                  if (!segment.reading.trim()) { -                    termContainer.appendChild(this.createSegmentText(segment.text)); +                    this._addSegmentText(segment.text, termNode);                  } else { -                    termContainer.appendChild(this.createSegment(segment)); +                    termNode.appendChild(this._createSegment(segment));                  }              } -            fragment.appendChild(termContainer); -        } -        return fragment; -    } - -    createSegment(segment) { -        const segmentContainer = this._templates.instantiate('segment'); -        const segmentTextContainer = segmentContainer.querySelector('.query-parser-segment-text'); -        const segmentReadingContainer = segmentContainer.querySelector('.query-parser-segment-reading'); -        segmentTextContainer.appendChild(this.createSegmentText(segment.text)); -        segmentReadingContainer.textContent = segment.reading; -        return segmentContainer; -    } - -    createSegmentText(text) { -        const fragment = document.createDocumentFragment(); -        for (const chr of text) { -            const charContainer = this._templates.instantiate('char'); -            charContainer.textContent = chr; -            fragment.appendChild(charContainer); +            fragment.appendChild(termNode);          }          return fragment;      }      createParserSelect(parseResults, selectedParser) { -        const selectContainer = this._templates.instantiate('select'); +        const select = document.createElement('select'); +        select.className = 'query-parser-select form-control';          for (const parseResult of parseResults) { -            const optionContainer = this._templates.instantiate('select-option'); -            optionContainer.value = parseResult.id; +            const option = document.createElement('option'); +            option.className = 'query-parser-select-option'; +            option.value = parseResult.id;              switch (parseResult.source) {                  case 'scanning-parser': -                    optionContainer.textContent = 'Scanning parser'; +                    option.textContent = 'Scanning parser';                      break;                  case 'mecab': -                    optionContainer.textContent = `MeCab: ${parseResult.dictionary}`; +                    option.textContent = `MeCab: ${parseResult.dictionary}`;                      break;                  default: -                    optionContainer.textContent = 'Unrecognized dictionary'; +                    option.textContent = 'Unrecognized dictionary';                      break;              } -            optionContainer.defaultSelected = selectedParser === parseResult.id; -            selectContainer.appendChild(optionContainer); +            option.defaultSelected = selectedParser === parseResult.id; +            select.appendChild(option); +        } +        return select; +    } + +    // Private + +    _createSegment(segment) { +        const segmentNode = document.createElement('ruby'); +        segmentNode.className = 'query-parser-segment'; + +        const textNode = document.createElement('span'); +        textNode.className = 'query-parser-segment-text'; + +        const readingNode = document.createElement('rt'); +        readingNode.className = 'query-parser-segment-reading'; + +        segmentNode.appendChild(textNode); +        segmentNode.appendChild(readingNode); + +        this._addSegmentText(segment.text, textNode); +        readingNode.textContent = segment.reading; + +        return segmentNode; +    } + +    _addSegmentText(text, container) { +        for (const character of text) { +            const node = document.createElement('span'); +            node.className = 'query-parser-char'; +            node.textContent = character; +            container.appendChild(node);          } -        return selectContainer;      }  } diff --git a/ext/bg/js/query-parser.js b/ext/bg/js/query-parser.js index dc3cc581..8f17a5c1 100644 --- a/ext/bg/js/query-parser.js +++ b/ext/bg/js/query-parser.js @@ -44,8 +44,7 @@ class QueryParser extends EventDispatcher {          });      } -    async prepare() { -        await this._queryParserGenerator.prepare(); +    prepare() {          this._textScanner.prepare();          this._textScanner.on('searched', this._onSearched.bind(this));      } @@ -125,13 +124,9 @@ class QueryParser extends EventDispatcher {      }      _setPreview(text) { -        const previewTerms = []; -        for (let i = 0, ii = text.length; i < ii; i += 2) { -            const tempText = text.substring(i, i + 2); -            previewTerms.push([{text: tempText, reading: ''}]); -        } +        const terms = [[{text, reading: ''}]];          this._queryParser.textContent = ''; -        this._queryParser.appendChild(this._queryParserGenerator.createParseResult(previewTerms, true)); +        this._queryParser.appendChild(this._queryParserGenerator.createParseResult(terms, true));      }      _renderParserSelect() { @@ -148,6 +143,6 @@ class QueryParser extends EventDispatcher {          const parseResult = this._getParseResult();          this._queryParser.textContent = '';          if (!parseResult) { return; } -        this._queryParser.appendChild(this._queryParserGenerator.createParseResult(parseResult.content)); +        this._queryParser.appendChild(this._queryParserGenerator.createParseResult(parseResult.content, false));      }  } diff --git a/ext/bg/query-parser-templates.html b/ext/bg/query-parser-templates.html deleted file mode 100644 index 7cab16a9..00000000 --- a/ext/bg/query-parser-templates.html +++ /dev/null @@ -1,11 +0,0 @@ -<!DOCTYPE html><html><head></head><body> - -<template id="term-template"><span class="query-parser-term" data-type="normal"></span></template> -<template id="term-preview-template"><span class="query-parser-term" data-type="preview"></span></template> -<template id="segment-template"><ruby class="query-parser-segment"><span class="query-parser-segment-text"></span><rt class="query-parser-segment-reading"></rt></ruby></template> -<template id="char-template"><span class="query-parser-char"></span></template> - -<template id="select-template"><select class="query-parser-select form-control"></select></template> -<template id="select-option-template"><option class="query-parser-select-option"></option></template> - -</body></html> diff --git a/ext/mixed/js/api.js b/ext/mixed/js/api.js index e826b68b..43db1562 100644 --- a/ext/mixed/js/api.js +++ b/ext/mixed/js/api.js @@ -137,10 +137,6 @@ const api = (() => {              return this._invoke('getDisplayTemplatesHtml');          } -        getQueryParserTemplatesHtml() { -            return this._invoke('getQueryParserTemplatesHtml'); -        } -          getZoom() {              return this._invoke('getZoom');          } diff --git a/ext/mixed/js/display.js b/ext/mixed/js/display.js index 38a441bd..33d8f986 100644 --- a/ext/mixed/js/display.js +++ b/ext/mixed/js/display.js @@ -164,7 +164,7 @@ class Display extends EventDispatcher {          this._updateMode();          this._setInteractive(true);          await this._displayGenerator.prepare(); -        await this._queryParser.prepare(); +        this._queryParser.prepare();          this._history.prepare();          this._history.on('stateChanged', this._onStateChanged.bind(this));          this._queryParser.on('searched', this._onQueryParserSearch.bind(this)); |