Grammalecte  Check-in [a43bd18afb]

# Builder for French language

import os
import zipfile
from distutils import dir_util, file_util

import helpers


def build (sLang, dVars, spLangPack):
    "complementary build launched from make.py"
    createFirefoxExtension(sLang, dVars)
    createWebExtension(sLang, dVars)
    createThunderbirdExtension(sLang, dVars, spLangPack)


def createWebExtension (sLang, dVars):
    "create Web-extension"
    print("Building Web-extension")
    helpers.createCleanFolder("_build/webext/"+sLang)
    dir_util.copy_tree("gc_lang/"+sLang+"/webext/", "_build/webext/"+sLang)
    dir_util.copy_tree("grammalecte-js", "_build/webext/"+sLang+"/grammalecte")
    with helpers.cd("_build/webext/"+sLang):
        os.system("web-ext build")


def createFirefoxExtension (sLang, dVars):
    "create extension for Firefox"
    print("Building extension for Firefox")
    helpers.createCleanFolder("_build/xpi/"+sLang)
    dir_util.copy_tree("gc_lang/"+sLang+"/xpi/", "_build/xpi/"+sLang)
    dir_util.copy_tree("grammalecte-js", "_build/xpi/"+sLang+"/grammalecte")

unopkg = C:/Program Files/LibreOffice 5/program/unopkg.com
oxt_version = 6.2
oxt_identifier = French.linguistic.resources.from.Dicollecte.by.OlivierR

# Firefox
fx_identifier = French-GC@grammalecte.net
fx_name = Grammalecte [fr]

fx_standard_path = C:\Program Files\Mozilla Firefox\firefox.exe
fx_beta_path = C:\Program Files\Mozilla Firefox Beta\firefox.exe
fx_nightly_path = C:\Program Files (x86)\Nightly\firefox.exe


# Thunderbird
tb_identifier = French-GC-TB@grammalecte.net
tb_name = Grammalecte [fr]
tb_debug_extension_path = _build/tb-debug.profile/extensions/French-GC-TB@grammalecte.net
# Set Thunderbird folder in your PATH variable
# Create a local profile:

# Grammalecte

**French Grammar Checker**

écrit en JavaScript ES6/ES7
par Olivier R.

## Fonctionnalités ##

* correcteur grammatical
* conjugueur
* formateur de texte
* lexicographe

## Site web ##

https://grammalecte.net

## Licence ##

GNU GPL 3.0+
http://www.gnu.org/copyleft/gpl.html

import { echo } from "../mymodule";

echo("CONTENT SCRIPRT!!!");

function handleMessage2 (oRequest, xSender, sendResponse) {
  console.log(`[Content script] received: ${oRequest.content}`);
  change(request.myparam);
  //browser.runtime.onMessage.removeListener(handleMessage);
  sendResponse({response: "response from content script"});
}

function removeEverything () {
  while (document.body.firstChild) {
    document.body.firstChild.remove();
  }
}

function change (param) {
  document.getElementById("title").setAttribute("background-color", "#809060");
  console.log("param: " + param);
  document.getElementById("title").setAttribute("background-color", "#FF0000");
}


/*
  Assign do_something() as a listener for messages from the extension.
*/
browser.runtime.onMessage.addListener(handleMessage2);

/*
try {
    console.log("BEFORE");
    //var myhelpers = require('./grammalecte/helpers.js');
    require(['./grammalecte/helpers.js'], function (foo) {
        console.log("LOADING");
        echo("MODULE LOADED2");
    });
    console.log("AFTER");
}
catch (e) {
    console.log("\n" + e.fileName + "\n" + e.name + "\nline: " + e.lineNumber + "\n" + e.message);
    console.error(e);
}*/

echo("VA TE FAIRE FOUTRE");



let gce = null; // module: grammar checker engine
let text = null;
let tkz = null; // module: tokenizer
let lxg = null; // module: lexicographer
let helpers = null;

let oTokenizer = null;
let oDict = null;
let oLxg = null;

function loadGrammarChecker (sGCOptions="", sContext="JavaScript") {
    if (gce === null) {
        try {
            gce = require("resource://grammalecte/fr/gc_engine.js");
            helpers = require("resource://grammalecte/helpers.js");
            text = require("resource://grammalecte/text.js");
            tkz = require("resource://grammalecte/tokenizer.js");
            lxg = require("resource://grammalecte/fr/lexicographe.js");
            oTokenizer = new tkz.Tokenizer("fr");
            helpers.setLogOutput(console.log);
            gce.load(sContext);
            oDict = gce.getDictionary();
            oLxg = new lxg.Lexicographe(oDict);
            if (sGCOptions !== "") {
                gce.setOptions(helpers.objectToMap(JSON.parse(sGCOptions)));
            }
            // we always retrieve options from the gce, for setOptions filters obsolete options
            return gce.getOptions()._toString();
        }
        catch (e) {
            console.log("# Error: " + e.fileName + "\n" + e.name + "\nline: " + e.lineNumber + "\n" + e.message);
        }
    }
}

function parse (sText, sLang, bDebug, bContext) {
    let aGrammErr = gce.parse(sText, sLang, bDebug, bContext);
    return JSON.stringify(aGrammErr);
}

function parseAndSpellcheck (sText, sLang, bDebug, bContext) {
    let aGrammErr = gce.parse(sText, sLang, bDebug, bContext);
    let aSpellErr = oTokenizer.getSpellingErrors(sText, oDict);
    return JSON.stringify({ aGrammErr: aGrammErr, aSpellErr: aSpellErr });
}

function getOptions () {
    return gce.getOptions()._toString();
}

function getDefaultOptions () {
    return gce.getDefaultOptions()._toString();
}

function setOptions (sGCOptions) {
    gce.setOptions(helpers.objectToMap(JSON.parse(sGCOptions)));
    return gce.getOptions()._toString();
}

function setOption (sOptName, bValue) {
    gce.setOptions(new Map([ [sOptName, bValue] ]));
    return gce.getOptions()._toString();
}

function resetOptions () {
    gce.resetOptions();
    return gce.getOptions()._toString();
}

