diff --git a/public/manifest-chrome.json b/public/manifest-chrome.json index ad10246..ffe7ec3 100644 --- a/public/manifest-chrome.json +++ b/public/manifest-chrome.json @@ -14,6 +14,7 @@ "default_title": "NumÉcoDiag" }, "permissions": [ - "storage" + "storage", + "tabs" ] } diff --git a/public/manifest.json b/public/manifest.json index a1c5792..ffb2d21 100644 --- a/public/manifest.json +++ b/public/manifest.json @@ -21,6 +21,7 @@ } }, "permissions": [ - "storage" + "storage", + "tabs" ] } \ No newline at end of file diff --git a/public/options.html b/public/options.html new file mode 100644 index 0000000..c535119 --- /dev/null +++ b/public/options.html @@ -0,0 +1,13 @@ + + + + + + + + NumÉcoDiag | Options + + + + + \ No newline at end of file diff --git a/readme.md b/readme.md index 643a4d1..1abff49 100755 --- a/readme.md +++ b/readme.md @@ -1,10 +1,10 @@ # NumÉcoDiag -Cette WebExtension développée et mise à disposition gratuitement par la [MiNumEco](https://ecoresponsable.numerique.gouv.fr/) facilite l’auto-diagnostic de l’écoconception d’un service numérique, conformément au [Référentiel Général d'Écoconception de Services Numériques](https://ecoresponsable.numerique.gouv.fr/publications/referentiel-general-ecoconception/) (RGESN). +Cette webExtension développée et mise à disposition gratuitement par la [MiNumEco](https://ecoresponsable.numerique.gouv.fr/) facilite l’auto-diagnostic de l’écoconception d’un service numérique, conformément au [Référentiel Général d'Écoconception de Services Numériques](https://ecoresponsable.numerique.gouv.fr/publications/referentiel-general-ecoconception/) (RGESN). Réalisation : [Pôle écoconception Temesis](https://www.temesis.com/). -## Installation +## Installation de l'extension * [Firefox](https://addons.mozilla.org/fr/firefox/addon/num%C3%A9codiag/) * [Chrome](https://chrome.google.com/webstore/detail/num%C3%A9codiag/fhdeahmddgflanbgilcglipaeofmcabc) @@ -12,15 +12,29 @@ Réalisation : [Pôle écoconception Temesis](https://www.temesis.com/). ## Installation manuelle +### Installer en tant que webExtension + 1. Installer [nodeJS](https://nodejs.org/fr/) (v16 minimum) et le gestionnaire de paquets NPM. 2. Dans un terminal, depuis le dossier téléchargé, lancer la commande `npm install` pour télécharger / installer les dépendances de développement du projet. 3. Dans le même terminal, lancer ensuite la commande `npm run build` pour construire l'application depuis les sources fournies. -4. Procédure d'installation spécifique - - Sur Firefox : charger l'extension depuis l'adresse `about:debbuging` en sélectionnant le fichier `public/manifest.json`. - - Sur Chrome : - 1. Renommer le fichier `/public/manifest-chrome.json` en `manifest.json`. - 2. Charger l'extension depuis l'adresse `chrome://extensions/` en sélectionnant le dossier `public`. -5. L'accès au popup se fait depuis la partie supérieure droite du navigateur. +4. Procédure d'installation spécifique aux navigateurs web : + * Sur Firefox : charger l'extension depuis l'adresse "about:debbuging" en sélectionnant le fichier "public/manifest.json". + * Sur Chrome : + 1. Supprimer le fichier "/public/manifest.json". + 2. Renommer le fichier "/public/manifest-chrome.json" en "manifest.json". + 3. Charger l'extension depuis l'adresse "chrome://extensions/" en sélectionnant le dossier "public". + +### Utiliser en tant que webApplication + +1. Installer [nodeJS](https://nodejs.org/fr/) (v16 minimum) et le gestionnaire de paquets NPM. +2. Dans un terminal, depuis le dossier téléchargé, lancer la commande `npm install` pour télécharger / installer les dépendances de développement du projet. +3. Dans le même terminal, lancer ensuite la commande `npm run dev` pour travailler sur le projet. +4. Passer la valeur de la constante `webAppMode` du fichier "/src/modules/webAppMode.mjs" à `true. +5. Se rendre à l'adresse "http://localhost:37271/". + +### Différences entre les deux versions + +* La webExtension utilise l'[API storage](https://developer.mozilla.org/fr/docs/Mozilla/Add-ons/webExtensions/API/storage) alors que la webApplication l'application utilise l'[API Web Storage](https://developer.mozilla.org/fr/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API). ## Licences diff --git a/rollup.config.js b/rollup.config.js index 91da406..684bd9e 100755 --- a/rollup.config.js +++ b/rollup.config.js @@ -28,49 +28,59 @@ function serve() { }; } -export default { - input: 'src/main.js', - output: { - sourcemap: true, - format: 'iife', - name: 'app', - file: 'public/assets/app.js' +export default [ + { + input: 'src/app.js', + output: { + format: 'iife', + name: 'app', + file: 'public/assets/app.js' + }, + plugins: [ + svelte({ + compilerOptions: { + dev: !production + } + }), + css({ output: 'app.css' }), + resolve({ + browser: true, + dedupe: ['svelte'] + }), + commonjs(), + !production && serve(), + !production && livereload('public'), + production && terser() + ], + watch: { + clearScreen: false + } }, - plugins: [ - svelte({ - compilerOptions: { - // enable run-time checks when not in production - dev: !production - } - }), - // we'll extract any component CSS out into - // a separate file - better for performance - css({ output: 'app.css' }), - - // If you have external dependencies installed from - // npm, you'll most likely need these plugins. In - // some cases you'll need additional configuration - - // consult the documentation for details: - // https://github.com/rollup/plugins/tree/master/packages/commonjs - resolve({ - browser: true, - dedupe: ['svelte'] - }), - commonjs(), - - // In dev mode, call `npm run start` once - // the bundle has been generated - !production && serve(), - - // Watch the `public` directory and refresh the - // browser on changes when not in production - !production && livereload('public'), - - // If we're building for production (npm run build - // instead of npm run dev), minify - production && terser() - ], - watch: { - clearScreen: false + { + input: 'src/options.js', + output: { + format: 'iife', + name: 'app', + file: 'public/assets/options.js' + }, + plugins: [ + svelte({ + compilerOptions: { + dev: !production + } + }), + css({ output: 'options.css' }), + resolve({ + browser: true, + dedupe: ['svelte'] + }), + commonjs(), + !production && serve(), + !production && livereload('public'), + production && terser() + ], + watch: { + clearScreen: false + } } -}; +]; diff --git a/src/App.svelte b/src/App.svelte index bb6e6a0..f6fc781 100755 --- a/src/App.svelte +++ b/src/App.svelte @@ -1,15 +1,19 @@ @@ -224,15 +104,10 @@ - + on:updated="{setAudit}" /> {/key} {/if} diff --git a/src/Options.svelte b/src/Options.svelte new file mode 100644 index 0000000..180dcac --- /dev/null +++ b/src/Options.svelte @@ -0,0 +1,195 @@ + + +
+ {#if webAppMode} + Retour + {/if} +

NumÉcoDiag | Options

+

Exporter, communiquer

+ + + +
+ + +
+

Configurer

+ +
+ + \ No newline at end of file diff --git a/src/main.js b/src/app.js similarity index 100% rename from src/main.js rename to src/app.js diff --git a/src/components/Navigation.svelte b/src/components/Navigation.svelte index 81e432c..c92c895 100644 --- a/src/components/Navigation.svelte +++ b/src/components/Navigation.svelte @@ -1,3 +1,8 @@ + + diff --git a/src/components/Options.svelte b/src/components/Options.svelte deleted file mode 100644 index d237ea4..0000000 --- a/src/components/Options.svelte +++ /dev/null @@ -1,32 +0,0 @@ - - - - - - - \ No newline at end of file diff --git a/src/modules/env.mjs b/src/modules/env.mjs new file mode 100644 index 0000000..522abc8 --- /dev/null +++ b/src/modules/env.mjs @@ -0,0 +1,2 @@ +// Makes NumÉcoDiag cross browser as webExtension (no server required) +export const env = window.browser === undefined ? window.chrome : window.browser; \ No newline at end of file diff --git a/src/modules/helpers.mjs b/src/modules/helpers.mjs new file mode 100644 index 0000000..aac129f --- /dev/null +++ b/src/modules/helpers.mjs @@ -0,0 +1,74 @@ +import { webAppMode } from './webAppMode.mjs'; +import { env } from './env.mjs'; + +export const setLocalData = (name, value) => { + return new Promise( + (resolve) => { + if(!webAppMode) { // Asynchronous + env.storage.local.set({[name]: value}) + .then(resolve()); + } + else { // Synchronous + localStorage.setItem(name, value); + resolve(); + } + } + ); +}; + +export const getLocalData = name => { + return new Promise( + (resolve) => { // Asynchronous + if(!webAppMode) { + env.storage.local.get(name) + .then(data => resolve(data[name])); + } + else { // Synchronous + resolve(localStorage.getItem(name)); + } + } + ); +}; + +export const getAudits = () => { + return new Promise( + (resolve ,reject) => { + getLocalData('audits') + .then((data) => { + if((data !== null && data !== undefined)) { + resolve(data); + } + else { + reject('Absence d\'historique'); + } + } + ); + } + ); +}; + +export const getRGESN = (versionToLoad) => { + return new Promise( + (resolve, reject) => { + fetch(`./rgesn/${versionToLoad}.json`) + .then((resp) => { + if(resp.ok) { + resp.text() + .then((data) => { + try { + resolve(JSON.parse(data)); + } + catch(e) { + reject('Lecture du référentiel impossible'); + } + } + ); + } + else { + reject('Ouverture du référentiel impossible'); + } + } + ); + } + ); +}; \ No newline at end of file diff --git a/src/modules/webAppMode.mjs b/src/modules/webAppMode.mjs new file mode 100644 index 0000000..d6ea3c6 --- /dev/null +++ b/src/modules/webAppMode.mjs @@ -0,0 +1,2 @@ +// Makes NumÉcoDiag able to be served as webApp to make debugging easier (server required) +export const webAppMode = false; \ No newline at end of file diff --git a/src/options.js b/src/options.js new file mode 100755 index 0000000..469637c --- /dev/null +++ b/src/options.js @@ -0,0 +1,7 @@ +import Options from './Options.svelte'; + +var options = new Options({ + target: document.body +}); + +export default options; \ No newline at end of file