diff --git a/components/ionKeyboard/ionKeyboard.js b/components/ionKeyboard/ionKeyboard.js new file mode 100644 index 0000000..f227002 --- /dev/null +++ b/components/ionKeyboard/ionKeyboard.js @@ -0,0 +1,80 @@ +IonKeyboard = { + close: function () { + if (Meteor.isCordova) { + cordova.plugins.Keyboard.close(); + } + }, + + show: function () { + if (Meteor.isCordova) { + cordova.plugins.Keyboard.show(); + } + }, + + hideKeyboardAccessoryBar: function () { + if (Meteor.isCordova) { + cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true); + } + }, + + showKeyboardAccessoryBar: function () { + if (Meteor.isCordova) { + cordova.plugins.Keyboard.hideKeyboardAccessoryBar(false); + } + }, + + disableScroll: function () { + if (Meteor.isCordova) { + cordova.plugins.Keyboard.disableScroll(true); + } + }, + + enableScroll: function () { + if (Meteor.isCordova) { + cordova.plugins.Keyboard.disableScroll(false); + } + } +}; + +window.addEventListener('native.keyboardshow', function (event) { + var keyboardHeight = event.keyboardHeight; + IonKeyboard.disableScroll(); + + // Hide any elements that want to be hidden + $('.hide-on-keyboard-open').hide(); + + // Attach any elements that want to be attached + $('[data-keyboard-attach]').each(function (index, el) { + $(el).data('ionkeyboard.bottom', $(el).css('bottom')); + $(el).css({bottom: keyboardHeight}); + }); + + $('.content.overflow-scroll').each(function (index, el) { + $(el).data('ionkeyboard.bottom', $(el).css('bottom')); + $(el).css({bottom: keyboardHeight}); + }); + + $('.content.overflow-scroll').on('focus', 'input,textarea', function(event) { + var scrollTo = ($(this).offset().top - $(event.delegateTarget).offset().top) - 10 + $(event.delegateTarget).animate({ + scrollTop: scrollTo + }) + }); +}); + +window.addEventListener('native.keyboardhide', function (event) { + IonKeyboard.enableScroll(); + + // Show any elements that were hidden + $('.hide-on-keyboard-open').show(); + + // Detach any elements that were attached + $('[data-keyboard-attach]').each(function (index, el) { + $(el).css({bottom: $(el).data('ionkeyboard.bottom')}); + }); + + // Reset the content areas + $('.content.overflow-scroll').each(function (index, el) { + $(el).css({bottom: $(el).data('ionkeyboard.bottom')}); + }); +}); diff --git a/components/ionModal/ionModal.html b/components/ionModal/ionModal.html index 82974bb..389dd9a 100644 --- a/components/ionModal/ionModal.html +++ b/components/ionModal/ionModal.html @@ -3,18 +3,21 @@ diff --git a/components/ionModal/ionModal.js b/components/ionModal/ionModal.js index 5905058..7e26c40 100644 --- a/components/ionModal/ionModal.js +++ b/components/ionModal/ionModal.js @@ -64,6 +64,7 @@ IonModal = { Template.ionModal.created = function () { this.data = this.data || {}; + this.customTemplate = this.data.customTemplate || false; this.title = this.data.title; this.title = this.data.closeText; this.focusFirstInput = this.data.focusFirstInput || true; @@ -116,6 +117,10 @@ Template.ionModal.helpers({ } else { return 'slide-in-up'; } + }, + + customTemplate: function () { + return this.customTemplate; } }); diff --git a/package.js b/package.js index f2a0ac4..7664858 100644 --- a/package.js +++ b/package.js @@ -43,6 +43,8 @@ Package.onUse(function(api) { "components/ionItem/ionItem.html", "components/ionItem/ionItem.js", + "components/ionKeyboard/ionKeyboard.js", + "components/ionList/ionList.html", "components/ionList/ionList.js", @@ -106,6 +108,7 @@ Package.onUse(function(api) { api.export("IonActionSheet"); api.export("IonBackdrop"); api.export("IonHeaderBar"); + api.export("IonKeyboard"); api.export("IonLoading"); api.export("IonModal"); api.export("IonNavigation");