borkjev
General Public
Posts:
99( 0.09%) Threads: 25( 0.03%) Private Posts: 20
|
This user's posts are being ignored. Show Post?
would it be possible in anyway to put the countdown in a javascript in some way so it would keep counting down and not only change when u load the page?? i'm not really good at javascript but when i get some cheap example i can search my way into it  -- designer of http://aszune.dkpsystem.com
|
Kriknosnah
General Public
Posts:
109( 0.10%) Threads: 20( 0.02%) Private Posts: 0
|
This user's posts are being ignored. Show Post?
It would be fairly simple using regex (regular expressions) to pull the 3 numbers out and then using the time and math functions of javascript start a timer based on those numbers. Of course this is rough but it would be fairly accurate.
If you need code for setting up a timer look at hotscripts.com there is several free scripts there as well as tutorials. Also W3C has a list of all javascript functions and it will include all the date and time functions as well as basic examples.
|
Kriknosnah
General Public
Posts:
109( 0.10%) Threads: 20( 0.02%) Private Posts: 0
|
This user's posts are being ignored. Show Post?
|
Posted: 6357 days ago
|
Edited: 6357 days ago
|
|
Ok, I love a good challenge.
Also, my suggestion to go to hotscripts.com to get the code, ignore that. All the code I saw was for making a count down timer to some odd ball date in the future (ie. xxx days till christmas). Who cares how many days till christmas. Not to mention when they use 200+ lines of code to get it to work I think, ouch, yea lets just go ahead and make my site run slower, not.
And beyond that regex goes over most casual programmers heads, so.
I built the timer and here it is for all of you to enjoy (comments included for ease of editing):
Place following in the head of the layout.htm page
<head>
<style type="text/css">
.hideit {display: none;}
.timestyel {font-size: 20px; color: #00FF00; font-family: arial, helvetica, san-serif;}
.timerlink {font-size: 20px; color: #00FF00; font-family: arial, helvetica, san-serif;}
</style>
<script type="text/javascript" language="javascript">
document.write("<div id='raidingtimer' class='hideit'><!--System:CountDown --></div>"); //give the countdown an Id for geting the child <A> tag
var maincontent = document.getElementById("raidingtimer"); //Get the parten Id for "thehref"
var innercontent = maincontent.innerHTML; //Get the actuall count down timer
var thehref = maincontent.getElementsByTagName('a'); //Get the href value for recreating the link
var linkstext = thehref[0].innerHTML; //getts the linked text
var linkall = "<a class='timerlink' href='" + thehref[0] + "'>" + linkstext + "</a>"; //Rebuild the link with a class for changing the style of the link
var contentnum = innercontent.match(/(\d+)/g); //Gets all the digits from the countdown and puts them into an array
var eighthword = innercontent.split(" "); //splits each word in the countdown into an array
var hour = contentnum[0]; //gets the first digit in the "contentnum" array and sets it to hour
var minute = contentnum[1]; //gets the second digit in the "contentnum" array and sets it to minute
var sec = contentnum[2]; //gets the third digit in the "contentnum" array and sets it to sec
function countdown(){ //the new dynamic countdown function
if (eighthword[7] == "until"){ //finds out if it the counter is going up or down
sec--; //reduce the seconds by 1
var lastwords = ""; //set if a word is needed after the raid title
if (sec < "0"){ //the if will reduce the "minute" by 1 if sec reaches less than 0
sec = 59; //resets sec to 59 to continue the countdown
minute--; //reduces minute by 1
}
if (minute < "0"){ //the if will reduce the "hour" by 1 if minute reaches less than 0
minute = 59; //resets minute to 59 to continue the countdown
hour--; //reduces hour by 1
}
if (hour == "0" && minute == "0" && sec == "0") {
document.location.reload() //if the timer reaches all 0's beacuse some left the page up
} //this will reload the page to get the new timer values
}
if (eighthword[7] == "since") { //finds out if it the counter is going up or down
sec++; //ups the seconds by 1
var lastwords = " started"; //set if a word is needed after the raid title
if (sec == "60"){ //the if will add 1 to the "minute" if sec reaches 60
sec = 0; //resets sec to 0 to continue the countdown
minute++; //adds 1 to the minute
}
if (minute == "60"){ //the if will add 1 to the "hour" if minute reaches 60
minute = 0; //resets minute to 0 to continue the countdown
hour++; //adds 1 to the hour
if (hour >= "2"){
document.location.reload() //as I was unsure when the timer switches to counting down to an event
} // I set this to relaod the page every hour after the first 2 have ellapsed
}
}
var timed = "<span class='timestyel'>" + hour + ":" + minute + ":" + sec + " " + eighthword[7] + "<br>" +
linkall + lastwords + "</span>"; //writes the new countdown timer
document.getElementById('rtcontent').innerHTML = timed; //places the new countdown timer into the "body" of the page
t=setTimeout("countdown()", 1000); //the heart of the countdown timer.
} //if you build you own this is were you will want to start
</script>
</head>
Copy and paste the above code out, it will be easier to read.
Change the "body tag to:
<body onload="countdown()">
Place this where you are wanting to have your <!--System:CountDown --> appear:
<div id="rtcontent" align="center">
</div>
Make sure you relpace the <!--System:CountDown --> with with the above 3 lines
Also the formating for the timer can be changed in the "timed" variable in the javascript. And as I added a class to the text and the link you can change the colors and fonts using CSS.
I hope everyone enjoys this.
Feel free to let me know if any of you have any problems.
|
Chops
Administrator
Posts:
7607( 7.27%) Threads: 218( 0.25%) Private Posts: 1160
Guild(s):PiaS
|
This user's posts are being ignored. Show Post?
Wow, I hope a lot get a lot of use out of this nice little script from you Krik
--
It's all in the reflexes.
|
borkjev
General Public
Posts:
99( 0.09%) Threads: 25( 0.03%) Private Posts: 20
|
This user's posts are being ignored. Show Post?
thanks m8  i tweaked it a little bit but its awesome thanks -- designer of http://aszune.dkpsystem.com
|
Kriknosnah
General Public
Posts:
109( 0.10%) Threads: 20( 0.02%) Private Posts: 0
|
This user's posts are being ignored. Show Post?
No problem, glad you like it.
I am also glad you found it easy to customize. My biggest thing with scripts is first when they are way to long for a simple task and two when the original coder makes them to hard to customize.
|
borkjev
General Public
Posts:
99( 0.09%) Threads: 25( 0.03%) Private Posts: 20
|
This user's posts are being ignored. Show Post?
|
Posted: 6354 days ago
|
Edited: 6354 days ago
|
|
var timed = "<span class='timestyel'>" + hour + ":" + minute + ":" + sec + " " + eighthword[7] + "<br>" +
linkall + lastwords + "</span>"; //writes the new countdown timerhere i changed it to var timed = "<span class='timestyel'>" + hour + " " + "hours" + " " + minute + " " + "minutes" + " " + sec + " " + "seconds" + " " + eighthword[7] + " " +
linkall + lastwords + "</span>";which makes it look a lot nicer and it is indeed easy to customize it's running on the test site btw -- designer of http://aszune.dkpsystem.com
|
Dregean
Guild Operator
Posts:
16( 0.02%) Threads: 5( 0.01%) Private Posts: 0
|
This user's posts are being ignored. Show Post?
Howdy. So if someone with zero coding experience wanted to implement this timer into the website for "Time left until Gruuls" or some-such how would i do it. When it says copy layout.htm does that mean just post it in a word doc and changed the file extension? Thanks Dregean --  
|
Nitesbane
Contributor
Posts:
333( 0.32%) Threads: 55( 0.06%) Private Posts: 31
|
This user's posts are being ignored. Show Post?
|
Posted: 6284 days ago
|
Edited: 6284 days ago
|
|
Howdy.
So if someone with zero coding experience wanted to implement this timer into the website for "Time left until Gruuls" or some-such how would i do it. When it says copy layout.htm does that mean just post it in a word doc and changed the file extension?
Thanks
Dregean You would need to head into Admin -> Advanced Layout Options and then click the link that says Generate Layout and Menu Files. Then right-click Current Layout File and choose "Save As..." That's how you get your layout.html file. Then you open it in a text editor (I use Notepad) and copy/paste the awesome script that Kriknosnah so thoughtfully provided for us. I also tweaked mine just a bit, and expect to have it running on my site within a few minutes (have to look up the color codes of my links first so it matches!). Thanks Krik!  **EDIT**: I just noticed that when you're using a drop-in template like I am and you generate your layout files from the Advanced Layout Options, it gives you the layout for whatever you had before you put the template in. So Dregean, you'd have to go into Admin - Drop-In Templates, download your template, then extract the layout.html file from the .zip and edit it from there. Head to Advanced Layout Options when you're done to upload/test it after you're done editing. -- Ieyasu - Organizer, Ex Cineribus
|
Anthrax
Guild Operator
Posts:
83( 0.08%) Threads: 22( 0.03%) Private Posts: 3
|
This user's posts are being ignored. Show Post?
Yeah, I went in and tried to this before as well. Had some issues with it. It removed my ability to change thread tags and would never tick down the countdown. Probably something I did incorrectly.
Anthrax
|
Nitesbane
Contributor
Posts:
333( 0.32%) Threads: 55( 0.06%) Private Posts: 31
|
This user's posts are being ignored. Show Post?
Yeah, I went in and tried to this before as well. Had some issues with it. It removed my ability to change thread tags and would never tick down the countdown. Probably something I did incorrectly.
Anthrax Looks like you accidentally erased one of the <head> tags when you pasted it in. -- Ieyasu - Organizer, Ex Cineribus
|
Anthrax
Guild Operator
Posts:
83( 0.08%) Threads: 22( 0.03%) Private Posts: 3
|
This user's posts are being ignored. Show Post?
So I did, put in the head tag and still have some result. No countdown and lose the ability to change thread tags.
Anthrax
|
Nitesbane
Contributor
Posts:
333( 0.32%) Threads: 55( 0.06%) Private Posts: 31
|
This user's posts are being ignored. Show Post?
|
Posted: 6284 days ago
|
Edited: 6284 days ago
|
|
I uploaded a modified version of your layout to my *previous post. This is what is currently being used at http://demo.dkpsystem.com/news.php-- Ieyasu - Organizer, Ex Cineribus
|
Dregean
Guild Operator
Posts:
16( 0.02%) Threads: 5( 0.01%) Private Posts: 0
|
This user's posts are being ignored. Show Post?
Howdy.
So if someone with zero coding experience wanted to implement this timer into the website for "Time left until Gruuls" or some-such how would i do it. When it says copy layout.htm does that mean just post it in a word doc and changed the file extension?
Thanks
Dregean You would need to head into Admin -> Advanced Layout Options and then click the link that says Generate Layout and Menu Files. Then right-click Current Layout File and choose "Save As..." That's how you get your layout.html file. Then you open it in a text editor (I use Notepad) and copy/paste the awesome script that Kriknosnah so thoughtfully provided for us. I also tweaked mine just a bit, and expect to have it running on my site within a few minutes (have to look up the color codes of my links first so it matches!). Thanks Krik! **EDIT**: I just noticed that when you're using a drop-in template like I am and you generate your layout files from the Advanced Layout Options, it gives you the layout for whatever you had before you put the template in. So Dregean, you'd have to go into Admin - Drop-In Templates, download your template, then extract the layout.html file from the .zip and edit it from there. Head to Advanced Layout Options when you're done to upload/test it after you're done editing. When inserting the countdown timer into the layout.html is there a certain place is should be pasted into? --
|
Nitesbane
Contributor
Posts:
333( 0.32%) Threads: 55( 0.06%) Private Posts: 31
|
This user's posts are being ignored. Show Post?
When inserting the countdown timer into the layout.html is there a certain place is should be pasted into? I'm sure there is, but I don't know where that would be for you. As Chops mentioned in this post, the countdown timer was left out of the template you're using. I would suggest trying to insert the <!--System:CountDown --> command first and playing with the javascript addition after. -- Ieyasu - Organizer, Ex Cineribus
|
Saudorun
V.I.P.
Posts:
1252( 1.20%) Threads: 172( 0.20%) Private Posts: 55
Guild(s):Mandalorian Ghosts
|
This user's posts are being ignored. Show Post?
When inserting the countdown timer into the layout.html is there a certain place is should be pasted into? I would put it right above this tag <!--System:PageDesc--> This will make the countdown appear right above the Content Title for each page. -- Six Demon Bag Jack Burton: Hey, what more can a guy ask for? Egg Shen: Oh, a six-demon bag! Jack Burton: Terrific, a six-demon bag. Sensational. What's in it, Egg? Egg Shen: Wind, fire, all that kind of thing!
|
Dregean
Guild Operator
Posts:
16( 0.02%) Threads: 5( 0.01%) Private Posts: 0
|
This user's posts are being ignored. Show Post?
When inserting the countdown timer into the layout.html is there a certain place is should be pasted into? I would put it right above this tag <!--System  ageDesc--> This will make the countdown appear right above the Content Title for each page. But you also have the add the code for the countdown timer somewhere also right? --
|
Saudorun
V.I.P.
Posts:
1252( 1.20%) Threads: 172( 0.20%) Private Posts: 55
Guild(s):Mandalorian Ghosts
|
This user's posts are being ignored. Show Post?
When inserting the countdown timer into the layout.html is there a certain place is should be pasted into? I would put it right above this tag <!--System:PageDesc--> This will make the countdown appear right above the Content Title for each page. But you also have the add the code for the countdown timer somewhere also right? No. The stuff in this thread is a Custom job to change some aspects of the default counter. Just placing <!--System:Countdown-> on your page will show you the counter. The custom code in this thread does 1 thing. It make the timer refresh itself. Without Java code like this you simply won't see the refresh in the timer unless you refresh the page or navigate to a new page. -- Six Demon BagJack Burton: Hey, what more can a guy ask for? Egg Shen: Oh, a six-demon bag! Jack Burton: Terrific, a six-demon bag. Sensational. What's in it, Egg? Egg Shen: Wind, fire, all that kind of thing!
|
Noblekain
Contributor
Posts:
102( 0.10%) Threads: 12( 0.01%) Private Posts: 30
|
This user's posts are being ignored. Show Post?
Speaking of a counter... check out my newest guild site. I wrote this with very little code, and I'll post the code soon for other's use. (My net connection where I am ATM is bad, and uploading a file will take a LONG time) Check it out: http://ie.dkpsystem.com
|
borkjev
General Public
Posts:
99( 0.09%) Threads: 25( 0.03%) Private Posts: 20
|
This user's posts are being ignored. Show Post?
noble i noticed some mistake while looking in ur code: <script language="javascript" src="settings/ie/files/IEScript.js" </head><script language=javascript> i guess the </head> needs to be out of the script? -- designer of http://aszune.dkpsystem.com
|
