Skip to content

Commit

Permalink
Fixes for nested each/option queries.
Browse files Browse the repository at this point in the history 
Now the _template of an VirtualElement will be cloned to it's state to
prevent changes to it from actions performt in an other iteration.

Also every state on elements with an option query will now contain a
seperated footers and headers array for the same reason as the template.

Closes #126
  • Loading branch information
@Kanaye
Kanaye committed Jan 25, 2017
1 parent f9ce47c commit 1fbbb8d
Show file tree
Hide file tree
Showing 2 changed files with 51 additions and 22 deletions.
25 changes: 19 additions & 6 deletions src/query/VirtualElement.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -356,7 +356,8 @@ define([
attributes: {},
style: {},
html: null,
expressions: {}
expressions: {},
template: blocks.clone(this._template || this._children)
};
if (!this._states) {
this._states = {};
Expand Down Expand Up @@ -395,7 +396,7 @@ define([

renderChildren: function (domQuery, syncIndex) {
var html = '';
var children = this._template || this._children;
var children = this._state && this._state.template || this._template || this._children;
var length = children.length;
var index = -1;
var child;
Expand Down Expand Up @@ -453,7 +454,7 @@ define([
},

syncChildren: function (domQuery, syncIndex, offset) {
var children = this._template || this._children;
var children = this._state && this._state.template || this._template || this._children;
var length = children.length;
var state = this._state;
var element = this._el.nodeType == 8 ? this._el : this._el.childNodes[offset || 0];
Expand Down Expand Up @@ -513,13 +514,14 @@ define([
},

updateChildren: function (collection, updateCount, domQuery, domElement) {
var template = this._template;
var template = this._state && this._state.template || this._template;
var child = template[0];
var isOneChild = template.length === 1 && VirtualElement.Is(child);
var childNodes = domElement.childNodes;
var syncIndex = domQuery.getSyncIndex();
var chunkLength = this._length();
var offset = this._headers ? this._headers.length : 0;
var headers = this._state && this._state.headers || this._headers;
var offset = headers ? headers.length : 0;
var index = -1;

while (++index < updateCount) {
Expand All @@ -538,10 +540,13 @@ define([

clone: function () {
var element = this._el;
var parent = this._parent;
this._parent = null;
this._el = null;
this.clone = null;
var clone = blocks.clone(this, true);
clone.clone = this.clone = VirtualElement.prototype.clone;
clone._parent = this._parent = parent;
this._el = element;
return clone;
},
Expand Down Expand Up @@ -669,7 +674,15 @@ define([
}
});
},

_setChildren: function (children) {
this._children = children;
if (this._template || this._each) {
this._template = blocks.clone(children, true);
}
if (this._state) {
this._state.template = blocks.clone(children, true);
}
},
_executeAttributeExpressions: function (context) {
var isVirtual = this._el ? false : true;
var attributes = this._state && this._state.attributes;
Expand Down
48 changes: 32 additions & 16 deletions src/query/queries.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -98,7 +98,7 @@ define([
var templateName = template.parameterName;
template = template.rawValue;
if (value) {
value = value.rawValue;
value = value.rawValue;
}

template = blocks.$unwrap(template);
Expand All @@ -120,7 +120,8 @@ define([
if (!this._el) {
var element = document.createElement('div');
element.innerHTML = html;
this._children = createVirtual(element.childNodes[0], this);
var children = createVirtual(element.childNodes[0], this);
this._setChildren(children);
this._innerHTML = null;
} else {
this.html(html);
Expand Down Expand Up @@ -264,9 +265,9 @@ define([
supportsComments: true,

_getStaticHtml: function (domQuery, element) {
var children = element._children;
var headers = element._headers;
var footers = element._footers;
var children = element._state && element._state.template || element._template || element._children;
var headers = element._state && element._state.headers || element._headers;
var footers = element._state && element._state.footer || element._footers;
var index = -1;
var headerHtml = '';
var footerHtml = '';
Expand All @@ -286,8 +287,13 @@ define([
}
}
} else {
headers = element._headers = [];
footers = element._footers = [];
if (element._state) {
headers = element._state.headers = [];
footers = element._state.footers = [];
} else {
headers = element._headers = [];
footers = element._footers = [];
}

while (++index < children.length) {
child = children[index];
Expand Down Expand Up @@ -331,14 +337,14 @@ define([
var staticHtml;
var html;

if (this._sync) {
if (element._sync) {
element.updateChildren(collection, collection.length, domQuery, this._el);
return;
}

this._template = this._template || this._children;
element._template = element._template || element._children;

this._childrenEach = true;
element._childrenEach = true;

if (domQuery._serverData) {
elementData = domQuery._serverData[ElementsData.id(this)];
Expand All @@ -347,9 +353,14 @@ define([
var div = document.createElement('div');
div.innerHTML = elementData;
element._template = element._children = createVirtual(div.childNodes[0], element);
if (element._state) {
element._state.template = blocks.clone(element._template, true);
}
}
}



staticHtml = queries.each._getStaticHtml(domQuery, element);
html = staticHtml.header;

Expand Down Expand Up @@ -435,10 +446,13 @@ define([
var value = Expression.Create('{{' + (options.value || $thisStr) + '}}', 'value');
var caption = blocks.isString(options.caption) && new VirtualElement('option');
var option = new VirtualElement('option');
var children = this._children;
var children = this._state && this._state.template || this._template || this._children;
var i = 0;
var child;

if (this._sync) {
blocks.queries.each.preprocess.call(this, domQuery, collection);
return;
}
for (; i < children.length; i++) {
child = children[i];
if (!child._attributes || (child._attributes && !child._attributes['data-role'])) {
Expand All @@ -449,22 +463,24 @@ define([
option._attributeExpressions.push(value);
option._children.push(text);
option._parent = this;
this._children.push(option);
children.push(option);

if (caption) {
caption._attributes['data-role'] = 'header';
caption._innerHTML = options.caption;
this.addChild(caption);
caption._parent = this;
children.push(caption);
}
blocks.queries.each.preprocess.call(this, domQuery, collection);
},

update: function (domQuery, collection) {
var elementData = ElementsData.data(this);
var rawCollection = collection();
var headers = elementData.virtual._headers;
var state = elementData.virtual._state;
var headers = state && state.headers || elementData.virtual._headers;
var valueObservable = elementData.valueObservable;
var valueExpression = elementData.virtual._template[0]._attributeExpressions[0];
var valueExpression = (state && state.template[0] || elementData.virtual._template[0])._attributeExpressions[0];
var rawValue = blocks.isObservable(valueObservable) ? valueObservable._getValue() : this.value;
var expression;
var value;
Expand Down

0 comments on commit 1fbbb8d

Please sign in to comment.