...

View Full Version : Need help on Conditions



JohnStevenson
04-11-2005, 09:55 PM
New to Javascript, and I'd like to get some help with this one. I need a script to display a picture based on day of the week and time of the day. It's for a radio station site that needs to display the pic of the dj on the air at any given time. I'm sure it's a straight-forward script and I assume I would use "if" and "and" conditions, but I'm unsure how to write this out. Basically, "If it's Mon, Tue, Wed, Thur or Fri, and its between 6 and 10 a.m., display "Pic1". If it's (date string again) and between 10 a.m. and 2 p.m. display "Pic2", etc, etc. with different hours for Saturdays and Sundays. Am I on the right track?

John

brandonH
04-11-2005, 10:24 PM
well it wont be a short script, but thats because you want to define specific pictures for everyday of the week and then for each day 2 different pics depending on tim of day. I can write it for you if you like. will post it when done.

brandonH
04-11-2005, 10:46 PM
how many different djs are there each day? and waht are the shift hours?

glenngv
04-12-2005, 05:59 AM
It's better if you use server-side language or SSI for this in order to use server date as client-side date settings may be set incorrectly. Imagine if you use client-side time, there would be a chance where a different DJ is displayed because the user's date is wrong or in a different timezone.

JohnStevenson
04-12-2005, 11:30 AM
Brandon---

If you want to take a shot at it, it would be appreciated. I'm a quick learner, so this will help me enormously.

Monday through Sunday Midnight to 6 a.m. "Pic1",

Monday through Friday 6-10 a.m. "Pic 2", 10-2 p.m., "Pic3", 2-7 p.m. "Pic4", 7-Midnight "Pic5".

Saturday 6-10 a.m. "Pic6", 10-2 p.m. "Pic7", 2-7 p.m. 'Pic8", 7-Miidnight "Pic9".....

There are more, but once you get me started, I can add on as needed. Yeah, it's probably long, but as I said, it seems fairly straight forward. I would appreciated help getting started.

JohnStevenson
04-12-2005, 11:32 AM
Glenngv---

