Many hyperlinks are disabled.
Use anonymous login
to enable hyperlinks.
Overview
| Comment: | [fx] position and size of panels |
|---|---|
| Downloads: | Tarball | ZIP archive | SQL archive |
| Timelines: | family | ancestors | descendants | both | trunk | fx |
| Files: | files | file ages | folders |
| SHA3-256: |
eb18e7fd4bf0d88822bf86e4833a2c26 |
| User & Date: | olr 2019-05-15 16:12:22 |
Context
|
2019-05-15
| ||
| 19:11 | [fr] nr da: le/la/l’/les check-in: fbf99ca531 user: olr tags: fr, trunk | |
| 16:12 | [fx] position and size of panels check-in: eb18e7fd4b user: olr tags: fx, trunk | |
| 11:55 | [graphspell][core][fr] code cleaning (pylint) check-in: c65b7e2b8b user: olr tags: core, fr, graphspell, trunk | |
Changes
Changes to gc_lang/fr/webext/content_scripts/init.js.
142 142 this.oTFPanel = new GrammalecteTextFormatter("grammalecte_tf_panel", "Formateur de texte", 760, 595, false); 143 143 this.oTFPanel.insertIntoPage(); 144 144 } 145 145 }, 146 146 147 147 createGCPanel: function () { 148 148 if (this.oGCPanel === null) { 149 - this.oGCPanel = new GrammalecteGrammarChecker("grammalecte_gc_panel", "Grammalecte", 540, 700); 149 + this.oGCPanel = new GrammalecteGrammarChecker("grammalecte_gc_panel", "Grammalecte", 540, 950); 150 150 this.oGCPanel.insertIntoPage(); 151 151 } 152 152 }, 153 153 154 154 createMessageBox: function () { 155 155 if (this.oMessageBox === null) { 156 156 this.oMessageBox = new GrammalecteMessageBox("grammalecte_message_box", "Grammalecte");
Changes to gc_lang/fr/webext/content_scripts/panel.js.
11 11 class GrammalectePanel { 12 12 13 13 constructor (sId, sTitle, nWidth, nHeight, bFlexible=true) { 14 14 this.sId = sId; 15 15 this.nWidth = nWidth; 16 16 this.nHeight = nHeight; 17 17 this.bFlexible = bFlexible; 18 + this.bHorizStrech = false; 19 + this.bVertStrech = false; 20 + this.nPositionX = 2; 21 + this.nPositionY = 2; 18 22 this.bWorking = false; 19 23 20 24 this.bShadow = document.body.createShadowRoot || document.body.attachShadow; 21 25 if (this.bShadow) { 22 26 this.xShadowPanel = oGrammalecte.createNode("div", {id: this.sId+"_shadow", style: "width:0;height:0;"}); 23 27 this.xShadow = this.xShadowPanel.attachShadow({mode: "open"}); 24 28 this.xParent = this.xShadow; ................................................................................ 62 66 63 67 _createButtons () { 64 68 let xButtonLine = oGrammalecte.createNode("div", {className: "grammalecte_panel_commands"}); 65 69 xButtonLine.appendChild(this.xWaitIcon); 66 70 if (this.sId === "grammalecte_gc_panel") { 67 71 xButtonLine.appendChild(this._createCopyButton()); 68 72 } 69 - xButtonLine.appendChild(this._createMoveButton("stickToTop", "⏶", "Coller en haut")); 70 - xButtonLine.appendChild(this._createMoveButton("stickToLeft", "⏴", "Coller à gauche")); 73 + if (this.bFlexible) { 74 + xButtonLine.appendChild(this._createMoveButton("changeWidth", "⭾", "Bascule la largeur")); 75 + xButtonLine.appendChild(this._createMoveButton("changeHeight", "⭿", "Bascule la hauteur")); 76 + } 77 + xButtonLine.appendChild(this._createMoveButton("up", "⏶", "Monter")); 78 + xButtonLine.appendChild(this._createMoveButton("left", "⏴", "À gauche")); 71 79 xButtonLine.appendChild(this._createMoveButton("center", "•", "Centrer")); 72 - xButtonLine.appendChild(this._createMoveButton("stickToRight", "⏵", "Coller à droite")); 73 - xButtonLine.appendChild(this._createMoveButton("stickToBottom", "⏷", "Coller en bas")); 80 + xButtonLine.appendChild(this._createMoveButton("right", "⏵", "À droite")); 81 + xButtonLine.appendChild(this._createMoveButton("down", "⏷", "Descendre")); 74 82 this.xCloseButton = this._createCloseButton(); 75 83 xButtonLine.appendChild(this.xCloseButton); 76 84 return xButtonLine; 77 85 } 78 86 79 87 _createWaitIcon () { 80 88 let xWaitIcon = oGrammalecte.createNode("div", {className: "grammalecte_spinner"}); ................................................................................ 134 142 } 135 143 136 144 hide () { 137 145 this.xPanel.style.display = "none"; 138 146 } 139 147 140 148 center () { 141 - let nHeight = (this.bFlexible) ? window.innerHeight-100 : this.nHeight; 142 - this.setSizeAndPosition(`${this.nWidth}px`, `${nHeight}px`, "50%", "", "", "50%", `-${nHeight/2}px`, `-${this.nWidth/2}px`); 149 + this.nPosition = 5; 150 + this.setSizeAndPosition(); 151 + } 152 + 153 + left () { 154 + if (![1, 4, 7].includes(this.nPosition)) { this.nPosition -= 1 }; 155 + this.setSizeAndPosition(); 156 + } 157 + 158 + right () { 159 + if (![3, 6, 9].includes(this.nPosition)) { this.nPosition += 1 }; 160 + this.setSizeAndPosition(); 161 + } 162 + 163 + up () { 164 + if (![7, 8, 9].includes(this.nPosition)) { this.nPosition += 3 }; 165 + this.setSizeAndPosition(); 143 166 } 144 167 145 - stickToLeft () { 146 - let nHeight = (this.bFlexible) ? window.innerHeight-100 : this.nHeight; 147 - this.setSizeAndPosition(`${this.nWidth}px`, `${nHeight}px`, "50%", "", "", "-2px", `-${nHeight/2}px`, ""); 168 + down () { 169 + if (![1, 2, 3].includes(this.nPosition)) { this.nPosition -= 3 }; 170 + this.setSizeAndPosition(); 148 171 } 149 172 150 - stickToRight () { 151 - let nHeight = (this.bFlexible) ? window.innerHeight-100 : this.nHeight; 152 - this.setSizeAndPosition(`${this.nWidth}px`, `${nHeight}px`, "50%", "-2px", "", "", `-${nHeight/2}px`, ""); 173 + changeWidth () { 174 + this.bHorizStrech = !this.bHorizStrech; 175 + this.setSizeAndPosition(); 153 176 } 154 177 155 - stickToTop () { 156 - let nWidth = (this.bFlexible) ? Math.floor(window.innerWidth/2) : this.nWidth; 157 - let nHeight = (this.bFlexible) ? Math.floor(window.innerHeight*0.45) : this.nHeight; 158 - this.setSizeAndPosition(`${nWidth}px`, `${nHeight}px`, "-2px", "", "", "50%", "", `-${nWidth/2}px`); 178 + changeHeight () { 179 + this.bVertStrech = !this.bVertStrech; 180 + this.setSizeAndPosition(); 159 181 } 160 182 161 - stickToBottom () { 162 - let nWidth = (this.bFlexible) ? Math.floor(window.innerWidth/2) : this.nWidth; 163 - let nHeight = (this.bFlexible) ? Math.floor(window.innerHeight*0.45) : this.nHeight; 164 - this.setSizeAndPosition(`${nWidth}px`, `${nHeight}px`, "", "", "-2px", "50%", "", `-${nWidth/2}px`); 165 - } 166 - 167 - setSizeAndPosition (sWidth, sHeight, sTop, sRight, sBottom, sLeft, sMarginTop, sMarginLeft) { 168 - this.xPanel.style.width = sWidth; 169 - this.xPanel.style.height = sHeight; 170 - this.xPanel.style.top = sTop; 171 - this.xPanel.style.right = sRight; 172 - this.xPanel.style.bottom = sBottom; 173 - this.xPanel.style.left = sLeft; 174 - this.xPanel.style.marginTop = sMarginTop; 175 - this.xPanel.style.marginLeft = sMarginLeft; 183 + setSizeAndPosition () { 184 + // size 185 + let nWidth = (this.bFlexible && this.bHorizStrech) ? Math.min(this.nWidth*1.5, window.innerWidth-200) : Math.min(this.nWidth, window.innerWidth-200); 186 + let nHeight = this.nHeight; 187 + if ([4, 5, 6].includes(this.nPosition)) { 188 + nHeight = (this.bFlexible && this.bVertStrech) ? (window.innerHeight-100) : Math.min(window.innerHeight-100, this.nHeight); 189 + } else { 190 + nHeight = (this.bFlexible) ? Math.floor(window.innerHeight*0.45) : this.nHeight; 191 + } 192 + this.xPanel.style.width = `${nWidth}px`; 193 + this.xPanel.style.height = `${nHeight}px`; 194 + // position 195 + let oPos = null; 196 + switch (this.nPosition) { 197 + case 1: oPos = { top:"", right:"", bottom:"-2px", left:"-2px", marginTop:"", marginLeft:"" }; break; 198 + case 2: oPos = { top:"", right:"", bottom:"-2px", left:"50%", marginTop:"", marginLeft:`-${nWidth/2}px` }; break; 199 + case 3: oPos = { top:"", right:"-2px", bottom:"-2px", left:"", marginTop:"", marginLeft:"" }; break; 200 + case 4: oPos = { top:"50%", right:"", bottom:"", left:"-2px", marginTop:`-${nHeight/2}px`, marginLeft:"" }; break; 201 + case 5: oPos = { top:"50%", right:"", bottom:"", left:"50%", marginTop:`-${nHeight/2}px`, marginLeft:`-${nWidth/2}px` }; break; 202 + case 6: oPos = { top:"50%", right:"-2px", bottom:"", left:"", marginTop:`-${nHeight/2}px`, marginLeft:"" }; break; 203 + case 7: oPos = { top:"-2px", right:"", bottom:"", left:"-2px", marginTop:"", marginLeft:"" }; break; 204 + case 8: oPos = { top:"-2px", right:"", bottom:"", left:"50%", marginTop:"", marginLeft:`-${nWidth/2}px` }; break; 205 + case 9: oPos = { top:"-2px", right:"-2px", bottom:"", left:"", marginTop:"", marginLeft:"" }; break; 206 + } 207 + // change 208 + this.xPanel.style.top = oPos.top; 209 + this.xPanel.style.right = oPos.right; 210 + this.xPanel.style.bottom = oPos.bottom; 211 + this.xPanel.style.left = oPos.left; 212 + this.xPanel.style.marginTop = oPos.marginTop; 213 + this.xPanel.style.marginLeft = oPos.marginLeft; 176 214 } 177 215 178 216 reduce () { 179 217 // todo 180 218 } 181 219 182 220 getWidth () {