Grammalecte  Check-in [933990893e]

Overview
Comment:[fx] More elegant solution for adding styles
Downloads: Tarball | ZIP archive | SQL archive
Timelines: family | ancestors | descendants | both | fx | shadowdom
Files: files | file ages | folders
SHA3-256: 933990893e629c6973cfb2306fc93e347bea8fdb8e025439c0fc4978ea0c9f8d
User & Date: IllusionPerdu on 2018-10-20 10:42:35
Other Links: branch diff | manifest | tags
Context
2018-11-02
09:23
[fx] fix variables name check-in: a59c1fc4c3 user: olr tags: fx, shadowdom
2018-10-20
10:42
[fx] More elegant solution for adding styles check-in: 933990893e user: IllusionPerdu tags: fx, shadowdom
2018-10-19
23:18
[fx] Don't auto load CSS - Ajuste time for autoheigth check-in: b652ab4e9d user: IllusionPerdu tags: fx, shadowdom
Changes
Hide Diffs Unified Diffs Ignore Whitespace Patch

Modified gc_lang/fr/webext/content_scripts/init.js from [f45d12f413] to [b34663fda1].

︙︙
210
211
212
213
214
215
216






















217
218
219
220
221
222
223

            let xNode = document.createElement(sType);
            Object.assign(xNode, oAttr);
            if (oDataset) {
                Object.assign(xNode.dataset, oDataset);
            }
            return xNode;
        }






















        catch (e) {
            showError(e);
        }
    }
};










>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>








210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245

            let xNode = document.createElement(sType);
            Object.assign(xNode, oAttr);
            if (oDataset) {
                Object.assign(xNode.dataset, oDataset);
            }
            return xNode;
        }
        catch (e) {
            showError(e);
        }
    },

    createStyle: function (sLinkCss, sLinkId=null, oAppend=null) {
        try {
            let xNode = document.createElement("link");
            Object.assign(xNode, {
                rel: "stylesheet",
                type: "text/css",
                media: "all",
                href: this.sExtensionUrl + sLinkCss
            });
            if (sLinkId) {
                Object.assign(xNode, {id: sLinkId});
            }
            if (oAppend) {
                oAppend.appendChild(xNode);
            }
            return xNode;
        }
        catch (e) {
            showError(e);
        }
    }
};
︙︙

Modified gc_lang/fr/webext/content_scripts/menu.js from [c804b43d48] to [3a50b7e7c1].

︙︙
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

        }

        this.bShadow = document.body.createShadowRoot || document.body.attachShadow;
        if (this.bShadow){
            let nMarginTop = -1 * (parseInt(xStyle.marginBottom.replace('px', ''), 10));
            this.oShadowBtn = oGrammalecte.createNode("div", {style: "display:none;position:absolute;width:0;height:0;"});
            this.oShadowBtnNode = this.oShadowBtn.attachShadow({mode: "open"});
            this.oShadowBtnNode.appendChild(
                oGrammalecte.createNode("link", {rel: "stylesheet", type: "text/css", media: "all", href: oGrammalecte.sExtensionUrl + "content_scripts/menu.css"})
            );
            this.oShadowBtnNode.appendChild(this.xButton);
            this._insertAfter(this.oShadowBtn, xNodeInsertAfter, nMarginTop);

            this.oShadowMenu = oGrammalecte.createNode("div", {id: this.sMenuId+"_shadow", style: "display:none;position:absolute;width:0;height:0;"});
            this.oShadowMenuNode = this.oShadowMenu.attachShadow({mode: "open"});
            this.oShadowMenuNode.appendChild(
                oGrammalecte.createNode("link", {rel: "stylesheet", type: "text/css", media: "all", href: oGrammalecte.sExtensionUrl + "content_scripts/menu.css"})
            );
            this.oShadowMenuNode.appendChild(this.xMenu);
            this._insertAfter(this.oShadowMenu, xNodeInsertAfter, nMarginTop + 8);
        } else {
            let nMarginTop = -1 * (8 + parseInt(xStyle.marginBottom.replace('px', ''), 10));
            if (!document.getElementById("grammalecte_cssmenu")){
                document.head.appendChild(
                    oGrammalecte.createNode("link", {id: "grammalecte_cssmenu", rel: "stylesheet", type: "text/css", media: "all", href: oGrammalecte.sExtensionUrl + "content_scripts/menu.css"})
                );
            }
            this._insertAfter(this.xButton, xNodeInsertAfter, nMarginTop);
            this._insertAfter(this.xMenu, xNodeInsertAfter, nMarginTop + 8);
        }
        this._createListeners();
    }









