Grammalecte  Check-in [364440f87f]

Overview
Comment:[fx] gc panel: prevent autorefresh after opening the tooltip
Downloads: Tarball | ZIP archive | SQL archive
Timelines: family | ancestors | descendants | both | trunk | fx
Files: files | file ages | folders
SHA3-256: 364440f87f4ac877ce7c973dcd5ce7d3a556fe301da1c764619309262a778768
User & Date: olr on 2019-05-20 14:53:20
Other Links: manifest | tags
Context
2019-05-20
14:57
[fx] gc panel: fix copy to clipboard again check-in: f4a00c03d1 user: olr tags: trunk, fx
14:53
[fx] gc panel: prevent autorefresh after opening the tooltip check-in: 364440f87f user: olr tags: trunk, fx
14:10
[fx] gc panel: autorefresh as option check-in: a7d3941648 user: olr tags: trunk, fx
Changes
Hide Diffs Unified Diffs Ignore Whitespace Patch

Modified gc_lang/fr/webext/content_scripts/panel.css from [6a801a72c8] to [f3523dcadb].

︙︙
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158

    border-radius: 3px;
}
div.grammalecte_menu_button:hover {
    background-color: hsl(210, 80%, 40%);
}
div.grammalecte_autorefresh_button {
    display: inline-block;
    padding: 1px 5px;
    margin-left: 5px;
    border-radius: 3px;
    background-color: hsl(0, 50%, 50%);
    color: hsl(0, 50%, 96%);
    opacity: .7;
}
div.grammalecte_autorefresh_button:hover {








|








144
145
146
147
148
149
150
151
152
153
154
155
156
157
158

    border-radius: 3px;
}
div.grammalecte_menu_button:hover {
    background-color: hsl(210, 80%, 40%);
}
div.grammalecte_autorefresh_button {
    display: inline-block;
    padding: 0 5px;
    margin-left: 5px;
    border-radius: 3px;
    background-color: hsl(0, 50%, 50%);
    color: hsl(0, 50%, 96%);
    opacity: .7;
}
div.grammalecte_autorefresh_button:hover {
︙︙

Modified gc_lang/fr/webext/content_scripts/panel_gc.js from [5417ae779f] to [079c92ab4e].

︙︙
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

        let xElem = xEvent.target;
        if (xElem.id) {
            if (xElem.id.startsWith("grammalecte_sugg")) {
                oGrammalecte.oGCPanel.applySuggestion(xElem.id);
            } else if (xElem.id === "grammalecte_tooltip_ignore") {
                oGrammalecte.oGCPanel.ignoreError(xElem.id);
            } else if (xElem.id.startsWith("grammalecte_check")) {
                oGrammalecte.oGCPanel.recheckParagraph(parseInt(xElem.dataset.para_num));
            } else if (xElem.id.startsWith("grammalecte_hide")) {
                xElem.parentNode.parentNode.style.display = "none";
            } else if (xElem.id.startsWith("grammalecte_err")
                       && xElem.className !== "grammalecte_error_corrected"
                       && xElem.className !== "grammalecte_error_ignored") {
                oGrammalecte.oGCPanel.oTooltip.show(xElem.id);
            } else if (xElem.id === "grammalecte_tooltip_url"  || xElem.id === "grammalecte_tooltip_db_search") {
                oGrammalecte.oGCPanel.openURL(xElem.dataset.url);
            } else {
                oGrammalecte.oGCPanel.oTooltip.hide();
            }
        } else {
            oGrammalecte.oGCPanel.oTooltip.hide();








|





|








11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

        let xElem = xEvent.target;
        if (xElem.id) {
            if (xElem.id.startsWith("grammalecte_sugg")) {
                oGrammalecte.oGCPanel.applySuggestion(xElem.id);
            } else if (xElem.id === "grammalecte_tooltip_ignore") {
                oGrammalecte.oGCPanel.ignoreError(xElem.id);
            } else if (xElem.id.startsWith("grammalecte_check")) {
                oGrammalecte.oGCPanel.recheckParagraph(parseInt(xElem.dataset.para_num, 10));
            } else if (xElem.id.startsWith("grammalecte_hide")) {
                xElem.parentNode.parentNode.style.display = "none";
            } else if (xElem.id.startsWith("grammalecte_err")
                       && xElem.className !== "grammalecte_error_corrected"
                       && xElem.className !== "grammalecte_error_ignored") {
                oGrammalecte.oGCPanel.oTooltip.show(xElem.parentNode, xElem.id);
            } else if (xElem.id === "grammalecte_tooltip_url"  || xElem.id === "grammalecte_tooltip_db_search") {
                oGrammalecte.oGCPanel.openURL(xElem.dataset.url);
            } else {
                oGrammalecte.oGCPanel.oTooltip.hide();
            }
        } else {
            oGrammalecte.oGCPanel.oTooltip.hide();
︙︙
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

    createMenu () {
        this.xMenu = oGrammalecte.createNode("div", {className: "grammalecte_panel_menu"});
        this.xTFButton = oGrammalecte.createNode("div", {className: "grammalecte_menu_button", textContent: "Formateur de texte"});
        this.xEditorButton = oGrammalecte.createNode("div", {className: "grammalecte_menu_button", textContent: "Éditeur"});
        this.xLxgButton = oGrammalecte.createNode("div", {className: "grammalecte_menu_button", textContent: "Lexicographe"});
        this.xConjButton = oGrammalecte.createNode("div", {className: "grammalecte_menu_button", textContent: "Conjugueur"});
        this.xLEButton = oGrammalecte.createNode("div", {className: "grammalecte_menu_button", textContent: "•Éditeur lexical•"});
        this.xAutoRefresh = oGrammalecte.createNode("div", {className: "grammalecte_autorefresh_button", textContent: "AR", title: "Auto-rafraîchissement de la correction grammaticale"})
        this.xEditorButton.appendChild(this.xAutoRefresh);
        this.xTFButton.onclick = () => {
            if (!this.bWorking) {
                oGrammalecte.createTFPanel();
                oGrammalecte.oTFPanel.start();
                oGrammalecte.oTFPanel.show();
            }
        };
        this.xEditorButton.onclick = () => {
            if (!this.bWorking) {
                this.showEditor();
            }
        };
        this.xAutoRefresh.onclick = () => {
            console.log("autor");
            this.bAutoRefresh = !this.bAutoRefresh;
            this.xAutoRefresh.style.backgroundColor = (this.bAutoRefresh) ? "hsl(150, 50%, 50%)" : "";
            this.xAutoRefresh.style.color = (this.bAutoRefresh) ? "hsl(150, 50%, 96%)" : "";
            this.xAutoRefresh.style.opacity = (this.bAutoRefresh) ? "1" : "";
            console.log("on");
        }
        this.xLxgButton.onclick = () => {
            if (!this.bWorking) {
                this.showLexicographer();
                this.clearLexicographer();
                this.startWaitIcon();
                xGrammalectePort.postMessage({








|














<




<








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

    createMenu () {
        this.xMenu = oGrammalecte.createNode("div", {className: "grammalecte_panel_menu"});
        this.xTFButton = oGrammalecte.createNode("div", {className: "grammalecte_menu_button", textContent: "Formateur de texte"});
        this.xEditorButton = oGrammalecte.createNode("div", {className: "grammalecte_menu_button", textContent: "Éditeur"});
        this.xLxgButton = oGrammalecte.createNode("div", {className: "grammalecte_menu_button", textContent: "Lexicographe"});
        this.xConjButton = oGrammalecte.createNode("div", {className: "grammalecte_menu_button", textContent: "Conjugueur"});
        this.xLEButton = oGrammalecte.createNode("div", {className: "grammalecte_menu_button", textContent: "•Éditeur lexical•"});
        this.xAutoRefresh = oGrammalecte.createNode("div", {className: "grammalecte_autorefresh_button", textContent: "AR", title: "Auto-rafraîchissement de la correction grammaticale (3 s après la dernière frappe)"})
        this.xEditorButton.appendChild(this.xAutoRefresh);
        this.xTFButton.onclick = () => {
            if (!this.bWorking) {
                oGrammalecte.createTFPanel();
                oGrammalecte.oTFPanel.start();
                oGrammalecte.oTFPanel.show();
            }
        };
        this.xEditorButton.onclick = () => {
            if (!this.bWorking) {
                this.showEditor();
            }
        };
        this.xAutoRefresh.onclick = () => {

            this.bAutoRefresh = !this.bAutoRefresh;
            this.xAutoRefresh.style.backgroundColor = (this.bAutoRefresh) ? "hsl(150, 50%, 50%)" : "";
            this.xAutoRefresh.style.color = (this.bAutoRefresh) ? "hsl(150, 50%, 96%)" : "";
            this.xAutoRefresh.style.opacity = (this.bAutoRefresh) ? "1" : "";

        }
        this.xLxgButton.onclick = () => {
            if (!this.bWorking) {
                this.showLexicographer();
                this.clearLexicographer();
                this.startWaitIcon();
                xGrammalectePort.postMessage({
︙︙
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248

                // paragraph
                let xParagraph = oGrammalecte.createNode("p", {id: "grammalecte_paragraph"+oResult.iParaNum, className: "grammalecte_paragraph", lang: "fr", contentEditable: "true"}, {para_num: oResult.iParaNum});
                xParagraph.setAttribute("spellcheck", "false"); // doesn’t seem possible to use “spellcheck” as a common attribute.
                xParagraph.dataset.timer_id = "0";
                xParagraph.addEventListener("input", function (xEvent) {
                    if (this.bAutoRefresh) {
                        // timer for refreshing analysis
                        window.clearTimeout(parseInt(xParagraph.dataset.timer_id));
                        xParagraph.dataset.timer_id = window.setTimeout(this.recheckParagraph.bind(this), 3000, oResult.iParaNum);
                        // save caret position
                        let [nStart, nEnd] = oGrammalecte.getCaretPosition(xParagraph);
                        xParagraph.dataset.caret_position_start = nStart;
                        xParagraph.dataset.caret_position_end = nEnd;
                    }
                    // write text
                    this.oTextControl.setParagraph(parseInt(xEvent.target.dataset.para_num), this.purgeText(xEvent.target.textContent));
                    this.oTextControl.write();
                }.bind(this)
                , true);
                /*xParagraph.addEventListener("blur", function (xEvent) {
                    // remove timer for refreshing analysis
                    window.clearTimeout(parseInt(xParagraph.dataset.timer_id));
                    // unset caret position








|







|








224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246

                // paragraph
                let xParagraph = oGrammalecte.createNode("p", {id: "grammalecte_paragraph"+oResult.iParaNum, className: "grammalecte_paragraph", lang: "fr", contentEditable: "true"}, {para_num: oResult.iParaNum});
                xParagraph.setAttribute("spellcheck", "false"); // doesn’t seem possible to use “spellcheck” as a common attribute.
                xParagraph.dataset.timer_id = "0";
                xParagraph.addEventListener("input", function (xEvent) {
                    if (this.bAutoRefresh) {
                        // timer for refreshing analysis
                        window.clearTimeout(parseInt(xParagraph.dataset.timer_id, 10));
                        xParagraph.dataset.timer_id = window.setTimeout(this.recheckParagraph.bind(this), 3000, oResult.iParaNum);
                        // save caret position
                        let [nStart, nEnd] = oGrammalecte.getCaretPosition(xParagraph);
                        xParagraph.dataset.caret_position_start = nStart;
                        xParagraph.dataset.caret_position_end = nEnd;
                    }
                    // write text
                    this.oTextControl.setParagraph(parseInt(xEvent.target.dataset.para_num, 10), this.purgeText(xEvent.target.textContent));
                    this.oTextControl.write();
                }.bind(this)
                , true);
                /*xParagraph.addEventListener("blur", function (xEvent) {
                    // remove timer for refreshing analysis
                    window.clearTimeout(parseInt(xParagraph.dataset.timer_id));
                    // unset caret position
︙︙
275
276
277
278
279
280
281

282
283
284
285
286
287
288

            dInfo: {sParagraphId: sParagraphId}
        });
        this.oTextControl.setParagraph(iParaNum, sText);
        this.oTextControl.write();
    }

    refreshParagraph (sParagraphId, oResult) {

        try {
            let xParagraph = this.xParent.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);
        }








>








273
274
275
276
277
278
279
280
281
282
283
284
285
286
287

            dInfo: {sParagraphId: sParagraphId}
        });
        this.oTextControl.setParagraph(iParaNum, sText);
        this.oTextControl.write();
    }

    refreshParagraph (sParagraphId, oResult) {
        // function called when results are sent by the Worker
        try {
            let xParagraph = this.xParent.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);
        }
︙︙
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391

        this.xParent.getElementById("grammalecte_check"+xParagraph.dataset.para_num).style.boxShadow = "0 0 0 3px hsla(0, 0%, 50%, .2)";
        this.xParent.getElementById("grammalecte_check"+xParagraph.dataset.para_num).style.animation = "grammalecte-pulse 1s linear infinite";
    }

    freeParagraph (xParagraph) {
        xParagraph.contentEditable = "true";
        if (xParagraph.dataset.caret_position_start !== "-1") {
            let nStart = parseInt(xParagraph.dataset.caret_position_start);
            let nEnd = parseInt(xParagraph.dataset.caret_position_end);
            oGrammalecte.setCaretPosition(xParagraph, nStart, nEnd);
        }
        this.xParent.getElementById("grammalecte_check"+xParagraph.dataset.para_num).textContent = "↻";
        this.xParent.getElementById("grammalecte_check"+xParagraph.dataset.para_num).style.backgroundColor = "";
        this.xParent.getElementById("grammalecte_check"+xParagraph.dataset.para_num).style.animation = "";
        setTimeout(() => { this.xParent.getElementById("grammalecte_check"+xParagraph.dataset.para_num).style.boxShadow = ""; }, 500);
    }

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

    ignoreError (sIgnoreButtonId) {  // ignore








|
|

















|








357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390

        this.xParent.getElementById("grammalecte_check"+xParagraph.dataset.para_num).style.boxShadow = "0 0 0 3px hsla(0, 0%, 50%, .2)";
        this.xParent.getElementById("grammalecte_check"+xParagraph.dataset.para_num).style.animation = "grammalecte-pulse 1s linear infinite";
    }

    freeParagraph (xParagraph) {
        xParagraph.contentEditable = "true";
        if (xParagraph.dataset.caret_position_start !== "-1") {
            let nStart = parseInt(xParagraph.dataset.caret_position_start, 10);
            let nEnd = parseInt(xParagraph.dataset.caret_position_end, 10);
            oGrammalecte.setCaretPosition(xParagraph, nStart, nEnd);
        }
        this.xParent.getElementById("grammalecte_check"+xParagraph.dataset.para_num).textContent = "↻";
        this.xParent.getElementById("grammalecte_check"+xParagraph.dataset.para_num).style.backgroundColor = "";
        this.xParent.getElementById("grammalecte_check"+xParagraph.dataset.para_num).style.animation = "";
        setTimeout(() => { this.xParent.getElementById("grammalecte_check"+xParagraph.dataset.para_num).style.boxShadow = ""; }, 500);
    }

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

    ignoreError (sIgnoreButtonId) {  // ignore
︙︙
782
783
784
785
786
787
788
789
790



791
792
793
794
795
796
797

        xActions.appendChild(oGrammalecte.createNode("div", {id: "grammalecte_tooltip_db_search", textContent: " ››› base de données"}, {url: ""}));
        this.xTooltip.appendChild(xActions);
        // add tooltip to the page
        xGCPanelContent.appendChild(this.xTooltip);
        xGCPanelContent.appendChild(this.xTooltipArrow);
    }

    show (sNodeErrorId) {  // err
        try {



            let xNodeErr = this.xParent.getElementById(sNodeErrorId);
            this.sErrorId = xNodeErr.dataset.error_id; // we store error_id here to know if spell_suggestions are given to the right word.
            let nTooltipLeftLimit = oGrammalecte.oGCPanel.getWidth() - 330; // paragraph width - tooltip width
            let nArrowLimit = oGrammalecte.oGCPanel.getWidth() - 20;
            this.xTooltipArrow.style.top = (xNodeErr.offsetTop + 16) + "px";
            let nUsefulErrorWidth = ((xNodeErr.offsetLeft + xNodeErr.offsetWidth) > nArrowLimit) ? (nArrowLimit - xNodeErr.offsetLeft) : xNodeErr.offsetWidth;
            this.xTooltipArrow.style.left = (xNodeErr.offsetLeft + Math.floor((nUsefulErrorWidth / 2)) - 4) + "px"; // 4 is half the width of the arrow.








|

>
>
>








781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799

        xActions.appendChild(oGrammalecte.createNode("div", {id: "grammalecte_tooltip_db_search", textContent: " ››› base de données"}, {url: ""}));
        this.xTooltip.appendChild(xActions);
        // add tooltip to the page
        xGCPanelContent.appendChild(this.xTooltip);
        xGCPanelContent.appendChild(this.xTooltipArrow);
    }

    show (xParagraph, sNodeErrorId) {  // err
        try {
            // we kill autorefresh for safety
            window.clearTimeout(parseInt(xParagraph.dataset.timer_id, 10));
            //
            let xNodeErr = this.xParent.getElementById(sNodeErrorId);
            this.sErrorId = xNodeErr.dataset.error_id; // we store error_id here to know if spell_suggestions are given to the right word.
            let nTooltipLeftLimit = oGrammalecte.oGCPanel.getWidth() - 330; // paragraph width - tooltip width
            let nArrowLimit = oGrammalecte.oGCPanel.getWidth() - 20;
            this.xTooltipArrow.style.top = (xNodeErr.offsetTop + 16) + "px";
            let nUsefulErrorWidth = ((xNodeErr.offsetLeft + xNodeErr.offsetWidth) > nArrowLimit) ? (nArrowLimit - xNodeErr.offsetLeft) : xNodeErr.offsetWidth;
            this.xTooltipArrow.style.left = (xNodeErr.offsetLeft + Math.floor((nUsefulErrorWidth / 2)) - 4) + "px"; // 4 is half the width of the arrow.
︙︙

Fossil 2.20 [210e89a059] 2022-11-16 18:46:32
This page was generated in about 0.006s