diff --git a/components/ionBody/ionBody.js b/components/ionBody/ionBody.js index 1b292cd..356f21f 100644 --- a/components/ionBody/ionBody.js +++ b/components/ionBody/ionBody.js @@ -4,7 +4,7 @@ isIOS = function () { Template.ionBody.helpers({ platformClasses: function () { - var classes = []; + var classes = ['grade-a']; if (Meteor.isCordova) { classes.push('platform-cordova'); @@ -32,6 +32,6 @@ Template.ionBody.events({ }, 'click [data-nav-direction]': function (event, template) { - IonNavView.navDirection = $(event.target).data('nav-direction'); + Session.set('navDirection', $(event.target).data('nav-direction')); } }); diff --git a/components/ionNavView/ionNavView.html b/components/ionNavView/ionNavView.html index 7a78c43..3208bbd 100644 --- a/components/ionNavView/ionNavView.html +++ b/components/ionNavView/ionNavView.html @@ -1,5 +1,5 @@ diff --git a/components/ionNavView/ionNavView.js b/components/ionNavView/ionNavView.js index 655db10..5a99d63 100644 --- a/components/ionNavView/ionNavView.js +++ b/components/ionNavView/ionNavView.js @@ -1,57 +1,62 @@ IonNavView = { - currentAnimation: 'slide-ios', - animationDuration: 250, - animationEndEvent: 'animationend webkitAnimationEnd oAnimationEnd MSAnimationEnd' + animation: 'slide-left-right', + animationDuration: 250 }; Template.ionNavView.created = function () { - IonNavView.animation = 'slide-left-right'; - if (this.data.animation) { + if (this.data && this.data.animation) { IonNavView.animation = this.data.animation; } - - this.title = this.data.animation; }; Template.ionNavView.rendered = function () { - if (this.title) { - - } - this.find('[data-navigation-container]')._uihooks = { insertElement: function(node, next) { - if (!IonNavView.currentAnimation) { + if (!IonNavView.animation || !$(node).hasClass('view')) { $(node).insertBefore(next); return; } - var classes = ['ng-enter', IonNavView.currentAnimation]; - - if (IonNavView.navDirection) { - classes.push(IonNavView.navDirection); - IonNavView.navDirection = undefined; - } - - $(node).insertBefore(next).addClass(classes.join(' ')); - + $(node).insertBefore(next).addClass('ng-enter'); Meteor.setTimeout(function() { $(node).addClass('ng-enter-active'); }, 10); - $(node).on(IonNavView.animationEndEvent, function () { - $(this).removeClass(classes).removeClass('ng-enter-active').off('webkitAnimationEnd'); - }); + Meteor.setTimeout(function () { + $(this).removeClass('ng-enter ng-enter-active'); + }, IonNavView.animationDuration); }, removeElement: function(node) { - if (!IonNavView.currentAnimation) { + if (!IonNavView.animation || !$(node).hasClass('view')) { $(node).remove(); return; } + $(node).addClass('ng-leave'); + Meteor.setTimeout(function() { + $(node).addClass('ng-leave-active'); + }, 10); + Meteor.setTimeout(function () { + $(node).removeClass('ng-leave ng-lavel-active'); $(node).remove(); + Session.set('navDirection', undefined); }, IonNavView.animationDuration); } }; }; + + +Template.ionNavView.helpers({ + classes: function () { + console.log('calculating classes'); + var classes = [IonNavView.animation]; + + if (Session.get('navDirection')) { + classes.push(Session.get('navDirection')); + } + + return classes.join(' '); + } +}); diff --git a/components/ionView/ionView.html b/components/ionView/ionView.html index 92f634d..1bef463 100644 --- a/components/ionView/ionView.html +++ b/components/ionView/ionView.html @@ -1,5 +1,5 @@ diff --git a/components/ionView/ionView.js b/components/ionView/ionView.js index e69de29..36d30bc 100644 --- a/components/ionView/ionView.js +++ b/components/ionView/ionView.js @@ -0,0 +1,11 @@ +Template.ionView.helpers({ + classes: function () { + var classes = ['view']; + + if (this.class) { + classes.push(this.class); + } + + return classes.join(' '); + } +});