Grammalecte  Check-in [bd5b026613]

Overview
Comment:[fx] WebExt: display button and menu only on focus
Downloads: Tarball | ZIP archive | SQL archive
Timelines: family | ancestors | descendants | both | trunk | fx
Files: files | file ages | folders
SHA3-256: bd5b0266135e426db0a4d8e8094b087441567c8e4c50b2217fbcbfe022bfb9b0
User & Date: olr on 2017-10-27 05:02:49
Other Links: manifest | tags
Context
2017-10-27
05:18
[fx] WebExt: v0.6.0.3 check-in: 8112d95bd0 user: olr tags: trunk, fx
05:02
[fx] WebExt: display button and menu only on focus check-in: bd5b026613 user: olr tags: trunk, fx
2017-10-26
08:40
[core][js] comment console.log(): Chrome don’t like it check-in: e42b4f000b user: olr tags: trunk, core
Changes
Hide Diffs Unified Diffs Ignore Whitespace Patch

Modified gc_lang/fr/webext/background.js from [20ce4550dd] to [61c0259fd3].

︙︙
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86

        showError(e);
    }
};

function initUIOptions (dSavedOptions) {
    if (!dSavedOptions.hasOwnProperty("ui_options")) {
        browser.storage.local.set({"ui_options": {
            textarea: false,
            editablenode: false
        }});
    }
}