function fullTests (sGCOptions="") {
    if (!gce || !oDict) {
        return "# Error: grammar checker or dictionary not loaded."
    }
    let dMemoOptions = gce.getOptions();
    if (sGCOptions) {
        gce.setOptions(helpers.objectToMap(JSON.parse(sGCOptions)));
    }
    let tests = require("resource://grammalecte/tests.js");
    let oTest = new tests.TestGrammarChecking(gce);
    let sAllRes = "";
    for (let sRes of oTest.testParse()) {
        dump(sRes+"\n");
        sAllRes += sRes+"\n";
    }
    gce.setOptions(dMemoOptions);
    return sAllRes;
}


// Lexicographer

function getListOfElements (sText) {
    try {
        let aElem = [];
        let aRes = null;
        for (let oToken of oTokenizer.genTokens(sText)) {
            aRes = oLxg.getInfoForToken(oToken);
            if (aRes) {
                aElem.push(aRes);
            }
        }
        return JSON.stringify(aElem);
    }
    catch (e) {
        helpers.logerror(e);
    }
    return JSON.stringify([]);
}


function handleMessage (oRequest, xSender, sendResponse) {
  console.log(`[background] received: ${oRequest.content}`);
  sendResponse({response: "response from background script"});
}

browser.runtime.onMessage.addListener(handleMessage);

{
  "manifest_version": 2,
  "name": "Grammalecte [fr]",
  "short_name": "Grammalecte [fr]",
  "version": "0.6",

  "applications": {
    "gecko": {
      "id": "French-GC@grammalecte.net",
      "strict_min_version": "54.0"
    }
  },

  "author": "Olivier R.",
  "homepage_url": "https://grammalecte.net",
  "offline_enabled": true,

  "description": "Correcteur grammatical pour le français.",

  "icons": { "16": "img/logo-16.png",
             "32": "img/logo-32.png",
             "48": "img/logo-48.png",
             "64": "img/logo-64.png",
             "96": "img/logo-96.png" },

  "browser_action": {
    "default_icon": "img/logo-32.png",
    "default_popup": "panel/main.html",
    "default_title": "Grammalecte [fr]",
    "browser_style": false
  },
  "background": {
    "scripts": ["require.js", "grammalecte/helpers.js", "gce_worker.js"]
  },
  "web_accessible_resources": [
    "beasts/frog.jpg",
    "beasts/turtle.jpg",
    "beasts/snake.jpg"
  ],
  "permissions": [
    "activeTab"
  ]
}

/*
    flexbox:
    https://css-tricks.com/snippets/css/a-guide-to-flexbox/
*/


/* reset */

* { margin: 0; padding: 0; }
img { border: none; }


/* Selection */

::-moz-selection {
    background-color: hsl(210, 50%, 60%);
    color: hsl(210, 20%, 100%);
    text-shadow: 0 0 2px hsl(210, 80%, 20%);
    border-radius: 2px;
}
::selection {
    background-color: hsl(210, 50%, 60%);
    color: hsl(210, 20%, 100%);
    text-shadow: 0 0 2px hsl(210, 80%, 20%);
    border-radius: 2px;
}


/* Generic classes */

.fleft { float: left; }
.fright { float: right; }

.center { text-align: center; }
.right { text-align: right; }
.left { text-align: left; }
.justify { text-align: justify; }

.hidden { display: none; }
.clearer { clear: both; font-size: 0; height: 0; }

.red {          background-color: hsl(0, 50%, 50%);   color: hsl(0, 0%, 96%); }
.red:hover {    background-color: hsl(0, 60%, 40%);   color: hsl(0, 0%, 100%); }
.cyan {         background-color: hsl(180, 50%, 50%); color: hsl(0, 0%, 96%); }
.cyan:hover {   background-color: hsl(180, 60%, 40%); color: hsl(0, 0%, 100%); }
.green {        background-color: hsl(120, 50%, 40%); color: hsl(120, 10%, 96%); }
.green:hover {  background-color: hsl(120, 60%, 30%); color: hsl(120, 10%, 96%); }
.blue {         background-color: hsl(210, 50%, 50%); color: hsl(210, 10%, 96%); }
.blue:hover {   background-color: hsl(210, 60%, 40%); color: hsl(210, 10%, 96%); }


/* links */

a:link, a:visited {
    color: hsl(210, 70%, 40%);
    /*text-decoration: none;*/
}
a:hover, a:active {
    text-shadow: 0 0 2px hsl(210, 80%, 60%);
}

a.extlink:hover:after {
    content: " >";
}


/* Main classes */

html {
    box-sizing: border-box;
    width: 530px;
    height: 880px;
    font-family: "Trebuchet MS", "Liberation Sans", sans-serif;
}
body {
    width: 530px;
    height: 880px;
}

#main {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: stretch;
    background-color: hsl(210, 0%, 100%);
    min-height: 100%;
}

#left {
    width: 54px;
    background-color: hsl(210, 10%, 96%);
    border-right: solid 1px hsl(210, 0%, 70%);
    color: hsl(210, 10%, 96%);
}
#logo {
  padding: 10px;
}
#left li {
  padding: 10px 5px;
  border-bottom: 1px solid hsl(210, 10%, 90%);
  text-align: center;
  cursor: pointer;
  color: hsl(210, 10%, 50%);
  list-style-type: none;
}
#left li:hover {
  background-color: hsl(210, 10%, 92%);

}

#page {
    background-color: hsl(210, 0%, 100%);
}
#page h1 {
    margin: 0 0 10px 0;
    color: hsl(210, 70%, 70%);
    font: bold 30px 'Yanone Kaffeesatz', "Liberation Sans Narrow", sans-serif;
}
#page p {
    margin: 10px 0 5px 0;
}

#home_page {
  display: block;
  padding: 20px;
}

#tf_page {
  display: none;
  padding: 20px;
}
#gc_page {
  display: none;
  padding: 20px 20px 30px 20px;
}
#gc_options_page {
  display: none;
  padding: 20px;
}
#sc_options_page {
  display: none;
  padding: 20px;
}
#lxg_page {
  display: none;
  padding: 20px;
}


/*
  Conjugueur page
*/

#conj_page {
  display: none;
  padding: 10px;
}

#conj_page h2 {
    margin: 5px 0 2px 0;
    color: hsl(210, 50%, 50%);
    font: bold 30px Tahoma, "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", sans-serif;
}
#conj_page h3 {
    margin: 5px 0 2px 0;
    color: hsl(0, 50%, 50%);
    font: bold 16px Tahoma, "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", sans-serif;
}
#conj_page h4 {
    margin: 5px 0 2px 0;
    color: hsl(210, 50%, 50%);
    font: bold 14px Tahoma, "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", sans-serif;
}

