Correctly insert nodes at the end of a parent

In _uihooks, sometimes the `next` argument is null, which means the new dquote> node should be appended to the parent. However, using jQuery
(`$(node).insertBefore(next)`), that's not possible, since jQuery
has no way of knowing what parent you mean.

Instead, this commit uses a standard DOM method,
`parent.insertBefore(node, next)`, which does the right thing --
it's what Blaze uses internally when no `insertElement` hook is
defined.
This commit is contained in:
Lalo Martins 2015-06-19 02:14:34 +02:00
parent 7fb88afb65
commit 04fcd742e9
2 changed files with 12 additions and 7 deletions

View file

@ -26,12 +26,13 @@ Template.ionNavBar.rendered = function () {
IonHeaderBar.positionTitle.call(this);
var template = this;
this.find('[data-navbar-container]')._uihooks = {
var container = this.find('[data-navbar-container]');
container._uihooks = {
insertElement: function(node, next) {
var $node = $(node);
if (!$node.hasClass('title') && !$node.hasClass('button') || IonNavigation.skipTransitions) {
$node.insertBefore(next);
container.insertBefore(node, next);
// Changing tabs skips transition animations, but we still want to update the position of the title
IonHeaderBar.alignTitle.call(template);
IonHeaderBar.positionTitle.call(template);
@ -39,7 +40,8 @@ Template.ionNavBar.rendered = function () {
}
if ($node.hasClass('title')) {
$node.insertBefore(next).addClass('title-entering title-stage');
container.insertBefore(node, next);
$node.addClass('title-entering title-stage');
IonHeaderBar.alignTitle.call(template);
IonHeaderBar.positionTitle.call(template);
@ -55,7 +57,8 @@ Template.ionNavBar.rendered = function () {
}
if ($node.hasClass('button')) {
$node.insertBefore(next).addClass('button-entering button-stage');
container.insertBefore(node, next);
$node.addClass('button-entering button-stage');
Meteor.setTimeout(function() {
$node.removeClass('button-stage').addClass('button-active');
}, 16);

View file

@ -26,16 +26,18 @@ Template.ionNavView.created = function () {
Template.ionNavView.rendered = function () {
var template = this;
var container = this.find('[data-nav-container]');
this.find('[data-nav-container]')._uihooks = {
container._uihooks = {
insertElement: function(node, next) {
var $node = $(node);
if (!template.transition || !$node.hasClass('view') || IonNavigation.skipTransitions) {
$node.insertBefore(next);
container.insertBefore(node, next);
return;
}
$node.insertBefore(next).addClass('nav-view-entering nav-view-stage');
$node.addClass('nav-view-entering nav-view-stage');
container.insertBefore(node, next);
Meteor.setTimeout(function() {
$node.removeClass('nav-view-stage').addClass('nav-view-active');
}, 0);