Grammalecte  Check-in [5033db6633]

Overview
Comment:[fx] gc panel ui, tooltip: go to the db in debug mode
Downloads: Tarball | ZIP archive | SQL archive
Timelines: family | ancestors | descendants | both | trunk | fx
Files: files | file ages | folders
SHA3-256: 5033db6633b7eb22c02f14aba993b2e14d06ddcd64e3cd9173b7d6a43b7fd654
User & Date: olr on 2018-06-10 11:04:30
Other Links: manifest | tags
Context
2018-06-11
18:27
[fr] faux positifs: en x secondes check-in: 86f910ec5e user: olr tags: fr, trunk
2018-06-10
11:04
[fx] gc panel ui, tooltip: go to the db in debug mode check-in: 5033db6633 user: olr tags: fx, trunk
10:27
[fr] loc: vache à lait, pt: talons aiguilles check-in: c9c17e63a6 user: olr tags: fr, trunk
Changes

Modified gc_lang/fr/webext/content_scripts/panel_gc.css from [f78a7fe249] to [a76956d409].

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
    text-decoration: none;
}
div#grammalecte_tooltip_ignore:hover {
    background-color: hsl(30, 30%, 50%);
    color: hsla(0, 0%, 100%, 1);
    text-shadow: 0 0 3px hsl(30, 30%, 60%);
}
div#grammalecte_tooltip_url {
    display: inline-block;
    margin-left: 10px;
    padding: 1px 5px;
    background-color: hsl(210, 50%, 50%);
    color: hsla(210, 0%, 96%, 1);
    border-radius: 2px;
    cursor: pointer;
    font-family: Tahoma, "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", sans-serif;
    font-size: 12px;
    text-decoration: none;
}
div#grammalecte_tooltip_url:hover {
    background-color: hsl(210, 50%, 60%);
    color: hsla(0, 0%, 100%, 1);
    text-shadow: 0 0 3px hsl(210, 30%, 60%);
}

div#grammalecte_tooltip_sugg_title {
    padding: 0 10px;
    background-color: hsl(210, 10%, 90%);
    color: hsl(210, 50%, 30%);
    font-family: Tahoma, "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", sans-serif;
    font-size: 10px;
    font-weight: bold;







|











|




>







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
    text-decoration: none;
}
div#grammalecte_tooltip_ignore:hover {
    background-color: hsl(30, 30%, 50%);
    color: hsla(0, 0%, 100%, 1);
    text-shadow: 0 0 3px hsl(30, 30%, 60%);
}
div#grammalecte_tooltip_url, div#grammalecte_tooltip_db_search {
    display: inline-block;
    margin-left: 10px;
    padding: 1px 5px;
    background-color: hsl(210, 50%, 50%);
    color: hsla(210, 0%, 96%, 1);
    border-radius: 2px;
    cursor: pointer;
    font-family: Tahoma, "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", sans-serif;
    font-size: 12px;
    text-decoration: none;
}
div#grammalecte_tooltip_url:hover, div#grammalecte_tooltip_db_search:hover {
    background-color: hsl(210, 50%, 60%);
    color: hsla(0, 0%, 100%, 1);
    text-shadow: 0 0 3px hsl(210, 30%, 60%);
}

div#grammalecte_tooltip_sugg_title {
    padding: 0 10px;
    background-color: hsl(210, 10%, 90%);
    color: hsl(210, 50%, 30%);
    font-family: Tahoma, "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", sans-serif;
    font-size: 10px;
    font-weight: bold;

Modified gc_lang/fr/webext/content_scripts/panel_gc.js from [05262fe90b] to [1162a03a3e].

14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
...
282
283
284
285
286
287
288

289
290
291
292
293
294
295
...
301
302
303
304
305
306
307

308
309
310
311
312
313
314
...
320
321
322
323
324
325
326
327
328

329
330
331
332
333
334

335
336
337
338
339
340
341
...
358
359
360
361
362
363
364
365
366
367

368
369
370
371
372
373
374
375
376
                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") {
                oGrammalecte.oGCPanel.openURL(xElem.dataset.url);
            } else {
                oGrammalecte.oGCPanel.oTooltip.hide();
            }
        } else {
            oGrammalecte.oGCPanel.oTooltip.hide();
        }
