Permalink
Browse files

Allows padding to be added by a keyboard

Instead of losing the screen when the keyboard opens, sometimes you
want to move the content of the page.

This allows you to use a plugin to do so by allowing you to specify the
current keyboard height.

Also, initial padding can now be different (like if you modify the
message bar).
  • Loading branch information...
1 parent c173318 commit 314bf890a57bd61091b4fda100234cd6259f38da @MarcGodard MarcGodard committed Jan 16, 2015
Showing with 6 additions and 4 deletions.
  1. +1 −0 .gitignore
  2. +5 −4 src/js/messagebar.js
View
@@ -3,3 +3,4 @@ node_modules
build
custom
npm-debug.log
+.idea
@@ -7,6 +7,7 @@ app.initMessagebar = function (pageContainer) {
if (messagebar.length === 0) return;
var textarea = messagebar.find('textarea');
var pageContent = messagebar.parents('.page').find('.page-content');
+ var pageContentInitialPadding = parseInt(pageContent.css('padding-bottom'));
var initialBarHeight = messagebar[0].offsetHeight;
var initialAreaHeight = textarea[0].offsetHeight;
@@ -17,33 +18,33 @@ app.initMessagebar = function (pageContainer) {
// Resize textarea
function sizeTextarea() {
-
// Reset
textarea.css({'height': ''});
var height = textarea[0].offsetHeight;
var diff = height - textarea[0].clientHeight;
var scrollHeight = textarea[0].scrollHeight;
+ var addExtra = messagebar.attr('data-keyboard-height') ? parseInt(messagebar.attr('data-keyboard-height')) : 0;
// Update
if (scrollHeight + diff > height) {
var newAreaHeight = scrollHeight + diff;
var newBarHeight = initialBarHeight + (newAreaHeight - initialAreaHeight);
var maxBarHeight = messagebar.attr('data-max-height') || messagebar.parents('.view')[0].offsetHeight - 88;
if (newBarHeight > maxBarHeight) {
- newBarHeight = maxBarHeight;
+ newBarHeight = parseInt(maxBarHeight);
newAreaHeight = newBarHeight - initialBarHeight + initialAreaHeight;
}
textarea.css('height', newAreaHeight + 'px');
messagebar.css('height', newBarHeight + 'px');
if (pageContent.length > 0) {
- pageContent.css('padding-bottom', newBarHeight + 'px');
+ pageContent.css('padding-bottom', newBarHeight + addExtra + 'px');
pageContent.scrollTop(pageContent[0].scrollHeight - pageContent[0].offsetHeight);
}
}
else {
if (pageContent.length > 0) {
messagebar.css({'height': ''});
- pageContent.css({'padding-bottom': ''});
+ pageContent.css({'padding-bottom': pageContentInitialPadding + addExtra + 'px'});
}
}
}

0 comments on commit 314bf89

Please sign in to comment.