|
<
<





|
<
<





|
<
<








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

        }

        this.bShadow = document.body.createShadowRoot || document.body.attachShadow;
        if (this.bShadow){
            let nMarginTop = -1 * (parseInt(xStyle.marginBottom.replace('px', ''), 10));
            this.oShadowBtn = oGrammalecte.createNode("div", {style: "display:none;position:absolute;width:0;height:0;"});
            this.oShadowBtnNode = this.oShadowBtn.attachShadow({mode: "open"});
            oGrammalecte.createStyle("content_scripts/menu.css", null, this.oShadowBtnNode);


            this.oShadowBtnNode.appendChild(this.xButton);
            this._insertAfter(this.oShadowBtn, xNodeInsertAfter, nMarginTop);

            this.oShadowMenu = oGrammalecte.createNode("div", {id: this.sMenuId+"_shadow", style: "display:none;position:absolute;width:0;height:0;"});
            this.oShadowMenuNode = this.oShadowMenu.attachShadow({mode: "open"});
            oGrammalecte.createStyle("content_scripts/menu.css", null, this.oShadowMenuNode);


            this.oShadowMenuNode.appendChild(this.xMenu);
            this._insertAfter(this.oShadowMenu, xNodeInsertAfter, nMarginTop + 8);
        } else {
            let nMarginTop = -1 * (8 + parseInt(xStyle.marginBottom.replace('px', ''), 10));
            if (!document.getElementById("grammalecte_cssmenu")){
                oGrammalecte.createStyle("content_scripts/menu.css", "grammalecte_cssmenu", document.head);


            }
            this._insertAfter(this.xButton, xNodeInsertAfter, nMarginTop);
            this._insertAfter(this.xMenu, xNodeInsertAfter, nMarginTop + 8);
        }
        this._createListeners();
    }
︙︙

Modified gc_lang/fr/webext/content_scripts/message_box.js from [85fc74a091] to [770e36deb1].