#conj_page .colonne {
    float: left;
    width: 240px;
}
#conj_page .colsep {
    float: left;
    width: 20px;
}

#conj_page .colonne p {
    font-size: 12px;
}


#conj_page input#verb {
    display: inline-block;
    width: 230px;
    margin-left: 5px;
    padding: 5px 10px;
    border: 2px solid hsl(0, 0%, 80%);
    border-radius: 3px;
    height: 24px;
    background: transparent;
    font: normal 20px Tahoma, "Ubuntu Condensed";
    color: hsl(0, 0%, 30%);
}
#conj_page input[placeholder]#verb {
    color: hsl(0, 0%, 70%);
}

#conj_page a#conjugate {
    display: inline-block;
    padding: 7px 10px;
    font-size: 20px;
    background-color: hsl(0, 30%, 30%);
    color: hsl(0, 30%, 60%);
    border-radius: 3px;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
}
#conj_page a#conjugate:hover {
    background-color: hsl(0, 60%, 40%);
    color: hsl(0, 60%, 70%);
    box-shadow: 0 0 2px hsl(0, 60%, 50%);
}

#conj_options {
    margin: 10px 5px 0 5px;
    font-size: 16px;
    text-align: center;
}

#conj_smallnote {
    float: right;
    width: 190px;
    margin: 15px 0 0 0;
    padding: 0 5px;
    font-size: 8.5px;
    color: hsl(0, 0%, 60%);
    text-align: center;
}


/*
  Test page
*/

#test_page {
  display: none;
}
#test_cmd {
    padding: 15px;
    background-color: hsl(0, 0%, 92%);
    border-bottom: 1px solid hsl(0, 0%, 86%);
}
#test_cmd textarea {
    width: 100%;
    border: 2px solid hsl(0, 0%, 89%);
    border-radius: 3px;
    resize: vertical;
}

#test_results {
    padding: 15px;
    background-color: hsl(0, 0%, 96%);
}

#test_page .button {
    display: inline-block;
    padding: 5px 10px;
    width: 120px;
    border-radius: 3px;
    font-size: 12px;
    text-align: center;
    cursor: pointer;
}


/*
  Text formatter
*/

#tf_options {
    
}

#tf_options fieldset {
    margin: 5px 0;
    padding: 5px 10px 10px 10px;
    background-color: hsl(0, 0%, 92%);
    border-radius: 3px;
}

#tf_options legend {
    font-size: 20px;
    color: hsla(210, 20%, 50%, .8);
    font-weight: bold;
}
#tf_options legend span {
    display: none;
}

#tf_options fieldset h2 {
    color: hsl(210, 80%, 40%);
}

#tf_options fieldset .blockopt {
    padding: 2px 3px;
    font-size: 12.5px;
}
#tf_options fieldset .underline:hover {
    background-color: hsl(180, 10%, 86%);
    border-radius: 2px;
}

#tf_options fieldset .option {
    margin: 1px 3px 0 0;
    float: left;
}
#tf_options legend .option {
    margin: 7px 5px 0 3px;
    float: left;
}

#tf_options fieldset .opt_lbl {
    display: inline-block;
    color: hsl(0, 0%, 20%);
}


#tf_options fieldset .largew {
    width: 300px;
}
#tf_options fieldset .reducedw {
    width: 200px;
}
#tf_options fieldset .smallw {
    width: 90px;
}

#tf_options fieldset .secondoption {
    display: inline-block;
}

#tf_options fieldset label span {
    display: none;
}

#tf_options .groupblock {
    opacity: 0.3;
}

#tf_options .inlineblock {
    display: inline-block;
}
#tf_options .indent {
    margin-left: 15px;
}

#tf_actions {
    background-color: hsl(120, 10%, 92%);
    padding: 15px;
    border-top: 1px solid hsl(120, 20%, 86%);
}

#tf_options .button {
    display: inline-block;
    padding: 5px 10px;
    width: 100px;
    border-radius: 3px;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    cursor: pointer;
}

#tf_progressbarbox {
    display: inline-block;
    padding: 10px 20px;
}


/* 
  Other elements
*/

#movewindow {
    position: fixed;
    right: 0;
    top: 50;
    width: 16px;
    margin-top: 60px;
    z-index: 100;
}
#movewindow .arrow {
    background-color: hsl(180, 60%, 50%);
    cursor: pointer;
    padding: 1px 3px;
    font-size: 10px;
    font-weight: bold;
    text-align: center;
    color: hsl(180, 50%, 90%);
}
#movewindow .arrow:hover {
    background-color: hsl(180, 70%, 40%);
    cursor: hsl(180, 50%, 96%);
}

#rightcorner {
    position: absolute;
    top: 0;
    right: 0;
}
a.rightcornerbutton1 {
    float: right;
    padding: 2px 10px 5px 10px;
    border-radius: 0 0 0 3px;
    font-size: 18px;
    text-decoration: none;
}
a.rightcornerbutton {
    float: right;
    padding: 2px 10px 5px 10px;
    font-size: 18px;
    text-decoration: none;
}


/*
    CSS Spinner
    Double bounce
    http://tobiasahlin.com/spinkit/
*/
.spinner {
    width: 40px;
    height: 40px;
    position: absolute;
    top: 2px;
    right: 120px;
}
.double-bounce1, .double-bounce2 {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: hsl(180, 50%, 75%);
    opacity: 0.6;
    position: absolute;
    top: 0;
    left: 0;
    animation: sk-bounce 2.0s infinite ease-in-out;
}
.double-bounce2 {
    animation-delay: -1.0s;
}

@keyframes sk-bounce {
    0%, 100% { 
        transform: scale(0.0);
    } 50% { 
        transform: scale(1.0);
    }
}

<!DOCTYPE html>

