Grammalecte  Check-in [a0ef5bac85]

Overview
Comment:[fx] gc panel: set size and position update
Downloads: Tarball | ZIP archive | SQL archive
Timelines: family | ancestors | descendants | both | trunk | fx
Files: files | file ages | folders
SHA3-256: a0ef5bac858e39e7b4ee042d703a8ea793a9301188c498894b493225d2e0e822
User & Date: olr on 2019-05-20 08:40:48
Other Links: manifest | tags
Context
2019-05-20
12:18
[fx] gc panel: CSS adjustements and auto-refresh adjustements check-in: e4791e17bb user: olr tags: trunk, fx
08:40
[fx] gc panel: set size and position update check-in: a0ef5bac85 user: olr tags: trunk, fx
08:40
[fr] ocr: set options to ocr check-in: 9f2404ab0b user: olr tags: trunk, fr
Changes
Hide Diffs Unified Diffs Ignore Whitespace Patch

Modified gc_lang/fr/webext/content_scripts/panel.css from [8c125dc8b5] to [8f13a1fabe].

︙︙
70
71
72
73
74
75
76

77
78
79
80
81
82
83
84
85
86







87
88
89
90
91
92
93

    font-weight: bold;
    text-align: center;
    cursor: pointer;
}
div.grammalecte_copy_button {
    border-radius: 2px;
    color: hsla(210, 0%, 100%, .5);

}
div.grammalecte_copy_button:hover {
    background-color: hsl(210, 90%, 35%, .5);
    color: hsla(210, 0%, 100%, 1);
}
div.grammalecte_move_button {
    padding: 1px 5px;
    border-radius: 16px;
    color: hsl(180, 0%, 100%);
    opacity: .5;







}
div.grammalecte_move_button_center {
    padding: 1px 10px;
    background: center no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12"><circle fill="%23fff" cx="6" cy="6" r="4"/></svg>') ;
}
div.grammalecte_move_button_up {
    padding: 1px 10px;








>










>
>
>
>
>
>
>








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

    font-weight: bold;
    text-align: center;
    cursor: pointer;
}
div.grammalecte_copy_button {
    border-radius: 2px;
    color: hsla(210, 0%, 100%, .5);
    margin-right: 10px;
}
div.grammalecte_copy_button:hover {
    background-color: hsl(210, 90%, 35%, .5);
    color: hsla(210, 0%, 100%, 1);
}
div.grammalecte_move_button {
    padding: 1px 5px;
    border-radius: 16px;
    color: hsl(180, 0%, 100%);
    opacity: .5;
}
div.grammalecte_move_button_changeWidth {
    padding: 3px 5px;
}
div.grammalecte_move_button_changeHeight {
    padding: 3px 5px;
    margin-right: 10px;
}
div.grammalecte_move_button_center {
    padding: 1px 10px;
    background: center no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12"><circle fill="%23fff" cx="6" cy="6" r="4"/></svg>') ;
}
div.grammalecte_move_button_up {
    padding: 1px 10px;
︙︙
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116

    background: center no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12"><path fill="%23fff" d="m 0,2 6,6 6,-6"/></svg>');
}
div.grammalecte_move_button_left {
    padding: 1px 10px;
    background: center no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12"><path fill="%23fff" d="m 2,6 6,6 v -12"/></svg>');
}
div.grammalecte_move_button:hover {
    background-color: hsla(180, 80%, 50%, .1);
    color: hsla(180, 0%, 100%, 1);
    opacity: 1;
}
div.grammalecte_close_button {
    border-radius: 0 8px 0 4px;
    background-color: hsla(0, 80%, 50%, .5);
    color: hsla(210, 0%, 100%, .5);








|








110
111
112
113
114
115
116
117
118
119
120
121
122
123
124

    background: center no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12"><path fill="%23fff" d="m 0,2 6,6 6,-6"/></svg>');
}
div.grammalecte_move_button_left {
    padding: 1px 10px;
    background: center no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12"><path fill="%23fff" d="m 2,6 6,6 v -12"/></svg>');
}
div.grammalecte_move_button:hover {
    background-color: hsla(180, 80%, 50%, .2);
    color: hsla(180, 0%, 100%, 1);
    opacity: 1;
}
div.grammalecte_close_button {
    border-radius: 0 8px 0 4px;
    background-color: hsla(0, 80%, 50%, .5);
    color: hsla(210, 0%, 100%, .5);
︙︙

Modified gc_lang/fr/webext/content_scripts/panel.js from [811e4142bb] to [84014faa6e].

︙︙
67
68
69
70
71
72
73


74
75
76
77
78
79
80
81
82

    _createButtons () {
        let xButtonLine = oGrammalecte.createNode("div", {className: "grammalecte_panel_commands"});
        xButtonLine.appendChild(this.xWaitIcon);
        if (this.sId === "grammalecte_gc_panel") {
            xButtonLine.appendChild(this._createCopyButton());
        }
        if (this.bFlexible) {


            xButtonLine.appendChild(this._createMoveButton("changeWidth", "⭾", "Bascule la largeur"));
            xButtonLine.appendChild(this._createMoveButton("changeHeight", "⭿", "Bascule la hauteur"));
        }
        xButtonLine.appendChild(this._createMoveButton("up", " ", "Monter")); // use char ⏶ when Windows 10 be vast majority of OS (Trebuchet MS not updated on other OS)
        xButtonLine.appendChild(this._createMoveButton("left", " ", "À gauche")); // use char ⏴ when Windows 10 be vast majority of OS (Trebuchet MS not updated on other OS)
        xButtonLine.appendChild(this._createMoveButton("center", " ", "Centrer")); // char • can be used already
        xButtonLine.appendChild(this._createMoveButton("right", " ", "À droite")); // use char ⏵ when Windows 10 be vast majority of OS (Trebuchet MS not updated on other OS)
        xButtonLine.appendChild(this._createMoveButton("down", " ", "Descendre")); // use char ⏷ when Windows 10 be vast majority of OS (Trebuchet MS not updated on other OS)
        this.xCloseButton = this._createCloseButton();








>
>
|
|








67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84

    _createButtons () {
        let xButtonLine = oGrammalecte.createNode("div", {className: "grammalecte_panel_commands"});
        xButtonLine.appendChild(this.xWaitIcon);
        if (this.sId === "grammalecte_gc_panel") {
            xButtonLine.appendChild(this._createCopyButton());
        }
        if (this.bFlexible) {
            this.xWidthButton = this._createMoveButton("changeWidth", "L", "Étendre en largeur");
            this.xHeightButton = this._createMoveButton("changeHeight", "H", "Étendre en hauteur");
            xButtonLine.appendChild(this.xWidthButton);
            xButtonLine.appendChild(this.xHeightButton);
        }
        xButtonLine.appendChild(this._createMoveButton("up", " ", "Monter")); // use char ⏶ when Windows 10 be vast majority of OS (Trebuchet MS not updated on other OS)
        xButtonLine.appendChild(this._createMoveButton("left", " ", "À gauche")); // use char ⏴ when Windows 10 be vast majority of OS (Trebuchet MS not updated on other OS)
        xButtonLine.appendChild(this._createMoveButton("center", " ", "Centrer")); // char • can be used already
        xButtonLine.appendChild(this._createMoveButton("right", " ", "À droite")); // use char ⏵ when Windows 10 be vast majority of OS (Trebuchet MS not updated on other OS)
        xButtonLine.appendChild(this._createMoveButton("down", " ", "Descendre")); // use char ⏷ when Windows 10 be vast majority of OS (Trebuchet MS not updated on other OS)
        this.xCloseButton = this._createCloseButton();
︙︙
178
179
180
181
182
183
184




185
186
187



188
189
190

191
192
193
194
195
196
197

    changeHeight () {
        this.bVertStrech = !this.bVertStrech;
        this.setSizeAndPosition();
    }

    setSizeAndPosition () {
        // size




        let nWidth = (this.bFlexible && this.bHorizStrech) ? Math.min(this.nWidth*1.5, window.innerWidth-200) : Math.min(this.nWidth, window.innerWidth-200);
        let nHeight = this.nHeight;
        if ([4, 5, 6].includes(this.nPosition)) {



            nHeight = (this.bFlexible && this.bVertStrech) ? (window.innerHeight-100) : Math.min(window.innerHeight-100, this.nHeight);
        } else {
            nHeight = (this.bFlexible) ? Math.floor(window.innerHeight*0.45) : this.nHeight;

        }
        this.xPanel.style.width = `${nWidth}px`;
        this.xPanel.style.height = `${nHeight}px`;
        // position
        let oPos = null;
        switch (this.nPosition) {
            case 1: oPos = { top:"",     right:"",     bottom:"-2px", left:"-2px", marginTop:"",                marginLeft:"" }; break;








>
>
>
>
|
|
|
>
>
>
|
<
|
>








180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197

198
199
200
201
202
203
204
205
206

    changeHeight () {
        this.bVertStrech = !this.bVertStrech;
        this.setSizeAndPosition();
    }

    setSizeAndPosition () {
        // size
        if (this.xWidthButton && this.xHeightButton) {
            this.xWidthButton.style.opacity = (this.bHorizStrech) ? .9 : .5;
            this.xHeightButton.style.opacity = (this.bVertStrech) ? .9 : .5;
        }
        let nWidth = Math.min(this.nWidth, window.innerWidth-200);
        let nHeight = ([4, 5, 6].includes(this.nPosition)) ? Math.min(this.nHeight, window.innerHeight-100) : Math.floor(window.innerHeight*0.45);
        if (this.bFlexible) {
            if (this.bHorizStrech) {
                nWidth = Math.min(this.nWidth*1.33, window.innerWidth-200);
            }
            if (this.bVertStrech) {

                nHeight = ([4, 5, 6].includes(this.nPosition)) ? (window.innerHeight-100) : Math.floor(window.innerHeight*0.67);
            }
        }
        this.xPanel.style.width = `${nWidth}px`;
        this.xPanel.style.height = `${nHeight}px`;
        // position
        let oPos = null;
        switch (this.nPosition) {
            case 1: oPos = { top:"",     right:"",     bottom:"-2px", left:"-2px", marginTop:"",                marginLeft:"" }; break;
︙︙

Fossil 2.20 [210e89a059] 2022-11-16 18:46:32
This page was generated in about 0.005s