A way to display word counts for posts?

peripatew

I'm working on a forum with students. While they're getting used to the forum environment, I'm encouraging them to commit to certain word counts in their initial posts, as well as their follow up responses to other students. I know there's a character limit setting within the preferences, but is there a way to display the word count? Something that's dynamic would be nice, so as they type, it would update the number. But a button by the "post discussion" "save draft" etc... that would count on click would work fine too.

Not sure which would be best in terms of web standards. I've got users on all browsers, and lots of mobile devices.

Is this functionality there? Not to overwhelm @businessdad with my non-stop questions, but I'll mention you here as your responses have been quite helpful.

hbf

im not aware of any plugins that do this today, but i can envision a JS which you attach to the comment field could do this very simply.

Kasper

This is a great idea for a plugin... I'm on it!

Kasper

Nailed it...! Haven't quite decided on a useful format yet though. Currently, this is how I'm displaying it:

Dunno if that's the best approach - ideas?

P.S.: I'll add an optional word counter too

Kasper

In the end, I decided on this:

For the geeky reader: I'm using setInterval to run a val() evaluation every 100ms meaning that the counter doesn't rely on user events thus being compatible with WYSIWYG editors (fully compatible with Wysihtml5, works with CLEditor).

Kasper

@peripatew Here ya' go: https://github.com/kasperisager/WordCount. I'll upload it as soon as I get access to a Windows PC with IE. Haven't tested it with Vanilla 2.0 yet but it should work.

businessdad

@kasperisager said:
peripatew Here ya' go: https://github.com/kasperisager/WordCount. I'll upload it as soon as I get access to a Windows PC with IE. Haven't tested it with Vanilla 2.0 yet but it should work.

Well done!
If I may, I would like to suggest to ensure that plugins are compatible on Vanilla 2.0, as it's the stable version, rather than chasing 2.1, with all its changes.
I'm not trying to diminish the effort you put in it, nor implying that it's a "bad practice", but it's simply that, while 2.0 is production ready, 2.1 may be unstable and most people would not use it on their website (nor they should, in a production environment). As such, by supporting 2.1 and not 2.0, you may risk to cut out part of the User base.

Just a personal point of view, based on my experience.

peripatew

Awesome! Quick work @kasperisager

I can confirm that it does work with the current Vanilla 2.0. However, it does not work with the WYSIWYG (CLEditor) plugin. If I switch it off it works great, or if I switch to viewing the code, rather than the "pretty" view.

I use the CLEditor a LOT, but my users don't seem to at the moment. Would there be a way for it to work with that plugin as well?

Here's what it looks like in my theme: http://d.pr/i/CxK3

Word count is most important for me, but having some visual feedback of how many characters remain is helpful as well. I'm working on my masters degree right now, and we use online forums for a lot of our discussion. We have firm character limits to our responses, and I'd LOVE a counter there. To bad they don't use vanilla!

**I personally would prefer the format to be: ### words | ### characters left. **

This also works perfectly on my iPhone! Great work!

Kasper

@businessdad: I couldn't agree more - my rather tight schedule doesn't allow for much testing though and I only have one Vanilla environment running 2.1 that I use for developing custom themes. This time I'm pretty sure it's compatible with 2.0 too though :-)

@peripatew: Great, glad you could could use it! It does indeed "work" with CLEditor, however in rather annoying way: CLEditor only passes its data to the original textarea on blur (when your mouse clicks outside the textarea) and Word Count can therefore only count stuff when this happens. Wysihtml5, on the other hand, passes its data to the original textarea continuously and is therefore fully compatible with Word Count. As for the format, you can easily change it to your preference using this bit of CSS:

.WordCount ul {
    float: left;
}

.WordCount:after {
    content: "";
    display: table;
    clear: both;
}

.WordCount li {
    float: right;
}

.WordCount .Words:after {
    content: "|";
    margin: 0 10px;
}

Thanks again for your compliments guys!

Oh, and blam: http://vanillaforums.org/addon/wordcount-plugin

hbf

Good work Kasper