2021-10-26 18:01:23 +02:00
|
|
|
const { compare }=require("natural-orderby");
|
2021-09-29 17:56:10 +02:00
|
|
|
const errors=require("./errors.js");
|
2021-08-10 15:56:53 +02:00
|
|
|
|
2021-10-26 18:01:23 +02:00
|
|
|
import { DatasRenders, DOMElement, Filters, Paginations, Parsers, ParseResults, RemoteSources, SortingFields, SortingFunctions } from "./interfaces";
|
2021-10-19 15:40:47 +02:00
|
|
|
import { Pagination} from "./Pagination";
|
2021-10-13 18:20:53 +02:00
|
|
|
import { ParserForCSV} from "./ParserForCSV";
|
2021-10-18 17:32:54 +02:00
|
|
|
import { ParserForHTML} from "./ParserForHTML";
|
2021-10-18 11:40:21 +02:00
|
|
|
import { ParserForJSON} from "./ParserForJSON";
|
2021-10-20 12:43:49 +02:00
|
|
|
import { Render} from "./Render";
|
2021-10-20 17:44:25 +02:00
|
|
|
import { Selector } from "./Selector";
|
2021-10-19 11:54:11 +02:00
|
|
|
import { SortingField } from "./SortingField";
|
2021-08-05 18:24:37 +02:00
|
|
|
|
2021-09-17 18:02:45 +02:00
|
|
|
export class FreeDatas2HTML
|
2021-08-05 18:24:37 +02:00
|
|
|
{
|
2021-10-26 18:01:23 +02:00
|
|
|
// Les paramètres de base :
|
2021-09-29 17:56:10 +02:00
|
|
|
private _datasViewElt: DOMElement|undefined=undefined;
|
2021-09-23 17:19:31 +02:00
|
|
|
public datasRender: DatasRenders;
|
2021-10-26 18:01:23 +02:00
|
|
|
public parser: Parsers;
|
|
|
|
public stopIfParseErrors: boolean=false;
|
|
|
|
|
|
|
|
// Les options (classement, pagination, filtres...) :
|
|
|
|
private _datasCounterElt: DOMElement|undefined=undefined;
|
|
|
|
private _datasSortingFunctions: SortingFunctions[]=[];
|
2021-10-27 15:57:19 +02:00
|
|
|
private _fields2Rend: number[]=[];
|
2021-10-26 18:01:23 +02:00
|
|
|
public datasFilters: Filters[]=[];
|
|
|
|
public datasSortingFields: SortingFields[]=[];
|
|
|
|
public datasSortedField: SortingFields|undefined;
|
|
|
|
public pagination: Paginations|undefined;
|
|
|
|
|
|
|
|
// Les résultats :
|
|
|
|
private _fields: ParseResults["fields"]=[];
|
|
|
|
private _datas: ParseResults["datas"]=[];
|
|
|
|
private _datas2Rend: {[index: string]:string}[]=[];
|
|
|
|
private _nbDatasValid: number=0;
|
|
|
|
|
|
|
|
// Le parseur, comme le render sont initialisés, mais peuvent être modifiés par des instances d'autres classes respectant leur interface.
|
|
|
|
constructor(datasFormat:"CSV"|"HTML"|"JSON", datas2Parse="", datasRemoteSource?:RemoteSources)
|
2021-09-23 17:19:31 +02:00
|
|
|
{
|
2021-10-20 17:34:10 +02:00
|
|
|
this.datasRender=new Render();
|
2021-10-26 18:01:23 +02:00
|
|
|
switch (datasFormat)
|
2021-09-29 17:56:10 +02:00
|
|
|
{
|
|
|
|
case "CSV":
|
2021-10-26 18:01:23 +02:00
|
|
|
this.parser=new ParserForCSV();
|
2021-09-29 17:56:10 +02:00
|
|
|
break;
|
|
|
|
case "HTML":
|
2021-10-26 18:01:23 +02:00
|
|
|
this.parser=new ParserForHTML();
|
2021-09-29 17:56:10 +02:00
|
|
|
break;
|
|
|
|
case "JSON":
|
2021-10-26 18:01:23 +02:00
|
|
|
this.parser=new ParserForJSON();
|
2021-09-29 17:56:10 +02:00
|
|
|
break;
|
|
|
|
}
|
2021-10-21 17:11:04 +02:00
|
|
|
if(datas2Parse.trim() !== "")
|
|
|
|
this.parser.datas2Parse=datas2Parse.trim();
|
2021-10-26 18:01:23 +02:00
|
|
|
else if(datasRemoteSource !== undefined)
|
|
|
|
this.parser.setRemoteSource(datasRemoteSource);
|
2021-09-23 17:19:31 +02:00
|
|
|
}
|
|
|
|
|
2021-10-26 18:01:23 +02:00
|
|
|
// Vérifie s'il y a bien un élément dans le DOM pour l'id fourni.
|
|
|
|
// Fonction statique également utilisée par les autres classes.
|
2021-09-22 12:29:43 +02:00
|
|
|
public static checkInDOMById(checkedElt: DOMElement) : DOMElement
|
2021-08-05 18:24:37 +02:00
|
|
|
{
|
2021-09-22 12:29:43 +02:00
|
|
|
let searchEltInDOM=document.getElementById(checkedElt.id);
|
|
|
|
if(searchEltInDOM === null)
|
|
|
|
throw new Error(errors.converterElementNotFound+checkedElt.id);
|
2021-08-10 15:56:53 +02:00
|
|
|
else
|
|
|
|
{
|
2021-09-22 12:29:43 +02:00
|
|
|
checkedElt.eltDOM=searchEltInDOM;
|
|
|
|
return checkedElt;
|
2021-08-10 15:56:53 +02:00
|
|
|
}
|
2021-08-05 18:24:37 +02:00
|
|
|
}
|
2021-10-26 18:01:23 +02:00
|
|
|
|
|
|
|
set datasViewElt(elt: DOMElement)
|
|
|
|
{
|
|
|
|
this._datasViewElt=FreeDatas2HTML.checkInDOMById(elt);
|
|
|
|
}
|
|
|
|
|
|
|
|
set datasCounterElt(counterDisplayElement: DOMElement)
|
|
|
|
{
|
|
|
|
this._datasCounterElt=FreeDatas2HTML.checkInDOMById(counterDisplayElement);
|
|
|
|
}
|
|
|
|
|
|
|
|
get datas(): ParseResults["datas"]
|
|
|
|
{
|
|
|
|
return this._datas;
|
|
|
|
}
|
|
|
|
|
|
|
|
get fields(): ParseResults["fields"]
|
|
|
|
{
|
|
|
|
return this._fields;
|
|
|
|
}
|
|
|
|
|
|
|
|
get datas2Rend(): {[index: string]:string}[]
|
|
|
|
{
|
|
|
|
return this._datas2Rend;
|
|
|
|
}
|
|
|
|
|
|
|
|
get nbDatasValid(): number
|
|
|
|
{
|
|
|
|
return this._nbDatasValid;
|
|
|
|
}
|
|
|
|
|
2021-10-27 16:51:14 +02:00
|
|
|
get fields2Rend() : number[]
|
|
|
|
{
|
|
|
|
return this._fields2Rend;
|
|
|
|
}
|
|
|
|
|
2021-10-26 18:01:23 +02:00
|
|
|
// Vérifie qu'un champ existe bien dans les données parsées.
|
|
|
|
// Utilisée par les autres classes.
|
2021-09-22 16:25:10 +02:00
|
|
|
public checkFieldExist(nb: number) : boolean
|
|
|
|
{
|
2021-10-26 18:01:23 +02:00
|
|
|
if(this.parser.parseResults === undefined || this.parser.parseResults.fields[nb] === undefined)
|
2021-09-22 16:25:10 +02:00
|
|
|
return false;
|
|
|
|
else
|
|
|
|
return true;
|
|
|
|
}
|
2021-08-05 18:24:37 +02:00
|
|
|
|
2021-10-27 16:51:14 +02:00
|
|
|
public realFields2Rend() : string[]
|
|
|
|
{
|
|
|
|
if(this._fields2Rend.length === 0)
|
|
|
|
return this._fields;
|
|
|
|
else
|
|
|
|
{
|
|
|
|
const realFields=[];
|
|
|
|
for(let i=0; i < this._fields.length; i++)
|
|
|
|
{
|
|
|
|
if(this._fields2Rend.indexOf(i) !== -1)
|
|
|
|
realFields.push(this._fields[i]);
|
|
|
|
}
|
|
|
|
return realFields;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
// Vérifie qu'un champ faire partie de ceux à afficher.
|
|
|
|
public checkField2Rend(nb: number) : boolean
|
|
|
|
{
|
|
|
|
if(this.realFields2Rend()[nb] === undefined)
|
|
|
|
return false;
|
|
|
|
else
|
|
|
|
return true;
|
|
|
|
}
|
|
|
|
|
2021-10-26 18:01:23 +02:00
|
|
|
// Vérifie que les numéros de champs pour lesquels il y a des fonctions de classement spécifiques sont cohérents.
|
|
|
|
// ! Ne peut donc être utilisé qu'après avoir parsé les données.
|
2021-09-17 18:02:45 +02:00
|
|
|
set datasSortingFunctions(SortingFunctions: SortingFunctions[])
|
2021-09-06 17:25:30 +02:00
|
|
|
{
|
|
|
|
this._datasSortingFunctions=[];
|
2021-10-07 17:15:35 +02:00
|
|
|
for(let checkedFunction of SortingFunctions)
|
2021-09-06 17:25:30 +02:00
|
|
|
{
|
2021-10-07 17:15:35 +02:00
|
|
|
if(! this.checkFieldExist(checkedFunction.datasFieldNb))
|
2021-09-22 16:25:10 +02:00
|
|
|
throw new Error(errors.converterFieldNotFound);
|
|
|
|
else
|
2021-10-07 17:15:35 +02:00
|
|
|
this._datasSortingFunctions.push(checkedFunction);
|
2021-09-06 17:25:30 +02:00
|
|
|
}
|
|
|
|
}
|
2021-10-27 15:57:19 +02:00
|
|
|
|
|
|
|
// Vérifie que tous les numéros de champs à afficher sont valides
|
|
|
|
// Un tableau vide signifie que tous les champs parsés seront affichés.
|
|
|
|
set fields2Rend(fields: number[])
|
|
|
|
{
|
|
|
|
if(fields.length === 0)
|
|
|
|
this._fields2Rend=fields;
|
|
|
|
else
|
|
|
|
{
|
|
|
|
for(let field of fields)
|
|
|
|
{
|
|
|
|
if(! this.checkFieldExist(field))
|
|
|
|
throw new Error(errors.converterFieldNotFound);
|
|
|
|
else
|
|
|
|
this._fields2Rend.push(field);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2021-09-20 18:01:09 +02:00
|
|
|
// Retourne l'éventuelle fonction spécifique de classement associée à un champ
|
2021-09-17 18:02:45 +02:00
|
|
|
public getSortingFunctionForField(datasFieldNb: number): SortingFunctions|undefined
|
2021-09-06 17:25:30 +02:00
|
|
|
{
|
2021-10-07 17:15:35 +02:00
|
|
|
for(let checkedFunction of this._datasSortingFunctions)
|
2021-09-06 17:25:30 +02:00
|
|
|
{
|
2021-10-07 17:15:35 +02:00
|
|
|
if(checkedFunction.datasFieldNb === datasFieldNb)
|
|
|
|
return checkedFunction;
|
2021-09-06 17:25:30 +02:00
|
|
|
}
|
|
|
|
return undefined;
|
|
|
|
}
|
2021-09-09 12:57:23 +02:00
|
|
|
|
2021-10-26 18:01:23 +02:00
|
|
|
// Lancer le parsage des données et lance éventuellement un 1er affichage.
|
2021-08-10 15:56:53 +02:00
|
|
|
public async run(): Promise<any>
|
2021-10-11 16:44:20 +02:00
|
|
|
{
|
2021-09-29 17:56:10 +02:00
|
|
|
await this.parser.parse();
|
2021-10-26 18:01:23 +02:00
|
|
|
if(this.parser.parseResults === undefined) // mais le parseur devrait lui-même générer une erreur avant
|
2021-09-29 17:56:10 +02:00
|
|
|
throw new Error(errors.parserFail);
|
2021-08-11 15:24:00 +02:00
|
|
|
else
|
2021-09-29 17:56:10 +02:00
|
|
|
{
|
2021-10-26 18:01:23 +02:00
|
|
|
if(this.stopIfParseErrors && this.parser.parseResults.errors !== undefined)
|
2021-09-30 12:52:33 +02:00
|
|
|
throw new Error(errors.parserMeetErrors);
|
2021-09-29 17:56:10 +02:00
|
|
|
else
|
|
|
|
{
|
2021-10-26 18:01:23 +02:00
|
|
|
this._fields=this.parser.parseResults.fields;
|
|
|
|
this._datas=this.parser.parseResults.datas;
|
2021-10-27 15:57:19 +02:00
|
|
|
// Les champs ne bougeront plus, donc on peut déjà les passer au moteur de rendu.
|
|
|
|
// Mais en prenant les comptes les éventuels champs à ne pas afficher
|
|
|
|
if(this._fields2Rend.length === 0)
|
|
|
|
this.datasRender.fields=this._fields;
|
|
|
|
else
|
2021-10-27 16:51:14 +02:00
|
|
|
this.datasRender.fields=this.realFields2Rend();
|
2021-09-30 12:52:33 +02:00
|
|
|
if(this._datasViewElt !== undefined)
|
|
|
|
this.refreshView();
|
2021-09-29 17:56:10 +02:00
|
|
|
return true;
|
|
|
|
}
|
2021-08-11 17:25:56 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2021-10-26 18:01:23 +02:00
|
|
|
// Actualise l'affichage des données.
|
|
|
|
// Méthode également appelée par les autres classes.
|
2021-09-30 12:52:33 +02:00
|
|
|
public refreshView() : void
|
2021-09-02 18:15:15 +02:00
|
|
|
{
|
2021-10-26 18:01:23 +02:00
|
|
|
if(this._fields.length === 0 || this._datasViewElt === undefined)
|
2021-09-23 17:19:31 +02:00
|
|
|
throw new Error(errors.converterRefreshFail);
|
2021-09-30 12:52:33 +02:00
|
|
|
else
|
2021-09-02 18:15:15 +02:00
|
|
|
{
|
2021-10-26 18:01:23 +02:00
|
|
|
this._datas2Rend=this.datas2HTML();
|
|
|
|
this.datasRender.datas= this._datas2Rend;
|
|
|
|
this._datasViewElt.eltDOM!.innerHTML=this.datasRender.rend2HTML(); // "!", car l'existence de "eltDOM" est testée par le setter.
|
|
|
|
|
|
|
|
// Actualisation de l'éventuel compteur :
|
|
|
|
if(this._datasCounterElt !== undefined)
|
|
|
|
this._datasCounterElt.eltDOM!.innerHTML=""+this._nbDatasValid; // même remarque pour le "!".
|
|
|
|
|
|
|
|
// Réactivation des éventuels champs de classement qui ont pu être écrasés :
|
2021-10-07 17:15:35 +02:00
|
|
|
for(let field of this.datasSortingFields)
|
2021-09-30 12:52:33 +02:00
|
|
|
field.field2HTML();
|
2021-10-26 18:01:23 +02:00
|
|
|
|
|
|
|
// Tout réaffichage peut entraîner une modification du nombre de pages (évolution filtres, etc.)
|
|
|
|
if(this.pagination !== undefined)
|
|
|
|
this.pagination.pages2HTML();
|
2021-09-02 18:15:15 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2021-10-26 18:01:23 +02:00
|
|
|
// Fonction sélectionnant les données à afficher en prenant en compte les éventuels filtres, la pagination, etc.
|
|
|
|
public datas2HTML() : {[index: string]:string}[]
|
2021-08-11 17:25:56 +02:00
|
|
|
{
|
2021-09-20 18:01:09 +02:00
|
|
|
// Dois-je classer les données par rapport à un champ ?
|
2021-10-26 18:01:23 +02:00
|
|
|
if(this.datasSortedField !== undefined)
|
2021-09-02 18:15:15 +02:00
|
|
|
{
|
2021-10-26 18:01:23 +02:00
|
|
|
const field=this._fields[this.datasSortedField.datasFieldNb];
|
2021-09-20 18:01:09 +02:00
|
|
|
const fieldOrder=this.datasSortedField.order;
|
2021-10-26 18:01:23 +02:00
|
|
|
// Une fonction spécifique de classement a-t-elle été définie pour ce champ ?
|
2021-09-20 18:01:09 +02:00
|
|
|
if(this.getSortingFunctionForField(this.datasSortedField.datasFieldNb) !== undefined)
|
2021-09-06 17:25:30 +02:00
|
|
|
{
|
2021-10-26 18:01:23 +02:00
|
|
|
const myFunction=this.getSortingFunctionForField(this.datasSortedField.datasFieldNb);
|
|
|
|
this._datas.sort( (a, b) => { return myFunction!.sort(a[field], b[field], fieldOrder); });
|
2021-09-06 17:25:30 +02:00
|
|
|
}
|
|
|
|
else
|
2021-10-26 18:01:23 +02:00
|
|
|
this._datas.sort( (a, b) => compare( {order: fieldOrder} )(a[field], b[field]));
|
2021-09-02 18:15:15 +02:00
|
|
|
}
|
2021-09-21 17:46:04 +02:00
|
|
|
|
|
|
|
// Dois-je prendre en compte une pagination ?
|
2021-09-09 12:57:23 +02:00
|
|
|
let firstData=0;
|
2021-09-21 17:46:04 +02:00
|
|
|
if (this.pagination !== undefined && this.pagination.selectedValue !== undefined && this.pagination.pages !== undefined && this.pagination.pages.selectedValue !== undefined)
|
|
|
|
firstData=this.pagination.selectedValue*(this.pagination.pages.selectedValue-1);
|
2021-10-26 18:01:23 +02:00
|
|
|
let maxData=(this.pagination !== undefined && this.pagination.selectedValue !== undefined) ? this.pagination.selectedValue : this._datas.length;
|
2021-09-02 18:15:15 +02:00
|
|
|
|
2021-09-23 17:19:31 +02:00
|
|
|
// Création du tableau des données à afficher :
|
2021-10-27 15:57:19 +02:00
|
|
|
let datas2Display=[];
|
2021-09-09 12:57:23 +02:00
|
|
|
let nbVisible=0, nbTotal=0;
|
2021-10-26 18:01:23 +02:00
|
|
|
for (let row in this._datas)
|
2021-08-11 17:25:56 +02:00
|
|
|
{
|
2021-10-26 18:01:23 +02:00
|
|
|
// Pour être affichée une ligne doit valider tous les filtres connus
|
|
|
|
let valid=true, i=0;
|
|
|
|
while(this.datasFilters[i] !== undefined && valid === true)
|
2021-08-11 17:25:56 +02:00
|
|
|
{
|
2021-10-26 18:01:23 +02:00
|
|
|
valid=this.datasFilters[i].dataIsOk(this._datas[row]);
|
|
|
|
i++;
|
2021-08-11 17:25:56 +02:00
|
|
|
}
|
2021-10-26 18:01:23 +02:00
|
|
|
if(valid && nbTotal >= firstData && nbVisible < maxData)
|
2021-08-11 17:25:56 +02:00
|
|
|
{
|
2021-10-26 18:01:23 +02:00
|
|
|
datas2Display.push(this._datas[row]);
|
2021-09-09 12:57:23 +02:00
|
|
|
nbVisible++;
|
|
|
|
nbTotal++;
|
2021-08-11 17:25:56 +02:00
|
|
|
}
|
2021-10-26 18:01:23 +02:00
|
|
|
else if(valid)
|
2021-09-09 12:57:23 +02:00
|
|
|
nbTotal++;
|
2021-08-11 17:25:56 +02:00
|
|
|
}
|
2021-10-26 18:01:23 +02:00
|
|
|
this._nbDatasValid=nbTotal;
|
2021-10-27 15:57:19 +02:00
|
|
|
|
|
|
|
// Tous les champs doivent-ils être affichés ?
|
|
|
|
// Ne pas enlever les champs cachés plus tôt, car ils peuvent servir à filtrer les données
|
|
|
|
if(this._fields2Rend.length !== 0)
|
|
|
|
{
|
|
|
|
let newDatas2Display=[];
|
|
|
|
for(let row in datas2Display)
|
|
|
|
{
|
|
|
|
let i=0, newData: {[index: string]: string} = {};
|
|
|
|
for(let field in datas2Display[row])
|
|
|
|
{
|
|
|
|
if(this._fields2Rend.indexOf(i) !== -1)
|
|
|
|
newData[field]=datas2Display[row][field];
|
|
|
|
i++;
|
|
|
|
}
|
|
|
|
newDatas2Display.push(newData);
|
|
|
|
}
|
|
|
|
datas2Display=newDatas2Display;
|
|
|
|
}
|
2021-10-26 18:01:23 +02:00
|
|
|
return datas2Display;
|
2021-08-10 15:56:53 +02:00
|
|
|
}
|
2021-09-20 18:01:09 +02:00
|
|
|
}
|
|
|
|
|
2021-10-26 18:01:23 +02:00
|
|
|
// Permet l'appel des principales classes du module via un seul script :
|
2021-10-19 15:40:47 +02:00
|
|
|
export { Pagination } from "./Pagination";
|
2021-10-20 12:43:49 +02:00
|
|
|
export { Render} from "./Render";
|
2021-10-28 17:50:57 +02:00
|
|
|
export { SearchEngine } from "./SearchEngine";
|
2021-10-20 17:44:25 +02:00
|
|
|
export { Selector } from "./Selector";
|
2021-10-19 11:54:11 +02:00
|
|
|
export { SortingField } from "./SortingField";
|