News: TinyPortal Release Schedule. Please read this update for More Info.

Login  |  Register
HTML5 Icon HTML5 Icon
TP on Social Media
Welcome, Guest. Please login or register.
Did you miss your activation email?

July 21, 2019, 03:15:15 PM

Login with username, password and session length

Recent

Members
Stats
  • Total Posts: 188522
  • Total Topics: 20737
  • Online Today: 43
  • Online Ever: 629
  • (November 08, 2018, 01:36:54 PM)
Users Online
Users: 1
Guests: 23
Total: 24

Author Topic: Character countdown for the shoutbox.  (Read 7117 times)

0 Members and 1 Guest are viewing this topic.

Offline WillyP

  • Support Team
  • *
  • Posts: 769
    • Planet Descent
Character countdown for the shoutbox.
« on: January 11, 2014, 07:21:56 AM »
Someone on my forum requested a character countdown be added to the shoutbox. I'm not sure that's a needed feature, but thought I'd ask anyway. Is this a possibility?

Offline ZarPrime

  • Friends
  • *
  • Posts: 4653
Re: Character countdown for the shoutbox.
« Reply #1 on: January 11, 2014, 12:21:42 PM »
WillyP, I'm not sure what you mean by that.  Do you mean that this person wants to somehow limit the number of characters for shouts in the shoutbox and that they want some sort of visual indicator to let people know how many characters are left?  If that's what they want, I'm not sure why.  The shoutbox isn't Twitter or something that limits the number of characters in a shout.  Could you find out what they want as I am kind of confused?

ZarPrime

Offline WillyP

  • Support Team
  • *
  • Posts: 769
    • Planet Descent
Re: Character countdown for the shoutbox.
« Reply #2 on: January 11, 2014, 12:34:18 PM »
The shout box already does limit the number of characters, actually, IIRC that is a setting.

What he asked for is a counter, that would countdown so you know how many characters are left. You see this a lot on contact forms, service request tickets, etc...

So lets say the limit is 100 characters, and you've typed 20, the counter would show 80 remaining.

Offline WillyP

  • Support Team
  • *
  • Posts: 769
    • Planet Descent
Re: Character countdown for the shoutbox.
« Reply #3 on: January 11, 2014, 02:04:44 PM »
Ok, there does not seem to be a setting for it, I've looked everywhere and can't find it. But it's definitely limited. Like around 250 or so.

Offline ZarPrime

  • Friends
  • *
  • Posts: 4653
Re: Character countdown for the shoutbox.
« Reply #4 on: January 11, 2014, 05:35:32 PM »
Well, it may be limited but, if it is, it would be hard coded, in the code of course.  I've never heard of someone making this request.  I'll see if I can take a look in the code tonight or tomorrow if I get a chance.  Right now, I am in the middle of a Federal Disaster area here in Kanawha County.  What a week this has been. :tickedoff:

ZP

Offline WillyP

  • Support Team
  • *
  • Posts: 769
    • Planet Descent
Re: Character countdown for the shoutbox.
« Reply #5 on: January 11, 2014, 05:45:33 PM »
No hurry, like I said I don't think it's something that is 'needed'.

Offline ZarPrime

  • Friends
  • *
  • Posts: 4653
Re: Character countdown for the shoutbox.
« Reply #6 on: January 11, 2014, 06:03:07 PM »
Well, it's possible this could be done.  I found one piece of code that might work with it but it would have to be added into the Shoutbox code. --> http://www.smartwebby.com/DHTML/textbox_characters_counter.asp

I'll look at this tomorrow but I'm sure it's not something we would want to add into the code permanently unless more than a few people requested something like that.

ZP

Offline WillyP

  • Support Team
  • *
  • Posts: 769
    • Planet Descent
Re: Character countdown for the shoutbox.
« Reply #7 on: January 11, 2014, 07:11:01 PM »
Awesome that worked and very easy to install... thanks!

Offline WillyP

  • Support Team
  • *
  • Posts: 769
    • Planet Descent
