jquery.autogrow-textarea - npm Package Compare versions

Comparing version 0.2.1 to 0.2.2

jquery.autogrow-textarea.js

@@ -25,3 +25,4 @@ // Based off https://code.google.com/p/gaequery/source/browse/trunk/src/static/scripts/jquery.autogrow-textarea.js?r=2
 			vertical: true,
-			horizontal: false
+			horizontal: false,
+			characterSlop: 0
 		}, options);
@@ -34,3 +35,2 @@
 				maxHeight	= $this.attr( "maxHeight" ),
-                lineHeight  = $this.css('lineHeight'),
 				minWidth	= typeof( $this.attr( "minWidth" ) ) == "undefined" ? 0 : $this.attr( "minWidth" );
@@ -55,3 +55,3 @@
             
-            var update = function() {
+            var update = function( val ) {
     
@@ -63,3 +63,4 @@ var times = function(string, number) {
                 
-                var val = this.value;
+                if( typeof val === 'undefined' ) val = this.value;
+				if( val === '' && $(this).attr("placeholder") ) val = $(this).attr("placeholder");
 				
@@ -73,11 +74,18 @@ if( options.vertical )
 						.replace(/ {2,}/g, function(space) { return times(' ', space.length -1) + ' '; });
-				
+				else
+					val = val.replace(/ /g, ' ');
+
 				//if( options.horizontal )
 				//	val = $.trim( val );
 				
-                shadow.html(val).css( "width", "auto" );
+				// if( $(this).prop( 'tagName' ).toUpperCase() === 'INPUT' )
+				// 	shadow.text(val).css( "width", "auto" );
+				// else
+				shadow.html(val).css( "width", "auto" );
 				
 				if( options.horizontal )
 				{
-					var newWidth = Math.max( shadow.width() + characterWidth * 3, minWidth );
+					var slopWidth = options.characterSlop * characterWidth + 2;
+
+					var newWidth = Math.max( shadow.width() + slopWidth, minWidth );
 					var maxWidth = options.maxWidth;
@@ -100,6 +108,13 @@ //if( typeof( maxWidth ) === "undefined" ) maxWidth = $this.parent().width() - 12; // not sure why we were doing this but seems like a bad idea. doesn't work with inline-block parents for one thing, since it is the text area that should be "pushing" them to be wider
             $(this)
-				.change(update)
-				.keyup(update)
-				.keydown(update)
-				.bind( "update.autogrow", update )
+				.change(function(){update.call( this );return true;})
+				.keyup(function(){update.call( this );return true;})
+				.keypress(function( event ) {
+					var val = this.value;
+					var caretInfo = _getCaretInfo( this );
+
+					var valAfterKeypress = val.slice( 0, caretInfo.start ) + String.fromCharCode( event.which ) + val.slice( caretInfo.end );
+					update.call( this, valAfterKeypress );
+					return true;
+				})
+				.bind( "update.autogrow", function(){update();} )
 				.bind( "remove.autogrow", function() {
@@ -115,3 +130,50 @@ shadow.remove();
     };
+
+    // comes from https://github.com/madapaja/jquery.selection/blob/master/src/jquery.selection.js
+    var _getCaretInfo = function(element){
+        var res = {
+            text: '',
+            start: 0,
+            end: 0
+        };
+
+        if (!element.value) {
+            /* no value or empty string */
+            return res;
+        }
+
+        try {
+            if (window.getSelection) {
+                /* except IE */
+                res.start = element.selectionStart;
+                res.end = element.selectionEnd;
+                res.text = element.value.slice(res.start, res.end);
+            } else if (doc.selection) {
+                /* for IE */
+                element.focus();
+
+                var range = doc.selection.createRange(),
+                    range2 = doc.body.createTextRange();
+
+                res.text = range.text;
+
+                try {
+                    range2.moveToElementText(element);
+                    range2.setEndPoint('StartToStart', range);
+                } catch (e) {
+                    range2 = element.createTextRange();
+                    range2.setEndPoint('StartToStart', range);
+                }
+
+                res.start = element.value.length - range2.text.length;
+                res.end = res.start + range.text.length;
+            }
+        } catch (e) {
+            /* give up */
+        }
+
+        return res;
+    };
+
     
 } ) );

package.json

 {
   "name": "jquery.autogrow-textarea",
-  "version": "0.2.1",
+  "version": "0.2.2",
   "description": "This is a jquery plugin that will auto-grow your text areas vertically (like facebook) or horizontally. It is based off [a code snippet by dhruvbird](https://code.google.com/p/gaequery/source/browse/trunk/src/static/scripts/jquery.autogrow-textarea.js?r=2). The plugin uses a hidden mirror textarea to calculate the idea height (and width) of the target text area. Differences from the original code snippet are:",
@@ -5,0 +5,0 @@ "main": "jquery.autogrow-textarea.js",

Fixed alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

9087

increased by29.48%

Lines of code

140

increased by57.3%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes