From 66ea27b0fbcf62e82fe68f973bfadb87cafad654 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Fabrice=20PENHO=C3=8BT?= Date: Mon, 6 Sep 2021 17:25:30 +0200 Subject: [PATCH] =?UTF-8?q?Ajout=20possibilit=C3=A9=20de=20fournir=20des?= =?UTF-8?q?=20fonctions=20sp=C3=A9cifiques=20pour=20classer=20les=20donn?= =?UTF-8?q?=C3=A9es=20de=20certaines=20colonnes.?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 2 +- package.json | 2 +- src/firstExample.ts | 15 ++++++++- src/freeDatas2HTML.ts | 59 ++++++++++++++++++++++++++------- src/freeDatas2HTMLInterfaces.ts | 5 +++ tests/freeDatas2HTMLSpec.ts | 18 +++++++++- 6 files changed, 85 insertions(+), 16 deletions(-) diff --git a/README.md b/README.md index d9abd11..5207a18 100644 --- a/README.md +++ b/README.md @@ -18,9 +18,9 @@ De même l'idée est de rester libre du rendu des données en n'imposant pas de La première version se contente de récupérer et parser des données présentes dans un fichier CSV via un appel Ajax. Les données trouvées sont affichées dans un tableau. En option, des colonnes peuvent être indiquées par filtrer les données et/ou les classer. +Il est possible de fournir des fonctions spécifiques pour classer les données de certaines colonnes. Il reste à ajouter : -- la possibilité de fournir des fonctions spécifiques pour classer les données de certaines colonnes. - la possibilité de paginer les données. - la possibilité d'utiliser des sources/formats différents qu'un fichier CSV pour extraire les données. - la possibilité de spécifier un code HTML autre qu'un tableau pour lister les données. diff --git a/package.json b/package.json index 7207941..3a113e3 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "freedatas2html", - "version": "0.3.5", + "version": "0.3.6", "description": "Visualization of data from various sources (CSV, API, HTML...) with filters, classification, pagination, etc.", "main": "index.js", "scripts": { diff --git a/src/firstExample.ts b/src/firstExample.ts index bc1fa98..320aaa9 100644 --- a/src/firstExample.ts +++ b/src/firstExample.ts @@ -7,7 +7,20 @@ const initialise = async () => let converter=new freeDatas2HTML(); converter.datasViewElt={ id:"datas" }; converter.datasSelectors=[{ datasFieldNb:3, id:"filtre1"}, { datasFieldNb:4, id:"filtre2"},{ datasFieldNb:5, id:"filtre3", separator:"," }]; - converter.datasSortingColumns=[{ datasFieldNb:0 }, { datasFieldNb:1 },{ datasFieldNb:2 }]; + const mySort = (a: any, b: any, order: "asc"|"desc" = "asc") => + { + const values = [ "> 100000", "> 1 et < 100 000", "≤ 1", "Traces", "Inexistant"]; + if(order === "desc") + values.reverse(); + if(values.indexOf(a) > values.indexOf(b)) + return -1; + else if(values.indexOf(a) < values.indexOf(b)) + return 1; + else + return 0; + }; + converter.datasSortingColumns=[{ datasFieldNb:0 }, { datasFieldNb:1 },{ datasFieldNb:2 }, { datasFieldNb:4 }]; + converter.datasSortingFunctions= [{ datasFieldNb:4, sort:mySort}]; converter.datasSourceUrl="http://localhost:8080/datas/elements-chimiques.csv"; await converter.run(); } diff --git a/src/freeDatas2HTML.ts b/src/freeDatas2HTML.ts index 8520ed0..7a0ee4c 100644 --- a/src/freeDatas2HTML.ts +++ b/src/freeDatas2HTML.ts @@ -8,18 +8,20 @@ import { domElement, selectors, sortingColumns, sortingFunctions } from "./free export class freeDatas2HTML { private _datasViewElt: domElement = { id:"", eltDOM:undefined }; - private _datasSourceUrl: string = ""; + public datasHTML: string = ""; + // Revoir car tous les attributs suivants sont liés aux colonnes/fields des données (créer une classe ?) private _datasSelectors: selectors[] = []; private _datasSortingColumns: sortingColumns[] = []; private _datasSortedColumn: sortingColumns|undefined; - + private _datasSortingFunctions: sortingFunctions[] = []; + // Parseur fichier : + private _datasSourceUrl: string = ""; public parseMeta: papaParseMeta|undefined = undefined; public parseDatas: papaParseDatas[] = []; public parseErrors: papaParseErrors[] = []; - public datasHTML: string = ""; public stopIfParseErrors: boolean = false; - public static isNaturalNumber(nb) + public static isNaturalNumber(nb: number) { return (Number.isInteger(nb) === false || nb < 0) ? false : true; } @@ -84,12 +86,36 @@ export class freeDatas2HTML } } } - - get datasSortingColumns() : sortingColumns[] + + get datasSortingColumns() : sortingColumns[] { return this._datasSortingColumns; } - + + // Attention : une fonction de classement peut aussi bien servir à une colonne triable, qu'à une colonne servant à filtrer les données + set datasSortingFunctions(sortingFunctions: sortingFunctions[]) + { + this._datasSortingFunctions=[]; + for(let i = 0; i < sortingFunctions.length; i++) + { + if(freeDatas2HTML.isNaturalNumber(sortingFunctions[i].datasFieldNb) === false) + console.error(errors.needNaturalNumber); + else + this._datasSortingFunctions.push(sortingFunctions[i]); + } + } + + // Retourne la fonction spécifique de classement associée à une colonne + public getSortingFunctionForField(datasFieldNb: number) : sortingFunctions|undefined + { + for(let i in this._datasSortingFunctions) + { + if(this._datasSortingFunctions[i].datasFieldNb === datasFieldNb) + return this._datasSortingFunctions[i]; + } + return undefined; + } + public async parse(): Promise { const converter=this; @@ -172,7 +198,6 @@ export class freeDatas2HTML let checkedValues=this.parseDatas[row][colName].split(this._datasSelectors[i].separator as string); for(let i in checkedValues) { - let checkedValue=checkedValues[i].trim(); if(checkedValue !== "" && values.indexOf(checkedValue) === -1) values.push(checkedValue); @@ -181,7 +206,10 @@ export class freeDatas2HTML } if(values.length > 0) { - values.sort(compare()); + if(this.getSortingFunctionForField(this._datasSelectors[i].datasFieldNb) !== undefined) + values.sort(this.getSortingFunctionForField(this._datasSelectors[i].datasFieldNb)!.sort); + else + values.sort(compare()); this._datasSelectors[i].name=colName; this._datasSelectors[i].values=values; selectorsHTML[i]="