Faster loading, IE10 support
authorDaniel Abrecht <webmaster@danielabrecht.ch>
Fri, 20 Feb 2015 19:22:56 +0000 (20:22 +0100)
committerDaniel Abrecht <webmaster@danielabrecht.ch>
Fri, 20 Feb 2015 19:22:56 +0000 (20:22 +0100)
MVSync.js
MVSync.min.js

index ff13d56..a1357d7 100644 (file)
--- a/MVSync.js
+++ b/MVSync.js
@@ -249,7 +249,7 @@ function Template(template){
         }
       }
       var updateScope = function(attr){
-        var value = e.getAttribute(attr);
+        var value = e[attr] || e.getAttribute(attr);
         for(var name in mapping){
           var maps = mapping[name];
           for(var i in maps){
@@ -260,12 +260,17 @@ function Template(template){
           }
         }
       };
-      var observer = new MutationObserver(function(mutations){
-        mutations.forEach(function(mutation){;
-          updateScope(mutation.attributeName);
+      if("MutationObserver" in window){
+        var observer = new MutationObserver(function(mutations){
+          mutations.forEach(function(mutation){;
+            updateScope(mutation.attributeName);
+          });
         });
-      });
-      observer.observe( e, /** @type {!MutationObserverInit} */ ({ attributes: true }) );
+        observer.observe( e, /** @type {!MutationObserverInit} */ ({ attributes: true }) );
+      }else if("value" in e){
+        e.addEventListener("change",updateScope.bind(null,"value"),false);
+        e.addEventListener("input",updateScope.bind(null,"value"),false);
+      }
       if("value" in e)
         e.addEventListener("change",function(){
           e.setAttribute("value",e.value);
@@ -444,7 +449,19 @@ function loadTemplate(name){
   xhr.send();
 }
 
-addEventListener("load",function(){
+var initialized = false;
+
+function initMVSync(ignoreReadystate){
+  if(initialized)
+    return;
+  if(!( document.readyState == "complete" 
+     || document.readyState == "loaded" 
+     || document.readyState == "interactive"
+     || ignoreReadystate
+  )) return;
+  if(!("observe" in Object))
+    return;
+  initialized = true;
   if(window['templateRoot']){
     base = window['templateRoot'] + "/";
   }else if(document.querySelector("[data-template-root]")){
@@ -454,6 +471,13 @@ addEventListener("load",function(){
   compileTemplates(document);
   var t = compileTemplate(document.documentElement);
   t.instance(model);
-});
+};
+
+window['initMVSync'] = initMVSync;
 
 })();
+
+addEventListener("load",initMVSync.bind(null,true));
+addEventListener("DOMContentLoaded",initMVSync.bind(null,true));
+initMVSync(false);
+
index ef36390..15838c2 100644 (file)
@@ -1,11 +1,12 @@
-(function(){function v(){Object.observe(n,function(e){e.forEach(function(e){"add"==e.type&&C(e.name)})})}function D(e){function f(f){function q(a){a.forEach(function(a){r(a.name)})}function w(a){try{return(new Function("v","return v."+a+";"))(f)}catch(g){return null}}function r(a){if(a in k)for(var g in k[a])(function(){var b=k[a][g],h=null;b.a&&(h=w(b.a));var d=null;switch(b.type){case "getter":var c=y[a+b.a]=l[b.which]=y[a+b.a]||l[b.which]||{};p[b.which]&&(c.k=p[b.which]);var e=function(a){for(c.i=
-a;c.b.length;){var d=c.b.pop();(new Function("s","n","v","s[n]"+b.a+"=v;")).call(f,f,d,a)}};c.b=c.b||[];c.b.length||(d=h(),d instanceof Function?d(e):e(d));c.b.push(b.which);break;case "setter":d=z[a+b.a]=p[b.which]=z[a+b.a]||p[b.which]||{};(l[b.which]||l[b.which]||{}).k=d;d.d=h;break;case "value":d=h;a in l&&l[a].i==d||(h=null,a in l&&(h=l[a].k.d,delete l[a].i),!h&&a in p&&(h=p[a].d),h&&(h=h(d))&&h());"attribute"==b.e?t(b.element,b.which,d):"content"==b.e&&A(b.element,d);break;case "map":b.update()}})()}
-function t(a,g,b){g in a?a[g]=b:a.setAttribute(g,b)}function A(a,g){for(;a.childNodes.length;){var b=a.childNodes[a.childNodes.length-1];b.l&&b.l.f();a.removeChild(b)}"_content"in a&&delete a.c;g instanceof Node?(b=g.cloneNode(!0),x(b),a.appendChild(b)):a.appendChild(document.createTextNode(g||""))}function x(a){var g=a.getAttribute("data-bind");if(g)for(var g=g.split("\u00a6"),b=0;b<g.length;b++){var h=g[b].split(":"),d=h[1],c=d.match(/^([a-zA-Z_$][a-zA-Z0-9_$]*)(.*)/)[1],h=h[0],e=w(d);t(a,h,e);
-k[c]=k[c]||[];k[c].push({which:h,e:"attribute",type:"value",a:d,element:a})}if(b=a.getAttribute("data-content"))d=b.match(/^([a-zA-Z_$][a-zA-Z0-9_$]*)(.*)/),c=d[1],d=b,e=w(d),A(a,e),k[c]=k[c]||[],k[c].push({e:"content",type:"value",a:d,element:a});if(g=a.getAttribute("data-getter"))for(g=g.split("\u00a6"),b=0;b<g.length;b++)h=g[b].split(":"),d=h[1],c=d.match(/^([a-zA-Z_$][a-zA-Z0-9_$]*)(.*)/)[1],h=h[0],k[c]=k[c]||[],k[c].push({which:h,type:"getter",a:d,element:a});if(g=a.getAttribute("data-setter"))for(g=
-g.split("\u00a6"),b=0;b<g.length;b++)h=g[b].split(":"),d=h[1],c=d.match(/^([a-zA-Z_$][a-zA-Z0-9_$]*)(.*)/)[1],h=h[0],k[c]=k[c]||[],k[c].push({which:h,type:"setter",a:d,element:a});(new MutationObserver(function(b){b.forEach(function(b){b=b.attributeName;var c=a.getAttribute(b),d;for(d in k){var g=k[d],e;for(e in g){var h=g[e];"value"==h.type&&h.which==b&&(new Function("s","v","if(s."+h.a+".toString()!=v)s."+h.a+"=Object(s."+h.a+").constructor(v);")).call(f,f,c)}}})})).observe(a,{attributes:!0});"value"in
-a&&a.addEventListener("change",function(){a.setAttribute("value",a.value)});if(b=a.getAttribute("data-map")){var m=b.split(":"),d=m[0].match(/^([a-zA-Z_$][a-zA-Z0-9_$]*)(.*)/),c=d[1],d=d[2],l=function(){if(m[1]in u){var b=f[c];b&&(b=Object((new Function("v","return v"+d+";"))(b)));b||(b=[]);"length"in b||(b=[b]);a.c=a.c||{o:[],n:[]};Object.observe(b,function(){B(a.c,b,a,u[m[1]])});B(a.c,b,a,u[m[1]])}else(n[m[1]]=n[m[1]]||[]).push(l)};(k[m[0]]=k[m[0]]||[]).push({type:"map",update:l});l()}if(!b)for(b=
-0;b<a.children.length;b++)x(a.children[b])}function B(a,g,b,e){for(var d=[],c=0;c<g.length;c++)g[c]instanceof Object&&-1==d.indexOf(g[c])&&d.push(g[c]);g=a.o;a=a.n;for(c=g.length;c--;)-1==d.indexOf(g[c])&&(a[c].element.parentNode&&a[c].element.parentNode.removeChild(a[c].element),g.splice(c,1),a.splice(c,1));for(c=0;c<d.length;c++){var f=g.indexOf(d[c]);if(-1!=f)a[f].index=c;else{f={element:e.h(d[c]),index:c};if(a.length){var k=a[a.length-1].element;k.parentNode==b?b.insertBefore(f.element,k.nextSibling):
-b.appendChild(f.element)}else b.appendChild(f.element);g.push(d[c]);a.push(f)}}for(c=0;c<a.length;c++)d=a[c],d.index!=c&&(b=d.element,e=a[d.index].element,f=d.index,a[c]=[a[f],a[f]=a[c]][0],d=d.index,g[c]=[g[d],g[d]=g[c]][0],d=b.parentNode,f=e.parentNode,d&&f&&(k=b.nextSibling,f.insertBefore(b,e.nextSibling),d.insertBefore(e,k)))}Object.defineProperty(f,"this",{configurable:!0,writable:!0,enumerable:!1,value:f});var k={},y={},l={},z={},p={};this.g=[];this.root=e instanceof HTMLHtmlElement?e:e.cloneNode(!0);
-this.root.l=this;this.root.classList.add(E);this.f=function(){Object.r(this.j.m,this.j.d);for(var a=0;a<this.g.length;a++)this.g[a].f()};x(this.root);this.j={m:Object.observe(f,q),d:q};for(var v in f)r(v)}e.removeAttribute("data-template");var E=e.p;e.q=this;this.h=function(e){return(new f(e)).root}}function r(e){var f=e.getAttribute("data-template");!f&&e instanceof HTMLHtmlElement&&(f="root");!e.parentNode||e instanceof HTMLHtmlElement||e.parentNode.removeChild(e);e.p=f;e=u[f]=new D(e);if(f in n){for(;n[f].length;)n[f].pop()();
-delete n[f]}return e}function t(e){"querySelectorAll"in e&&(e=e.querySelectorAll("[data-template]"));for(var f=0;f<e.length;f++)r(e[f])}function C(e){var f=new XMLHttpRequest;f.open("GET",q+"templates/"+e+".html",!0);f.onload=function(){var e=null;if(!e){var e=document.createDocumentFragment(),f=document.createElement("div");f.innerHTML=this.responseText;e.appendChild(f)}t(e)};f.send()}window.model=window.model||{};var u={},n={},q="/";addEventListener("load",function(){window.templateRoot?q=window.templateRoot+
-"/":document.querySelector("[data-template-root]")&&(q=document.querySelector("[data-template-root]").getAttribute("data-template-root")+"/");v();t(document);r(document.documentElement).h(model)})})();
+(function(){function x(){Object.observe(p,function(c){c.forEach(function(c){"add"==c.type&&D(c.name)})})}function E(c){function g(g){function q(a){a.forEach(function(a){t(a.name)})}function y(a){try{return(new Function("v","return v."+a+";"))(g)}catch(c){return null}}function t(a){if(a in k)for(var c in k[a])(function(){var b=k[a][c],f=null;b.a&&(f=y(b.a));var e=null;switch(b.type){case "getter":var d=A[a+b.a]=l[b.which]=A[a+b.a]||l[b.which]||{};m[b.which]&&(d.k=m[b.which]);var h=function(a){for(d.i=
+a;d.b.length;){var e=d.b.pop();(new Function("s","n","v","s[n]"+b.a+"=v;")).call(g,g,e,a)}};d.b=d.b||[];d.b.length||(e=f(),e instanceof Function?e(h):h(e));d.b.push(b.which);break;case "setter":e=B[a+b.a]=m[b.which]=B[a+b.a]||m[b.which]||{};(l[b.which]||l[b.which]||{}).k=e;e.d=f;break;case "value":e=f;a in l&&l[a].i==e||(f=null,a in l&&(f=l[a].k.d,delete l[a].i),!f&&a in m&&(f=m[a].d),f&&(f=f(e))&&f());"attribute"==b.e?u(b.element,b.which,e):"content"==b.e&&v(b.element,e);break;case "map":b.update()}})()}
+function u(a,c,b){c in a?a[c]=b:a.setAttribute(c,b)}function v(a,c){for(;a.childNodes.length;){var b=a.childNodes[a.childNodes.length-1];b.l&&b.l.f();a.removeChild(b)}"_content"in a&&delete a.c;c instanceof Node?(b=c.cloneNode(!0),z(b),a.appendChild(b)):a.appendChild(document.createTextNode(c||""))}function z(a){function c(d){var b=a[d]||a.getAttribute(d),e;for(e in k){var f=k[e],h;for(h in f){var r=f[h];"value"==r.type&&r.which==d&&(new Function("s","v","if(s."+r.a+".toString()!=v)s."+r.a+"=Object(s."+
+r.a+").constructor(v);")).call(g,g,b)}}}var b=a.getAttribute("data-bind");if(b)for(var b=b.split("\u00a6"),f=0;f<b.length;f++){var e=b[f].split(":"),d=e[1],h=d.match(/^([a-zA-Z_$][a-zA-Z0-9_$]*)(.*)/)[1],e=e[0],l=y(d);u(a,e,l);k[h]=k[h]||[];k[h].push({which:e,e:"attribute",type:"value",a:d,element:a})}if(f=a.getAttribute("data-content"))d=f.match(/^([a-zA-Z_$][a-zA-Z0-9_$]*)(.*)/),h=d[1],d=f,l=y(d),v(a,l),k[h]=k[h]||[],k[h].push({e:"content",type:"value",a:d,element:a});if(b=a.getAttribute("data-getter"))for(b=
+b.split("\u00a6"),f=0;f<b.length;f++)e=b[f].split(":"),d=e[1],h=d.match(/^([a-zA-Z_$][a-zA-Z0-9_$]*)(.*)/)[1],e=e[0],k[h]=k[h]||[],k[h].push({which:e,type:"getter",a:d,element:a});if(b=a.getAttribute("data-setter"))for(b=b.split("\u00a6"),f=0;f<b.length;f++)e=b[f].split(":"),d=e[1],h=d.match(/^([a-zA-Z_$][a-zA-Z0-9_$]*)(.*)/)[1],e=e[0],k[h]=k[h]||[],k[h].push({which:e,type:"setter",a:d,element:a});"MutationObserver"in window?(new MutationObserver(function(a){a.forEach(function(a){c(a.attributeName)})})).observe(a,
+{attributes:!0}):"value"in a&&(a.addEventListener("change",c.bind(null,"value"),!1),a.addEventListener("input",c.bind(null,"value"),!1));"value"in a&&a.addEventListener("change",function(){a.setAttribute("value",a.value)});if(f=a.getAttribute("data-map")){var n=f.split(":"),d=n[0].match(/^([a-zA-Z_$][a-zA-Z0-9_$]*)(.*)/),h=d[1],d=d[2],m=function(){if(n[1]in w){var b=g[h];b&&(b=Object((new Function("v","return v"+d+";"))(b)));b||(b=[]);"length"in b||(b=[b]);a.c=a.c||{o:[],n:[]};Object.observe(b,function(){C(a.c,
+b,a,w[n[1]])});C(a.c,b,a,w[n[1]])}else(p[n[1]]=p[n[1]]||[]).push(m)};(k[n[0]]=k[n[0]]||[]).push({type:"map",update:m});m()}if(!f)for(f=0;f<a.children.length;f++)z(a.children[f])}function C(a,c,b,f){for(var e=[],d=0;d<c.length;d++)c[d]instanceof Object&&-1==e.indexOf(c[d])&&e.push(c[d]);c=a.o;a=a.n;for(d=c.length;d--;)-1==e.indexOf(c[d])&&(a[d].element.parentNode&&a[d].element.parentNode.removeChild(a[d].element),c.splice(d,1),a.splice(d,1));for(d=0;d<e.length;d++){var h=c.indexOf(e[d]);if(-1!=h)a[h].index=
+d;else{h={element:f.h(e[d]),index:d};if(a.length){var g=a[a.length-1].element;g.parentNode==b?b.insertBefore(h.element,g.nextSibling):b.appendChild(h.element)}else b.appendChild(h.element);c.push(e[d]);a.push(h)}}for(d=0;d<a.length;d++)e=a[d],e.index!=d&&(b=e.element,f=a[e.index].element,h=e.index,a[d]=[a[h],a[h]=a[d]][0],e=e.index,c[d]=[c[e],c[e]=c[d]][0],e=b.parentNode,h=f.parentNode,e&&h&&(g=b.nextSibling,h.insertBefore(b,f.nextSibling),e.insertBefore(f,g)))}Object.defineProperty(g,"this",{configurable:!0,
+writable:!0,enumerable:!1,value:g});var k={},A={},l={},B={},m={};this.g=[];this.root=c instanceof HTMLHtmlElement?c:c.cloneNode(!0);this.root.l=this;this.root.classList.add(F);this.f=function(){Object.r(this.j.m,this.j.d);for(var a=0;a<this.g.length;a++)this.g[a].f()};z(this.root);this.j={m:Object.observe(g,q),d:q};for(var x in g)t(x)}c.removeAttribute("data-template");var F=c.p;c.q=this;this.h=function(c){return(new g(c)).root}}function t(c){var g=c.getAttribute("data-template");!g&&c instanceof
+HTMLHtmlElement&&(g="root");!c.parentNode||c instanceof HTMLHtmlElement||c.parentNode.removeChild(c);c.p=g;c=w[g]=new E(c);if(g in p){for(;p[g].length;)p[g].pop()();delete p[g]}return c}function u(c){"querySelectorAll"in c&&(c=c.querySelectorAll("[data-template]"));for(var g=0;g<c.length;g++)t(c[g])}function D(c){var g=new XMLHttpRequest;g.open("GET",q+"templates/"+c+".html",!0);g.onload=function(){var c=null;if(!c){var c=document.createDocumentFragment(),g=document.createElement("div");g.innerHTML=
+this.responseText;c.appendChild(g)}u(c)};g.send()}window.model=window.model||{};var w={},p={},q="/",v=!1;window.initMVSync=function(c){!v&&("complete"==document.readyState||"loaded"==document.readyState||"interactive"==document.readyState||c)&&"observe"in Object&&(v=!0,window.templateRoot?q=window.templateRoot+"/":document.querySelector("[data-template-root]")&&(q=document.querySelector("[data-template-root]").getAttribute("data-template-root")+"/"),x(),u(document),t(document.documentElement).h(model))}})();
+addEventListener("load",initMVSync.bind(null,!0));addEventListener("DOMContentLoaded",initMVSync.bind(null,!0));initMVSync(!1);