jaz303 / jquery-grab-bag Goto Github PK

http://jsfiddle.net/9396H/
Incorrect sizing occurs when only a single blank is inserted on a new line. Position the cursor on new line and press the space bar - textarea shrinks. Adding any other text or removing the lone blank makes it grow again. Only happens with line-height specified.

FOA, thanks for your great plugin. I think it should be usefull to add the ability to pass at least one parameter (speed?) and to call a callback function. So I've modified one of your text effects like this:

$.fn.typewriter = function(speed, callback) {
this.each(function() {
var $ele = $(this), str = $ele.text(), progress = 0;
$ele.text('');
var timer = setInterval(function() {
$ele.text(str.substring(0, progress++) + (progress & 1 ? '_' : ''));
if (progress >= str.length){
clearInterval(timer);
if (typeof callback == 'function') { // make sure it is a function
callback.call(this); // brings the scope to the callback
}
}
}, speed);
});
return this;
};

Bye, Daniele.

You have in code

var val = this.value.replace(/</g, '&lt;')
                                    .replace(/>/g, '&gt;')
                                    .replace(/&/g, '&amp;')
                                    .replace(/\n$/, '<br/>&nbsp;')
                                    .replace(/\n/g, '<br/>')
                                    .replace(/ {2,}/g, function(space) { return times('&nbsp;', space.length -1) + ' ' });

This code works not correctly
because

"<".replace(/</g, '&lt;')
                                    .replace(/>/g, '&gt;')
                                    .replace(/&/g, '&amp;')
                                    .replace(/\n$/, '<br/>&nbsp;')
                                    .replace(/\n/g, '<br/>');

returns

"<" 

instead of

"<"

So you should put

.replace(/&/g, '&')

in first line

I want to grow the text box height till a certain height, Is it possible to do with this plugin?

Hey there, I've noticed now as I tried to use the Typewriter effect on some of my text that the css I had on the text vanishes and the text is renderedon the screen as just plain text. Should this be happening? If so, any chance that there will be a release of the typewriter effect that will preserve previous styling of text?

Thanks!

Hi,

Can you give us more clarity on the following comment on the header of the file https://github.com/jaz303/jquery-grab-bag/blob/master/javascripts/jquery.autogrow-textarea.js - "Auto-growing textareas; technique ripped from Facebook"

Does it mean that the code originate form some other source (which one?) or just the technique is similar to the one an user can experience at the Facebook site?
Please, confirm that the source code is written by you (and contributors to this repository) and the license (MIT) stated in the README file is correct. We need this to move forward the CQ https://dev.eclipse.org/ipzilla/show_bug.cgi?id=17841 to be able to use it in any of the Eclipse Foundation projects afterwards without legal issues.

Thanks in advance!

Regards,
Nedelcho

Some users report me that the autogrow-textarea plugin don't runs in google chrome. I debug the possible problem and I detected that when defines the noFlickerPad variable, the parseInt($self.css('lineHeight')) returns NaN (because lineHeight has the string "normal" as value).

I fixed the problem adding this line:

• if (isNaN(noFlickerPad)) noFlickerPad = parseInt($self.css('font-size'));

Josep.

When I use the autogrow on a textarea, it appends the following to the DOM:

<div style="position: absolute; top: -10000px; left: -10000px; width: 427.109px; font-size: 14.832px; font-family: system-ui; font-weight: 300; line-height: normal; resize: none; word-wrap: break-word;">...</div>

When I remove the textarea from the DOM, the above div still remains in the DOM. This continues to accumulate each time I add a textarea and remove it. You should change the following line:

$self.change(update).keyup(update).keydown({event:'keydown'},update);

to be this:

$self.change(update).keyup(update).keydown({event:'keydown'},update).on("remove", function(){
                shadow.remove();
            });

I have a good use for this plugin on an edit screen where when the form is first painted i show the initial data from a DB.
I have configured the input box to also use the JQuery UI autocomplete plugin to filter/match results of editing the data when the user types in the first few characters.

using this plugin together with that makes is very intuitive as when the box gets the focus the data is removed so that typing and matching can begin immediately. one does not have to remove the data when searching for a new entry. and if they leave the field's focus w/o making a change the original data entry is restored; very nice.

the only caveat is that if they make no change at all to that data field, then the data is removed on submit which invokes our 'required' field validation routine. (only on IE, In Chrome this does not happen)

is it possible to make calling RemoveHint() an option on sumbit? Not sure how i should be asking this as i have never done a Pull request before...

Or should i just subclass or monkeypatch the plugin myself to meet my needs?

I have commented out the form submit binding in the original source to meet my immediate needs , but i know that is not the right way to do this and want to follow best practices.

Hi I'm using auto-grow for more than 26 textarea.
It's working fine in chrome but it causing firefox unresponsive/hanged.

Hi,
I love the typewriter function, it's perfect for a current project.
However, I'd like to get it to repeat after a set amount of time. What's the best way to do this?

I tried wrapping a function around the part that goes in the tags of the HTML pge and using setTImeout like so:
announcement();
function announcement() {
$(document).ready(function() {
$("#content #announcement h2").typewriter();
});
setTimeout("announcement()", 10000);
}

but after a few rounds, the typewriter would stop one character before the end, then the next time two characters before the end, etc. I'm very new to JavaScript so am stumped by this one, didn't think it would be so hard just to get something to repeat :(

The website for Input Hints says that it pulls the hints from the title attribute, shows the example with a 'hint' attribute, and the actual code requires a 'placeholder' attribute.

If you paste text which is larger than the limit, it won't change the textarea size to the limit, nor will any subsequent changes change the textarea size until the text is below the limit.

Happened in Chrome on windows, haven't tested other browsers.