7 changed files with 244 additions and 0 deletions
File diff suppressed because one or more lines are too long
@ -0,0 +1,6 @@
|
||||
/* @license |
||||
Papa Parse |
||||
v5.3.1 |
||||
https://github.com/mholt/PapaParse |
||||
License: MIT |
||||
*/ |
||||
@ -0,0 +1,41 @@
|
||||
[ |
||||
{ |
||||
"url": "https://developer.mozilla.org/fr/", |
||||
"anchor": "MDN Web Docs", |
||||
"keywords":"Mozilla, JavaScript, HTML, CSS" |
||||
}, |
||||
{ |
||||
"url": "https://git-scm.com/book/fr/v2", |
||||
"anchor": "Pro Git book", |
||||
"keywords":"Git" |
||||
}, |
||||
{ |
||||
"url": "https://jasmine.github.io/pages/docs_home.html", |
||||
"anchor": "Jasmine Documentation", |
||||
"keywords":"JavaScript, Test" |
||||
}, |
||||
{ |
||||
"url": "https://www.typescriptlang.org/", |
||||
"anchor": "TypeScript Documentation", |
||||
"keywords":"TypeScript, JavaScript" |
||||
}, |
||||
{ |
||||
"url": "https://karma-runner.github.io", |
||||
"anchor": "Karma.js", |
||||
"keywords":"Javascript, Test" |
||||
}, |
||||
{ |
||||
"url": "https://www.papaparse.com/", |
||||
"anchor": "Papa Parse", |
||||
"keywords":"JavaScript, CSV" |
||||
}, |
||||
{ |
||||
"url": "https://www.npmjs.com/package/natural-orderby", |
||||
"anchor": "natural-orderby", |
||||
"keywords":"TypeScript, JavaScript" |
||||
}, |
||||
{ |
||||
"anchor": "Lien sans URL fournie", |
||||
"keywords":"Test" |
||||
} |
||||
] |
||||
@ -0,0 +1,86 @@
|
||||
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) { |
||||
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } |
||||
return new (P || (P = Promise))(function (resolve, reject) { |
||||
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } |
||||
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } |
||||
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } |
||||
step((generator = generator.apply(thisArg, _arguments || [])).next()); |
||||
}); |
||||
}; |
||||
var __generator = (this && this.__generator) || function (thisArg, body) { |
||||
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g; |
||||
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g; |
||||
function verb(n) { return function (v) { return step([n, v]); }; } |
||||
function step(op) { |
||||
if (f) throw new TypeError("Generator is already executing."); |
||||
while (_) try { |
||||
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t; |
||||
if (y = 0, t) op = [op[0] & 2, t.value]; |
||||
switch (op[0]) { |
||||
case 0: case 1: t = op; break; |
||||
case 4: _.label++; return { value: op[1], done: false }; |
||||
case 5: _.label++; y = op[1]; op = [0]; continue; |
||||
case 7: op = _.ops.pop(); _.trys.pop(); continue; |
||||
default: |
||||
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; } |
||||
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; } |
||||
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; } |
||||
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; } |
||||
if (t[2]) _.ops.pop(); |
||||
_.trys.pop(); continue; |
||||
} |
||||
op = body.call(thisArg, _); |
||||
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; } |
||||
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true }; |
||||
} |
||||
}; |
||||
import { FreeDatas2HTML, Selector } from "../FreeDatas2HTML"; |
||||
import { MixedFieldsRender } from "../extensions/MixedFieldsRender"; |
||||
var initialise = function () { return __awaiter(void 0, void 0, void 0, function () { |
||||
var converter, renderSettings, rendAnchor2HTML, rendUrl2HTML, myRender, filtre1, e_1; |
||||
return __generator(this, function (_a) { |
||||
switch (_a.label) { |
||||
case 0: |
||||
_a.trys.push([0, 2, , 3]); |
||||
converter = new FreeDatas2HTML("JSON"); |
||||
converter.parser.setRemoteSource({ url: "http://localhost:8080/datas/links.json" }); |
||||
return [4, converter.run()]; |
||||
case 1: |
||||
_a.sent(); |
||||
renderSettings = { |
||||
allBegining: "<ul>", |
||||
allEnding: "</ul>", |
||||
datasLinesDisplaying: "<li><ul><li>##1##</li><li>Mots-cl\u00E9s : ##2##.</li>##0##</ul></li>" |
||||
}; |
||||
rendAnchor2HTML = function (values) { |
||||
if (values["url"] !== undefined && values["url"] !== "") |
||||
return "<a href=\"" + values['url'] + "\" target=\"_blank\">" + values["anchor"] + "</a>"; |
||||
else |
||||
return "<b>" + values["anchor"] + "</b>"; |
||||
}; |
||||
rendUrl2HTML = function (values) { |
||||
if (values["url"] !== "") |
||||
return "<li><a href=\"" + values['url'] + "\" target=\"_blank\" title=\"Visiter " + values['anchor'] + "\">" + values["url"] + "</a></li>"; |
||||
else |
||||
return ""; |
||||
}; |
||||
myRender = new MixedFieldsRender(renderSettings); |
||||
myRender.fieldRenders = [{ name: "anchor", rend2HTML: rendAnchor2HTML }, { name: "url", rend2HTML: rendUrl2HTML }]; |
||||
converter.datasRender = myRender; |
||||
filtre1 = new Selector(converter, 2, { id: "filtre1" }, ","); |
||||
filtre1.filter2HTML("Mots-clés"); |
||||
converter.datasFilters = [filtre1]; |
||||
converter.datasViewElt = { id: "datas" }; |
||||
converter.refreshView(); |
||||
return [3, 3]; |
||||
case 2: |
||||
e_1 = _a.sent(); |
||||
console.error(e_1); |
||||
document.getElementById("datas").innerHTML = "<div class=\"alert alert-warning\">D\u00E9sol\u00E9, mais un probl\u00E8me technique emp\u00EAche l'affichage des donn\u00E9es.</div>"; |
||||
return [3, 3]; |
||||
case 3: return [2]; |
||||
} |
||||
}); |
||||
}); }; |
||||
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/src/demo/exampleWithMixedFields.ts\nUn bug ? Une suggestion ? => fabrice@le-fab-lab.com"); |
||||
initialise(); |
||||
@ -0,0 +1,57 @@
|
||||
import { FreeDatas2HTML, Selector } from "../FreeDatas2HTML"; |
||||
import { MixedFieldsRender } from "../extensions/MixedFieldsRender"; |
||||
|
||||
const initialise=async () => |
||||
{ |
||||
try |
||||
{ |
||||
// Création d'un convertisseur parsant des données transmises en JSON :
|
||||
const converter=new FreeDatas2HTML("JSON"); |
||||
converter.parser.setRemoteSource({ url: "http://localhost:8080/datas/links.json"}); |
||||
// 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: `<ul>`, |
||||
allEnding: `</ul>`, |
||||
datasLinesDisplaying: `<li><ul><li>##1##</li><li>Mots-clés : ##2##.</li>##0##</ul></li>` |
||||
}; |
||||
// Fonctions spécifiques pour créer les liens hypertextes :
|
||||
const rendAnchor2HTML=(values: {[index: string]:string} ) : string => |
||||
{ |
||||
if(values["url"] !== undefined && values["url"] !== "") // je considère que anchor est toujours renseigné, mais on pourrait tester.
|
||||
return `<a href="${values['url']}" target="_blank">${values["anchor"]}</a>`; |
||||
else |
||||
return `<b>${values["anchor"]}</b>`; |
||||
}; |
||||
const rendUrl2HTML=(values: {[index: string]:string} ) : string => |
||||
{ |
||||
if(values["url"] !== "") // si values["url"] = undefined, la fonction rendUrl2HTML() n'est pas appelée.
|
||||
return `<li><a href="${values['url']}" target="_blank" title="Visiter ${values['anchor']}">${values["url"]}</a></li>`; |
||||
else |
||||
return ""; |
||||
}; |
||||
const myRender=new MixedFieldsRender(renderSettings); |
||||
myRender.fieldRenders=[{ name:"anchor", rend2HTML: rendAnchor2HTML}, { name:"url", rend2HTML: rendUrl2HTML}]; |
||||
converter.datasRender=myRender; |
||||
|
||||
// Création d'un filtre sur le troisième champ :
|
||||
let filtre1=new Selector(converter, 2, { id:"filtre1"}, "," ); |
||||
filtre1.filter2HTML("Mots-clés"); |
||||
converter.datasFilters=[filtre1]; |
||||
|
||||
// Affichage initial avec l'id de l'élément HTML devant afficher le compteur :
|
||||
converter.datasViewElt={ id:"datas" }; |
||||
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/src/demo/exampleWithMixedFields.ts\nUn bug ? Une suggestion ? => fabrice@le-fab-lab.com"); |
||||
initialise(); |
||||
Loading…
Reference in new issue