Grammalecte  Check-in [905fe07ad2]

Overview
Comment:[fx] panels size adjustments
Downloads: Tarball | ZIP archive | SQL archive
Timelines: family | ancestors | descendants | both | fx | webext2
Files: files | file ages | folders
SHA3-256: 905fe07ad2b2b20189167897e648e171640902ab7ea590e5f30903dd316e0cf4
User & Date: olr on 2017-08-23 12:22:20
Other Links: branch diff | manifest | tags
Context
2017-08-23
16:43
[fx] text formatter update check-in: b300065d85 user: olr tags: fx, webext2
12:22
[fx] panels size adjustments check-in: 905fe07ad2 user: olr tags: fx, webext2
11:41
[fx] exclude empty paragraph with no errors check-in: 2cc6384593 user: olr tags: fx, webext2
Changes

Modified gc_lang/fr/webext/content_scripts/gc_content.js from [75316c6151] to [f9b49e4ed2].

46
47
48
49
50
51
52
53

54
55
56
57
58
59
60
46
47
48
49
50
51
52

53
54
55
56
57
58
59
60







-
+








    constructor (...args) {
        super(...args);
        this.aIgnoredErrors = new Set();
        this.xContentNode = createNode("div", {id: "grammalecte_gc_panel_content"});
        this.xParagraphList = createNode("div", {id: "grammalecte_paragraph_list"});
        this.xContentNode.appendChild(this.xParagraphList);
        this.xContentNode.addEventListener("click", onGrammalecteGCPanelClick, false);
        this.xPanelContent.addEventListener("click", onGrammalecteGCPanelClick, false);
        this.oTooltip = new GrammalecteTooltip(this.xContentNode);
        this.xPanelContent.appendChild(this.xContentNode);
        this.oTAC = new GrammalecteTextAreaControl();
    }

    start (xTextArea=null) {
        this.clear();

Modified gc_lang/fr/webext/content_scripts/panels_content.js from [f6d10a216c] to [0c67b192c0].

1
2
3
4
5
6
7
8
9
10
11

12
13
14
15
16

17
18
19
20
21
22
23
1
2
3
4
5
6
7
8
9
10

11
12
13
14
15

16
17
18
19
20
21
22
23










-
+




-
+







// JavaScript
// Panel creator

"use strict";

console.log("[Content script] Panel creator");


class GrammalectePanel {

    constructor (sId, sTitle, nWidth, nHeight, bMovable=true) {
    constructor (sId, sTitle, nWidth, nHeight, bFlexible=true) {
        this.sId = sId;
        this.sContentId = sId+"_content";
        this.nWidth = nWidth;
        this.nHeight = nHeight;
        this.bMovable = bMovable;
        this.bFlexible = bFlexible;
        this.xPanelContent = createNode("div", {className: "grammalecte_panel_content"});
        this.xWaitIcon = this._createWaitIcon();
        this.xPanelNode = this._createPanel(sTitle);
        this.center();
    }

    _createPanel (sTitle) {
37
38
39
40
41
42
43
44
45
46
47
48
49





50
51
52
53
54
55
56
57
37
38
39
40
41
42
43






44
45
46
47
48

49
50
51
52
53
54
55







-
-
-
-
-
-
+
+
+
+
+
-







            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._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"}));
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
118
119
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
118
119







-
+




-
+




-
+




-
-
+
+
+



-
-
+
+
+







    }

    hide () {
        this.xPanelNode.style.display = "none";
    }

    center () {
        let nHeight = window.innerHeight-100;
        let nHeight = (this.bFlexible) ? window.innerHeight-100 : this.nHeight;
        this.xPanelNode.style = `top: 50%; left: 50%; width: ${this.nWidth}px; height: ${nHeight}px; margin-top: -${nHeight/2}px; margin-left: -${this.nWidth/2}px;`;
    }

    stickToLeft () {
        let nHeight = window.innerHeight-100;
        let nHeight = (this.bFlexible) ? window.innerHeight-100 : this.nHeight;
        this.xPanelNode.style = `top: 50%; left: -2px; width: ${this.nWidth}px; height: ${nHeight}px; margin-top: -${nHeight/2}px;`;
    }

    stickToRight () {
        let nHeight = window.innerHeight-100;
        let nHeight = (this.bFlexible) ? window.innerHeight-100 : this.nHeight;
        this.xPanelNode.style = `top: 50%; right: -2px; width: ${this.nWidth}px; height: ${nHeight}px; margin-top: -${nHeight/2}px;`;
    }

    stickToTop () {
        let nWidth = Math.floor(window.innerWidth/2);
        this.xPanelNode.style = `top: -2px; left: 50%; width: ${nWidth}px; height: ${Math.floor(window.innerHeight*0.45)}px; margin-left: -${nWidth/2}px;`;
        let nWidth = (this.bFlexible) ? Math.floor(window.innerWidth/2) : this.nWidth;
        let nHeight = (this.bFlexible) ? Math.floor(window.innerHeight*0.45) : this.nHeight;
        this.xPanelNode.style = `top: -2px; left: 50%; width: ${nWidth}px; height: ${nHeight}px; margin-left: -${nWidth/2}px;`;
    }

    stickToBottom () {
        let nWidth = Math.floor(window.innerWidth/2);
        this.xPanelNode.style = `bottom: -2px; left: 50%; width: ${nWidth}px; height: ${Math.floor(window.innerHeight*0.45)}px; margin-left: -${nWidth/2}px;`;
        let nWidth = (this.bFlexible) ? Math.floor(window.innerWidth/2) : this.nWidth;
        let nHeight = (this.bFlexible) ? Math.floor(window.innerHeight*0.45) : this.nHeight;
        this.xPanelNode.style = `bottom: -2px; left: 50%; width: ${nWidth}px; height: ${nHeight}px; margin-left: -${nWidth/2}px;`;
    }

    reduce () {
        // todo
    }

    logInnerHTML () {