Skip to content

Instantly share code, notes, and snippets.

@leeoniya
Created April 18, 2016 15:46
Show Gist options
  • Save leeoniya/baa5b971f3421d2a628729e456766b8e to your computer and use it in GitHub Desktop.
Save leeoniya/baa5b971f3421d2a628729e456766b8e to your computer and use it in GitHub Desktop.
/*
https://github.com/leeoniya/domvm (1.x-dev)
*/
("undefined"!==typeof global?global:this).domvm={};(function(v){var y=("undefined"==typeof window?{}:window).requestAnimationFrame,z={animationIterationCount:!0,boxFlex:!0,boxFlexGroup:!0,columnCount:!0,counterIncrement:!0,fillOpacity:!0,flex:!0,flexGrow:!0,flexOrder:!0,flexPositive:!0,flexShrink:!0,"float":!0,fontWeight:!0,gridColumn:!0,lineHeight:!0,lineClamp:!0,opacity:!0,order:!0,orphans:!0,stopOpacity:!0,strokeDashoffset:!0,strokeOpacity:!0,strokeWidth:!0,tabSize:!0,transform:!0,transformOrigin:!0,widows:!0,zIndex:!0,zoom:!0},u={TYPE_ELEM:1,
TYPE_TEXT:2,isArr:function(c){return c instanceof Array},isVal:function(c){c=typeof c;return"string"===c||"number"===c},isObj:function(c){return"object"===typeof c&&null!==c&&!u.isArr(c)},isFunc:function(c){return"function"===typeof c},isProm:function(c){return"object"===typeof c&&u.isFunc(c.then)},isElem:function(c){return c instanceof HTMLElement},execAll:function(c,g,q,r,t,x){var w;c&&(u.isArr(c)?c:[c]).forEach(function(c){w=c.call(null,g,q,r,t,x)});return w},tick:function(c,g){g&&y?y&&y(function(){u.tick(c,
g-1)}):u.isArr(c)?c[0].apply(null,c.slice(1)):c()},insertArr:function(c,g,q,r){c.splice.apply(c,[q,r].concat(g))},isEvProp:function(c){return"on"===c.substr(0,2)},isDynProp:function(c,g){switch(c){case "input":case "textarea":case "select":case "option":switch(g){case "value":case "checked":case "selected":case "selectedIndex":return!0}}},camelDash:function(c){return c.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase()},autoPx:function(c,g){return isNaN(g)||z[c]?g:g+"px"},cmpArr:function(c,g){var q=
c.length;if(q!=g.length)return!1;for(;q--;)if(c[q]!==g[q])return!1;return!0},deepSet:function(c,g,q,r,t,x){g=g.split(".");var w=g.pop();g.forEach(function(g){c[g]||(c[g]={});c=c[g]});if(u.isFunc(c[w]))c[w](q,r,t,x);else c[w]=q},deepGet:function(c,g){var q=g.split(".");do c=c[q.shift()];while(q.length);return c},keyedIdx:function(c,g,q,r,t){for(r=0;r<g.length;r++)if(t=g[r],t.key===c)if(q){if(t.vm&&t.vm.view[0]===q)return r}else return r;return-1},raft:function(c){function g(){q=0;c.apply(r,t)}if(!y)return c;
var q,r,t;return function(){r=this;t=arguments;q||(q=y(g))}}};v.utils=u})(domvm);(function(v){function y(){for(var a;a=E.pop();)a[0].apply(null,a.slice(1))}function z(a,b){return!1===b?null:null==b&&null!=a?a:e.isVal(b)||e.isObj(b)||e.isArr(b)||e.isFunc(b)?b:null}function u(a,b,h,p,d,l){function m(a,b,d){if(d)a[b]=a[b]||[],a[b].push(d);else for(var h in b)a[h]=a[h]||[],a[h].push(b[h])}function f(a,b,h){d=a;l=b;n.update(h,!1);null!=n.node&&(d.body[l]=n.node);return r(0,!1)}function k(a){return null==a?"":a}function r(a,p){if(a){for(var c=n;a--&&c.parent;)c=c.parent;c.redraw(0,
!0);return c.vm}(c=n.node)&&g(n,"willRedraw",n);var f=n.refs;n.refs={};var k=n.render.call(n.api,n,b,h);if(!1===k)return n.node.moved=!0,n.node.wasSame=!0,n.refs=f,n;f=t(k,d,l,n);f.vm=n;n.node=f;k=e.isVal(h)&&"^"===h[0]?h.substr(1):e.isVal(f.ref)&&"^"===f.ref[0]?f.ref.substr(1):null;f.key=null!=h?h:f.key;for(var m=d;m;)m.vm&&(n.parent||(n.parent=m.vm),null!==k&&e.deepSet(m.vm.refs,k,f)),m=m.parent;if((k=c)&&(f.type!==c.type||f.tag!==c.tag))var k=null,J=!0,v=c.el.parentNode;x(f,k);d&&(d.body[l]=f);
!1!==p&&(c&&q(c),!c&&u||w(f,null,f.el),J&&(v||f.parent.el).insertBefore(f.el,v.childNodes[c.idx]));c&&g(n,"didRedraw",n);!1!==p&&e.tick(y,2);return n}var u=!d;e.isArr(a)&&(b=a[1],h=a[2],p=a[3],a=a[0]);h=z(b,h);var n={api:{},node:null,view:[a,h],model:b,opts:p||{},render:null,update:function(a,d){null==a||h===b&&!e.isVal(h)||(b=n.model=a);return!1!==d?r(0):n},on:function(a,b){m(n.events,a,b)},hook:function(a,b){n.hooks=n.hooks||{};m(n.hooks,a,b)},events:{},hooks:null,redraw:B.useRaf?e.raft(r):r,patch:function(a,
b){var d=null!=a.el;if(e.isObj(b)){var h="class"in b?(k(a["class"])+" "+k(b["class"])).trim():a.props["class"],c="style"in b?b.style:a.props.style;d&&(d=Object.create(a.props),d["class"]=h,d.style=c,d={tag:a.tag,el:a.el,ns:a.ns,props:d},C(d,a));a.props["class"]=h;a.props.style=c}else h=a.parent,d=x(t(b,h,a.idx,n),a),h.body[a.idx]=d},emit:function(a){for(var b=Array.prototype.slice.call(arguments),d=n,h;d;){if(h=d.events[a]){b[0]=h;e.execAll.apply(null,b);break}d=d.parent}},refs:{},parent:null,mount:function(a,
b){var d=null;b&&(a.textContent="",d=a,a=null);w(n.node,d,null,a);return n},attach:function(a){c(n.node,a);return n},unmount:function(){q(n.node)},moveTo:f,updIdx:function(a){l=a}};p&&p.hooks&&n.hook(p.hooks);e.execAll(A,n);n.render=a.call(n.api,n,b,h);return d?f(d,l):r(0)}function c(a,b){a.el=b;b._node=a;for(var h in a.props){var p=a.props[h],d=e.isEvProp(h)?h:"."===h[0]?h.substr(1):null;null!==d&&(b[d]=p)}if(e.isArr(a.body))for(h=0;h<a.body.length;h++)c(a.body[h],b.childNodes[h])}function g(a,b,
h,c,d,l){if(a&&a.hooks&&(a=a.hooks[b]))if(B.useRaf&&"did"==b.substr(0,3))E.push([e.execAll,a,h,c,d,l]);else return e.execAll(a,h,c,d,l)}function q(a,b){var h=a.el&&!a.moved;if(h){var c=g(a.vm,"willUnmount",a.vm),d=g(a,"willRemove",a),l=c||d;a.removed=!0}a.wasSame?a.wasSame=!1:(e.isArr(a.body)&&a.body.forEach(function(a,d){q(a,b||l)}),b||(l?l.then(function(){r(a,h)}):r(a,h)));a.moved=!1}function r(a,b){null!=a.el&&a.el.parentNode&&(b&&(a.el.parentNode.removeChild(a.el),a.el=null,g(a.vm,"didUnmount",
a.vm),g(a,"didRemove",a)),e.isArr(a.body)&&a.body.forEach(function(a,b){r(a,!a.moved)}))}function t(a,b,h,c){var d=a;a={type:null,key:null,ref:null,idx:null,parent:null,moved:!1,wasSame:!1,removed:!1,hooks:null,tag:null,"class":null,ns:null,guard:!1,raw:!1,props:null,el:null,hasKeys:!1,body:null};e.isFunc(d)&&(d=d());var l=d.length;if(e.isArr(d)&&l){a.type=e.TYPE_ELEM;if(1<l){var m=1;e.isObj(d[1])&&!e.isElem(d[1])&&(a.props=d[1],m=2);a.body=l==m+1?e.isVal(d[m])?d[m]:e.isFunc(d[m])?d[m]():d.slice(m):
d.slice(m)}d=d[0];l=F[d];l||(l=["",""],l={tag:(d.match(/^[-\w]+/)||["div"])[0],id:(d.match(/#([-\w]+)/)||l)[1],"class":(d.match(/\.([-\w.]+)/)||l)[1].replace(/\./g," ")},F[d]=l);a.tag=l.tag;if(l.id||l["class"])d=a.props||{},l.id&&null==d.id&&(d.id=l.id),l["class"]&&(a["class"]=l["class"],d["class"]=l["class"]+(null!=d["class"]?" "+d["class"]:"")),a.props=d;if(a.props){var d=a.props,f;for(f in d)e.isEvProp(f)?(d[f]._vm=c,d[f]._node=a):e.isFunc(d[f])&&("href"==f?(d.onclick=d[f],d.href=d[f].href):d[f]=
d[f]()),e.isDynProp(a.tag,f)&&(d["."+f]=d[f]);if(e.isObj(d.style))for(var k in d.style)f=d.style[k],e.isFunc(f)&&(d.style[k]=f());e.isObj(d._hooks)&&(a.hooks=d._hooks,d._hooks=null);a.key=e.isVal(d._key)?d._key:e.isVal(d._ref)?d._ref:e.isVal(d.id)?d.id:e.isVal(d.name)?d.name:null;null!=d._ref&&(a.ref=d._ref);d._raw&&(a.raw=!0);null!=d._data&&(a.data=d._data);d._ref=d._key=d._raw=d._data=null}}else e.isVal(d)?(a.type=e.TYPE_TEXT,a.body=d):e.isElem(d)&&(a.type=e.TYPE_ELEM,a.el=d,a.tag=d.nodeName.toLowerCase());
null!==a.ref&&e.deepSet(c.refs,a.ref,a);a.parent=b;a.idx=h;a.ns=b&&b.ns?b.ns:"svg"===a.tag||"math"===a.tag?a.tag:null;if(e.isArr(a.body))for(b=0,h=a.body.length;b<h;b++){k=a.body[b];d=f=null;m=l=!1;e.isFunc(k)&&(k=k());if(null==k)l=!0;else{var g=e.isArr(k),q=g?!1:e.isObj(k);if(g)k.length?"string"==typeof k[0]&&""!==k[0]?(d=t(k,a,b,c),f=d.key):e.isFunc(k[0])?f=z(k[1],k[2]):m=!0:l=!0;else if(q)if(e.isFunc(k.redraw))k.moveTo(a,b),d=k.node,f=k.view[1];else if(e.isElem(k))d=t(k,a,b,c);else{a.body[b--]=
""+k;continue}else""===k?l=!0:0<b&&a.body[b-1].type===e.TYPE_TEXT?(a.body[b-1].body+=""+k,l=!0):d=t(""+k,a,b,c)}l||m?(m?e.insertArr(a.body,k,b,1):a.body.splice(b,1),h=a.body.length,b--):(null!==f&&(a.hasKeys=!0),a.body[b]=d||k)}return a}function x(a,b){b&&(g(a,"willRecycle",b,a),K(b,a),g(a,"didRecycle",b,a));if(e.isArr(a.body)){var h=0;a.body.forEach(function(c,d){var l=e.isArr(c);if(b){var m=I(c,a,b,h);if(null!==m){var f=m[0],m=m[1];f===h&&h++;f=b.body[f];f.vm?l?2===m?f.vm.moveTo(a,d,c[1]):1===m&&
u(c[0],c[1],c[2],c[3],a,d):c.vm&&2===m&&c.vm===f.vm&&f.vm.moveTo(a,d):a.body[d]=x(c,f);return}}l?u(c[0],c[1],c[2],c[3],a,d):a.body[d]=x(c)})}return a}function w(a,b,c,p){for(var d=!a.el;c&&c._node.removed;)c=c.nextSibling;d&&g(a.vm,"willMount",a.vm);if(a.type==e.TYPE_ELEM)if(d&&(a.el=b||(a.ns?D.createElementNS(L[a.ns],a.tag):D.createElement(a.tag)),a.props&&C(a)),e.isArr(a.body)){b=0;for(var l=a.el.firstChild;b<a.body.length;b++)l=w(a.body[b],null,l)}else e.isVal(a.body)&&(a.raw?a.el.innerHTML=a.body:
d&&(a.el.textContent=a.body));else a.type==e.TYPE_TEXT&&d&&(a.el=D.createTextNode(a.body));a.el._node=a;b=a.parent;c!==a.el&&(p||b&&b.el)&&(b=d?"Insert":"Reinsert",g(a,"will"+b,a),(p||a.parent.el).insertBefore(a.el,c),g(a,"did"+b,a));d&&a.vm&&a.vm.hooks&&!a.moved&&g(a.vm,"didMount",a.vm);return c!==a.el?c:c.nextSibling}function I(a,b,c,p,d){var l=e.isArr(a),m=l?z(a[1],a[2]):a.key,f=c.hasKeys,k=b.hasKeys;c=c.body;b=b.body;if(null!==m&&f)return a=e.keyedIdx(m,c,l?a[0]:null),-1<a?[a,2]:null;p=p||0;if(p>
c.length-1)return null;d=0===d?0:d||c.length-1;for(m=null;p<=d;p++)if(f=c[p],null!==f&&f.el)if(l&&f.vm){if(f.vm.view[0]===a[0]){if(f.vm.view[1]===z(a[1],a[2]))return[p,2];!m&&k&&-1==e.keyedIdx(f.key,b,f.vm.view[0])&&(m=[p,1])}}else if(a.type===f.type&&(a.type===e.TYPE_TEXT||null!==a.tag&&a.tag===f.tag)&&(null===f.key||!k||-1==e.keyedIdx(f.key,b,f.vm?f.vm.view[0]:null)))return[p,1];return m}function K(a,b){b.el=a.el;a.el=null;b.el&&(b.el._node=b);if(b.type===e.TYPE_TEXT&&b.body!==a.body)b.el.nodeValue=
b.body;else{C(b,a);var c=!e.isArr(b.body),p=!e.isArr(a.body);c&&b.body!==a.body?p&&b.el.firstChild?b.el.firstChild.nodeValue=b.body:b.raw?b.el.innerHTML=b.body:b.el.textContent=b.body:p&&!c&&(b.el.textContent="");a.moved=!0}}function M(a,b,c,p){return function(d){var c,h=d.target._node,f=null;if(e.isFunc(a))c=a.call(b,d,h,p);else if(e.isArr(a))f=a.slice(1),c=a[0].apply(b,f.concat(d,h,p));else if(e.isObj(a))for(var k in a){var g=a[k];null!=g&&"_"!=k[0]&&d.target.matches(k)&&(e.isArr(g)?(f=g.slice(1),
c=g[0].apply(b,f.concat(d,h,p))):e.isFunc(g)&&(c=g.call(b,d,h,p)))}!1===c&&(d.preventDefault(),d.stopPropagation());p.opts.hasOwnProperty("watch")&&p.opts.watch.fire({type:"event",vm:p,node:h,event:d,data:f})}}function C(a,b){var c=!b;b=b||{};if(b.props||a.props){var g=b.props||{},d=a.props||{},l=g.style,m=d.style;if(e.isObj(l)||e.isObj(m))G(a.el,a.tag,l||{},m||{},N,O,a.ns,c),g.style=d.style=null;G(a.el,a.tag,g,d,P,H,a.ns,c);m&&(d.style=m)}}function G(a,b,c,g,d,l,m,f){for(var k in g)if(b=g[k],null!==
b){var q="."===k[0]?a[k.substr(1)]:c[k];b===q||e.isArr(b)&&e.isArr(q)&&e.cmpArr(b,q)||d(a,k,b,m,f)}for(k in c)null!==c[k]&&null==g[k]&&l(a,k,m,f)}function N(a,b,c){a.style[b]=e.autoPx(b,c)}function O(a,b){a.style[b]=""}function P(a,b,c,g,d){"."===b[0]?(b=b.substr(1),"svg"===g?a[b].baseVal=c:a[b]=c):"class"===b?a.className=c:"id"===b?a[b]=c:e.isEvProp(b)?(g=c._vm,a[b]=M(c,g.opts.evctx||g.model||null,c._node,g)):!1===c?H(a,b,g,d):a.setAttribute(b,!0===c?"":c)}function H(a,b,c,g){g||("."===b[0]?(b=b.substr(1),
"svg"===c?a[b].baseVal=null:a[b]=null):"class"===b?a.className="":"id"===b||e.isEvProp(b)?a[b]=null:a.removeAttribute(b))}var L={svg:"http://www.w3.org/2000/svg",math:"http://www.w3.org/1998/Math/MathML"},D="undefined"==typeof document?{}:document,F={},E=[],B={useRaf:!0};v.view=u;v.view.config=function(a){B=a};var A=null;v.view.extend=function(a,b){A=!A||b?[]:A;A.push(a)};var e=v.utils;return v})(domvm);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment