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: fx, trunk
14:53
[fx] gc panel: prevent autorefresh after opening the tooltip check-in: 364440f87f user: olr tags: fx, trunk
14:10
[fx] gc panel: autorefresh as option check-in: a7d3941648 user: olr tags: fx, trunk
Changes

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

   144    144       border-radius: 3px;
   145    145   }
   146    146   div.grammalecte_menu_button:hover {
   147    147       background-color: hsl(210, 80%, 40%);
   148    148   }
   149    149   div.grammalecte_autorefresh_button {
   150    150       display: inline-block;
   151         -    padding: 1px 5px;
          151  +    padding: 0 5px;
   152    152       margin-left: 5px;
   153    153       border-radius: 3px;
   154    154       background-color: hsl(0, 50%, 50%);
   155    155       color: hsl(0, 50%, 96%);
   156    156       opacity: .7;
   157    157   }
   158    158   div.grammalecte_autorefresh_button:hover {

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

    11     11           let xElem = xEvent.target;
    12     12           if (xElem.id) {
    13     13               if (xElem.id.startsWith("grammalecte_sugg")) {
    14     14                   oGrammalecte.oGCPanel.applySuggestion(xElem.id);
    15     15               } else if (xElem.id === "grammalecte_tooltip_ignore") {
    16     16                   oGrammalecte.oGCPanel.ignoreError(xElem.id);
    17     17               } else if (xElem.id.startsWith("grammalecte_check")) {
    18         -                oGrammalecte.oGCPanel.recheckParagraph(parseInt(xElem.dataset.para_num));
           18  +                oGrammalecte.oGCPanel.recheckParagraph(parseInt(xElem.dataset.para_num, 10));
    19     19               } else if (xElem.id.startsWith("grammalecte_hide")) {
    20     20                   xElem.parentNode.parentNode.style.display = "none";
    21     21               } else if (xElem.id.startsWith("grammalecte_err")
    22     22                          && xElem.className !== "grammalecte_error_corrected"
    23     23                          && xElem.className !== "grammalecte_error_ignored") {
    24         -                oGrammalecte.oGCPanel.oTooltip.show(xElem.id);
           24  +                oGrammalecte.oGCPanel.oTooltip.show(xElem.parentNode, xElem.id);
    25     25               } else if (xElem.id === "grammalecte_tooltip_url"  || xElem.id === "grammalecte_tooltip_db_search") {
    26     26                   oGrammalecte.oGCPanel.openURL(xElem.dataset.url);
    27     27               } else {
    28     28                   oGrammalecte.oGCPanel.oTooltip.hide();
    29     29               }
    30     30           } else {
    31     31               oGrammalecte.oGCPanel.oTooltip.hide();
................................................................................
    77     77       createMenu () {
    78     78           this.xMenu = oGrammalecte.createNode("div", {className: "grammalecte_panel_menu"});
    79     79           this.xTFButton = oGrammalecte.createNode("div", {className: "grammalecte_menu_button", textContent: "Formateur de texte"});
    80     80           this.xEditorButton = oGrammalecte.createNode("div", {className: "grammalecte_menu_button", textContent: "Éditeur"});
    81     81           this.xLxgButton = oGrammalecte.createNode("div", {className: "grammalecte_menu_button", textContent: "Lexicographe"});
    82     82           this.xConjButton = oGrammalecte.createNode("div", {className: "grammalecte_menu_button", textContent: "Conjugueur"});
    83     83           this.xLEButton = oGrammalecte.createNode("div", {className: "grammalecte_menu_button", textContent: "•Éditeur lexical•"});
    84         -        this.xAutoRefresh = oGrammalecte.createNode("div", {className: "grammalecte_autorefresh_button", textContent: "AR", title: "Auto-rafraîchissement de la correction grammaticale"})
           84  +        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)"})
    85     85           this.xEditorButton.appendChild(this.xAutoRefresh);
    86     86           this.xTFButton.onclick = () => {
    87     87               if (!this.bWorking) {
    88     88                   oGrammalecte.createTFPanel();
    89     89                   oGrammalecte.oTFPanel.start();
    90     90                   oGrammalecte.oTFPanel.show();
    91     91               }
................................................................................
    92     92           };
    93     93           this.xEditorButton.onclick = () => {
    94     94               if (!this.bWorking) {
    95     95                   this.showEditor();
    96     96               }
    97     97           };
    98     98           this.xAutoRefresh.onclick = () => {
    99         -            console.log("autor");
   100     99               this.bAutoRefresh = !this.bAutoRefresh;
   101    100               this.xAutoRefresh.style.backgroundColor = (this.bAutoRefresh) ? "hsl(150, 50%, 50%)" : "";
   102    101               this.xAutoRefresh.style.color = (this.bAutoRefresh) ? "hsl(150, 50%, 96%)" : "";
   103    102               this.xAutoRefresh.style.opacity = (this.bAutoRefresh) ? "1" : "";
   104         -            console.log("on");
   105    103           }
   106    104           this.xLxgButton.onclick = () => {
   107    105               if (!this.bWorking) {
   108    106                   this.showLexicographer();
   109    107                   this.clearLexicographer();
   110    108                   this.startWaitIcon();
   111    109                   xGrammalectePort.postMessage({
................................................................................
   226    224                   // paragraph
   227    225                   let xParagraph = oGrammalecte.createNode("p", {id: "grammalecte_paragraph"+oResult.iParaNum, className: "grammalecte_paragraph", lang: "fr", contentEditable: "true"}, {para_num: oResult.iParaNum});
   228    226                   xParagraph.setAttribute("spellcheck", "false"); // doesn’t seem possible to use “spellcheck” as a common attribute.
   229    227                   xParagraph.dataset.timer_id = "0";
   230    228                   xParagraph.addEventListener("input", function (xEvent) {
   231    229                       if (this.bAutoRefresh) {
   232    230                           // timer for refreshing analysis
   233         -                        window.clearTimeout(parseInt(xParagraph.dataset.timer_id));
          231  +                        window.clearTimeout(parseInt(xParagraph.dataset.timer_id, 10));
   234    232                           xParagraph.dataset.timer_id = window.setTimeout(this.recheckParagraph.bind(this), 3000, oResult.iParaNum);
   235    233                           // save caret position
   236    234                           let [nStart, nEnd] = oGrammalecte.getCaretPosition(xParagraph);
   237    235                           xParagraph.dataset.caret_position_start = nStart;
   238    236                           xParagraph.dataset.caret_position_end = nEnd;
   239    237                       }
   240    238                       // write text
   241         -                    this.oTextControl.setParagraph(parseInt(xEvent.target.dataset.para_num), this.purgeText(xEvent.target.textContent));
          239  +                    this.oTextControl.setParagraph(parseInt(xEvent.target.dataset.para_num, 10), this.purgeText(xEvent.target.textContent));
   242    240                       this.oTextControl.write();
   243    241                   }.bind(this)
   244    242                   , true);
   245    243                   /*xParagraph.addEventListener("blur", function (xEvent) {
   246    244                       // remove timer for refreshing analysis
   247    245                       window.clearTimeout(parseInt(xParagraph.dataset.timer_id));
   248    246                       // unset caret position
................................................................................
   275    273               dInfo: {sParagraphId: sParagraphId}
   276    274           });
   277    275           this.oTextControl.setParagraph(iParaNum, sText);
   278    276           this.oTextControl.write();
   279    277       }
   280    278   
   281    279       refreshParagraph (sParagraphId, oResult) {
          280  +        // function called when results are sent by the Worker
   282    281           try {
   283    282               let xParagraph = this.xParent.getElementById(sParagraphId);
   284    283               xParagraph.className = (oResult.aGrammErr.length || oResult.aSpellErr.length) ? "grammalecte_paragraph softred" : "grammalecte_paragraph";
   285    284               xParagraph.textContent = "";
   286    285               this._tagParagraph(xParagraph, oResult.sParagraph, sParagraphId.slice(21), oResult.aGrammErr, oResult.aSpellErr);
   287    286               this.freeParagraph(xParagraph);
   288    287           }
................................................................................
   358    357           this.xParent.getElementById("grammalecte_check"+xParagraph.dataset.para_num).style.boxShadow = "0 0 0 3px hsla(0, 0%, 50%, .2)";
   359    358           this.xParent.getElementById("grammalecte_check"+xParagraph.dataset.para_num).style.animation = "grammalecte-pulse 1s linear infinite";
   360    359       }
   361    360   
   362    361       freeParagraph (xParagraph) {
   363    362           xParagraph.contentEditable = "true";
   364    363           if (xParagraph.dataset.caret_position_start !== "-1") {
   365         -            let nStart = parseInt(xParagraph.dataset.caret_position_start);
   366         -            let nEnd = parseInt(xParagraph.dataset.caret_position_end);
          364  +            let nStart = parseInt(xParagraph.dataset.caret_position_start, 10);
          365  +            let nEnd = parseInt(xParagraph.dataset.caret_position_end, 10);
   367    366               oGrammalecte.setCaretPosition(xParagraph, nStart, nEnd);
   368    367           }
   369    368           this.xParent.getElementById("grammalecte_check"+xParagraph.dataset.para_num).textContent = "↻";
   370    369           this.xParent.getElementById("grammalecte_check"+xParagraph.dataset.para_num).style.backgroundColor = "";
   371    370           this.xParent.getElementById("grammalecte_check"+xParagraph.dataset.para_num).style.animation = "";
   372    371           setTimeout(() => { this.xParent.getElementById("grammalecte_check"+xParagraph.dataset.para_num).style.boxShadow = ""; }, 500);
   373    372       }
................................................................................
   377    376               let sErrorId = this.xParent.getElementById(sNodeSuggId).dataset.error_id;
   378    377               //let sParaNum = sErrorId.slice(0, sErrorId.indexOf("-"));
   379    378               let xNodeErr = this.xParent.getElementById("grammalecte_err" + sErrorId);
   380    379               xNodeErr.textContent = this.xParent.getElementById(sNodeSuggId).textContent;
   381    380               xNodeErr.className = "grammalecte_error_corrected";
   382    381               xNodeErr.removeAttribute("style");
   383    382               this.oTooltip.hide();
   384         -            this.recheckParagraph(parseInt(sErrorId.slice(0, sErrorId.indexOf("-"))));
          383  +            this.recheckParagraph(parseInt(sErrorId.slice(0, sErrorId.indexOf("-")), 10));
   385    384           }
   386    385           catch (e) {
   387    386               showError(e);
   388    387           }
   389    388       }
   390    389   
   391    390       ignoreError (sIgnoreButtonId) {  // ignore
................................................................................
   782    781           xActions.appendChild(oGrammalecte.createNode("div", {id: "grammalecte_tooltip_db_search", textContent: " ››› base de données"}, {url: ""}));
   783    782           this.xTooltip.appendChild(xActions);
   784    783           // add tooltip to the page
   785    784           xGCPanelContent.appendChild(this.xTooltip);
   786    785           xGCPanelContent.appendChild(this.xTooltipArrow);
   787    786       }
   788    787   
   789         -    show (sNodeErrorId) {  // err
          788  +    show (xParagraph, sNodeErrorId) {  // err
   790    789           try {
          790  +            // we kill autorefresh for safety
          791  +            window.clearTimeout(parseInt(xParagraph.dataset.timer_id, 10));
          792  +            //
   791    793               let xNodeErr = this.xParent.getElementById(sNodeErrorId);
   792    794               this.sErrorId = xNodeErr.dataset.error_id; // we store error_id here to know if spell_suggestions are given to the right word.
   793    795               let nTooltipLeftLimit = oGrammalecte.oGCPanel.getWidth() - 330; // paragraph width - tooltip width
   794    796               let nArrowLimit = oGrammalecte.oGCPanel.getWidth() - 20;
   795    797               this.xTooltipArrow.style.top = (xNodeErr.offsetTop + 16) + "px";
   796    798               let nUsefulErrorWidth = ((xNodeErr.offsetLeft + xNodeErr.offsetWidth) > nArrowLimit) ? (nArrowLimit - xNodeErr.offsetLeft) : xNodeErr.offsetWidth;
   797    799               this.xTooltipArrow.style.left = (xNodeErr.offsetLeft + Math.floor((nUsefulErrorWidth / 2)) - 4) + "px"; // 4 is half the width of the arrow.