Re: Character countdown for the shoutbox.
« Reply #8 on: January 11, 2014, 07:24:28 PM »
Quicky tutorial for anyone else who wants to add this: Go to ZarPrimes link and copy the contents of the first codebox into the head of every theme you are using. From the second box, copy just
Code: [Select]
onKeyPress="return taLimit(this)" onKeyUp="return taCount(this,'myCounter')" into the textarea in tpshout.template.php. then add a back-slash in front of the single quotes around myCounter.

Then, the important part of the remaining code is
Code: [Select]
<SPAN id=myCounter>255</SPAN> which needs to be added to the html. And you can add the text explaining what the number is, if you want, though I think most people would get it even if you just put the number there. The relevant section of my TPshout.template.php ended up looking like this:
Code: [Select]
if(($context['TPortal']['guest_shout']) || (!$context['TPortal']['guest_shout'] && !$context['user']['is_guest']))
{
echo '
<textarea onKeyPress="return taLimit(this)" onKeyUp="return taCount(this,\'myCounter\')" class="editor" name="'. $context['tp_shout_post_box_name']. '" id="'. $context['tp_shout_post_box_name']. '" onselect="storeCaret(this);" onclick="storeCaret(this);" onkeyup="storeCaret(this);" onchange="storeCaret(this);" style="width: 80%;margin-top: 1ex; height: 50px;"  tabindex="', $context['tabindex']++, '"></textarea><br />';
if(!empty($context['TPortal']['show_shoutbox_smile']))
shout_smiley_code();
if(!empty($context['TPortal']['show_shoutbox_icons']))
shout_bcc_code();
if(!empty($context['TPortal']['show_shoutbox_smile']))
print_shout_smileys();
echo '<br /><B><SPAN id=myCounter>255</SPAN></B> characters remaining<br />
<input style="margin-top: 4px;" class="smalltext" type="submit" name="shout_send" value="'.$txt['shout!'].'" tabindex="', $context['tabindex']++, '" />';
}
if($context['user']['is_guest'] && $context['TPortal']['guest_shout'])
echo '<br /><input style="margin-top: 4px;" size="20" class="smalltext" type="text" name="tp-shout-name" value="'.$txt['tp-guest'].'" />';
elseif($context['user']['is_logged'])
echo '
<input type="hidden" name="tp-shout-name" value="'.$context['user']['name'].'" />';

echo '
<br /> <a href="' , $scripturl , '?action=tpmod;shout=show50">' . $txt['tp-showlatest'] . '</a>
<input name="tp-shout-url" type="hidden" value="'. $smcFunc['htmlspecialchars']($tp_where).'" />
<input type="hidden" name="sc" value="', $context['session_id'], '" />
</form>';

Offline WillyP

  • Support Team
  • *
  • Posts: 769
    • Planet Descent
Re: Character countdown for the shoutbox.
« Reply #9 on: January 12, 2014, 04:57:09 PM »
Did find a major bug, if you get to the last character, you can't edit or backspace your text.

Offline WillyP

  • Support Team
  • *
  • Posts: 769
    • Planet Descent
Re: Character countdown for the shoutbox.
« Reply #10 on: January 12, 2014, 06:39:28 PM »
Replaced with a whole new script. In the head:
Code: [Select]
<script language="javascript" type="text/javascript">
function limitText(limitField, limitCount, limitNum) {
if (limitField.value.length > limitNum) {
limitField.value = limitField.value.substring(0, limitNum);
} else {
limitCount.value = limitNum - limitField.value.length;
}
}
</script>

In the shout template textarea:
Code: [Select]
onKeyDown="limitText(this.form.limitedtextarea,this.form.countdown,250);"
onKeyUp="limitText(this.form.'. $context['tp_shout_post_box_name']. ',this.form.countdown,250);"

And below the textarea:
Code: [Select]
<input readonly type="text" name="countdown" size="3" value="250"> characters left<br />
This code lifted from: How to Limit the Number of Characters in a Textarea or Text Field

Offline IchBin™

  • Developer
  • *
  • Posts: 16228
    • My Website
Re: Character countdown for the shoutbox.
« Reply #11 on: January 13, 2014, 08:15:34 AM »
Good work WillyP! Yeah I've often thought about these things. Useful to have, and not a big problem to implement as you noticed. :)