................................................................................
}


class GrammalecteTooltip {

    constructor (xContentNode) {
        this.sErrorId = null;

        this.xTooltip = oGrammalecte.createNode("div", {id: "grammalecte_tooltip"});
        this.xTooltipArrow = oGrammalecte.createNode("img", {
            id: "grammalecte_tooltip_arrow",
            src: " data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwAAADsABataJCQAAABl0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMC4xNzNun2MAAAAnSURBVChTY/j//z8cq/kW/wdhZDEMSXRFWCVhGKwAmwQyHngFxf8B5fOGYfeFpYoAAAAASUVORK5CYII=",
            alt: "^",
        });
        // message
................................................................................
        this.xTooltip.appendChild(oGrammalecte.createNode("div", {id: "grammalecte_tooltip_sugg_title", textContent: "SUGGESTIONS :"}));
        this.xTooltipSuggBlock = oGrammalecte.createNode("div", {id: "grammalecte_tooltip_sugg_block"});
        this.xTooltip.appendChild(this.xTooltipSuggBlock);
        // actions
        let xActions = oGrammalecte.createNode("div", {id: "grammalecte_tooltip_actions"});
        xActions.appendChild(oGrammalecte.createNode("div", {id: "grammalecte_tooltip_ignore", textContent: "Ignorer"}));
        xActions.appendChild(oGrammalecte.createNode("div", {id: "grammalecte_tooltip_url", textContent: "Voulez-vous en savoir plus ?…"}, {url: ""}));

        this.xTooltip.appendChild(xActions);
        // add tooltip to the page
        xContentNode.appendChild(this.xTooltip);
        xContentNode.appendChild(this.xTooltipArrow);
    }

