From 6def703769241e946bc4a988912c211292500a50 Mon Sep 17 00:00:00 2001 From: bachrc Date: Sat, 26 Oct 2024 22:12:27 +0000 Subject: [PATCH] =?UTF-8?q?feat:=20petit=20message=20d'info=20concernant?= =?UTF-8?q?=20la=20force=20du=20caf=C3=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- deno.lock | 76 +++--------------------- src/components/ChampEditable.svelte | 2 +- src/components/TdsChart.svelte | 10 ++-- src/components/Verdict.svelte | 37 ++++++++++++ src/lib/chart_config.ts | 58 ++++++++++-------- src/lib/verdict.ts | 52 ++++++++++++++++ src/routes/extractions/[id]/+page.svelte | 62 +++++++++++-------- 7 files changed, 173 insertions(+), 124 deletions(-) create mode 100644 src/components/Verdict.svelte create mode 100644 src/lib/verdict.ts diff --git a/deno.lock b/deno.lock index 53e3729..87df580 100644 --- a/deno.lock +++ b/deno.lock @@ -17,7 +17,6 @@ "npm:postcss@^8.4.47": "8.4.47", "npm:prettier-plugin-svelte@^3.1.2": "3.2.7_prettier@3.3.3_svelte@5.0.3__acorn@8.13.0", "npm:prettier@^3.1.1": "3.3.3", - "npm:svelte-chartjs@^3.1.5": "3.1.5_chart.js@4.4.5_svelte@4.2.19", "npm:svelte-check@4": "4.0.5_svelte@5.0.3__acorn@8.13.0_typescript@5.6.3", "npm:svelte@5": "5.0.3_acorn@8.13.0", "npm:tailwindcss@^3.4.13": "3.4.14_postcss@8.4.47", @@ -306,7 +305,7 @@ "sade", "set-cookie-parser", "sirv", - "svelte@5.0.3_acorn@8.13.0", + "svelte", "tiny-glob", "vite" ] @@ -316,7 +315,7 @@ "dependencies": [ "@sveltejs/vite-plugin-svelte", "debug", - "svelte@5.0.3_acorn@8.13.0", + "svelte", "vite" ] }, @@ -328,7 +327,7 @@ "deepmerge", "kleur", "magic-string", - "svelte@5.0.3_acorn@8.13.0", + "svelte", "vite", "vitefu" ] @@ -579,16 +578,6 @@ "readdirp@4.0.2" ] }, - "code-red@1.0.4": { - "integrity": "sha512-7qJWqItLA8/VPVlKJlFXU+NBlo/qyfs39aJcuMT/2ere32ZqvF5OSxgdM5xOfJJ7O429gg2HM47y8v9P+9wrNw==", - "dependencies": [ - "@jridgewell/sourcemap-codec", - "@types/estree", - "acorn", - "estree-walker", - "periscopic" - ] - }, "color-convert@2.0.1": { "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", "dependencies": [ @@ -615,13 +604,6 @@ "which" ] }, - "css-tree@2.3.1": { - "integrity": "sha512-6Fv1DV/TYw//QF5IzQdqsNDjx/wc8TrMBZsqjL9eW01tWb7R7k/mq+/VXfJCl7SoD5emsJop9cOByJZfs8hYIw==", - "dependencies": [ - "mdn-data", - "source-map-js" - ] - }, "cssesc@3.0.0": { "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==" }, @@ -719,7 +701,7 @@ "postcss-safe-parser", "postcss-selector-parser", "semver", - "svelte@5.0.3_acorn@8.13.0", + "svelte", "svelte-eslint-parser" ] }, @@ -824,12 +806,6 @@ "estraverse@5.3.0": { "integrity": "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==" }, - "estree-walker@3.0.3": { - "integrity": "sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g==", - "dependencies": [ - "@types/estree" - ] - }, "esutils@2.0.3": { "integrity": "sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==" }, @@ -1079,9 +1055,6 @@ "@jridgewell/sourcemap-codec" ] }, - "mdn-data@2.0.30": { - "integrity": "sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==" - }, "merge2@1.4.1": { "integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==" }, @@ -1193,14 +1166,6 @@ "minipass" ] }, - "periscopic@3.1.0": { - "integrity": "sha512-vKiQ8RRtkl9P+r/+oefh25C3fhybptkHKCZSPlcXiJux2tJF55GnEj3BVn4A5gKfq9NWWXXrxkHBwVPUfH0opw==", - "dependencies": [ - "@types/estree", - "estree-walker", - "is-reference" - ] - }, "picocolors@1.1.1": { "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==" }, @@ -1292,7 +1257,7 @@ "integrity": "sha512-/Dswx/ea0lV34If1eDcG3nulQ63YNr5KPDfMsjbdtpSWOxKKJ7nAc2qlVuYwEvCr4raIuredNoR7K4JCkmTGaQ==", "dependencies": [ "prettier", - "svelte@5.0.3_acorn@8.13.0" + "svelte" ] }, "prettier@3.3.3": { @@ -1449,13 +1414,6 @@ "supports-preserve-symlinks-flag@1.0.0": { "integrity": "sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==" }, - "svelte-chartjs@3.1.5_chart.js@4.4.5_svelte@4.2.19": { - "integrity": "sha512-ka2zh7v5FiwfAX1oMflZ0HkNkgjHjFqANgRyC+vNYXfxtx2ku68Zo+2KgbKeBH2nS1ThDqkIACPzGxy4T0UaoA==", - "dependencies": [ - "chart.js", - "svelte@4.2.19" - ] - }, "svelte-check@4.0.5_svelte@5.0.3__acorn@8.13.0_typescript@5.6.3": { "integrity": "sha512-icBTBZ3ibBaywbXUat3cK6hB5Du+Kq9Z8CRuyLmm64XIe2/r+lQcbuBx/IQgsbrC+kT2jQ0weVpZSSRIPwB6jQ==", "dependencies": [ @@ -1464,7 +1422,7 @@ "fdir", "picocolors", "sade", - "svelte@5.0.3_acorn@8.13.0", + "svelte", "typescript" ] }, @@ -1476,26 +1434,7 @@ "espree@9.6.1_acorn@8.13.0", "postcss", "postcss-scss", - "svelte@5.0.3_acorn@8.13.0" - ] - }, - "svelte@4.2.19": { - "integrity": "sha512-IY1rnGr6izd10B0A8LqsBfmlT5OILVuZ7XsI0vdGPEvuonFV7NYEUK4dAkm9Zg2q0Um92kYjTpS1CAP3Nh/KWw==", - "dependencies": [ - "@ampproject/remapping", - "@jridgewell/sourcemap-codec", - "@jridgewell/trace-mapping", - "@types/estree", - "acorn", - "aria-query", - "axobject-query", - "code-red", - "css-tree", - "estree-walker", - "is-reference", - "locate-character", - "magic-string", - "periscopic" + "svelte" ] }, "svelte@5.0.3_acorn@8.13.0": { @@ -1707,7 +1646,6 @@ "npm:postcss@^8.4.47", "npm:prettier-plugin-svelte@^3.1.2", "npm:prettier@^3.1.1", - "npm:svelte-chartjs@^3.1.5", "npm:svelte-check@4", "npm:svelte@5", "npm:tailwindcss@^3.4.13", diff --git a/src/components/ChampEditable.svelte b/src/components/ChampEditable.svelte index bf733fa..448d075 100644 --- a/src/components/ChampEditable.svelte +++ b/src/components/ChampEditable.svelte @@ -41,7 +41,7 @@
{#if titre}
- {titre} + {titre} {@render boutonsEdition()}
{/if} diff --git a/src/components/TdsChart.svelte b/src/components/TdsChart.svelte index 6122fd2..2edca2c 100644 --- a/src/components/TdsChart.svelte +++ b/src/components/TdsChart.svelte @@ -24,21 +24,23 @@ annotationPlugin ); let { - extraction = $bindable() + extraction }: { extraction: Extraction; } = $props(); let ctx: CanvasRenderingContext2D; let chartCanvas: HTMLCanvasElement; - let chart: Chart | null; + let chart: Chart; $effect(() => { - chart?.destroy(); - ctx = chartCanvas.getContext('2d')!; chart = setupChart(ctx, extraction); + + return () => { + chart.destroy(); + }; }); diff --git a/src/components/Verdict.svelte b/src/components/Verdict.svelte new file mode 100644 index 0000000..5ffb779 --- /dev/null +++ b/src/components/Verdict.svelte @@ -0,0 +1,37 @@ + + + + {verdictFinal} + diff --git a/src/lib/chart_config.ts b/src/lib/chart_config.ts index e283352..58952e0 100644 --- a/src/lib/chart_config.ts +++ b/src/lib/chart_config.ts @@ -1,6 +1,12 @@ import { calculYield, tdsMoyen, yieldMoyen, type Extraction } from './extractions.ts'; import annotationPlugin from 'chartjs-plugin-annotation'; import { Chart, type ChartItem, type ChartConfiguration } from 'chart.js'; +import { + LIMITE_TDS_FAIBLESSE, + LIMITE_TDS_FORCE, + LIMITE_YIELD_SOUS_EXTRACTION, + LIMITE_YIELD_SUR_EXTRACTION +} from './verdict.ts'; export function setupChart(node: ChartItem, extraction: Extraction): Chart { const config: ChartConfiguration = { @@ -14,72 +20,72 @@ export function setupChart(node: ChartItem, extraction: Extraction): Chart { weak_and_underextracted: { type: 'box', xMin: 0, - xMax: 18, + xMax: LIMITE_YIELD_SOUS_EXTRACTION, yMin: 0, - yMax: 1.15, + yMax: LIMITE_TDS_FAIBLESSE, backgroundColor: 'rgba(0, 125, 200, 0.20)' }, underextracted: { type: 'box', xMin: 0, - xMax: 18, - yMin: 1.15, - yMax: 1.45, + xMax: LIMITE_YIELD_SOUS_EXTRACTION, + yMin: LIMITE_TDS_FAIBLESSE, + yMax: LIMITE_TDS_FORCE, backgroundColor: 'rgba(0, 125, 200, 0.40)' }, strong_and_underextracted: { type: 'box', xMin: 0, - xMax: 18, - yMin: 1.45, + xMax: LIMITE_YIELD_SOUS_EXTRACTION, + yMin: LIMITE_TDS_FORCE, yMax: 2, backgroundColor: 'rgba(0, 125, 200, 0.60)' }, weak: { type: 'box', - xMin: 18, - xMax: 22, + xMin: LIMITE_YIELD_SOUS_EXTRACTION, + xMax: LIMITE_YIELD_SUR_EXTRACTION, yMin: 0, - yMax: 1.15, + yMax: LIMITE_TDS_FAIBLESSE, backgroundColor: 'rgba(39, 212, 82, 0.2)' }, ideal: { type: 'box', - xMin: 18, - xMax: 22, - yMin: 1.15, - yMax: 1.45, + xMin: LIMITE_YIELD_SOUS_EXTRACTION, + xMax: LIMITE_YIELD_SUR_EXTRACTION, + yMin: LIMITE_TDS_FAIBLESSE, + yMax: LIMITE_TDS_FORCE, backgroundColor: 'rgba(39, 212, 82, 0.4)' }, strong: { type: 'box', - xMin: 18, - xMax: 22, - yMin: 1.45, + xMin: LIMITE_YIELD_SOUS_EXTRACTION, + xMax: LIMITE_YIELD_SUR_EXTRACTION, + yMin: LIMITE_TDS_FORCE, yMax: 2, backgroundColor: 'rgba(39, 212, 82, 0.6)' }, weak_and_overextracted: { type: 'box', - xMin: 22, + xMin: LIMITE_YIELD_SUR_EXTRACTION, xMax: 30, yMin: 0, - yMax: 1.15, + yMax: LIMITE_TDS_FAIBLESSE, backgroundColor: 'rgba(200, 75, 0, 0.2)' }, overextracted: { type: 'box', - xMin: 22, + xMin: LIMITE_YIELD_SUR_EXTRACTION, xMax: 30, - yMin: 1.15, - yMax: 1.45, + yMin: LIMITE_TDS_FAIBLESSE, + yMax: LIMITE_TDS_FORCE, backgroundColor: 'rgba(200, 75, 0, 0.4)' }, strong_and_overextracted: { type: 'box', - xMin: 22, + xMin: LIMITE_YIELD_SUR_EXTRACTION, xMax: 30, - yMin: 1.45, + yMin: LIMITE_TDS_FORCE, yMax: 2, backgroundColor: 'rgba(200, 75, 0, 0.6)' } @@ -128,12 +134,12 @@ export function setupChart(node: ChartItem, extraction: Extraction): Chart { label: 'TDS Moyen', backgroundColor: 'rgba(254, 70, 255, 1)', borderColor: 'rgba(254, 70, 255, 1)', - data: [{ x: tdsMoyen(extraction), y: yieldMoyen(extraction) }], + data: [{ x: yieldMoyen(extraction), y: tdsMoyen(extraction) }], radius: 6 } ] } }; - console.log(config); + return new Chart(node, config); } diff --git a/src/lib/verdict.ts b/src/lib/verdict.ts new file mode 100644 index 0000000..e5b79d2 --- /dev/null +++ b/src/lib/verdict.ts @@ -0,0 +1,52 @@ +import { tdsMoyen, yieldMoyen, type Extraction } from './extractions.ts'; + +export const LIMITE_YIELD_SOUS_EXTRACTION = 18; +export const LIMITE_YIELD_SUR_EXTRACTION = 22; +export const LIMITE_TDS_FAIBLESSE = 1.15; +export const LIMITE_TDS_FORCE = 1.45; + +export type VerdictIntensiteExtraction = 'sous-extrait' | 'bien extrait' | 'sur-extrait'; +export type VerdictForce = 'trop faible' | 'optimale' | 'trop forte'; +export type Verdict = { + force: VerdictForce; + intensiteExtraction: VerdictIntensiteExtraction; +}; + +function verdictIntensiteExtraction(extraction: Extraction): VerdictIntensiteExtraction { + const yieldExtraction = yieldMoyen(extraction); + + if (yieldExtraction < 18) { + return 'sous-extrait'; + } + + if (22 < yieldExtraction) { + return 'sur-extrait'; + } + + return 'bien extrait'; +} + +function verdictForce(extraction: Extraction): VerdictForce { + const tdsExtraction = tdsMoyen(extraction); + + if (tdsExtraction < 1.15) { + return 'trop faible'; + } + + if (1.45 < tdsExtraction) { + return 'trop forte'; + } + + return 'optimale'; +} + +export function renduDeVerdict(extraction: Extraction): Verdict { + return { + force: verdictForce(extraction), + intensiteExtraction: verdictIntensiteExtraction(extraction) + }; +} + +export function serialisationDeVerdict(verdict: Verdict): string { + return `Ton café est ${verdict.intensiteExtraction}, et sa force ${verdict.force}.`; +} diff --git a/src/routes/extractions/[id]/+page.svelte b/src/routes/extractions/[id]/+page.svelte index d070c6b..1605e1a 100644 --- a/src/routes/extractions/[id]/+page.svelte +++ b/src/routes/extractions/[id]/+page.svelte @@ -1,6 +1,6 @@