diff --git a/Slim.js b/Slim.js index 5d4fecb..89cc28e 100644 --- a/Slim.js +++ b/Slim.js @@ -824,6 +824,65 @@ var Slim = function (_CustomElement2) { } var allChildren = Slim.selectorToArr(this._virtualDOM, '*'); + + var _loop = function _loop(child) { + child._sourceOuterHTML = child.outerHTML; + child._boundParent = child._boundParent || _this4; + self._boundChildren = _this4._boundChildren || []; + self._boundChildren.push(child); + self._boundChildren.push(child); + if (child.localName === 'style' && _this4.useShadow) { + Slim.__processStyleNode(child, _this4.localName, _this4.uq_index); + } + if (child.getAttribute('slim-id')) { + child._boundParent[Slim.__dashToCamel(child.getAttribute('slim-id'))] = child; + } + var slimID = child.getAttribute('slim-id'); + if (slimID) _this4[slimID] = child; + var descriptors = []; + if (child.attributes) for (var i = 0; i < child.attributes.length; i++) { + if (!child.isSlim && !child.__eventsInitialized && Slim.interactionEventNames.indexOf(child.attributes[i].nodeName) >= 0) { + child.isInteractive = true; + child.handleEvent = self.handleEvent.bind(child); + child.callAttribute = self.callAttribute.bind(child); + child.addEventListener(child.attributes[i].nodeName, child.handleEvent); + child.__eventsInitialized = true; + } + var desc = Slim.__processAttribute(child.attributes[i], child); + if (desc) descriptors.push(desc); + child[Slim.__dashToCamel(child.attributes[i].nodeName)] = child.attributes[i].nodeValue; + if (child.attributes[i].nodeName.indexOf('#') == '0') { + var refName = child.attributes[i].nodeName.slice(1); + _this4[refName] = child; + } + } + + descriptors = descriptors.sort(function (a) { + if (a.type === 'I') { + return -1; + } else if (a.type === 'R') return 1;else if (a.type === 'C') return 2; + return 0; + }); + + child._boundProperties = {}; + + descriptors.forEach(function (descriptor) { + descriptor.properties && descriptor.properties.forEach(function (prop) { + child._boundProperties[prop] = true; + }); + if (descriptor.type === 'P' || descriptor.type === 'M' || descriptor.type === 'C') { + _this4.__bind(descriptor); + } else if (descriptor.type === 'I') { + Slim.__inject(descriptor); + } else if (descriptor.type === 'R') { + Slim.__createRepeater(descriptor); + _this4.__bind(descriptor); + } else if (descriptor.type === 'F') { + _this4.__bind(descriptor); + } + }); + }; + var _iteratorNormalCompletion3 = true; var _didIteratorError3 = false; var _iteratorError3 = undefined; @@ -832,56 +891,7 @@ var Slim = function (_CustomElement2) { for (var _iterator3 = allChildren[Symbol.iterator](), _step3; !(_iteratorNormalCompletion3 = (_step3 = _iterator3.next()).done); _iteratorNormalCompletion3 = true) { var child = _step3.value; - child._sourceOuterHTML = child.outerHTML; - child._boundParent = child._boundParent || this; - self._boundChildren = this._boundChildren || []; - self._boundChildren.push(child); - self._boundChildren.push(child); - if (child.localName === 'style' && this.useShadow) { - Slim.__processStyleNode(child, this.localName, this.uq_index); - } - if (child.getAttribute('slim-id')) { - child._boundParent[Slim.__dashToCamel(child.getAttribute('slim-id'))] = child; - } - var slimID = child.getAttribute('slim-id'); - if (slimID) this[slimID] = child; - var descriptors = []; - if (child.attributes) for (var i = 0; i < child.attributes.length; i++) { - if (!child.isSlim && !child.__eventsInitialized && Slim.interactionEventNames.indexOf(child.attributes[i].nodeName) >= 0) { - child.isInteractive = true; - child.handleEvent = self.handleEvent.bind(child); - child.callAttribute = self.callAttribute.bind(child); - child.addEventListener(child.attributes[i].nodeName, child.handleEvent); - child.__eventsInitialized = true; - } - var desc = Slim.__processAttribute(child.attributes[i], child); - if (desc) descriptors.push(desc); - child[Slim.__dashToCamel(child.attributes[i].nodeName)] = child.attributes[i].nodeValue; - if (child.attributes[i].nodeName.indexOf('#') == '0') { - var refName = child.attributes[i].nodeName.slice(1); - this[refName] = child; - } - } - - descriptors = descriptors.sort(function (a) { - if (a.type === 'I') { - return -1; - } else if (a.type === 'R') return 1;else if (a.type === 'C') return 2; - return 0; - }); - - descriptors.forEach(function (descriptor) { - if (descriptor.type === 'P' || descriptor.type === 'M' || descriptor.type === 'C') { - _this4.__bind(descriptor); - } else if (descriptor.type === 'I') { - Slim.__inject(descriptor); - } else if (descriptor.type === 'R') { - Slim.__createRepeater(descriptor); - _this4.__bind(descriptor); - } else if (descriptor.type === 'F') { - _this4.__bind(descriptor); - } - }); + _loop(child); } } catch (err) { _didIteratorError3 = true; @@ -902,8 +912,8 @@ var Slim = function (_CustomElement2) { // bind method-based text binds - var _loop = function _loop(_child) { - var match = _child.innerText.match(/\[\[(\w+)\((.+)\)]\]/g); + var _loop2 = function _loop2(child) { + var match = child.innerText.match(/\[\[(\w+)\((.+)\)]\]/g); if (match) { match.forEach(function (expression) { // group 1 -> method @@ -914,13 +924,13 @@ var Slim = function (_CustomElement2) { var descriptor = { type: 'TM', properties: props, - target: _child, + target: child, expression: expression, - source: _child._boundParent, - sourceText: _child.innerText, + source: child._boundParent, + sourceText: child.innerText, methodName: methodName }; - _child.sourceText = _child.innerText; + child.sourceText = child.innerText; _this4.__bind(descriptor); }); } @@ -932,9 +942,9 @@ var Slim = function (_CustomElement2) { try { for (var _iterator4 = allChildren[Symbol.iterator](), _step4; !(_iteratorNormalCompletion4 = (_step4 = _iterator4.next()).done); _iteratorNormalCompletion4 = true) { - var _child = _step4.value; + var child = _step4.value; - _loop(_child); + _loop2(child); } // bind property based text binds } catch (err) { @@ -958,25 +968,25 @@ var Slim = function (_CustomElement2) { try { for (var _iterator5 = allChildren[Symbol.iterator](), _step5; !(_iteratorNormalCompletion5 = (_step5 = _iterator5.next()).done); _iteratorNormalCompletion5 = true) { - var _child2 = _step5.value; + var child = _step5.value; - var _match = _child2.innerText.match(/\[\[([\w|.]+)\]\]/g); - if (_match && _child2.children.firstChild) { - throw 'Bind Error: Illegal bind attribute use on element type ' + _child2.localName + ' with nested children.\n' + _child2.outerHTML; + var _match = child.innerText.match(/\[\[([\w|.]+)\]\]/g); + if (_match && child.children.firstChild) { + throw 'Bind Error: Illegal bind attribute use on element type ' + child.localName + ' with nested children.\n' + child.outerHTML; } if (_match) { var properties = []; - for (var _i = 0; _i < _match.length; _i++) { - var lookup = _match[_i].match(/([^\[].+[^\]])/)[0]; + for (var i = 0; i < _match.length; i++) { + var lookup = _match[i].match(/([^\[].+[^\]])/)[0]; properties.push(lookup); } var descriptor = { type: 'T', properties: properties, - target: _child2, - sourceText: _child2.innerText + target: child, + sourceText: child.innerText }; - _child2.sourceText = _child2.innerText; + child.sourceText = child.innerText; this.__bind(descriptor); } } @@ -1332,8 +1342,29 @@ Slim.__initRepeater = function () { var _this7 = this; var targetPropName = this.getAttribute('target-attr'); + var sourceData = this.sourceData; this.clones.forEach(function (clone, idx) { clone[targetPropName] = _this7.sourceData[idx]; + clone.data_index = idx; + clone.data_source = sourceData; + Slim.selectorToArr(clone, '*').forEach(function (element) { + element[targetPropName] = sourceData[idx]; + element.data_index = idx; + element.data_source = sourceData; + }); + if (clone.isSlim) { + clone.update(); + } + }); + this.clones[0]._boundProperties && Object.keys(this.clones[0]._boundProperties).forEach(function (prop) { + try { + _this7._boundParent._executeBindings(prop.split('.')[0]); + } catch (err) {/* swallow error */} + }); + Slim.selectorToArr(this.clones[0], '*').forEach(function (element) { + try { + _this7._boundParent._executeBindings(prop.split('.')[0]); + } catch (err) {/* swallow error */} }); this._executeBindings(); } @@ -1342,20 +1373,26 @@ Slim.__initRepeater = function () { value: function renderList() { if (!this.sourceNode) return; this.sourceData.registerSlimRepeater(this); - // if (this.clones && this.clones.length >= this.sourceData.length) { - // this.updateExistingList(); - // let leftovers = this.clones.splice(this.sourceData.length); - // leftovers.forEach(leftover => { - // Slim.removeChild(leftover); - // }); - // return; - // } - // if (this.clones && this.clones.length < this.sourceData.length) { - // this.updateExistingList(); - // let remaining = this.sourceData.splice(this.clones.length); - // this.createItems(remaining); - // return; - // } + + if (this.clones && this.clones.length === this.sourceData.length && this.sourceData.length > 0) { + this.updateExistingList(); + return; + } + + if (this.clones && this.clones.length > this.sourceData.length && this.sourceData.length > 0) { + var leftovers = this.clones.splice(this.sourceData.length); + leftovers.forEach(function (leftover) { + Slim.removeChild(leftover); + }); + this.updateExistingList(); + return; + } + if (this.clones && this.clones.length < this.sourceData.length && this.clones.length > 0) { + this.updateExistingList(); + var remaining = this.sourceData.slice(this.clones.length); + this.createItems(remaining); + return; + } this.clearList(); this.createItems(this.sourceData); } @@ -1366,6 +1403,7 @@ Slim.__initRepeater = function () { var targetPropName = this.getAttribute('target-attr'); var offset = this.clones.length; + var newClones = []; sourceData.forEach(function (dataItem, index) { var clone = _this8.sourceNode.cloneNode(true); clone.removeAttribute('slim-repeat'); @@ -1382,11 +1420,11 @@ Slim.__initRepeater = function () { if (Slim.__isWCSupported) { _this8.insertAdjacentElement('beforeEnd', clone); } - _this8.clones.push(clone); + newClones.push(clone); }); if (this._virtualDOM) this._captureBindings(); - var _loop2 = function _loop2(clone) { + var _loop3 = function _loop3(clone) { clone[targetPropName] = clone[targetPropName]; clone._boundRepeaterParent = _this8._boundParent; if (Slim.__prototypeDict[clone.localName] !== undefined || clone.isSlim) { @@ -1398,7 +1436,7 @@ Slim.__initRepeater = function () { element._boundParent = clone._boundParent; element._boundRepeaterParent = clone._boundRepeaterParent; element[targetPropName] = clone[targetPropName]; - element.data_index = clone.data_index; + element.data_index = clone.data_index + offset; element.data_source = clone.data_source; }); }; @@ -1408,10 +1446,10 @@ Slim.__initRepeater = function () { var _iteratorError6 = undefined; try { - for (var _iterator6 = this.clones[Symbol.iterator](), _step6; !(_iteratorNormalCompletion6 = (_step6 = _iterator6.next()).done); _iteratorNormalCompletion6 = true) { + for (var _iterator6 = newClones[Symbol.iterator](), _step6; !(_iteratorNormalCompletion6 = (_step6 = _iterator6.next()).done); _iteratorNormalCompletion6 = true) { var clone = _step6.value; - _loop2(clone); + _loop3(clone); } } catch (err) { _didIteratorError6 = true; @@ -1428,6 +1466,11 @@ Slim.__initRepeater = function () { } } + if (!this.clones) { + this.clones = []; + } + this.clones = this.clones.concat(newClones); + this._executeBindings(); if (this._isAdjacentRepeater) { this._virtualDOM && Slim.__moveChildrenBefore(this._virtualDOM, this, true); diff --git a/Slim.min.js b/Slim.min.js index e8f5e31..7a79351 100644 --- a/Slim.min.js +++ b/Slim.min.js @@ -1 +1 @@ -"use strict";var _createClass=function(){function defineProperties(target,props){for(var i=0;i')}},{key:"tag",value:function tag(_tag,clazzOrTemplate,clazz){if(clazz===undefined){clazz=clazzOrTemplate}else{Slim.__templateDict[_tag]=clazzOrTemplate}Slim.__prototypeDict[_tag]=clazz;if(Slim.__prototypeDict["slim-repeat"]===undefined){Slim.__initRepeater()}setTimeout(function(){document.registerElement(_tag,clazz)},0)}},{key:"getTag",value:function getTag(clazz){for(var tag in Slim.__prototypeDict){if(Slim.__prototypeDict[tag]===clazz)return tag}}},{key:"__createUqIndex",value:function __createUqIndex(){Slim.__uqIndex++;return Slim.__uqIndex.toString(16)}},{key:"plugin",value:function plugin(phase,_plugin){if(["create","beforeRender","beforeRemove","afterRender"].indexOf(phase)===-1){throw"Supported phase can be create, beforeRemove, beforeRender or afterRender only"}Slim.__plugins[phase].push(_plugin)}},{key:"registerCustomAttribute",value:function registerCustomAttribute(attr,fn){Slim.__customAttributeProcessors[attr]=Slim.__customAttributeProcessors[attr]||[];Slim.__customAttributeProcessors[attr].push(fn)}},{key:"__runPlugins",value:function __runPlugins(phase,element){Slim.__plugins[phase].forEach(function(fn){fn(element)})}},{key:"removeChild",value:function removeChild(target){if(target.remove){target.remove()}if(target.parentNode){target.parentNode.removeChild(target)}if(target.__ieClone){Slim.removeChild(target.__ieClone)}if(target._boundChildren){target._boundChildren.forEach(function(child){if(child.__ieClone){Slim.removeChild(child.__ieClone)}})}}},{key:"__moveChildrenBefore",value:function __moveChildrenBefore(source,target,activate){while(source.firstChild){target.parentNode.insertBefore(source.firstChild,target)}var children=Slim.selectorToArr(target,"*");var _iteratorNormalCompletion=true;var _didIteratorError=false;var _iteratorError=undefined;try{for(var _iterator=children[Symbol.iterator](),_step;!(_iteratorNormalCompletion=(_step=_iterator.next()).done);_iteratorNormalCompletion=true){var child=_step.value;if(activate&&child.isSlim){child.createdCallback()}}}catch(err){_didIteratorError=true;_iteratorError=err}finally{try{if(!_iteratorNormalCompletion&&_iterator.return){_iterator.return()}}finally{if(_didIteratorError){throw _iteratorError}}}}},{key:"__moveChildren",value:function __moveChildren(source,target,activate){while(source.firstChild){target.appendChild(source.firstChild)}var children=Slim.selectorToArr(target,"*");var _iteratorNormalCompletion2=true;var _didIteratorError2=false;var _iteratorError2=undefined;try{for(var _iterator2=children[Symbol.iterator](),_step2;!(_iteratorNormalCompletion2=(_step2=_iterator2.next()).done);_iteratorNormalCompletion2=true){var child=_step2.value;if(activate&&child.isSlim){child.createdCallback()}}}catch(err){_didIteratorError2=true;_iteratorError2=err}finally{try{if(!_iteratorNormalCompletion2&&_iterator2.return){_iterator2.return()}}finally{if(_didIteratorError2){throw _iteratorError2}}}}},{key:"__lookup",value:function __lookup(obj,desc){var arr=desc.split(".");var prop=arr[0];while(arr.length&&obj){obj=obj[prop=arr.shift()]}return{source:desc,prop:prop,obj:obj}}},{key:"__inject",value:function __inject(descriptor){try{descriptor.target[Slim.__dashToCamel(descriptor.attribute)]=Slim.__injections[descriptor.factory](descriptor.target)}catch(err){console.error("Could not inject "+descriptor.attribute+" into "+descriptor.target);console.info("Descriptor ",descriptor);throw err}}},{key:"inject",value:function inject(name,injector){Slim.__injections[name]=injector}},{key:"__createRepeater",value:function __createRepeater(descriptor){var repeater=void 0;repeater=document.createElement("slim-repeat");repeater.sourceNode=descriptor.target;descriptor.target.repeater=repeater;descriptor.target.parentNode.insertBefore(repeater,descriptor.target);descriptor.repeater=repeater;repeater._boundParent=descriptor.source;descriptor.target.parentNode.removeChild(descriptor.target);repeater._isAdjacentRepeater=descriptor.repeatAdjacent;repeater.setAttribute("source",descriptor.properties[0]);repeater.setAttribute("target-attr",descriptor.targetAttribute);descriptor.repeater=repeater}},{key:"__dashToCamel",value:function __dashToCamel(dash){return dash.indexOf("-")<0?dash:dash.replace(/-[a-z]/g,function(m){return m[1].toUpperCase()})}},{key:"__camelToDash",value:function __camelToDash(camel){return camel.replace(/([A-Z])/g,"-$1").toLowerCase()}},{key:"interactionEventNames",get:function get(){return["click","mouseover","mouseout","mousemove","mouseenter","mousedown","mouseup","dblclick","contextmenu","wheel","mouseleave","select","pointerlockchange","pointerlockerror","focus","blur","input","error","invalid","animationstart","animationend","animationiteration","reset","submit","resize","scroll","keydown","keypress","keyup","change"]}}]);function Slim(){_classCallCheck(this,Slim);var _this=_possibleConstructorReturn(this,(Slim.__proto__||Object.getPrototypeOf(Slim)).call(this));_this.createdCallback();return _this}_createClass(Slim,[{key:"find",value:function find(selector){return this.rootElement.querySelector(selector)}},{key:"findAll",value:function findAll(selector){return Slim.selectorToArr(this.rootElemnt,selector)}},{key:"watch",value:function watch(prop,executor){var descriptor={type:"W",properties:[prop],executor:executor,target:this,source:this};this._bindings=this._bindings||{};this._boundParent=this._boundParent||this;this.__bind(descriptor)}},{key:"callAttribute",value:function callAttribute(attributeName,value){if(!this._boundParent){throw"Unable to call attribute-bound method when no bound parent available"}var fnName=this.getAttribute(attributeName);if(fnName===null){console.warn&&console.warn("Unable to call null attribute-bound method on bound parent "+this._boundParent.outerHTML);return}if(typeof this._boundParent[fnName]==="function"){this._boundParent[fnName](value)}else if(this._boundParent&&this._boundParent._boundParent&&typeof this._boundParent._boundParent[fnName]==="function"){this._boundParent._boundParent[fnName](value)}else if(this._boundRepeaterParent&&typeof this._boundRepeaterParent[fnName]==="function"){this._boundRepeaterParent[fnName](value)}else{throw"Unable to call attribute-bound method: "+fnName+" on bound parent "+this._boundParent.outerHTML+" with value "+value}if(typeof this.update==="function"&&(this.isInteractive||Slim.autoAttachInteractionEvents||this.getAttribute("interactive"))){this.update()}}},{key:"__propertyChanged",value:function __propertyChanged(property,value){if(typeof this[property+"Changed"]==="function"){this[property+"Changed"](value)}}},{key:"__bind",value:function __bind(descriptor){descriptor.properties.forEach(function(prop){var rootProp=void 0;if(prop.indexOf(".")>0){rootProp=prop.split(".")[0]}else{rootProp=prop}var source=descriptor.source||descriptor.target._boundParent||descriptor.parentNode;source._bindings=source._bindings||{};source._bindings[rootProp]=source._bindings[rootProp]||{value:source[rootProp],executors:[]};if(!source.__lookupGetter__(rootProp))source.__defineGetter__(rootProp,function(){return this._bindings[rootProp].value});var originalSetter=source.__lookupSetter__(rootProp);var newSetter=function newSetter(x){this._bindings[rootProp].value=x;if(descriptor.sourceText){descriptor.target.innerText=descriptor.sourceText}this._executeBindings(rootProp);this.__propertyChanged(rootProp,x)};newSetter.isBindingSetter=true;if(!originalSetter){source.__defineSetter__(rootProp,newSetter)}else if(originalSetter&&!originalSetter.isBindingSetter){source.__defineSetter__(rootProp,function(x){originalSetter.call(this,x);newSetter.call(this,x)});source.__lookupSetter__(rootProp).isBindingSetter=true}var executor=void 0;if(descriptor.type==="C"){executor=function executor(){descriptor.executor()}}else if(descriptor.type==="P"){executor=function executor(){var targets=void 0;if(!descriptor.target.hasAttribute("slim-repeat")){targets=[descriptor.target]}else{targets=descriptor.target.repeater.clones}if(targets){var sourceRef=descriptor.target._boundRepeaterParent;var value=Slim.__lookup(sourceRef||source,prop).obj||Slim.__lookup(descriptor.target,prop).obj;var attrName=Slim.__dashToCamel(descriptor.attribute);targets.forEach(function(target){target[attrName]=value;target.setAttribute(descriptor.attribute,value)})}}}else if(descriptor.type==="M"){executor=function executor(){var targets=[descriptor.target];if(descriptor.target.hasAttribute("slim-repeat")){targets=descriptor.target.repeater.clones}var sourceRef=descriptor.target._boundRepeaterParent||source;var value=sourceRef[descriptor.method].apply(sourceRef,descriptor.properties.map(function(prop){return descriptor.target[prop]||sourceRef[prop]}));var attrName=Slim.__dashToCamel(descriptor.attribute);targets.forEach(function(target){target[attrName]=value;target.setAttribute(descriptor.attribute,value)})}}else if(descriptor.type==="T"){executor=function executor(){var source=descriptor.target._boundParent;descriptor.target._innerText=descriptor.target._innerText.replace("[["+prop+"]]",Slim.__lookup(source,prop).obj)}}else if(descriptor.type==="TM"){executor=function executor(){var values=descriptor.properties.map(function(compoundProp){return Slim.__lookup(source,compoundProp).obj});try{var value=source[descriptor.methodName].apply(source,values);descriptor.target._innerText=descriptor.target._innerText.replace(descriptor.expression,value)}catch(exc){console.error("Could not execute function "+descriptor.methodName+" in element "+descriptor.source.localName);console.info(exc)}}}else if(descriptor.type==="R"){executor=function executor(){descriptor.repeater.renderList()}}else if(descriptor.type==="W"){executor=function executor(){descriptor.executor(Slim.__lookup(source,prop).obj)}}else if(descriptor.type==="F"){executor=function executor(){var value=!!Slim.__lookup(descriptor.source,prop).obj;if(descriptor.reversed){value=!value}if(!value){if(descriptor.target.parentNode){descriptor.target.insertAdjacentElement("beforeBegin",descriptor.helper);Slim.removeChild(descriptor.target)}}else{if(!descriptor.target.parentNode){descriptor.helper.insertAdjacentElement("beforeBegin",descriptor.target);if(descriptor.target.isSlim){descriptor.target.createdCallback()}Slim.removeChild(descriptor.helper)}}}}executor.descriptor=descriptor;source._bindings[rootProp].executors.push(executor)})}},{key:"createdCallback",value:function createdCallback(){if(this.isVirtual)return;if(this.__createdCallbackRunOnce)return;this.__createdCallbackRunOnce=true;this.initialize();this.onBeforeCreated();this._captureBindings();Slim.__runPlugins("create",this);this.onCreated();this.__onCreatedComplete=true;this.onBeforeRender();Slim.__runPlugins("beforeRender",this);Slim.__moveChildren(this._virtualDOM,this.rootElement,true);this.onAfterRender();Slim.__runPlugins("afterRender",this);this.update()}},{key:"detachedCallback",value:function detachedCallback(){Slim.__runPlugins("beforeRemove",this);this.onRemoved()}},{key:"_initInteractiveEvents",value:function _initInteractiveEvents(){var _this2=this;if(!this.__eventsInitialized&&(Slim.autoAttachInteractionEvents||this.isInteractive||this.hasAttribute("interactive")))Slim.interactionEventNames.forEach(function(eventType){_this2.addEventListener(eventType,function(e){_this2.handleEvent(e)})})}},{key:"initialize",value:function initialize(){this.uq_index=Slim.__createUqIndex();this.setAttribute("slim-uq",this.uq_index);this._bindings=this._bindings||{};this._boundChildren=this._boundChildren||[];this._initInteractiveEvents();this.__eventsInitialized=true;this.alternateTemplate=this.alternateTemplate||null;this._virtualDOM=this._virtualDOM||document.createDocumentFragment()}},{key:"handleEvent",value:function handleEvent(e){if(this.hasAttribute("on"+e.type)){this.callAttribute("on"+e.type,e)}else if(this.hasAttribute(e.type)){this.callAttribute(e.type,e)}}},{key:"connectedCallback",value:function connectedCallback(){this.attachedCallback()}},{key:"disconnectedCallback",value:function disconnectedCallback(){this.detachedCallback()}},{key:"attachedCallback",value:function attachedCallback(){this.onAdded()}},{key:"attributeChangedCallback",value:function attributeChangedCallback(attr,oldValue,newValue){if(oldValue===newValue)return;if(!this._bindings)return;if(this._bindings[attr]){this[Slim.__dashToCamel(attr)]=newValue}}},{key:"onAdded",value:function onAdded(){}},{key:"onRemoved",value:function onRemoved(){}},{key:"onBeforeCreated",value:function onBeforeCreated(){}},{key:"onCreated",value:function onCreated(){}},{key:"onBeforeRender",value:function onBeforeRender(){}},{key:"onAfterRender",value:function onAfterRender(){}},{key:"onBeforeUpdate",value:function onBeforeUpdate(){}},{key:"onAfterUpdate",value:function onAfterUpdate(){}},{key:"update",value:function update(){this.onBeforeUpdate();this._executeBindings();this.onAfterUpdate()}},{key:"render",value:function render(template){Slim.__runPlugins("beforeRender",this);this.onBeforeRender();this.alternateTemplate=template;this.initialize();this.rootElement.innerHTML="";this._captureBindings();this._executeBindings();Slim.__moveChildren(this._virtualDOM,this.rootElement,true);this.onAfterRender();Slim.__runPlugins("afterRender",this)}},{key:"_executeBindings",value:function _executeBindings(prop){var _this3=this;if(!this._bindings)return;this._boundChildren.forEach(function(child){if(child.hasAttribute("bind")&&child.sourceText!==undefined){child._innerText=child.sourceText}});var properties=prop?[prop]:Object.keys(this._bindings);properties.forEach(function(property){_this3._bindings[property].executors.forEach(function(fn){if(fn.descriptor.type!=="T"&&fn.descriptor.type!=="TM")fn()})});Object.keys(this._bindings).forEach(function(property){_this3._bindings[property].executors.forEach(function(fn){if(fn.descriptor.type==="T"||fn.descriptor.type==="TM"){fn()}});_this3._bindings[property].executors.forEach(function(fn){if(fn.descriptor.type==="T"||fn.descriptor.type==="TM"){fn.descriptor.target.innerText=fn.descriptor.target._innerText;if(fn.descriptor.target.__ieClone){fn.descriptor.target.__ieClone.innerText=fn.descriptor.target.innerText}}})})}},{key:"_captureBindings",value:function _captureBindings(){var _this4=this;var self=this;var $tpl=this.alternateTemplate||this.template;if(!$tpl){while(this.firstChild){self._virtualDOM=this._virtualDOM||document.createDocumentFragment();self._virtualDOM.appendChild(this.firstChild)}}else if(typeof $tpl==="string"){var frag=document.createRange().createContextualFragment($tpl);while(frag.firstChild){this._virtualDOM.appendChild(frag.firstChild)}var virtualContent=this._virtualDOM.querySelector("slim-content");if(virtualContent){while(self.firstChild){self.firstChild._boundParent=this.firstChild._boundParent||this;virtualContent.appendChild(this.firstChild)}}}var allChildren=Slim.selectorToArr(this._virtualDOM,"*");var _iteratorNormalCompletion3=true;var _didIteratorError3=false;var _iteratorError3=undefined;try{for(var _iterator3=allChildren[Symbol.iterator](),_step3;!(_iteratorNormalCompletion3=(_step3=_iterator3.next()).done);_iteratorNormalCompletion3=true){var child=_step3.value;child._sourceOuterHTML=child.outerHTML;child._boundParent=child._boundParent||this;self._boundChildren=this._boundChildren||[];self._boundChildren.push(child);self._boundChildren.push(child);if(child.localName==="style"&&this.useShadow){Slim.__processStyleNode(child,this.localName,this.uq_index)}if(child.getAttribute("slim-id")){child._boundParent[Slim.__dashToCamel(child.getAttribute("slim-id"))]=child}var slimID=child.getAttribute("slim-id");if(slimID)this[slimID]=child;var descriptors=[];if(child.attributes)for(var i=0;i=0){child.isInteractive=true;child.handleEvent=self.handleEvent.bind(child);child.callAttribute=self.callAttribute.bind(child);child.addEventListener(child.attributes[i].nodeName,child.handleEvent);child.__eventsInitialized=true}var desc=Slim.__processAttribute(child.attributes[i],child);if(desc)descriptors.push(desc);child[Slim.__dashToCamel(child.attributes[i].nodeName)]=child.attributes[i].nodeValue;if(child.attributes[i].nodeName.indexOf("#")=="0"){var refName=child.attributes[i].nodeName.slice(1);this[refName]=child}}descriptors=descriptors.sort(function(a){if(a.type==="I"){return-1}else if(a.type==="R")return 1;else if(a.type==="C")return 2;return 0});descriptors.forEach(function(descriptor){if(descriptor.type==="P"||descriptor.type==="M"||descriptor.type==="C"){_this4.__bind(descriptor)}else if(descriptor.type==="I"){Slim.__inject(descriptor)}else if(descriptor.type==="R"){Slim.__createRepeater(descriptor);_this4.__bind(descriptor)}else if(descriptor.type==="F"){_this4.__bind(descriptor)}})}}catch(err){_didIteratorError3=true;_iteratorError3=err}finally{try{if(!_iteratorNormalCompletion3&&_iterator3.return){_iterator3.return()}}finally{if(_didIteratorError3){throw _iteratorError3}}}allChildren=Slim.selectorToArr(this._virtualDOM,"*[bind]");var _loop=function _loop(_child){var match=_child.innerText.match(/\[\[(\w+)\((.+)\)]\]/g);if(match){match.forEach(function(expression){var matches=expression.match(Slim.rxMethod);var methodName=matches[1];var props=matches[3].split(" ").join("").split(",");var descriptor={type:"TM",properties:props,target:_child,expression:expression,source:_child._boundParent,sourceText:_child.innerText,methodName:methodName};_child.sourceText=_child.innerText;_this4.__bind(descriptor)})}};var _iteratorNormalCompletion4=true;var _didIteratorError4=false;var _iteratorError4=undefined;try{for(var _iterator4=allChildren[Symbol.iterator](),_step4;!(_iteratorNormalCompletion4=(_step4=_iterator4.next()).done);_iteratorNormalCompletion4=true){var _child=_step4.value;_loop(_child)}}catch(err){_didIteratorError4=true;_iteratorError4=err}finally{try{if(!_iteratorNormalCompletion4&&_iterator4.return){_iterator4.return()}}finally{if(_didIteratorError4){throw _iteratorError4}}}var _iteratorNormalCompletion5=true;var _didIteratorError5=false;var _iteratorError5=undefined;try{for(var _iterator5=allChildren[Symbol.iterator](),_step5;!(_iteratorNormalCompletion5=(_step5=_iterator5.next()).done);_iteratorNormalCompletion5=true){var _child2=_step5.value;var _match=_child2.innerText.match(/\[\[([\w|.]+)\]\]/g);if(_match&&_child2.children.firstChild){throw"Bind Error: Illegal bind attribute use on element type "+_child2.localName+" with nested children.\n"+_child2.outerHTML}if(_match){var properties=[];for(var _i=0;_i<_match.length;_i++){var lookup=_match[_i].match(/([^\[].+[^\]])/)[0];properties.push(lookup)}var descriptor={type:"T",properties:properties,target:_child2,sourceText:_child2.innerText};_child2.sourceText=_child2.innerText;this.__bind(descriptor)}}}catch(err){_didIteratorError5=true;_iteratorError5=err}finally{try{if(!_iteratorNormalCompletion5&&_iterator5.return){_iterator5.return()}}finally{if(_didIteratorError5){throw _iteratorError5}}}}},{key:"isVirtual",get:function get(){var node=this;while(node){node=node.parentNode;if(!node){return true}if(node.nodeName==="BODY"||node.host){return false}}return true}},{key:"useShadow",get:function get(){return false}},{key:"rootElement",get:function get(){if(this.useShadow&&this.createShadowRoot){this.__shadowRoot=this.__shadowRoot||this.createShadowRoot();return this.__shadowRoot}return this}},{key:"isSlim",get:function get(){return true}},{key:"template",get:function get(){return Slim.__templateDict[this.nodeName.toLowerCase()]||null}},{key:"isInteractive",get:function get(){return false}}],[{key:"__processStyleNode",value:function __processStyleNode(node,tag,uqIndex){if(Slim.__isWCSupported)return;var rxRules=/([^\r\n,{}]+)(,(?=[^}]*{)|\s*{)/g;var match=node.innerText.match(rxRules);if(match){match.forEach(function(selector){if(selector.indexOf(":host")<0){node.innerText=node.innerText.replace(selector,":host "+selector)}})}var customTagName=tag+'[slim-uq="'+uqIndex+'"]';node.innerText=node.innerText.replace(/\:host/g,customTagName);if(Slim.__isIE11){var ieClone=document.createElement("style");ieClone.type="text/css";node.__ieClone=ieClone;ieClone.innerText=node.innerText;while(ieClone.innerText.indexOf(" ")>=0){ieClone.innerText=ieClone.innerText.replace(" "," ")}document.head.appendChild(ieClone)}}},{key:"__processRepeater",value:function __processRepeater(attribute,child){return{type:"R",target:child,targetAttribute:child.getAttribute("slim-repeat-as")?child.getAttribute("slim-repeat-as"):"data",repeatAdjacent:child.hasAttribute("slim-repeat-adjacent")||child.localName==="option",attribute:attribute.nodeName,properties:[attribute.nodeValue],source:child._boundParent}}},{key:"__processCustomAttribute",value:function __processCustomAttribute(attribute,child){return{type:"C",target:child,properties:[attribute.nodeValue],executor:function executor(){Slim.__customAttributeProcessors[attribute.nodeName].forEach(function(customAttrProcessor){customAttrProcessor(child,attribute.nodeValue)})}}}},{key:"extract",value:function extract(target,expression){var rxInject=Slim.rxInject.exec(expression);var rxProp=Slim.rxProp.exec(expression);var rxMethod=Slim.rxMethod.exec(expression);if(rxProp){return target[rxProp[1]]}else if(rxMethod){return target[rxMethod[1]].apply(target,rxMethod[3].replace(" ","").split(","))}}},{key:"__processAttribute",value:function __processAttribute(attribute,child){if(attribute.nodeName==="slim-repeat"){return Slim.__processRepeater(attribute,child)}if(attribute.nodeName==="slim-if"){var propertyName=attribute.nodeValue;var reverse=false;if(attribute.nodeValue.charAt(0)==="!"){propertyName=propertyName.slice(1);reverse=true}return{type:"F",target:child,source:child._boundParent,helper:document.createElement("slim-if-helper"),reversed:reverse,properties:[propertyName]}}if(Slim.__customAttributeProcessors[attribute.nodeName]){return Slim.__processCustomAttribute(attribute,child)}var rxInject=Slim.rxInject.exec(attribute.nodeValue);var rxProp=Slim.rxProp.exec(attribute.nodeValue);var rxMethod=Slim.rxMethod.exec(attribute.nodeValue);if(rxMethod){return{type:"M",target:child,attribute:attribute.nodeName,method:rxMethod[1],properties:rxMethod[3].replace(" ","").split(",")}}else if(rxProp){return{type:"P",target:child,attribute:attribute.nodeName,properties:[rxProp[1]]}}else if(rxInject){return{type:"I",target:child,attribute:attribute.nodeName,factory:rxInject[1]}}}}]);return Slim}(_CustomElement);Slim.rxInject=/\{(.+[^(\((.+)\))])\}/;Slim.rxProp=/\[\[(.+[^(\((.+)\))])\]\]/;Slim.rxMethod=/\[\[(.+)(\((.+)\)){1}\]\]/;Slim.__customAttributeProcessors={};Slim.__prototypeDict={};Slim.__uqIndex=0;Slim.__templateDict={};Slim.__injections={};Slim.__plugins={create:[],beforeRender:[],afterRender:[],beforeRemove:[]};try{Slim.__isWCSupported=function(){return"registerElement"in document&&"import"in document.createElement("link")&&"content"in document.createElement("template")}()}catch(err){Slim.__isWCSupported=false}try{Slim.__isIE11=function(){return!!window["MSInputMethodContext"]&&!!document["documentMode"]}()}catch(err){Slim.__isIE11=false}if(Slim.__isWCSupported&&NodeList.prototype.hasOwnProperty("forEach")){Slim.selectorToArr=function(target,selector){return target.querySelectorAll(selector)}}else{Slim.selectorToArr=function(target,selector){return Array.prototype.slice.call(target.querySelectorAll(selector))}}Slim.__initRepeater=function(){var SlimRepeater=function(_Slim){_inherits(SlimRepeater,_Slim);function SlimRepeater(){_classCallCheck(this,SlimRepeater);return _possibleConstructorReturn(this,(SlimRepeater.__proto__||Object.getPrototypeOf(SlimRepeater)).apply(this,arguments))}_createClass(SlimRepeater,[{key:"onAdded",value:function onAdded(){if(!this.uq_index){this.createdCallback()}this.renderList()}},{key:"onRemoved",value:function onRemoved(){this.sourceData.unregisterSlimRepeater(this)}},{key:"registerForRender",value:function registerForRender(){var _this6=this;if(this.pendingRender)return;this.pendingRender=true;setTimeout(function(){_this6.checkoutRender()},0)}},{key:"checkoutRender",value:function checkoutRender(){this.pendingRender=false;this.renderList()}},{key:"clearList",value:function clearList(){this.clones&&this.clones.forEach(function(clone){Slim.removeChild(clone)});this.clones=[]}},{key:"updateExistingList",value:function updateExistingList(){var _this7=this;var targetPropName=this.getAttribute("target-attr");this.clones.forEach(function(clone,idx){clone[targetPropName]=_this7.sourceData[idx]});this._executeBindings()}},{key:"renderList",value:function renderList(){if(!this.sourceNode)return;this.sourceData.registerSlimRepeater(this);this.clearList();this.createItems(this.sourceData)}},{key:"createItems",value:function createItems(sourceData){var _this8=this;var targetPropName=this.getAttribute("target-attr");var offset=this.clones.length;sourceData.forEach(function(dataItem,index){var clone=_this8.sourceNode.cloneNode(true);clone.removeAttribute("slim-repeat");clone.removeAttribute("slim-repeat-as");clone.setAttribute("slim-repeat-index",index+offset);if(!Slim.__isWCSupported){_this8.insertAdjacentHTML("beforeEnd",clone.outerHTML);clone=_this8.find('*[slim-repeat-index="'+index.toString()+'"]')}clone[targetPropName]=dataItem;clone.data_index=index+offset;clone.data_source=_this8.sourceData;clone.sourceText=clone.innerText;if(Slim.__isWCSupported){_this8.insertAdjacentElement("beforeEnd",clone)}_this8.clones.push(clone)});if(this._virtualDOM)this._captureBindings();var _loop2=function _loop2(clone){clone[targetPropName]=clone[targetPropName];clone._boundRepeaterParent=_this8._boundParent;if(Slim.__prototypeDict[clone.localName]!==undefined||clone.isSlim){clone._boundParent=_this8._boundParent}else{clone._boundParent=clone}Slim.selectorToArr(clone,"*").forEach(function(element){element._boundParent=clone._boundParent;element._boundRepeaterParent=clone._boundRepeaterParent;element[targetPropName]=clone[targetPropName];element.data_index=clone.data_index;element.data_source=clone.data_source})};var _iteratorNormalCompletion6=true;var _didIteratorError6=false;var _iteratorError6=undefined;try{for(var _iterator6=this.clones[Symbol.iterator](),_step6;!(_iteratorNormalCompletion6=(_step6=_iterator6.next()).done);_iteratorNormalCompletion6=true){var clone=_step6.value;_loop2(clone)}}catch(err){_didIteratorError6=true;_iteratorError6=err}finally{try{if(!_iteratorNormalCompletion6&&_iterator6.return){_iterator6.return()}}finally{if(_didIteratorError6){throw _iteratorError6}}}this._executeBindings();if(this._isAdjacentRepeater){this._virtualDOM&&Slim.__moveChildrenBefore(this._virtualDOM,this,true)}else{this._virtualDOM&&Slim.__moveChildren(this._virtualDOM,this,true)}}},{key:"useShadow",get:function get(){return false}},{key:"sourceData",get:function get(){try{var lookup=Slim.__lookup(this._boundParent,this.getAttribute("source"));return lookup.obj||[]}catch(err){return[]}}}]);return SlimRepeater}(Slim);Slim.tag("slim-repeat",SlimRepeater);window.SlimRepeater=SlimRepeater};window.Slim=Slim;(function(){var originals={};["push","pop","shift","unshift","splice","sort","reverse"].forEach(function(method){originals[method]=Array.prototype[method];Array.prototype[method]=function(){var result=originals[method].apply(this,arguments);if(this.registeredSlimRepeaters){this.registeredSlimRepeaters.forEach(function(repeater){repeater.registerForRender()})}return result}});Array.prototype.registerSlimRepeater=function(repeater){if(this.registeredSlimRepeaters===undefined){Object.defineProperty(this,"registeredSlimRepeaters",{enumerable:false,configurable:false,value:[]})}if(this.registeredSlimRepeaters.indexOf(repeater)<0){this.registeredSlimRepeaters.push(repeater)}};Array.prototype.unregisterSlimRepeater=function(repeater){if(this.registeredSlimRepeaters&&this.registeredSlimRepeaters.indexOf(repeater)>=0){this.registeredSlimRepeaters.splice(this.registeredSlimRepeaters.indexOf(repeater),1)}}})();if(typeof module!=="undefined"&&module.exports){module.exports.Slim=Slim} \ No newline at end of file +"use strict";var _createClass=function(){function defineProperties(target,props){for(var i=0;i')}},{key:"tag",value:function tag(_tag,clazzOrTemplate,clazz){if(clazz===undefined){clazz=clazzOrTemplate}else{Slim.__templateDict[_tag]=clazzOrTemplate}Slim.__prototypeDict[_tag]=clazz;if(Slim.__prototypeDict["slim-repeat"]===undefined){Slim.__initRepeater()}setTimeout(function(){document.registerElement(_tag,clazz)},0)}},{key:"getTag",value:function getTag(clazz){for(var tag in Slim.__prototypeDict){if(Slim.__prototypeDict[tag]===clazz)return tag}}},{key:"__createUqIndex",value:function __createUqIndex(){Slim.__uqIndex++;return Slim.__uqIndex.toString(16)}},{key:"plugin",value:function plugin(phase,_plugin){if(["create","beforeRender","beforeRemove","afterRender"].indexOf(phase)===-1){throw"Supported phase can be create, beforeRemove, beforeRender or afterRender only"}Slim.__plugins[phase].push(_plugin)}},{key:"registerCustomAttribute",value:function registerCustomAttribute(attr,fn){Slim.__customAttributeProcessors[attr]=Slim.__customAttributeProcessors[attr]||[];Slim.__customAttributeProcessors[attr].push(fn)}},{key:"__runPlugins",value:function __runPlugins(phase,element){Slim.__plugins[phase].forEach(function(fn){fn(element)})}},{key:"removeChild",value:function removeChild(target){if(target.remove){target.remove()}if(target.parentNode){target.parentNode.removeChild(target)}if(target.__ieClone){Slim.removeChild(target.__ieClone)}if(target._boundChildren){target._boundChildren.forEach(function(child){if(child.__ieClone){Slim.removeChild(child.__ieClone)}})}}},{key:"__moveChildrenBefore",value:function __moveChildrenBefore(source,target,activate){while(source.firstChild){target.parentNode.insertBefore(source.firstChild,target)}var children=Slim.selectorToArr(target,"*");var _iteratorNormalCompletion=true;var _didIteratorError=false;var _iteratorError=undefined;try{for(var _iterator=children[Symbol.iterator](),_step;!(_iteratorNormalCompletion=(_step=_iterator.next()).done);_iteratorNormalCompletion=true){var child=_step.value;if(activate&&child.isSlim){child.createdCallback()}}}catch(err){_didIteratorError=true;_iteratorError=err}finally{try{if(!_iteratorNormalCompletion&&_iterator.return){_iterator.return()}}finally{if(_didIteratorError){throw _iteratorError}}}}},{key:"__moveChildren",value:function __moveChildren(source,target,activate){while(source.firstChild){target.appendChild(source.firstChild)}var children=Slim.selectorToArr(target,"*");var _iteratorNormalCompletion2=true;var _didIteratorError2=false;var _iteratorError2=undefined;try{for(var _iterator2=children[Symbol.iterator](),_step2;!(_iteratorNormalCompletion2=(_step2=_iterator2.next()).done);_iteratorNormalCompletion2=true){var child=_step2.value;if(activate&&child.isSlim){child.createdCallback()}}}catch(err){_didIteratorError2=true;_iteratorError2=err}finally{try{if(!_iteratorNormalCompletion2&&_iterator2.return){_iterator2.return()}}finally{if(_didIteratorError2){throw _iteratorError2}}}}},{key:"__lookup",value:function __lookup(obj,desc){var arr=desc.split(".");var prop=arr[0];while(arr.length&&obj){obj=obj[prop=arr.shift()]}return{source:desc,prop:prop,obj:obj}}},{key:"__inject",value:function __inject(descriptor){try{descriptor.target[Slim.__dashToCamel(descriptor.attribute)]=Slim.__injections[descriptor.factory](descriptor.target)}catch(err){console.error("Could not inject "+descriptor.attribute+" into "+descriptor.target);console.info("Descriptor ",descriptor);throw err}}},{key:"inject",value:function inject(name,injector){Slim.__injections[name]=injector}},{key:"__createRepeater",value:function __createRepeater(descriptor){var repeater=void 0;repeater=document.createElement("slim-repeat");repeater.sourceNode=descriptor.target;descriptor.target.repeater=repeater;descriptor.target.parentNode.insertBefore(repeater,descriptor.target);descriptor.repeater=repeater;repeater._boundParent=descriptor.source;descriptor.target.parentNode.removeChild(descriptor.target);repeater._isAdjacentRepeater=descriptor.repeatAdjacent;repeater.setAttribute("source",descriptor.properties[0]);repeater.setAttribute("target-attr",descriptor.targetAttribute);descriptor.repeater=repeater}},{key:"__dashToCamel",value:function __dashToCamel(dash){return dash.indexOf("-")<0?dash:dash.replace(/-[a-z]/g,function(m){return m[1].toUpperCase()})}},{key:"__camelToDash",value:function __camelToDash(camel){return camel.replace(/([A-Z])/g,"-$1").toLowerCase()}},{key:"interactionEventNames",get:function get(){return["click","mouseover","mouseout","mousemove","mouseenter","mousedown","mouseup","dblclick","contextmenu","wheel","mouseleave","select","pointerlockchange","pointerlockerror","focus","blur","input","error","invalid","animationstart","animationend","animationiteration","reset","submit","resize","scroll","keydown","keypress","keyup","change"]}}]);function Slim(){_classCallCheck(this,Slim);var _this=_possibleConstructorReturn(this,(Slim.__proto__||Object.getPrototypeOf(Slim)).call(this));_this.createdCallback();return _this}_createClass(Slim,[{key:"find",value:function find(selector){return this.rootElement.querySelector(selector)}},{key:"findAll",value:function findAll(selector){return Slim.selectorToArr(this.rootElemnt,selector)}},{key:"watch",value:function watch(prop,executor){var descriptor={type:"W",properties:[prop],executor:executor,target:this,source:this};this._bindings=this._bindings||{};this._boundParent=this._boundParent||this;this.__bind(descriptor)}},{key:"callAttribute",value:function callAttribute(attributeName,value){if(!this._boundParent){throw"Unable to call attribute-bound method when no bound parent available"}var fnName=this.getAttribute(attributeName);if(fnName===null){console.warn&&console.warn("Unable to call null attribute-bound method on bound parent "+this._boundParent.outerHTML);return}if(typeof this._boundParent[fnName]==="function"){this._boundParent[fnName](value)}else if(this._boundParent&&this._boundParent._boundParent&&typeof this._boundParent._boundParent[fnName]==="function"){this._boundParent._boundParent[fnName](value)}else if(this._boundRepeaterParent&&typeof this._boundRepeaterParent[fnName]==="function"){this._boundRepeaterParent[fnName](value)}else{throw"Unable to call attribute-bound method: "+fnName+" on bound parent "+this._boundParent.outerHTML+" with value "+value}if(typeof this.update==="function"&&(this.isInteractive||Slim.autoAttachInteractionEvents||this.getAttribute("interactive"))){this.update()}}},{key:"__propertyChanged",value:function __propertyChanged(property,value){if(typeof this[property+"Changed"]==="function"){this[property+"Changed"](value)}}},{key:"__bind",value:function __bind(descriptor){descriptor.properties.forEach(function(prop){var rootProp=void 0;if(prop.indexOf(".")>0){rootProp=prop.split(".")[0]}else{rootProp=prop}var source=descriptor.source||descriptor.target._boundParent||descriptor.parentNode;source._bindings=source._bindings||{};source._bindings[rootProp]=source._bindings[rootProp]||{value:source[rootProp],executors:[]};if(!source.__lookupGetter__(rootProp))source.__defineGetter__(rootProp,function(){return this._bindings[rootProp].value});var originalSetter=source.__lookupSetter__(rootProp);var newSetter=function newSetter(x){this._bindings[rootProp].value=x;if(descriptor.sourceText){descriptor.target.innerText=descriptor.sourceText}this._executeBindings(rootProp);this.__propertyChanged(rootProp,x)};newSetter.isBindingSetter=true;if(!originalSetter){source.__defineSetter__(rootProp,newSetter)}else if(originalSetter&&!originalSetter.isBindingSetter){source.__defineSetter__(rootProp,function(x){originalSetter.call(this,x);newSetter.call(this,x)});source.__lookupSetter__(rootProp).isBindingSetter=true}var executor=void 0;if(descriptor.type==="C"){executor=function executor(){descriptor.executor()}}else if(descriptor.type==="P"){executor=function executor(){var targets=void 0;if(!descriptor.target.hasAttribute("slim-repeat")){targets=[descriptor.target]}else{targets=descriptor.target.repeater.clones}if(targets){var sourceRef=descriptor.target._boundRepeaterParent;var value=Slim.__lookup(sourceRef||source,prop).obj||Slim.__lookup(descriptor.target,prop).obj;var attrName=Slim.__dashToCamel(descriptor.attribute);targets.forEach(function(target){target[attrName]=value;target.setAttribute(descriptor.attribute,value)})}}}else if(descriptor.type==="M"){executor=function executor(){var targets=[descriptor.target];if(descriptor.target.hasAttribute("slim-repeat")){targets=descriptor.target.repeater.clones}var sourceRef=descriptor.target._boundRepeaterParent||source;var value=sourceRef[descriptor.method].apply(sourceRef,descriptor.properties.map(function(prop){return descriptor.target[prop]||sourceRef[prop]}));var attrName=Slim.__dashToCamel(descriptor.attribute);targets.forEach(function(target){target[attrName]=value;target.setAttribute(descriptor.attribute,value)})}}else if(descriptor.type==="T"){executor=function executor(){var source=descriptor.target._boundParent;descriptor.target._innerText=descriptor.target._innerText.replace("[["+prop+"]]",Slim.__lookup(source,prop).obj)}}else if(descriptor.type==="TM"){executor=function executor(){var values=descriptor.properties.map(function(compoundProp){return Slim.__lookup(source,compoundProp).obj});try{var value=source[descriptor.methodName].apply(source,values);descriptor.target._innerText=descriptor.target._innerText.replace(descriptor.expression,value)}catch(exc){console.error("Could not execute function "+descriptor.methodName+" in element "+descriptor.source.localName);console.info(exc)}}}else if(descriptor.type==="R"){executor=function executor(){descriptor.repeater.renderList()}}else if(descriptor.type==="W"){executor=function executor(){descriptor.executor(Slim.__lookup(source,prop).obj)}}else if(descriptor.type==="F"){executor=function executor(){var value=!!Slim.__lookup(descriptor.source,prop).obj;if(descriptor.reversed){value=!value}if(!value){if(descriptor.target.parentNode){descriptor.target.insertAdjacentElement("beforeBegin",descriptor.helper);Slim.removeChild(descriptor.target)}}else{if(!descriptor.target.parentNode){descriptor.helper.insertAdjacentElement("beforeBegin",descriptor.target);if(descriptor.target.isSlim){descriptor.target.createdCallback()}Slim.removeChild(descriptor.helper)}}}}executor.descriptor=descriptor;source._bindings[rootProp].executors.push(executor)})}},{key:"createdCallback",value:function createdCallback(){if(this.isVirtual)return;if(this.__createdCallbackRunOnce)return;this.__createdCallbackRunOnce=true;this.initialize();this.onBeforeCreated();this._captureBindings();Slim.__runPlugins("create",this);this.onCreated();this.__onCreatedComplete=true;this.onBeforeRender();Slim.__runPlugins("beforeRender",this);Slim.__moveChildren(this._virtualDOM,this.rootElement,true);this.onAfterRender();Slim.__runPlugins("afterRender",this);this.update()}},{key:"detachedCallback",value:function detachedCallback(){Slim.__runPlugins("beforeRemove",this);this.onRemoved()}},{key:"_initInteractiveEvents",value:function _initInteractiveEvents(){var _this2=this;if(!this.__eventsInitialized&&(Slim.autoAttachInteractionEvents||this.isInteractive||this.hasAttribute("interactive")))Slim.interactionEventNames.forEach(function(eventType){_this2.addEventListener(eventType,function(e){_this2.handleEvent(e)})})}},{key:"initialize",value:function initialize(){this.uq_index=Slim.__createUqIndex();this.setAttribute("slim-uq",this.uq_index);this._bindings=this._bindings||{};this._boundChildren=this._boundChildren||[];this._initInteractiveEvents();this.__eventsInitialized=true;this.alternateTemplate=this.alternateTemplate||null;this._virtualDOM=this._virtualDOM||document.createDocumentFragment()}},{key:"handleEvent",value:function handleEvent(e){if(this.hasAttribute("on"+e.type)){this.callAttribute("on"+e.type,e)}else if(this.hasAttribute(e.type)){this.callAttribute(e.type,e)}}},{key:"connectedCallback",value:function connectedCallback(){this.attachedCallback()}},{key:"disconnectedCallback",value:function disconnectedCallback(){this.detachedCallback()}},{key:"attachedCallback",value:function attachedCallback(){this.onAdded()}},{key:"attributeChangedCallback",value:function attributeChangedCallback(attr,oldValue,newValue){if(oldValue===newValue)return;if(!this._bindings)return;if(this._bindings[attr]){this[Slim.__dashToCamel(attr)]=newValue}}},{key:"onAdded",value:function onAdded(){}},{key:"onRemoved",value:function onRemoved(){}},{key:"onBeforeCreated",value:function onBeforeCreated(){}},{key:"onCreated",value:function onCreated(){}},{key:"onBeforeRender",value:function onBeforeRender(){}},{key:"onAfterRender",value:function onAfterRender(){}},{key:"onBeforeUpdate",value:function onBeforeUpdate(){}},{key:"onAfterUpdate",value:function onAfterUpdate(){}},{key:"update",value:function update(){this.onBeforeUpdate();this._executeBindings();this.onAfterUpdate()}},{key:"render",value:function render(template){Slim.__runPlugins("beforeRender",this);this.onBeforeRender();this.alternateTemplate=template;this.initialize();this.rootElement.innerHTML="";this._captureBindings();this._executeBindings();Slim.__moveChildren(this._virtualDOM,this.rootElement,true);this.onAfterRender();Slim.__runPlugins("afterRender",this)}},{key:"_executeBindings",value:function _executeBindings(prop){var _this3=this;if(!this._bindings)return;this._boundChildren.forEach(function(child){if(child.hasAttribute("bind")&&child.sourceText!==undefined){child._innerText=child.sourceText}});var properties=prop?[prop]:Object.keys(this._bindings);properties.forEach(function(property){_this3._bindings[property].executors.forEach(function(fn){if(fn.descriptor.type!=="T"&&fn.descriptor.type!=="TM")fn()})});Object.keys(this._bindings).forEach(function(property){_this3._bindings[property].executors.forEach(function(fn){if(fn.descriptor.type==="T"||fn.descriptor.type==="TM"){fn()}});_this3._bindings[property].executors.forEach(function(fn){if(fn.descriptor.type==="T"||fn.descriptor.type==="TM"){fn.descriptor.target.innerText=fn.descriptor.target._innerText;if(fn.descriptor.target.__ieClone){fn.descriptor.target.__ieClone.innerText=fn.descriptor.target.innerText}}})})}},{key:"_captureBindings",value:function _captureBindings(){var _this4=this;var self=this;var $tpl=this.alternateTemplate||this.template;if(!$tpl){while(this.firstChild){self._virtualDOM=this._virtualDOM||document.createDocumentFragment();self._virtualDOM.appendChild(this.firstChild)}}else if(typeof $tpl==="string"){var frag=document.createRange().createContextualFragment($tpl);while(frag.firstChild){this._virtualDOM.appendChild(frag.firstChild)}var virtualContent=this._virtualDOM.querySelector("slim-content");if(virtualContent){while(self.firstChild){self.firstChild._boundParent=this.firstChild._boundParent||this;virtualContent.appendChild(this.firstChild)}}}var allChildren=Slim.selectorToArr(this._virtualDOM,"*");var _loop=function _loop(child){child._sourceOuterHTML=child.outerHTML;child._boundParent=child._boundParent||_this4;self._boundChildren=_this4._boundChildren||[];self._boundChildren.push(child);self._boundChildren.push(child);if(child.localName==="style"&&_this4.useShadow){Slim.__processStyleNode(child,_this4.localName,_this4.uq_index)}if(child.getAttribute("slim-id")){child._boundParent[Slim.__dashToCamel(child.getAttribute("slim-id"))]=child}var slimID=child.getAttribute("slim-id");if(slimID)_this4[slimID]=child;var descriptors=[];if(child.attributes)for(var i=0;i=0){child.isInteractive=true;child.handleEvent=self.handleEvent.bind(child);child.callAttribute=self.callAttribute.bind(child);child.addEventListener(child.attributes[i].nodeName,child.handleEvent);child.__eventsInitialized=true}var desc=Slim.__processAttribute(child.attributes[i],child);if(desc)descriptors.push(desc);child[Slim.__dashToCamel(child.attributes[i].nodeName)]=child.attributes[i].nodeValue;if(child.attributes[i].nodeName.indexOf("#")=="0"){var refName=child.attributes[i].nodeName.slice(1);_this4[refName]=child}}descriptors=descriptors.sort(function(a){if(a.type==="I"){return-1}else if(a.type==="R")return 1;else if(a.type==="C")return 2;return 0});child._boundProperties={};descriptors.forEach(function(descriptor){descriptor.properties&&descriptor.properties.forEach(function(prop){child._boundProperties[prop]=true});if(descriptor.type==="P"||descriptor.type==="M"||descriptor.type==="C"){_this4.__bind(descriptor)}else if(descriptor.type==="I"){Slim.__inject(descriptor)}else if(descriptor.type==="R"){Slim.__createRepeater(descriptor);_this4.__bind(descriptor)}else if(descriptor.type==="F"){_this4.__bind(descriptor)}})};var _iteratorNormalCompletion3=true;var _didIteratorError3=false;var _iteratorError3=undefined;try{for(var _iterator3=allChildren[Symbol.iterator](),_step3;!(_iteratorNormalCompletion3=(_step3=_iterator3.next()).done);_iteratorNormalCompletion3=true){var child=_step3.value;_loop(child)}}catch(err){_didIteratorError3=true;_iteratorError3=err}finally{try{if(!_iteratorNormalCompletion3&&_iterator3.return){_iterator3.return()}}finally{if(_didIteratorError3){throw _iteratorError3}}}allChildren=Slim.selectorToArr(this._virtualDOM,"*[bind]");var _loop2=function _loop2(child){var match=child.innerText.match(/\[\[(\w+)\((.+)\)]\]/g);if(match){match.forEach(function(expression){var matches=expression.match(Slim.rxMethod);var methodName=matches[1];var props=matches[3].split(" ").join("").split(",");var descriptor={type:"TM",properties:props,target:child,expression:expression,source:child._boundParent,sourceText:child.innerText,methodName:methodName};child.sourceText=child.innerText;_this4.__bind(descriptor)})}};var _iteratorNormalCompletion4=true;var _didIteratorError4=false;var _iteratorError4=undefined;try{for(var _iterator4=allChildren[Symbol.iterator](),_step4;!(_iteratorNormalCompletion4=(_step4=_iterator4.next()).done);_iteratorNormalCompletion4=true){var child=_step4.value;_loop2(child)}}catch(err){_didIteratorError4=true;_iteratorError4=err}finally{try{if(!_iteratorNormalCompletion4&&_iterator4.return){_iterator4.return()}}finally{if(_didIteratorError4){throw _iteratorError4}}}var _iteratorNormalCompletion5=true;var _didIteratorError5=false;var _iteratorError5=undefined;try{for(var _iterator5=allChildren[Symbol.iterator](),_step5;!(_iteratorNormalCompletion5=(_step5=_iterator5.next()).done);_iteratorNormalCompletion5=true){var child=_step5.value;var _match=child.innerText.match(/\[\[([\w|.]+)\]\]/g);if(_match&&child.children.firstChild){throw"Bind Error: Illegal bind attribute use on element type "+child.localName+" with nested children.\n"+child.outerHTML}if(_match){var properties=[];for(var i=0;i<_match.length;i++){var lookup=_match[i].match(/([^\[].+[^\]])/)[0];properties.push(lookup)}var descriptor={type:"T",properties:properties,target:child,sourceText:child.innerText};child.sourceText=child.innerText;this.__bind(descriptor)}}}catch(err){_didIteratorError5=true;_iteratorError5=err}finally{try{if(!_iteratorNormalCompletion5&&_iterator5.return){_iterator5.return()}}finally{if(_didIteratorError5){throw _iteratorError5}}}}},{key:"isVirtual",get:function get(){var node=this;while(node){node=node.parentNode;if(!node){return true}if(node.nodeName==="BODY"||node.host){return false}}return true}},{key:"useShadow",get:function get(){return false}},{key:"rootElement",get:function get(){if(this.useShadow&&this.createShadowRoot){this.__shadowRoot=this.__shadowRoot||this.createShadowRoot();return this.__shadowRoot}return this}},{key:"isSlim",get:function get(){return true}},{key:"template",get:function get(){return Slim.__templateDict[this.nodeName.toLowerCase()]||null}},{key:"isInteractive",get:function get(){return false}}],[{key:"__processStyleNode",value:function __processStyleNode(node,tag,uqIndex){if(Slim.__isWCSupported)return;var rxRules=/([^\r\n,{}]+)(,(?=[^}]*{)|\s*{)/g;var match=node.innerText.match(rxRules);if(match){match.forEach(function(selector){if(selector.indexOf(":host")<0){node.innerText=node.innerText.replace(selector,":host "+selector)}})}var customTagName=tag+'[slim-uq="'+uqIndex+'"]';node.innerText=node.innerText.replace(/\:host/g,customTagName);if(Slim.__isIE11){var ieClone=document.createElement("style");ieClone.type="text/css";node.__ieClone=ieClone;ieClone.innerText=node.innerText;while(ieClone.innerText.indexOf(" ")>=0){ieClone.innerText=ieClone.innerText.replace(" "," ")}document.head.appendChild(ieClone)}}},{key:"__processRepeater",value:function __processRepeater(attribute,child){return{type:"R",target:child,targetAttribute:child.getAttribute("slim-repeat-as")?child.getAttribute("slim-repeat-as"):"data",repeatAdjacent:child.hasAttribute("slim-repeat-adjacent")||child.localName==="option",attribute:attribute.nodeName,properties:[attribute.nodeValue],source:child._boundParent}}},{key:"__processCustomAttribute",value:function __processCustomAttribute(attribute,child){return{type:"C",target:child,properties:[attribute.nodeValue],executor:function executor(){Slim.__customAttributeProcessors[attribute.nodeName].forEach(function(customAttrProcessor){customAttrProcessor(child,attribute.nodeValue)})}}}},{key:"extract",value:function extract(target,expression){var rxInject=Slim.rxInject.exec(expression);var rxProp=Slim.rxProp.exec(expression);var rxMethod=Slim.rxMethod.exec(expression);if(rxProp){return target[rxProp[1]]}else if(rxMethod){return target[rxMethod[1]].apply(target,rxMethod[3].replace(" ","").split(","))}}},{key:"__processAttribute",value:function __processAttribute(attribute,child){if(attribute.nodeName==="slim-repeat"){return Slim.__processRepeater(attribute,child)}if(attribute.nodeName==="slim-if"){var propertyName=attribute.nodeValue;var reverse=false;if(attribute.nodeValue.charAt(0)==="!"){propertyName=propertyName.slice(1);reverse=true}return{type:"F",target:child,source:child._boundParent,helper:document.createElement("slim-if-helper"),reversed:reverse,properties:[propertyName]}}if(Slim.__customAttributeProcessors[attribute.nodeName]){return Slim.__processCustomAttribute(attribute,child)}var rxInject=Slim.rxInject.exec(attribute.nodeValue);var rxProp=Slim.rxProp.exec(attribute.nodeValue);var rxMethod=Slim.rxMethod.exec(attribute.nodeValue);if(rxMethod){return{type:"M",target:child,attribute:attribute.nodeName,method:rxMethod[1],properties:rxMethod[3].replace(" ","").split(",")}}else if(rxProp){return{type:"P",target:child,attribute:attribute.nodeName,properties:[rxProp[1]]}}else if(rxInject){return{type:"I",target:child,attribute:attribute.nodeName,factory:rxInject[1]}}}}]);return Slim}(_CustomElement);Slim.rxInject=/\{(.+[^(\((.+)\))])\}/;Slim.rxProp=/\[\[(.+[^(\((.+)\))])\]\]/;Slim.rxMethod=/\[\[(.+)(\((.+)\)){1}\]\]/;Slim.__customAttributeProcessors={};Slim.__prototypeDict={};Slim.__uqIndex=0;Slim.__templateDict={};Slim.__injections={};Slim.__plugins={create:[],beforeRender:[],afterRender:[],beforeRemove:[]};try{Slim.__isWCSupported=function(){return"registerElement"in document&&"import"in document.createElement("link")&&"content"in document.createElement("template")}()}catch(err){Slim.__isWCSupported=false}try{Slim.__isIE11=function(){return!!window["MSInputMethodContext"]&&!!document["documentMode"]}()}catch(err){Slim.__isIE11=false}if(Slim.__isWCSupported&&NodeList.prototype.hasOwnProperty("forEach")){Slim.selectorToArr=function(target,selector){return target.querySelectorAll(selector)}}else{Slim.selectorToArr=function(target,selector){return Array.prototype.slice.call(target.querySelectorAll(selector))}}Slim.__initRepeater=function(){var SlimRepeater=function(_Slim){_inherits(SlimRepeater,_Slim);function SlimRepeater(){_classCallCheck(this,SlimRepeater);return _possibleConstructorReturn(this,(SlimRepeater.__proto__||Object.getPrototypeOf(SlimRepeater)).apply(this,arguments))}_createClass(SlimRepeater,[{key:"onAdded",value:function onAdded(){if(!this.uq_index){this.createdCallback()}this.renderList()}},{key:"onRemoved",value:function onRemoved(){this.sourceData.unregisterSlimRepeater(this)}},{key:"registerForRender",value:function registerForRender(){var _this6=this;if(this.pendingRender)return;this.pendingRender=true;setTimeout(function(){_this6.checkoutRender()},0)}},{key:"checkoutRender",value:function checkoutRender(){this.pendingRender=false;this.renderList()}},{key:"clearList",value:function clearList(){this.clones&&this.clones.forEach(function(clone){Slim.removeChild(clone)});this.clones=[]}},{key:"updateExistingList",value:function updateExistingList(){var _this7=this;var targetPropName=this.getAttribute("target-attr");var sourceData=this.sourceData;this.clones.forEach(function(clone,idx){clone[targetPropName]=_this7.sourceData[idx];clone.data_index=idx;clone.data_source=sourceData;Slim.selectorToArr(clone,"*").forEach(function(element){element[targetPropName]=sourceData[idx];element.data_index=idx;element.data_source=sourceData});if(clone.isSlim){clone.update()}});this.clones[0]._boundProperties&&Object.keys(this.clones[0]._boundProperties).forEach(function(prop){try{_this7._boundParent._executeBindings(prop.split(".")[0])}catch(err){}});Slim.selectorToArr(this.clones[0],"*").forEach(function(element){try{_this7._boundParent._executeBindings(prop.split(".")[0])}catch(err){}});this._executeBindings()}},{key:"renderList",value:function renderList(){if(!this.sourceNode)return;this.sourceData.registerSlimRepeater(this);if(this.clones&&this.clones.length===this.sourceData.length&&this.sourceData.length>0){this.updateExistingList();return}if(this.clones&&this.clones.length>this.sourceData.length&&this.sourceData.length>0){var leftovers=this.clones.splice(this.sourceData.length);leftovers.forEach(function(leftover){Slim.removeChild(leftover)});this.updateExistingList();return}if(this.clones&&this.clones.length0){this.updateExistingList();var remaining=this.sourceData.slice(this.clones.length);this.createItems(remaining);return}this.clearList();this.createItems(this.sourceData)}},{key:"createItems",value:function createItems(sourceData){var _this8=this;var targetPropName=this.getAttribute("target-attr");var offset=this.clones.length;var newClones=[];sourceData.forEach(function(dataItem,index){var clone=_this8.sourceNode.cloneNode(true);clone.removeAttribute("slim-repeat");clone.removeAttribute("slim-repeat-as");clone.setAttribute("slim-repeat-index",index+offset);if(!Slim.__isWCSupported){_this8.insertAdjacentHTML("beforeEnd",clone.outerHTML);clone=_this8.find('*[slim-repeat-index="'+index.toString()+'"]')}clone[targetPropName]=dataItem;clone.data_index=index+offset;clone.data_source=_this8.sourceData;clone.sourceText=clone.innerText;if(Slim.__isWCSupported){_this8.insertAdjacentElement("beforeEnd",clone)}newClones.push(clone)});if(this._virtualDOM)this._captureBindings();var _loop3=function _loop3(clone){clone[targetPropName]=clone[targetPropName];clone._boundRepeaterParent=_this8._boundParent;if(Slim.__prototypeDict[clone.localName]!==undefined||clone.isSlim){clone._boundParent=_this8._boundParent}else{clone._boundParent=clone}Slim.selectorToArr(clone,"*").forEach(function(element){element._boundParent=clone._boundParent;element._boundRepeaterParent=clone._boundRepeaterParent;element[targetPropName]=clone[targetPropName];element.data_index=clone.data_index+offset;element.data_source=clone.data_source})};var _iteratorNormalCompletion6=true;var _didIteratorError6=false;var _iteratorError6=undefined;try{for(var _iterator6=newClones[Symbol.iterator](),_step6;!(_iteratorNormalCompletion6=(_step6=_iterator6.next()).done);_iteratorNormalCompletion6=true){var clone=_step6.value;_loop3(clone)}}catch(err){_didIteratorError6=true;_iteratorError6=err}finally{try{if(!_iteratorNormalCompletion6&&_iterator6.return){_iterator6.return()}}finally{if(_didIteratorError6){throw _iteratorError6}}}if(!this.clones){this.clones=[]}this.clones=this.clones.concat(newClones);this._executeBindings();if(this._isAdjacentRepeater){this._virtualDOM&&Slim.__moveChildrenBefore(this._virtualDOM,this,true)}else{this._virtualDOM&&Slim.__moveChildren(this._virtualDOM,this,true)}}},{key:"useShadow",get:function get(){return false}},{key:"sourceData",get:function get(){try{var lookup=Slim.__lookup(this._boundParent,this.getAttribute("source"));return lookup.obj||[]}catch(err){return[]}}}]);return SlimRepeater}(Slim);Slim.tag("slim-repeat",SlimRepeater);window.SlimRepeater=SlimRepeater};window.Slim=Slim;(function(){var originals={};["push","pop","shift","unshift","splice","sort","reverse"].forEach(function(method){originals[method]=Array.prototype[method];Array.prototype[method]=function(){var result=originals[method].apply(this,arguments);if(this.registeredSlimRepeaters){this.registeredSlimRepeaters.forEach(function(repeater){repeater.registerForRender()})}return result}});Array.prototype.registerSlimRepeater=function(repeater){if(this.registeredSlimRepeaters===undefined){Object.defineProperty(this,"registeredSlimRepeaters",{enumerable:false,configurable:false,value:[]})}if(this.registeredSlimRepeaters.indexOf(repeater)<0){this.registeredSlimRepeaters.push(repeater)}};Array.prototype.unregisterSlimRepeater=function(repeater){if(this.registeredSlimRepeaters&&this.registeredSlimRepeaters.indexOf(repeater)>=0){this.registeredSlimRepeaters.splice(this.registeredSlimRepeaters.indexOf(repeater),1)}}})();if(typeof module!=="undefined"&&module.exports){module.exports.Slim=Slim} \ No newline at end of file diff --git a/example/stargazers/stargazers-demo.js b/example/stargazers/stargazers-demo.js index a6f4907..75c20db 100644 --- a/example/stargazers/stargazers-demo.js +++ b/example/stargazers/stargazers-demo.js @@ -2,7 +2,7 @@ Slim.tag('stargazers-demo', `

[[repoName]] Stargazers!

- +
@@ -60,7 +60,6 @@ Slim.tag('stargazers-demo', search() { this.repoName = this.myInput.value; - this.stargazers = []; this.runQuery(); } diff --git a/example/tests/test-repeater-flavours.html b/example/tests/test-repeater-flavours.html index 9ede11d..f2d5c5e 100644 --- a/example/tests/test-repeater-flavours.html +++ b/example/tests/test-repeater-flavours.html @@ -4,6 +4,35 @@ Test repeat flavours + + diff --git a/src/Slim.js b/src/Slim.js index 36e7e98..655b9c4 100644 --- a/src/Slim.js +++ b/src/Slim.js @@ -883,8 +883,13 @@ class Slim extends HTMLElement { return 0 }); + child._boundProperties = {}; + descriptors.forEach( descriptor => { + descriptor.properties && descriptor.properties.forEach( prop => { + child._boundProperties[prop] = true; + }); if (descriptor.type === 'P' || descriptor.type === 'M' || descriptor.type === 'C') { this.__bind(descriptor) } else if (descriptor.type === 'I') { @@ -1050,8 +1055,31 @@ Slim.__initRepeater = function() { updateExistingList() { let targetPropName = this.getAttribute('target-attr'); + const sourceData = this.sourceData; this.clones.forEach( (clone, idx) => { clone[targetPropName] = this.sourceData[idx]; + clone.data_index = idx; + clone.data_source = sourceData; + Slim.selectorToArr(clone, '*').forEach( element => { + element[targetPropName] = sourceData[idx]; + element.data_index = idx; + element.data_source = sourceData; + }); + if (clone.isSlim) { + clone.update(); + } + }); + this.clones[0]._boundProperties && Object.keys(this.clones[0]._boundProperties).forEach( prop => { + try { + this._boundParent._executeBindings(prop.split('.')[0]); + } + catch (err) { /* swallow error */ } + }); + Slim.selectorToArr(this.clones[0], '*').forEach( element => { + try { + this._boundParent._executeBindings(prop.split('.')[0]); + } + catch (err) { /* swallow error */ } }); this._executeBindings(); } @@ -1059,20 +1087,26 @@ Slim.__initRepeater = function() { renderList() { if (!this.sourceNode) return; this.sourceData.registerSlimRepeater(this); - // if (this.clones && this.clones.length >= this.sourceData.length) { - // this.updateExistingList(); - // let leftovers = this.clones.splice(this.sourceData.length); - // leftovers.forEach(leftover => { - // Slim.removeChild(leftover); - // }); - // return; - // } - // if (this.clones && this.clones.length < this.sourceData.length) { - // this.updateExistingList(); - // let remaining = this.sourceData.splice(this.clones.length); - // this.createItems(remaining); - // return; - // } + + if (this.clones && this.clones.length === this.sourceData.length && this.sourceData.length > 0) { + this.updateExistingList(); + return; + } + + if (this.clones && this.clones.length > this.sourceData.length && this.sourceData.length > 0) { + const leftovers = this.clones.splice(this.sourceData.length); + leftovers.forEach( leftover => { + Slim.removeChild(leftover); + }); + this.updateExistingList(); + return; + } + if (this.clones && this.clones.length < this.sourceData.length && this.clones.length > 0) { + this.updateExistingList(); + let remaining = this.sourceData.slice(this.clones.length); + this.createItems(remaining); + return; + } this.clearList(); this.createItems(this.sourceData); } @@ -1080,6 +1114,7 @@ Slim.__initRepeater = function() { createItems(sourceData) { let targetPropName = this.getAttribute('target-attr'); const offset = this.clones.length; + const newClones = []; sourceData.forEach( (dataItem, index) => { let clone = this.sourceNode.cloneNode(true); clone.removeAttribute('slim-repeat'); @@ -1096,10 +1131,10 @@ Slim.__initRepeater = function() { if (Slim.__isWCSupported) { this.insertAdjacentElement('beforeEnd', clone) } - this.clones.push(clone) + newClones.push(clone) }); if (this._virtualDOM) this._captureBindings(); - for (let clone of this.clones) { + for (let clone of newClones) { clone[targetPropName] = clone[targetPropName]; clone._boundRepeaterParent = this._boundParent; if (Slim.__prototypeDict[clone.localName] !== undefined || clone.isSlim) { @@ -1112,11 +1147,16 @@ Slim.__initRepeater = function() { element._boundParent = clone._boundParent; element._boundRepeaterParent = clone._boundRepeaterParent; element[targetPropName] = clone[targetPropName]; - element.data_index = clone.data_index; + element.data_index = clone.data_index + offset; element.data_source = clone.data_source; }) } + if (!this.clones) { + this.clones = []; + } + this.clones = this.clones.concat(newClones); + this._executeBindings(); if (this._isAdjacentRepeater) { this._virtualDOM && Slim.__moveChildrenBefore(this._virtualDOM, this, true) diff --git a/tests/repeater.test.html b/tests/repeater.test.html index 1d16300..7b56c9e 100644 --- a/tests/repeater.test.html +++ b/tests/repeater.test.html @@ -3,7 +3,7 @@ Title - +