Flow integration

GUIDE.md

@@ -250,7 +250,7 @@ To get a nice Ionic styled list item wrap your content in a `ionItem` block temp
 
 #### Path and Link Examples
 
-Meteor uses Iron:Router. Most are familiar with Iron:Router's [pathFor](https://github.com/EventedMind/iron-router/blob/devel/Guide.md#pathfor) and [urlFor](https://github.com/EventedMind/iron-router/blob/devel/Guide.md#urlfor) helpers. Meteoric lets you tap into those helpers from within `ionItem` or ignore them, the choice is yours.
+Meteor uses Iron:FlowRouter. Most are familiar with Iron:FlowRouter's [pathFor](https://github.com/EventedMind/iron-router/blob/devel/Guide.md#pathfor) and [urlFor](https://github.com/EventedMind/iron-router/blob/devel/Guide.md#urlfor) helpers. Meteoric lets you tap into those helpers from within `ionItem` or ignore them, the choice is yours.
 
 To call IR's `pathFor` you would specify your route in the `path` attribute.
 
@@ -314,7 +314,7 @@ Lastly you can also pass a raw url by including the `href` attribute.
 {{/ionList}}
 ```
 
-**IronRouter's pathFor href**
+**IronFlowRouter's pathFor href**
 
 ```
 {{! href="/item/details/jkh34k234h?parentId=hkjh45j43k3#reviews" }}
@@ -329,7 +329,7 @@ Lastly you can also pass a raw url by including the `href` attribute.
 {{/ionList}}
 ```
 
-**IronRouter's urlFor href**
+**IronFlowRouter's urlFor href**
 
 ```
 {{! href="http://www.example.com/item/details?parentId=hkjh45j43k3" }}

components/ionActionSheet/ionActionSheet.js

