We are looking for a site countdown timer

[Icarus]

We are looking for someone to make a countdown timer for Halflife2.net.

Here are the requirements

1. It be in the site color scheme
2. It must be able to be put on a webpage
3. Using either the Days :Hours :Minutes :Seconds :Hundredths of a Second, or Weeks ays :Hours :Minutes :Seconds :Hundredths of a Second
Submit your entries to [email protected]

 

[Onions]

oi! leave us alone

 

[Maxi]

Oi! Pistol already made one!

 

[sage]

i was thinking about a ddraw app as a screensaver? any ideas?

im seeing a basic font/bitmap engine and some timer code
then maby load random released picture fade in and out?

 

[Onions]

i think he's after something that can be integrated with the site, probably javascript

 

[we11er]

or PHP..... shouldn't be too hard. But I cba at the moment, got other projects on!

 

[Phisionary]

Hell, mates? We've been looking for an excuse to code something... why don't we get to work on this? I'm very sorry to say that I don't know much about js, php, or coding for hte web, but.... c'mon. it's a good excuse to come together and try.

 

[hasan]

yup, I found a script on some page ..
jave script is pretty much like C++, just a n00b-frienlier version of it. like, I think all varaibles are of type 'var' or something.
php I think is similar too ..
I'm pretty sure we can figure it out in less then 2 hours =P ? well atlease you can.

 

[Phisionary]

Does anyone know what size it is supposed to be? Small enough to fit on the left margin, main page? labels on it or integrated text? I dunno, just trying to think how it would be done.

Does anyone know the hex codes of the official site colors?

we need more info, I think. :\

 

[BlueWolf72]

<script>
var timerID = null;
var timerRunning = false;

function startClock() {
stopClock();
timeRemaining();
}

function stopClock() {
if (timerRunning)
clearTimeout(timerID);
timerRunning = false;
}

function timeRemaining() {
var now = new Date();
var then = new Date(2004, 10, 15, 23, 59, 59);
var yearsLeft; var daysLeft; var hoursLeft; var minsLeft; var secsLeft;
secsLeft = Math.round(then.getTime() - (now.getTime() + 1000)) / 1000;
daysLeft = Math.floor(secsLeft / 86400);
secsLeft %= 86400;
hoursLeft = Math.floor(secsLeft / 3600);
secsLeft %= 3600;
minsLeft = Math.floor(secsLeft / 60);
secsLeft %= 60;
secsLeft = Math.round(secsLeft);

if (secsLeft == 60) {
secsLeft = 0;
minsLeft = minsLeft++;
}

if (minsLeft == 60) {
minsLeft = 0;
hoursLeft = hoursLeft++;
}

if (hoursLeft == 24) {
hoursLeft = 0;
daysLeft = dayssLeft++;
}

document.doomsday.total.value = (daysLeft + " days, " + hoursLeft + " hrs, " + minsLeft + " min, " + secsLeft + " sec");

timerID = setTimeout("timeRemaining()", 1000);
timerRunning = true;
}

window.onload=startClock;

</script>

 

[hasan]

eh? stolen from planethalflife.com? ..

EDIT:
hmm .. I think the colors are no problems, I'm sure the staff can fix that and everything else?

 

[Phisionary]

presuming the use of javascript, does anyone know what method (by that I mean a process, not an actual code method) would be used to get the time off of the hl2.net servers? how would one interact in that way?

 

[hasan]

this thing prints the remaining time once .. format can easily be changed.

<script type="text/javascript">
var now = new Date;
var release = new Date("November 16, 2004");
//var release = new Date(2004, 11, 16);
var ddiff = release.getTime() - now.getTime(); //difference in millisecond between two dates.
var days = Math.floor(ddiff / (24 * 60 * 60 * 1000));
var hours = Math.floor(ddiff / (60 * 60 * 1000) % 24);
var mins = Math.floor(ddiff / (60 * 1000) % 60);
var secs = Math.floor( ddiff / (1000) % 60 )
document.write(days + " Days, " + hours + " Hours, " + mins + " Minutes, " + secs + " Seconds" );


</script>

have a look at this:
http://www.w3schools.com/js/js_obj_date.asp

it seems you can get the GMT time, so if you know the difference between the hl2.net server's time and GMT time, that should give you a starting point.

I think a better way though is to use php tags, as php is parsed server side so it must return the time where the server is located.
http://ca.php.net/date

edit:
I think with php, use the date() function to print the date in a string format or something, there are tons of options for parameters but I can't make which one would work. but basically something like:

var now = new Date(<? echo date("j, n, Y") ?>);

replace "date("j, n, Y")" with the correct call.

 

[hasan]

edit time ran out ....

*removed*

this should give the time in hl2.net servers area.
all we need now is an estimate of what hour will steam unlock HL2 ..

edit ..
wow, I just noticed "submit entries ....", I must be really stupid.
somebody erase my code .. I can't edit anymore.

 

[BlueWolf72]

