Overview
Comment: | [fx] wait icon + clean CSS |
---|---|
Downloads: | Tarball | ZIP archive | SQL archive |
Timelines: | family | ancestors | descendants | both | fx | webext2 |
Files: | files | file ages | folders |
SHA3-256: |
85960e8bc689b6dc17e5bd7ac71d1e52 |
User & Date: | olr on 2017-08-16 13:47:47 |
Other Links: | branch diff | manifest | tags |
Context
2017-08-16
| ||
13:52 | [fx] rename files for panels in content_scripts check-in: 0bd2645425 user: olr tags: fx, webext2 | |
13:47 | [fx] wait icon + clean CSS check-in: 85960e8bc6 user: olr tags: fx, webext2 | |
12:25 | [fx] grammar checking ui check-in: 11aef9ec2a user: olr tags: fx, webext2 | |
Changes
Modified gc_lang/fr/webext/content_scripts/content_modifier.js from [1969da4c97] to [1ff5fd0533].
︙ | ︙ | |||
55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 | let xConjButton = createNode("div", {className: "grammalecte_wrapper_button", textContent: "Conjuguer"}); xConjButton.onclick = function() { createConjPanel(); }; let xTFButton = createNode("div", {className: "grammalecte_wrapper_button", textContent: "Formater"}); xTFButton.onclick = function() { createTFPanel(xTextArea); }; let xLxgButton = createNode("div", {className: "grammalecte_wrapper_button", textContent: "Analyser"}); xLxgButton.onclick = function() { createLxgPanel(); xPort.postMessage({ sCommand: "getListOfTokens", dParam: {sText: xTextArea.value}, dInfo: {sTextAreaId: xTextArea.id} }); }; let xGCButton = createNode("div", {className: "grammalecte_wrapper_button", textContent: "Corriger"}); xGCButton.onclick = function() { createGCPanel(); xPort.postMessage({ sCommand: "parseAndSpellcheck", dParam: {sText: xTextArea.value, sCountry: "FR", bDebug: false, bContext: false}, dInfo: {sTextAreaId: xTextArea.id} }); }; // Create | > > | 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 | let xConjButton = createNode("div", {className: "grammalecte_wrapper_button", textContent: "Conjuguer"}); xConjButton.onclick = function() { createConjPanel(); }; let xTFButton = createNode("div", {className: "grammalecte_wrapper_button", textContent: "Formater"}); xTFButton.onclick = function() { createTFPanel(xTextArea); }; let xLxgButton = createNode("div", {className: "grammalecte_wrapper_button", textContent: "Analyser"}); xLxgButton.onclick = function() { createLxgPanel(); oLxgPanel.startWaitIcon(); xPort.postMessage({ sCommand: "getListOfTokens", dParam: {sText: xTextArea.value}, dInfo: {sTextAreaId: xTextArea.id} }); }; let xGCButton = createNode("div", {className: "grammalecte_wrapper_button", textContent: "Corriger"}); xGCButton.onclick = function() { createGCPanel(); oGCPanel.startWaitIcon(); xPort.postMessage({ sCommand: "parseAndSpellcheck", dParam: {sText: xTextArea.value, sCountry: "FR", bDebug: false, bContext: false}, dInfo: {sTextAreaId: xTextArea.id} }); }; // Create |
︙ | ︙ | |||
158 159 160 161 162 163 164 | /* Connexion to the background */ let xPort = browser.runtime.connect({name: "content-script port"}); xPort.onMessage.addListener(function (oMessage) { console.log("[Content script] received…"); | | > | > > > > | > > > | 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 | /* Connexion to the background */ let xPort = browser.runtime.connect({name: "content-script port"}); xPort.onMessage.addListener(function (oMessage) { console.log("[Content script] received…"); let {sActionDone, result, dInfo, bEnd, bError} = oMessage; switch (sActionDone) { 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); } else { oGCPanel.stopWaitIcon(); } break; case "parseAndSpellcheck1": console.log("[content script] received: parseAndSpellcheck1"); oGCPanelContent.refreshParagraph(dInfo.sParagraphId, result); break; case "getListOfTokens": console.log("[content script] received: getListOfTokens"); if (!bEnd) { oLxgPanelContent.addListOfTokens(result); } else { oLxgPanel.stopWaitIcon(); } break; default: console.log("[Content script] Unknown command: " + sActionDone); } }); xPort.postMessage({ |
︙ | ︙ |
Modified gc_lang/fr/webext/content_scripts/content_panels.css from [5e96b80380] to [55ab39f57b].
︙ | ︙ | |||
107 108 109 110 111 112 113 | /* CSS Spinner Double bounce http://tobiasahlin.com/spinkit/ */ .grammalecte_spinner { | > | | | | | | 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 | /* CSS Spinner Double bounce http://tobiasahlin.com/spinkit/ */ .grammalecte_spinner { visibility: hidden; width: 40px; height: 40px; position: absolute; top: 2px; right: 150px; } .grammalecte_spinner .bounce1, .grammalecte_spinner .bounce2 { width: 100%; height: 100%; border-radius: 50%; background-color: hsl(0, 50%, 75%); opacity: 0.6; position: absolute; top: 0; left: 0; animation: grammalecte-sk-bounce 2.0s infinite ease-in-out; } .grammalecte_spinner .bounce2 { animation-delay: -1.0s; } @keyframes grammalecte-sk-bounce { 0%, 100% { transform: scale(0.0); } 50% { |
︙ | ︙ |
Modified gc_lang/fr/webext/content_scripts/gc_content.css from [d24d4af48c] to [d58e7acde2].
1 2 3 4 5 6 7 8 | /* Grammar checker */ #grammalecte_gc_panel_content { padding: 5px; } .grammalecte_paragraph_block { | | | | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | /* Grammar checker */ #grammalecte_gc_panel_content { padding: 5px; } .grammalecte_paragraph_block { margin-bottom: 5px; } .grammalecte_paragraph { background-color: hsl(0, 0%, 96%); padding: 10px; border-radius: 2px; font-size: 14px; font-family : "Courier New", Courier, "Lucida Sans Typewriter", "Lucida Typewriter", monospace; color: hsl(0, 0%, 0%); } |
︙ | ︙ | |||
53 54 55 56 57 58 59 | border-radius: 2px; text-decoration: none; /* to remove for wavy underlines */ } .grammalecte_paragraph u.error:hover { cursor: pointer; } | < < < < < < < < < < < < < < < < < < | | | | | | | | | | | 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 | border-radius: 2px; text-decoration: none; /* to remove for wavy underlines */ } .grammalecte_paragraph u.error:hover { cursor: pointer; } /* Action buttons */ .grammalecte_paragraph_actions { float: right; margin: 0 0 5px 10px; } .grammalecte_paragraph_actions .button { display: inline-block; background-color: hsl(0, 0%, 50%); text-align: center; margin-left: 2px; padding: 1px 4px 3px 4px; cursor: pointer; font-size: 14px; color: hsl(0, 0%, 96%); border-radius: 2px; } .grammalecte_paragraph_actions .button:hover { background-color: hsl(0, 0%, 40%); color: hsl(0, 0%, 100%); } .grammalecte_paragraph_actions .green { background-color: hsl(120, 30%, 50%); color: hsl(0, 0%, 96%); } .grammalecte_paragraph_actions .green:hover { background-color: hsl(120, 50%, 40%); color: hsl(0, 0%, 100%); } .grammalecte_paragraph_actions .red { background-color: hsl(0, 30%, 50%); color: hsl(0, 0%, 96%); } .grammalecte_paragraph_actions .red:hover { background-color: hsl(0, 50%, 40%); color: hsl(0, 0%, 100%); } .grammalecte_paragraph_actions .orange { background-color: hsl(30, 50%, 50%); color: hsl(30, 0%, 96%); } .grammalecte_paragraph_actions .orange:hover { background-color: hsl(30, 70%, 40%); color: hsl(30, 0%, 100%); } .grammalecte_paragraph_actions .bold { font-weight: bold; } /* TOOLTIP |
︙ | ︙ | |||
224 225 226 227 228 229 230 | text-decoration: none; } #grammalecte_tooltip_sugg_block a.sugg:hover { background-color: hsla(180, 70%, 45%, 1); color: hsla(0, 0%, 100%, 1); } | < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < | 206 207 208 209 210 211 212 213 214 215 216 217 218 219 | text-decoration: none; } #grammalecte_tooltip_sugg_block a.sugg:hover { background-color: hsla(180, 70%, 45%, 1); color: hsla(0, 0%, 100%, 1); } /* ERRORS */ .grammalecte_paragraph .error { /* default color */ |
︙ | ︙ |
Modified gc_lang/fr/webext/content_scripts/gc_content.js from [66b9da98ef] to [cf017aaf08].
︙ | ︙ | |||
70 71 72 73 74 75 76 | }, addParagraphResult: function (oResult) { try { if (oResult) { let xNodeDiv = createNode("div", {className: "grammalecte_paragraph_block"}); // actions | | | 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 | }, addParagraphResult: function (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.sParaNum, className: "button green", textContent: "Réanalyser"})); xActionsBar.appendChild(createNode("div", {id: "grammalecte_hide" + oResult.sParaNum, className: "button red bold", textContent: "×"})); // paragraph let xParagraph = createNode("p", {id: "grammalecte_paragraph"+oResult.sParaNum, lang: "fr", contentEditable: "true"}); xParagraph.setAttribute("spellcheck", "false"); // doesn’t seem possible to use “spellcheck” as a common attribute. xParagraph.className = (oResult.aGrammErr.length || oResult.aSpellErr.length) ? "grammalecte_paragraph softred" : "grammalecte_paragraph"; this._tagParagraph(xParagraph, oResult.sParagraph, oResult.sParaNum, oResult.aGrammErr, oResult.aSpellErr); |
︙ | ︙ |
Modified gc_lang/fr/webext/content_scripts/panel_creator.js from [9dd9e3dd31] to [22569e6d7c].
︙ | ︙ | |||
11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | 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.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"}); | > < < < < < < < < < | < > > > > > > > | 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 | 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.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); return xPanel; } catch (e) { showError(e); } } _createButtons () { let xButtonLine = createNode("div", {className: "grammalecte_panel_commands"}); xButtonLine.appendChild(this.xWaitIcon); if (this.bMovable) { xButtonLine.appendChild(this._createMoveButton("stickToTop", "¯", "Coller en haut")); xButtonLine.appendChild(this._createMoveButton("stickToLeft", "«", "Coller à gauche")); xButtonLine.appendChild(this._createMoveButton("center", "•", "Centrer")); xButtonLine.appendChild(this._createMoveButton("stickToRight", "»", "Coller à droite")); xButtonLine.appendChild(this._createMoveButton("stickToBottom", "_", "Coller en bas")); } xButtonLine.appendChild(this._createCloseButton()); return xButtonLine; } _createWaitIcon () { let xWaitIcon = createNode("div", {className: "grammalecte_spinner"}); xWaitIcon.appendChild(createNode("div", {className: "bounce1"})); xWaitIcon.appendChild(createNode("div", {className: "bounce2"})); return xWaitIcon; } _createMoveButton (sAction, sLabel, sTitle) { let xButton = createNode("div", {className: "grammalecte_move_button", textContent: sLabel, title: sTitle}); xButton.onclick = function () { this[sAction](); }.bind(this); return xButton; } |
︙ | ︙ | |||
120 121 122 123 124 125 126 | logInnerHTML () { // for debugging console.log(this.xPanelNode.innerHTML); } startWaitIcon () { | | | | 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 | logInnerHTML () { // for debugging console.log(this.xPanelNode.innerHTML); } startWaitIcon () { this.xWaitIcon.style.visibility = "visible"; } stopWaitIcon () { this.xWaitIcon.style.visibility = "hidden"; } } /* Common functions */ |
︙ | ︙ |