Displaying different pictures based on the time of year.

[BrightStarPro]

Hi everyone,

I'm trying to get a different "Pic of the Day" to display automatically on my index page for each day of the year. I've been successful in doing this by having my script read the clock from client's computer, but if the client were to change their computer's clock, they'd be able to see the "Pic of the Day" from other points in the year (which I don't want).

I'm need to get it to display automatically by reading the day off my *server's clock*

The only success I've had is *displaying* my server's time, but that's it.

Anyone think they can help me out? I'd greatly appreciate it.

Charles

[Twey]

I've no idea how you managed to display your server's time using Javascript.
You need a server-side script.

[BrightStarPro]

I've no idea how you managed to display your server's time using Javascript.
You need a server-side script.

I guess it's really a mixture of JavaScript with your choice of using ASP, PHP, or SSI to obtain the time from your server. It's Dynamic HTML at that point.

I've serached pretty thoroughly and I've been unable to find any kind of script that'll "document.write" a line of text or image file based on "true/false" values from the server's clock.

[Twey]

If we can use server-side languages, it's a whole new ballgame. In fact, you don't even need any client-side ones.

<?php
  $day = date("z") + 0;
  $images = array(
    "images/dayone.png",
    "images/daytwo.png",
    "images/daythree.png"
    // Insert more here, up to 366
  );
  if(isset($images[$day])) echo('<img src="' . $images[$day] . '" />');
  else echo('Image not set for this day.');
?>

[BrightStarPro]

Twey,

I've tested the code out, and it works as far as I can tell. However, I'm not seeing anywhere in the script where it'll know to change from "dayone.png" to "daytwo.png" when the date changes. I'm presuming that if I put in today's date (January 22, 2006) where "z" is then the dayone.png would display (which it has). So, when the date changes to January 23 will daytwo.png display, and so on?

To test this, I inserted YESTERDAY'S date (January 21) where "z" is under the presumption that dayone.png would be associated with that date. I once again presumed that daytwo.png would be associated with January 22 (TODAY'S date), but unfournately dayone.png still showed up.

Have I missed something in the code?

If we can use server-side languages, it's a whole new ballgame. In fact, you don't even need any client-side ones.

<?php
  $day = date("z") + 0;
  $images = array(
    "images/dayone.png",
    "images/daytwo.png",
    "images/daythree.png"
    // Insert more here, up to 366
  );
  if(isset($images[$day])) echo('<img src="' . $images[$day] . '" />');
  else echo('Image not set for this day.');
?>

[Twey]

To test this, I inserted YESTERDAY'S date (January 21) where "z" is

This isn't right. date("z") returns the current day of the year (from 0 to 365, where 0 is the 1st of January and 365 is the 31st of December on a leap year). There's no need to edit this. To test the script with other dates, change the date on the server, or change the "+ 0" (but don't remove it; performing a mathematical operation on the returned string makes sure it's treated as a number).
Actually, you should get "Image not set for this day," unless you defined a further nineteen images (so that there is a twenty-second image available).

However, I'm not seeing anywhere in the script where it'll know to change from "dayone.png" to "daytwo.png" when the date changes.

See

  $day = date("z") + 0; // here

and

  if(isset($images[$day])) echo('<img src="' . $images[$day] . '" />'); // here.

The script gets the current day of the year, then chooses an image based on it. If the user has the page open when the day changes, then no, they won't see the new image unless they refresh the page. Otherwise, it serves perfectly.

[BrightStarPro]

Ok, now I get it (and it works brilliantly, too)!

Let me pose the same problem with a different angle to you. What if I wanted a Flash movie (.SWF file) to load a certain frame # dependent on the date. Obviously, this would have to be code inside the flash movie that would accomplish this, and not the HTML page.

Any ideas?

Thanks so much for your help, again.

This isn't right. [url=php.net/date]date[/date]("z") returns the current day of the year (from 0 to 365, where 0 is the 1st of January and 365 is the 31st of December on a leap year). There's no need to edit this. To test the script with other dates, change the date on the server, or change the "+ 0" (but don't remove it; performing a mathematical operation on the returned string makes sure it's treated as a number).
Actually, you should get "Image not set for this day," unless you defined a further nineteen images (so that there is a twenty-second image available).See

  $day = date("z") + 0; // here

and

  if(isset($images[$day])) echo('<img src="' . $images[$day] . '" />'); // here.

The script gets the current day of the year, then chooses an image based on it. If the user has the page open when the day changes, then no, they won't see the new image unless they refresh the page. Otherwise, it serves perfectly.

[Twey]

I actually typed [/date]. Oh dear.
Yes, as you said, it would have to be inside the Flash movie. I don't know anything about Flash, so can't help you here. However, it would be difficult to base the Flash one on the server's time. I think you would end up having to use the client's local time (unless there's something like AJAX for ActionScript). Alternatively, of course, you could pass the server's date as a parameter. This is not infallible, and the user could, with a little knowledge, view another slide.

P.S. the practice of posting quotes after the portion of the reply they refer to (especially when quoting the entire message) is known as "top-posting" and is generally seen as bad practice.

[BrightStarPro]

The script you gave me works great. Thanks again!

One question I have about the leap day situation.

Let's say I upload 366 files. During a normal year, will the 366th file just not display, or will it go into the 1st of Jan of the following year? If it's the former, will it be the 366th file that won't display or the 60th file (the file that would fall on the leap day)? If I had images that I wanted to display on specific dates, each one would become a day off in the leap year situation I imagine.

[Twey]

No, during a normal year the 366th file will not display, as the 366th day will never be reached.
It is true that there would be an alignment problem on a leap year. Solve it by doing:

if(date("L") == 1) unset($images[59]); 

after the array definition. This will check for a leapyear and, if found, remove the 60th element, which is the picture for February 29th, and shift later elements into their proper places.