NxTIC/js/includes/input-phone-matrice.js

211 lines
5.5 KiB
JavaScript
Raw Normal View History

/* [0] Constructeur -> définit le conteneur et le bouton d'ajout
=========================================================*/
var inputPhoneMatrice = function(container){
this.container = container;
};
/* [1] Attributs
=========================================================*/
inputPhoneMatrice.prototype = {
container: this.container // Conteneur de la matrice
};
/* [2] Gestion de l'enregistrement de la matrice
=========================================================*/
inputPhoneMatrice.prototype.fieldsToStorage = function(){
2016-10-10 08:58:44 +00:00
console.group('[phone.matrice] fields to storage');
// {1} On initialise notre deflater pour récupérer les valeurs //
var deflater = new FormDeflater(this.container, ['input'], ['data-name']);
// {2} On extrait les données //
var deflated = deflater.deflate();
// On crée le hash
var deflatedHash = crc32(JSON.stringify(deflated));
// console.log(deflated);
/* (3) On crée l'objet et on le remplit avec les relations */
var obj = {};
for( var i in deflated )
// {1} Si c'est un tableau de sujets //
if( deflated[i] instanceof Array ){
// Pour chacune des différentes relations, on ajoute si TRUE
for( var O in deflated[i] ){
if( obj[i] == null )
obj[i] = [];
obj[i].push( parseInt(deflated[i][O]) );
}
// {2} Si il n'y O qu'un sujet //
}else if( deflated[i] !== null ){
if( obj[i] == null )
obj[i] = [];
obj[i].push( parseInt(deflated[i]) );
}
lsi.set( 'p_matrice', 0, obj );
// Objet de la forme
//
// idA: [idV, idW], # O connait V et W (et réciproquement)
// idB: [idX, idY], # B connait X et Y (et réciproquement)
// ...
//
2016-10-10 08:58:44 +00:00
console.groupEnd();
};
/* [4] Gestion de l'affichage depuis le 'localStorage'
=========================================================*/
inputPhoneMatrice.prototype.storageToFields = function(){
2016-10-10 08:58:44 +00:00
console.group('[phone.matrice] storage to fields');
/* (1) On récupère la liste des contacts à mettre dans la matrice */
// On récupère les fiches
var ficheData = lsi.export('p_fiches');
// On récupère les données de la matrice
var matriceData = lsi.get('p_matrice', 0);
2016-05-24 09:51:46 +00:00
// On récupère les contacts pour afficher les noms/prénoms
var contactData = lsi.export('p_contacts');
2016-05-24 09:51:46 +00:00
// Contiendra les UID des contacts à mettre dans la matrice
var contacts = [];
// Pour chaque fiche, on ajoute l'uid du contact s'il n'est pas déja ajouté
for( var f in ficheData )
if( contacts.indexOf( ficheData[f].contact ) == -1 )
contacts.push( ficheData[f].contact );
/* (2) On construit le HTML de la matrice */
// Contiendra le HTML
var matrice_html = ["<table class='line'>"];
// {1} Pour chaque ligne //
for( var L = 0 ; L < contacts.length ; L++ ){
var conA = contactData[L];
matrice_html.push( '<tr>' );
if( L > 0 ){ // Noms sur la première ligne (abscisses)
matrice_html.push( '<td style="text-align: right;">' );
matrice_html.push( !isNaN(conA.existing) ? lsi.get('p_friends', conA.existing).name : conA.username );
matrice_html.push( '</td>' );
}else // Sinon,
matrice_html.push( '<td></td>' );
// {2} Pour chaque case //
for( var C = 0 ; C < contacts.length ; C++ ){ if( C < contacts.length-1 ){
var conC = contactData[C];
// {3} Première colonne -> Intitulé des ordonnées //
if( L == 0 ){
matrice_html.push( '<td>' );
matrice_html.push( '<span style="writing-mode: vertical-lr; text-align: right;">' );
matrice_html.push( !isNaN(conC.existing) ? lsi.get('p_friends', conC.existing).name : conC.username );
matrice_html.push( '</span>' );
// {4} Valeurs des relations (boutons) //
}else if( C < L ){
matrice_html.push( "<td>" );
matrice_html.push( "<input type='checkbox' name='matrice_"+conA.uid+"_"+conC.uid+"' data-name='"+conA.uid+"' value='"+conC.uid+"' id='p_matrice_"+conA.uid+"_"+conC.uid+"'" );
// Si la relation existe, on active le bouton
if( matriceData[L] != null && matriceData[L].indexOf(C) > -1 )
matrice_html.push( " checked" );
matrice_html.push( " >" );
matrice_html.push( "<label for='p_matrice_"+conA.uid+"_"+conC.uid+"'></label>" );
// {5} Cases vides (moitié supérieure droite) //
}else
matrice_html.push( "<td class='hidden'>" );
matrice_html.push( '</td>' );
}}
matrice_html.push( '</tr>' );
}
matrice_html.push( '</table>' );
/* (3) On affiche la matrice */
this.container.innerHTML = matrice_html.join('');
console.groupEnd();
};
/* [9] Point d'amorçage de la gestion des contacts
=========================================================*/
inputPhoneMatrice.prototype.attach = function(){
2016-10-10 08:58:44 +00:00
console.group('[phone.matrice] attaching events');
/* (1) On initialise le jeu de données */
lsi.createDataset('p_matrice');
/* (2) On charge les mini fiches depuis la mémoire ('localStorage') */
this.storageToFields();
/* (3) On enregistre la matrice à chaque modification */
var ptr = this;
this.container.addEventListener('click', function(e){
2016-06-07 09:06:59 +00:00
ptr.fieldsToStorage();
2016-06-07 09:06:59 +00:00
setTimeout(function(){ ptr.storageToFields(); }, 500);
}, false);
2016-10-10 08:58:44 +00:00
console.groupEnd();
2016-05-24 07:01:16 +00:00
};
2016-05-24 09:51:46 +00:00
inputPhoneMatrice.prototype.parseGrid = function(){
/* (1) On récupère la matrice des éléments de la grille */
var gridElements = $$('.matrice-panel input[data-name][value]');
for( var i in gridElements ){
if( !(gridElements[i] instanceof Element) )
continue;
var col = gridElements[i].getData('name');
var row = gridElements[i].value;
if( !(this.sGrid[col] instanceof Array) )
this.sGrid[col] = [];
this.sGrid[col][row] = gridElements[i];
}
};