Register Members List Search Today's Posts Mark Forums Read

Reply
 
Mod Options
New vBCode Tags: [Countdown] and [Countup] timers for users Details »
New vBCode Tags: [Countdown] and [Countup] timers for users
Mod Version: 1.00, by KevinG (Member) KevinG is offline
Developer Last Online: Feb 2003 I like it Show Printable Version Email this Page

This modification is in the archives.
vB Version: 2.2.x Rating: (0 vote - 0 average) Installs: 13
Released: 03 May 2002 Last Update: Never Downloads: 2
Not Supported  

Have you or any of your members ever had the need or desire to post a countdown or countup in a post?
Something that automatically shows the remaining days, hours, minutes and seconds of that upcoming Walt Disney World trip?
Or want to show everyone how many days, hours, minutes and seconds that the user has gone without a cigarette, drink, sex? - LOL

I came up with this one here. It basically gives your users two new vB Code Tags, [countdown] and [countup].
Now there is no need to worry that the user will mess up your threads with incorrect JavaScript.
All they have to do is use these tags, just like most other tags.

For counting down, they would just have to do the following:
[countdown=May 21, 2002 12:32 PM EST;We are off to see Mickey Mouse;RED]My Walt Disney World Trip Begins in [/countdown]

Same for counting up with just different text of course.

I guess this would qualify as a hack as you do need to change one field in the database to store this.
Luckily, it's in a very small table so it should not slow anything down in theory.


Modify the database
Modify the field bbcodereplacement in the bbcode table to increase the storage size.
Change the field properties from varchar(200) to LONGTEXT. This is needed for the new vB Code replacement to follow.
I used phpMyAdmin which is very easy to use for this change.

Add new JavaScript
Add the following JavaScript code to your Style under Head Insert preferrably at the bottom.
Be sure to do this for every style that you defined in your database.


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

Add the new vBCodes
Using the Admin CP, add the following;

vB Code tag
-----------------------------------------------------
countdown


vB Code replacement
-----------------------------------------------------

Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

vB Code example
-----------------------------------------------------
[countdown="May 4, 2002;Currently At WDW Now;BLUE"]My Countdown to Disney World[/countdown]

vB Code explanation
-----------------------------------------------------
Enter any text you would like to say to your members here.

Use {option} ?
-----------------------------------------------------
Select YES


Add the [countup] tag next;
vB Code tag
-----------------------------------------------------
countup

vB Code replacement
-----------------------------------------------------

Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

vB Code example
-----------------------------------------------------
[countup="May 4, 2002;Waiting for my last cigarette;RED"]Smokefree Days[/countup]

vB Code explanation
-----------------------------------------------------
Enter any text you would like to say to your members here.

Use {option} ?
-----------------------------------------------------
Select YES



There are many variations that can be use here for how the text field looks.
We can post suggestions here for everyone to share

I can post a screenshot tomorrow if you would like.
It's really just a text field containing the days, hours, minutes and seconds of the timers with the {param} text over it.

Edit:
Reformatting some of the text as the PHP blocks are very wide.
Also fixed a case conversion that the PHP code tag is making in my post.

Download Now

Only licensed members can download files, Click Here for more information.

Show Your Support

  • To receive notifications regarding updates -> Click to Mark as Installed.
  • This modification may not be copied, reproduced or published elsewhere without author's permission.
Similar Mod
Mod Developer Type Replies Last Post
New vbcode.js - vBcode and smilie user interface improvement s.molinari vBulletin 2.x Full Releases 206 01 Feb 2004 21:44

  #16  
Old 03 May 2002, 20:18
KevinG KevinG is offline
 
Join Date: Dec 2001
After trying it out on your site, I found a small typo in your script. I then checked this with what I posted and it seems that it got changed (not sure how as I copy/pasted this from my AdminCP).
The typo is the second line of both countdown and countup function. The line that fails is

Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

The lowercase d in the first date is causing your problems.

This is part of the code that goes into your Head Insert section.

Below is the correct line for both functions.

I will fix the first post here. Maybe PHP tag is doing this ???


Edit: I just tried the [ code ] tag to post the correct line and it did it again
Both PHP and CODE tags are making this line appear incorrect.

y2k = new Date(date);

Admins/Mods,

I'm not sure how I can fix this so the members can see the code.
Help Please.

Kevin

Last edited by KevinG; 03 May 2002 at 20:24.
Reply With Quote
  #17  
Old 03 May 2002, 20:29
KevinG KevinG is offline
 
Join Date: Dec 2001
The first post is all fixed now. I separated the date parameter in
y2k = new Date(date);
into
y2k = new Date( date );

so PHP does not change it to
y2k = new date(date);
Reply With Quote
  #18  
Old 03 May 2002, 20:50
KevinG KevinG is offline
 
Join Date: Dec 2001
Here's a style that removes the input box look.

Change the line for the input field to;

document.writeln("<input type=text value='' size=40 name='countdown' border-style='none' style='border-bottom: 0px solid; border-left: 0px solid;border-right: 0px solid;border-top: 0px solid'>");
Attached Images
File Type: jpg style1.jpg (7.8 KB, 111 views)
Reply With Quote
  #19  
