Grammalecte  Check-in [49cb3f85b0]

Overview
Comment:[fx] use classes instead of singleton objects
Downloads: Tarball | ZIP archive | SQL archive
Timelines: family | ancestors | descendants | both | fx | webext2
Files: files | file ages | folders
SHA3-256: 49cb3f85b0defe7beb3d6982cd4abf31f2e8d8eb43d13df2c63aded92253dfa9
User & Date: olr on 2017-08-23 09:13:28
Other Links: branch diff | manifest | tags
Context
2017-08-23
09:15
[fx] unlock textarea after gc check-in: 5a3323c9df user: olr tags: fx, webext2
09:13
[fx] use classes instead of singleton objects check-in: 49cb3f85b0 user: olr tags: fx, webext2
2017-08-22
12:29
[fx] useless code check-in: 9e03da4287 user: olr tags: fx, webext2
Changes

Modified gc_lang/fr/webext/content_scripts/content_modifier.js from [c652fb3252] to [7906b3873c].

70
71
72
73
74
75
76
77

78
79
80
81
82
83
84
70
71
72
73
74
75
76

77
78
79
80
81
82
83
84







-
+







                dInfo: {sTextAreaId: xTextArea.id}
            });
        };
        let xGCButton = createNode("div", {className: "grammalecte_wrapper_button", textContent: "Corriger"});
        xGCButton.onclick = function() {
            createGCPanel();
            oGCPanel.startWaitIcon();
            oGCPanelContent.start(xTextArea);
            oGCPanel.start(xTextArea);
            xPort.postMessage({
                sCommand: "parseAndSpellcheck",
                dParam: {sText: xTextArea.value, sCountry: "FR", bDebug: false, bContext: false},
                dInfo: {sTextAreaId: xTextArea.id}
            });
        };
        // Create
107
108
109
110
111
112
113

114
115
116
117

118
119

120
121
122
123
124
125
126
127

128
129
130
131

132
133
134
135
136
137
138
139
140

141
142
143
144

145
146
147
148
149
150
151
152
107
108
109
110
111
112
113
114
115
116
117

118
119

120
121
122
123
124
125
126
127

128
129
130
131

132

133
134
135
136
137
138
139

140
141
142
143

144

145
146
147
148
149
150
151







+



-
+

-
+







-
+



-
+
-







-
+



-
+
-







        oConjPanel.insertIntoPage();
    }
}

function createTFPanel (xTextArea) {
    console.log("Formateur de texte");
    if (oTFPanel !== null) {
        oTFPanel.setTextArea(xTextArea);
        oTFPanel.show();
    } else {
        // create the panel
        oTFPanel = new GrammalectePanel("grammalecte_tf_panel", "Formateur de texte", 800, 600, false);
        oTFPanel = new GrammalecteTextFormatter("grammalecte_tf_panel", "Formateur de texte", 800, 600, false);
        oTFPanel.logInnerHTML();
        oTFPanel.setContentNode(createTextFormatter(xTextArea));
        oTFPanel.setTextArea(xTextArea);
        oTFPanel.insertIntoPage();
    }
}

function createLxgPanel () {
    console.log("Lexicographe");
    if (oLxgPanel !== null) {
        oLxgPanelContent.clear();
        oLxgPanel.clear();
        oLxgPanel.show();
    } else {
        // create the panel
        oLxgPanel = new GrammalectePanel("grammalecte_lxg_panel", "Lexicographe", 500, 700);
        oLxgPanel = new GrammalecteLexicographer("grammalecte_lxg_panel", "Lexicographe", 500, 700);
        oLxgPanel.setContentNode(oLxgPanelContent.init());
        oLxgPanel.insertIntoPage();
    }
}

function createGCPanel () {
    console.log("Correction grammaticale");
    if (oGCPanel !== null) {
        oGCPanelContent.clear();
        oGCPanel.clear();
        oGCPanel.show();
    } else {
        // create the panel
        oGCPanel = new GrammalectePanel("grammalecte_gc_panel", "Grammalecte", 500, 700);
        oGCPanel = new GrammalecteGrammarChecker("grammalecte_gc_panel", "Grammalecte", 500, 700);
        oGCPanel.setContentNode(oGCPanelContent.init());
        oGCPanel.insertIntoPage();
    }
}


