time based php background script.. help!!!

[dave2007]

Hello everyone,

i know this looks long, but please read it, im certain that there is something simple that im overlooking which has to do with me learning php and css. i get the feeling it might have something to do with my php includes and have tried a variety of things to get my main php file to recognize the include.. and nothing. you can go to my site at www.davemcclane.com and see a simple version of the script working fine, but when i attempt to make it work with the following files, and have it update my body tag, im having issues.

 

Im attempting to us some php script that i found online which would allow my background to change based on the time of date. the script provided a sample which i uploaded to my site and it works fine. it seem to basicly provide a php file with all the commands, and all that you do is put the insert into your regular php file, yet im having trouble, so im going to post what i have here and if anyone can help, please let me know where im going wrong.

 

//this is the main php function file, located in a comicpage folder...

<?php

/***************************************************************************

timeBG.php

originally © Aaron Robbins

http://www.aaronrobbins.com

aaron@aaronrobbins.com

 

This script is free software; you can redistribute it and/or

modify it under the terms of the GNU Lesser General Public

License as published by the Free Software Foundation; either

version 2.1 of the License, or (at your option) any later version.

 

This library is distributed WITHOUT ANY WARRANTY; without even the implied

warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU

Lesser General Public License for more details.

 

You should have received a copy of the GNU Lesser General Public

License along with this library; if not, write to the Free Software

Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA 02111-1307 USA

****************************************************************************

 

****************************** WHAT IT DOES ****************************

Like the time changing themes on iGooogle this function dynamically inserts

css into the head of any web page to change the background and/or background

image of an html tag, class or id based on the time of the day.

 

There are currently 6 times phases supported:

midnight, dawn, morning, afternoon, dusk and evening

 

Include the timeBG.php file into the head of any php enabled doc

<?php include("timeBG.php"); ?>

-or-

copy the function and variables into your own functions.php or config.php

and include that.

 

See the included index.php for usage example

-or- see demo for a working example http://www.aaronrobbins.com/demos/timeBG

****************************************************************************/

////////////////

// Configure //

//////////////

//STEP 1.

//You need to create images named:

//midnight.jpg, dawn.jpg, morning.jpg, afternoon.jpg, dusk.jpg and evening.jpg

//or you can create less images and assign images to more then one phase.

 

//The default css definition is background:#FFFFFF url(dawn.jpg) no-repeat center;

//This assumes the background images are in the same directory as the file calling the function

//Feel free to chage the definition parameters. background:hexcolor url(path/to/image.jpg) repeat_flag alignment_flag;

 

//STEP 2.

//$hourOffset Example:

//Enter 0 if you are in the same time zone as the hosting server.

//Enter -8 if the hosting server is 8 hour ahead of your time.

//Enter 6 if the hosting server is 6 hours behind your time.

$hourOffset = 0;

 

//STEP 3.

//$cssName Example:

//$cssName = "body" (this would add the background to the "body" tag)

//$cssName = "#page" (this would add the background to an id named "page")

//$cssName = ".box" (this would add the background to a class named "box")

$cssName = "body"; //the name of the css class you wish to add the background too

 

//Define Function

function timeBG($hourOffset,$cssName){

$hourOffset = ($hourOffset * 3600);

$currentHour = date("G",time() + $hourOffset);

if($currentHour < 4){

$phase="midnight";

}

else if($currentHour < 7){

$phase="dawn";

}

else if($currentHour < 11){

$phase="morning";

}

else if($currentHour < 16){

$phase="afternoon";

}

else if($currentHour < 19){

$phase="dusk";

}

else if($currentHour < 22){

$phase="evening";

}

else{

$phase="midnight";

}

switch ($phase){

case "dawn":

echo "

<style type=\"text/css\" media=\"screen\">

$cssName {

background:#FFFFFF url(images/dawn.jpg) no-repeat center;

}

</style>

";

break;

case "morning":

echo "

<style type=\"text/css\" media=\"screen\">

$cssName {

background:#FFFFFF url(images/morning.jpg) no-repeat center;

}

</style>

";

break;

case "afternoon":

echo "

<style type=\"text/css\" media=\"screen\">

$cssName {

background:#FFFFFF url(images/afternoon.jpg) no-repeat center;

}

</style>

";

break;

case "dusk":

echo "

<style type=\"text/css\" media=\"screen\">

$cssName {

background:#FFFFFF url(images/dusk.jpg) no-repeat center;

}

</style>

";

break;

case "evening":

echo "

<style type=\"text/css\" media=\"screen\">

$cssName {

background:#FFFFFF url(images/evening.jpg) no-repeat center;

}

</style>

";

break;

case "midnight":

echo "

<style type=\"text/css\" media=\"screen\">

$cssName {

background:#FFFFFF url(images/midnight.jpg) no-repeat center;

}

</style>

";

break;

default:

echo "

<style type=\"text/css\" media=\"screen\">

$cssName {

background-color:#000099;

}

</style>

";

break;

}

}

?>

 

 

 

 

 

 

 

 

//this is my page's php file called (example.php).. as instructed by the directions, i have the <?php include("timeBG.php"); ?> inserted in the head tag.

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

 

<?php include("timeBG.php"); ?>

<title>Comic Gallery</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<link rel="stylesheet" href="kubrick.css" type="text/css" media="screen" />

<style type="text/css" media="screen">