Old 03 May 2002, 21:26
KevinG KevinG is offline
 
Join Date: Dec 2001
Here another one, transparent background instead of the white box.

Change the line for the input field to;

document.writeln("<input type=text value='' size=40 name='countdown' border-style='none' style='background-color:transparent; border-bottom: 0px solid; border-left: 0px solid;border-right: 0px solid;border-top: 0px solid'>");
Attached Images
File Type: jpg style2.jpg (6.5 KB, 93 views)
Reply With Quote
  #20  
Old 04 May 2002, 06:46
Ruth Ruth is offline
 
Join Date: Oct 2001
KevinG... very nice hack

i'm thinking to use this as a gradutation count down....

users can choose the year from a drop down menu during registration

then the count down appears in their profile

is this possible to hack it even more for that purpose ?

thanks
Reply With Quote
  #21  
Old 04 May 2002, 17:45
Sweet Cheeks's Avatar
Sweet Cheeks Sweet Cheeks is offline
 
Join Date: Mar 2002
Kevin I installed the hack on my site, everyone LOVES it!! I was wondering if you had a site link or something we could give your credit for? Thank you!
Reply With Quote
  #22  
Old 04 May 2002, 18:53
KevinG KevinG is offline
 
Join Date: Dec 2001
Originally posted by Ruth
KevinG... very nice hack

i'm thinking to use this as a gradutation count down....

users can choose the year from a drop down menu during registration

then the count down appears in their profile

is this possible to hack it even more for that purpose ?

thanks
Thanks Ruth. We could hack it some more if you'd like but that one would get away from it's simplicy

We can discuss via PM here to get your version. Sound good?
(or do others want this as well?)

Originally posted by ~*Julie*~

Kevin I installed the hack on my site, everyone LOVES it!! I was wondering if you had a site link or something we could give your credit for? Thank you!
You're welcome. I did this and then searched here to see if anyone else already did it. During the search, you name popped up so I just decided to post it. I don't need to have my credit linked from your site. Mine is a private site for family members and strangers might freak them out - LOL. Just tell them it's from the baby stork
If my wife is expecting again ( oh I hope not ), we'll stop by. Deal?
Reply With Quote
  #23  
Old 06 May 2002, 11:03
KuraFire's Avatar
KuraFire KuraFire is offline
 
Join Date: Nov 2001
Real name: Faruk
Kevin, nice hack, but I really suggest you turn it into a Showthread hack. As it is, being put in the head of _all_ pages on the board, it's quite a bandwidth-impact for no reason. The part for in <head> is, imo, rather huge, and loading that when it's not necessary is just diminishing your bandwidth for nothing.

showthread.php hack shouldn't be too hard...
__________________
EverythingvB.com is closed; it will merge into the KuraFire Network, version 6. KF*N 6 will have information about XHTML, CSS, PHP and vBulletin, and especially all those combined.
Reply With Quote
  #24  
Old 06 May 2002, 14:44
KevinG KevinG is offline
 
Join Date: Dec 2001
Thanks KuraFire.

I'll check that out. I would also have to modify newreply.php as well then. Also, the PM display code in private.php as these can also be used in sigs.

Thanks for the suggestion.
Reply With Quote
  #25  
Old 13 May 2002, 19:44
Sweet Cheeks's Avatar
Sweet Cheeks Sweet Cheeks is offline
 
Join Date: Mar 2002
Congratulations on the baby coming Kevin! Thanks again for everythign!! Woohoo!
Reply With Quote
  #26  
Old 13 May 2002, 23:34
BigJohnson BigJohnson is offline
 
Join Date: Nov 2001
How can we make the changes in our board so that the button that we make for it will give you the correct java script pop up to insert all the right stuff in the correct places because it isnt a simple [countdown] hey [/countdown] thing. You need to add like font color and all the type of stuff. Is there anyone here with this type of knowledge to tell us how we can do this. Thanks you so much.
Reply With Quote
  #27  
Old 14 May 2002, 22:36
BigJohnson BigJohnson is offline
 
Join Date: Nov 2001
bump
Reply With Quote
  #28  
Old 15 May 2002, 17:46
KevinG KevinG is offline
 
Join Date: Dec 2001
Maybe you can try something like this?

Add this to the vbcode.js file in your forum directory

Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

Then add the buttons to your vbcode_buttons template:
My template looks like this after adding them after the "quote" button. This was added after the <BR> tag which puts them on the third line of buttons.


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

Reply With Quote
  #29  
Old 20 May 2002, 16:18
rcooper7 rcooper7 is offline
 
Join Date: May 2002
Great looking hack will do good on my Disney Page! thanks!

Ryan C.
Reply With Quote
  #30  
Old 20 May 2002, 16:23
rcooper7 rcooper7 is offline
 
Join Date: May 2002
One Question, How do you Modify the database.

Can someone walk me through this? I have phpmyadmin. . .

Thanks
Reply With Quote
Reply


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Mod Options

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off


New To Site? Need Help?

All times are GMT. The time now is 01:14.

Layout Options | Width: Wide Color: