2022-02-14 15:18:41 +01:00
import { FreeDatas2HTML , Pagination , Selector } from "../../src/FreeDatas2HTML" ;
2022-02-03 17:45:23 +01:00
import { MixedFieldsRender } from "../../src/extensions/MixedFieldsRender" ;
const initialise = async ( ) = >
{
try
{
// Création d'un convertisseur parsant des données transmises en JSON :
const converter = new FreeDatas2HTML ( "CSV" ) ;
2022-02-14 15:18:41 +01:00
converter . parser . setRemoteSource ( { url : "https://pluxml.segal.bzh/data/medias/partenaires/partenaires.csv" } ) ;
2022-02-03 17:45:23 +01:00
// Parsage des données, qui ne sont pas encore affichées :
await converter . run ( ) ;
// Chaînes à utiliser par le moteur de rendu :
const renderSettings =
{
allBegining : "" ,
allEnding : "" ,
2022-02-14 15:18:41 +01:00
datasLinesDisplaying : ` <h3>##0##</h3><p>##8##.<br>Lieux d'activité : ##7##.##10## ##11####4####12##</p> `
2022-02-03 17:45:23 +01:00
} ;
// Fonctions spécifiques pour créer les liens hypertextes :
const rendName2HTML = ( values : { [ index : string ] : string } ) : string = >
{
2022-02-14 15:18:41 +01:00
if ( values [ "Présentation" ] !== undefined && values [ "Présentation" ] . trim ( ) !== "" )
return ` <a href=" ${ values [ 'Présentation' ] . trim ( ) } " title="Lire notre article de présentation de ce partenaire"> ${ values [ "Nom commercial" ] . trim ( ) } </a> ` ;
2022-02-03 17:45:23 +01:00
else
2022-02-14 15:18:41 +01:00
return values [ "Nom commercial" ] . trim ( ) ;
2022-02-03 17:45:23 +01:00
} ;
const rendSite2HTML = ( values : { [ index : string ] : string } ) : string = >
{
2022-02-14 15:18:41 +01:00
if ( values [ "Site" ] . trim ( ) !== "" )
return ` <br><a href=" ${ values [ 'Site' ] . trim ( ) } " target="_blank" title="Visiter le site de ${ values [ 'Nom commercial' ] . trim ( ) } ">Page internet</a> ` ;
2022-02-03 17:45:23 +01:00
else
return "" ;
} ;
const rendEmail2HTML = ( values : { [ index : string ] : string } ) : string = >
{
2022-02-14 15:18:41 +01:00
if ( values [ "E-mail" ] . trim ( ) !== "" )
return ` <br><a href="mailto: ${ values [ 'E-mail' ] . trim ( ) } " title="Contactez ${ values [ 'Nom commercial' ] . trim ( ) } ">E-Mail</a> ` ;
2022-02-03 17:45:23 +01:00
else
return "" ;
} ;
2022-02-14 15:18:41 +01:00
const rendTel2HTML = ( values : { [ index : string ] : string } ) : string = >
{
if ( values [ "Fixe" ] . trim ( ) !== "" )
return ` <br><a href="tel: ${ values [ 'Fixe' ] . trim ( ) } " title="Appelez ${ values [ 'Nom commercial' ] . trim ( ) } "> ${ values [ 'Fixe' ] . trim ( ) } </a> ` ;
else
return "" ;
} ;
const rendMobile2HTML = ( values : { [ index : string ] : string } ) : string = >
{
if ( values [ "Portable" ] . trim ( ) !== "" )
return ` <br><a href="tel: ${ values [ 'Portable' ] . trim ( ) } " title="Appelez ${ values [ 'Portable' ] . trim ( ) } "> ${ values [ 'Portable' ] . trim ( ) } </a> ` ;
else
return "" ;
} ;
2022-02-03 17:45:23 +01:00
const myRender = new MixedFieldsRender ( renderSettings ) ;
2022-02-14 15:18:41 +01:00
myRender . fieldRenders = [ { name : "Nom commercial" , rend2HTML : rendName2HTML } , { name : "E-mail" , rend2HTML : rendEmail2HTML } , { name : "Site" , rend2HTML : rendSite2HTML } , { name : "Fixe" , rend2HTML : rendTel2HTML } , { name : "Portable" , rend2HTML : rendMobile2HTML } ] ;
2022-02-03 17:45:23 +01:00
converter . datasRender = myRender ;
// Création de filtres :
2022-02-14 15:18:41 +01:00
const filtre1 = new Selector ( converter , 8 , { id : "filtreActivites" } ) ;
2022-02-03 17:45:23 +01:00
let filtre2 = new Selector ( converter , 7 , { id : "filtreLieux" } , "," ) ;
filtre1 . filter2HTML ( "Domaine d'activité" ) ;
filtre2 . filter2HTML ( "Lieux" ) ;
converter . datasFilters = [ filtre1 , filtre2 ] ;
2022-02-14 15:18:41 +01:00
// Configuration de la pagination :
const pagination = new Pagination ( converter , { id : "pages" } , "Page à afficher :" ) ;
pagination . options = { displayElement : { id : "pagination" } , values : [ 10 , 20 , 50 , 100 ] , name : "Choix de pagination :" } ;
pagination . selectedValue = 10 ;
converter . pagination = pagination ;
pagination . options2HTML ( ) ;
2022-02-03 17:45:23 +01:00
// Affichage initial avec l'id de l'élément HTML devant afficher le compteur :
converter . datasViewElt = { id : "partenaires" } ;
converter . refreshView ( ) ;
}
catch ( e )
{
console . error ( e ) ;
document . getElementById ( "datas" ) ! . innerHTML = ` <div class="alert alert-warning">Désolé, mais un problème technique empêche l'affichage des données.</div> ` ;
}
}
console . log ( "Hello, ami développeur :-)\nLe code source TypeScript utilisé pour faire fonctionner cette page est lisible ici : :\nhttps://forge.chapril.org/Fab_Blab/freeDatas2HTML/src/branch/master/integrations/src/segal.ts\nUn bug ? Une suggestion ? => fabrice@le-fab-lab.com" ) ;
initialise ( ) ;