︙︙
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

        let xButton = oGrammalecte.createNode("div", {className: "grammalecte_close_button", textContent: "×", title: "Fermer la fenêtre"});
        xButton.onclick = function () { this.hide(); }.bind(this);  // better than writing “let that = this;” before the function?
        return xButton;
    }

    insertIntoPage () {
        if (this.bShadow){
            this.oShadow.appendChild(
                oGrammalecte.createNode("link", {rel: "stylesheet", type: "text/css", media: "all", href: oGrammalecte.sExtensionUrl + "content_scripts/panel.css"})
            );
            this.oShadow.appendChild(
                oGrammalecte.createNode("link", {rel: "stylesheet", type: "text/css", media: "all", href: oGrammalecte.sExtensionUrl + "content_scripts/message_box.css"})
            );
            this.oShadow.appendChild(this.xMessageBox);
            document.body.appendChild(this.oShadowPanel);
        } else {
            if (!document.getElementById("grammalecte_cssmsg")){
                document.head.appendChild(
                    oGrammalecte.createNode("link", {rel: "stylesheet", type: "text/css", media: "all", href: oGrammalecte.sExtensionUrl + "content_scripts/panel.css"})
                );
                document.head.appendChild(
                    oGrammalecte.createNode("link", {id: "grammalecte_cssmsg", rel: "stylesheet", type: "text/css", media: "all", href: oGrammalecte.sExtensionUrl + "content_scripts/message_box.css"})
                );
            }
            document.body.appendChild(this.xMessageBox);
        }
    }

    show () {
        this.xMessageBox.style.display = "block";








|
<
<
<
|
<




|
<
<
<
|
<








61
62
63
64
65
66
67
68



69

70
71
72
73
74



75

76
77
78
79
80
81
82

        let xButton = oGrammalecte.createNode("div", {className: "grammalecte_close_button", textContent: "×", title: "Fermer la fenêtre"});
        xButton.onclick = function () { this.hide(); }.bind(this);  // better than writing “let that = this;” before the function?
        return xButton;
    }

    insertIntoPage () {
        if (this.bShadow){
            oGrammalecte.createStyle("content_scripts/panel.css", null, this.oShadow);



            oGrammalecte.createStyle("content_scripts/message_box.css", null, this.oShadow);

            this.oShadow.appendChild(this.xMessageBox);
            document.body.appendChild(this.oShadowPanel);
        } else {
            if (!document.getElementById("grammalecte_cssmsg")){
                oGrammalecte.createStyle("content_scripts/panel.css", null, document.head);



                oGrammalecte.createStyle("content_scripts/message_box.css", "grammalecte_cssmsg", document.head);

            }
            document.body.appendChild(this.xMessageBox);
        }
    }

    show () {
        this.xMessageBox.style.display = "block";
︙︙

Modified gc_lang/fr/webext/content_scripts/panel.js from [d7c31535a7] to [92c60336fc].

︙︙
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
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135

        let xButton = oGrammalecte.createNode("div", {className: "grammalecte_close_button", textContent: "×", title: "Fermer la fenêtre"});
        xButton.onclick = function () { this.hide(); }.bind(this);  // better than writing “let that = this;” before the function?
        return xButton;
    }

    insertIntoPage () {
        if (this.bShadow){
            this.oShadow.appendChild(
                oGrammalecte.createNode("link", {rel: "stylesheet", type: "text/css", media: "all", href: oGrammalecte.sExtensionUrl + "content_scripts/panel.css"})
            );
            this.oShadow.appendChild(
                oGrammalecte.createNode("link", {rel: "stylesheet", type: "text/css", media: "all", href: oGrammalecte.sExtensionUrl + "content_scripts/panel_gc.css"})
            );
            this.oShadow.appendChild(
                oGrammalecte.createNode("link", {rel: "stylesheet", type: "text/css", media: "all", href: oGrammalecte.sExtensionUrl + "content_scripts/panel_lxg.css"})
            );
            this.oShadow.appendChild(
                oGrammalecte.createNode("link", {rel: "stylesheet", type: "text/css", media: "all", href: oGrammalecte.sExtensionUrl + "content_scripts/panel_tf.css"})
            );
            this.oShadow.appendChild(this.xPanel);
            document.body.appendChild(this.oShadowPanel);
        } else {
            if (!document.getElementById("grammalecte_csspanel")){
                document.head.appendChild(
                    oGrammalecte.createNode("link", {id: "grammalecte_csspanel", rel: "stylesheet", type: "text/css", media: "all", href: oGrammalecte.sExtensionUrl + "content_scripts/panel.css"})
                );
                document.head.appendChild(
                    oGrammalecte.createNode("link", {rel: "stylesheet", type: "text/css", media: "all", href: oGrammalecte.sExtensionUrl + "content_scripts/panel_gc.css"})
                );
                document.head.appendChild(
                    oGrammalecte.createNode("link", {rel: "stylesheet", type: "text/css", media: "all", href: oGrammalecte.sExtensionUrl + "content_scripts/panel_lxg.css"})
                );
                document.head.appendChild(
                    oGrammalecte.createNode("link", {rel: "stylesheet", type: "text/css", media: "all", href: oGrammalecte.sExtensionUrl + "content_scripts/panel_tf.css"})
                );
            }
            document.body.appendChild(this.xPanel);
        }
    }

    show () {
        this.xPanel.style.display = "block";








|
<
<
<
|
<
<
|
<
<
|
<




|
<
<
<
|
<
<
|
<
<
|
<








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

        let xButton = oGrammalecte.createNode("div", {className: "grammalecte_close_button", textContent: "×", title: "Fermer la fenêtre"});
        xButton.onclick = function () { this.hide(); }.bind(this);  // better than writing “let that = this;” before the function?
        return xButton;
    }

    insertIntoPage () {
        if (this.bShadow){
            oGrammalecte.createStyle("content_scripts/panel.css", null, this.oShadow);



            oGrammalecte.createStyle("content_scripts/panel_gc.css", null, this.oShadow);


            oGrammalecte.createStyle("content_scripts/panel_lxg.css", null, this.oShadow);


            oGrammalecte.createStyle("content_scripts/panel_tf.css", null, this.oShadow);

            this.oShadow.appendChild(this.xPanel);
            document.body.appendChild(this.oShadowPanel);
        } else {
            if (!document.getElementById("grammalecte_csspanel")){
                oGrammalecte.createStyle("content_scripts/panel.css", "grammalecte_csspanel", document.head);



                oGrammalecte.createStyle("content_scripts/panel_gc.css", null, document.head);


                oGrammalecte.createStyle("content_scripts/panel_lxg.css", null, document.head);


                oGrammalecte.createStyle("content_scripts/panel_tf.css", null, document.head);

            }
            document.body.appendChild(this.xPanel);
        }
    }

    show () {
        this.xPanel.style.display = "block";
︙︙

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