<html>
  <head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="main.css"/>
  </head>

  <body>
    <div id="main">

      <header id="left">
        <nav id="menu">
          <header id="logo">
            <img src="../img/logo-32.png">
          </header>
          <ul>
            <li class="select" data-page="home_page"><i class="fa fa-home icon"></i> 1.</li>
            <li class="select" data-page="conj_page"><i class="fa fa-star icon"></i> CJ</li>
            <li class="select" data-page="tf_page"><i class="fa fa-photo icon"></i> TF</li>
            <li class="select" data-page="gc_page"><i class="fa fa-question-circle icon"></i> CG</li>
            <li class="select" data-page="gc_options_page"><i class="fa fa-coffee icon"></i> OP1</li>
            <li class="select" data-page="sc_options_page"><i class="fa fa-keyboard-o icon"></i> OP2</li>
            <li class="select" data-page="lxg_page"><i class="fa fa-keyboard-o icon"></i> LXG</li>
            <li class="select" data-page="test_page"><i class="fa fa-keyboard-o icon"></i> TST</li>
          </ul>
        </nav>
      </header> <!-- #left -->

      <div id="movewindow">
        <div id="resize_h_bigger" class="arrow" style="border-radius: 2px 0 0 0">↓</div>
        <div id="resize_h_smaller" class="arrow">↑</div>
        <div id="resize_w_bigger" class="arrow">←</div>
        <div id="resize_w_smaller" class="arrow" style="border-radius: 0 0 0 2px">→</div>
      </div>

      <div id="page">

        <section id="home_page" class="page">
          <h1>GRAMMALECTE</h1>
        </section>

        <section id="gc_page" class="page">
          <h1>CORRECTEUR GRAMMATICAL</h1>
          <div id="paragraphs_list"></div>
        </section>

        <section id="gc_options_page" class="page">
          <h1>OPTIONS GRAMMATICALES</h1>
        </section>

        <section id="sc_options_page" class="page">
          <h1>OPTIONS ORTHOGRAPHIQUES</h1>
        </section>

        <section id="lxg_page" class="page">
          <h1>LEXICOGRAPHE</h1>
          <div id="tokens_list"></div>
        </section>

        <section id="test_page" class="page">
          <div id="test_cmd">
            <h1>TESTS</h1>
            <textarea id="text" rows="10"></textarea>
            <div id="testall" class="button blue">Tests complets</div> <div id="parse" class="button green fright">Analyser</div>
          </div>
          <div id="test_results">
          </div>
        </section>

        <section id="conj_page" class="page">
          <h1>CONJUGUEUR</h1>
          <p class="right" style="margin: 10px 30px 0 0">
            <input type="text" id="verb" name="verb" maxlength="40" value="" placeholder="entrez un verbe" autofocus />
            <a id="conjugate" href="#" onclick="return false;">Conjuguer</a>
          <p>

          <div class="clearer"></div>

          <p id="conj_smallnote" hidden>Ce verbe n’a pas encore été vérifié. C’est pourquoi les options “pronominal” et “temps composés” sont désactivées.</p>
          <p id="conj_options">
            <label for="oneg">Négation</label> <input type="checkbox" id="oneg" name="oneg" value="ON"  /> 
            · <label id="opro_lbl" for="opro">Pronominal</label> <input type="checkbox" id="opro" name="opro" value="ON"  />
            · <label for="ofem">Féminin</label> <input type="checkbox" id="ofem" name="ofem" value="ON"  />
            <br/> <label for="oint">Interrogatif</label> <input type="checkbox" id="oint" name="oint" value="ON"  />
            · <label id="otco_lbl" for="otco">Temps composés</label> <input type="checkbox" id="otco" name="otco" value="ON"  />
          </p>

          <h2 id="verb_title" class="center">&nbsp;</h2>
          <p id="info" class="center">&nbsp;</p>

          <!-- section 1 -->
          <div class="colonne">
            <div id="infinitif" class="box">
              <h3 id="infinitif_title">Infinitif</h3>
              <p id="infi">&nbsp;</p>
            </div>
            <div id="imperatif" class="box">
              <h3 id="imperatif_title">Impératif</h3>
              <h4 id="impe_temps">Présent</h4>
              <p id="impe1">&nbsp;</p>
              <p id="impe2">&nbsp;</p>
              <p id="impe3">&nbsp;</p>
            </div>
          </div>
          
          <div class="colsep">&nbsp;</div>
          
          <div class="colonne">
            <div id="partpre" class="box">
              <h3 id="partpre_title">Participe présent</h3>
              <p id="ppre">&nbsp;</p>
            </div>
            <div id="partpas" class="box">
              <h3 id="partpas_title">Participes passés</h3>
              <p id="ppas1">&nbsp;</p>
              <p id="ppas2">&nbsp;</p>
              <p id="ppas3">&nbsp;</p>
              <p id="ppas4">&nbsp;</p>
            </div>
          </div>

          <div class="clearer"></div>

          <!-- section 2 -->
          <div class="colonne">
            <div id="indicatif" class="box">
              <h3 id="indicatif_title">Indicatif</h3>
              <div id="ipre">
                <h4 id="ipre_temps">Présent</h4>
                <p id="ipre1">&nbsp;</p>
                <p id="ipre2">&nbsp;</p>
                <p id="ipre3">&nbsp;</p>
                <p id="ipre4">&nbsp;</p>
                <p id="ipre5">&nbsp;</p>
                <p id="ipre6">&nbsp;</p>
              </div>
              <div id="iimp">
                <h4 id="iimp_temps">Imparfait</h4>
                <p id="iimp1">&nbsp;</p>
                <p id="iimp2">&nbsp;</p>
                <p id="iimp3">&nbsp;</p>
                <p id="iimp4">&nbsp;</p>
                <p id="iimp5">&nbsp;</p>
                <p id="iimp6">&nbsp;</p>
              </div>
              <div id="ipsi">
                <h4 id="ipsi_temps">Passé simple</h4>
                <p id="ipsi1">&nbsp;</p>
                <p id="ipsi2">&nbsp;</p>
                <p id="ipsi3">&nbsp;</p>
                <p id="ipsi4">&nbsp;</p>
                <p id="ipsi5">&nbsp;</p>
                <p id="ipsi6">&nbsp;</p>
              </div>
              <div id="ifut">
                <h4 id="ifut_temps">Futur</h4>
                <p id="ifut1">&nbsp;</p>
                <p id="ifut2">&nbsp;</p>
                <p id="ifut3">&nbsp;</p>
                <p id="ifut4">&nbsp;</p>
                <p id="ifut5">&nbsp;</p>
                <p id="ifut6">&nbsp;</p>
              </div>
            </div>
          </div>
          
          <div class="colsep">&nbsp;</div>
          
          <div class="colonne">
            <div id="subjonctif" class="box">
              <h3 id="subjontif_title">Subjonctif</h3>
              <div id="spre">
                <h4 id="spre_temps">Présent</h4>
                <p id="spre1">&nbsp;</p>
                <p id="spre2">&nbsp;</p>
                <p id="spre3">&nbsp;</p>
                <p id="spre4">&nbsp;</p>
                <p id="spre5">&nbsp;</p>
                <p id="spre6">&nbsp;</p>
              </div>
              <div id="simp">
                <h4 id="simp_temps">Imparfait</h4>
                <p id="simp1">&nbsp;</p>
                <p id="simp2">&nbsp;</p>
                <p id="simp3">&nbsp;</p>
                <p id="simp4">&nbsp;</p>
                <p id="simp5">&nbsp;</p>
                <p id="simp6">&nbsp;</p>
              </div>
            </div>
            <div id="conditionnel" class="box">
              <h3 id="conditionnel_title">Conditionnel</h3>
              <div id="conda">
                <h4 id="conda_temps">Présent</h4>
                <p id="conda1">&nbsp;</p>
                <p id="conda2">&nbsp;</p>
                <p id="conda3">&nbsp;</p>
                <p id="conda4">&nbsp;</p>
                <p id="conda5">&nbsp;</p>
                <p id="conda6">&nbsp;</p>
              </div>
              <div id="condb">
                <h4 id="condb_temps">&nbsp;</h4>
                <p id="condb1">&nbsp;</p>
                <p id="condb2">&nbsp;</p>
                <p id="condb3">&nbsp;</p>
                <p id="condb4">&nbsp;</p>
                <p id="condb5">&nbsp;</p>
                <p id="condb6">&nbsp;</p>
              </div>
            </div>
          </div>

          <div class="clearer"></div>
        </section> <!-- conjugueur -->

        <section id="tf_page" class="page">
          <h1>FORMATEUR DE TEXTE</h1>
          <div id="tf_options">

            <!-- Supernumerary spaces -->
            <fieldset>
              <legend><input type="checkbox" id="o_group_ssp" class="option" data-default="true" /><label for="o_group_ssp" data-l10n-en="tf_ssp">${tf_ssp}</label></legend>
              <div id="group_ssp" class="groupblock">
                <div class="blockopt underline">
                  <div id="res_o_start_of_paragraph" class="result fright"></div>
                  <input type="checkbox" id="o_start_of_paragraph" class="option" data-default="true" />
                  <label for="o_start_of_paragraph" class="opt_lbl largew" data-l10n-en="tf_start_of_paragraph">${tf_start_of_paragraph}</label>
                </div>
                <div class="blockopt underline">
                  <div id="res_o_end_of_paragraph" class="result fright"></div>
                  <input type="checkbox" id="o_end_of_paragraph" class="option" data-default="true" />
                  <label for="o_end_of_paragraph" class="opt_lbl largew" data-l10n-en="tf_end_of_paragraph">${tf_end_of_paragraph}</label>
                </div>
                <div class="blockopt underline">
                  <div id="res_o_between_words" class="result fright"></div>
                  <input type="checkbox" id="o_between_words" class="option" data-default="true" />
                  <label for="o_between_words" class="opt_lbl largew" data-l10n-en="tf_between_words">${tf_between_words}</label>
                </div>
                <div class="blockopt underline">
                  <div id="res_o_before_punctuation" class="result fright"></div>
                  <input type="checkbox" id="o_before_punctuation" class="option" data-default="true" />
                  <label for="o_before_punctuation" class="opt_lbl largew" data-l10n-en="tf_before_punctuation">${tf_before_punctuation}</label>
                </div>
                <div class="blockopt underline">
                  <div id="res_o_within_parenthesis" class="result fright"></div>
                  <input type="checkbox" id="o_within_parenthesis" class="option" data-default="true" />
                  <label for="o_within_parenthesis" class="opt_lbl largew" data-l10n-en="tf_within_parenthesis">${tf_within_parenthesis}</label>
                </div>
                <div class="blockopt underline">
                  <div id="res_o_within_square_brackets" class="result fright"></div>
                  <input type="checkbox" id="o_within_square_brackets" class="option" data-default="true" />
                  <label for="o_within_square_brackets" class="opt_lbl largew" data-l10n-en="tf_within_square_brackets">${tf_within_square_brackets}</label>
                </div>
                <div class="blockopt underline">
                  <div id="res_o_within_quotation_marks" class="result fright"></div>
                  <input type="checkbox" id="o_within_quotation_marks" class="option" data-default="true" />
                  <label for="o_within_quotation_marks" class="opt_lbl largew" data-l10n-en="tf_within_quotation_marks">${tf_within_quotation_marks}</label>
                </div>
              </div>
            </fieldset>

            <!-- Missing spaces -->
            <fieldset>
              <legend><input type="checkbox" id="o_group_space" class="option" data-default="true" /><label for="o_group_space" data-l10n-en="tf_space">${tf_space}</label></legend>
              <div id="group_space" class="groupblock">
                <div class="blockopt underline">
                  <div id="res_o_add_space_after_punctuation" class="result fright"></div>
                  <input type="checkbox" id="o_add_space_after_punctuation" class="option" data-default="true" />
                  <label for="o_add_space_after_punctuation" class="opt_lbl reducedw" data-l10n-en="tf_add_space_after_punctuation">${tf_add_space_after_punctuation}</label>
                </div>
                <div class="blockopt underline">
                  <div id="res_o_add_space_around_hyphens" class="result fright"></div>
                  <input type="checkbox" id="o_add_space_around_hyphens" class="option" data-default="true" />
                  <label for="o_add_space_around_hyphens" class="opt_lbl largew" data-l10n-en="tf_add_space_around_hyphens">${tf_add_space_around_hyphens}</label>
                </div>
              </div>
            </fieldset>

            <!-- Non breaking spaces -->
            <fieldset>
              <legend><input type="checkbox" id="o_group_nbsp" class="option" data-default="true" /><label for="o_group_nbsp" data-l10n-en="tf_nbsp">${tf_nbsp}</label></legend>
              <div id="group_nbsp" class="groupblock">
                <div class="blockopt underline">
                  <div id="res_o_nbsp_before_punctuation" class="result fright"></div>
                  <input type="checkbox" id="o_nbsp_before_punctuation" class="option" data-default="true" />
                  <label for="o_nbsp_before_punctuation" class="opt_lbl reducedw" data-l10n-en="tf_nbsp_before_punctuation">${tf_nbsp_before_punctuation}</label>
                  <!--<div class="secondoption">
                      <input type="checkbox" id="o_nnbsp_before_punctuation" class="option" />
                      <label for="o_nnbsp_before_punctuation" class="opt_lbl smallw">fines<span>sauf avec “:”</span></label>
                  </div>-->
                </div>
                <div class="blockopt underline">
                  <div id="res_o_nbsp_within_quotation_marks" class="result fright"></div>
                  <input type="checkbox" id="o_nbsp_within_quotation_marks" class="option" data-default="true" />
                  <label for="o_nbsp_within_quotation_marks" class="opt_lbl reducedw" data-l10n-en="tf_nbsp_within_quotation_marks">${tf_nbsp_within_quotation_marks}</label>
                  <!--<div class="secondoption">
                      <input type="checkbox" id="o_nnbsp_within_quotation_marks" class="option" />
                      <label for="o_nnbsp_within_quotation_marks" class="opt_lbl smallw">fines</label>
                  </div>-->
                </div>
                <div class="blockopt underline">
                  <div id="res_o_nbsp_before_symbol" class="result fright"></div>
                  <input type="checkbox" id="o_nbsp_before_symbol" class="option" data-default="true" />
                  <label for="o_nbsp_before_symbol" class="opt_lbl largew" data-l10n-en="tf_nbsp_before_symbol">${tf_nbsp_before_symbol}</label>
                </div>
                <div class="blockopt underline">
                  <div id="res_o_nbsp_within_numbers" class="result fright"></div>
                  <input type="checkbox" id="o_nbsp_within_numbers" class="option" data-default="true" />
                  <label for="o_nbsp_within_numbers" class="opt_lbl reducedw" data-l10n-en="tf_nbsp_within_numbers">${tf_nbsp_within_numbers}</label>
                  <!--<div class="secondoption">
                      <input type="checkbox" id="o_nnbsp_within_numbers" class="option" />
                      <label for="o_nnbsp_within_numbers" class="opt_lbl smallw">fines</label>
                  </div>-->
                </div>
                <div class="blockopt underline">
                  <div id="res_o_nbsp_before_units" class="result fright"></div>
                  <input type="checkbox" id="o_nbsp_before_units" class="option" data-default="true" />
                  <label for="o_nbsp_before_units" class="opt_lbl largew" data-l10n-en="tf_nbsp_before_units">${tf_nbsp_before_units}</label>
                </div>
              </div>
            </fieldset>

            <!-- Deletions -->
            <fieldset>
              <legend><input type="checkbox" id="o_group_delete" class="option" data-default="true" /><label for="o_group_delete" data-l10n-en="tf_delete">${tf_delete}</label></legend>
              <div id="group_delete" class="groupblock">
                <div class="blockopt underline">
                  <div id="res_o_erase_non_breaking_hyphens" class="result fright"></div>
                  <input type="checkbox" id="o_erase_non_breaking_hyphens" class="option" data-default="true" />
                  <label for="o_erase_non_breaking_hyphens" class="opt_lbl largew" data-l10n-en="tf_erase_non_breaking_hyphens">${tf_erase_non_breaking_hyphens}</label>
                </div>
              </div>
            </fieldset>

            <!-- Typographical signs -->
            <fieldset>
              <legend><input type="checkbox" id="o_group_typo" class="option" data-default="true" /><label for="o_group_typo" data-l10n-en="tf_typo">${tf_typo}</label></legend>
              <div id="group_typo" class="groupblock">
                <div class="blockopt underline">
                  <div id="res_o_ts_apostrophe" class="result fright"></div>
                  <input type="checkbox" id="o_ts_apostrophe" class="option" data-default="true" />
                  <label for="o_ts_apostrophe" class="opt_lbl largew" data-l10n-en="tf_ts_apostrophe">${tf_ts_apostrophe}</label>
                </div>
                <div class="blockopt underline">
                  <div id="res_o_ts_ellipsis" class="result fright"></div>
                  <input type="checkbox" id="o_ts_ellipsis" class="option" data-default="true" />
                  <label for="o_ts_ellipsis" class="opt_lbl largew" data-l10n-en="tf_ts_ellipsis">${tf_ts_ellipsis}</label>
                </div>
                <div class="blockopt underline">
                  <div id="res_o_ts_dash_middle" class="result fright"></div>
                  <input type="checkbox" id="o_ts_dash_middle" class="option" data-default="true" />
                  <label for="o_ts_dash_middle" class="opt_lbl largew" data-l10n-en="tf_ts_dash_middle">${tf_ts_dash_middle}</label>
                </div>
                <div class="blockopt">
                  <div class="inlineblock indent">
                    <input type="radio" name="hyphen1" id="o_ts_m_dash_middle" class="option" data-default="false" /><label for="o_ts_m_dash_middle" class="opt_lbl" data-l10n-en="tf_emdash">${tf_emdash}</label>
                  </div>
                  <div class="inlineblock indent">
                    <input type="radio" name="hyphen1" id="o_ts_n_dash_middle" class="option" data-default="true" /><label for="o_ts_n_dash_middle" class="opt_lbl" data-l10n-en="tf_endash">${tf_endash}</label>
                  </div>
                </div>
                <div class="blockopt underline">
                  <div id="res_o_ts_dash_start" class="result fright"></div>
                  <input type="checkbox" id="o_ts_dash_start" class="option" data-default="true" />
                  <label for="o_ts_dash_start" class="opt_lbl largew" data-l10n-en="tf_ts_dash_start">${tf_ts_dash_start}</label>
                </div>
                <div class="blockopt">
                  <div class="inlineblock indent">
                    <input type="radio" name="hyphen2" id="o_ts_m_dash_start" class="option"  data-default="true" /><label for="o_ts_m_dash_start" class="opt_lbl" data-l10n-en="tf_emdash">${tf_emdash}</label>
                  </div>
                  <div class="inlineblock indent">
                    <input type="radio" name="hyphen2" id="o_ts_n_dash_start" class="option" data-default="false" /><label for="o_ts_n_dash_start" class="opt_lbl" data-l10n-en="tf_endash">${tf_endash}</label>
                  </div>
                </div>
                <div class="blockopt underline">
                  <div id="res_o_ts_quotation_marks" class="result fright"></div>
                  <input type="checkbox" id="o_ts_quotation_marks" class="option" data-default="true" />
                  <label for="o_ts_quotation_marks" class="opt_lbl largew" data-l10n-en="tf_ts_quotation_marks">${tf_ts_quotation_marks}</label>
                </div>
                <div class="blockopt underline">
                  <div id="res_o_ts_units" class="result fright"></div>
                  <input type="checkbox" id="o_ts_units" class="option" data-default="true" />
                  <label for="o_ts_units" class="opt_lbl largew" data-l10n-en="tf_ts_units">${tf_ts_units}</label>
                </div>
                <div class="blockopt underline">
                  <div id="res_o_ts_spell" class="result fright"></div>
                  <input type="checkbox" id="o_ts_spell" class="option" data-default="true" />
                  <label for="o_ts_spell" class="opt_lbl largew" data-l10n-en="tf_ts_spell">${tf_ts_spell}</label>
                </div>
                <div class="blockopt underline">
                  <div id="res_o_ts_ligature" class="result fright"></div>
                  <div class="inlineblock">
                    <input type="checkbox" id="o_ts_ligature" class="option" data-default="false" />
                    <label for="o_ts_ligature" class="opt_lbl" data-l10n-en="tf_ts_ligature">${tf_ts_ligature}</label>
                  </div>
                  <div class="inlineblock indent">
                    <input type="radio" id="o_ts_ligature_do" name="liga" class="option" data-default="false" />
                    <label for="o_ts_ligature_do" class="opt_lbl" data-l10n-en="tf_ts_ligature_do">${tf_ts_ligature_do}</label>
                  </div>
                  <div class="inlineblock indent">
                    <input type="radio" id="o_ts_ligature_undo" name="liga" class="option" data-default="true" />
                    <label for="o_ts_ligature_undo" class="opt_lbl" data-l10n-en="tf_ts_ligature_undo">${tf_ts_ligature_undo}</label>
                  </div>
                </div>

                <div class="blockopt">
                  <div class="inlineblock indent"><input type="checkbox" id="o_ts_ligature_ff" class="option" data-default="true" /><label for="o_ts_ligature_ff" class="opt_lbl">ff</label></div>
                  &nbsp; <div class="inlineblock"><input type="checkbox" id="o_ts_ligature_fi" class="option" data-default="true" /><label for="o_ts_ligature_fi" class="opt_lbl">fi</label></div>
                  &nbsp; <div class="inlineblock"><input type="checkbox" id="o_ts_ligature_ffi" class="option" data-default="true" /><label for="o_ts_ligature_ffi" class="opt_lbl">ffi</label></div>
                  &nbsp; <div class="inlineblock"><input type="checkbox" id="o_ts_ligature_fl" class="option" data-default="true" /><label for="o_ts_ligature_fl" class="opt_lbl">fl</label></div>
                  &nbsp; <div class="inlineblock"><input type="checkbox" id="o_ts_ligature_ffl" class="option" data-default="true" /><label for="o_ts_ligature_ffl" class="opt_lbl">ffl</label></div>
                  &nbsp; <div class="inlineblock"><input type="checkbox" id="o_ts_ligature_ft" class="option" data-default="true" /><label for="o_ts_ligature_ft" class="opt_lbl">ft</label></div>
                  &nbsp; <div class="inlineblock"><input type="checkbox" id="o_ts_ligature_st" class="option" data-default="false" /><label for="o_ts_ligature_st" class="opt_lbl">st</label></div>
                </div>
              </div>
            </fieldset>

            <!-- Misc -->
            <fieldset>
              <legend><input type="checkbox" id="o_group_misc" class="option" data-default="true" /><label for="o_group_misc" data-l10n-en="tf_misc">${tf_misc}</label></legend>
              <div id="group_misc" class="groupblock">
                <div class="blockopt underline">
                  <div id="res_o_ordinals_no_exponant" class="result fright"></div>
                  <input type="checkbox" id="o_ordinals_no_exponant" class="option" data-default="true" />
                  <label for="o_ordinals_no_exponant" class="opt_lbl reducedw" data-l10n-en="tf_ordinals_no_exponant">${tf_ordinals_no_exponant}</label>
                  <div class="secondoption">
                    <input type="checkbox" id="o_ordinals_exponant" class="option" data-default="true" />
                    <label for="o_ordinals_exponant" class="opt_lbl smallw" data-l10n-en="tf_ordinals_exponant">${tf_ordinals_exponant}</label>
                  </div>
                </div>
                <div class="blockopt underline">
                  <div id="res_o_etc" class="result fright"></div>
                  <input type="checkbox" id="o_etc" class="option" data-default="true" />
                  <label for="o_etc" class="opt_lbl largew" data-l10n-en="tf_etc">${tf_etc}</label>
                </div>
                <div class="blockopt underline">
                  <div id="res_o_missing_hyphens" class="result fright"></div>
                  <input type="checkbox" id="o_missing_hyphens" class="option" data-default="true" />
                  <label for="o_missing_hyphens" class="opt_lbl largew" data-l10n-en="tf_missing_hyphens">${tf_missing_hyphens}</label>
                </div>
                <div class="blockopt underline">
                  <div id="res_o_ma_word" class="result fright"></div>
                  <input type="checkbox" id="o_ma_word" class="option" data-default="true" />
                  <label for="o_ma_word" class="opt_lbl largew" data-l10n-en="tf_ma_word">${tf_ma_word}</label>
                </div>
                <div class="blockopt">
                  <div class="inlineblock indent">
                    <input type="checkbox" id="o_ma_1letter_lowercase" class="option" />
                    <label for="o_ma_1letter_lowercase" class="opt_lbl" data-l10n-en="tf_ma_1letter_lowercase">${tf_ma_1letter_lowercase}</label>
                  </div>
                  <div class="inlineblock indent">
                    <input type="checkbox" id="o_ma_1letter_uppercase" class="option" />
                    <label for="o_ma_1letter_uppercase" class="opt_lbl" data-l10n-en="tf_ma_1letter_uppercase">${tf_ma_1letter_uppercase}</label>
                  </div>
                </div>
              </div>
            </fieldset>

            <!-- Restructuration -->
            <fieldset>
              <legend><input type="checkbox" id="o_group_struct" class="option" data-default="false" /><label for="o_group_struct" data-l10n-en="tf_struct">${tf_struct}</label></legend>
              <div id="group_struct" class="groupblock">
                <div class="blockopt underline">
                  <div id="res_o_remove_hyphens_at_end_of_paragraphs" class="result fright"></div>
                  <input type="checkbox" id="o_remove_hyphens_at_end_of_paragraphs" class="option" data-default="false" />
                  <label for="o_remove_hyphens_at_end_of_paragraphs" class="opt_lbl largew"  data-l10n-en="tf_remove_hyphens_at_end_of_paragraphs">${tf_remove_hyphens_at_end_of_paragraphs}</label>
                </div>
                <div class="blockopt underline">
                  <div id="res_o_merge_contiguous_paragraphs" class="result fright"></div>
                  <input type="checkbox" id="o_merge_contiguous_paragraphs" class="option" data-default="false" />
                  <label for="o_merge_contiguous_paragraphs" class="opt_lbl largew" data-l10n-en="tf_merge_contiguous_paragraphs">${tf_merge_contiguous_paragraphs}</label>
                </div>
              </div>
            </fieldset>
          </div>

          <div id="tf_actions">
              <div id="tf_reset" class="button blue" data-l10n-en="Default">Par défaut</div>
              <div id="tf_apply" class="button green fright" data-l10n-en="Apply">Appliquer</div>
              <div id="tf_progressbarbox"><progress id="progressbar" style="width: 400px;"></progress> <span id="time_res"></span></div>
              <!--<div class="clearer"></div>
              <div id="infomsg" data-l10n-id="tf_infomsg"></div>-->
          </div>
        </section> <!-- text formatter -->

      </div> <!-- #page -->

    </div> <!-- #main -->

    <script src="main.js"></script>
  </body>

