Skip to content

Commit

Permalink
Change analysis model and add 2 new cards (#88)
Browse files Browse the repository at this point in the history 
* Show simulation in table

* Change message no token

* Update DataCarbon

* WIP: check all servers

* Revert "WIP: check all servers"

This reverts commit 286654c.

* Integrate optional Call ApiCo2Signal (#82)

* Show simulation in table (#77)

* Change message token Co2Signal (#78)

* Show simulation in table

* Change message no token

* Integrate optional Call ApiCo2Signal

* Add cache for intensity and location

* Feature #80 results per servers localisation (#83)

* Data reception and sorting ok

* WIP insert new card

* WIP insert new card

* WIP insert new card

* WIP insert new card

* Style

* Messages

* #80 : review html markup, only show resources names

* Change bottom message for show/hide urls

* Move buttom

---------

Co-authored-by: OlivierCamon <[email protected]>

* Css Change

* nitpick : removed duplicated code (#84)

* Feature #79 compute average carbon intensity of server requests by location (#85)

* Change model of calcul

* Change model of calcul

* #86 new cards summarize data (#87)

* Update next version

* Reorganisation .svelte

* Add summary cards

* Clean old code

Co-authored-by: OlivierCamon <[email protected]>

* Clean old code

Co-authored-by: OlivierCamon <[email protected]>

---------

Co-authored-by: OlivierCamon <[email protected]>

* Change summary title

---------

Co-authored-by: boukhalfa.zahout <[email protected]>
Co-authored-by: OlivierCamon <[email protected]>
Co-authored-by: OlivierCamon <[email protected]>
  • Loading branch information
@Tuxivinc @BZConserto @OlivierCamon
4 people authored Jun 17, 2024
1 parent bd53f0e commit af7918b
Show file tree
Hide file tree
Showing 65 changed files with 3,338 additions and 954 deletions.
2 changes: 1 addition & 1 deletion extension/manifest.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
"manifest_version": 3,
"name": "GreenTrackR",
"description": "__MSG_extDesc__",
"version": "2.1.1",
"version": "2.2.0",
"icons": {
"64": "images/logo.png"
},
Expand Down
2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "greenTrackR",
"private": true,
"version": "2.1.1",
"version": "2.2.0",
"type": "module",
"scripts": {
"dev": "vite --host=0.0.0.0",
Expand Down
49 changes: 44 additions & 5 deletions public/_locales/en/messages.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -74,9 +74,6 @@
"energyEquivalent": {
"message": "Electricity"
},
"errorNoToken": {
"message": "GreenTrackR uses the 'CO2signal' API from Electricity Maps. To use this API, you need an access token, go to parameters tabs"
},
"evaluationTab": {
"message": "Evaluation"
},
Expand Down Expand Up @@ -222,7 +219,7 @@
"message": "Setting"
},
"paramTokenCo2Description": {
"message": "GreenTrackR uses the 'CO2signal' API from Electricity Maps. To use this API, you need an access token, you can get it on the following link 'Go to api portal' -> "
"message": "GreenTrackR can be more precise in its measurements using the 'CO2signal' API from Electricity Maps. To use this API, you need an access token, you can get it on the following link 'Go to api portal' -> "
},
"paramTokenCo2URL": {
"message": "https://www.co2signal.com/"
Expand All @@ -242,6 +239,24 @@
"resDetCaptionDescription": {
"message": "The resources used by the analyzed page are shown in the first column of the following table. The server part is divided into 3 columns representing the number of cached requests, then those without cache, and finally a percentage of each resources. Next, the networks section displays the weight of the compressed resource transferred, as well as its percentage. Finally, the client part contains the weight of the decompressed page downloaded, as well as its percentage. Translated with DeepL.com (free version)"
},
"resDetCountCaption": {
"message": "Geolocation of resources"
},
"resDetCountrySwitchUrlHide": {
"message": "Hide full URL"
},
"resDetCountrySwitchUrlShow": {
"message": "Show full URL"
},
"resDetCountTitleHit": {
"message": "requests"
},
"resDetCountTitleResources": {
"message": "resources"
},
"resDetHostDTitleCache": {
"message": "cached"
},
"resDetSubTitleCliPercent": {
"message": "Percent"
},
Expand Down Expand Up @@ -287,6 +302,30 @@
"resetMeasure": {
"message": "Reset measure"
},
"resSumCaption": {
"message": "Datas"
},
"resSumEmpCli": {
"message": "User location: "
},
"resSumEmpSrv": {
"message": "Server location: "
},
"resSumNbCountry": {
"message": "Server(s)'s country: "
},
"resSumNbRes": {
"message": "Load resource(s): "
},
"resSumNbSrv": {
"message": "Number of server: "
},
"resSumSizeClient": {
"message": "User size: "
},
"resSumSizeNetwork": {
"message": "Network size: "
},
"saveAnalysis": {
"message": "Analysis successfully saved."
},
Expand Down Expand Up @@ -408,7 +447,7 @@
"message": "WATER"
},
"tableZoneIntensityShort": {
"message": "Intensité"
"message": "Intensity"
},
"tableZoneIp": {
"message": "Zone"
Expand Down
47 changes: 43 additions & 4 deletions public/_locales/fr/messages.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -74,9 +74,6 @@
"energyEquivalent": {
"message": "Electricité"
},
"errorNoToken": {
"message": "GreenTrackR utilise l'API 'CO2signal' de 'Electricity Maps', afin de pouvoir utiliser cette API il vous faut un token d'accès, rendez-vous dans l'onglet Paramètres"
},
"evaluationTab": {
"message": "Èvaluation"
},
Expand Down Expand Up @@ -222,7 +219,7 @@
"message": "Paramétrage"
},
"paramTokenCo2Description": {
"message": "GreenTrackR utilise l'API 'CO2signal' de 'Electricity Maps', afin de pouvoir utiliser cette API il vous faut un token d'accès, cliquez sur le lien puis sur 'Go to api portal' -> "
"message": "GreenTrackR peut-être plus précis dans ses mesures en utilisant l'API 'CO2signal' de 'Electricity Maps', afin de pouvoir utiliser cette API il vous faut un token d'accès, cliquez sur le lien puis sur 'Go to api portal' -> "
},
"paramTokenCo2URL": {
"message": "https://www.co2signal.com/"
Expand All @@ -242,6 +239,24 @@
"resDetCaptionDescription": {
"message": "Les ressources utilisées par la page analysée sont présentées dans la première colonne du tableau suivant. La partie serveur est subdivisé en 3 colonnes qui représente le nombre de requêtes en cache, puis celles sans cache et enfin un pourcentage de la part de chaque ressource. Ensuite, la partie réseaux présentent le poids de la ressource compressée transférée, ainsi que son pourcentage. Enfin, la partie client contient le poids de la page décompressé téléchargée ainsi que son pourcentage."
},
"resDetCountCaption": {
"message": "Géolocalisation des ressources"
},
"resDetCountrySwitchUrlHide": {
"message": "Masquer les URL complètes"
},
"resDetCountrySwitchUrlShow": {
"message": "Afficher les URL complètes"
},
"resDetCountTitleHit": {
"message": "requêtes"
},
"resDetCountTitleResources": {
"message": "ressources"
},
"resDetHostDTitleCache": {
"message": "En cache"
},
"resDetSubTitleCliPercent": {
"message": "Pourcentage"
},
Expand Down Expand Up @@ -287,6 +302,30 @@
"resetMeasure": {
"message": "Réinitialiser la mesure"
},
"resSumCaption": {
"message": "Données"
},
"resSumEmpCli": {
"message": "Emplacement client : "
},
"resSumEmpSrv": {
"message": "Emplacement serveur : "
},
"resSumNbCountry": {
"message": "Pays serveur(s) : "
},
"resSumNbRes": {
"message": "Ressource(s) chargée(s) : "
},
"resSumNbSrv": {
"message": "Nombre de serveur : "
},
"resSumSizeClient": {
"message": "Poids page client : "
},
"resSumSizeNetwork": {
"message": "Transfert réseau : "
},
"saveAnalysis": {
"message": "L'évaluation a bien été enregistrée."
},
Expand Down
114 changes: 58 additions & 56 deletions src/App.svelte
View file
Original file line number Diff line number Diff line change
@@ -1,13 +1,11 @@
<script lang="ts">
import logo from '/images/logo.png';
import { AutoScroll, Evaluation, Parcours, Parameter } from 'src/pages';
import { Alert, Tab, Footer, Button } from 'src/components';
import { getLocalStorageObject, translate, translateHtmlUrl } from './utils';
import { AlertTypeEnum, ButtonTypeEnum } from './enum';
import { paramTokenCo2 } from './const';
import { Modal } from './components';
import { AutoScroll, Evaluation, Parameter, Parcours } from 'src/pages';
import { logErr, translate, translateHtmlUrl } from 'src/utils';
import { ButtonTypeEnum } from 'src/enum';
import { Alert, Footer, Modal, Tab } from 'src/components/page';
import { onMount } from 'svelte';
import { logErr } from './utils/log';
import { Button } from 'src/components/html';
export let tabs = [
{
Expand All @@ -25,7 +23,7 @@
component: AutoScroll,
descriptionKey: 'scrollTabDescription',
description: '',
beta: true,
beta: true
},
{
translateKey: 'tabJourney',
Expand All @@ -34,17 +32,18 @@
component: Parcours,
descriptionKey: 'userJourneyTabDescription',
description: '',
beta: true,
beta: true
},
{
translateKey: 'tabParameter',
name: translate('parameterTab'),
id: 'parameter-tab',
component: Parameter,
},
component: Parameter
}
];
export let activeTabId = 'evaluation-tab';
let showModal = false;
function handleClick(event: CustomEvent) {
activeTabId = event.detail.id;
}
Expand All @@ -56,20 +55,15 @@
tab.description = t;
tabs = tabs;
})).catch((err) => {
logErr(`unable to perform the fetch request ${err}`)
logErr(`unable to perform the fetch request ${err}`);
});
}
})
});
});
</script>

