diff --git a/js/lib/form-builder-min.js b/js/lib/form-builder-min.js index 54d40e8..893cb04 100644 --- a/js/lib/form-builder-min.js +++ b/js/lib/form-builder-min.js @@ -1,7 +1,9 @@ -var FormBuilder=function(a,c){this.parent_element=a;this.form_object=c};FormBuilder.prototype={form_object:this.form_object,defs_object:{},parent_element:this.parent_element,built_form:null};FormBuilder.regex={reg_in_key:/^\/\^(.+)\$\/$/,reg_out_val:/\{(\$[1-9])\}/,pri_out_val:/\{([a-z-]+)\}/g,pri_in_key:/^\$([a-z-]+)$/,arr_out_set:/^\{\{([a-z-]+)\}\}$/,arr_out_val:/\{([a-z-]+)\.([a-z-]+)\}/g,arr_in_key:/^\$\$([a-z-]+)$/}; -FormBuilder.spread_attr=["children","next_nodes","prev_nodes","attributes","node_link"];FormBuilder.allowed_attr="node node_type next_nodes prev_nodes attributes children text repeat".split(" ");FormBuilder.prototype.add_definition=function(a){for(var c in a)this.defs_object[c]=a[c]};FormBuilder.prototype.build=function(a){a=null==a?{}:a;this.built_form=FormBuilder.formatFormObject(this.form_object,this.defs_object);this.built_form=FormBuilder.replaceStatements(this.form_object,a,this.defs_object)}; -FormBuilder.formatFormObject=function(a,c){if(a.hasOwnProperty("children"))for(var g in a.children)a.children[g].parent=a,FormBuilder.formatFormObject(a.children[g],c);return a};FormBuilder.fetchNodeDefinition=function(a,c){var g,b;r=FormBuilder.regex.reg_in_key;if("undefined"!=typeof c&&c.hasOwnProperty(a))return{def:c[a]};for(g in c)if(r.test(g)&&(b=new RegExp(g.slice(1,-1)),b.test(a))){matches={};for(b=1;bb;b++)matches["$"+b]=RegExp["$"+b];return{def:c[g],scope:matches}}return{}}; -FormBuilder.replaceStatements=function(a,c,g){a=a instanceof Object?a:{};c=c instanceof Object?JSON.parse(JSON.stringify(c)):{};var b,f,e;if(a.hasOwnProperty("scope")&&a.scope instanceof Object)for(b in a.scope)c[b]=a.scope[b];if(a.hasOwnProperty("node")&&"string"==typeof a.node&&(f=FormBuilder.fetchNodeDefinition(a.node,g),f.hasOwnProperty("def")&&(a.node_link=JSON.parse(JSON.stringify(f.def)),f.hasOwnProperty("scope"))))for(b in f.scope)c[b]=f.scope[b];for(b in a)if("string"==typeof a[b]){f=FormBuilder.regex.arr_out_set; -var d=[];(e=f.exec(a[b]))&&d.push(e[1]);for(e in d)c.hasOwnProperty(d[e])||(c[d[e]]=[]),a[b]=c[d[e]];if(!(0=f.lastIndex);)lasti=f.lastIndex,d.push(e[1]);for(e in d)c.hasOwnProperty(d[e])||(c[d[e]]=""), -f=new RegExp("{\\$"+d[e][1]+"}","g"),a[b]=a[b].replace(f,c[d[e]]);if(!(0b;b++)matches["$"+b]=RegExp["$"+b];return{def:c[h],scope:matches}}return{}}; +FormBuilder.replaceStatements=function(a,c,h){a=a instanceof Object?a:{};c=c instanceof Object?JSON.parse(JSON.stringify(c)):{};var b,e,d,f,k;if(a.hasOwnProperty("scope")&&a.scope instanceof Object)for(b in a.scope)c[b]=a.scope[b];if(a.hasOwnProperty("node")&&"string"==typeof a.node&&(e=FormBuilder.fetchNodeDefinition(a.node,h),e.hasOwnProperty("def")&&(a.node_link=JSON.parse(JSON.stringify(e.def)),e.hasOwnProperty("scope"))))for(b in e.scope)c[b]=e.scope[b];for(b in a)if("string"==typeof a[b]){e= +FormBuilder.regex.arr_out_set;f=[];(d=e.exec(a[b]))&&f.push(d[1]);for(d in f)c.hasOwnProperty(f[d])||(c[f[d]]=[]),a[b]=c[f[d]];if(!(0=e.lastIndex);)f=e.lastIndex,g.push(d[1]);for(d in g)c.hasOwnProperty(g[d])||(c[g[d]]=""),e=new RegExp("{\\$"+g[d][1]+"}","g"),a[b]=a[b].replace(e,c[g[d]]);if(!(0 INITIALISE UNE L'INSTANCE * -* @parent_element Element qui contiendra le formulaire * @form_object Objet définissant le formulaire * */ -var FormBuilder = function(parent_element, form_object){ - /* (1) On définit le parent */ - this.parent_element = parent_element; +var FormBuilder = function(form_object){ - /* (2) On définit le formulaire (sous forme de description formelle) */ + /* On définit le formulaire (sous forme de description formelle) */ this.form_object = form_object; + }; @@ -27,8 +61,9 @@ var FormBuilder = function(parent_element, form_object){ FormBuilder.prototype = { form_object: this.form_object, // objet permettant la construction du formulaire defs_object: {}, // objet des définitions des éléments - parent_element: this.parent_element, // element qui contiendra le formulaire - built_form: null // Element correspondant au formulaire construit + parent_element: null, // element qui contiendra le formulaire + built_form: null, // Object correspondant au formulaire construit + root_element: null // Element correspondant à l'objet construit }; @@ -103,19 +138,42 @@ FormBuilder.prototype.build = function(scope){ ==================================================================*/ scope = (scope == null) ? {} : scope; - /* [1] On formatte l'objet + /* [1] On clone l'object + =========================================================*/ + this.built_form = JSON.parse(JSON.stringify(this.form_object)); + + /* [2] On formatte l'objet ==================================================================*/ // - Ajout des références children[n].parent vers élément parent // - Ajout des références element.node_link vers définition (en fonction de element.node) - this.built_form = FormBuilder.formatFormObject(this.form_object, this.defs_object); + this.built_form = FormBuilder.formatFormObject(this.built_form, this.defs_object); - /* [2] On remplace les valeurs + /* [3] On remplace les valeurs ==================================================================*/ - this.built_form = FormBuilder.replaceStatements(this.form_object, scope, this.defs_object); + this.built_form = FormBuilder.replaceStatements(this.built_form, scope, this.defs_object); }; +/* CONSTRUIT LES DOM ASSOCIE A L'OBJET CONSTRUIT +* +* @parent Element auquel rattacher le formulaire +* +*/ +FormBuilder.prototype.attach = function(parent){ + /* [0] Initialisation + =========================================================*/ + /* (1) Gestion du paramètre @parent */ + if( !(parent instanceof Element) && this.parent_element == null ) + return false; + + this.parent_element = (parent instanceof Element) ? parent : this.parent_element; + + + /* [1] Chapter Title + =========================================================*/ + +} /************************************************/ @@ -239,7 +297,7 @@ FormBuilder.replaceStatements = function(object, scope, definitions){ scope = (scope instanceof Object) ? JSON.parse(JSON.stringify(scope)) : {}; /* (2) Variables */ - var key, r, tmpr, m, found; + var key, r, tmp, m, found, lasti, parts; /* (3) On récupère le scope s'il est dans l'attribut 'scope' */ if( object.hasOwnProperty('scope') && object.scope instanceof Object ) @@ -317,21 +375,28 @@ FormBuilder.replaceStatements = function(object, scope, definitions){ /* (1.2) Tant que ça match */ while( (m=r.exec(object[key])) !== null ) - m_pri.push( m[1] ); + m_pri.push( m ); /* (1.3) Pour chaque match */ + lasti = 0, parts = []; for( m in m_pri ){ - // {1} Si la var n'est pas dans le scope // - if( !scope.hasOwnProperty(m_pri[m]) ) - scope[m_pri[m]] = ''; // on met une chaine vide - // {2} on remplace toutes les occurences par la valeur // - tmpr = new RegExp( "\{"+m_pri[m]+"\}", 'g' ); - object[key] = object[key].replace(tmpr, scope[m_pri[m]]); + // {1} On construit les valeurs pour le 'string-builder' // + parts.push( object[key].substring(lasti, m_pri[m].index) ); + // {2} Sa la valeur n'existe pas dans le scope, on la crée // + tmp = object[key].substring(m_pri[m].index+1, m_pri[m].index+m_pri[m][0].length-1); + + if( !scope.hasOwnProperty(tmp) ) + parts.push( scope[tmp] ); + + lasti = m_pri[m].index + m_pri[m][0].length; + + // object[key] = object[key].replace(tmp, scope[m_pri[m]]); // console.log('pri', m_pri[m], scope[m_pri[m]]); - } + // On met la fonction à amorcer pour construire la valeur + object[key] = FormBuilder.buildString(parts); /* (1.4) Si on a trouvé qqch, on passe à la clé suivante */ if( m_pri.length > 0 ) @@ -362,8 +427,8 @@ FormBuilder.replaceStatements = function(object, scope, definitions){ scope[m_reg[m]] = ''; // on met une chaine vide // {2} on remplace toutes les occurences par la valeur // - tmpr = new RegExp( "\{\\$"+m_reg[m][1]+"\}", 'g' ); - object[key] = object[key].replace(tmpr, scope[m_reg[m]]); + tmp = new RegExp( "\{\\$"+m_reg[m][1]+"\}", 'g' ); + object[key] = object[key].replace(tmp, scope[m_reg[m]]); // console.log('reg', m_reg[m], scope); @@ -392,8 +457,8 @@ FormBuilder.replaceStatements = function(object, scope, definitions){ scope[m_aval[m]] = ''; // on met une chaine vide // {2} on remplace toutes les occurences par la valeur // - tmpr = new RegExp( "/\{"+m_aval[m]+"\}/", 'g' ); - object[key].replace(tmpr, scope[m_aval[m]]); + tmp = new RegExp( "/\{"+m_aval[m]+"\}/", 'g' ); + object[key].replace(tmp, scope[m_aval[m]]); } @@ -452,3 +517,41 @@ FormBuilder.replaceStatements = function(object, scope, definitions){ ==================================================================*/ return object; }; + + +/* CONSTRUIT UNE CHAINE A PARTIR DE SES PARTIES (VARIABLES OU TEXTE BRUT) +* +* @parts Tableau contenant les parties +* +* @return built Chaine recomposée +* +*/ +FormBuilder.buildString = function(parts){ + /* [0] Initialisation + =========================================================*/ + /* (1) Variables */ + var i; + var built = ""; + + + /* [1] On remplace par les valeurs + =========================================================*/ + for( i in parts ){ + console.log(parts[i]); + + /* (1) Si , on ajoute la valeur */ + if( parts[i] instanceof refObject ) + built += '' + parts[i].get(); + + /* (2) Sinon, on ajoute simplement */ + else + built += '' + parts[i].toString(); + + } + + + /* [2] On retourne le résultat + =========================================================*/ + return built; + +}; diff --git a/js/lib/form-builder/main-min.js b/js/lib/form-builder/main-min.js index 205d7b6..2b1f893 100644 --- a/js/lib/form-builder/main-min.js +++ b/js/lib/form-builder/main-min.js @@ -1,4 +1,4 @@ document.body.innerHTML="";"use strict"; var default_definition={input:{node_type:"input"},"/^h([1-6])$/":{node_type:"h{$1}"},br:{node_type:"br"},option:{node_type:"option"},select:{node_type:"select"},span:{node_type:"span"}},custom_definition={"/^input.([a-z]+)$/":{node:"input",attributes:{type:"{$1}","data-name":"{name}",value:"{value}",placeholder:"{placeholder}"},next_nodes:[{node:"br"}]},"custom-select":{node:"span",attributes:{"class":"select-container nobold"},children:[{node:"select",attributes:{"data-name":"{name}"},children:[{node:"option", attribute:{value:"{options.value}"},text:"{options.value}",repeat:"{{options}}"}]}],next_nodes:[{node:"br"}]}},form={node:"h4",attributes:{"data-icon":"o","class":"new-contact color2"},children:[{node:"input.hidden",$name:"uid",$value:"{uid}"},{node:"input.hidden",$name:"call",$value:"{call}"},{node:"input.hidden",$name:"sms",$value:"{sms}"},{node:"input.hidden",$name:"countcall",$value:"{countcall}"},{node:"input.hidden",$name:"countsms",$value:"{countsms}"},{node:"input.hidden",$name:"total",$value:"{countcall} calls + {countsms} sms to {number}"}, -{node:"input.text",$name:"number",$value:"{number}"},{node:"custom-select",$name:"existing",$$options:"{{options}}"}]},fb=new FormBuilder(document.body,form);fb.add_definition(default_definition);fb.add_definition(custom_definition);fb.build({uid:1,call:2,sms:3,countcall:4,countsms:5,number:"01 02 03 04 05",options:["a","b","c","d"]}); +{node:"input.text",$name:"number",$value:"{number}"},{node:"custom-select",$name:"existing",$$options:"{{options}}"}]},fb=new FormBuilder(document.body,form);fb.add_definition(default_definition);fb.add_definition(custom_definition);fb.build({uid:1,call:2,sms:3,countcall:4,countsms:5,number:"01 02 03 04 05",options:["a","b","c","d"]});console.log(fb.built_form); diff --git a/js/lib/form-builder/main.js b/js/lib/form-builder/main.js index 0bc3495..babbb1a 100644 --- a/js/lib/form-builder/main.js +++ b/js/lib/form-builder/main.js @@ -84,3 +84,4 @@ fb.build({ number: '01 02 03 04 05', options: ['a', 'b', 'c', 'd'] }); +console.log(fb.built_form);