</html>

function showError (e) {
  console.error(e.fileName + "\n" + e.name + "\nline: " + e.lineNumber + "\n" + e.message);
}

function beastNameToURL(beastName) {
  switch (beastName) {
    case "Frog":
      return browser.extension.getURL("beasts/frog.jpg");
    case "Snake":
      return browser.extension.getURL("beasts/snake.jpg");
    case "Turtle":
      return browser.extension.getURL("beasts/turtle.jpg");
  }
}

window.addEventListener(
  "click",
  function (xEvent) {
    let xElem = xEvent.target;
    if (xElem.id) {
      if (xElem.id) {

      }
    } else if (xElem.className === "select") {
      showPage(xElem.dataset.page);
    } else if (xElem.tagName === "A") {
      openURL(xElem.getAttribute("href"));
    }
  },
  false
);

function showPage (sPageName) {
  try {
    // hide them all
    for (let xNodePage of document.getElementsByClassName("page")) {
      xNodePage.style.display = "None";
    }
    // show the one
    document.getElementById(sPageName).style.display = "block";
    sendMessage("Mon message");
    // specific modifications
    if (sPageName === "conj_page") {
      document.body.style.width = "600px";
      document.documentElement.style.width = "600px";
      document.getElementById("movewindow").style.display = "none";
    } else {
      document.body.style.width = "530px";
      document.documentElement.style.width = "530px";
      document.getElementById("movewindow").style.display = "block";
    }
  }
  catch (e) {
    showError(e);
  }
}