Although I've done little if anything with server side apps, you're point has occured to me. Can you get me headed in the right direction if I decided that may the best (or just because I'm ghetting adddicted to this programming thing!)

John

rlemon
04-12-2005, 02:21 PM
Althou this does not take into consideration the day of the week, it does however account for the timezone you are in. With a few small mods it can also check the day of the week.



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<script>
/* When you are building the image array take note at the
element number.. we will be using this to define the 'DJ' */
var image= new Array(4)
image[0]= 'http://www.codingforums.com/images/icons/icon8.gif';
image[1]= 'http://www.codingforums.com/images/icons/icon9.gif';
image[2]= 'http://www.codingforums.com/images/icons/icon6.gif';
image[3]= 'http://www.codingforums.com/images/icons/icon7.gif';
/* load images by hour note:: hour 7 = 8am /
/ because we only return the hour it will remain on the image untill 7:59am
NOTE:: i have not tested these times... you may have to alter these if statements.
*/
setTimeout("GetTime()", 1000); // Start Script
function ChangeImage(hr){
if(hr >= 0 && hr <= 7){ // midnight to 8am
document.getElementById('djPic').src = image[0];
} else if( hr >= 8 && hr <= 15 ){// 8am to 4pm
document.getElementById('djPic').src = image[1];
} else if( hr >= 16 && hr <= 20 ){// 4pm to 9pm
document.getElementById('djPic').src = image[2];
} else if( hr >= 21 && hr <= 24 ){// 9pm to midnight
document.getElementById('djPic').src = image[3];
}
}
/* the section (gmt + (24-5) should be altered to fit your timezone. i.e *-5* = est */
function GetTime() {
var dt = new Date();
var def = dt.getTimezoneOffset()/60;
var gmt = (dt.getHours() + def);
var hr = check24(((gmt + (24-5)) > 24) ? ((gmt + (24-5)) - 24) : (gmt + (24-5)));
ChangeImage(hr);
setTimeout("GetTime()", 1000);
}

function check24(hour) {
return (hour >= 24) ? hour - 24 : hour;
}
</script>
</head>
<body>
<img src="http://www.codingforums.com/images/icons/icon4.gif" id="djPic">
</body>
</html>




EDIT::
OK, i've found the first problem with this script.
It does not account for daylight savings.

I.E Right now (because GMT does not follow dls) the difference between gmt and est is -4 not -5..

glenngv
04-13-2005, 03:54 AM
Glenngv---

Although I've done little if anything with server side apps, you're point has occured to me. Can you get me headed in the right direction if I decided that may the best (or just because I'm ghetting adddicted to this programming thing!)

John
What server-side language your host supports?

JohnStevenson
04-13-2005, 11:51 AM
Gelnngv--

CGI, Perl, PHP, possibly more.

John

rlemon
04-13-2005, 03:44 PM
John,
So let me get this straight,

you want an app that will cycle through images dependant on the current time in your timezone.

Also, the time in which these images will change (and the image itself) will be dependant on the day of the week?

any other factors in this that may come into play?

EDIT:::
I read your above post. Give me a few minutes and i'l post the script.

JohnStevenson
04-13-2005, 05:54 PM
rlemon--

I look forward to seeing it! Many Thanks!

John

rlemon
04-13-2005, 06:35 PM
did you try my other script (the one posted above?)

rlemon
04-13-2005, 07:22 PM
ahh well, here it is folks. works fine for me.

Takes into account the timezone offset, and displays different images per day.
Fully commented (altho i do not know how well), and I can awnser any questions you may have about it.

NOTE> THIS DOES NOT ACCOUNT FOR DLS(Daylight Savings) and you will have to manually adjust your timezone settings to compensate for this.



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<script>
/* When you are building the image array take note at the
element number.. we will be using this to define the 'DJ' image
*/
var image= new Array(9) //YOU WILL NEED TO ALTER THIS FOR YOUR SPECIFIC IMAGES
image[0]= 'http://www.codingforums.com/images/icons/icon9.gif';
image[1]= 'http://www.codingforums.com/images/icons/icon8.gif';
image[2]= 'http://www.codingforums.com/images/icons/icon7.gif';
image[3]= 'http://www.codingforums.com/images/icons/icon6.gif';
image[4]= 'http://www.codingforums.com/images/icons/icon5.gif';
image[5]= 'http://www.codingforums.com/images/icons/icon4.gif';
image[6]= 'http://www.codingforums.com/images/icons/icon3.gif';
image[7]= 'http://www.codingforums.com/images/icons/icon2.gif';
image[8]= 'http://www.codingforums.com/images/icons/icon1.gif';

setTimeout("GetTime()", 1000); // Start Script

/* load images by hour note::
//////////////////////////////////
0 = 1:00:00 (1am to 1:59am)
1 = 2:00:00 (2am to 2:59am)
2 = 3:00:00 (3am to 3:59am)
3 = 4:00:00 (4am to 4:59am)
4 = 5:00:00 (5am to 5:59am)
5 = 6:00:00 (6am to 6:59am)
6 = 7:00:00 (7am to 7:59am)
7 = 8:00:00 (8am to 8:59am)
8 = 9:00:00 (9am to 9:59am)
9 = 10:00:00 (10am to 10:59am)
10 = 11:00:00 (11am to 11:59am)
11 = 12:00:00 (12noon to 12:59pm)
12 = 13:00:00 (1pm to 1:59pm)
13 = 14:00:00 (2pm to 2:59pm)
14 = 15:00:00 (3pm to 3:59pm)
15 = 16:00:00 (4pm to 4:59pm)
16 = 17:00:00 (5pm to 5:59pm)
17 = 18:00:00 (6pm to 6:59pm)
18 = 19:00:00 (7pm to 7:59pm)
19 = 20:00:00 (8pm to 8:59pm)
20 = 21:00:00 (9pm to 9:59pm)
21 = 22:00:00 (10pm to 10:59pm)
22 = 23:00:00 (11pm to 11:59pm)
23 = 24:00:00 (12am to 12:59am)
///////////////////////////////////
*/
function getImage(hr, day){ // set if statements. YOU WILL NEED TO ALTER THIS FOR YOUR SPECIFIC IMAGES
if(day == 0){ // sunday
if((hr >= 23 ) && (hr <= 4)){ // midnight to 6am
document.getElementById('djPic').src = image[0];
} else if((hr >= 5) && (hr <=8)){ // 6am to 10am
document.getElementById('djPic').src = image[1];
} else if((hr >= 9) && (hr <= 12)){ // 10am to 2pm
document.getElementById('djPic').src = image[2];
} else if((hr >= 13) && (hr <=17)){ // 2pm to 7pm
document.getElementById('djPic').src = image[6];
} else if((hr >= 18) && (hr <= 22)){ // 7pm to midnight
document.getElementById('djPic').src = image[8];
}
} else if(day == 1){ // monday
if((hr >= 23 ) && (hr <= 4)){ // midnight to 6am
document.getElementById('djPic').src = image[0];
} else if((hr >= 5) && (hr <=8)){ // 6am to 10am
document.getElementById('djPic').src = image[1];
} else if((hr >= 9) && (hr <= 12)){ // 10am to 2pm
document.getElementById('djPic').src = image[2];
} else if((hr >= 13) && (hr <=17)){ // 2pm to 7pm
document.getElementById('djPic').src = image[6];
} else if((hr >= 18) && (hr <= 22)){ // 7pm to midnight
document.getElementById('djPic').src = image[8];
}
} else if(day == 2){ // tuesday
if((hr >= 23 ) && (hr <= 4)){ // midnight to 6am
document.getElementById('djPic').src = image[0];
} else if((hr >= 5) && (hr <=8)){ // 6am to 10am
document.getElementById('djPic').src = image[1];
} else if((hr >= 9) && (hr <= 12)){ // 10am to 2pm
document.getElementById('djPic').src = image[2];
} else if((hr >= 13) && (hr <=17)){ // 2pm to 7pm
document.getElementById('djPic').src = image[6];
} else if((hr >= 18) && (hr <= 22)){ // 7pm to midnight
document.getElementById('djPic').src = image[8];
}
} else if(day == 3){ // wednesday
if((hr >= 23 ) && (hr <= 4)){ // midnight to 6am
document.getElementById('djPic').src = image[0];
} else if((hr >= 5) && (hr <=8)){ // 6am to 10am
document.getElementById('djPic').src = image[1];
} else if((hr >= 9) && (hr <= 12)){ // 10am to 2pm
document.getElementById('djPic').src = image[2];
} else if((hr >= 13) && (hr <=17)){ // 2pm to 7pm
document.getElementById('djPic').src = image[6];
} else if((hr >= 18) && (hr <= 22)){ // 7pm to midnight
document.getElementById('djPic').src = image[8];
}
} else if(day == 4){ // thursday
if((hr >= 23 ) && (hr <= 4)){ // midnight to 6am
document.getElementById('djPic').src = image[0];
} else if((hr >= 5) && (hr <=8)){ // 6am to 10am
document.getElementById('djPic').src = image[1];
} else if((hr >= 9) && (hr <= 12)){ // 10am to 2pm
document.getElementById('djPic').src = image[2];
} else if((hr >= 13) && (hr <=17)){ // 2pm to 7pm
document.getElementById('djPic').src = image[6];
} else if((hr >= 18) && (hr <= 22)){ // 7pm to midnight
document.getElementById('djPic').src = image[8];
}
} else if(day == 5){ // friday
if((hr >= 23 ) && (hr <= 4)){ // midnight to 6am
document.getElementById('djPic').src = image[0];
} else if((hr >= 5) && (hr <=8)){ // 6am to 10am
document.getElementById('djPic').src = image[1];
} else if((hr >= 9) && (hr <= 12)){ // 10am to 2pm
document.getElementById('djPic').src = image[2];
} else if((hr >= 13) && (hr <=17)){ // 2pm to 7pm
document.getElementById('djPic').src = image[6];
} else if((hr >= 18) && (hr <= 22)){ // 7pm to midnight
document.getElementById('djPic').src = image[8];
}
} else if(day == 6){ // saturday
if((hr >= 23 ) && (hr <= 4)){ // midnight to 6am
document.getElementById('djPic').src = image[0];
} else if((hr >= 5) && (hr <=8)){ // 6am to 10am
document.getElementById('djPic').src = image[1];
} else if((hr >= 9) && (hr <= 12)){ // 10am to 2pm
document.getElementById('djPic').src = image[2];
} else if((hr >= 13) && (hr <=17)){ // 2pm to 7pm
document.getElementById('djPic').src = image[6];
} else if((hr >= 18) && (hr <= 22)){ // 7pm to midnight
document.getElementById('djPic').src = image[8];
}
}
}

function GetTime() {
var dt = new Date();
var day = dt.getDay();// 0 = sunday, 1 = monday....... 6 = saturday
var def = dt.getTimezoneOffset()/60;
var gmt = (dt.getHours() + def);
var hr = check24(((gmt + (24-5)) > 24) ? ((gmt + (24-5)) - 24) : (gmt + (24-5))); //(gmt +(24-5)) defines the timezone. (gmt +(24-5)) is EST, (gmt +(24-4)) is EDT
getImage(hr, day);
setTimeout("GetTime()", 1000);
}

function check24(hour) {
return (hour >= 24) ? hour - 24 : hour;
}
</script>
</head>
<body>
<img src="http://www.codingforums.com/images/icons/icon4.gif" id="djPic">
</body>
</html>

telefonia
06-27-2005, 10:07 PM
Hi there, ilive in Portugal, i have a problem: Where i put my timezone? And if its possible cant tell my timezone, please!!

function GetTime() {
var dt = new Date();
var day = dt.getDay();// 0 = sunday, 1 = monday....... 6 = saturday
var def = dt.getTimezoneOffset()/60;
var gmt = (dt.getHours() + def);
var hr = check24(((gmt + (0-1)) > 24) ? ((gmt + (24-5)) - 24) : (gmt + (24-5))); //(gmt +(24-1)) defines the timezone. (gmt +(24-5)) is EST, (gmt +(24-4)) is EDT
getImage(hr, day);
setTimeout("GetTime()", 1000);
}

function check24(hour) {
return (hour >= 24) ? hour - 24 : hour;

rlemon
06-27-2005, 10:47 PM
Hi there, ilive in Portugal, i have a problem: Where i put my timezone? And if its possible cant tell my timezone, please!!

function GetTime() {
var dt = new Date();
var day = dt.getDay();// 0 = sunday, 1 = monday....... 6 = saturday
var def = dt.getTimezoneOffset()/60;
var gmt = (dt.getHours() + def);
var hr = check24(((gmt + (0-1)) > 24) ? ((gmt + (24-5)) - 24) : (gmt + (24-5))); //(gmt +(24-1)) defines the timezone. (gmt +(24-5)) is EST, (gmt +(24-4)) is EDT
getImage(hr, day);
setTimeout("GetTime()", 1000);
}

function check24(hour) {
return (hour >= 24) ? hour - 24 : hour;

edit the text i blod'd with your timezone. i don't know portugals. +- ??

telefonia
06-27-2005, 10:55 PM
no, if you cant hgelp me with this i apreciate

rlemon
06-27-2005, 11:06 PM
ok, tell me what script you need.. tell you what i'm kinda busy for the next 2 days so email me your specifications (rob.lemon@gmail.com) and i'l write it up and post it here.

telefonia
06-27-2005, 11:12 PM
its this script, but i dont know my timezone.

rlemon
06-28-2005, 02:09 PM
Please email me the code you are useing. or, 'my code with your mods'

telefonia
07-07-2005, 03:10 PM
my problem is resolved.
But tell me if i want to make a link on the images, where i put the code?

rlemon
07-07-2005, 06:55 PM
ok, i'm going to explain how to do this (i'm @ work on my lunch so i dont' have time to write it for you) but here goes:

add another level to the url array and add the coresponding 'links' for each image.

surround the main <img> tag with anchor tags and give the anchor tag an id value only.

in the JS, when you set the <img> src value also set the <a> href value with the coresponding 'link' value.

shouldn't be that hard to implement.

good luck!

telefonia
07-12-2005, 02:14 AM
i try, but still dont work. when you have time put here the code.

Thanks again

telefonia
08-24-2005, 12:42 PM
anyone to help me with this?



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum