UI.render = Blaze.render, returns a View

The “rendered template” returned by UI.render and taken by UI.insert
and UI.remove is now a View (soon to be UI.View) instead of a DOMRange.
The pattern UI.insert(UI.render(Template.foo), div) is exactly the same.
The pattern Blaze.render(Template.foo).attach(div) no longer works.
This commit is contained in:
David Greenspan
2014-08-11 12:43:48 -07:00
parent 57ade381c9
commit fa1d30f02d
7 changed files with 31 additions and 35 deletions

View File

@@ -87,7 +87,7 @@ Blaze.Each = function (argFunc, contentFunc, elseFunc) {
eachView.inElseMode = false;
}
var range = Blaze.render(newItemView, eachView);
var range = Blaze.render(newItemView, eachView).domrange;
eachView.domrange.addMember(range, index);
} else {
eachView.initialSubviews.splice(index, 0, newItemView);
@@ -106,7 +106,7 @@ Blaze.Each = function (argFunc, contentFunc, elseFunc) {
eachView.domrange.addMember(
Blaze.render(
Blaze.View('each_else',eachView.elseFunc),
eachView), 0);
eachView).domrange, 0);
}
} else {
eachView.initialSubviews.splice(index, 1);

View File

@@ -390,7 +390,9 @@ Blaze.render = function (content, parentView) {
throw new Error("Expected a function, template, or View in Blaze.render");
view = content;
}
return Blaze._materializeView(view, parentView);
Blaze._materializeView(view, parentView);
return view;
};
Blaze.toHTML = function (htmljs, parentView) {

View File

@@ -2,7 +2,7 @@
Tinytest.add("less - presence", function(test) {
var div = document.createElement('div');
Blaze.render(Template.less_test_presence).attach(div);
UI.insert(UI.render(Template.less_test_presence), div);
div.style.display = 'block';
document.body.appendChild(div);

View File

@@ -2,7 +2,7 @@
Tinytest.add("stylus - presence", function(test) {
var div = document.createElement('div');
Blaze.render(Template.stylus_test_presence).attach(div);
UI.insert(UI.render(Template.stylus_test_presence), div);
div.style.display = 'block';
document.body.appendChild(div);
@@ -15,7 +15,7 @@ Tinytest.add("stylus - presence", function(test) {
Tinytest.add("stylus - @import", function(test) {
var div = document.createElement('div');
Blaze.render(Template.stylus_test_import).attach(div);
UI.insert(UI.render(Template.stylus_test_import), div);
div.style.display = 'block';
document.body.appendChild(div);

View File

@@ -49,19 +49,12 @@ Template._body_.renderToDocument = function () {
if (Template._body_.view)
return;
var range = UI.render(Template._body_);
Template._body_.view = range.view;
UI.insert(range, document.body);
var view = UI.render(Template._body_);
Template._body_.view = view;
UI.insert(view, document.body);
};
// Renders a template (eg `Template.foo`), returning a DOMRange. The
// range will keep updating reactively.
UI.render = function (tmpl) {
if (! (tmpl instanceof Template))
throw new Error("Template required here");
return Blaze.render(tmpl);
};
UI.render = Blaze.render;
// Same as `UI.render` with a data context passed in.
UI.renderWithData = function (tmpl, data) {
@@ -70,16 +63,16 @@ UI.renderWithData = function (tmpl, data) {
if (typeof data === 'function')
throw new Error("Data argument can't be a function"); // XXX or can it?
return Blaze.render(Blaze.With(data, function () {
return UI.render(Blaze.With(data, function () {
return tmpl;
}));
};
// The publicly documented API for inserting a DOMRange returned from
// The publicly documented API for inserting a View returned from
// `UI.render` or `UI.renderWithData` into the DOM. If you then remove
// `parentElement` using jQuery, all reactive updates on the rendered
// template will stop.
UI.insert = function (range, parentElement, nextNode) {
UI.insert = function (view, parentElement, nextNode) {
// parentElement must be a DOM node. in particular, can't be the
// result of a call to `$`. Can't check if `parentElement instanceof
// Node` since 'Node' is undefined in IE8.
@@ -87,17 +80,18 @@ UI.insert = function (range, parentElement, nextNode) {
throw new Error("'parentElement' must be a DOM node");
if (nextNode && typeof nextNode.nodeType !== 'number') // 'nextNode' is optional
throw new Error("'nextNode' must be a DOM node");
if (! range instanceof Blaze._DOMRange)
if (! (view && (view.domrange instanceof Blaze._DOMRange)))
throw new Error("Expected template rendered with UI.render");
range.attach(parentElement, nextNode);
view.domrange.attach(parentElement, nextNode);
};
// XXX test and document
UI.remove = function (range) {
if (! range instanceof Blaze._DOMRange)
UI.remove = function (view) {
if (! (view && (view.domrange instanceof Blaze._DOMRange)))
throw new Error("Expected template rendered with UI.render");
var range = view.domrange;
if (range.attached)
range.detach();
range.destroy();

View File

@@ -1,13 +1,13 @@
renderToDiv = function (template, optData) {
var div = document.createElement("DIV");
if (optData == null) {
Blaze.render(template).attach(div);
UI.insert(UI.render(template), div);
} else {
Blaze.render(function () {
UI.insert(UI.render(function () {
return Blaze.With(optData, function () {
return template;
});
}).attach(div);
}), div);
}
return div;
};

View File

@@ -20,7 +20,7 @@ var materialize = function (content, parent) {
return content;
};
}
Blaze.render(func).attach(parent);
UI.insert(UI.render(func), parent);
};
var toHTML = Blaze.toHTML;
@@ -305,7 +305,7 @@ Tinytest.add("ui - render - reactive attributes", function (test) {
test.equal(R.numListeners(), 0);
var div = document.createElement("DIV");
Blaze.render(spanFunc).attach(div);
UI.insert(UI.render(spanFunc), div);
test.equal(canonicalizeHtml(div.innerHTML), '<span class="david gre\u00ebnspan" id="foo"></span>');
test.equal(R.numListeners(), 1);
@@ -344,7 +344,7 @@ Tinytest.add("ui - render - reactive attributes", function (test) {
test.equal(R.numListeners(), 0);
var div = document.createElement("DIV");
Blaze.render(spanFunc).attach(div);
UI.insert(UI.render(spanFunc), div);
test.equal(canonicalizeHtml(div.innerHTML), '<span id="foo" style="foo: &quot;a;aa&quot;; bar: b"></span>');
test.equal(R.numListeners(), 1);
@@ -379,7 +379,7 @@ Tinytest.add("ui - render - reactive attributes", function (test) {
var div = document.createElement("DIV");
document.body.appendChild(div);
Blaze.render(spanFunc).attach(div);
UI.insert(UI.render(spanFunc), div);
test.equal(canonicalizeHtml(div.innerHTML), '<span style="foo: a"></span>');
var span = div.firstChild;
@@ -435,7 +435,7 @@ Tinytest.add("ui - render - reactive attributes", function (test) {
'HTML.SPAN({id: "foo", ggg: ["x", ["y", ["z"]]]})');
var div = document.createElement("DIV");
Blaze.render(spanFunc).attach(div);
UI.insert(UI.render(spanFunc), div);
var span = div.firstChild;
test.equal(span.nodeName, 'SPAN');
@@ -514,7 +514,7 @@ Tinytest.add("ui - render - views", function (test) {
var div = document.createElement("DIV");
Blaze.render(makeView).attach(div);
UI.insert(UI.render(makeView), div);
buf.push('---flush---');
Deps.flush();
test.equal(buf, ['created 1',
@@ -571,7 +571,7 @@ Tinytest.add("ui - render - findAll", function (test) {
var div = document.createElement("DIV");
Blaze.render(myTemplate).attach(div);
UI.insert(UI.render(myTemplate), div);
Deps.flush();
test.equal(_.isArray(found), true);
@@ -591,7 +591,7 @@ Tinytest.add("ui - render - reactive attributes 2", function (test) {
};
var div = document.createElement("DIV");
Blaze.render(spanFunc).attach(div);
UI.insert(UI.render(spanFunc), div);
var check = function (expected) {
test.equal(Blaze.toHTML(spanFunc()), expected);
test.equal(canonicalizeHtml(div.innerHTML), expected);