eh? stolen from planethalflife.com? ..

EDIT:
hmm .. I think the colors are no problems, I'm sure the staff can fix that and everything else?

lol its a basic script. i took it from phl but phl took it from? I just want to make sure that im no thief but phl didnt invent this script either.

 

[hasan]

yeah well, I thought hl2.net could have used the same script in the first place, instead of asking us.

 

[we11er]

javascript is a bit dodge IMO, i think a static count-down time, calculated server-side would be better. Updated when you refresh. Or maybe for now just a 'number of days' until release value?

Bah, I dunno. I'm still buzzing from 25p vodkas, so who knows what I'm spouting....

 

[therealescher]

javascript is a bit dodge IMO, i think a static count-down time, calculated server-side would be better. Updated when you refresh. Or maybe for now just a 'number of days' until release value?

Bah, I dunno. I'm still buzzing from 25p vodkas, so who knows what I'm spouting....

Why would JavaScript be a dodge? It's the most efficient way run a constantly updating counter. Though I do agree that it should be initialized with PHP to the server's time so that if shows up properly no matter what the observer's clock is set to.

 

[hasan]

I think i'm showing more stupidity than I should -_-

here is the php part of it, incase people can't be bothered to learn php just for a sitecounter:

var now = new Date(<? echo date("Y, n , j, G, i, s") ?>);

why did I think the code should be removed in the first place? so that it doesn't get stolen? well, java script can always be viuewed with view->source. duh!

 

[we11er]

Well some browsers interpret java differently, i've had probs with IE vs Mozilla and stuff. Then again if it's simple, there may be nowt to worry about.

 

[Phisionary]

var now = new Date(<? echo date("Y, n , j, G, i, s") ?>);

Sweet. now, do I understand this correctly, that this can be used directly within a jscript and would get the server-side time?

Do you think this would be the same time that would generate the HL2.net posting dates? It would be nice if they were synchronized. I was thinking that it would be good to have a time zone setting, but it's not a clock, duh. The counter should be the same regardless.

I am getting my images to show up in Opera, but in IE (6, btw) it shows extra space above and below the image

