Déplacement des scripts des pages de démonstration + nouvelles compilations.
This commit is contained in:
parent
260c3d8499
commit
584e2d91df
@ -19,8 +19,7 @@ module.exports = function(config) {
|
||||
proxies: { "/datas/": "http://localhost:9876/base/tests/datas/" },
|
||||
|
||||
// list of files / patterns to exclude
|
||||
exclude: [
|
||||
],
|
||||
exclude: [ "src/example*" ],
|
||||
|
||||
// preprocess matching files before serving them to the browser
|
||||
// available preprocessors: https://www.npmjs.com/search?q=keywords:karma-preprocessor
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "freedatas2html",
|
||||
"version": "0.9.8",
|
||||
"version": "0.9.9",
|
||||
"description": "Conversion and display of data in different formats (CSV, JSON, HTML) with the possibility of filtering, classifying and paginating the results.",
|
||||
"main": "index.js",
|
||||
"scripts": {
|
||||
|
||||
File diff suppressed because one or more lines are too long
6
public/JS/exampleWithCSV.app.js.LICENSE.txt
Normal file
6
public/JS/exampleWithCSV.app.js.LICENSE.txt
Normal file
@ -0,0 +1,6 @@
|
||||
/* @license
|
||||
Papa Parse
|
||||
v5.3.1
|
||||
https://github.com/mholt/PapaParse
|
||||
License: MIT
|
||||
*/
|
||||
File diff suppressed because one or more lines are too long
6
public/JS/exampleWithHTML.app.js.LICENSE.txt
Normal file
6
public/JS/exampleWithHTML.app.js.LICENSE.txt
Normal file
@ -0,0 +1,6 @@
|
||||
/* @license
|
||||
Papa Parse
|
||||
v5.3.1
|
||||
https://github.com/mholt/PapaParse
|
||||
License: MIT
|
||||
*/
|
||||
File diff suppressed because one or more lines are too long
6
public/JS/exampleWithJSON.app.js.LICENSE.txt
Normal file
6
public/JS/exampleWithJSON.app.js.LICENSE.txt
Normal file
@ -0,0 +1,6 @@
|
||||
/* @license
|
||||
Papa Parse
|
||||
v5.3.1
|
||||
https://github.com/mholt/PapaParse
|
||||
License: MIT
|
||||
*/
|
||||
2
public/JS/exampleWithUserFile.app.js
Normal file
2
public/JS/exampleWithUserFile.app.js
Normal file
File diff suppressed because one or more lines are too long
6
public/JS/exampleWithUserFile.app.js.LICENSE.txt
Normal file
6
public/JS/exampleWithUserFile.app.js.LICENSE.txt
Normal file
@ -0,0 +1,6 @@
|
||||
/* @license
|
||||
Papa Parse
|
||||
v5.3.1
|
||||
https://github.com/mholt/PapaParse
|
||||
License: MIT
|
||||
*/
|
||||
@ -45,11 +45,11 @@ var FreeDatas2HTML = (function () {
|
||||
if (datas2Parse === void 0) { datas2Parse = ""; }
|
||||
this._datasViewElt = undefined;
|
||||
this.stopIfParseErrors = false;
|
||||
this._datasCounterElt = undefined;
|
||||
this._datasSortingFunctions = [];
|
||||
this._fields2Rend = [];
|
||||
this.datasFilters = [];
|
||||
this.datasSortingFields = [];
|
||||
this._fields2Rend = [];
|
||||
this.datasCounterElt = undefined;
|
||||
this._fields = [];
|
||||
this._datas = [];
|
||||
this._datas2Rend = [];
|
||||
@ -87,13 +87,6 @@ var FreeDatas2HTML = (function () {
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(FreeDatas2HTML.prototype, "datasCounterElt", {
|
||||
set: function (counterDisplayElement) {
|
||||
this._datasCounterElt = FreeDatas2HTML.checkInDOMById(counterDisplayElement);
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(FreeDatas2HTML.prototype, "datas", {
|
||||
get: function () {
|
||||
return this._datas;
|
||||
@ -108,13 +101,6 @@ var FreeDatas2HTML = (function () {
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(FreeDatas2HTML.prototype, "datas2Rend", {
|
||||
get: function () {
|
||||
return this._datas2Rend;
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(FreeDatas2HTML.prototype, "nbDatasValid", {
|
||||
get: function () {
|
||||
return this._nbDatasValid;
|
||||
@ -130,6 +116,7 @@ var FreeDatas2HTML = (function () {
|
||||
if (fields.length === 0)
|
||||
this._fields2Rend = fields;
|
||||
else {
|
||||
this._fields2Rend = [];
|
||||
for (var _i = 0, fields_1 = fields; _i < fields_1.length; _i++) {
|
||||
var field = fields_1[_i];
|
||||
if (!this.checkFieldExist(field))
|
||||
@ -142,40 +129,9 @@ var FreeDatas2HTML = (function () {
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
FreeDatas2HTML.prototype.checkFieldExist = function (nb) {
|
||||
if (this.parser.parseResults === undefined || this.parser.parseResults.fields[nb] === undefined)
|
||||
return false;
|
||||
else
|
||||
return true;
|
||||
};
|
||||
FreeDatas2HTML.prototype.realFields2Rend = function () {
|
||||
if (this._fields2Rend.length === 0)
|
||||
return this._fields;
|
||||
else {
|
||||
var realFields = [];
|
||||
for (var i = 0; i < this._fields.length; i++) {
|
||||
if (this._fields2Rend.indexOf(i) !== -1)
|
||||
realFields.push(this._fields[i]);
|
||||
}
|
||||
return realFields;
|
||||
}
|
||||
};
|
||||
FreeDatas2HTML.prototype.checkField2Rend = function (nb) {
|
||||
if (this.realFields2Rend()[nb] === undefined)
|
||||
return false;
|
||||
else
|
||||
return true;
|
||||
};
|
||||
Object.defineProperty(FreeDatas2HTML.prototype, "datasSortingFunctions", {
|
||||
set: function (SortingFunctions) {
|
||||
this._datasSortingFunctions = [];
|
||||
for (var _i = 0, SortingFunctions_1 = SortingFunctions; _i < SortingFunctions_1.length; _i++) {
|
||||
var checkedFunction = SortingFunctions_1[_i];
|
||||
if (!this.checkFieldExist(checkedFunction.datasFieldNb))
|
||||
throw new Error(errors.converterFieldNotFound);
|
||||
else
|
||||
this._datasSortingFunctions.push(checkedFunction);
|
||||
}
|
||||
Object.defineProperty(FreeDatas2HTML.prototype, "datas2Rend", {
|
||||
get: function () {
|
||||
return this._datas2Rend;
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
@ -203,10 +159,6 @@ var FreeDatas2HTML = (function () {
|
||||
else {
|
||||
this._fields = this.parser.parseResults.fields;
|
||||
this._datas = this.parser.parseResults.datas;
|
||||
if (this._fields2Rend.length === 0)
|
||||
this.datasRender.fields = this._fields;
|
||||
else
|
||||
this.datasRender.fields = this.realFields2Rend();
|
||||
if (this._datasViewElt !== undefined)
|
||||
this.refreshView();
|
||||
return [2, true];
|
||||
@ -217,15 +169,74 @@ var FreeDatas2HTML = (function () {
|
||||
});
|
||||
});
|
||||
};
|
||||
FreeDatas2HTML.prototype.checkFieldExist = function (nb) {
|
||||
if (this.parser.parseResults === undefined || this.parser.parseResults.fields[nb] === undefined)
|
||||
return false;
|
||||
else
|
||||
return true;
|
||||
};
|
||||
FreeDatas2HTML.prototype.checkField2Rend = function (nb) {
|
||||
if (this._fields2Rend.length === 0)
|
||||
return this.checkFieldExist(nb);
|
||||
else {
|
||||
if (this._fields2Rend.indexOf(nb) === -1)
|
||||
return false;
|
||||
else
|
||||
return true;
|
||||
}
|
||||
};
|
||||
FreeDatas2HTML.prototype.getFieldDisplayRank = function (nb) {
|
||||
if (this.checkField2Rend(nb) === false)
|
||||
return -1;
|
||||
if (this._fields2Rend.length === 0)
|
||||
return nb;
|
||||
else
|
||||
return this._fields2Rend.indexOf(nb);
|
||||
};
|
||||
FreeDatas2HTML.prototype.realFields2Rend = function () {
|
||||
if (this._fields2Rend.length === 0)
|
||||
return this._fields;
|
||||
else {
|
||||
var realFields = [];
|
||||
for (var i = 0; i < this._fields.length; i++) {
|
||||
if (this._fields2Rend.indexOf(i) !== -1)
|
||||
realFields.push(this._fields[i]);
|
||||
}
|
||||
return realFields;
|
||||
}
|
||||
};
|
||||
Object.defineProperty(FreeDatas2HTML.prototype, "datasSortingFunctions", {
|
||||
set: function (SortingFunctions) {
|
||||
this._datasSortingFunctions = [];
|
||||
for (var _i = 0, SortingFunctions_1 = SortingFunctions; _i < SortingFunctions_1.length; _i++) {
|
||||
var checkedFunction = SortingFunctions_1[_i];
|
||||
if (!this.checkFieldExist(checkedFunction.datasFieldNb))
|
||||
throw new Error(errors.converterFieldNotFound);
|
||||
else
|
||||
this._datasSortingFunctions.push(checkedFunction);
|
||||
}
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
FreeDatas2HTML.prototype.datasCounter2HTML = function () {
|
||||
if (this.datasCounterElt !== undefined) {
|
||||
this.datasCounterElt = FreeDatas2HTML.checkInDOMById(this.datasCounterElt);
|
||||
this.datasCounterElt.eltDOM.textContent = "" + this._nbDatasValid;
|
||||
}
|
||||
};
|
||||
FreeDatas2HTML.prototype.refreshView = function () {
|
||||
if (this._fields.length === 0 || this._datasViewElt === undefined)
|
||||
throw new Error(errors.converterRefreshFail);
|
||||
else {
|
||||
if (this._fields2Rend.length === 0)
|
||||
this.datasRender.fields = this._fields;
|
||||
else
|
||||
this.datasRender.fields = this.realFields2Rend();
|
||||
this._datas2Rend = this.datas2HTML();
|
||||
this.datasRender.datas = this._datas2Rend;
|
||||
this._datasViewElt.eltDOM.innerHTML = this.datasRender.rend2HTML();
|
||||
if (this._datasCounterElt !== undefined)
|
||||
this._datasCounterElt.eltDOM.innerHTML = "" + this._nbDatasValid;
|
||||
this.datasCounter2HTML();
|
||||
for (var _i = 0, _a = this.datasSortingFields; _i < _a.length; _i++) {
|
||||
var field = _a[_i];
|
||||
field.field2HTML();
|
||||
|
||||
@ -8,19 +8,12 @@ var SortingField = (function () {
|
||||
throw new Error(errors.sortingFieldNeedDatas);
|
||||
else if (!converter.checkField2Rend(datasFieldNb))
|
||||
throw new Error(errors.sortingFieldNotFound);
|
||||
else {
|
||||
var fields = document.querySelectorAll(fieldsDOMSelector);
|
||||
if (fields === undefined)
|
||||
throw new Error(errors.sortingFieldsNotInHTML);
|
||||
else if (fields.length !== converter.realFields2Rend().length)
|
||||
throw new Error(errors.sortingFieldsNbFail);
|
||||
else {
|
||||
this._converter = converter;
|
||||
this._datasFieldNb = datasFieldNb;
|
||||
this._fieldsDOMSelector = fieldsDOMSelector;
|
||||
}
|
||||
}
|
||||
}
|
||||
Object.defineProperty(SortingField.prototype, "converter", {
|
||||
get: function () {
|
||||
return this._converter;
|
||||
@ -50,21 +43,29 @@ var SortingField = (function () {
|
||||
configurable: true
|
||||
});
|
||||
SortingField.prototype.field2HTML = function () {
|
||||
var fields = document.querySelectorAll(this._fieldsDOMSelector);
|
||||
var htmlContent = fields[this._datasFieldNb].innerHTML;
|
||||
var fields = document.querySelectorAll(this.fieldsDOMSelector);
|
||||
if (fields === undefined)
|
||||
throw new Error(errors.sortingFieldsNotInHTML);
|
||||
else if (fields.length !== this._converter.realFields2Rend().length)
|
||||
throw new Error(errors.sortingFieldsNbFail);
|
||||
else {
|
||||
var index = this._converter.getFieldDisplayRank(this._datasFieldNb);
|
||||
var htmlContent = void 0;
|
||||
htmlContent = fields[index].innerHTML;
|
||||
htmlContent = "<a href='#freeDatas2HTMLSorting" + this._datasFieldNb + "' id='freeDatas2HTMLSorting" + this._datasFieldNb + "'>" + htmlContent + "</a>";
|
||||
fields[this._datasFieldNb].innerHTML = htmlContent;
|
||||
var sortingElement = document.getElementById("freeDatas2HTMLSorting" + this._datasFieldNb), field = this;
|
||||
fields[index].innerHTML = htmlContent;
|
||||
var sortingElement = document.getElementById("freeDatas2HTMLSorting" + this._datasFieldNb), field_1 = this;
|
||||
sortingElement.addEventListener("click", function (e) {
|
||||
e.preventDefault();
|
||||
var order = field._order;
|
||||
var order = field_1._order;
|
||||
if (order === undefined || order === "desc")
|
||||
field._order = "asc";
|
||||
field_1._order = "asc";
|
||||
else
|
||||
field._order = "desc";
|
||||
field._converter.datasSortedField = field;
|
||||
field._converter.refreshView();
|
||||
field_1._order = "desc";
|
||||
field_1._converter.datasSortedField = field_1;
|
||||
field_1._converter.refreshView();
|
||||
});
|
||||
}
|
||||
};
|
||||
return SortingField;
|
||||
}());
|
||||
|
||||
@ -34,13 +34,13 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
|
||||
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
||||
}
|
||||
};
|
||||
import { FreeDatas2HTML, Pagination, Render, SearchEngine, Selector, SortingField } from "./FreeDatas2HTML";
|
||||
import { FreeDatas2HTML, Pagination, Render, SearchEngine, Selector, SortingField } from "../FreeDatas2HTML";
|
||||
var initialise = function () { return __awaiter(void 0, void 0, void 0, function () {
|
||||
var mySort, converter, myRender, pagination, filtre1, filtre2, filtre3, mySearch, sortingField1, sortingField2, sortingField3, sortingField4, e_1;
|
||||
return __generator(this, function (_a) {
|
||||
switch (_a.label) {
|
||||
case 0:
|
||||
_a.trys.push([0, 3, , 4]);
|
||||
_a.trys.push([0, 2, , 3]);
|
||||
mySort = function (a, b, order) {
|
||||
if (order === void 0) { order = "asc"; }
|
||||
var values = ["> 100000", "> 1 et < 100 000", "≤ 1", "Traces", "Inexistant"];
|
||||
@ -55,7 +55,6 @@ var initialise = function () { return __awaiter(void 0, void 0, void 0, function
|
||||
};
|
||||
converter = new FreeDatas2HTML("CSV");
|
||||
converter.parser.setRemoteSource({ url: "http://localhost:8080/datas/elements-chimiques.csv" });
|
||||
converter.datasViewElt = { id: "datas" };
|
||||
return [4, converter.run()];
|
||||
case 1:
|
||||
_a.sent();
|
||||
@ -83,10 +82,6 @@ var initialise = function () { return __awaiter(void 0, void 0, void 0, function
|
||||
pagination.selectedValue = 10;
|
||||
converter.pagination = pagination;
|
||||
pagination.options2HTML();
|
||||
converter.datasCounterElt = { id: "compteur" };
|
||||
return [4, converter.run()];
|
||||
case 2:
|
||||
_a.sent();
|
||||
filtre1 = new Selector(converter, 3, { id: "filtre1" });
|
||||
filtre1.filter2HTML();
|
||||
filtre2 = new Selector(converter, 4, { id: "filtre2" });
|
||||
@ -94,7 +89,6 @@ var initialise = function () { return __awaiter(void 0, void 0, void 0, function
|
||||
filtre3 = new Selector(converter, 5, { id: "filtre3" }, ",");
|
||||
filtre3.filter2HTML();
|
||||
mySearch = new SearchEngine(converter, { id: "search" }, [1, 3, 5]);
|
||||
mySearch.btnTxt = "Chercher";
|
||||
mySearch.label = "Qui cherche trouve ?";
|
||||
mySearch.btnTxt = "Va chercher !";
|
||||
mySearch.automaticSearch = true;
|
||||
@ -104,23 +98,22 @@ var initialise = function () { return __awaiter(void 0, void 0, void 0, function
|
||||
converter.datasFilters = [filtre1, filtre2, filtre3, mySearch];
|
||||
if (window.innerWidth >= 800) {
|
||||
sortingField1 = new SortingField(converter, 0);
|
||||
sortingField1.field2HTML();
|
||||
sortingField2 = new SortingField(converter, 1);
|
||||
sortingField2.field2HTML();
|
||||
sortingField3 = new SortingField(converter, 2);
|
||||
sortingField3.field2HTML();
|
||||
sortingField4 = new SortingField(converter, 4);
|
||||
sortingField4.field2HTML();
|
||||
converter.datasSortingFields = [sortingField1, sortingField2, sortingField3, sortingField4];
|
||||
}
|
||||
return [3, 4];
|
||||
case 3:
|
||||
converter.datasViewElt = { id: "datas" };
|
||||
converter.datasCounterElt = { id: "compteur" };
|
||||
converter.refreshView();
|
||||
return [3, 3];
|
||||
case 2:
|
||||
e_1 = _a.sent();
|
||||
console.error(e_1);
|
||||
if (document.getElementById("datas") !== null)
|
||||
document.getElementById("datas").innerHTML = "<strong>Désolé, mais un problème technique empêche l'affichage des données.</strong>";
|
||||
return [3, 4];
|
||||
case 4: return [2];
|
||||
return [3, 3];
|
||||
case 3: return [2];
|
||||
}
|
||||
});
|
||||
}); };
|
||||
@ -34,15 +34,14 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
|
||||
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
||||
}
|
||||
};
|
||||
import { FreeDatas2HTML, Pagination, Render, Selector, SortingField } from "./FreeDatas2HTML";
|
||||
import { FreeDatas2HTML, Pagination, Render, Selector, SortingField } from "../FreeDatas2HTML";
|
||||
var initialise = function () { return __awaiter(void 0, void 0, void 0, function () {
|
||||
var converter, myRender, pagination, filtre1, sortingField1, sortingField2, e_1;
|
||||
return __generator(this, function (_a) {
|
||||
switch (_a.label) {
|
||||
case 0:
|
||||
_a.trys.push([0, 3, , 4]);
|
||||
_a.trys.push([0, 2, , 3]);
|
||||
converter = new FreeDatas2HTML("HTML");
|
||||
converter.datasViewElt = { id: "datas" };
|
||||
return [4, converter.run()];
|
||||
case 1:
|
||||
_a.sent();
|
||||
@ -69,28 +68,25 @@ var initialise = function () { return __awaiter(void 0, void 0, void 0, function
|
||||
pagination.selectedValue = 30;
|
||||
converter.pagination = pagination;
|
||||
pagination.options2HTML();
|
||||
converter.datasCounterElt = { id: "compteur" };
|
||||
return [4, converter.run()];
|
||||
case 2:
|
||||
_a.sent();
|
||||
filtre1 = new Selector(converter, 3, { id: "filtre1" });
|
||||
filtre1.filter2HTML();
|
||||
converter.datasFilters = [filtre1];
|
||||
if (window.innerWidth >= 800) {
|
||||
sortingField1 = new SortingField(converter, 2);
|
||||
sortingField1.field2HTML();
|
||||
sortingField2 = new SortingField(converter, 3);
|
||||
sortingField2.field2HTML();
|
||||
converter.datasSortingFields = [sortingField1, sortingField2];
|
||||
}
|
||||
return [3, 4];
|
||||
case 3:
|
||||
converter.datasViewElt = { id: "datas" };
|
||||
converter.datasCounterElt = { id: "compteur" };
|
||||
converter.refreshView();
|
||||
return [3, 3];
|
||||
case 2:
|
||||
e_1 = _a.sent();
|
||||
console.error(e_1);
|
||||
if (document.getElementById("datas") !== null)
|
||||
document.getElementById("datas").innerHTML = "<strong>Désolé, mais un problème technique empêche l'affichage des données.</strong>";
|
||||
return [3, 4];
|
||||
case 4: return [2];
|
||||
return [3, 3];
|
||||
case 3: return [2];
|
||||
}
|
||||
});
|
||||
}); };
|
||||
@ -34,16 +34,15 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
|
||||
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
||||
}
|
||||
};
|
||||
import { FreeDatas2HTML, Pagination, Render, Selector, SortingField } from "./FreeDatas2HTML";
|
||||
import { FreeDatas2HTML, Pagination, Render, Selector, SortingField } from "../FreeDatas2HTML";
|
||||
var initialise = function () { return __awaiter(void 0, void 0, void 0, function () {
|
||||
var converter, myRender, pagination, filtre1, sortingField1, sortingField2, sortingField3, e_1;
|
||||
var converter, myRender, pagination, sortingField1, sortingField2, sortingField3, filtre1, e_1;
|
||||
return __generator(this, function (_a) {
|
||||
switch (_a.label) {
|
||||
case 0:
|
||||
_a.trys.push([0, 3, , 4]);
|
||||
_a.trys.push([0, 2, , 3]);
|
||||
converter = new FreeDatas2HTML("JSON");
|
||||
converter.parser.setRemoteSource({ url: "http://localhost:8080/datas/posts.json", withCredentials: true, headers: [{ key: "Authorization", value: "Token YWxhZGRpbjpvcGVuc2VzYW1l" }] });
|
||||
converter.datasViewElt = { id: "datas" };
|
||||
return [4, converter.run()];
|
||||
case 1:
|
||||
_a.sent();
|
||||
@ -70,30 +69,26 @@ var initialise = function () { return __awaiter(void 0, void 0, void 0, function
|
||||
pagination.selectedValue = 15;
|
||||
converter.pagination = pagination;
|
||||
pagination.options2HTML();
|
||||
converter.datasCounterElt = { id: "compteur" };
|
||||
return [4, converter.run()];
|
||||
case 2:
|
||||
_a.sent();
|
||||
if (window.innerWidth >= 800) {
|
||||
sortingField1 = new SortingField(converter, 0);
|
||||
sortingField2 = new SortingField(converter, 1);
|
||||
sortingField3 = new SortingField(converter, 2);
|
||||
converter.datasSortingFields = [sortingField1, sortingField2, sortingField3];
|
||||
}
|
||||
filtre1 = new Selector(converter, 0, { id: "filtre1" });
|
||||
filtre1.filter2HTML();
|
||||
converter.datasFilters = [filtre1];
|
||||
if (window.innerWidth >= 800) {
|
||||
sortingField1 = new SortingField(converter, 0);
|
||||
sortingField1.field2HTML();
|
||||
sortingField2 = new SortingField(converter, 1);
|
||||
sortingField2.field2HTML();
|
||||
sortingField3 = new SortingField(converter, 2);
|
||||
sortingField3.field2HTML();
|
||||
converter.datasSortingFields = [sortingField1, sortingField2, sortingField3];
|
||||
}
|
||||
return [3, 4];
|
||||
case 3:
|
||||
converter.datasViewElt = { id: "datas" };
|
||||
converter.datasCounterElt = { id: "compteur" };
|
||||
converter.refreshView();
|
||||
return [3, 3];
|
||||
case 2:
|
||||
e_1 = _a.sent();
|
||||
console.error(e_1);
|
||||
if (document.getElementById("datas") !== null)
|
||||
document.getElementById("datas").innerHTML = "<strong>Désolé, mais un problème technique empêche l'affichage des données.</strong>";
|
||||
return [3, 4];
|
||||
case 4: return [2];
|
||||
return [3, 3];
|
||||
case 3: return [2];
|
||||
}
|
||||
});
|
||||
}); };
|
||||
139
src/build/demo/exampleWithUserFile.js
Normal file
139
src/build/demo/exampleWithUserFile.js
Normal file
@ -0,0 +1,139 @@
|
||||
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, Pagination, Render, SearchEngine, SortingField } from "../FreeDatas2HTML";
|
||||
var initialise = function () {
|
||||
try {
|
||||
var dataDisplayElt_1 = document.getElementById("datas");
|
||||
var dataDisplayOptionsElt_1 = document.getElementById("displayOptions");
|
||||
var myFile_1 = document.getElementById("myFile");
|
||||
var myForm = document.getElementById("userSettings");
|
||||
var pagesElt_1 = document.getElementById("pages");
|
||||
var paginationElt_1 = document.getElementById("paginationOptions");
|
||||
var searchElt_1 = document.getElementById("search");
|
||||
if (dataDisplayElt_1 === null || dataDisplayOptionsElt_1 === null || myFile_1 === null || myForm === null || pagesElt_1 === null || paginationElt_1 === null || searchElt_1 === null)
|
||||
throw new Error("Tous les éléments HTML nécessaires au fonctionnement n'ont pas été trouvés dans la page;");
|
||||
var reInitialise_1 = function () {
|
||||
dataDisplayElt_1.innerHTML = "";
|
||||
dataDisplayOptionsElt_1.innerHTML = "";
|
||||
pagesElt_1.innerHTML = "";
|
||||
paginationElt_1.innerHTML = "";
|
||||
searchElt_1.innerHTML = "";
|
||||
};
|
||||
var converter_1;
|
||||
var myRender_1 = new Render();
|
||||
myRender_1.settings.allBegining = "<table class='table-hover'><caption>Nombre de résultats : <span id='counter'></span></caption>";
|
||||
myFile_1.addEventListener("change", function (e) {
|
||||
reInitialise_1();
|
||||
converter_1 = new FreeDatas2HTML("CSV");
|
||||
converter_1.datasRender = myRender_1;
|
||||
var selectedFiles = myFile_1.files;
|
||||
if (selectedFiles !== null && selectedFiles.length === 1) {
|
||||
if (selectedFiles[0].type !== "text/csv")
|
||||
dataDisplayOptionsElt_1.innerHTML = "<p class='text-danger'>Le document que vous avez s\u00E9lectionn\u00E9 ne semble pas \u00EAtre un fichier CSV valide.</p>";
|
||||
else {
|
||||
var reader_1 = new FileReader();
|
||||
reader_1.onload = function (e) {
|
||||
return __awaiter(this, void 0, void 0, function () {
|
||||
var fieldsSelectorHTML, i;
|
||||
return __generator(this, function (_a) {
|
||||
switch (_a.label) {
|
||||
case 0:
|
||||
converter_1.parser.datas2Parse = reader_1.result;
|
||||
return [4, converter_1.run()];
|
||||
case 1:
|
||||
_a.sent();
|
||||
fieldsSelectorHTML = "<fieldset class=\"form-group\"><legend>Quels champs souhaitez-vous afficher ?</legend>";
|
||||
for (i = 0; i < converter_1.fields.length; i++)
|
||||
fieldsSelectorHTML += "<label for=\"selectedField_" + i + "\" class=\"paper-check\"> <input type=\"checkbox\" class=\"selectedFields\" id=\"selectedField_" + i + "\" name=\"selectedField_" + i + "\" value=" + i + " checked> <span>" + converter_1.fields[i] + "</span></label>";
|
||||
fieldsSelectorHTML += "</fieldset>";
|
||||
dataDisplayOptionsElt_1.innerHTML = fieldsSelectorHTML + "<button type=\"submit\" class=\"btn-success\">Valider</button>";
|
||||
return [2];
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
reader_1.readAsText(selectedFiles[0]);
|
||||
}
|
||||
}
|
||||
});
|
||||
myForm.addEventListener("submit", function (e) {
|
||||
e.preventDefault();
|
||||
dataDisplayElt_1.innerHTML = "";
|
||||
var fields2Rend = [];
|
||||
var checkBox;
|
||||
for (var i = 0; i < converter_1.fields.length; i++) {
|
||||
checkBox = document.getElementById("selectedField_" + i);
|
||||
if (checkBox !== null) {
|
||||
if (checkBox.checked)
|
||||
fields2Rend.push(i);
|
||||
}
|
||||
}
|
||||
if (fields2Rend.length === 0)
|
||||
dataDisplayElt_1.innerHTML = "<p class='text-danger'>Vous n'avez s\u00E9lectionn\u00E9 aucun champ \u00E0 afficher !</p>";
|
||||
else {
|
||||
converter_1.fields2Rend = fields2Rend;
|
||||
converter_1.datasViewElt = { id: "datas" };
|
||||
var mySearch = new SearchEngine(converter_1, { id: "search" });
|
||||
mySearch.label = "Qui cherche trouve ?";
|
||||
mySearch.btnTxt = "Va chercher !";
|
||||
mySearch.automaticSearch = true;
|
||||
mySearch.nbCharsForSearch = 2;
|
||||
mySearch.placeholder = "Saisir un moins 2 caractères";
|
||||
mySearch.filter2HTML();
|
||||
converter_1.datasFilters = [mySearch];
|
||||
var pagination = new Pagination(converter_1, { id: "pages" }, "Page à afficher :");
|
||||
pagination.options = { displayElement: { id: "paginationOptions" }, values: [10, 20, 50, 500], name: "Choix de pagination :" };
|
||||
pagination.selectedValue = 10;
|
||||
converter_1.pagination = pagination;
|
||||
pagination.options2HTML();
|
||||
converter_1.datasCounterElt = { id: "counter" };
|
||||
var sortingField = void 0;
|
||||
converter_1.datasSortingFields = [];
|
||||
for (var i = 0; i < converter_1.fields2Rend.length; i++) {
|
||||
sortingField = new SortingField(converter_1, converter_1.fields2Rend[i]);
|
||||
converter_1.datasSortingFields.push(sortingField);
|
||||
}
|
||||
converter_1.refreshView();
|
||||
}
|
||||
});
|
||||
}
|
||||
catch (e) {
|
||||
console.error(e);
|
||||
document.getElementById("datas").innerHTML = "<strong>D\u00E9sol\u00E9, mais un probl\u00E8me impr\u00E9vu emp\u00EAche l'affichage des donn\u00E9es.</strong>";
|
||||
}
|
||||
};
|
||||
initialise();
|
||||
42
src/build/errors.js
Normal file
42
src/build/errors.js
Normal file
@ -0,0 +1,42 @@
|
||||
"use strict";
|
||||
module.exports =
|
||||
{
|
||||
converterElementNotFound: "Aucun élément HTML n'a été trouvé ayant comme \"id\" : ",
|
||||
converterFieldNotFound: "Le champ n'existe pas dans les données ou les données n'ont pas encore été chargées.",
|
||||
converterNeedDatasElt: "Merci de fournir un id valide pour l'élément où afficher les données.",
|
||||
converterRefreshFail: "Le nom des champs et l'élement du DOM receveur sont nécessaires à l'affichage des données.",
|
||||
filterCheckIsOkFail: "Le test est lancé sur un filtre incorrectement initialisé ou sur un attribut absent de la donnée à tester.",
|
||||
filterNeedDatas: "Le création d'un filtre nécessite la présence des données à filtrer.",
|
||||
pagination2HTMLFail: "Toutes les donnée nécessaires à la création des sélecteurs de pagination n'ont pas été fournies.",
|
||||
paginationNeedByfaultValueBeInOptions: "La valeur de pagination par défaut doit faire partie des options proposées.",
|
||||
paginationNeedDatas: "Il ne peut y avoir de pagination, si les données n'ont pas été récupérées.",
|
||||
paginationNeedOptionsValues: "Vous n'avez fourni aucune options possibles pour la pagination.",
|
||||
paginationOptionsDuplicatedValues: "Une valeur en doublon a été trouvée dans les options de pagination.",
|
||||
paginationNeedPositiveInteger: "Merci de fournir un nombre entier supérieur à zéro pour désigner chaque option de pagination.",
|
||||
parserDatasNotFound: "Aucune donnée n'a été trouvée.",
|
||||
parserElementsNotFound: "Aucun élément trouvé dans le document pour le sélecteur fourni : ",
|
||||
parserFail: "La lecture des données a échoué.",
|
||||
parserFieldNameFail: "Les noms de champs fournis doivent être uniques et ne peuvent être vides.",
|
||||
parserFieldsNotFound: "Aucun nom de champs n'a été trouvé par le parseur.",
|
||||
parserLineWithoutDatas: "Une ligne ne contenant aucune donnée valide a été trouvée.",
|
||||
parserMeetErrors: "Au moins une erreur a été rencontrée durant le traitement des données.",
|
||||
parserNeedDatas: "Merci de fournir une chaîne de caractères valide à parser.",
|
||||
parserNeedSource: "Merci de fournir une chaîne de caractères où une url pour les données à parser.",
|
||||
parserNumberOfFieldsFail: "Il n'y a pas le nombre de champs attendu pour cet enregistrement.",
|
||||
parserRemoteFail: "Erreur rencontrée durant l'accès aux données distantes.",
|
||||
parserSelectorsIsEmpty: "Les sélecteurs CSS ne peuvent pas être une chaîne vide.",
|
||||
parserTypeError: "Une donnée a été trouvée avec un type imprévu : ",
|
||||
remoteSourceHeaderUnallowed: "Le nom d'une des entêtes passées n'est pas autorisé.",
|
||||
remoteSourceNeedUrl: "Merci de fournir une url valide pour la source distante de données.",
|
||||
remoteSourceUrlFail: "L'url fournie ne semble pas valide.",
|
||||
renderNeedFields: "Les noms de champs doivent être fournis avant de demander l'affichage des données.",
|
||||
searchFieldNotFound: "Au moins un des champs devant être utilisés par le moteur de recherche n'existe pas dans les données.",
|
||||
selector2HTMLFail: "Le création d'un filtre dans le DOM nécessite l'initialisation de l'élément HTML et du numéro du champs à filter.",
|
||||
selectorFieldIsEmpty: "Aucune donnée trouvée pour le champ du filtre",
|
||||
selectorFieldNotFound: "Au moins un des champs devant servir à filtrer les données n'existe pas dans le fichier.",
|
||||
selectorSelectedIndexNotFound: "La valeur sélectionnée n'a pas été trouvée dans la liste des champs.",
|
||||
sortingFieldNeedDatas: "La création d'un champ de classement nécessite la transmission de la liste des champs.",
|
||||
sortingFieldNotFound: "Au moins un des champs devant permettre de classer les données n'existe pas dans ceux à afficher.",
|
||||
sortingFieldsNbFail: "Le nombre de champs trouvés dans le DOM ne correspond pas à celui des données à classer.",
|
||||
sortingFieldsNotInHTML: "Les champs pouvant servir à classer les données n'ont pas été trouvés dans le DOM.",
|
||||
};
|
||||
@ -1,215 +0,0 @@
|
||||
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 };
|
||||
}
|
||||
};
|
||||
var compare = require('natural-orderby').compare;
|
||||
var errors = require("./errors.js");
|
||||
import { ParserForCSV } from "./freeDatas2HTMLParserForCSV";
|
||||
import { ParserForHTML } from "./freeDatas2HTMLParserForHTML";
|
||||
import { ParserForJSON } from "./freeDatas2HTMLParserForJSON";
|
||||
import { Render } from "./freeDatas2HTMLRender";
|
||||
var FreeDatas2HTML = (function () {
|
||||
function FreeDatas2HTML(datasType, datas2Parse, datasRemoteSource) {
|
||||
if (datas2Parse === void 0) { datas2Parse = ""; }
|
||||
this._datasViewElt = undefined;
|
||||
this.datasHTML = "";
|
||||
this.fields = undefined;
|
||||
this.datas = [];
|
||||
this.stopIfParseErrors = false;
|
||||
this._datasSortingFunctions = [];
|
||||
this.datasSelectors = [];
|
||||
this.datasSortingFields = [];
|
||||
this._datasCounter = {};
|
||||
this.datasRender = new Render(this);
|
||||
switch (datasType) {
|
||||
case "CSV":
|
||||
this.parser = new ParserForCSV(datasRemoteSource);
|
||||
break;
|
||||
case "HTML":
|
||||
this.parser = new ParserForHTML(datasRemoteSource);
|
||||
break;
|
||||
case "JSON":
|
||||
this.parser = new ParserForJSON(datasRemoteSource);
|
||||
break;
|
||||
}
|
||||
if (datas2Parse !== "")
|
||||
this.parser.datas2Parse = datas2Parse;
|
||||
}
|
||||
FreeDatas2HTML.checkInDOMById = function (checkedElt) {
|
||||
var searchEltInDOM = document.getElementById(checkedElt.id);
|
||||
if (searchEltInDOM === null)
|
||||
throw new Error(errors.converterElementNotFound + checkedElt.id);
|
||||
else {
|
||||
checkedElt.eltDOM = searchEltInDOM;
|
||||
return checkedElt;
|
||||
}
|
||||
};
|
||||
FreeDatas2HTML.prototype.checkFieldExist = function (nb) {
|
||||
if (this.fields === undefined || this.fields[nb] === undefined)
|
||||
return false;
|
||||
else
|
||||
return true;
|
||||
};
|
||||
Object.defineProperty(FreeDatas2HTML.prototype, "datasViewElt", {
|
||||
set: function (elt) {
|
||||
this._datasViewElt = FreeDatas2HTML.checkInDOMById(elt);
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(FreeDatas2HTML.prototype, "datasSortingFunctions", {
|
||||
set: function (SortingFunctions) {
|
||||
this._datasSortingFunctions = [];
|
||||
for (var _i = 0, SortingFunctions_1 = SortingFunctions; _i < SortingFunctions_1.length; _i++) {
|
||||
var checkedFunction = SortingFunctions_1[_i];
|
||||
if (!this.checkFieldExist(checkedFunction.datasFieldNb))
|
||||
throw new Error(errors.converterFieldNotFound);
|
||||
else
|
||||
this._datasSortingFunctions.push(checkedFunction);
|
||||
}
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(FreeDatas2HTML.prototype, "datasCounter", {
|
||||
set: function (counterDisplayElement) {
|
||||
this._datasCounter = { displayElement: FreeDatas2HTML.checkInDOMById(counterDisplayElement), value: undefined };
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
FreeDatas2HTML.prototype.getDatasCounterValue = function () {
|
||||
if (this._datasCounter !== undefined && this._datasCounter.value != undefined)
|
||||
return this._datasCounter.value;
|
||||
else
|
||||
return undefined;
|
||||
};
|
||||
FreeDatas2HTML.prototype.getSortingFunctionForField = function (datasFieldNb) {
|
||||
for (var _i = 0, _a = this._datasSortingFunctions; _i < _a.length; _i++) {
|
||||
var checkedFunction = _a[_i];
|
||||
if (checkedFunction.datasFieldNb === datasFieldNb)
|
||||
return checkedFunction;
|
||||
}
|
||||
return undefined;
|
||||
};
|
||||
FreeDatas2HTML.prototype.run = function () {
|
||||
return __awaiter(this, void 0, void 0, function () {
|
||||
return __generator(this, function (_a) {
|
||||
switch (_a.label) {
|
||||
case 0: return [4, this.parser.parse()];
|
||||
case 1:
|
||||
_a.sent();
|
||||
if (this.parser.parseResults === undefined)
|
||||
throw new Error(errors.parserFail);
|
||||
else {
|
||||
if (this.parser.parseResults.fields === undefined)
|
||||
throw new Error(errors.parserDatasNotFound);
|
||||
else if (this.stopIfParseErrors && this.parser.parseResults.errors !== undefined)
|
||||
throw new Error(errors.parserMeetErrors);
|
||||
else {
|
||||
this.fields = this.parser.parseResults.fields;
|
||||
this.datas = this.parser.parseResults.datas;
|
||||
this.parseErrors = this.parser.parseResults.errors;
|
||||
if (this._datasViewElt !== undefined)
|
||||
this.refreshView();
|
||||
return [2, true];
|
||||
}
|
||||
}
|
||||
return [2];
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
FreeDatas2HTML.prototype.refreshView = function () {
|
||||
if (this.fields === undefined || this._datasViewElt === undefined || this._datasViewElt.eltDOM === undefined)
|
||||
throw new Error(errors.converterRefreshFail);
|
||||
else {
|
||||
this.datasHTML = this.createDatas2Display(this.fields, this.datas);
|
||||
this._datasViewElt.eltDOM.innerHTML = this.datasHTML;
|
||||
for (var _i = 0, _a = this.datasSortingFields; _i < _a.length; _i++) {
|
||||
var field = _a[_i];
|
||||
field.field2HTML();
|
||||
}
|
||||
}
|
||||
};
|
||||
FreeDatas2HTML.prototype.createDatas2Display = function (fields, datas) {
|
||||
if (this.datasSortedField !== undefined && this.datasSortedField.datasFieldNb !== undefined) {
|
||||
var field_1 = fields[this.datasSortedField.datasFieldNb];
|
||||
var fieldOrder_1 = this.datasSortedField.order;
|
||||
if (this.getSortingFunctionForField(this.datasSortedField.datasFieldNb) !== undefined) {
|
||||
var myFunction_1 = this.getSortingFunctionForField(this.datasSortedField.datasFieldNb);
|
||||
datas.sort(function (a, b) { return myFunction_1.sort(a[field_1], b[field_1], fieldOrder_1); });
|
||||
}
|
||||
else
|
||||
datas.sort(function (a, b) { return compare({ order: fieldOrder_1 })(a[field_1], b[field_1]); });
|
||||
}
|
||||
var firstData = 0;
|
||||
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);
|
||||
var maxData = (this.pagination !== undefined && this.pagination.selectedValue !== undefined) ? this.pagination.selectedValue : datas.length + 1;
|
||||
var datas2Display = [];
|
||||
var nbVisible = 0, nbTotal = 0;
|
||||
for (var row in datas) {
|
||||
var visible = true;
|
||||
if (this.datasSelectors.length !== 0) {
|
||||
var i = 0;
|
||||
while (this.datasSelectors[i] !== undefined && visible === true) {
|
||||
visible = this.datasSelectors[i].dataIsOk(datas[row]);
|
||||
i++;
|
||||
}
|
||||
}
|
||||
if (visible && nbTotal >= firstData && nbVisible < maxData) {
|
||||
datas2Display.push(datas[row]);
|
||||
nbVisible++;
|
||||
nbTotal++;
|
||||
}
|
||||
else if (visible)
|
||||
nbTotal++;
|
||||
}
|
||||
if (this._datasCounter !== undefined && this._datasCounter.displayElement !== undefined) {
|
||||
this._datasCounter.value = nbTotal;
|
||||
this._datasCounter.displayElement.eltDOM.innerHTML = "" + nbTotal;
|
||||
}
|
||||
if (this.pagination !== undefined)
|
||||
this.pagination.creaPageSelector(nbTotal);
|
||||
return this.datasRender.rend2HTML(datas2Display);
|
||||
};
|
||||
return FreeDatas2HTML;
|
||||
}());
|
||||
export { FreeDatas2HTML };
|
||||
export { Pagination } from "./freeDatas2HTMLPagination";
|
||||
export { Render } from "./freeDatas2HTMLRender";
|
||||
export { Selector } from "./freeDatas2HTMLSelector";
|
||||
export { SortingField } from "./freeDatas2HTMLSortingField";
|
||||
@ -1 +0,0 @@
|
||||
;
|
||||
@ -1,114 +0,0 @@
|
||||
var errors = require("./errors.js");
|
||||
import { FreeDatas2HTML } from "./freeDatas2HTML";
|
||||
var Pagination = (function () {
|
||||
function Pagination(converter, pagesElt, pagesName) {
|
||||
if (pagesName === void 0) { pagesName = "Pages"; }
|
||||
if (converter.fields === undefined)
|
||||
throw new Error(errors.paginationNeedDatas);
|
||||
else {
|
||||
this._pages = { displayElement: FreeDatas2HTML.checkInDOMById(pagesElt), name: pagesName };
|
||||
this._converter = converter;
|
||||
}
|
||||
}
|
||||
Pagination.isPositiveInteger = function (nb) {
|
||||
return (Number.isInteger(nb) === false || nb <= 0) ? false : true;
|
||||
};
|
||||
Object.defineProperty(Pagination.prototype, "selectedValue", {
|
||||
get: function () {
|
||||
return this._selectedValue;
|
||||
},
|
||||
set: function (value) {
|
||||
if (value === undefined || !Pagination.isPositiveInteger(value))
|
||||
throw new Error(errors.needPositiveInteger);
|
||||
if (this.options !== undefined && this.options.values.indexOf(value) === -1)
|
||||
throw new Error(errors.paginationNeedByfaultValueBeInOptions);
|
||||
this._selectedValue = value;
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(Pagination.prototype, "options", {
|
||||
get: function () {
|
||||
return this._options;
|
||||
},
|
||||
set: function (options) {
|
||||
if (options !== undefined) {
|
||||
options.displayElement = FreeDatas2HTML.checkInDOMById(options.displayElement);
|
||||
if (options.values.length === 0)
|
||||
throw new Error(errors.paginationNeedOptionsValues);
|
||||
for (var _i = 0, _a = options.values; _i < _a.length; _i++) {
|
||||
var option = _a[_i];
|
||||
if (!Pagination.isPositiveInteger(option))
|
||||
throw new Error(errors.needPositiveInteger);
|
||||
}
|
||||
if (this.selectedValue !== undefined && options.values.indexOf(this.selectedValue) === -1)
|
||||
throw new Error(errors.paginationNeedByfaultValueBeInOptions);
|
||||
options.name = (options.name === undefined) ? "Pagination" : options.name;
|
||||
this._options = options;
|
||||
}
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(Pagination.prototype, "pages", {
|
||||
get: function () {
|
||||
return this._pages;
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Pagination.prototype.rend2HTML = function () {
|
||||
if (this._converter === undefined || this._options === undefined)
|
||||
throw new Error(errors.pagination2HTMLFail);
|
||||
else {
|
||||
var selectorsHTML = "<label for='freeDatas2HTMLPaginationSelector'>" + this._options.name + " </label><select name='freeDatas2HTMLPaginationSelector' id='freeDatas2HTMLPaginationSelector'><option value='0'>----</option>";
|
||||
for (var i = 0; i < this._options.values.length; i++)
|
||||
selectorsHTML += "<option value='" + (i + 1) + "'>" + this._options.values[i] + "</option>";
|
||||
selectorsHTML += "</select>";
|
||||
this._options.displayElement.eltDOM.innerHTML = selectorsHTML;
|
||||
var selectElement_1 = document.getElementById("freeDatas2HTMLPaginationSelector");
|
||||
if (this._selectedValue !== undefined) {
|
||||
var indexSelectedValue = this._options.values.indexOf(this._selectedValue) + 1;
|
||||
selectElement_1.value = "" + indexSelectedValue;
|
||||
}
|
||||
var pagination_1 = this;
|
||||
selectElement_1.addEventListener("change", function (e) {
|
||||
if (selectElement_1.value === "0")
|
||||
pagination_1._selectedValue = undefined;
|
||||
else
|
||||
pagination_1._selectedValue = pagination_1._options.values[Number(selectElement_1.value) - 1];
|
||||
pagination_1._converter.refreshView();
|
||||
});
|
||||
}
|
||||
};
|
||||
Pagination.prototype.creaPageSelector = function (nbTotal) {
|
||||
if (this.selectedValue !== undefined) {
|
||||
if (nbTotal > this.selectedValue) {
|
||||
var nbPages = Math.ceil(nbTotal / this.selectedValue);
|
||||
var selectorsHTML = "<label for='freeDatas2HTMLPagesSelector'>" + this.pages.name + " </label><select name='freeDatas2HTMLPagesSelector' id='freeDatas2HTMLPagesSelector'><option value='1'>1</option>";
|
||||
this.pages.values = [1];
|
||||
for (var j = 2; j <= nbPages; j++) {
|
||||
selectorsHTML += "<option value='" + j + "'>" + j + "</option>";
|
||||
this.pages.values.push(j);
|
||||
}
|
||||
selectorsHTML += "</select>";
|
||||
this.pages.displayElement.eltDOM.innerHTML = selectorsHTML;
|
||||
var selectElement_2 = document.getElementById("freeDatas2HTMLPagesSelector");
|
||||
if (this.pages.selectedValue !== undefined)
|
||||
selectElement_2.value = "" + this.pages.selectedValue;
|
||||
this.pages.selectedValue = 1;
|
||||
var pagination_2 = this;
|
||||
selectElement_2.addEventListener('change', function (e) {
|
||||
pagination_2.pages.selectedValue = Number(selectElement_2.value);
|
||||
pagination_2._converter.refreshView();
|
||||
});
|
||||
}
|
||||
else
|
||||
this.pages.displayElement.eltDOM.innerHTML = "";
|
||||
}
|
||||
else
|
||||
this.pages.displayElement.eltDOM.innerHTML = "";
|
||||
};
|
||||
return Pagination;
|
||||
}());
|
||||
export { Pagination };
|
||||
@ -1,166 +0,0 @@
|
||||
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 };
|
||||
}
|
||||
};
|
||||
var Papa = require("papaparse");
|
||||
var errors = require("./errors.js");
|
||||
import { RemoteSources } from "./freeDatas2HTMLRemoteSources";
|
||||
var ParserForCSV = (function () {
|
||||
function ParserForCSV(datasRemoteSource) {
|
||||
this._datas2Parse = "";
|
||||
this._parseResults = undefined;
|
||||
this.options = {
|
||||
delimiter: "",
|
||||
newline: "",
|
||||
quoteChar: '"',
|
||||
escapeChar: '"',
|
||||
transformHeader: function (field, index) { return field.trim(); },
|
||||
preview: 0,
|
||||
comments: "",
|
||||
fastMode: undefined,
|
||||
transform: undefined
|
||||
};
|
||||
this._privateOptions = {
|
||||
header: true,
|
||||
download: false,
|
||||
downloadRequestHeaders: undefined,
|
||||
skipEmptyLines: "greedy",
|
||||
withCredentials: undefined
|
||||
};
|
||||
if (datasRemoteSource !== undefined)
|
||||
this._datasRemoteSource = datasRemoteSource;
|
||||
else
|
||||
this._datasRemoteSource = new RemoteSources({ url: "" });
|
||||
}
|
||||
ParserForCSV.prototype.setRemoteSource = function (source) {
|
||||
this._datasRemoteSource = new RemoteSources(source);
|
||||
};
|
||||
Object.defineProperty(ParserForCSV.prototype, "datasRemoteSource", {
|
||||
get: function () {
|
||||
return this._datasRemoteSource;
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(ParserForCSV.prototype, "datas2Parse", {
|
||||
get: function () {
|
||||
return this._datas2Parse;
|
||||
},
|
||||
set: function (datas) {
|
||||
if (datas.trim().length === 0)
|
||||
throw new Error(errors.parserNeedDatas);
|
||||
else
|
||||
this._datas2Parse = datas.trim();
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(ParserForCSV.prototype, "parseResults", {
|
||||
get: function () {
|
||||
return this._parseResults;
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(ParserForCSV.prototype, "privateOptions", {
|
||||
get: function () {
|
||||
return this._privateOptions;
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
ParserForCSV.prototype.parse = function () {
|
||||
return __awaiter(this, void 0, void 0, function () {
|
||||
var parser, options, parseContent, i;
|
||||
var _this = this;
|
||||
return __generator(this, function (_a) {
|
||||
parser = this, options = this.options;
|
||||
parseContent = "";
|
||||
if (parser._datasRemoteSource.url !== "") {
|
||||
parseContent = parser._datasRemoteSource.url;
|
||||
this._privateOptions.download = true;
|
||||
this._privateOptions.withCredentials = parser._datasRemoteSource.withCredentials;
|
||||
if (parser._datasRemoteSource.headers !== undefined) {
|
||||
this._privateOptions.downloadRequestHeaders = {};
|
||||
for (i = 0; i < parser._datasRemoteSource.headers.length; i++)
|
||||
this._privateOptions.downloadRequestHeaders[parser._datasRemoteSource.headers[i].key] = parser._datasRemoteSource.headers[i].value;
|
||||
}
|
||||
}
|
||||
else if (parser._datas2Parse !== "")
|
||||
parseContent = parser._datas2Parse;
|
||||
else
|
||||
throw new Error(errors.parserNeedSource);
|
||||
return [2, new Promise(function (resolve, reject) {
|
||||
Papa.parse(parseContent, {
|
||||
delimiter: options.delimiter,
|
||||
newline: options.newline,
|
||||
quoteChar: options.quoteChar,
|
||||
escapeChar: options.escapeChar,
|
||||
header: true,
|
||||
transformHeader: options.transformHeader,
|
||||
preview: options.preview,
|
||||
comments: options.comments,
|
||||
complete: function (results) {
|
||||
var realFields = [];
|
||||
for (var _i = 0, _a = results.meta.fields; _i < _a.length; _i++) {
|
||||
var field = _a[_i];
|
||||
if (field.trim() !== "")
|
||||
realFields.push(field);
|
||||
}
|
||||
if (realFields.length === 0)
|
||||
reject(new Error(errors.parserFail));
|
||||
else {
|
||||
parser._parseResults = {
|
||||
datas: results.data,
|
||||
errors: results.errors,
|
||||
fields: realFields,
|
||||
};
|
||||
resolve(true);
|
||||
}
|
||||
},
|
||||
download: _this._privateOptions.download,
|
||||
downloadRequestHeaders: _this._privateOptions.downloadRequestHeaders,
|
||||
skipEmptyLines: "greedy",
|
||||
fastMode: options.fastMode,
|
||||
withCredentials: _this._privateOptions.withCredentials,
|
||||
transform: options.transform
|
||||
});
|
||||
})];
|
||||
});
|
||||
});
|
||||
};
|
||||
return ParserForCSV;
|
||||
}());
|
||||
export { ParserForCSV };
|
||||
@ -1,174 +0,0 @@
|
||||
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 };
|
||||
}
|
||||
};
|
||||
var errors = require("./errors.js");
|
||||
import { RemoteSources } from "./freeDatas2HTMLRemoteSources";
|
||||
var ParserForHTML = (function () {
|
||||
function ParserForHTML(datasRemoteSource) {
|
||||
this._document2Parse = document;
|
||||
this._parseResults = undefined;
|
||||
this._fieldsSelector = "table > thead > tr > th";
|
||||
this._rowsSelector = "table > tbody > tr";
|
||||
this._datasSelector = "tr > td";
|
||||
if (datasRemoteSource !== undefined)
|
||||
this._datasRemoteSource = datasRemoteSource;
|
||||
else
|
||||
this._datasRemoteSource = new RemoteSources({ url: "" });
|
||||
}
|
||||
ParserForHTML.prototype.setRemoteSource = function (source) {
|
||||
this._datasRemoteSource = new RemoteSources(source);
|
||||
};
|
||||
Object.defineProperty(ParserForHTML.prototype, "datasRemoteSource", {
|
||||
get: function () {
|
||||
return this._datasRemoteSource;
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(ParserForHTML.prototype, "document2Parse", {
|
||||
get: function () {
|
||||
return this._document2Parse;
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(ParserForHTML.prototype, "fieldsSelector", {
|
||||
get: function () {
|
||||
return this._fieldsSelector;
|
||||
},
|
||||
set: function (selector) {
|
||||
if (selector.trim() === "")
|
||||
throw new Error(errors.parserSelectorsIsEmpty);
|
||||
else
|
||||
this._fieldsSelector = selector.trim();
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(ParserForHTML.prototype, "rowsSelector", {
|
||||
get: function () {
|
||||
return this._rowsSelector;
|
||||
},
|
||||
set: function (selector) {
|
||||
if (selector.trim() === "")
|
||||
throw new Error(errors.parserSelectorsIsEmpty);
|
||||
else
|
||||
this._rowsSelector = selector.trim();
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(ParserForHTML.prototype, "datasSelector", {
|
||||
get: function () {
|
||||
return this._datasSelector;
|
||||
},
|
||||
set: function (selector) {
|
||||
if (selector.trim() === "")
|
||||
throw new Error(errors.parserSelectorsIsEmpty);
|
||||
else
|
||||
this._datasSelector = selector.trim();
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(ParserForHTML.prototype, "parseResults", {
|
||||
get: function () {
|
||||
return this._parseResults;
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
ParserForHTML.prototype.parse = function () {
|
||||
return __awaiter(this, void 0, void 0, function () {
|
||||
var parser, realFields, datas, parseErrors, settings, response, responseHTML, parserDOM, fields, i, checkField, rows, datasElts, i, dataObject, j;
|
||||
return __generator(this, function (_a) {
|
||||
switch (_a.label) {
|
||||
case 0:
|
||||
parser = this;
|
||||
realFields = [], datas = [], parseErrors = [];
|
||||
if (!(parser._datasRemoteSource.url !== "")) return [3, 3];
|
||||
settings = parser._datasRemoteSource.getFetchSettings();
|
||||
return [4, fetch(parser._datasRemoteSource.url, settings)];
|
||||
case 1:
|
||||
response = _a.sent();
|
||||
if (!response.ok)
|
||||
throw new Error(errors.parserRemoteFail);
|
||||
return [4, response.text()];
|
||||
case 2:
|
||||
responseHTML = _a.sent();
|
||||
parserDOM = new DOMParser();
|
||||
this._document2Parse = parserDOM.parseFromString(responseHTML, "text/html");
|
||||
_a.label = 3;
|
||||
case 3:
|
||||
fields = this._document2Parse.querySelectorAll(this._fieldsSelector);
|
||||
if (fields.length === 0)
|
||||
throw new Error(errors.parserElementsNotFound + this._fieldsSelector);
|
||||
for (i = 0; i < fields.length; i++) {
|
||||
checkField = (fields[i].textContent + "").trim();
|
||||
if (checkField !== "" && realFields.indexOf(checkField) === -1)
|
||||
realFields.push(checkField);
|
||||
else
|
||||
console.error(errors.parserFieldNameFail);
|
||||
}
|
||||
if (realFields.length === 0)
|
||||
throw new Error(errors.parserFieldsNotFound);
|
||||
rows = this._document2Parse.querySelectorAll(this._rowsSelector);
|
||||
for (i = 0; i < rows.length; i++) {
|
||||
datasElts = rows[i].querySelectorAll(this._datasSelector);
|
||||
if (datasElts.length !== realFields.length)
|
||||
parseErrors.push({ row: i, message: errors.parserMeetErrors });
|
||||
dataObject = {};
|
||||
for (j = 0; j < datasElts.length && j < realFields.length; j++)
|
||||
dataObject[realFields[j]] = datasElts[j].textContent + "";
|
||||
if (Object.keys(dataObject).length !== 0)
|
||||
datas.push(dataObject);
|
||||
else
|
||||
parseErrors.push({ row: i, message: errors.parserMeetErrors });
|
||||
}
|
||||
parser._parseResults =
|
||||
{
|
||||
datas: datas,
|
||||
errors: parseErrors,
|
||||
fields: realFields,
|
||||
};
|
||||
return [2];
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
return ParserForHTML;
|
||||
}());
|
||||
export { ParserForHTML };
|
||||
@ -1,171 +0,0 @@
|
||||
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 };
|
||||
}
|
||||
};
|
||||
var errors = require("./errors.js");
|
||||
import { RemoteSources } from "./freeDatas2HTMLRemoteSources";
|
||||
var ParserForJSON = (function () {
|
||||
function ParserForJSON(datasRemoteSource) {
|
||||
this._datas2Parse = "";
|
||||
this._parseResults = undefined;
|
||||
if (datasRemoteSource !== undefined)
|
||||
this._datasRemoteSource = datasRemoteSource;
|
||||
else
|
||||
this._datasRemoteSource = new RemoteSources({ url: "" });
|
||||
}
|
||||
ParserForJSON.prototype.setRemoteSource = function (source) {
|
||||
this._datasRemoteSource = new RemoteSources(source);
|
||||
};
|
||||
Object.defineProperty(ParserForJSON.prototype, "datasRemoteSource", {
|
||||
get: function () {
|
||||
return this._datasRemoteSource;
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(ParserForJSON.prototype, "datas2Parse", {
|
||||
get: function () {
|
||||
return this._datas2Parse;
|
||||
},
|
||||
set: function (datas) {
|
||||
if (datas.trim().length === 0)
|
||||
throw new Error(errors.parserNeedDatas);
|
||||
else
|
||||
this._datas2Parse = datas.trim();
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(ParserForJSON.prototype, "parseResults", {
|
||||
get: function () {
|
||||
return this._parseResults;
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
ParserForJSON.trimAllFields = function (fields) {
|
||||
var nb = fields.length, goodFields = [];
|
||||
for (var i = 0; i < nb; i++) {
|
||||
if (typeof fields[i] === "string")
|
||||
goodFields.push(fields[i].trim());
|
||||
}
|
||||
return goodFields;
|
||||
};
|
||||
ParserForJSON.prototype.parse = function () {
|
||||
return __awaiter(this, void 0, void 0, function () {
|
||||
var parser, parseContent, settings, response, datasParsed, typesOkForValue, fields, datas, parseErrors, nbFields, nbDatas, i, dataObject, nbObjFields, j, i, _i, datasParsed_1, data, dataObject, field;
|
||||
return __generator(this, function (_a) {
|
||||
switch (_a.label) {
|
||||
case 0:
|
||||
parser = this;
|
||||
parseContent = "";
|
||||
if (!(parser._datasRemoteSource.url !== "")) return [3, 3];
|
||||
settings = parser._datasRemoteSource.getFetchSettings();
|
||||
return [4, fetch(parser._datasRemoteSource.url, settings)];
|
||||
case 1:
|
||||
response = _a.sent();
|
||||
if (!response.ok)
|
||||
throw new Error(errors.parserRemoteFail);
|
||||
return [4, response.text()];
|
||||
case 2:
|
||||
parseContent = _a.sent();
|
||||
return [3, 4];
|
||||
case 3:
|
||||
if (parser._datas2Parse !== "")
|
||||
parseContent = parser._datas2Parse;
|
||||
else
|
||||
throw new Error(errors.parserNeedSource);
|
||||
_a.label = 4;
|
||||
case 4:
|
||||
try {
|
||||
datasParsed = JSON.parse(parseContent);
|
||||
typesOkForValue = ["boolean", "number", "string"];
|
||||
fields = [], datas = [], parseErrors = [];
|
||||
if (datasParsed.fields !== undefined && Array.isArray(datasParsed.fields) && datasParsed.datas !== undefined && Array.isArray(datasParsed.datas)) {
|
||||
fields = ParserForJSON.trimAllFields(datasParsed.fields);
|
||||
nbFields = fields.length, nbDatas = datasParsed.datas.length;
|
||||
for (i = 0; i < nbDatas; i++) {
|
||||
dataObject = {}, nbObjFields = datasParsed.datas[i].length;
|
||||
for (j = 0; j < nbObjFields && j < nbFields; j++) {
|
||||
if (typesOkForValue.indexOf(typeof datasParsed.datas[i][j]) === -1)
|
||||
parseErrors.push({ row: i, message: errors.parserTypeError + typeof datasParsed.datas[i][j] });
|
||||
else
|
||||
dataObject[fields[j]] = datasParsed.datas[i][j] + "";
|
||||
}
|
||||
if (Object.keys(dataObject).length !== 0)
|
||||
datas.push(dataObject);
|
||||
}
|
||||
}
|
||||
else {
|
||||
i = 0;
|
||||
for (_i = 0, datasParsed_1 = datasParsed; _i < datasParsed_1.length; _i++) {
|
||||
data = datasParsed_1[_i];
|
||||
dataObject = {};
|
||||
for (field in data) {
|
||||
if (typesOkForValue.indexOf(typeof data[field]) !== -1) {
|
||||
field = field.trim();
|
||||
if (field !== "" && fields.indexOf(field) === -1)
|
||||
fields.push(field);
|
||||
dataObject[field] = data[field] + "";
|
||||
}
|
||||
else
|
||||
parseErrors.push({ row: i, message: errors.parserTypeError + typeof data[field] });
|
||||
}
|
||||
if (Object.keys(dataObject).length !== 0)
|
||||
datas.push(dataObject);
|
||||
i++;
|
||||
}
|
||||
}
|
||||
if (fields.length === 0)
|
||||
throw new Error(errors.parserFail);
|
||||
parser._parseResults =
|
||||
{
|
||||
datas: datas,
|
||||
errors: parseErrors,
|
||||
fields: fields,
|
||||
};
|
||||
}
|
||||
catch (e) {
|
||||
console.error(e);
|
||||
throw new Error(errors.parserFail);
|
||||
}
|
||||
return [2];
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
return ParserForJSON;
|
||||
}());
|
||||
export { ParserForJSON };
|
||||
@ -1,76 +0,0 @@
|
||||
var errors = require("./errors.js");
|
||||
var RemoteSources = (function () {
|
||||
function RemoteSources(RemoteSettings) {
|
||||
this.allowedUrlProtocol = ["https:", "http:"];
|
||||
this._headers = [];
|
||||
this._withCredentials = false;
|
||||
this._url = RemoteSettings.url;
|
||||
if (RemoteSettings.headers !== undefined)
|
||||
this.headers = RemoteSettings.headers;
|
||||
if (RemoteSettings.withCredentials !== undefined)
|
||||
this.withCredentials = RemoteSettings.withCredentials;
|
||||
}
|
||||
Object.defineProperty(RemoteSources.prototype, "url", {
|
||||
get: function () {
|
||||
return this._url;
|
||||
},
|
||||
set: function (url) {
|
||||
if (url.trim().length === 0)
|
||||
throw new Error(errors.remoteSourceNeedUrl);
|
||||
else {
|
||||
try {
|
||||
var checkUrl = new URL(url);
|
||||
if (this.allowedUrlProtocol.indexOf(checkUrl.protocol) === -1)
|
||||
throw new Error();
|
||||
}
|
||||
catch (e) {
|
||||
throw new Error(errors.remoteSourceUrlFail);
|
||||
}
|
||||
this._url = url.trim();
|
||||
}
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(RemoteSources.prototype, "headers", {
|
||||
get: function () {
|
||||
return this._headers;
|
||||
},
|
||||
set: function (headers) {
|
||||
var forbiddenHeadersNames = ["Accept-Charset", "Accept-Encoding", "Access-Control-Request-Headers", "Access-Control-Request-Method", "Connection", "Content-Length", "Cookie", "Cookie2", "Date", "DNT", "Expect", "Host", "Keep-Alive", "Origin", "Referer", "TE", "Trailer", "Transfer-Encoding", "Upgrade", "Via"];
|
||||
for (var _i = 0, headers_1 = headers; _i < headers_1.length; _i++) {
|
||||
var header = headers_1[_i];
|
||||
header.key = header.key.trim();
|
||||
if (header.key.startsWith("Sec-") || header.key.startsWith("Proxy-") || forbiddenHeadersNames.indexOf(header.key) !== -1)
|
||||
console.error(errors.remoteSourceHeaderIsUnallowed);
|
||||
else
|
||||
this._headers.push({ key: header.key, value: header.value.trim() });
|
||||
}
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(RemoteSources.prototype, "withCredentials", {
|
||||
get: function () {
|
||||
return this._withCredentials;
|
||||
},
|
||||
set: function (credentials) {
|
||||
this._withCredentials = credentials;
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
RemoteSources.prototype.getFetchSettings = function () {
|
||||
var headers = new Headers();
|
||||
if (this._headers !== undefined) {
|
||||
for (var _i = 0, _a = this._headers; _i < _a.length; _i++) {
|
||||
var header = _a[_i];
|
||||
headers.append(header.key, header.value);
|
||||
}
|
||||
}
|
||||
var credentials = (this._withCredentials) ? "include" : "omit";
|
||||
return { method: "GET", headers: headers, credentials: credentials };
|
||||
};
|
||||
return RemoteSources;
|
||||
}());
|
||||
export { RemoteSources };
|
||||
@ -1,52 +0,0 @@
|
||||
var errors = require("./errors.js");
|
||||
var Render = (function () {
|
||||
function Render(converter, settings) {
|
||||
if (settings === void 0) { settings = Render.defaultSettings; }
|
||||
this._converter = converter;
|
||||
this.settings = settings;
|
||||
}
|
||||
Render.prototype.rend2HTML = function (datas) {
|
||||
if (this._converter.fields === undefined)
|
||||
throw new Error(errors.renderNeedDatas);
|
||||
else {
|
||||
var datasHTML = this.settings.allBegining;
|
||||
if (this.settings.fieldsBegining !== undefined && this.settings.fieldDisplaying !== undefined && this.settings.fieldsEnding !== undefined) {
|
||||
datasHTML += this.settings.fieldsBegining;
|
||||
for (var _i = 0, _a = this._converter.fields; _i < _a.length; _i++) {
|
||||
var field = _a[_i];
|
||||
datasHTML += this.settings.fieldDisplaying.replace("#FIELDNAME", field);
|
||||
}
|
||||
datasHTML += this.settings.fieldsEnding;
|
||||
}
|
||||
datasHTML += this.settings.linesBegining;
|
||||
for (var _b = 0, datas_1 = datas; _b < datas_1.length; _b++) {
|
||||
var row = datas_1[_b];
|
||||
datasHTML += this.settings.lineBegining;
|
||||
for (var _c = 0, _d = this._converter.fields; _c < _d.length; _c++) {
|
||||
var field = _d[_c];
|
||||
if (row[field] !== undefined)
|
||||
datasHTML += this.settings.dataDisplaying.replace("#VALUE", row[field]).replace("#FIELDNAME", field);
|
||||
else
|
||||
datasHTML += this.settings.dataDisplaying.replace("#VALUE", "").replace("#FIELDNAME", field);
|
||||
}
|
||||
datasHTML += this.settings.lineEnding;
|
||||
}
|
||||
datasHTML += this.settings.linesEnding + this.settings.allEnding;
|
||||
return datasHTML;
|
||||
}
|
||||
};
|
||||
Render.defaultSettings = {
|
||||
allBegining: "<table>",
|
||||
allEnding: "</table>",
|
||||
fieldsBegining: "<thead><tr>",
|
||||
fieldsEnding: "</tr></thead>",
|
||||
fieldDisplaying: "<th>#FIELDNAME</th>",
|
||||
linesBegining: "<tbody>",
|
||||
linesEnding: "</tbody>",
|
||||
lineBegining: "<tr>",
|
||||
lineEnding: "</tr>",
|
||||
dataDisplaying: "<td>#VALUE</td>",
|
||||
};
|
||||
return Render;
|
||||
}());
|
||||
export { Render };
|
||||
@ -1,124 +0,0 @@
|
||||
var compare = require('natural-orderby').compare;
|
||||
var errors = require("./errors.js");
|
||||
import { FreeDatas2HTML } from "./freeDatas2HTML";
|
||||
var Selector = (function () {
|
||||
function Selector(converter, datasFieldNb, elt) {
|
||||
this._datasViewElt = { id: "", eltDOM: undefined };
|
||||
this.name = "";
|
||||
this.values = [];
|
||||
if (converter.fields === undefined || converter.datas.length === 0)
|
||||
throw new Error(errors.selectorNeedDatas);
|
||||
else if (!converter.checkFieldExist(Number(datasFieldNb)))
|
||||
throw new Error(errors.selectorFieldNotFound);
|
||||
else {
|
||||
this._datasViewElt = FreeDatas2HTML.checkInDOMById(elt);
|
||||
this._converter = converter;
|
||||
this._datasFieldNb = datasFieldNb;
|
||||
}
|
||||
}
|
||||
Object.defineProperty(Selector.prototype, "separator", {
|
||||
get: function () {
|
||||
return this._separator;
|
||||
},
|
||||
set: function (separator) {
|
||||
if (separator === "")
|
||||
this._separator = undefined;
|
||||
else
|
||||
this._separator = separator;
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(Selector.prototype, "datasViewElt", {
|
||||
get: function () {
|
||||
return this._datasViewElt;
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(Selector.prototype, "datasFieldNb", {
|
||||
get: function () {
|
||||
return this._datasFieldNb;
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Selector.prototype.selector2HTML = function () {
|
||||
if (this._converter === undefined || this._datasViewElt.eltDOM === undefined || this._datasFieldNb === undefined)
|
||||
throw new Error(errors.selector2HTMLFail);
|
||||
else {
|
||||
this.name = this._converter.fields[this._datasFieldNb];
|
||||
for (var _i = 0, _a = this._converter.datas; _i < _a.length; _i++) {
|
||||
var row = _a[_i];
|
||||
if (this._separator === undefined) {
|
||||
if (row[this.name] !== "" && this.values.indexOf(row[this.name]) === -1)
|
||||
this.values.push(row[this.name]);
|
||||
}
|
||||
else {
|
||||
var checkedValues = row[this.name].split(this._separator);
|
||||
for (var _b = 0, checkedValues_1 = checkedValues; _b < checkedValues_1.length; _b++) {
|
||||
var value = checkedValues_1[_b];
|
||||
if (value !== "" && this.values.indexOf(value) === -1)
|
||||
this.values.push(value);
|
||||
}
|
||||
}
|
||||
}
|
||||
if (this.values.length > 0) {
|
||||
if (this._converter.getSortingFunctionForField(this._datasFieldNb) !== undefined)
|
||||
this.values.sort(this._converter.getSortingFunctionForField(this._datasFieldNb).sort);
|
||||
else
|
||||
this.values.sort(compare());
|
||||
var selectorsHTML = "<label for='freeDatas2HTML_" + this._datasViewElt.id + "'>" + this.name + " : </label><select name='freeDatas2HTML_" + this._datasViewElt.id + "' id='freeDatas2HTML_" + this._datasViewElt.id + "'><option value='0'>----</option>";
|
||||
for (var i = 0; i < this.values.length; i++)
|
||||
selectorsHTML += "<option value='" + (i + 1) + "'>" + this.values[i] + "</option>";
|
||||
selectorsHTML += "</select>";
|
||||
this._datasViewElt.eltDOM.innerHTML = selectorsHTML;
|
||||
var selectElement = document.getElementById("freeDatas2HTML_" + this._datasViewElt.id), mySelector_1 = this;
|
||||
selectElement.addEventListener("change", function (e) {
|
||||
mySelector_1._converter.refreshView();
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
Selector.prototype.getSelectionnedId = function () {
|
||||
var selectElement = document.getElementById("freeDatas2HTML_" + this._datasViewElt.id);
|
||||
if (selectElement === undefined)
|
||||
return 0;
|
||||
else
|
||||
return parseInt(selectElement.value, 10);
|
||||
};
|
||||
Selector.prototype.dataIsOk = function (data) {
|
||||
if (this.name === undefined || this.name === "")
|
||||
throw new Error(errors.selectorCheckIsOkFail);
|
||||
var selectedValue = this.getSelectionnedId();
|
||||
if (selectedValue === 0)
|
||||
return true;
|
||||
else
|
||||
selectedValue = selectedValue - 1;
|
||||
if (this.values[selectedValue] === undefined)
|
||||
throw new Error(errors.selectorSelectedIndexNotFound);
|
||||
if (data[this.name] === undefined)
|
||||
return false;
|
||||
var selectedValueTxt = this.values[selectedValue];
|
||||
if (this._separator === undefined) {
|
||||
if (data[this.name] !== selectedValueTxt)
|
||||
return false;
|
||||
else
|
||||
return true;
|
||||
}
|
||||
else {
|
||||
var find = false;
|
||||
var checkedValues = data[this.name].split(this._separator);
|
||||
for (var _i = 0, checkedValues_2 = checkedValues; _i < checkedValues_2.length; _i++) {
|
||||
var value = checkedValues_2[_i];
|
||||
if (value === selectedValueTxt) {
|
||||
find = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
return find;
|
||||
}
|
||||
};
|
||||
return Selector;
|
||||
}());
|
||||
export { Selector };
|
||||
@ -1,68 +0,0 @@
|
||||
var compare = require('natural-orderby').compare;
|
||||
var errors = require("./errors.js");
|
||||
var SortingField = (function () {
|
||||
function SortingField(converter, datasFieldNb, fieldsDOMSelector) {
|
||||
if (fieldsDOMSelector === void 0) { fieldsDOMSelector = "th"; }
|
||||
this._order = undefined;
|
||||
if (converter.fields === undefined)
|
||||
throw new Error(errors.sortingFieldNeedDatas);
|
||||
else if (!converter.checkFieldExist(Number(datasFieldNb)))
|
||||
throw new Error(errors.sortingFieldFieldNotFound);
|
||||
else {
|
||||
var fields = document.querySelectorAll(fieldsDOMSelector);
|
||||
if (fields === undefined)
|
||||
throw new Error(errors.sortingFieldsNotInHTML);
|
||||
else if (fields.length !== converter.fields.length)
|
||||
throw new Error(errors.sortingFieldsNbFail);
|
||||
else {
|
||||
this._converter = converter;
|
||||
this._datasFieldNb = datasFieldNb;
|
||||
this._fieldsDOMSelector = fieldsDOMSelector;
|
||||
}
|
||||
}
|
||||
}
|
||||
Object.defineProperty(SortingField.prototype, "fieldsDOMSelector", {
|
||||
get: function () {
|
||||
return this._fieldsDOMSelector;
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(SortingField.prototype, "datasFieldNb", {
|
||||
get: function () {
|
||||
return this._datasFieldNb;
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(SortingField.prototype, "order", {
|
||||
get: function () {
|
||||
return this._order;
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
SortingField.prototype.field2HTML = function () {
|
||||
if (this._converter === undefined || this._fieldsDOMSelector === "" || this._datasFieldNb === undefined)
|
||||
throw new Error(errors.sortingField2HTMLFail);
|
||||
else {
|
||||
var fields = document.querySelectorAll(this._fieldsDOMSelector);
|
||||
var htmlContent = fields[this._datasFieldNb].innerHTML;
|
||||
htmlContent = "<a href='#freeDatas2HTMLSorting" + this._datasFieldNb + "' id='freeDatas2HTMLSorting" + this._datasFieldNb + "'>" + htmlContent + "</a>";
|
||||
fields[this._datasFieldNb].innerHTML = htmlContent;
|
||||
var sortingElement = document.getElementById("freeDatas2HTMLSorting" + this._datasFieldNb), field_1 = this;
|
||||
sortingElement.addEventListener("click", function (e) {
|
||||
e.preventDefault();
|
||||
var order = field_1._order;
|
||||
if (order === undefined || order === "desc")
|
||||
field_1._order = "asc";
|
||||
else
|
||||
field_1._order = "desc";
|
||||
field_1._converter.datasSortedField = field_1;
|
||||
field_1._converter.refreshView();
|
||||
});
|
||||
}
|
||||
};
|
||||
return SortingField;
|
||||
}());
|
||||
export { SortingField };
|
||||
100
src/demo/exampleWithCSV.ts
Normal file
100
src/demo/exampleWithCSV.ts
Normal file
@ -0,0 +1,100 @@
|
||||
import { FreeDatas2HTML, Pagination, Render, SearchEngine, Selector, SortingField } from "../FreeDatas2HTML";
|
||||
|
||||
const initialise = async () =>
|
||||
{
|
||||
try
|
||||
{
|
||||
// Fonction spécifique de classement utile pour les données du 4ième champs
|
||||
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;
|
||||
};
|
||||
|
||||
// Création d'un convertisseur parsant les données d'un fichier CSV "distant"
|
||||
let converter=new FreeDatas2HTML("CSV");
|
||||
converter.parser.setRemoteSource({ url:"http://localhost:8080/datas/elements-chimiques.csv" });
|
||||
await converter.run(); // parsage
|
||||
|
||||
// Adaptation du rendu suivant la taille de l'écran
|
||||
const myRender=new Render();
|
||||
if(window.innerWidth < 800)
|
||||
{
|
||||
myRender.settings=
|
||||
{
|
||||
allBegining:"<h4>Affichage petits écrans !</h4>",
|
||||
allEnding:"",
|
||||
linesBegining:"<ul>",
|
||||
linesEnding:"</ul>",
|
||||
lineBegining:"<li><ul>",
|
||||
lineEnding:"</ul></li>",
|
||||
dataDisplaying:"<li><b>#FIELDNAME :</b> #VALUE</li>",
|
||||
};
|
||||
converter.datasRender=myRender;
|
||||
}
|
||||
else
|
||||
{
|
||||
myRender.settings.allBegining="<table class='table-hover'>";
|
||||
converter.datasRender=myRender;
|
||||
}
|
||||
|
||||
// Ajout d'une fonction de classement spécifique
|
||||
converter.datasSortingFunctions=[{ datasFieldNb:4, sort:mySort }];
|
||||
|
||||
// Configuration de la pagination
|
||||
const pagination=new Pagination(converter, { id:"pages" }, "Page à afficher :");
|
||||
pagination.options={ displayElement: { id:"paginationOptions" }, values: [10,20,50,500] , name: "Choix de pagination :" };
|
||||
pagination.selectedValue=10;
|
||||
converter.pagination=pagination;
|
||||
pagination.options2HTML();
|
||||
|
||||
// Création d'outils permettant de filtrer les données des champs de données
|
||||
let filtre1=new Selector(converter, 3, { id:"filtre1"} );
|
||||
filtre1.filter2HTML();
|
||||
let filtre2=new Selector(converter, 4, { id:"filtre2"} );
|
||||
filtre2.filter2HTML();
|
||||
let filtre3=new Selector(converter, 5, { id:"filtre3"}, ",");
|
||||
filtre3.filter2HTML();
|
||||
|
||||
// + un moteur de recherche
|
||||
const mySearch=new SearchEngine(converter, { id:"search" }, [1,3,5]);
|
||||
mySearch.label="Qui cherche trouve ?";
|
||||
mySearch.btnTxt="Va chercher !";
|
||||
mySearch.automaticSearch=true;
|
||||
mySearch.nbCharsForSearch=2;
|
||||
mySearch.placeholder="Tapes en NB, chef !";
|
||||
mySearch.filter2HTML();
|
||||
// + Injection des filtres dans le convertisseur
|
||||
converter.datasFilters=[filtre1,filtre2,filtre3, mySearch];
|
||||
|
||||
// Ajout de champs permettant de classer les données
|
||||
// Uniquement avec un rendu tableau (grand écran), car entêtes de colonne nécessaires
|
||||
if(window.innerWidth >= 800)
|
||||
{
|
||||
let sortingField1=new SortingField(converter, 0);
|
||||
let sortingField2=new SortingField(converter, 1);
|
||||
let sortingField3=new SortingField(converter, 2);
|
||||
let sortingField4=new SortingField(converter, 4);
|
||||
converter.datasSortingFields=[sortingField1,sortingField2,sortingField3,sortingField4];
|
||||
}
|
||||
|
||||
// Affichage initial
|
||||
converter.datasViewElt={ id:"datas" };
|
||||
converter.datasCounterElt={ id:"compteur" };
|
||||
converter.refreshView();
|
||||
}
|
||||
catch(e)
|
||||
{
|
||||
console.error(e);
|
||||
if(document.getElementById("datas")!==null)
|
||||
document.getElementById("datas")!.innerHTML="<strong>Désolé, mais un problème technique empêche l'affichage des données.</strong>";
|
||||
}
|
||||
}
|
||||
initialise();
|
||||
66
src/demo/exampleWithHTML.ts
Normal file
66
src/demo/exampleWithHTML.ts
Normal file
@ -0,0 +1,66 @@
|
||||
import { FreeDatas2HTML, Pagination, Render, Selector, SortingField } from "../FreeDatas2HTML";
|
||||
|
||||
const initialise = async () =>
|
||||
{
|
||||
try
|
||||
{
|
||||
// Création d'un convertisseur parsant des données transmises en HTML
|
||||
let converter=new FreeDatas2HTML("HTML");
|
||||
await converter.run(); // parsage des données
|
||||
|
||||
// Adaptation du rendu suivant la taille de l'écran
|
||||
const myRender=new Render();
|
||||
if(window.innerWidth < 800)
|
||||
{
|
||||
myRender.settings=
|
||||
{
|
||||
allBegining:"<h4>Affichage petits écrans !</h4>",
|
||||
allEnding:"",
|
||||
linesBegining:"<ul>",
|
||||
linesEnding:"</ul>",
|
||||
lineBegining:"<li><ul>",
|
||||
lineEnding:"</ul></li>",
|
||||
dataDisplaying:"<li><b>#FIELDNAME :</b> #VALUE</li>",
|
||||
};
|
||||
converter.datasRender=myRender;
|
||||
}
|
||||
else
|
||||
{
|
||||
myRender.settings.allBegining="<table class='table-hover'>";
|
||||
converter.datasRender=myRender;
|
||||
}
|
||||
|
||||
// Configuration de la pagination
|
||||
const pagination=new Pagination(converter, { id:"pages" }, "Page à afficher :");
|
||||
pagination.options={ displayElement: { id:"paginationOptions" }, values: [15,30,50] , name: "Nombre de lignes par page :" };
|
||||
pagination.selectedValue=30;
|
||||
converter.pagination=pagination;
|
||||
pagination.options2HTML();
|
||||
|
||||
// Création d'un filtre :
|
||||
let filtre1=new Selector(converter, 3, { id:"filtre1"} );
|
||||
filtre1.filter2HTML();
|
||||
converter.datasFilters=[filtre1];
|
||||
|
||||
// Ajout de champs permettant de classer les données
|
||||
// Uniquement avec un rendu tableau (grand écran), car entêtes de colonne nécessaires
|
||||
if(window.innerWidth >= 800)
|
||||
{
|
||||
let sortingField1=new SortingField(converter, 2);
|
||||
let sortingField2=new SortingField(converter, 3);
|
||||
converter.datasSortingFields=[sortingField1,sortingField2];
|
||||
}
|
||||
|
||||
// Affichage initial
|
||||
converter.datasViewElt={ id:"datas" };
|
||||
converter.datasCounterElt={ id:"compteur" };
|
||||
converter.refreshView();
|
||||
}
|
||||
catch(e)
|
||||
{
|
||||
console.error(e);
|
||||
if(document.getElementById("datas")!==null)
|
||||
document.getElementById("datas")!.innerHTML="<strong>Désolé, mais un problème technique empêche l'affichage des données.</strong>";
|
||||
}
|
||||
}
|
||||
initialise();
|
||||
68
src/demo/exampleWithJSON.ts
Normal file
68
src/demo/exampleWithJSON.ts
Normal file
@ -0,0 +1,68 @@
|
||||
import { FreeDatas2HTML, Pagination, Render, Selector, SortingField } from "../FreeDatas2HTML";
|
||||
|
||||
const initialise = async () =>
|
||||
{
|
||||
try
|
||||
{
|
||||
// Création d'un convertisseur parsant des données transmises en JSON
|
||||
let converter=new FreeDatas2HTML("JSON");
|
||||
converter.parser.setRemoteSource({ url: "http://localhost:8080/datas/posts.json", withCredentials:true, headers: [{ key:"Authorization", value:"Token YWxhZGRpbjpvcGVuc2VzYW1l" }] });
|
||||
await converter.run(); // parsage des données
|
||||
|
||||
// Adaptation du rendu suivant la taille de l'écran
|
||||
const myRender=new Render();
|
||||
if(window.innerWidth < 800)
|
||||
{
|
||||
myRender.settings=
|
||||
{
|
||||
allBegining:"<h4>Affichage petits écrans !</h4>",
|
||||
allEnding:"",
|
||||
linesBegining:"<ul>",
|
||||
linesEnding:"</ul>",
|
||||
lineBegining:"<li><ul>",
|
||||
lineEnding:"</ul></li>",
|
||||
dataDisplaying:"<li><b>#FIELDNAME :</b> #VALUE</li>",
|
||||
};
|
||||
converter.datasRender=myRender;
|
||||
}
|
||||
else
|
||||
{
|
||||
myRender.settings.allBegining="<table class='table-hover'>";
|
||||
converter.datasRender=myRender;
|
||||
}
|
||||
|
||||
// Configuration de la pagination
|
||||
const pagination=new Pagination(converter, { id:"pages" }, "Page à afficher :");
|
||||
pagination.options={ displayElement: { id:"paginationOptions" }, values: [15,30,50,100] , name: "Nombre de lignes par page :" };
|
||||
pagination.selectedValue=15;
|
||||
converter.pagination=pagination;
|
||||
pagination.options2HTML();
|
||||
|
||||
// Ajout de champs permettant de classer les données
|
||||
// Uniquement avec un rendu tableau (grand écran), car entêtes de colonne nécessaires
|
||||
if(window.innerWidth >= 800)
|
||||
{
|
||||
let sortingField1=new SortingField(converter, 0);
|
||||
let sortingField2=new SortingField(converter, 1);
|
||||
let sortingField3=new SortingField(converter, 2);
|
||||
converter.datasSortingFields=[sortingField1,sortingField2,sortingField3];
|
||||
}
|
||||
|
||||
// Création d'un filtre par auteur :
|
||||
let filtre1=new Selector(converter, 0, { id:"filtre1"} );
|
||||
filtre1.filter2HTML();
|
||||
converter.datasFilters=[filtre1];
|
||||
|
||||
// Affichage initial
|
||||
converter.datasViewElt={ id:"datas" };
|
||||
converter.datasCounterElt={ id:"compteur" };
|
||||
converter.refreshView();
|
||||
}
|
||||
catch(e)
|
||||
{
|
||||
console.error(e);
|
||||
if(document.getElementById("datas")!==null)
|
||||
document.getElementById("datas")!.innerHTML="<strong>Désolé, mais un problème technique empêche l'affichage des données.</strong>";
|
||||
}
|
||||
}
|
||||
initialise();
|
||||
126
src/demo/exampleWithUserFile.ts
Normal file
126
src/demo/exampleWithUserFile.ts
Normal file
@ -0,0 +1,126 @@
|
||||
import { FreeDatas2HTML, Pagination, Render, SearchEngine, Selector, SortingField } from "../FreeDatas2HTML";
|
||||
|
||||
const initialise = () =>
|
||||
{
|
||||
try
|
||||
{
|
||||
const dataDisplayElt=document.getElementById("datas");
|
||||
const dataDisplayOptionsElt=document.getElementById("displayOptions");
|
||||
const myFile=document.getElementById("myFile") as HTMLInputElement;
|
||||
const myForm=document.getElementById("userSettings") as HTMLElement;
|
||||
const pagesElt=document.getElementById("pages") as HTMLElement;
|
||||
const paginationElt=document.getElementById("paginationOptions") as HTMLElement;
|
||||
const searchElt=document.getElementById("search") as HTMLElement;
|
||||
|
||||
if(dataDisplayElt === null || dataDisplayOptionsElt === null || myFile === null || myForm === null|| pagesElt === null|| paginationElt === null|| searchElt === null)
|
||||
throw new Error("Tous les éléments HTML nécessaires au fonctionnement n'ont pas été trouvés dans la page;");
|
||||
|
||||
const reInitialise= () =>
|
||||
{
|
||||
dataDisplayElt.innerHTML="";
|
||||
dataDisplayOptionsElt.innerHTML="";
|
||||
pagesElt.innerHTML="";
|
||||
paginationElt.innerHTML="";
|
||||
searchElt.innerHTML="";
|
||||
}
|
||||
|
||||
let converter : FreeDatas2HTML;
|
||||
const myRender=new Render();
|
||||
// Attention, l'élément affichant le compteur n'est pas initialement présent dans la page :
|
||||
myRender.settings.allBegining="<table class='table-hover'><caption>Nombre de résultats : <span id='counter'></span></caption>";
|
||||
|
||||
myFile.addEventListener("change", function(e)
|
||||
{
|
||||
reInitialise();
|
||||
converter=new FreeDatas2HTML("CSV");
|
||||
converter.datasRender=myRender;
|
||||
|
||||
const selectedFiles=myFile.files;
|
||||
if(selectedFiles !== null && selectedFiles.length === 1)
|
||||
{
|
||||
if(selectedFiles[0].type !== "text/csv")
|
||||
dataDisplayOptionsElt.innerHTML=`<p class='text-danger'>Le document que vous avez sélectionné ne semble pas être un fichier CSV valide.</p>`;
|
||||
else
|
||||
{
|
||||
const reader=new FileReader();
|
||||
reader.onload=async function(e)
|
||||
{
|
||||
converter.parser.datas2Parse=reader.result as string;
|
||||
await converter.run();
|
||||
let fieldsSelectorHTML=`<fieldset class="form-group"><legend>Quels champs souhaitez-vous afficher ?</legend>`;
|
||||
for(let i=0; i < converter.fields.length; i++)
|
||||
fieldsSelectorHTML+=`<label for="selectedField_${i}" class="paper-check"> <input type="checkbox" class="selectedFields" id="selectedField_${i}" name="selectedField_${i}" value=${i} checked> <span>${converter.fields[i]}</span></label>`;
|
||||
fieldsSelectorHTML+=`</fieldset>`;
|
||||
dataDisplayOptionsElt.innerHTML=fieldsSelectorHTML+`<button type="submit" class="btn-success">Valider</button>`;
|
||||
};
|
||||
reader.readAsText(selectedFiles[0]);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
myForm.addEventListener("submit", function(e)
|
||||
{
|
||||
e.preventDefault();
|
||||
dataDisplayElt.innerHTML="";
|
||||
let fields2Rend: number[]=[];
|
||||
let checkBox: HTMLInputElement;
|
||||
for(let i=0; i < converter.fields.length; i++)
|
||||
{
|
||||
checkBox=document.getElementById("selectedField_"+i) as HTMLInputElement;
|
||||
if(checkBox !== null)
|
||||
{
|
||||
if(checkBox.checked)
|
||||
fields2Rend.push(i);
|
||||
}
|
||||
}
|
||||
|
||||
if( fields2Rend.length === 0)
|
||||
dataDisplayElt.innerHTML=`<p class='text-danger'>Vous n'avez sélectionné aucun champ à afficher !</p>`;
|
||||
else
|
||||
{
|
||||
converter.fields2Rend=fields2Rend;
|
||||
converter.datasViewElt={ id:"datas" };
|
||||
|
||||
// + Un moteur de recherche :
|
||||
const mySearch=new SearchEngine(converter, { id:"search" });
|
||||
mySearch.label="Qui cherche trouve ?";
|
||||
mySearch.btnTxt="Va chercher !";
|
||||
mySearch.automaticSearch=true;
|
||||
mySearch.nbCharsForSearch=2;
|
||||
mySearch.placeholder="Saisir un moins 2 caractères";
|
||||
mySearch.filter2HTML();
|
||||
converter.datasFilters=[mySearch];
|
||||
|
||||
// + Pagination :
|
||||
const pagination=new Pagination(converter, { id:"pages" }, "Page à afficher :");
|
||||
pagination.options={ displayElement: { id:"paginationOptions" }, values: [10,20,50,500] , name: "Choix de pagination :" };
|
||||
pagination.selectedValue=10;
|
||||
converter.pagination=pagination;
|
||||
pagination.options2HTML();
|
||||
|
||||
// + Compteur :
|
||||
converter.datasCounterElt={ id:"counter" };
|
||||
|
||||
// +Toutes les colonnes affichées sont classables :
|
||||
let sortingField: SortingField;
|
||||
converter.datasSortingFields=[];
|
||||
for(let i=0; i < converter.fields2Rend.length; i++)
|
||||
{
|
||||
sortingField=new SortingField(converter, converter.fields2Rend[i]);
|
||||
converter.datasSortingFields.push(sortingField);
|
||||
}
|
||||
|
||||
// Actualisation de l'affichage
|
||||
converter.refreshView();
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
catch(e)
|
||||
{
|
||||
console.error(e);
|
||||
document.getElementById("datas")!.innerHTML=`<strong>Désolé, mais un problème imprévu empêche l'affichage des données.</strong>`;
|
||||
}
|
||||
}
|
||||
initialise();
|
||||
@ -11,6 +11,6 @@
|
||||
"forceConsistentCasingInFileNames": true,
|
||||
"skipLibCheck": true,
|
||||
},
|
||||
"include": ["src/*.ts"],
|
||||
"include": ["src/*", "src/demo/*"],
|
||||
"exclude": ["src/build"]
|
||||
}
|
||||
@ -2,13 +2,13 @@ const path = require('path');
|
||||
|
||||
module.exports =
|
||||
{
|
||||
mode: "development",
|
||||
mode: "production",
|
||||
entry:
|
||||
{
|
||||
exampleWithCSV: "./src/exampleWithCSV.ts",
|
||||
exampleWithHTML: "./src/exampleWithHTML.ts",
|
||||
exampleWithJSON: "./src/exampleWithJSON.ts",
|
||||
exampleWithUserFile: "./src/exampleWithUserFile.ts"
|
||||
exampleWithCSV: "./src/demo/exampleWithCSV.ts",
|
||||
exampleWithHTML: "./src/demo/exampleWithHTML.ts",
|
||||
exampleWithJSON: "./src/demo/exampleWithJSON.ts",
|
||||
exampleWithUserFile: "./src/demo/exampleWithUserFile.ts"
|
||||
},
|
||||
output:
|
||||
{
|
||||
|
||||
Loading…
Reference in New Issue
Block a user