Index: gc_lang/fr/webext/content_scripts/content_modifier.js ================================================================== --- gc_lang/fr/webext/content_scripts/content_modifier.js +++ gc_lang/fr/webext/content_scripts/content_modifier.js @@ -113,11 +113,11 @@ if (oTFPanel !== null) { oTFPanel.setTextArea(xTextArea); oTFPanel.show(); } else { // create the panel - oTFPanel = new GrammalecteTextFormatter("grammalecte_tf_panel", "Formateur de texte", 800, 600, false); + oTFPanel = new GrammalecteTextFormatter("grammalecte_tf_panel", "Formateur de texte", 800, 620, false); oTFPanel.logInnerHTML(); oTFPanel.setTextArea(xTextArea); oTFPanel.insertIntoPage(); } } Index: gc_lang/fr/webext/content_scripts/panels_content.js ================================================================== --- gc_lang/fr/webext/content_scripts/panels_content.js +++ gc_lang/fr/webext/content_scripts/panels_content.js @@ -67,14 +67,10 @@ let xButton = createNode("div", {className: "grammalecte_close_button", textContent: "×", title: "Fermer la fenêtre"}); xButton.onclick = function () { this.hide(); }.bind(this); // better than writing “let that = this;” before the function? return xButton; } - setContentNode (xNode) { - this.xPanelContent.appendChild(xNode); - } - insertIntoPage () { document.body.appendChild(this.xPanelNode); } show () { Index: gc_lang/fr/webext/content_scripts/tf_content.css ================================================================== --- gc_lang/fr/webext/content_scripts/tf_content.css +++ gc_lang/fr/webext/content_scripts/tf_content.css @@ -1,16 +1,17 @@ /* - Text Formatter + CSS for the Text Formatter +*/ + + +/* + Options */ #grammalecte_tf_options { display: flex; padding: 10px; } -#grammalecte_tf_options .underline:hover { - background-color: hsl(210, 10%, 86%); - border-radius: 2px; -} .grammalecte_tf_column { flex-grow: 1; width: 360px; padding: 0 5px; } @@ -30,21 +31,44 @@ margin: 7px 5px 0 4px; float: left; } #grammalecte_tf_options label { font-size: 13px; +} +#grammalecte_tf_options .underline:hover { + background-color: hsl(210, 10%, 86%); + border-radius: 2px; +} +#grammalecte_tf_options .blockopt .option { + margin: 4px 5px 0 6px; + float: left; } #grammalecte_tf_options .grammalecte_tf_result { float: right; - margin-right: 3px; + margin: 2px 3px 0 0; font-size: 13px; } +#grammalecte_tf_options .indent { + padding-left: 20px; +} +#grammalecte_tf_options .inlineblock { + display: inline-block; + margin-right: 10px; +} +#grammalecte_tf_options .rmg10 { + margin-right: 10px; +} + + +/* + Actions +*/ #grammalecte_tf_actions { - background-color: hsl(120, 10%, 92%); - padding: 15px; - border-top: 1px solid hsl(120, 20%, 86%); + /*background-color: hsl(120, 10%, 92%);*/ + padding: 15px 15px 10px 15px; + border-top: 1px solid hsl(210, 10%, 90%); } .grammalecte_button { display: inline-block; padding: 5px 10px; Index: gc_lang/fr/webext/content_scripts/tf_content.js ================================================================== --- gc_lang/fr/webext/content_scripts/tf_content.js +++ gc_lang/fr/webext/content_scripts/tf_content.js @@ -58,10 +58,11 @@ let xMisc = this._createFieldset("group_misc", true, "Divers"); xMisc.appendChild(this._createSimpleOption("o_ordinals_no_exponant", true, "Ordinaux (15e, XXIe…)")); xMisc.appendChild(this._createSimpleOption("o_etc", true, "Et cætera, etc.")); xMisc.appendChild(this._createSimpleOption("o_missing_hyphens", true, "Traits d’union manquants")); xMisc.appendChild(this._createSimpleOption("o_ma_word", true, "Apostrophes manquantes")); + xMisc.appendChild(this._createSingleLetterOptions()); let xStruct = this._createFieldset("group_struct", false, "Restructuration [!]"); xStruct.appendChild(this._createSimpleOption("o_remove_hyphens_at_end_of_paragraphs", false, "Enlever césures en fin de ligne/paragraphe [!]")); xStruct.appendChild(this._createSimpleOption("o_merge_contiguous_paragraphs", false, "Fusionner les paragraphes contigus [!]")); xColumn1.appendChild(xSSP); xColumn1.appendChild(xSpace); @@ -82,19 +83,16 @@ // create result xTFNode.appendChild(xOptions); xTFNode.appendChild(xActions); } catch (e) { - //console.error(e); showError(e); } return xTFNode; } - /* - Common options - */ + // Common options _createFieldset (sId, bDefault, sLabel) { let xFieldset = createNode("fieldset", {id: sId, className: "groupblock"}); let xLegend = document.createElement("legend"); xLegend.appendChild(createNode("input", {type: "checkbox", id: "o_"+sId, className: "option"}, {default: bDefault})); xLegend.appendChild(createNode("label", {htmlFor: "o_"+sId, textContent: sLabel})); @@ -101,67 +99,123 @@ xFieldset.appendChild(xLegend); return xFieldset; } _createSimpleOption (sId, bDefault, sLabel) { - let xOption = createNode("div", {className: "blockopt underline"}); - xOption.appendChild(createNode("input", {type: "checkbox", id: sId, className: "option"}, {default: bDefault})); - xOption.appendChild(createNode("label", {htmlFor: sId, textContent: sLabel, className: "opt_lbl largew"})); - xOption.appendChild(createNode("div", {id: "res_"+sId, className: "grammalecte_tf_result", textContent: "9999"})); - return xOption; + let xLine = createNode("div", {className: "blockopt underline"}); + xLine.appendChild(createNode("input", {type: "checkbox", id: sId, className: "option"}, {default: bDefault})); + xLine.appendChild(createNode("label", {htmlFor: sId, textContent: sLabel, className: "opt_lbl largew"})); + xLine.appendChild(createNode("div", {id: "res_"+sId, className: "grammalecte_tf_result", textContent: "9999"})); + return xLine; } - - /* - Hyphens - */ + // Hyphens _createRadioBoxHyphens (sName, sIdEmDash, sIdEnDash, bDefaultEmDash) { - let xLine = createNode("div", {className: "blockopt"}); - xLine.appendChild(createNode("input", {type: "radio", id: sIdEmDash, name: sName, className:"option"}, {default: bDefaultEmDash})); - xLine.appendChild(createNode("label", {htmlFor: sIdEmDash, className: "opt_lbl", textContent: "cadratin (—)"})); - xLine.appendChild(createNode("input", {type: "radio", id: sIdEnDash, name: sName, className:"option"}, {default: !bDefaultEmDash})); - xLine.appendChild(createNode("label", {htmlFor: sIdEnDash, className: "opt_lbl", textContent: "demi-cadratin (–)"})); + let xLine = createNode("div", {className: "blockopt indent"}); + xLine.appendChild(this._createInlineRadioOption(sName, sIdEmDash, "cadratin (—)", bDefaultEmDash)); + xLine.appendChild(this._createInlineRadioOption(sName, sIdEnDash, "demi-cadratin (—)", !bDefaultEmDash)); return xLine; } - - /* - Ligatures - */ + // Ligatures _createRadioBoxLigatures () { let xLine = createNode("div", {className: "blockopt underline"}); - xLine.appendChild(this._createSimpleOption("o_ts_ligature", true, "Ligatures")); - xLine.appendChild(createNode("input", {type: "radio", id: "o_ts_ligature_do", name: "liga", className:"option"}, {default: false})); - xLine.appendChild(createNode("label", {htmlFor: "o_ts_ligature_do", className: "opt_lbl", textContent: "faire"})); - xLine.appendChild(createNode("input", {type: "radio", id: "o_ts_ligature_undo", name: "liga", className:"option"}, {default: true})); - xLine.appendChild(createNode("label", {htmlFor: "o_ts_ligature_undo", className: "opt_lbl", textContent: "défaire"})); + xLine.appendChild(createNode("div", {id: "res_"+"o_ts_ligature", className: "grammalecte_tf_result", textContent: "9999"})); + xLine.appendChild(this._createInlineCheckboxOption("o_ts_ligature", "Ligatures", true)); + xLine.appendChild(this._createInlineRadioOption("liga", "o_ts_ligature_do", "faire", false)); + xLine.appendChild(this._createInlineRadioOption("liga", "o_ts_ligature_undo", "défaire", true)); return xLine; } _createLigaturesSelection () { - let xLine = createNode("div", {className: "blockopt"}); - xLine.appendChild(this._createLigatureCheckboxAndLabel("o_ts_ligature_ff", "ff", true)); - xLine.appendChild(this._createLigatureCheckboxAndLabel("o_ts_ligature_fi", "fi", true)); - xLine.appendChild(this._createLigatureCheckboxAndLabel("o_ts_ligature_ffi", "ffi", true)); - xLine.appendChild(this._createLigatureCheckboxAndLabel("o_ts_ligature_fl", "fl", true)); - xLine.appendChild(this._createLigatureCheckboxAndLabel("o_ts_ligature_ffl", "ffl", true)); - xLine.appendChild(this._createLigatureCheckboxAndLabel("o_ts_ligature_ft", "ft", true)); - xLine.appendChild(this._createLigatureCheckboxAndLabel("o_ts_ligature_st", "st", false)); + let xLine = createNode("div", {className: "blockopt indent"}); + xLine.appendChild(this._createInlineCheckboxOption("o_ts_ligature_ff", "ff", true)); + xLine.appendChild(this._createInlineCheckboxOption("o_ts_ligature_fi", "fi", true)); + xLine.appendChild(this._createInlineCheckboxOption("o_ts_ligature_ffi", "ffi", true)); + xLine.appendChild(this._createInlineCheckboxOption("o_ts_ligature_fl", "fl", true)); + xLine.appendChild(this._createInlineCheckboxOption("o_ts_ligature_ffl", "ffl", true)); + xLine.appendChild(this._createInlineCheckboxOption("o_ts_ligature_ft", "ft", true)); + xLine.appendChild(this._createInlineCheckboxOption("o_ts_ligature_st", "st", false)); + return xLine; + } + + // Apostrophes + _createSingleLetterOptions () { + let xLine = createNode("div", {className: "blockopt indent"}); + xLine.appendChild(this._createInlineCheckboxOption("o_ma_1letter_lowercase", "lettres isolées (j’ n’ m’ t’ s’ c’ d’ l’)", false)); + xLine.appendChild(this._createInlineCheckboxOption("o_ma_1letter_uppercase", "Maj.", false)); return xLine; } - _createLigatureCheckboxAndLabel (sId, sLabel, bDefault) { - let xInlineBlock = createNode("div", {style: "display: inline-block;"}); + // Inline option block + _createInlineCheckboxOption (sId, sLabel, bDefault) { + let xInlineBlock = createNode("div", {className: "inlineblock"}); xInlineBlock.appendChild(createNode("input", {type: "checkbox", id: sId, className: "option"}, {default: bDefault})); + xInlineBlock.appendChild(createNode("label", {htmlFor: sId, textContent: sLabel, className: "opt_lbl"})); + return xInlineBlock; + } + + _createInlineRadioOption (sName, sId, sLabel, bDefault) { + let xInlineBlock = createNode("div", {className: "inlineblock"}); + xInlineBlock.appendChild(createNode("input", {type: "radio", id: sId, name: sName, className:"option"}, {default: bDefault})); xInlineBlock.appendChild(createNode("label", {htmlFor: sId, className: "opt_lbl", textContent: sLabel})); return xInlineBlock; } -} + + + /* + Actions + */ + switchGroup (sOptName) { + if (document.getElementById(sOptName).checked) { + document.getElementById(sOptName.slice(2)).style.opacity = 1; + } else { + document.getElementById(sOptName.slice(2)).style.opacity = 0.3; + } + } + + + reset () { + this.resetProgressBar(); + for (let xNode of document.getElementsByClassName("option")) { + xNode.checked = (xNode.dataset.default === "true"); + if (xNode.id.startsWith("o_group_")) { + switchGroup(xNode.id); + } + } + } + + resetProgressBar () { + document.getElementById('progressbar').value = 0; + document.getElementById('time_res').textContent = ""; + } + + setOptions (oOptions) { + for (let sOptName in oOptions) { + //console.log(sOptName + ":" + oOptions[sOptName]); + if (document.getElementById(sOptName) !== null) { + document.getElementById(sOptName).checked = oOptions[sOptName]; + if (sOptName.startsWith("o_group_")) { + switchGroup(sOptName); + } + if (document.getElementById("res_"+sOptName) !== null) { + document.getElementById("res_"+sOptName).textContent = ""; + } + } + } + } - + saveOptions () { + let oOptions = {}; + for (let xNode of document.getElementsByClassName("option")) { + oOptions[xNode.id] = xNode.checked; + } + self.port.emit("saveOptions", JSON.stringify(oOptions)); + } +} let sTFinnerHTML = ' \ \
\ @@ -171,16 +225,6 @@
\ \ \
\
\ -
\ -
\ - \ - \ -
\ -
\ - \ - \ -
\ -
\ ';