/*
    Simple message
174
175
176
177
178
179
180
181

182
183
184
185
186
187
188

189
190
191
192
193

194
195
196
197
198
199
200
173
174
175
176
177
178
179

180
181
182
183
184
185
186

187
188
189
190
191

192
193
194
195
196
197
198
199







-
+






-
+




-
+







        case "getCurrentTabId":
            console.log("[Content script] tab id: " + result);
            nTadId = result;
            break;
        case "parseAndSpellcheck":
            console.log("[content script] received: parseAndSpellcheck");
            if (!bEnd) {
                oGCPanelContent.addParagraphResult(result);
                oGCPanel.addParagraphResult(result);
            } else {
                oGCPanel.stopWaitIcon();
            }
            break;
        case "parseAndSpellcheck1":
            console.log("[content script] received: parseAndSpellcheck1");
            oGCPanelContent.refreshParagraph(dInfo.sParagraphId, result);
            oGCPanel.refreshParagraph(dInfo.sParagraphId, result);
            break;
        case "getListOfTokens":
            console.log("[content script] received: getListOfTokens");
            if (!bEnd) {
                oLxgPanelContent.addListOfTokens(result);
                oLxgPanel.addListOfTokens(result);
            } else {
                oLxgPanel.stopWaitIcon();
            }
            break;
        default:
            console.log("[Content script] Unknown command: " + sActionDone);
    }

Modified gc_lang/fr/webext/content_scripts/gc_content.js from [6a5d0efcb3] to [7bf90ff4d6].

1
2
3
4
5
6
7
8
9
10

11
12

13
14

15
16
17
18
19

20
21

22
23

24
25
26

27
28

29
30
31
32
33
34
35
36
37

38
39
40
41
42
43
44
45
46
47
48

49
50
51
52


53
54
55
56
57
58
59
60
61



62
63
64
65



66
67
68
69
70
71
72



73
74
75
76
77
78
79



80
81
82
83
84
85
86
1
2
3
4
5
6
7
8
9

10
11

12
13

14
15
16
17
18

19
20

21
22

23
24
25

26
27

28
29
30
31
32
33
34
35
36

37
38
39
40
41
42
43
44
45
46


47




48
49


50
51
52
53



54
55
56




57
58
59
60
61
62
63



64
65
66
67
68
69
70



71
72
73
74
75
76
77
78
79
80









-
+

-
+

-
+




-
+

-
+

-
+


-
+

-
+








-
+









-
-
+
-
-
-
-
+
+
-
-




-
-
-
+
+
+
-
-
-
-
+
+
+




-
-
-
+
+
+




-
-
-
+
+
+







// JavaScript

"use strict";

function onGrammalecteGCPanelClick (xEvent) {
    try {
        let xElem = xEvent.target;
        if (xElem.id) {
            if (xElem.id.startsWith("grammalecte_sugg")) {
                oGCPanelContent.applySuggestion(xElem.id);
                oGCPanel.applySuggestion(xElem.id);
            } else if (xElem.id === "grammalecte_tooltip_ignore") {
                oGCPanelContent.ignoreError(xElem.id);
                oGCPanel.ignoreError(xElem.id);
            } else if (xElem.id.startsWith("grammalecte_check")) {
                oGCPanelContent.recheckParagraph(parseInt(xElem.id.slice(17)));
                oGCPanel.recheckParagraph(parseInt(xElem.id.slice(17)));
            } else if (xElem.id.startsWith("grammalecte_hide")) {
                xElem.parentNode.parentNode.style.display = "none";
            } else if (xElem.tagName === "U" && xElem.id.startsWith("grammalecte_err")
                       && xElem.className !== "corrected" && xElem.className !== "ignored") {
                oGCPanelContent.oTooltip.show(xElem.id);
                oGCPanel.oTooltip.show(xElem.id);
            } else if (xElem.id === "grammalecte_tooltip_url") {
                oGCPanelContent.openURL(xElem.getAttribute("href"));
                oGCPanel.openURL(xElem.getAttribute("href"));
            } else {
                oGCPanelContent.oTooltip.hide();
                oGCPanel.oTooltip.hide();
            }
        } else if (xElem.tagName === "A") {
            oGCPanelContent.openURL(xElem.getAttribute("href"));
            oGCPanel.openURL(xElem.getAttribute("href"));
        } else {
            oGCPanelContent.oTooltip.hide();
            oGCPanel.oTooltip.hide();
        }
    }
    catch (e) {
        showError(e);
    }
}


const oGCPanelContent = {
class GrammalecteGrammarChecker extends GrammalectePanel {
    /*
        KEYS for identifiers:
            grammalecte_paragraph{Id} : [paragraph number]
            grammalecte_check{Id}     : [paragraph number]
            grammalecte_hide{Id}      : [paragraph number]
            grammalecte_error{Id}     : [paragraph number]-[error_number]
            grammalecte_sugg{Id}      : [paragraph number]-[error_number]--[suggestion_number]
    */

    bInitDone: false,

    constructor (...args) {
    xContentNode: null,
    xParagraphList: null,

    aIgnoredErrors: new Set(),
        super(...args);
        this.aIgnoredErrors = new Set();

    init: function () {
        this.xContentNode = createNode("div", {id: "grammalecte_gc_panel_content"});
        this.xParagraphList = createNode("div", {id: "grammalecte_paragraph_list"});
        this.xContentNode.appendChild(this.xParagraphList);
        this.xContentNode.addEventListener("click", onGrammalecteGCPanelClick, false);
        this.oTooltip.init();
        this.xContentNode.appendChild(this.oTooltip.xTooltip);
        this.bInitDone = true;
        this.oTooltip = new GrammalecteTooltip(this.xContentNode);
        this.xPanelContent.appendChild(this.xContentNode);
        this.oTAC = new GrammalecteTextAreaControl();
        return this.xContentNode;
    },

    start: function (xTextArea=null) {
    }

    start (xTextArea=null) {
        this.clear();
        if (xTextArea) {
            this.oTAC.setTextArea(xTextArea);
        }
    },

    clear: function () {
    }

    clear () {
        while (this.xParagraphList.firstChild) {
            this.xParagraphList.removeChild(this.xParagraphList.firstChild);
        }
        this.aIgnoredErrors.clear();
    },

    addParagraphResult: function (oResult) {
    }

    addParagraphResult (oResult) {
        try {
            if (oResult) {
                let xNodeDiv = createNode("div", {className: "grammalecte_paragraph_block"});
                // actions
                let xActionsBar = createNode("div", {className: "grammalecte_paragraph_actions"});
                xActionsBar.appendChild(createNode("div", {id: "grammalecte_check" + oResult.iParaNum, className: "button green", textContent: "Réanalyser"}));
                xActionsBar.appendChild(createNode("div", {id: "grammalecte_hide" + oResult.iParaNum, className: "button red bold", textContent: "×"}));
99
100
101
102
103
104
105
106
107
108



109
110
111
112
113
114
115
116
117
118
119
120
121
122



123
124
125
126
127
128
129
130
131
132
133
134
135



136
137
138
139

140
141
142
143
144
145
146
93
94
95
96
97
98
99



100
101
102
103
104
105
106
107
108
109
110
111
112
113



114
115
116
117
118
119
120
121
122
123
124
125
126



127
128
129
130
131
132

133
134
135
136
137
138
139
140







-
-
-
+
+
+











-
-
-
+
+
+










-
-
-
+
+
+



-
+







                xNodeDiv.appendChild(xParagraph);
                this.xParagraphList.appendChild(xNodeDiv);
            }
        }
        catch (e) {
            showError(e);
        }
    },

    recheckParagraph: function (iParaNum) {
    }

    recheckParagraph (iParaNum) {
        let sParagraphId = "grammalecte_paragraph" + iParaNum;
        let xParagraph = document.getElementById(sParagraphId);
        this.blockParagraph(xParagraph);
        let sText = this.purgeText(xParagraph.textContent);
        xPort.postMessage({
            sCommand: "parseAndSpellcheck1",
            dParam: {sText: sText, sCountry: "FR", bDebug: false, bContext: false},
            dInfo: {sParagraphId: sParagraphId}
        });
        this.oTAC.setParagraph(iParaNum, sText);
        this.oTAC.write();
    },

    refreshParagraph: function (sParagraphId, oResult) {
    }

    refreshParagraph (sParagraphId, oResult) {
        try {
            let xParagraph = document.getElementById(sParagraphId);
            xParagraph.className = (oResult.aGrammErr.length || oResult.aSpellErr.length) ? "grammalecte_paragraph softred" : "grammalecte_paragraph";
            xParagraph.textContent = "";
            this._tagParagraph(xParagraph, oResult.sParagraph, sParagraphId.slice(21), oResult.aGrammErr, oResult.aSpellErr);
            this.freeParagraph(xParagraph);
        }
        catch (e) {
            showError(e);
        }
    },

    _tagParagraph: function (xParagraph, sParagraph, iParaNum, aSpellErr, aGrammErr) {
    }

    _tagParagraph (xParagraph, sParagraph, iParaNum, aSpellErr, aGrammErr) {
        try {
            if (aGrammErr.length === 0  &&  aSpellErr.length === 0) {
                xParagraph.textContent = sParagraph;
                return
                return;
            }
            aGrammErr.push(...aSpellErr);
            aGrammErr.sort(function (a, b) {
                if (a["nStart"] < b["nStart"])
                    return -1;
                if (a["nStart"] > b["nStart"])
                    return 1;
166
167
168
169
170
171
172
173
174
175



176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195



196
197
198
199




200
201
202
203




204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221



222
223
224
225
226
227
228
229
230
231
232
233
234
235
236



237
238
239
240



241
242
243
244



245
246
247
248
249
250




251
252
253
254
255
256
257
258
259
260
261
262
263
264
265

266
267
268
269
270
271

272
273
274
275
276
277
278
279







280
281
282
283
284

285
286
287
288
289
290
291
292
293
294
295
296





297
298
299
300
301


302
303
304
305
306
307
308
160
161
162
163
164
165
166



167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186



187
188
189
190



191
192
193
194
195



196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214



215
216
217
218
219
220
221
222
223
224
225
226
227
228
229



230
231
232
233



234
235
236
237



238
239
240
241
242




243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260

261
262
263
264
265
266

267
268







269
270
271
272
273
274
275





276
277
278
279
280
281
282
283

284



285
286
287
288
289
290
291
292


293
294
295
296
297
298
299
300
301







-
-
-
+
+
+

















-
-
-
+
+
+

-
-
-
+
+
+
+

-
-
-
+
+
+
+















-
-
-
+
+
+












-
-
-
+
+
+

-
-
-
+
+
+

-
-
-
+
+
+


-
-
-
-
+
+
+
+














-
+





-
+

-
-
-
-
-
-
-
+
+
+
+
+
+
+
-
-
-
-
-
+







-

-
-
-
+
+
+
+
+



-
-
+
+







            if (nEndLastErr <= sParagraph.length) {
                xParagraph.appendChild(document.createTextNode(sParagraph.slice(nEndLastErr)));
            }
        }
        catch (e) {
            showError(e);
        }
    },

    _createError: function (sUnderlined, oErr) {
    }

    _createError (sUnderlined, oErr) {
        let xNodeErr = document.createElement("u");
        xNodeErr.id = "grammalecte_err" + oErr['sErrorId'];
        xNodeErr.textContent = sUnderlined;
        xNodeErr.dataset.error_id = oErr['sErrorId'];
        xNodeErr.dataset.ignored_key = oErr['sIgnoredKey'];
        xNodeErr.dataset.error_type = (oErr['sType'] === "WORD") ? "spelling" : "grammar";
        if (xNodeErr.dataset.error_type === "grammar") {
            xNodeErr.dataset.gc_message = oErr['sMessage'];
            xNodeErr.dataset.gc_url = oErr['URL'];
            if (xNodeErr.dataset.gc_message.includes(" #")) {
                xNodeErr.dataset.line_id = oErr['sLineId'];
                xNodeErr.dataset.rule_id = oErr['sRuleId'];
            }
            xNodeErr.dataset.suggestions = oErr["aSuggestions"].join("|");
        }
        xNodeErr.className = (this.aIgnoredErrors.has(xNodeErr.dataset.ignored_key)) ? "ignored" : "error " + oErr['sType'];
        return xNodeErr;
    },

    blockParagraph: function (xParagraph) {
    }

    blockParagraph (xParagraph) {
        xParagraph.contentEditable = "false";
    },

    freeParagraph: function (xParagraph) {
        document.getElementById("grammalecte_check"+xParagraph.dataset.para_num).textContent = "Analyse…";
    }

    freeParagraph (xParagraph) {
        xParagraph.contentEditable = "true";
    },

    applySuggestion: function (sNodeSuggId) { // sugg
        document.getElementById("grammalecte_check"+xParagraph.dataset.para_num).textContent = "Réanalyser";
    }

    applySuggestion (sNodeSuggId) { // sugg
        try {
            console.log(sNodeSuggId);
            let sErrorId = document.getElementById(sNodeSuggId).dataset.error_id;
            //let sParaNum = sErrorId.slice(0, sErrorId.indexOf("-"));
            console.log("grammalecte_err"+sErrorId);
            let xNodeErr = document.getElementById("grammalecte_err" + sErrorId);
            xNodeErr.textContent = document.getElementById(sNodeSuggId).textContent;
            xNodeErr.className = "corrected";
            xNodeErr.removeAttribute("style");
            this.oTooltip.hide();
            this.recheckParagraph(parseInt(sErrorId.slice(0, sErrorId.indexOf("-"))));
        }
        catch (e) {
            showError(e);
        }
    },

    ignoreError: function (sIgnoreButtonId) {  // ignore
    }

    ignoreError (sIgnoreButtonId) {  // ignore
        try {
            console.log(sIgnoreButtonId);
            let sErrorId = document.getElementById(sIgnoreButtonId).dataset.error_id;
            console.log("grammalecte_err"+sErrorId);
            let xNodeErr = document.getElementById("grammalecte_err" + sErrorId);
            this.aIgnoredErrors.add(xNodeErr.dataset.ignored_key);
            xNodeErr.className = "ignored";
            this.oTooltip.hide();
        }
        catch (e) {
            showError(e);
        }
    },

    purgeText: function (sText) {
    }

    purgeText (sText) {
        return sText.replace(/&nbsp;/g, " ").replace(/&lt;/g, "<").replace(/&gt;/g, ">").replace(/&amp;/g, "&");
    },

    addSummary: function () {
    }

    addSummary () {
        // todo
    },

    addMessage: function (sMessage) {
    }

    addMessage (sMessage) {
        let xNode = createNode("div", {className: "grammalecte_gc_panel_message", textContent: sMessage});
        this.xParagraphList.appendChild(xNode);
    },

    copyToClipboard: function () {
        startWaitIcon();
    }

    copyToClipboard () {
        this.startWaitIcon();
        try {
            let xClipboardButton = document.getElementById("grammalecte_clipboard_button");
            xClipboardButton.textContent = "copie en cours…";
            let sText = "";
            for (let xNode of document.getElementById("grammalecte_paragraph_list").getElementsByClassName("grammalecte_paragraph")) {
                sText += xNode.textContent + "\n";
            }
            self.port.emit('copyToClipboard', sText);
            xClipboardButton.textContent = "-> presse-papiers";
            window.setTimeout(function() { xClipboardButton.textContent = "∑"; } , 3000);
        }
        catch (e) {
            console.log(e.lineNumber + ": " +e.message);
        }
        stopWaitIcon();
        this.stopWaitIcon();
    }
}



oGCPanelContent.oTooltip = {
class GrammalecteTooltip {

    xTooltip: null,

    xTooltipArrow: createNode("img", {
        id: "grammalecte_tooltip_arrow",
        src: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAECAYAAACzzX7wAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwQAADsEBuJFr7QAAABl0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMC4xNkRpr/UAAAAlSURBVBhXY/j//z8cq/kW/wdhZDEMSXRFWCVhGKwAmwQCF/8HAGUkScGH4cM8AAAAAElFTkSuQmCC",
        alt: "^"
    }),
    constructor (xContentNode) {
        this.xTooltip = createNode("div", {id: "grammalecte_tooltip"});
        this.xTooltipArrow = createNode("img", {
            id: "grammalecte_tooltip_arrow",
            src: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAECAYAAACzzX7wAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwQAADsEBuJFr7QAAABl0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMC4xNkRpr/UAAAAlSURBVBhXY/j//z8cq/kW/wdhZDEMSXRFWCVhGKwAmwQCF/8HAGUkScGH4cM8AAAAAElFTkSuQmCC",
            alt: "^"
        });

    xTooltipSuggBlock: null,

    init: function () {
        this.xTooltip = createNode("div", {id: "grammalecte_tooltip"});
        this.xTooltipSuggBlock = createNode("div", {id: "grammalecte_tooltip_sugg_block"});
        let xMessageBlock = createNode("div", {id: "grammalecte_tooltip_message_block"});
        xMessageBlock.appendChild(createNode("p", {id: "grammalecte_tooltip_rule_id"}));
        xMessageBlock.appendChild(createNode("p", {id: "grammalecte_tooltip_message", textContent: "Erreur."}));
        xMessageBlock.appendChild(createNode("a", {id: "grammalecte_tooltip_ignore", href: "#", onclick: "return false;", textContent: "Ignorer"}));
        xMessageBlock.appendChild(createNode("a", {id: "grammalecte_tooltip_url", href: "#", onclick: "return false;", textContent: "Voulez-vous en savoir plus ?…"}));
        this.xTooltip.appendChild(xMessageBlock);
        this.xTooltip.appendChild(createNode("div", {id: "grammalecte_tooltip_sugg_title", textContent: "SUGGESTIONS :"}));
        this.xTooltipSuggBlock = createNode("div", {id: "grammalecte_tooltip_sugg_block"});
        this.xTooltip.appendChild(this.xTooltipSuggBlock);
    },

    show: function (sNodeErrorId) {  // err
        xContentNode.appendChild(this.xTooltip);
        xContentNode.appendChild(this.xTooltipArrow);
    }

    show (sNodeErrorId) {  // err
        try {
            let xNodeErr = document.getElementById(sNodeErrorId);
            let nLimit = 500 - 330; // paragraph width - tooltip width
            this.xTooltipArrow.style.top = (xNodeErr.offsetTop + 16) + "px"
            this.xTooltipArrow.style.left = (xNodeErr.offsetLeft + Math.floor((xNodeErr.offsetWidth / 2))-4) + "px" // 4 is half the width of the arrow.
            this.xTooltipArrow.style.top = (xNodeErr.offsetTop + 16) + "px";
            this.xTooltipArrow.style.left = (xNodeErr.offsetLeft + Math.floor((xNodeErr.offsetWidth / 2))-4) + "px"; // 4 is half the width of the arrow.
            this.xTooltip.style.top = (xNodeErr.offsetTop + 20) + "px";
            this.xTooltip.style.left = (xNodeErr.offsetLeft > nLimit) ? nLimit + "px" : xNodeErr.offsetLeft + "px";
            if (xNodeErr.dataset.error_type === "grammar") {
                // grammar error
                if (xNodeErr.dataset.gc_message.includes(" ##")) {
                    let n = xNodeErr.dataset.gc_message.indexOf(" ##");
                    document.getElementById("grammalecte_tooltip_message").textContent = xNodeErr.dataset.gc_message.slice(0, n);
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355



356
357

358
359
360
361
362
363
364



365
366
367
368
369
370
371
372
373



374
375
376
377
378
379
380
322
323
324
325
326
327
328

329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344



345
346
347
348

349
350
351
352
353



354
355
356
357
358
359
360
361
362



363
364
365
366
367
368
369
370
371
372







-
















-
-
-
+
+
+

-
+




-
-
-
+
+
+






-
-
-
+
+
+







                        iSugg += 1;
                    }
                } else {
                    xGCSugg.textContent = "Aucune.";
                }
            }
            this.xTooltipArrow.style.display = "block";
            this.xTooltipArrow.style.border = "10px solid hsl(0, 0%, 0%)";
            this.xTooltip.style.display = "block";
            if (xNodeErr.dataset.error_type === "spelling") {
                // spelling mistake
                document.getElementById("grammalecte_tooltip_message").textContent = "Mot inconnu du dictionnaire.";
                document.getElementById("grammalecte_tooltip_ignore").dataset.error_id = xNodeErr.dataset.error_id;
                while (this.xTooltipSuggBlock.firstChild) {
                    this.xTooltipSuggBlock.removeChild(this.xTooltipSuggBlock.firstChild);
                }
                //console.log("getSuggFor: " + xNodeErr.textContent.trim() + " // error_id: " + xNodeErr.dataset.error_id);
                //self.port.emit("getSuggestionsForTo", xNodeErr.textContent.trim(), xNodeErr.dataset.error_id);
                this.setSpellSuggestionsFor(xNodeErr.textContent.trim(), "", xNodeErr.dataset.error_id);
            }
        }
        catch (e) {
            showError(e);
        }
    },

    setTooltipColor: function (bBlue) {
    }

    setTooltipColor () {
        // todo
    },
    }

    hide () {
        this.xTooltipArrow.style.display = "none";
        this.xTooltip.style.display = "none";
    },

    _createSuggestion: function (sErrId, iSugg, sSugg) {
    }

    _createSuggestion (sErrId, iSugg, sSugg) {
        let xNodeSugg = document.createElement("a");
        xNodeSugg.id = "grammalecte_sugg" + sErrId + "--" + iSugg.toString();
        xNodeSugg.className = "sugg";
        xNodeSugg.dataset.error_id = sErrId;
        xNodeSugg.textContent = sSugg;
        return xNodeSugg;
    },

    setSpellSuggestionsFor: function (sWord, sSuggestions, sErrId) {
    }

    setSpellSuggestionsFor (sWord, sSuggestions, sErrId) {
        // spell checking suggestions
        try {
            // console.log("setSuggestionsFor: " + sWord + " > " + sSuggestions + " // " + sErrId);
            let xSuggBlock = document.getElementById("grammalecte_tooltip_sugg_block");
            xSuggBlock.textContent = "";
            if (sSuggestions === "") {
                xSuggBlock.appendChild(document.createTextNode("Aucune."));
393
394
395
396
397
398
399
400
401

402

403
404



405
406
407

408
409
410
411
412
413
414



415
416
417
418
419
420

421
422
423
424
425
426

427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443



444
445
446
447
448
449
450
451
452
385
386
387
388
389
390
391


392
393
394


395
396
397

398

399
400
401
402
403



404
405
406
407
408
409
410
411

412
413
414
415
416
417

418
419
420
421
422
423
424
425
426
427
428
429
430
431
432



433
434
435
436
437
438
439
440
441
442
443
444







-
-
+

+
-
-
+
+
+
-

-
+




-
-
-
+
+
+





-
+





-
+














-
-
-
+
+
+









        catch (e) {
            showError(e);
        }
    }
}


oGCPanelContent.oTAC = {
    // Text area control
class GrammalecteTextAreaControl {

    constructor () {
    _xTextArea: null,

        this._xTextArea = null;
        this._dParagraph = new Map();
    }
    _dParagraph: new Map(),

    setTextArea: function (xNode) {
    setTextArea (xNode) {
        this.clear();
        this._xTextArea = xNode;
        this._xTextArea.disabled = true;
        this._loadText();
    },

    clear: function () {
    }

    clear () {
        if (this._xTextArea !== null) {
            this._xTextArea.disabled = false;
            this._xTextArea = null;
        }
        this._dParagraph.clear();
    },
    }

    setParagraph (iParagraph, sText) {
        if (this._xTextArea !== null) {
            this._dParagraph.set(iParagraph, sText);
        }
    },
    }

    _loadText () {
        let sText = this._xTextArea.value;
        let i = 0;
        let iStart = 0;
        let iEnd = 0;
        sText = sText.replace("\r\n", "\n").replace("\r", "\n");
        while ((iEnd = sText.indexOf("\n", iStart)) !== -1) {
            this._dParagraph.set(i, sText.slice(iStart, iEnd));
            i++;
            iStart = iEnd+1;
        }
        this._dParagraph.set(i, sText.slice(iStart));
        console.log("Paragraphs number: " + (i+1));
    },

    write: function () {
    }

    write () {
        if (this._xTextArea !== null) {
            let sText = "";
            this._dParagraph.forEach(function (val, key) {
                sText += val + "\n";
            });
            this._xTextArea.value = sText.slice(0,-1);
        }
    }
}

Modified gc_lang/fr/webext/content_scripts/lxg_content.js from [f476134195] to [cdbdd25ffd].

1
2
3
4
5

6



7
8


9
10

11
12
13
14
15

16
17
18
19
20
21
22



23
24
25
26
27
28



29
30
31
32



33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49



50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65



66
67
68
69
70
1
2
3
4

5
6
7
8
9


10
11


12



13

14
15
16
17
18



19
20
21
22
23
24



25
26
27
28



29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45



46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61



62
63
64
65
66
67
68
69




-
+

+
+
+
-
-
+
+
-
-
+
-
-
-

-
+




-
-
-
+
+
+



-
-
-
+
+
+

-
-
-
+
+
+














-
-
-
+
+
+













-
-
-
+
+
+





// JavaScript

"use strict";

const oLxgPanelContent = {
class GrammalecteLexicographer extends GrammalectePanel {

    constructor (...args) {
        super(...args);
        this._nCount = 0;
    _xContentNode: createNode("div", {id: "grammalecte_lxg_panel_content"}),

        this._xContentNode = createNode("div", {id: "grammalecte_lxg_panel_content"});
        this.xPanelContent.appendChild(this._xContentNode);
    _nCount: 0,

    }
    init: function () {
        return this._xContentNode;
    },

    clear: function () {
    clear () {
        this._nCount = 0;
        while (this._xContentNode.firstChild) {
            this._xContentNode.removeChild(this._xContentNode.firstChild);
        }
    },

    addSeparator: function (sText) {
    }

    addSeparator (sText) {
        if (this._xContentNode.textContent !== "") {
            this._xContentNode.appendChild(createNode("div", {className: "grammalecte_lxg_separator", textContent: sText}));
        }
    },

    addMessage: function (sClass, sText) {
    }

    addMessage (sClass, sText) {
        this._xContentNode.appendChild(createNode("div", {className: sClass, textContent: sText}));
    },

    addListOfTokens: function (lTokens) {
    }

    addListOfTokens (lTokens) {
        try {
            if (lTokens) {
                this._nCount += 1;
                let xNodeDiv = createNode("div", {className: "grammalecte_lxg_list_of_tokens"});
                xNodeDiv.appendChild(createNode("div", {className: "num", textContent: this._nCount}));
                for (let oToken of lTokens) {
                    xNodeDiv.appendChild(this._createTokenNode(oToken));
                }
                this._xContentNode.appendChild(xNodeDiv);
            }
        }
        catch (e) {
            showError(e);
        }
    },

    _createTokenNode: function (oToken) {
    }

    _createTokenNode (oToken) {
        let xTokenNode = createNode("div", {className: "grammalecte_token"});
        xTokenNode.appendChild(createNode("b", {className: oToken.sType, textContent: oToken.sValue}));
        xTokenNode.appendChild(createNode("s", {textContent: " : "}));
        if (oToken.aLabel.length === 1) {
            xTokenNode.appendChild(document.createTextNode(oToken.aLabel[0]));
        } else {
            let xTokenList = document.createElement("ul");
            for (let sLabel of oToken.aLabel) {
                xTokenList.appendChild(createNode("li", {textContent: sLabel}));
            }
            xTokenNode.appendChild(xTokenList);
        }
        return xTokenNode;
    },

    setHidden: function (sClass, bHidden) {
    }

    setHidden (sClass, bHidden) {
        for (let xNode of document.getElementsByClassName(sClass)) {
            xNode.hidden = bHidden;
        }
    }
}

Modified gc_lang/fr/webext/content_scripts/panels_content.js from [22569e6d7c] to [f6d10a216c].

10
11
12
13
14
15
16
17

18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33

34
35
36
37
38
39
40
10
11
12
13
14
15
16

17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

33
34
35
36
37
38
39
40







-
+















-
+








    constructor (sId, sTitle, nWidth, nHeight, bMovable=true) {
        this.sId = sId;
        this.sContentId = sId+"_content";
        this.nWidth = nWidth;
        this.nHeight = nHeight;
        this.bMovable = bMovable;
        this.xContentNode = createNode("div", {className: "grammalecte_panel_content"});
        this.xPanelContent = createNode("div", {className: "grammalecte_panel_content"});
        this.xWaitIcon = this._createWaitIcon();
        this.xPanelNode = this._createPanel(sTitle);
        this.center();
    }

    _createPanel (sTitle) {
        try {
            let xPanel = createNode("div", {id: this.sId, className: "grammalecte_panel"});
            let xBar = createNode("div", {className: "grammalecte_panel_bar"});
            xBar.appendChild(this._createButtons());
            let xTitle = createNode("div", {className: "grammalecte_panel_title"});
            xTitle.appendChild(createLogo());
            xTitle.appendChild(createNode("div", {className: "grammalecte_panel_label", textContent: sTitle}));
            xBar.appendChild(xTitle);
            xPanel.appendChild(xBar);
            xPanel.appendChild(this.xContentNode);
            xPanel.appendChild(this.xPanelContent);
            return xPanel;
        }
        catch (e) {
            showError(e);
        }
    }

68
69
70
71
72
73
74
75

76
77
78
79
80
81
82
68
69
70
71
72
73
74

75
76
77
78
79
80
81
82







-
+







    _createCloseButton () {
        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.xContentNode.appendChild(xNode);
        this.xPanelContent.appendChild(xNode);
    }

    insertIntoPage () {
        document.body.appendChild(this.xPanelNode);
    }

    show () {
124
125
126
127
128
129
130




131
132
133
134
135
136
137
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141







+
+
+
+







    startWaitIcon () {
        this.xWaitIcon.style.visibility = "visible";
    }

    stopWaitIcon () {
        this.xWaitIcon.style.visibility = "hidden";
    }

    openURL (sURL) {
        // todo
    }
}


/*
    Common functions
*/
function createNode (sType, oAttr, oDataset=null) {

Modified gc_lang/fr/webext/content_scripts/tf_content.js from [c8ae776b2e] to [8d3cbce0ee].

1
2
3
4
5














6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77








































































78
79
80
81
82
83
84
85
86
87
88
89
90











91
92
93
94
95
96
97
98







99
100
101
102
103
104
105
106
107
108
109
110
111











112
113
114
115
116
117
118
119
120
121
122
123
124
125












126
127
128
129
130
131
132
133
134
135
136
137











138
139
140
141
142
143
144












145
146
147
148
149
150
151
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19








































































20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92












93
94
95
96
97
98
99
100
101
102
103
104







105
106
107
108
109
110
111
112
113











114
115
116
117
118
119
120
121
122
123
124
125
126












127
128
129
130
131
132
133
134
135
136
137
138
139











140
141
142
143
144
145
146
147
148
149
150
151






152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170





+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+

-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+

-
-
-
-
-
-
-
+
+
+
+
+
+
+


-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+


-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+

-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+

-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+







// JavaScript
// Text formatter

"use strict";


class GrammalecteTextFormatter extends GrammalectePanel {

    constructor (...args) {
        super(...args);
        this.xTFNode = this._createTextFormatter();
        this.xPanelContent.appendChild(this.xTFNode);
        this.xTextArea = null;
    }

    setTextArea (xTextArea) {
        this.xTextArea = xTextArea;
    }

function createTextFormatter (xTextArea) {
    let xTFNode = document.createElement("div");
    try {
        // Options
        let xOptions = createNode("div", {id: "grammalecte_tf_options"});
        let xColumn1 = createNode("div", {className: "grammalecte_tf_column"});
        let xSSP = createFieldset("group_ssp", true, "Espaces surnuméraires");
        xSSP.appendChild(createOptionInputAndLabel("o_start_of_paragraph", true, "En début de paragraphe"));
        xSSP.appendChild(createOptionInputAndLabel("o_end_of_paragraph", true, "En fin de paragraphe"));
        xSSP.appendChild(createOptionInputAndLabel("o_between_words", true, "Entre les mots"));
        xSSP.appendChild(createOptionInputAndLabel("o_before_punctuation", true, "Avant les points (.), les virgules (,)"));
        xSSP.appendChild(createOptionInputAndLabel("o_within_parenthesis", true, "À l’intérieur des parenthèses"));
        xSSP.appendChild(createOptionInputAndLabel("o_within_square_brackets", true, "À l’intérieur des crochets"));
        xSSP.appendChild(createOptionInputAndLabel("o_within_quotation_marks", true, "À l’intérieur des guillemets “ et ”"));
        let xSpace = createFieldset("group_space", true, "Espaces manquants");
        xSpace.appendChild(createOptionInputAndLabel("o_add_space_after_punctuation", true, "Après , ; : ? ! . …"));
        xSpace.appendChild(createOptionInputAndLabel("o_add_space_around_hyphens", true, "Autour des tirets d’incise"));
        let xNBSP = createFieldset("group_nbsp", true, "Espaces insécables");
        xNBSP.appendChild(createOptionInputAndLabel("o_nbsp_before_punctuation", true, "Avant : ; ? et !"));
        xNBSP.appendChild(createOptionInputAndLabel("o_nbsp_within_quotation_marks", true, "Avec les guillemets « et »"));
        xNBSP.appendChild(createOptionInputAndLabel("o_nbsp_before_symbol", true, "Avant % ‰ € $ £ ¥ ˚C"));
        xNBSP.appendChild(createOptionInputAndLabel("o_nbsp_within_numbers", true, "À l’intérieur des nombres"));
        xNBSP.appendChild(createOptionInputAndLabel("o_nbsp_before_units", true, "Avant les unités de mesure"));
        let xDelete = createFieldset("group_delete", true, "Suppressions");
        xDelete.appendChild(createOptionInputAndLabel("o_erase_non_breaking_hyphens", true, "Tirets conditionnels"));
        let xColumn2 = createNode("div", {className: "grammalecte_tf_column"});
        let xTypo = createFieldset("group_typo", true, "Signes typographiques");
        xTypo.appendChild(createOptionInputAndLabel("o_ts_apostrophe", true, "Apostrophe (’)"));
        xTypo.appendChild(createOptionInputAndLabel("o_ts_ellipsis", true, "Points de suspension (…)"));
        xTypo.appendChild(createOptionInputAndLabel("o_ts_dash_middle", true, "Tirets d’incise :"));
        xTypo.appendChild(createRadioBoxHyphens("hyphen1", "o_ts_m_dash_middle", "o_ts_n_dash_middle", false));
        xTypo.appendChild(createOptionInputAndLabel("o_ts_dash_start", true, "Tirets en début de paragraphe :"));
        xTypo.appendChild(createRadioBoxHyphens("hyphen2", "o_ts_m_dash_start", "o_ts_n_dash_start", true));
        xTypo.appendChild(createOptionInputAndLabel("o_ts_quotation_marks", true, "Modifier les guillemets droits (\" et ')"));
        xTypo.appendChild(createOptionInputAndLabel("o_ts_units", true, "Points médians des unités (N·m, Ω·m…)"));
        xTypo.appendChild(createOptionInputAndLabel("o_ts_spell", true, "Ligatures (cœur…) et diacritiques (ça, État…)"));
        xTypo.appendChild(createRadioBoxLigatures());
        xTypo.appendChild(createLigaturesSelection());
        let xMisc = createFieldset("group_misc", true, "Divers");
        xMisc.appendChild(createOptionInputAndLabel("o_ordinals_no_exponant", true, "Ordinaux (15e, XXIe…)"));
        xMisc.appendChild(createOptionInputAndLabel("o_etc", true, "Et cætera, etc."));
        xMisc.appendChild(createOptionInputAndLabel("o_missing_hyphens", true, "Traits d’union manquants"));
        xMisc.appendChild(createOptionInputAndLabel("o_ma_word", true, "Apostrophes manquantes"));
        let xStruct = createFieldset("group_struct", false, "Restructuration [!]");
        xStruct.appendChild(createOptionInputAndLabel("o_remove_hyphens_at_end_of_paragraphs", false, "Enlever césures en fin de ligne/paragraphe [!]"));
        xStruct.appendChild(createOptionInputAndLabel("o_merge_contiguous_paragraphs", false, "Fusionner les paragraphes contigus [!]"));
        xColumn1.appendChild(xSSP);
        xColumn1.appendChild(xSpace);
        xColumn1.appendChild(xNBSP);
        xColumn1.appendChild(xDelete);
        xColumn2.appendChild(xTypo);
        xColumn2.appendChild(xMisc);
        xColumn2.appendChild(xStruct);
        xOptions.appendChild(xColumn1);
        xOptions.appendChild(xColumn2);
        // Actions
        let xActions = createNode("div", {id: "grammalecte_tf_actions"});
        xActions.appendChild(createNode("div", {id: "grammalecte_tf_reset", textContent: "Par défaut", className: "grammalecte_button", style: "background-color: hsl(210, 50%, 50%)"}));
        xActions.appendChild(createNode("progress", {id: "grammalecte_tf_progressbar"}));
        xActions.appendChild(createNode("span", {id: "grammalecte_tf_time_res"}));
        xActions.appendChild(createNode("div", {id: "grammalecte_tf_apply", textContent: "Appliquer", className: "grammalecte_button", style: "background-color: hsl(180, 50%, 50%)"}));
        //xActions.appendChild(createNode("div", {id: "grammalecte_infomsg", textContent: "blabla"}));
        // create result
        xTFNode.appendChild(xOptions);
        xTFNode.appendChild(xActions);
    }
    catch (e) {
        //console.error(e);
        showError(e);
    }
    return xTFNode;
}
    _createTextFormatter () {
        let xTFNode = document.createElement("div");
        try {
            // Options
            let xOptions = createNode("div", {id: "grammalecte_tf_options"});
            let xColumn1 = createNode("div", {className: "grammalecte_tf_column"});
            let xSSP = this._createFieldset("group_ssp", true, "Espaces surnuméraires");
            xSSP.appendChild(this._createSimpleOption("o_start_of_paragraph", true, "En début de paragraphe"));
            xSSP.appendChild(this._createSimpleOption("o_end_of_paragraph", true, "En fin de paragraphe"));
            xSSP.appendChild(this._createSimpleOption("o_between_words", true, "Entre les mots"));
            xSSP.appendChild(this._createSimpleOption("o_before_punctuation", true, "Avant les points (.), les virgules (,)"));
            xSSP.appendChild(this._createSimpleOption("o_within_parenthesis", true, "À l’intérieur des parenthèses"));
            xSSP.appendChild(this._createSimpleOption("o_within_square_brackets", true, "À l’intérieur des crochets"));
            xSSP.appendChild(this._createSimpleOption("o_within_quotation_marks", true, "À l’intérieur des guillemets “ et ”"));
            let xSpace = this._createFieldset("group_space", true, "Espaces manquants");
            xSpace.appendChild(this._createSimpleOption("o_add_space_after_punctuation", true, "Après , ; : ? ! . …"));
            xSpace.appendChild(this._createSimpleOption("o_add_space_around_hyphens", true, "Autour des tirets d’incise"));
            let xNBSP = this._createFieldset("group_nbsp", true, "Espaces insécables");
            xNBSP.appendChild(this._createSimpleOption("o_nbsp_before_punctuation", true, "Avant : ; ? et !"));
            xNBSP.appendChild(this._createSimpleOption("o_nbsp_within_quotation_marks", true, "Avec les guillemets « et »"));
            xNBSP.appendChild(this._createSimpleOption("o_nbsp_before_symbol", true, "Avant % ‰ € $ £ ¥ ˚C"));
            xNBSP.appendChild(this._createSimpleOption("o_nbsp_within_numbers", true, "À l’intérieur des nombres"));
            xNBSP.appendChild(this._createSimpleOption("o_nbsp_before_units", true, "Avant les unités de mesure"));
            let xDelete = this._createFieldset("group_delete", true, "Suppressions");
            xDelete.appendChild(this._createSimpleOption("o_erase_non_breaking_hyphens", true, "Tirets conditionnels"));
            let xColumn2 = createNode("div", {className: "grammalecte_tf_column"});
            let xTypo = this._createFieldset("group_typo", true, "Signes typographiques");
            xTypo.appendChild(this._createSimpleOption("o_ts_apostrophe", true, "Apostrophe (’)"));
            xTypo.appendChild(this._createSimpleOption("o_ts_ellipsis", true, "Points de suspension (…)"));
            xTypo.appendChild(this._createSimpleOption("o_ts_dash_middle", true, "Tirets d’incise :"));
            xTypo.appendChild(this._createRadioBoxHyphens("hyphen1", "o_ts_m_dash_middle", "o_ts_n_dash_middle", false));
            xTypo.appendChild(this._createSimpleOption("o_ts_dash_start", true, "Tirets en début de paragraphe :"));
            xTypo.appendChild(this._createRadioBoxHyphens("hyphen2", "o_ts_m_dash_start", "o_ts_n_dash_start", true));
            xTypo.appendChild(this._createSimpleOption("o_ts_quotation_marks", true, "Modifier les guillemets droits (\" et ')"));
            xTypo.appendChild(this._createSimpleOption("o_ts_units", true, "Points médians des unités (N·m, Ω·m…)"));
            xTypo.appendChild(this._createSimpleOption("o_ts_spell", true, "Ligatures (cœur…) et diacritiques (ça, État…)"));
            xTypo.appendChild(this._createRadioBoxLigatures());
            xTypo.appendChild(this._createLigaturesSelection());
            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"));
            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);
            xColumn1.appendChild(xNBSP);
            xColumn1.appendChild(xDelete);
            xColumn2.appendChild(xTypo);
            xColumn2.appendChild(xMisc);
            xColumn2.appendChild(xStruct);
            xOptions.appendChild(xColumn1);
            xOptions.appendChild(xColumn2);
            // Actions
            let xActions = createNode("div", {id: "grammalecte_tf_actions"});
            xActions.appendChild(createNode("div", {id: "grammalecte_tf_reset", textContent: "Par défaut", className: "grammalecte_button", style: "background-color: hsl(210, 50%, 50%)"}));
            xActions.appendChild(createNode("progress", {id: "grammalecte_tf_progressbar"}));
            xActions.appendChild(createNode("span", {id: "grammalecte_tf_time_res"}));
            xActions.appendChild(createNode("div", {id: "grammalecte_tf_apply", textContent: "Appliquer", className: "grammalecte_button", style: "background-color: hsl(180, 50%, 50%)"}));
            //xActions.appendChild(createNode("div", {id: "grammalecte_infomsg", textContent: "blabla"}));
            // create result
            xTFNode.appendChild(xOptions);
            xTFNode.appendChild(xActions);
        }
        catch (e) {
            //console.error(e);
            showError(e);
        }
        return xTFNode;
    }


/*
    Common options
*/
function 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}));
    xFieldset.appendChild(xLegend);
    return xFieldset;
}
    /*
        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}));
        xFieldset.appendChild(xLegend);
        return xFieldset;
    }

function createOptionInputAndLabel (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;
}
    _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;
    }


/*
    Hyphens
*/
function 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 (–)"}));
    return xLine;
}
    /*
        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 (–)"}));
        return xLine;
    }


/*
    Ligatures
*/
function createRadioBoxLigatures () {
    let xLine = createNode("div", {className: "blockopt underline"});
    xLine.appendChild(createOptionInputAndLabel("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"}));
    return xLine;
}
    /*
        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"}));
        return xLine;
    }

function createLigaturesSelection () {
    let xLine = createNode("div", {className: "blockopt"});
    xLine.appendChild(createLigatureCheckboxAndLabel("o_ts_ligature_ff", "ff", true));
    xLine.appendChild(createLigatureCheckboxAndLabel("o_ts_ligature_fi", "fi", true));
    xLine.appendChild(createLigatureCheckboxAndLabel("o_ts_ligature_ffi", "ffi", true));
    xLine.appendChild(createLigatureCheckboxAndLabel("o_ts_ligature_fl", "fl", true));
    xLine.appendChild(createLigatureCheckboxAndLabel("o_ts_ligature_ffl", "ffl", true));
    xLine.appendChild(createLigatureCheckboxAndLabel("o_ts_ligature_ft", "ft", true));
    xLine.appendChild(createLigatureCheckboxAndLabel("o_ts_ligature_st", "st", false));
    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));
        return xLine;
    }

function createLigatureCheckboxAndLabel (sId, sLabel, bDefault) {
    let xInlineBlock = createNode("div", {style: "display: inline-block;"});
    xInlineBlock.appendChild(createNode("input", {type: "checkbox", id: sId, className: "option"}, {default: bDefault}));
    xInlineBlock.appendChild(createNode("label", {htmlFor: sId, className: "opt_lbl", textContent: sLabel}));
    return xInlineBlock;
}
    _createLigatureCheckboxAndLabel (sId, sLabel, bDefault) {
        let xInlineBlock = createNode("div", {style: "display: inline-block;"});
        xInlineBlock.appendChild(createNode("input", {type: "checkbox", id: sId, className: "option"}, {default: bDefault}));
        xInlineBlock.appendChild(createNode("label", {htmlFor: sId, className: "opt_lbl", textContent: sLabel}));
        return xInlineBlock;
    }
}

    




let sTFinnerHTML = ' \
<!-- Misc --> \
    <div class="blockopt underline"> \
      <div id="res_o_ordinals_no_exponant" class="result fright"></div> \
      <input type="checkbox" id="o_ordinals_no_exponant" class="option" data-default="true" /> \
      <label for="o_ordinals_no_exponant" class="opt_lbl reducedw" data-l10n-en="tf_ordinals_no_exponant">${tf_ordinals_no_exponant}</label> \