diff --git a/components/ionBody/ionBody.js b/components/ionBody/ionBody.js index 9233d2a..c9711a5 100644 --- a/components/ionBody/ionBody.js +++ b/components/ionBody/ionBody.js @@ -10,6 +10,10 @@ isWindowsPhone = function () { return navigator.userAgent.indexOf('Windows Phone') > -1; } +Template.ionBody.rendered = function () { + // this.snapper = null; +}; + Template.ionBody.helpers({ platformClasses: function () { var classes = ['grade-a']; @@ -47,5 +51,34 @@ Template.ionBody.events({ 'click [data-nav-direction]': function (event, template) { $('[data-nav-container]').addClass($(event.target).data('nav-direction')); + }, + + 'click [data-ion-menu-toggle]': function (event, template) { + console.log('template', template); + if (!IonSideMenu.snapper) { + return; + } + + var direction; + var $el = $(event.target); + + if ($el.data('ion-menu-toggle') !== '') { + direction = $el.data('ion-menu-toggle'); + } else { + direction = 'left'; + } + + if(IonSideMenu.snapper.state().state === direction){ + IonSideMenu.snapper.close(); + } else { + IonSideMenu.snapper.open(direction); + } + }, + + 'click [data-ion-menu-close]': function (event, template) { + if (!IonSideMenu.snapper) { + return; + } + IonSideMenu.snapper.close(); } }); diff --git a/components/ionModal/ionModal.js b/components/ionModal/ionModal.js index b7b265c..7d3f3f4 100644 --- a/components/ionModal/ionModal.js +++ b/components/ionModal/ionModal.js @@ -10,7 +10,10 @@ IonModal = { this.template = Template[templateName]; this.view = Blaze.renderWithData(this.template, data, $('.ionic-body').get(0)); - var $modalEl = $(this.view.firstNode()); + var $modalBackdrop = $(this.view.firstNode()); + $modalBackdrop.addClass('active'); + + var $modalEl = $modalBackdrop.find('.modal'); $modalEl.addClass(this.enterClasses.join(' ')); $modalEl.on(this.transitionEndEvent, function () { @@ -24,7 +27,10 @@ IonModal = { }, close: function () { - var $modalEl = $(this.view.firstNode()); + var $modalBackdrop = $(this.view.firstNode()); + $modalBackdrop.removeClass('active'); + + var $modalEl = $modalBackdrop.find('.modal'); $modalEl.addClass(this.leaveClasses.join(' ')); Meteor.setTimeout(function() { @@ -77,6 +83,13 @@ Template.ionModal.helpers({ }); Template.ionModal.events({ + // Handle clicking the backdrop + 'click': function (event, template) { + if ($(event.target).hasClass('modal-backdrop')) { + IonModal.close(); + } + }, + 'click [data-dismiss=modal]': function (event, template) { IonModal.close(); } diff --git a/components/ionSideMenuContainer/ionSideMenuContainer.js b/components/ionSideMenuContainer/ionSideMenuContainer.js index 0124855..58aeb01 100644 --- a/components/ionSideMenuContainer/ionSideMenuContainer.js +++ b/components/ionSideMenuContainer/ionSideMenuContainer.js @@ -1,40 +1,18 @@ +IonSideMenu = { + snapper: null +}; + Template.ionSideMenuContainer.rendered = function () { $snapperEl = this.$('.snap-content'); if (!$snapperEl) { return; } - this.snapper = new Snap({ + IonSideMenu.snapper = new Snap({ element: $snapperEl.get(0) }); }; -Template.ionSideMenuContainer.events({ - 'click [data-ion-menu-toggle]': function (event, template) { - if (!template.snapper) { - return; - } - - var direction; - var $el = $(event.target); - - if ($el.data('ion-menu-toggle') !== '') { - direction = $el.data('ion-menu-toggle'); - } else { - direction = 'left'; - } - - if(template.snapper.state().state === direction){ - template.snapper.close(); - } else { - template.snapper.open(direction); - } - }, - - 'click [data-ion-menu-close]': function (event, template) { - if (!template.snapper) { - return; - } - template.snapper.close(); - } -}); +Template.ionSideMenuContainer.destroyed = function () { + IonSideMenu.snapper = null; +}; diff --git a/package.js b/package.js index b73a525..1327332 100644 --- a/package.js +++ b/package.js @@ -91,4 +91,5 @@ Package.onUse(function(api) { api.export("IonModal"); api.export("IonPopover"); api.export("IonPopup"); + api.export("IonSideMenu"); });