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 Side-by-Side 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

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

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"});
            this.oShadowBtnNode.appendChild(
            oGrammalecte.createStyle("content_scripts/menu.css", null, this.oShadowBtnNode);
                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.createStyle("content_scripts/menu.css", null, this.oShadowMenuNode);
                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.createStyle("content_scripts/menu.css", "grammalecte_cssmenu", document.head);
                    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();
    }
︙

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

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){
            this.oShadow.appendChild(
            oGrammalecte.createStyle("content_scripts/panel.css", null, this.oShadow);
                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"})
            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")){
                document.head.appendChild(
                oGrammalecte.createStyle("content_scripts/panel.css", null, document.head);
                    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"})
                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

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){
            this.oShadow.appendChild(
            oGrammalecte.createStyle("content_scripts/panel.css", null, this.oShadow);
                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"})
            oGrammalecte.createStyle("content_scripts/panel_gc.css", null, this.oShadow);
            );
            this.oShadow.appendChild(
                oGrammalecte.createNode("link", {rel: "stylesheet", type: "text/css", media: "all", href: oGrammalecte.sExtensionUrl + "content_scripts/panel_lxg.css"})
            oGrammalecte.createStyle("content_scripts/panel_lxg.css", null, this.oShadow);
            );
            this.oShadow.appendChild(
                oGrammalecte.createNode("link", {rel: "stylesheet", type: "text/css", media: "all", href: oGrammalecte.sExtensionUrl + "content_scripts/panel_tf.css"})
            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")){
                document.head.appendChild(
                oGrammalecte.createStyle("content_scripts/panel.css", "grammalecte_csspanel", document.head);
                    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"})
                oGrammalecte.createStyle("content_scripts/panel_gc.css", null, document.head);
                );
                document.head.appendChild(
                    oGrammalecte.createNode("link", {rel: "stylesheet", type: "text/css", media: "all", href: oGrammalecte.sExtensionUrl + "content_scripts/panel_lxg.css"})
                oGrammalecte.createStyle("content_scripts/panel_lxg.css", null, document.head);
                );
                document.head.appendChild(
                    oGrammalecte.createNode("link", {rel: "stylesheet", type: "text/css", media: "all", href: oGrammalecte.sExtensionUrl + "content_scripts/panel_tf.css"})
                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.009s