<header role="banner" class="flex-col-center">
<img src={logo} alt="GreenTrackR Conserto" />
{#if !getLocalStorageObject(paramTokenCo2)}
<div>
<Alert message="errorNoToken" alertType={AlertTypeEnum.INFO} />
</div>
{/if}
<div class="nav nav-tabs" id="myTab" role="tablist">
{#each tabs as tab}
<Tab
Expand All @@ -89,28 +83,34 @@
{#if activeTabId !== 'parameter-tab' }
<h1 class="plugin-title">{translate('noContentPhraseEvaluation')}
{#if tab.description}
<button type="button" class="modaltrigger" on:click={() => (showModal = true)}><svg role="img" aria-label="{translate('globalInfo')}" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="20" height="20" viewBox="0 0 50 50">
<path d="M 25 2 C 12.309295 2 2 12.309295 2 25 C 2 37.690705 12.309295 48 25 48 C 37.690705 48 48 37.690705 48 25 C 48 12.309295 37.690705 2 25 2 z M 25 4 C 36.609824 4 46 13.390176 46 25 C 46 36.609824 36.609824 46 25 46 C 13.390176 46 4 36.609824 4 25 C 4 13.390176 13.390176 4 25 4 z M 25 11 A 3 3 0 0 0 22 14 A 3 3 0 0 0 25 17 A 3 3 0 0 0 28 14 A 3 3 0 0 0 25 11 z M 21 21 L 21 23 L 22 23 L 23 23 L 23 36 L 22 36 L 21 36 L 21 38 L 22 38 L 23 38 L 27 38 L 28 38 L 29 38 L 29 36 L 28 36 L 27 36 L 27 21 L 26 21 L 22 21 L 21 21 z"></path>
</svg></button>
<button type="button" class="modaltrigger" on:click={() => (showModal = true)}>
<svg role="img" aria-label="{translate('globalInfo')}" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
width="20" height="20" viewBox="0 0 50 50">
<path
d="M 25 2 C 12.309295 2 2 12.309295 2 25 C 2 37.690705 12.309295 48 25 48 C 37.690705 48 48 37.690705 48 25 C 48 12.309295 37.690705 2 25 2 z M 25 4 C 36.609824 4 46 13.390176 46 25 C 46 36.609824 36.609824 46 25 46 C 13.390176 46 4 36.609824 4 25 C 4 13.390176 13.390176 4 25 4 z M 25 11 A 3 3 0 0 0 22 14 A 3 3 0 0 0 25 17 A 3 3 0 0 0 28 14 A 3 3 0 0 0 25 11 z M 21 21 L 21 23 L 22 23 L 23 23 L 23 36 L 22 36 L 21 36 L 21 38 L 22 38 L 23 38 L 27 38 L 28 38 L 29 38 L 29 36 L 28 36 L 27 36 L 27 21 L 26 21 L 22 21 L 21 21 z"></path>
</svg>
</button>
{/if}
</h1>
{#if tab.description}
<Modal dialogLabelKey="globalInfo" bind:showModal cssClass="infos">
<div class="dialog__wrapper">
{@html tab.description}
</div>
<div><Button
on:buttonClick={() => (showModal = false)}
buttonType={ButtonTypeEnum.SECONDARY}
translateKey="closePopup"
/></div>
<div>
<Button
on:buttonClick={() => (showModal = false)}
buttonType={ButtonTypeEnum.SECONDARY}
translateKey="closePopup"
/>
</div>
</Modal>
{/if}
{/if}
<div class="tab-panel" role="tabpanel" aria-label={`${tab.name}`}>

{#if tab.beta}
<Alert message="betaMessage"/>
<Alert message="betaMessage" />
{/if}
<svelte:component this={tab.component} />
</div>
Expand All @@ -120,36 +120,38 @@
<Footer />

<style>
.app-container {
justify-content: start;
margin: 0 var(--spacing--xl) 0 var(--spacing--xl);
}
.dialog__wrapper {
height: 60vh;
overflow: auto;
overflow-wrap: break-word;
}
.app-container {
justify-content: start;
margin: 0 var(--spacing--xl) 0 var(--spacing--xl);
}
.nav {
display: flex;
justify-content: center;
flex-wrap: wrap;
padding-left: 0;
margin: 0;
list-style: none;
}
.dialog__wrapper {
height: 60vh;
overflow: auto;
overflow-wrap: break-word;
}
.tab-panel {
text-align: center;
}
.nav {
display: flex;
justify-content: center;
flex-wrap: wrap;
padding-left: 0;
margin: 0;
list-style: none;
}
.plugin-title {
font-size: var(--font-size--xxl);
color: var(--color--green);
text-align: center;
}
.modaltrigger {
background-color: unset;
border-color: transparent;
}
.tab-panel {
text-align: center;
}
.plugin-title {
font-size: var(--font-size--xxl);
color: var(--color--green);
text-align: center;
}
.modaltrigger {
background-color: unset;
border-color: transparent;
}
</style>
Loading

0 comments on commit af7918b

Please sign in to comment.