Index: gc_lang/fr/webext/panel/lex_editor.css ================================================================== --- gc_lang/fr/webext/panel/lex_editor.css +++ gc_lang/fr/webext/panel/lex_editor.css @@ -92,10 +92,13 @@ } .category:hover { background-color: hsl(0, 0%, 90%); } +.separator { + border-left: 1px solid hsl(210, 0%, 90%); +} #section_vide { padding: 50px; font-size: 24px; text-align: center; @@ -206,13 +209,30 @@ #lexicon_page { } + +#save_button { + display: none; + float: right; + padding: 2px 20px; + background-color: hsl(150, 50%, 50%); + color: hsl(150, 0%, 100%); + border-radius: 3px; + cursor: pointer; +} th { padding: 5px 20px; border-left: 1px solid hsl(210, 10%, 90%); + text-align: left; } td { padding: 0 20px; } + +.delete_entry { + cursor: pointer; + font-weight: bold; + color: hsl(0, 100%, 50%); +} Index: gc_lang/fr/webext/panel/lex_editor.html ================================================================== --- gc_lang/fr/webext/panel/lex_editor.html +++ gc_lang/fr/webext/panel/lex_editor.html @@ -25,20 +25,14 @@
Nom, adjectif
Verbe
Adverbe
- -
- -
Prénom
+
Prénom
Patronyme
Nom propre
- -
- -
Autre
+
Autre
@@ -271,11 +265,17 @@
+
+ Enregistrer +

Votre lexique

+ +
+
Index: gc_lang/fr/webext/panel/lex_editor.js ================================================================== --- gc_lang/fr/webext/panel/lex_editor.js +++ gc_lang/fr/webext/panel/lex_editor.js @@ -29,10 +29,14 @@ } document.getElementById("lexicon_button").addEventListener("click", () => { oPage.showPage("lexicon"); }, false); document.getElementById("add_word_button").addEventListener("click", () => { oPage.showPage("lemma"); }, false); + +document.getElementById("table").addEventListener("click", (xEvent) => { oPage.onTableClick(xEvent); }, false); +document.getElementById("save_button").addEventListener("click", () => { oLexicon.save(); }, false); + document.getElementById("editor").addEventListener("click", (xEvent) => { oPage.onSelectionClick(xEvent); }, false); document.getElementById("lemma").addEventListener("keyup", () => { oPage.onWrite(); }, false); document.getElementById("lemma2").addEventListener("keyup", () => { oPage.onWrite2(); }, false); document.getElementById("verb_pattern").addEventListener("keyup", () => { oFlex.update(); }, false); document.getElementById("flexion").addEventListener("keyup", () => { oFlex.update(); }, false); @@ -176,10 +180,62 @@ document.getElementById("actions").style.display = "block"; }, hideActions: function () { document.getElementById("actions").style.display = "none"; + }, + + showSaveButton: function () { + document.getElementById("save_button").style.display = "block"; + }, + + hideSaveButton: function () { + document.getElementById("save_button").style.display = "none"; + }, + + createTableHeader: function () { + let xRowNode = createNode("tr"); + xRowNode.appendChild(createNode("th", { textContent: "·" })); + xRowNode.appendChild(createNode("th", { textContent: "#" })); + xRowNode.appendChild(createNode("th", { textContent: "Forme fléchie" })); + xRowNode.appendChild(createNode("th", { textContent: "Lemme" })); + xRowNode.appendChild(createNode("th", { textContent: "Étiquettes" })); + return xRowNode; + }, + + createRowNode: function (n, sFlexion, sLemma, sTags) { + let xRowNode = createNode("tr", { id: "row_" + n }); + xRowNode.appendChild(createNode("td", { textContent: "×", className: "delete_entry", title: "Effacer cette entrée" }, { id_entry: n })); + xRowNode.appendChild(createNode("td", { textContent: n })); + xRowNode.appendChild(createNode("td", { textContent: sFlexion })); + xRowNode.appendChild(createNode("td", { textContent: sLemma })); + xRowNode.appendChild(createNode("td", { textContent: sTags })); + return xRowNode; + }, + + clearTable: function () { + let xTable = document.getElementById("table"); + while (xTable.firstChild) { + xTable.removeChild(xTable.firstChild); + } + }, + + onTableClick: function (xEvent) { + try { + let xElem = xEvent.target; + if (xElem.className) { + if (xElem.className == "delete_entry") { + let iEntry = xElem.dataset.id_entry + oLexicon.lFlexion[parseInt(iEntry)] = null; + document.getElementById("row_"+iEntry).style.display = "none"; + this.showSaveButton(); + } + } + } + catch (e) { + showError(e); + } } } @@ -398,16 +454,16 @@ }, addToLexicon: function () { try { oLexicon.addFlexions(this.lFlexion); - oLexicon.save(); document.getElementById("lemma").value = ""; oPage.showSection("section_vide"); oPage.hideEditor(); oPage.hideActions(); oPage.clear(); + oPage.showSaveButton(); this.clear(); } catch (e) { showError(e); } @@ -441,51 +497,36 @@ this.lFlexion = dResult.lexicon_list; } }, display: function () { - this.clearTable(); + oPage.clearTable(); let xTable = document.getElementById("table"); let n = 0; if (this.lFlexion.length > 0) { - xTable.appendChild(this._createTableHeader()); + xTable.appendChild(oPage.createTableHeader()); for (let [sFlexion, sLemma, sTags] of this.lFlexion) { - xTable.appendChild(this._createRowNode(n, sFlexion, sLemma, sTags)); + xTable.appendChild(oPage.createRowNode(n, sFlexion, sLemma, sTags)); n += 1; } } else { xTable.appendChild(createNode("tr", { textContent: "Aucun élément." })); } }, - _createTableHeader: function () { - let xRowNode = createNode("tr"); - xRowNode.appendChild(createNode("th", { textContent: "#" })); - xRowNode.appendChild(createNode("th", { textContent: "Forme fléchie" })); - xRowNode.appendChild(createNode("th", { textContent: "Lemme" })); - xRowNode.appendChild(createNode("th", { textContent: "Étiquettes" })); - return xRowNode; - }, - - _createRowNode: function (n, sFlexion, sLemma, sTags) { - let xRowNode = createNode("tr", { id: "row_"+n }); - xRowNode.appendChild(createNode("td", { textContent: n })); - xRowNode.appendChild(createNode("td", { textContent: sFlexion })); - xRowNode.appendChild(createNode("td", { textContent: sLemma })); - xRowNode.appendChild(createNode("td", { textContent: sTags })); - return xRowNode; - }, - - clearTable: function () { - let xTable = document.getElementById("table"); - while (xTable.firstChild) { - xTable.removeChild(xTable.firstChild); - } - }, - - save: function () { - browser.storage.local.set({ "lexicon_list": this.lFlexion }); + save: function () { + console.log("u"); + oPage.hideSaveButton(); + let lResult = []; + for (let e of this.lFlexion) { + if (e !== null) { + lResult.push(e); + } + } + browser.storage.local.set({ "lexicon_list": lResult }); + this.lFlexion = lResult; + this.display(); }, build: function () { return null; },