to clarify, I have a table, tr, td. in the td (with specified height and width) i have an <img> tag that i use jscript to change the src tag. but it shows space above and below ???
i set vspace="0" hspace="0" (i don't know what the last two do, but just in case).

Anyone have an idea??

Edit: oh, hasan... can you tell me what those vars output, and in what format?

 

[hasan]

what's this image thing? how do you change an image from a javascript?!

about the vars, var is just that, var, there is no type.
you can:

var x = "hello, I'm a string!";
var y = 12; // number
var z = new Date(); //date class ;) I don't know why you must use new, but tht's how it works.

//to output, use 
document.write( output );

/*
output can be anything, seperate between different stuff with a +
aka:
"hello, I am a " + var + " who are you?"
is like 
"hello, I am a " << var << " who are you?"

edit: oh, you mean the php tag?
wel, the php date link I gave oyu earlier, explains it.
"Y' outputs the year .. etc.
you just have to choose what you want to output, then choose the letter that does it form the table, put commas between, and you're set.

 

[Phisionary]

ooh. I didn't see that link. thanks.

<table  cellspacing="0" cellpadding="0"  id="row1">
	<tr>
		<td background="./images/runtest_row1_u.gif[/img][img]./images/t_pixel.gif"  hspace="0" vspace="0" name=r1d1>
		</td>
	</tr>
</table>

From the script:

var daysUno=document.images.r1d1
daysUno.src = runtest_row1_b.src;

this changes the image from t_pixel.gif to the image src of runtest_row1_b

something in the html must mess up the formatting fo IE. I dunno waht though.

 

[therealescher]

I just submitted one to Icarus, but just to give you guys a couple notes:

If you pull the date in one string from PHP, you'll have headaches. The month needs to be pulled separately because it is passed to JavaScript's date function as an array element equal to one less than the current month.

Also, if you pull the date from PHP, you need to have it initialized outside the loop and run your own counter inside the loop or the time will never update.

Finally, note that it says down to the hundredth of a second. Neither date function handles that, so you have to on your own.

If there's any specific questions, feel free to ask.

 

[Phisionary]

does one need somethig installed to access PHP (I mean on my system, for development).

I found a reference to using a PHP function <?= Number(new Date()) ?> and this would return a non-string value in milliseconds. This would work perfectly if it does.

Sorry, I've never used PHP or jscript before, so this is a (steep) learning experiance.

Using new Date() jscript fcn will return the current date in millisecs. Works great, but only for local time.

 

[therealescher]

does one need somethig installed to access PHP (I mean on my system, for development).

I found a reference to using a PHP function <?= Number(new Date()) ?> and this would return a non-string value in milliseconds. This would work perfectly if it does.

Sorry, I've never used PHP or jscript before, so this is a (steep) learning experiance.

Using new Date() jscript fcn will return the current date in millisecs. Works great, but only for local time.

Doh, looks like I lied and went about the milliseconds in a round about way. Oh well.

As for <?= Number(new Date()) ?>, "Number" is not a valid PHP function, so your reference article may have written something special. Same with "new Date()". Date is not a built-in class in PHP, and the date() function requires at least one parameter. It honestly looks more like JavaScript to me, though you wouldn't have the <?= and ?> if that were the case.

For using PHP on your local machine, you'd need a webserver and PHP installed. If you don't have access to any website with PHP, it might be more hassle than it's worth.

 

[Phisionary]

they said something about needing that so the return type was not a string (referring to the Number() fcn). I don't know, it's cut and paste.

here's the page which i'm getting this from:

int time ( void )

Returns the current time measured in the number of seconds since the Unix Epoch (January 1 1970 00:00:00 GMT).

so I try to use this line in my code:

var dateserver = <?= time() ?>;

It appears not to work.

[edit]

For using PHP on your local machine, you'd need a webserver and PHP installed. If you don't have access to any website with PHP, it might be more hassle than it's worth.

ah. that explains it.

[edit2]what is with the var keyword in Javascript. I see a lot of code that doesn't seem to use it. Will Javscript do on-the-fly implicit declaration, then, and the keyword is unneccisary? or am I just missing something?

 

[therealescher]

[edit2]what is with the var keyword in Javascript. I see a lot of code that doesn't seem to use it. Will Javscript do on-the-fly implicit declaration, then, and the keyword is unneccisary? or am I just missing something?

Yeah, JavaScript will do implicit declaration, but I personally still like to declare everything.

 

[Phisionary]

very good. thanks for the help.

P.S. to people working on this still. don't try thousandths of a second :E javascript won't run it fast enough, it updates like, once a second. looks terrible.

 

[hasan]

hmm .. why? how are you getting the thousandth's of a second?
It's just a mathematical operation .. I'm not sure if I got it right, but I think I do.

.
.
var ddiff = release.getTime() - now.getTime();
.
.
var csecs = Math.floor( ddiff / 10 % 100 )

If you pull the date in one string from PHP, you'll have headaches. The month needs to be pulled separately because it is passed to JavaScript's date function as an array element equal to one less than the current month.

that's actually better, I found by expermint that the Date.getTime() doesn't work right unless you subtract the month by one. I don't know why.

 

[therealescher]

One thing I just noticed was that because of output and loop time, my milliseconds counter takes longer than one second to roll through them all.

Not sure if this is fixable in JavaScript.

EDIT: Tenths of a second is doable, going to try optimizing the code a little more to see if it's possible to get it down. But I'm not entirely sure JavaScript can do 100 page writes per second.

 

[Phisionary]

no, it's not a problem with the code. It's update rate. the milisecond tries to change every thousandths of a second, but either the page or the screen does not refresh fast enough, and it only changes very slowly.

anyway. I changed mine to hundredths and it looks fine. My only problem now is my layout issues in IE. anyone know what's causing it? I have a <tr> filled with several <td>'s, they looked fine when I tried to use background setting, but it wouldn't update on my opera browser. Now I use <img> tags within the <td></td>, but the whole row gets enlarged to larger than the image is. I don't know, it only does it in the vertical direction (i.e. height is too large), maybe IE has a minimum table row size when it has content??

 

[Phisionary]

well, a picture is worth a thousand words and all that rot. attached is a cap.

if anyone has any ideas, let me know. off to work 4 now.

 

[Phisionary]

nevermind. I figured it out. i forgot that sometime html is whitespace (specifically newline) sensitive.

 

[we11er]

Umm remember Javascript is client-side. So it will not display the actual release date when people are not on Valve time. You need to calculate the time server-side.

 

[we11er]

unless the php provides the correct hour valve-time, inserts this into the javascript, which gets the client's hour value, and adjusts the timer accordingly

 

[Phisionary]

yeah that'd be great, but I don't know how to. meh. :\

 

[hasan]

do we know the exact hour of release? pretty much no.
I think you can get the difference between the server and GMT, then you have to know the difference between valve and GMT(constant/given), and do the math.

 

[Phisionary]

yet another bloody problem. :angry:

I tried to externalize my script.

copied the script, sans <script></script> tags. saved to a .js extension file.
added:

<script src="./jscript/timer.ver1.js" type="text/javascript"></script>​

to my html file (in the head, same place as full script was before). the path is good.

get message:

Line: 9
Error: Object Expected

Line 9 (in my html file) is:

<body onLoad="starttimer()" bgcolor="#FFFFFF">​

Again, an IE only issue. I don't get it???

 

[Phisionary]

ohhhh, for christs sake. ;(

not as if I didn't know it already. I'm an idiot.

so, I was write in the middle of changing code, and I then think: "Hey! Why don't I put the Javascript into it's own file! Yay!"

So, with half-done, un-terminated code, I paste it to it's own file, and forget all about what I was doing.

****...

pay no attention to the idiot behind the curtain. :x