    show (sNodeErrorId) {  // err
................................................................................
            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.
            this.xTooltip.style.top = (xNodeErr.offsetTop + 20) + "px";
            this.xTooltip.style.left = (xNodeErr.offsetLeft > nTooltipLeftLimit) ? nTooltipLeftLimit + "px" : xNodeErr.offsetLeft + "px";
            if (xNodeErr.dataset.error_type === "grammar") {
                // grammar error
                document.getElementById("grammalecte_tooltip_add_word").style.display = "none";
                if (xNodeErr.dataset.gc_message.includes(" ##")) {

                    // display rule id
                    let n = xNodeErr.dataset.gc_message.indexOf(" ##");
                    document.getElementById("grammalecte_tooltip_message").textContent = xNodeErr.dataset.gc_message.slice(0, n);
                    document.getElementById("grammalecte_tooltip_rule_id").textContent = "Règle : " + xNodeErr.dataset.gc_message.slice(n+2);
                    document.getElementById("grammalecte_tooltip_rule_id").style.display = "block";
                } else {

                    document.getElementById("grammalecte_tooltip_message").textContent = xNodeErr.dataset.gc_message;
                    document.getElementById("grammalecte_tooltip_rule_id").style.display = "none";
                }
                if (xNodeErr.dataset.gc_url != "") {
                    document.getElementById("grammalecte_tooltip_url").dataset.url = xNodeErr.dataset.gc_url;
                    document.getElementById("grammalecte_tooltip_url").style.display = "inline";
                } else {
................................................................................
            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;
                document.getElementById("grammalecte_tooltip_rule_id").style.display = "none";
                document.getElementById("grammalecte_tooltip_url").dataset.url = "";
                document.getElementById("grammalecte_tooltip_url").style.display = "none";
                if (xNodeErr.dataset.gc_message.includes(" ##")) {
                    // display rule id
                    document.getElementById("grammalecte_tooltip_add_word").style.display = "block";

                } else {
                    document.getElementById("grammalecte_tooltip_add_word").style.display = "none";
                }
                this.clearSuggestionBlock();
                this.xTooltipSuggBlock.textContent = "Recherche de graphies possibles…";
                xGrammalectePort.postMessage({
                    sCommand: "getSpellSuggestions",
                    dParam: {sWord: xNodeErr.textContent},
                    dInfo: {sErrorId: xNodeErr.dataset.error_id}







|







 







>







 







>







 







|

>






>







 







|
<
|
>

|







14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
...
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
...
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
...
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
...
362
363
364
365
366
367
368
369

370
371
372
373
374
375
376
377
378
379
380
                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();
        }
................................................................................
}


class GrammalecteTooltip {

    constructor (xContentNode) {
        this.sErrorId = null;
        this.bDebug = false;
        this.xTooltip = oGrammalecte.createNode("div", {id: "grammalecte_tooltip"});
        this.xTooltipArrow = oGrammalecte.createNode("img", {
            id: "grammalecte_tooltip_arrow",
            src: " data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwAAADsABataJCQAAABl0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMC4xNzNun2MAAAAnSURBVChTY/j//z8cq/kW/wdhZDEMSXRFWCVhGKwAmwQyHngFxf8B5fOGYfeFpYoAAAAASUVORK5CYII=",
            alt: "^",
        });
        // message
................................................................................
        this.xTooltip.appendChild(oGrammalecte.createNode("div", {id: "grammalecte_tooltip_sugg_title", textContent: "SUGGESTIONS :"}));
        this.xTooltipSuggBlock = oGrammalecte.createNode("div", {id: "grammalecte_tooltip_sugg_block"});
        this.xTooltip.appendChild(this.xTooltipSuggBlock);
        // actions
        let xActions = oGrammalecte.createNode("div", {id: "grammalecte_tooltip_actions"});
        xActions.appendChild(oGrammalecte.createNode("div", {id: "grammalecte_tooltip_ignore", textContent: "Ignorer"}));
        xActions.appendChild(oGrammalecte.createNode("div", {id: "grammalecte_tooltip_url", textContent: "Voulez-vous en savoir plus ?…"}, {url: ""}));
        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
        xContentNode.appendChild(this.xTooltip);
        xContentNode.appendChild(this.xTooltipArrow);
    }

    show (sNodeErrorId) {  // err
................................................................................
            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.
            this.xTooltip.style.top = (xNodeErr.offsetTop + 20) + "px";
            this.xTooltip.style.left = (xNodeErr.offsetLeft > nTooltipLeftLimit) ? nTooltipLeftLimit + "px" : xNodeErr.offsetLeft + "px";
            if (xNodeErr.dataset.error_type === "grammar") {
                // grammar error
                document.getElementById("grammalecte_tooltip_db_search").style.display = "none";
                if (xNodeErr.dataset.gc_message.includes(" ##")) {
                    this.bDebug = true;
                    // display rule id
                    let n = xNodeErr.dataset.gc_message.indexOf(" ##");
                    document.getElementById("grammalecte_tooltip_message").textContent = xNodeErr.dataset.gc_message.slice(0, n);
                    document.getElementById("grammalecte_tooltip_rule_id").textContent = "Règle : " + xNodeErr.dataset.gc_message.slice(n+2);
                    document.getElementById("grammalecte_tooltip_rule_id").style.display = "block";
                } else {
                    this.bDebug = false;
                    document.getElementById("grammalecte_tooltip_message").textContent = xNodeErr.dataset.gc_message;
                    document.getElementById("grammalecte_tooltip_rule_id").style.display = "none";
                }
                if (xNodeErr.dataset.gc_url != "") {
                    document.getElementById("grammalecte_tooltip_url").dataset.url = xNodeErr.dataset.gc_url;
                    document.getElementById("grammalecte_tooltip_url").style.display = "inline";
                } else {
................................................................................
            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;
                document.getElementById("grammalecte_tooltip_rule_id").style.display = "none";
                document.getElementById("grammalecte_tooltip_url").dataset.url = "";
                document.getElementById("grammalecte_tooltip_url").style.display = "none";
                if (this.bDebug) {

                    document.getElementById("grammalecte_tooltip_db_search").style.display = "inline";
                    document.getElementById("grammalecte_tooltip_db_search").dataset.url = "https://www.dicollecte.org/dictionary.php?prj=fr&lemma="+xNodeErr.textContent;
                } else {
                    document.getElementById("grammalecte_tooltip_db_search").style.display = "none";
                }
                this.clearSuggestionBlock();
                this.xTooltipSuggBlock.textContent = "Recherche de graphies possibles…";
                xGrammalectePort.postMessage({
                    sCommand: "getSpellSuggestions",
                    dParam: {sWord: xNodeErr.textContent},
                    dInfo: {sErrorId: xNodeErr.dataset.error_id}