From b412e5b6fb7c94cbfbcfce33023febde9b6af150 Mon Sep 17 00:00:00 2001 From: xdrm-brackets Date: Sat, 24 Sep 2016 11:40:01 +0200 Subject: [PATCH] =?UTF-8?q?Gestion=20du=20suivi=20dynamique=20des=20attrib?= =?UTF-8?q?uts=20et=20de=20leur=20modification=20(DOM->objet)=20uniquement?= =?UTF-8?q?=20si=20la=20variable=20est=20soit=201)=20une=20r=C3=A9f=C3=A9r?= =?UTF-8?q?ence=20unique,=20ou=202)=20un=20tableau=20contenant=201=20r?= =?UTF-8?q?=C3=A9f=C3=A9rence=20uniquement?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- js/lib/form-builder-min.js | 12 ++--- js/lib/form-builder.js | 98 +++++++++++++++++++++++++------------- 2 files changed, 71 insertions(+), 39 deletions(-) diff --git a/js/lib/form-builder-min.js b/js/lib/form-builder-min.js index 9ca553e..12809dc 100644 --- a/js/lib/form-builder-min.js +++ b/js/lib/form-builder-min.js @@ -1,6 +1,6 @@ var ref=function(a,b){for(var d=null;null==d||a.hasOwnProperty(d);)d="$"+(268435456+Math.floor(4026531839*Math.random())).toString(16)+"$";a[d]=b;return d},FormBuilder=function(a){this.form_object=a;this.observer=new MutationObserver(FormBuilder.DOMUpdates)};FormBuilder.prototype={form_object:this.form_object,defs_object:{},parent_element:null,built_form:null,root_element:null,ref_table:{$00000000$:null},ref_assoc:{NULL:"$00000000$"},observer:this.observer,scope:{}}; 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_]+)$/,fun_out_val:/^\{([a-z_]+)\(\)\}$/,ref_pri:/^\$[a-f0-9]{8}\$$/};FormBuilder.spread_attr="children next_nodes prev_nodes attributes node_link listeners repeat browse funcs".split(" ");FormBuilder.spec_attr=["_value","_selected"]; -FormBuilder.observe={attributes:{attributes:!0,attributeOldValue:!0,childList:!1,characterData:!1,subtree:!1,characterDataOldValue:!1},characterData:{attributes:!1,attributeOldValue:!1,childList:!1,characterData:!0,subtree:!1,characterDataOldValue:!0}};FormBuilder.debug_time=!1;FormBuilder.debug_time_details=!1; +FormBuilder.observe={attributes:{attributes:!0,attributeOldValue:!1,childList:!1,characterData:!1,subtree:!1,characterDataOldValue:!1},characterData:{attributes:!1,attributeOldValue:!1,childList:!1,characterData:!0,subtree:!1,characterDataOldValue:!0}};FormBuilder.debug_time=!1;FormBuilder.debug_time_details=!1; FormBuilder.debugStart=function(a,b){if(1!=b||!FormBuilder.debug_time)if(2!=b||!FormBuilder.debug_time_details)return{type:0};var d="["+parseInt(64424509439*Math.random()).toString(16)+"]";console.time(d);console.group(a);return{type:b,time_r:d,group:a}};FormBuilder.debug=function(a,b){if(1!=b||!FormBuilder.debug_time)if(2!=b||!FormBuilder.debug_time_details)return{type:0};console.debug(a)}; FormBuilder.debugStop=function(a){if(1!=a.type||!FormBuilder.debug_time)if(2!=a.type||!FormBuilder.debug_time_details)return null;console.timeEnd(a.time_r);console.groupEnd(a.group)};FormBuilder.prototype.add_definition=function(a){var b=FormBuilder.debugStart("FormBuilder.add_definition",1),d;for(d in a)this.defs_object[d]=a[d];FormBuilder.debugStop(b)}; FormBuilder.prototype.build=function(a){var b=FormBuilder.debugStart("FormBuilder.build",1);a=null==a?{}:a;for(var d in a)a[d]=ref(this.ref_table,a[d]),this.ref_assoc[d]=a[d],this.scope["$"+d]=this.ref_assoc[d],this.__defineGetter__("$"+d,function(a,b){return function(){return a.ref_table[a.scope["$"+b]]}}(this,d)),this.__defineSetter__("$"+d,function(a,b){return function(d){a.ref_table[a.scope["$"+b]]=d;a.attach()}}(this,d));this.built_form=JSON.parse(JSON.stringify(this.form_object));this.built_form= @@ -15,16 +15,16 @@ f));FormBuilder.debugStop(g);return a};FormBuilder.replaceStatementsFunction=fun FormBuilder.replaceStatementsRegex=function(a,b){var d=FormBuilder.regex.reg_out_val,e=null,f=[],g,c,h,k;for(h=0;h=d.lastIndex);)g=d.lastIndex,f.push(e);for(e=g=0;e",2);FormBuilder.debugStop(e);return a.dom=f}; +0;g",2);FormBuilder.debugStop(e);return a.dom=f}; FormBuilder.attachElements=function(a,b){var d=FormBuilder.debugStart("FormBuilder::attachElements",2),e,f;for(e in b){for(f in b[e].prev)b[e].prev[f]instanceof Element&&a.appendChild(b[e].prev[f]),b[e].prev[f]instanceof Object&&FormBuilder.attachElements(a,[b[e].prev[f]]);for(f in b[e].node)b[e].node[f]instanceof Element&&a.appendChild(b[e].node[f]),b[e].node[f]instanceof Object&&FormBuilder.attachElements(a,[b[e].node[f]]);for(f in b[e].next)b[e].next[f]instanceof Element&&a.appendChild(b[e].next[f]), b[e].next[f]instanceof Object&&FormBuilder.attachElements(a,[b[e].next[f]])}FormBuilder.debugStop(d)}; FormBuilder.detachElements=function(a,b){var d,e;for(d in b){for(e in b[d].prev)b[d].prev[e]instanceof Element&&a.removeChild(b[d].prev[e]),b[d].prev[e]instanceof Object&&FormBuilder.detachElements(a,[b[d].prev[e]]);for(e in b[d].node)b[d].node[e]instanceof Element&&a.removeChild(b[d].node[e]),b[d].node[e]instanceof Object&&FormBuilder.detachElements(a,[b[d].node[e]]);for(e in b[d].next)b[d].next[e]instanceof Element&&a.removeChild(b[d].next[e]),b[d].next[e]instanceof Object&&FormBuilder.detachElements(a, -[b[d].next[e]])}};FormBuilder.applyCSS=function(a,b){for(var d in b)a.style[d]=b[d]};FormBuilder.fetchNodeType=function(a){if(a.hasOwnProperty("node_type"))return a.node_type;if(a.hasOwnProperty("node_link"))return FormBuilder.fetchNodeType(a.node_link)};FormBuilder.DOMUpdates=function(a,b){for(var d in b)console.log(a,b[d])}; +[b[d].next[e]])}};FormBuilder.applyCSS=function(a,b){for(var d in b)a.style[d]=b[d]};FormBuilder.fetchNodeType=function(a){if(a.hasOwnProperty("node_type"))return a.node_type;if(a.hasOwnProperty("node_link"))return FormBuilder.fetchNodeType(a.node_link)}; +FormBuilder.DOMUpdates=function(a,b,d){var e,f,g,c=FormBuilder.regex.ref_pri;for(e in b)if(f=b[e].attributeName,a.hasOwnProperty("attributes")&&a.attributes.hasOwnProperty(f)&&(g=a.attributes[f]),g instanceof Array&&1==g.length&&c.test(g[0])||c.test(g))g=g[0]||g,g=FormBuilder.fetchRef(d,g),d[g]=b[e].target.getAttribute(f)}; diff --git a/js/lib/form-builder.js b/js/lib/form-builder.js index bc0e059..eae9f34 100644 --- a/js/lib/form-builder.js +++ b/js/lib/form-builder.js @@ -121,7 +121,7 @@ FormBuilder.spec_attr = [ // Liste des attributs à dupliquer jusque dans la def FormBuilder.observe = { attributes: { attributes: true, - attributeOldValue: true, + attributeOldValue: false, childList: false, characterData: false, subtree: false, @@ -969,6 +969,36 @@ FormBuilder.readRef = function(ref_table, parts){ }; +/* RETOURNE LA DERNIERE REFERENCE VERS LA VALEUR +* +* @ref_table Objet contenant les références +* @ref Référence +* +* @return ref Dernière référence +* +*/ +FormBuilder.fetchRef = function(ref_table, ref){ + /* [0] Initialisation + =========================================================*/ + var i, + r = FormBuilder.regex.ref_pri, + last = ref; + + + /* [1] On fetch la référence tant qu'on en a encore une + =========================================================*/ + while( r.test(ref) ){ + last = ref; + ref = ref_table[ref][0] || ref_table[ref]; + } + + + /* [2] On retourne le résultat + =========================================================*/ + return last; +}; + + /* CONSTRUIT UN ELEMENT A PARTIR D'UNE DEFINITION * * @definition Objet de définition de l'élément @@ -1265,20 +1295,10 @@ FormBuilder.createElements = function(definition, ref_table, ref_assoc){ var selected_ref = definition._selected[0]; // On recupere la derniere reference - var last = selected_ref, - curr = selected_ref; - - // On var jusqu'a la valeur - while( FormBuilder.regex.ref_pri.test(curr) ){ - last = curr; - curr = ref_table[ curr ]; - - if( curr instanceof Array ) - curr = curr[0]; - } + selected_ref = FormBuilder.fetchRef(ref_table, selected_ref); // On attribut la valeur modifiee - ref_table[ last ] = this.value; + ref_table[ selected_ref ] = this.value; }, false); } @@ -1298,34 +1318,23 @@ FormBuilder.createElements = function(definition, ref_table, ref_assoc){ var value_ref = definition._value[0]; // On recupere la derniere reference - var last = value_ref, - curr = value_ref; - - // On var jusqu'a la valeur - while( FormBuilder.regex.ref_pri.test(curr) ){ - last = curr; - curr = ref_table[ curr ]; - - if( curr instanceof Array ) - curr = curr[0]; - } + value_ref = FormBuilder.fetchRef(ref_table, value_ref); // On attribut la valeur modifiee - ref_table[ last ] = this.value; + ref_table[ value_ref ] = this.value; }, false); // {5} Sinon gestion des attributs // }else{ - if( !definition.hasOwnProperty('observers') ) - definition.observers = []; + definition.hasOwnProperty('observers') || (definition.observers = []); // On met un observer sur les attributs + on lui passe la definition actuelle var obs = new MutationObserver( - (function(def){ - return function(ev){ return FormBuilder.DOMUpdates(def, ev) }; - })(definition) + (function(def, rt){ + return function(ev){ return FormBuilder.DOMUpdates(def, ev, rt) }; + })(definition, ref_table) ); obs.observe(built[b].node[n], FormBuilder.observe.attributes); @@ -1517,15 +1526,38 @@ FormBuilder.fetchNodeType = function(definition){ }; -FormBuilder.DOMUpdates = function(definition, events){ - var e; +FormBuilder.DOMUpdates = function(definition, events, ref_table){ + var e, attr, ref, + r = FormBuilder.regex.ref_pri; /* [1] On parcourt chaque évènement =========================================================*/ for( e in events){ - console.log( definition, events[e] ); + attr = events[e].attributeName; + + // Si l'attribut existe + if( definition.hasOwnProperty('attributes') && definition.attributes.hasOwnProperty(attr) ) + + ref = definition.attributes[attr]; + + // s'il n'y a qu'une référence + if( ref instanceof Array && ref.length == 1 && r.test(ref[0]) || r.test(ref) ){ + + ref = ref[0] || ref; + + // On récupère la dernière référence + ref = FormBuilder.fetchRef(ref_table, ref); + + // On met à jour la valeur + ref_table[ ref ] = events[e].target.getAttribute(attr); + } + + else + continue; + + // console.log( definition, events[e] );