diff options
Diffstat (limited to 'web')
| -rw-r--r-- | web/js/jquery.autoresize.js | 140 | ||||
| -rw-r--r-- | web/scripts3.js | 13 |
2 files changed, 104 insertions, 49 deletions
diff --git a/web/js/jquery.autoresize.js b/web/js/jquery.autoresize.js index a54ec545..4bc0959a 100644 --- a/web/js/jquery.autoresize.js +++ b/web/js/jquery.autoresize.js @@ -1,7 +1,7 @@ /* - * jQuery.fn.autoResize 1.1 + * jQuery.fn.autoResize 1.14 * -- - * https://github.com/jamespadolsey/jQuery.fn.autoResize + * https://github.com/padolsey/jQuery.fn.autoResize * -- * This program is free software. It comes without any warranty, to * the extent permitted by applicable law. You can redistribute it @@ -11,24 +11,28 @@ (function($){ - var defaults = autoResize.defaults = { - onResize: function(){}, - animate: { - duration: 200, - complete: function(){} - }, - extraSpace: 0, - minHeight: 1, - maxHeight: 500, - minWidth: 'original', - maxWidth: 500 - }; + var uid = 'ar' + +new Date, + + defaults = autoResize.defaults = { + onResize: function(){}, + onBeforeResize: function(){return 123}, + onAfterResize: function(){return 555}, + animate: { + duration: 200, + complete: function(){} + }, + extraSpace: 50, + minHeight: 'original', + maxHeight: 500, + minWidth: 'original', + maxWidth: 500 + }; autoResize.cloneCSSProperties = [ 'lineHeight', 'textDecoration', 'letterSpacing', 'fontSize', 'fontFamily', 'fontStyle', 'fontWeight', 'textTransform', 'textAlign', 'direction', 'wordSpacing', 'fontSizeAdjust', - 'padding' + 'paddingTop', 'paddingLeft', 'paddingBottom', 'paddingRight', 'width' ]; autoResize.cloneCSSValues = { @@ -39,7 +43,14 @@ overflow: 'hidden' }; - autoResize.resizableFilterSelector = 'textarea,input:not(input[type]),input[type=text],input[type=password]'; + autoResize.resizableFilterSelector = [ + 'textarea:not(textarea.' + uid + ')', + 'input:not(input[type])', + 'input[type=text]', + 'input[type=password]', + 'input[type=email]', + 'input[type=url]' + ].join(','); autoResize.AutoResizer = AutoResizer; @@ -53,8 +64,12 @@ } function AutoResizer(el, config) { + + if (el.data('AutoResizer')) { + el.data('AutoResizer').destroy(); + } - config = this.config = $.extend(autoResize.defaults, config); + config = this.config = $.extend({}, autoResize.defaults, config); this.el = el; this.nodeName = el[0].nodeName.toLowerCase(); @@ -78,8 +93,14 @@ el.data('AutoResizer', this); - this.createClone(); - this.injectClone(); + // Make sure onAfterResize is called upon animation completion + config.animate.complete = (function(f){ + return function() { + config.onAfterResize.call(el); + return f.apply(this, arguments); + }; + }(config.animate.complete)); + this.bind(); } @@ -98,9 +119,14 @@ this.el .bind('keyup.autoResize', check) //.bind('keydown.autoResize', check) - .bind('change.autoResize', check); + .bind('change.autoResize', check) + .bind('paste.autoResize', function() { + setTimeout(function() { check(); }, 0); + }); - this.check(null, true); + if (!this.el.is(':hidden')) { + this.check(null, true); + } }, @@ -111,15 +137,7 @@ createClone: function() { var el = this.el, - clone; - - if (this.nodeName === 'textarea') { - clone = el.clone().height('auto'); - } else { - clone = $('<span/>').width('auto').css({ - whiteSpace: 'nowrap' - }); - } + clone = this.nodeName === 'textarea' ? el.clone() : $('<span/>'); this.clone = clone; @@ -130,18 +148,36 @@ clone .removeAttr('name') .removeAttr('id') + .addClass(uid) .attr('tabIndex', -1) .css(autoResize.cloneCSSValues); + if (this.nodeName === 'textarea') { + clone.height('auto'); + } else { + clone.width('auto').css({ + whiteSpace: 'nowrap' + }); + } + }, check: function(e, immediate) { + if (!this.clone) { + this.createClone(); + this.injectClone(); + } + var config = this.config, clone = this.clone, el = this.el, value = el.val(); + // Do nothing if value hasn't changed + if (value === this.prevValue) { return true; } + this.prevValue = value; + if (this.nodeName === 'input') { clone.text(value); @@ -159,15 +195,19 @@ (newWidth >= config.minWidth && newWidth <= config.maxWidth) ) { + config.onBeforeResize.call(el); config.onResize.call(el); el.scrollLeft(0); - config.animate && !immediate ? + if (config.animate && !immediate) { el.stop(1,1).animate({ width: newWidth - }, config.animate) - : el.width(newWidth); + }, config.animate); + } else { + el.width(newWidth); + config.onAfterResize.call(el); + } } @@ -177,9 +217,9 @@ // TEXTAREA - clone.height(0).val(value).scrollTop(10000); + clone.width(el.width()).height(0).val(value).scrollTop(10000); - var scrollTop = clone[0].scrollTop + config.extraSpace; + var scrollTop = clone[0].scrollTop; // Don't do anything if scrollTop hasen't changed: if (this.previousScrollTop === scrollTop) { @@ -188,26 +228,30 @@ this.previousScrollTop = scrollTop; - if (scrollTop >= config.maxHeight) { + if (scrollTop + config.extraSpace >= config.maxHeight) { el.css('overflowY', ''); - return; - } - - el.css('overflowY', 'hidden'); - - if (scrollTop < config.minHeight) { + scrollTop = config.maxHeight; + immediate = true; + } else if (scrollTop <= config.minHeight) { scrollTop = config.minHeight; + } else { + el.css('overflowY', 'hidden'); + scrollTop += config.extraSpace; } + config.onBeforeResize.call(el); config.onResize.call(el); - + // Either animate or directly apply height: - config.animate && !immediate ? + if (config.animate && !immediate) { el.stop(1,1).animate({ height: scrollTop - }, config.animate) - : el.height(scrollTop); - + }, config.animate); + } else { + el.height(scrollTop); + config.onAfterResize.call(el); + } + }, destroy: function() { @@ -227,4 +271,4 @@ }; -})(jQuery);
\ No newline at end of file +})(jQuery); diff --git a/web/scripts3.js b/web/scripts3.js index ec86d39e..12e0aeee 100644 --- a/web/scripts3.js +++ b/web/scripts3.js @@ -39,10 +39,21 @@ function showCommentForm(mid,rid) { var c=$('#replies #'+rid+' .msg-comment'); c.wrap('<form action="/post" method="POST" enctype="multipart/form-data"/>'); c.before('<input type="hidden" name="mid" value="'+mid+'"/><input type="hidden" name="rid" value="'+rid+'"/>'); - c.append('<textarea name="body" rows="1" placeholder="Add a comment..." onkeypress="postformListener(this.form,event)"></textarea>'); + c.append('<textarea name="body" rows="1" class="reply" placeholder="Add a comment..." onkeypress="postformListener(this.form,event)"></textarea>'); } $('#replies #'+rid+' .msg-links').hide(); $('#replies #'+rid+' .msg-comment').show(); $('#replies #'+rid+' textarea')[0].focus(); + $('#replies #'+rid+' textarea').autoResize({ + extraSpace: 0, + minHeight: 1 + }); return false; } + +$(document).ready(function() { + $('textarea.reply').autoResize({ + extraSpace: 0, + minHeight: 1 + }); +}); |