function handleResponse(message) {
  console.log(`[Panel] received: ${message.response}`);
}

function handleError(error) {
  console.log(`[Panel] Error: ${error}`);
}

function sendMessage (sMessage) {
  let sending = browser.runtime.sendMessage({content: sMessage});
  sending.then(handleResponse, handleError);  
}

<!DOCTYPE HTML>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="gc_panel.css" />
        <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    </head>









    <body class="panel">
        <div style="position: fixed; width: 100%">
            <div id="rightcorner">
                <a class="rightcornerbutton red" id="close" href="#" title="Fermer"><b>×</b></a>
                <a class="rightcornerbutton cyan" id="expand_reduce" href="#" title="Réduire/Agrandir"><b>−</b></a>
                <a class="rightcornerbutton1 green" id="copy_to_clipboard" href="#" style="display: none;" onclick="return false;" title="Copier dans le presse-papiers">
                    <b id="clipboard_msg">∑</b>

    xParser.add_argument("-ba", "--build_data_after", help="launch build_data.py (only part 2: before dictionary building)", action="store_true")
    xParser.add_argument("-d", "--dict", help="generate FSA dictionary", action="store_true")
    xParser.add_argument("-t", "--tests", help="run unit tests", action="store_true")
    xParser.add_argument("-p", "--perf", help="run performance tests", action="store_true")
    xParser.add_argument("-pm", "--perf_memo", help="run performance tests and store results in perf_memo.txt", action="store_true")
    xParser.add_argument("-js", "--javascript", help="JavaScript build for Firefox", action="store_true")
    xParser.add_argument("-fx", "--firefox", help="Launch Firefox Nightly for XPI testing", action="store_true")
    xParser.add_argument("-we", "--web_ext", help="Launch Firefox Nightly for WebExtension testing", action="store_true")
    xParser.add_argument("-tb", "--thunderbird", help="Launch Thunderbird", action="store_true")
    xParser.add_argument("-i", "--install", help="install the extension in Writer (path of unopkg must be set in config.ini)", action="store_true")
    xArgs = xParser.parse_args()

    if xArgs.build_data:
        xArgs.build_data_before = True
        xArgs.build_data_after = True

                        tests.perf(sVersion, hDst)

            # Firefox
            if xArgs.firefox:
                with helpers.cd("_build/xpi/"+sLang):
                    os.system("jpm run -b nightly")

            if xArgs.web_ext:
                with helpers.cd("_build/webext/"+sLang):
                    os.system(r'web-ext run --firefox="' + dVars['fx_beta_path'] + '" --browser-console')            

            # Thunderbird
            if xArgs.thunderbird:
                os.system("thunderbird -jsconsole -P debug")
        else:
            print("Folder not found: gc_lang/"+sLang)


if __name__ == '__main__':
    main()