function initGrammarChecker (dSavedOptions) {
    let dOptions = (dSavedOptions.hasOwnProperty("gc_options")) ? dSavedOptions.gc_options : null;
    xGCEWorker.postMessage({








|
|








71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86

        showError(e);
    }
};

function initUIOptions (dSavedOptions) {
    if (!dSavedOptions.hasOwnProperty("ui_options")) {
        browser.storage.local.set({"ui_options": {
            textarea: true,
            editablenode: true
        }});
    }
}

function initGrammarChecker (dSavedOptions) {
    let dOptions = (dSavedOptions.hasOwnProperty("gc_options")) ? dSavedOptions.gc_options : null;
    xGCEWorker.postMessage({
︙︙

Modified gc_lang/fr/webext/content_scripts/menu.css from [40e3449d23] to [2b784470a7]. 

1
2
3
4
5
6
7
8
9
10

11
12
13
14
15
16
17

/*
    CSS
    Button and menu for Grammalecte
*/

/*
    Button
*/
.grammalecte_menu_main_button {
    position: absolute;

    margin: -8px 0 0 -8px;
    width: 8px;
    height: 8px;
    background-color: hsla(210, 80%, 80%, .5);
    border: 4px solid hsla(210, 80%, 60%, .5);
    border-top: 4px solid hsla(210, 100%, 40%, .7);
    border-bottom: 4px solid hsla(210, 100%, 40%, .7);











>








1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

/*
    CSS
    Button and menu for Grammalecte
*/

/*
    Button
*/
.grammalecte_menu_main_button {
    position: absolute;
    display: none;
    margin: -8px 0 0 -8px;
    width: 8px;
    height: 8px;
    background-color: hsla(210, 80%, 80%, .5);
    border: 4px solid hsla(210, 80%, 60%, .5);
    border-top: 4px solid hsla(210, 100%, 40%, .7);
    border-bottom: 4px solid hsla(210, 100%, 40%, .7);
︙︙

Modified gc_lang/fr/webext/content_scripts/menu.js from [cf81b4bb53] to [22fe609f22].

︙︙
9
10
11
12
13
14
15

16
17
18
19
20









21
22
23
24
25
26
27

        this.sMenuId = "grammalecte_menu" + nMenu;
        this.xButton = oGrammalecte.createNode("div", {className: "grammalecte_menu_main_button", textContent: " "});
        this.xButton.onclick = () => { this.switchMenu(); };
        this.xButton.style.zIndex = (xNode.style.zIndex.search(/^[0-9]+$/) !== -1) ? (parseInt(xNode.style.zIndex) + 1).toString() : xNode.style.zIndex;
        this.xMenu = this._createMenu(xNode);
        this._insertAfter(this.xButton, xNode);
        this._insertAfter(this.xMenu, xNode);

    }

    _insertAfter (xNewNode, xReferenceNode) {
        xReferenceNode.parentNode.insertBefore(xNewNode, xReferenceNode.nextSibling);
    }










    _createMenu (xNode) {
        try {
            let sText = (xNode.tagName == "TEXTAREA") ? xNode.value : xNode.textContent;
            let xMenu = oGrammalecte.createNode("div", {id: this.sMenuId, className: "grammalecte_menu"});
            let xCloseButton = oGrammalecte.createNode("div", {className: "grammalecte_menu_close_button", textContent: "×"} );
            xCloseButton.onclick = () => { this.switchMenu(); }








>





>
>
>
>
>
>
>
>
>








9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37

        this.sMenuId = "grammalecte_menu" + nMenu;
        this.xButton = oGrammalecte.createNode("div", {className: "grammalecte_menu_main_button", textContent: " "});
        this.xButton.onclick = () => { this.switchMenu(); };
        this.xButton.style.zIndex = (xNode.style.zIndex.search(/^[0-9]+$/) !== -1) ? (parseInt(xNode.style.zIndex) + 1).toString() : xNode.style.zIndex;
        this.xMenu = this._createMenu(xNode);
        this._insertAfter(this.xButton, xNode);
        this._insertAfter(this.xMenu, xNode);
        this._createListenersOnReferenceNode(xNode);
    }

    _insertAfter (xNewNode, xReferenceNode) {
        xReferenceNode.parentNode.insertBefore(xNewNode, xReferenceNode.nextSibling);
    }

    _createListenersOnReferenceNode (xNode) {
        xNode.addEventListener('focus', (e) => {
            this.xButton.style.display = "block";
        });
        xNode.addEventListener('blur', (e) => {
            window.setTimeout(() => {this.xButton.style.display = "none";}, 300);
        });
    }

    _createMenu (xNode) {
        try {
            let sText = (xNode.tagName == "TEXTAREA") ? xNode.value : xNode.textContent;
            let xMenu = oGrammalecte.createNode("div", {id: this.sMenuId, className: "grammalecte_menu"});
            let xCloseButton = oGrammalecte.createNode("div", {className: "grammalecte_menu_close_button", textContent: "×"} );
            xCloseButton.onclick = () => { this.switchMenu(); }
︙︙
89
90
91
92
93
94
95
96
97
98
99


    deleteNodes () {
        this.xMenu.parentNode.removeChild(this.xMenu);
        this.xButton.parentNode.removeChild(this.xButton);
    }

    switchMenu () {
        let xMenu = document.getElementById(this.sMenuId);
        xMenu.style.display = (xMenu.style.display == "block") ? "none" : "block";
    }
}








<
|



99
100
101
102
103
104
105

106
107
108


    deleteNodes () {
        this.xMenu.parentNode.removeChild(this.xMenu);
        this.xButton.parentNode.removeChild(this.xButton);
    }

    switchMenu () {

        this.xMenu.style.display = (this.xMenu.style.display == "block") ? "none" : "block";
    }
}

Modified gc_lang/fr/webext/panel/main.html from [ac2adbb1b6] to [2d4092fcfc].

︙︙
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76

          <h2>Boutons d’accès</h2>
          <p>Grammalecte peut aussi afficher un bouton d’accès au menu en bas à gauche des zones de texte pour accéder aux fonctionnalités existantes.</p>
          <p class="right"><img src="../img/menu_button1.png" title="bouton du menu" /></p>
          <p class="right"><img src="../img/menu_button2.png" title="menu" /></p>
          <p>Vous pouvez activer ou désactiver l’affichage de ces boutons sur les zones de texte. Il existe deux types de zones de texte.</p>
          <div class="option_section" id="ui_option_textarea_box">
              <p><input type="checkbox" id="ui_option_textarea" /> <label for="ui_option_textarea">“Textareas”</label></p>
              <p class="option_description">Ces zones de texte sont les champs de formulaire usuels pour saisir du texte. Ils ne permettent que la saisie de texte brut, sans fioritures. (Ces champs de texte sont parfois dissimulés derrière d’autres éléments. Dans ce cas, il se peut que le bouton soit visible alors que le champ de saisie est dissimulé par un autre champ de saisie.)</p>
          </div>
          <div class="option_section" id="ui_option_editablenode_box">
              <p><input type="checkbox" id="ui_option_editablenode" /> <label for="ui_option_editablenode">“Nodes” éditables</label></p>
              <p class="option_description">Ces zones de texte sont des sections de page web éditables. Il est fréquent que ces zones de texte apparaissent comme des “textareas” standard. Il est aussi fréquent que ces zones de texte soient couplées avec toutes sortes de logiciels (de simples scripts d’aide à la mise en page ou des applications complexes). Ces zones de texte permettent l’affichage de texte enrichi (italique, gras, hyperlien, images, etc.). Il est assez fréquent que des “textareas” invisibles se cachent derrière ces “nodes” éditables.</p>
          </div>
          <h2>Raccourcis clavier</h2>
          <p class="shortcut">CTRL+MAJ+6</p>
          <p class="shortcut_label">Conjugueur (dans un onglet)</p>
          <p class="shortcut">CTRL+MAJ+7</p>
          <p class="shortcut_label">Conjugueur (dans une fenêtre)</p>
        </section> <!-- #ui_options_page -->








|



|








58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76

          <h2>Boutons d’accès</h2>
          <p>Grammalecte peut aussi afficher un bouton d’accès au menu en bas à gauche des zones de texte pour accéder aux fonctionnalités existantes.</p>
          <p class="right"><img src="../img/menu_button1.png" title="bouton du menu" /></p>
          <p class="right"><img src="../img/menu_button2.png" title="menu" /></p>
          <p>Vous pouvez activer ou désactiver l’affichage de ces boutons sur les zones de texte. Il existe deux types de zones de texte.</p>
          <div class="option_section" id="ui_option_textarea_box">
              <p><input type="checkbox" id="ui_option_textarea" /> <label for="ui_option_textarea">“Textareas”</label></p>
              <p class="option_description">Ces zones de texte sont les champs de formulaire usuels pour saisir du texte. Ils ne permettent que la saisie de texte brut, sans fioritures.</p>
          </div>
          <div class="option_section" id="ui_option_editablenode_box">
              <p><input type="checkbox" id="ui_option_editablenode" /> <label for="ui_option_editablenode">“Nodes” éditables</label></p>
              <p class="option_description">Ces zones de texte sont des sections de page web éditables. Il est fréquent que ces zones de texte apparaissent comme des “textareas” standard. Il est aussi fréquent que ces zones de texte soient couplées avec toutes sortes de logiciels (de simples scripts d’aide à la mise en page ou des applications complexes). Ces zones de texte permettent l’affichage de texte enrichi (italique, gras, hyperlien, images, etc.).</p>
          </div>
          <h2>Raccourcis clavier</h2>
          <p class="shortcut">CTRL+MAJ+6</p>
          <p class="shortcut_label">Conjugueur (dans un onglet)</p>
          <p class="shortcut">CTRL+MAJ+7</p>
          <p class="shortcut_label">Conjugueur (dans une fenêtre)</p>
        </section> <!-- #ui_options_page -->
︙︙

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