diff options
| -rw-r--r-- | ext/bg/js/settings.js | 99 | ||||
| -rw-r--r-- | ext/bg/js/templates.js | 17 | ||||
| -rw-r--r-- | ext/bg/settings.html | 17 | ||||
| -rw-r--r-- | tmpl/model.html | 18 | 
4 files changed, 84 insertions, 67 deletions
| diff --git a/ext/bg/js/settings.js b/ext/bg/js/settings.js index d4b1549e..daa997d4 100644 --- a/ext/bg/js/settings.js +++ b/ext/bg/js/settings.js @@ -489,6 +489,71 @@ async function ankiDeckAndModelPopulate(options) {      ankiFormat.show();  } +function ankiCreateFieldTemplate(name, value, markers) { +    const template = document.querySelector('#anki-field-template').content; +    const content = document.importNode(template, true).firstChild; + +    content.querySelector('.anki-field-name').textContent = name; + +    const field = content.querySelector('.anki-field-value'); +    field.dataset.field = name; +    field.value = value; + +    content.querySelector('.anki-field-marker-list').appendChild(ankiGetFieldMarkersHtml(markers)); + +    return content; +} + +function ankiGetFieldMarkersHtml(markers, fragment) { +    const template = document.querySelector('#anki-field-marker-template').content; +    if (!fragment) { +        fragment = new DocumentFragment(); +    } +    for (const marker of markers) { +        const markerNode = document.importNode(template, true).firstChild; +        markerNode.querySelector('.marker-link').textContent = marker; +        fragment.appendChild(markerNode); +    } +    return fragment; +} + +function ankiGetFieldMarkers(type) { +    switch (type) { +        case 'terms': +            return [ +                'audio', +                'cloze-body', +                'cloze-prefix', +                'cloze-suffix', +                'dictionary', +                'expression', +                'furigana', +                'furigana-plain', +                'glossary', +                'glossary-brief', +                'reading', +                'screenshot', +                'sentence', +                'tags', +                'url' +            ]; +        case 'kanji': +            return [ +                'character', +                'dictionary', +                'glossary', +                'kunyomi', +                'onyomi', +                'screenshot', +                'sentence', +                'tags', +                'url' +            ]; +        default: +            return []; +    } +} +  async function ankiFieldsPopulate(element, options) {      const modelName = element.val();      if (!modelName) { @@ -498,41 +563,11 @@ async function ankiFieldsPopulate(element, options) {      const tab = element.closest('.tab-pane');      const tabId = tab.attr('id');      const container = tab.find('tbody').empty(); - -    const markers = { -        'terms': [ -            'audio', -            'cloze-body', -            'cloze-prefix', -            'cloze-suffix', -            'dictionary', -            'expression', -            'furigana', -            'furigana-plain', -            'glossary', -            'glossary-brief', -            'reading', -            'screenshot', -            'sentence', -            'tags', -            'url' -        ], -        'kanji': [ -            'character', -            'dictionary', -            'glossary', -            'kunyomi', -            'onyomi', -            'screenshot', -            'sentence', -            'tags', -            'url' -        ] -    }[tabId] || {}; +    const markers = ankiGetFieldMarkers(tabId);      for (const name of await utilAnkiGetModelFieldNames(modelName)) {          const value = options.anki[tabId].fields[name] || ''; -        const html = Handlebars.templates['model.html']({name, markers, value}); +        const html = ankiCreateFieldTemplate(name, value, markers);          container.append($(html));      } diff --git a/ext/bg/js/templates.js b/ext/bg/js/templates.js index c8c95cc2..823b9e6f 100644 --- a/ext/bg/js/templates.js +++ b/ext/bg/js/templates.js @@ -163,23 +163,6 @@ templates['kanji.html'] = template({"1":function(container,depth0,helpers,partia    }  ,"useDecorators":true,"usePartial":true,"useData":true,"useDepths":true}); -templates['model.html'] = template({"1":function(container,depth0,helpers,partials,data) { -    return "                    <li><a class=\"marker-link\" href=\"#\">" -    + container.escapeExpression(container.lambda(depth0, depth0)) -    + "</a></li>\n"; -},"compiler":[7,">= 4.0.0"],"main":function(container,depth0,helpers,partials,data) { -    var stack1, helper, alias1=depth0 != null ? depth0 : (container.nullContext || {}), alias2=helpers.helperMissing, alias3="function", alias4=container.escapeExpression; - -  return "<tr>\n    <td class=\"col-sm-2\">" -    + alias4(((helper = (helper = helpers.name || (depth0 != null ? depth0.name : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"name","hash":{},"data":data}) : helper))) -    + "</td>\n    <td class=\"col-sm-10\">\n        <div class=\"input-group\">\n            <input type=\"text\" class=\"anki-field-value form-control\" data-field=\"" -    + alias4(((helper = (helper = helpers.name || (depth0 != null ? depth0.name : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"name","hash":{},"data":data}) : helper))) -    + "\" value=\"" -    + alias4(((helper = (helper = helpers.value || (depth0 != null ? depth0.value : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"value","hash":{},"data":data}) : helper))) -    + "\">\n            <div class=\"input-group-btn\">\n                <button type=\"button\" class=\"btn btn-default dropdown-toggle\" data-toggle=\"dropdown\">\n                    <span class=\"caret\"></span>\n                </button>\n                <ul class=\"dropdown-menu dropdown-menu-right\">\n" -    + ((stack1 = helpers.each.call(alias1,(depth0 != null ? depth0.markers : depth0),{"name":"each","hash":{},"fn":container.program(1, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "") -    + "                </ul>\n            </div>\n        </div>\n    </td>\n</tr>\n"; -},"useData":true});  templates['terms.html'] = template({"1":function(container,depth0,helpers,partials,data) {      var stack1, helper, options, alias1=depth0 != null ? depth0 : (container.nullContext || {}), buffer =     "<div class=\"dict-"; diff --git a/ext/bg/settings.html b/ext/bg/settings.html index 86feacf7..86d8935d 100644 --- a/ext/bg/settings.html +++ b/ext/bg/settings.html @@ -704,6 +704,23 @@                              </p>                              <textarea autocomplete="off" spellcheck="false" wrap="soft" class="form-control" rows="10" id="field-templates"></textarea>                          </div> + +                        <template id="anki-field-template"><tr> +                            <td class="col-sm-2 anki-field-name"></td> +                            <td class="col-sm-10"> +                                <div class="input-group"> +                                    <input type="text" class="anki-field-value form-control" data-field="" value=""> +                                    <div class="input-group-btn"> +                                        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> +                                            <span class="caret"></span> +                                        </button> +                                        <ul class="dropdown-menu dropdown-menu-right anki-field-marker-list"></ul> +                                    </div> +                                </div> +                            </td> +                        </tr></template> + +                        <template id="anki-field-marker-template"><li><a class="marker-link" href="#"></a></li></template>                      </div>                  </div>              </div> diff --git a/tmpl/model.html b/tmpl/model.html deleted file mode 100644 index 94772316..00000000 --- a/tmpl/model.html +++ /dev/null @@ -1,18 +0,0 @@ -<tr> -    <td class="col-sm-2">{{name}}</td> -    <td class="col-sm-10"> -        <div class="input-group"> -            <input type="text" class="anki-field-value form-control" data-field="{{name}}" value="{{value}}"> -            <div class="input-group-btn"> -                <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> -                    <span class="caret"></span> -                </button> -                <ul class="dropdown-menu dropdown-menu-right"> -                    {{#each markers}} -                    <li><a class="marker-link" href="#">{{.}}</a></li> -                    {{/each}} -                </ul> -            </div> -        </div> -    </td> -</tr> |