SPIP/gamutable
SPIP/gamutable
4
0
Fork 0
Code Issues 2 Pull requests Projects Releases Wiki Activity

Utilisation de la lib localforage pour pouvoir stocker en indexedDB et

Browse source 
en async
This commit is contained in:
Christophe 2021-10-13 21:49:21 +02:00
parent c2a1cc7c0b
commit 41dd6d79d7
5 changed files with 2918 additions and 76 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
inclure/gamutable.html
View file

@ -55,11 +55,13 @@ var nomBlocAjaxReload = '';
[(#CONFIG{gamutable/version_js}|=={dev}|?{ [(#CONFIG{gamutable/version_js}|=={dev}|?{
<script src="[(#CHEMIN{js/vue.js}|timestamp)]" type="text/javascript"></script> <script src="[(#CHEMIN{js/vue.js}|timestamp)]" type="text/javascript"></script>
<script src="[(#CHEMIN{js/localforage.js}|timestamp)]" type="text/javascript"></script>
<script src="[(#CHEMIN{js/papaparse.js}|timestamp)]" type="text/javascript"></script> <script src="[(#CHEMIN{js/papaparse.js}|timestamp)]" type="text/javascript"></script>
<script src="[(#CHEMIN{js/vue-next-select.js}|timestamp)]" type="text/javascript"></script> <script src="[(#CHEMIN{js/vue-next-select.js}|timestamp)]" type="text/javascript"></script>
<script src="[(#CHEMIN{js/gamutable.js}|timestamp)]" type="text/javascript"></script> <script src="[(#CHEMIN{js/gamutable.js}|timestamp)]" type="text/javascript"></script>
, ,
<script src="[(#CHEMIN{js/vue.min.js}|timestamp)]" type="text/javascript"></script> <script src="[(#CHEMIN{js/vue.min.js}|timestamp)]" type="text/javascript"></script>
<script src="[(#CHEMIN{js/localforage.min.js}|timestamp)]" type="text/javascript"></script>
<script src="[(#CHEMIN{js/papaparse.min.js}|timestamp)]" type="text/javascript"></script> <script src="[(#CHEMIN{js/papaparse.min.js}|timestamp)]" type="text/javascript"></script>
<script src="[(#CHEMIN{js/vue-next-select.js}|timestamp)]" type="text/javascript"></script> <script src="[(#CHEMIN{js/vue-next-select.js}|timestamp)]" type="text/javascript"></script>
<script src="[(#CHEMIN{js/gamutable.js}|compacte|timestamp)]" type="text/javascript"></script> <script src="[(#CHEMIN{js/gamutable.js}|compacte|timestamp)]" type="text/javascript"></script>

66
js/gamutable.es6.js
View file

@ -1,6 +1,4 @@
jQuery(function () { jQuery(function () {
// pour les #URL_ACTION_AUTEUR
// il faut ajouter une class : url_action
$('#app').on('click', '.url_action', function (e) { $('#app').on('click', '.url_action', function (e) {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
@ -84,6 +82,7 @@ function recupJson(d) {
try { try {
return JSON.parse(d); return JSON.parse(d);
} catch (e) { } catch (e) {
console.log('erreur recupJson ', e);
return false; return false;
} }
} }
@ -319,18 +318,16 @@ let monTableau = {
}, },
table() { table() {
let $table = []; let $table = [];
$table = [ let $header = {
...[
{
header: this.header, header: this.header,
crayons: this.crayons, crayons: this.crayons,
classes: this.classes, classes: this.classes,
filtreCol: this.filtreColType, filtreCol: this.filtreColType,
}, };
], localStorage.setItem('header_' + this.nameLocalStorage, JSON.stringify($header));
...this.table,
]; $table = this.table;
localStorage.setItem(this.nameLocalStorage, JSON.stringify($table)); localforage.setItem(this.nameLocalStorage, JSON.stringify($table));
}, },
tableau() { tableau() {
// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ // ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
@ -374,14 +371,9 @@ let monTableau = {
if (parseInt(id) > 0) { if (parseInt(id) > 0) {
url += '&id=' + id; url += '&id=' + id;
} else { } else {
let data = localStorage.getItem(this.nameLocalStorage); let config = localStorage.getItem('header_' + this.nameLocalStorage);
data = recupJson(data); config = recupJson(config);
if (!data) { if (config && config.header !== undefined) {
localStorage.removeItem(this.nameLocalStorage);
data = [];
}
if (data && data.length) {
let config = data.shift();
this.header = config.header; this.header = config.header;
if (config.crayons !== undefined) { if (config.crayons !== undefined) {
this.crayons = config.crayons; this.crayons = config.crayons;
@ -389,27 +381,42 @@ let monTableau = {
if (config.classes !== undefined) { if (config.classes !== undefined) {
this.classes = config.classes; this.classes = config.classes;
} }
this.table = data; let filtreCol = [];
if (config.filtreCol !== undefined) { if (config.filtreCol !== undefined) {
this.filtreColType = config.filtreCol; filtreCol = config.filtreCol;
Object.keys(this.filtreColType).forEach((col) => { }
let that = this;
localforage
.getItem(that.nameLocalStorage)
.then(function (data) {
data = recupJson(data);
if (data && data.length) {
that.table = data;
if (filtreCol !== undefined) {
that.filtreColType = filtreCol;
Object.keys(that.filtreColType).forEach((col) => {
let Tval = []; let Tval = [];
// let Tval = ['']; // let Tval = [''];
this.table.forEach((t) => { that.table.forEach((t) => {
let valCol = t[this.champ_search][col]; let valCol = t[that.champ_search][col];
if (Tval.indexOf(valCol) === -1) { if (Tval.indexOf(valCol) === -1) {
Tval.push(valCol); Tval.push(valCol);
} }
}); });
this.filtreCol.push(col); that.filtreCol.push(col);
this.filtreColVal[col] = Tval; that.filtreColVal[col] = Tval;
this.filtreColSelected[col] = []; that.filtreColSelected[col] = [];
}); });
} }
if (data.length && data[0].search) { if (data[0].search) {
this.champ_search = 'search'; that.champ_search = 'search';
} }
console.log('fin chargement localStorage'); console.log('fin chargement local forage ');
}
})
.catch(function (err) {
console.log(err);
});
} }
} }
fetch(url) fetch(url)
@ -439,6 +446,7 @@ let monTableau = {
} }
if (config.filtreCol !== undefined) { if (config.filtreCol !== undefined) {
this.filtreColType = config.filtreCol; this.filtreColType = config.filtreCol;
this.filtreCol = [];
Object.keys(this.filtreColType).forEach((col) => { Object.keys(this.filtreColType).forEach((col) => {
// let Tval = ['']; // let Tval = [''];
let Tval = []; let Tval = [];

63
js/gamutable.js
View file

@ -23,8 +23,6 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
jQuery(function () { jQuery(function () {
// pour les #URL_ACTION_AUTEUR
// il faut ajouter une class : url_action
$('#app').on('click', '.url_action', function (e) { $('#app').on('click', '.url_action', function (e) {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
@ -125,6 +123,7 @@ function recupJson(d) {
try { try {
return JSON.parse(d); return JSON.parse(d);
} catch (e) { } catch (e) {
console.log('erreur recupJson ', e);
return false; return false;
} }
} }
@ -367,13 +366,15 @@ var monTableau = {
}, },
table: function table() { table: function table() {
var $table = []; var $table = [];
$table = [{ var $header = {
header: this.header, header: this.header,
crayons: this.crayons, crayons: this.crayons,
classes: this.classes, classes: this.classes,
filtreCol: this.filtreColType filtreCol: this.filtreColType
}].concat(_toConsumableArray(this.table)); };
localStorage.setItem(this.nameLocalStorage, JSON.stringify($table)); localStorage.setItem('header_' + this.nameLocalStorage, JSON.stringify($header));
$table = this.table;
localforage.setItem(this.nameLocalStorage, JSON.stringify($table));
}, },
tableau: function tableau() { tableau: function tableau() {
var _this3 = this; var _this3 = this;
@ -426,16 +427,10 @@ var monTableau = {
if (parseInt(id) > 0) { if (parseInt(id) > 0) {
url += '&id=' + id; url += '&id=' + id;
} else { } else {
var data = localStorage.getItem(this.nameLocalStorage); var config = localStorage.getItem('header_' + this.nameLocalStorage);
data = recupJson(data); config = recupJson(config);
if (!data) { if (config && config.header !== undefined) {
localStorage.removeItem(this.nameLocalStorage);
data = [];
}
if (data && data.length) {
var config = data.shift();
this.header = config.header; this.header = config.header;
if (config.crayons !== undefined) { if (config.crayons !== undefined) {
@ -446,33 +441,46 @@ var monTableau = {
this.classes = config.classes; this.classes = config.classes;
} }
this.table = data; var filtreCol = [];
if (config.filtreCol !== undefined) { if (config.filtreCol !== undefined) {
this.filtreColType = config.filtreCol; filtreCol = config.filtreCol;
Object.keys(this.filtreColType).forEach(function (col) { }
var that = this;
localforage.getItem(that.nameLocalStorage).then(function (data) {
data = recupJson(data);
if (data && data.length) {
that.table = data;
if (filtreCol !== undefined) {
that.filtreColType = filtreCol;
Object.keys(that.filtreColType).forEach(function (col) {
var Tval = []; // let Tval = ['']; var Tval = []; // let Tval = [''];
_this4.table.forEach(function (t) { that.table.forEach(function (t) {
var valCol = t[_this4.champ_search][col]; var valCol = t[that.champ_search][col];
if (Tval.indexOf(valCol) === -1) { if (Tval.indexOf(valCol) === -1) {
Tval.push(valCol); Tval.push(valCol);
} }
}); });
that.filtreCol.push(col);
_this4.filtreCol.push(col); that.filtreColVal[col] = Tval;
that.filtreColSelected[col] = [];
_this4.filtreColVal[col] = Tval;
_this4.filtreColSelected[col] = [];
}); });
} }
if (data.length && data[0].search) { if (data[0].search) {
this.champ_search = 'search'; that.champ_search = 'search';
} }
console.log('fin chargement localStorage'); console.log('fin chargement local forage ');
}
}).catch(function (err) {
console.log(err);
});
} }
} }
@ -509,6 +517,7 @@ var monTableau = {
if (config.filtreCol !== undefined) { if (config.filtreCol !== undefined) {
_this4.filtreColType = config.filtreCol; _this4.filtreColType = config.filtreCol;
_this4.filtreCol = [];
Object.keys(_this4.filtreColType).forEach(function (col) { Object.keys(_this4.filtreColType).forEach(function (col) {
// let Tval = ['']; // let Tval = [''];
var Tval = []; var Tval = [];

2816
js/localforage.js Normal file
View file

File diff suppressed because it is too large Load diff

7
localforage.min.js vendored Normal file
View file

File diff suppressed because one or more lines are too long