#example { width: 720px; height: 763px; background: transparent url(images/strip.jpg); margin: 0 auto; text-align: center; outline: none;}

#cg_img { margin-bottom: 300px; padding: 0px 0px 0px 10px; display: inline; outline: none; }

#cg_nav1, #cg_nav2 { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; padding: 0px 0px 0px 10px; }

#cg_nav1 a, #cg_nav2 a { text-decoration: none; }

#cg_nav1 a:hover, #cg_nav2 a:hover { text-decoration: underline; }

#cg_credits { font-family:"Courier New", Courier, mono; font-size: 11px; color:#999; padding: 0px 0px 0px 10px; }

#cg_credits a { color:#666; text-decoration: none; }

#cg_credits a:hover { text-decoration: underline; }

.cg_arrow1, .cg_arrow2 { font-weight: bold; }

 

/* CG nav setup */

#cg_nav1 { height: 77px; width: 720px; margin: 0 auto; padding: 0px 0px 0px 0px;}

#cg_nav1 a, #cg_nav1 span { height: 77px; width: 100px; float: left; background: #fff top left no-repeat; outline: none;}

#cg_nav1 a span, #cg_nav1 span span, #cg_nav1 .cg_divider { display: none; }

 

/* CG nav images */

a#cg_first { background: url(cg_nav/first.jpg); width: 236px; background-position: top center;}

a#cg_back { background: url(cg_nav/back.jpg); width: 155px; background-position: top center}

a#cg_next { background: url(cg_nav/next.jpg); width: 148px; background-position: top center;}

a#cg_last { background: url(cg_nav/last.jpg); width: 181px; background-position: top center;}

 

/* CG nav rollover images */

a#cg_first:hover { background: url(cg_nav/first.jpg); width: 236px; background-position: bottom center;}

a#cg_back:hover { background: url(cg_nav/back.jpg); width: 155px; background-position: bottom center;}

a#cg_next:hover { background: url(cg_nav/next.jpg); width: 148px; background-position: bottom center;}

a#cg_last:hover { background: url(cg_nav/last.jpg); width: 181px; background-position: bottom center;}

 

/* CG nav unavailable images */

span#cg_first { background: url(cg_nav/first.jpg); width: 236px; background-position: center center;}

span#cg_back { background: url(cg_nav/back.jpg); width: 155px; background-position: center center;}

span#cg_next { background: url(cg_nav/next.jpg); width: 148px; background-position: center center;}

span#cg_last { background: url(cg_nav/last.jpg); width: 181px; background-position: center center;}

 

 

 

</style>

</head>

<body>

<div id="page">

 

<div id="header">

 

</div>

<hr />

<div id="example">

 

 

<?php include("comicgallery.php"); ?>

 

 

</div>

<hr />

 

<div id="content">

 

<div id="twimage">

 

<div id="twitter_div">

<ul id="twitter_update_list"></ul></div>

 

 

 

</div>

 

</div>

 

 

<div id="footer">

 

</div>

 

 

</div>

 

<script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script>

<script type="text/javascript" src="http://twitter.com/statuses/user_timeline/DaveMcClane.json?callback=twitterCallback2&count=1"></script>

 

 

</body>

</html>

 

 

this example.php file also has the regular css file which it reference, along with another php function file which allows my to manage my comicpage, its navigation, etc.. im not sure if having more than one php in this example.php file has anything to do with it. the second insert i have is being referenced in the #example id. but any way, i have my images background images located my images folder, and i believe that i have it set to provide the background to the Body tag.

 

i would appreciate any help, feedback, or input. i will be anxiously waiting with my fingers crossed

thanks in advance.

[Chicken Little]

Three possibilities. 1- I was wondering if step 2 was leading to a zero value and causing the glitch ($hourOffset = 0 so zero multiplied by 3600 equals zero). 2-Would it be possible to change the else if statement to something that would include the range of hours (such as >7 and <11 for morning phase). 3-Would you be able to have separate css files for each phase. I did the following to change a banner image as the month changed with css files (jan.css, feb.css, mar.css, etc.). You might be able to capture all the styles in each sheet and have them applied as the day/night progresses. Hope this helps.

 

<?php

// get the current month as a number

$month = date('n');

// select the theme for the month

switch($month) {

  case 1:

  $theme = 'jan';

  break;

  case 2:

  $theme = 'feb';

  break;

  case 3:

  $theme = 'mar';

    break;

  case 4:

  $theme = 'apr';

  break;

  case 5:

  $theme = 'may';

  break;

  case 6:

  $theme = 'jun';

  break;

  case 7:

  $theme = 'jul';

  break;

  case 8:

  $theme = 'aug';

  break;

  case 9:

  $theme = 'sept';

  break;

  case 10:

  $theme = 'oct';

  break;

  case 11:

  $theme = 'nov';

  break;

  case 12:

  $theme = 'dec';

  break;

  default:

    $theme = 'plain';

  }

?>

<style type="text/css">

/* then apply the theme for the current month */

@import url("styles/<?php echo $theme; ?>.css");

</style>

 

[crimpson]

I hope you've figured this out as this responce comes three years later...

include

<?php /* Adding Time BG script to change out images based on fuzzy time function */

timeBG($hourOffset,$cssName); ?>

somewhere in the <body> of your page. I put it directly under <body> and it activated the script.