@@ -1,5 +1,25 @@
+function transitionEndEventName () {
+    var i,
+        undefined,
+        el = document.createElement('div'),
+        transitions = {
+            'transition':'transitionend',
+            'OTransition':'otransitionend',  // oTransitionEnd in very old Opera
+            'MozTransition':'transitionend',
+            'WebkitTransition':'webkitTransitionEnd'
+        };
+
+    for (i in transitions) {
+        if (transitions.hasOwnProperty(i) && el.style[i] !== undefined) {
+            return transitions[i];
+        }
+    }
+
+    //TODO: throw 'TransitionEnd event is not supported in this browser'; 
+}
+
 IonActionSheet = {
-  transitionEndEvent: 'transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd',
+  transitionEndEvent: transitionEndEventName(),
 
   show: function (options) {
     this.template = Template.ionActionSheet;
@@ -67,6 +87,9 @@ IonActionSheet = {
 
     $wrapper.on(this.transitionEndEvent, function () {
       $('body').removeClass('action-sheet-open');
+
+      // added this because of https://github.com/meteor/meteor/issues/3828
+      $('.action-sheet-backdrop').remove();
       Blaze.remove(this.view);
 
       if (typeof(callback) === 'function') {

components/ionBody/ionBody.html

@@ -1,5 +1,5 @@
 <template name="ionBody">
   <div class="ionic-body {{platformClasses}}">
-    {{> UI.contentBlock}}
+    {{> Template.contentBlock}}
   </div>
 </template>

components/ionContent/ionContent.html

@@ -1,7 +1,7 @@
 <template name="ionContent">
   <div class="scroll-content ionic-scroll">
     <div class="{{classes}}">
-      {{> UI.contentBlock}}
+      {{> Template.contentBlock}}
     </div>
   </div>
 </template>

components/ionFooterBar/ionFooterBar.html

@@ -1,5 +1,5 @@
 <template name="ionFooterBar">
   <div class="{{classes}}">
-    {{> UI.contentBlock}}
+    {{> Template.contentBlock}}
   </div>
 </template>

components/ionHeaderBar/ionHeaderBar.html

@@ -1,5 +1,5 @@
 <template name="ionHeaderBar">
   <div class="{{classes}}">
-    {{> UI.contentBlock}}
+    {{> Template.contentBlock}}
   </div>
 </template>

components/ionItem/ionItem.html

@@ -1,11 +1,11 @@
 <template name="ionItem">
   {{#if isAnchor}}
     <a class="{{itemClasses}}" href="{{url}}" target="{{target}}">
-      {{> UI.contentBlock}}
+      {{> Template.contentBlock}}
     </a>
   {{else}}
-    <div class="{{itemClasses}}">
-      {{> UI.contentBlock}}
+    <div class="{{itemClasses}}" {{attrs}}>
+      {{> Template.contentBlock}}
     </div>
   {{/if}}
 </template>

components/ionItem/ionItem.js

@@ -72,8 +72,16 @@ Template.ionItem.helpers({
         }
 
       } else {
-        return Router.routes[path].path(Template.parentData(1));
+        return RouterLayer.getPath(path);
       }
     }
+  },
+
+  attrs: function() {
+    var ret = {};
+    if (this.id) {
+      ret.id = this.id;
+    }
+    return ret;
   }
 });

components/ionNavBackButton/ionNavBackButton.js

@@ -1,18 +1,16 @@
 IonScrollPositions = {};
-
-Router.onStop(function () {
+/*
+RouterLayer.onStop(function () {
   IonScrollPositions[this.route.path(this.params)] = $('.overflow-scroll').scrollTop();
-});
+});*/
 
 Template.ionNavBackButton.events({
   'click': function (event, template) {
     $('[data-nav-container]').addClass('nav-view-direction-back');
     $('[data-navbar-container]').addClass('nav-bar-direction-back');
-
-    //get most up-to-date url, if it exists
-    backUrl = template.getBackUrl()
-    if (backUrl) {
-      Router.go(backUrl);
+
+    if (template.backUrl) {
+      RouterLayer.go(template.backUrl);
     } else {
       window.history.back();
     }
@@ -24,14 +22,19 @@ Template.ionNavBackButton.created = function () {
 };
 
 Template.ionNavBackButton.rendered = function () {
-  var self = this;
-  this.getBackUrl = function () {
-    var backUrl = null;
+  this.backUrl = null;
 
-    self.data = self.data || {};
-
-    if (self.data.href) {
-      backUrl = self.data.href;
+  this.data = this.data || {};
+
+  if (this.data.href) {
+    this.backUrl = this.data.href;
+  }
+
+  if (this.data.path) {
+    backRoute = RouterLayer.routes[this.data.path]
+    if (!backRoute) {
+      console.warn("back to nonexistent route: ", this.data.path);
+      return;
     }
 
     if (self.data.path) {

components/ionNavBar/ionNavBar.html

@@ -1,7 +1,5 @@
 <template name="ionNavBar">
   <div class="{{classes}} nav-bar-block nav-bar-transition-{{transition}} nav-bar-direction-forward" data-navbar-container>
-    {{> yield "headerButtonLeft"}}
-    {{> yield "headerTitle"}}
-    {{> yield "headerButtonRight"}}
+    {{> Template.contentBlock}}
   </div>
 </template>

components/ionNavView/ionNavView.js

@@ -24,7 +24,7 @@ Template.ionNavView.created = function () {
   }
 };
 
-Template.ionNavView.rendered = function () {
+Template.ionNavView.onRendered(function () {
   var template = this;
   var container = this.find('[data-nav-container]');
 
@@ -66,7 +66,7 @@ Template.ionNavView.rendered = function () {
       }, template.transitionDuration);
     }
   };
-};
+});
 
 Template.ionNavView.helpers({
   transition: function () {

components/ionSlideBox/ionSlideBox.html

@@ -1,5 +1,5 @@
 <template name="ionSlideBox">
   <div class="ion-slide-box">
-    {{> UI.contentBlock}}
+    {{> Template.contentBlock}}
   </div>
 </template>

components/ionSubheaderBar/ionSubheaderBar.html

@@ -1,5 +1,5 @@
 <template name="ionSubheaderBar">
   <div class="{{classes}}">
-    {{> UI.contentBlock}}
+    {{> Template.contentBlock}}
   </div>
 </template>

components/ionTab/ionTab.js

@@ -1,9 +1,6 @@
 Template.ionTab.events({
   'click': function (event, template) {
-    if (template.data.path) {
-      Session.set('ionTab.current', template.data.path);
-    }
-
+
     // If the tab's content is being rendered inside of a ionNavView
     // we don't want to slide it in when switching tabs
     IonNavigation.skipTransitions = true;
@@ -26,24 +23,16 @@ Template.ionTab.helpers({
     if (this.href) {
       return this.href;
     }
-
-    if (this.path && Router.routes[this.path]) {
-      return Router.routes[this.path].path(Template.currentData());
+
+    // kept for backwards compatibility
+    if (this.path) {
+      return this.path;
     }
   },
 
   isActive: function () {
-    var ionTabCurrent = Session.get('ionTab.current');
-
-    if (this.path && this.path === ionTabCurrent) {
-      return 'active';
-    }
-
-    // The initial case where there is no localStorage value and
-    // no session variable has been set, this attempts to set the correct tab
-    // to active based on the router
-    var route = Router.routes[this.path];
-    if(route && route.path(Template.currentData()) === ionTabCurrent){
+    var route = RouterLayer.getPath(true);
+    if(route  === this.path){
       return 'active';
     }
   },

components/ionTabs/ionTabs.js

@@ -1,27 +1,20 @@
-Template.ionTabs.created = function () {
+Template.ionTabs.onCreated(function () {
   this.data = this.data || {};
-};
+});
 
-Template.ionTabs.rendered = function () {
+Template.ionTabs.onRendered(function () {
   if ((this.data.class && this.data.class.indexOf('tabs-top') > -1) || this.data.style === 'android' || ( !this.data.style && Platform.isAndroid())) {
     Session.set('hasTabsTop', true);
   } else {
     Session.set('hasTabs', true);
   }
+  Session.set('ionTab.current', null);
+});
 
-  this.$('.tabs').children().each(function() {
-    var href = $(this).attr('href');
-    var current = Router.current().location.get().path;
-    if(href === current){
-      Session.set('ionTab.current', href);
-    }
-  });
-};
-
-Template.ionTabs.destroyed = function () {
+Template.ionTabs.onDestroyed(function () {
   Session.set('hasTabs', false);
   Session.set('hasTabsTop', false);
-};
+});
 
 Template.ionTabs.helpers({
   classes: function () {

components/ionView/ionView.html

@@ -1,11 +1,10 @@
 <template name="ionView">
   {{#if title}}
-    {{#contentFor "headerTitle"}}
-      <h1 class="title">{{title}}</h1>
-    {{/contentFor}}
+		<h1 class="title">{{title}}</h1>
+    {{! > headerTitle title=data.title}}
   {{/if}}
 
   <div class="{{classes}}">
-    {{> UI.contentBlock}}
+    {{> Template.contentBlock}}
   </div>
-</template>
+</template>

components/ionView/ionView.js

@@ -1,14 +1,15 @@
-Template.ionView.rendered = function () {
+Template.ionView.onRendered(function () {
   // Reset our transition preference
   IonNavigation.skipTransitions = false;
 
   // Reset our scroll position
-  var routePath = Router.current().route.path(Router.current().params);
+  var routePath = RouterLayer.getPath();
+
   if(IonScrollPositions[routePath]) {
     $('.overflow-scroll').not('.nav-view-leaving .overflow-scroll').scrollTop(IonScrollPositions[routePath]);
     delete IonScrollPositions[routePath];
   }
-};
+});
 
 Template.ionView.helpers({
   classes: function () {
@@ -19,10 +20,5 @@ Template.ionView.helpers({
     }
 
     return classes.join(' ');
-  },
-  title: function () {
-    if ( Template.instance().data && Template.instance().data.title ) {
-      return Template.instance().data.title;
-    }
   }
 });

package.js

@@ -11,15 +11,7 @@ Cordova.depends({
 
 Package.onUse(function(api) {
   api.versionsFrom("1.0");
-  api.use([
-    "templating",
-    "underscore",
-    "fastclick",
-    "iron:[email protected]",
-    "tracker",
-    "session",
-    "jquery"
-  ], "client");
+  api.use(["templating", "underscore", "fastclick", "nicolaslopezj:[email protected]", "tracker", "session", "jquery"], "client");
 
   api.addFiles([
     "vendor/snap.js",