time of day style...

[spaceace]

i need to know if it's possible for a style to tell the time of day a user has. a member here(you'll know who you are if you read this) talked about creating a style that would change with the users time of day. example would be the base colour of the style is light blue in the morning and progresses to a dark blue at night. all depending on the time of day on the users end. i know it would need multiple stylesheets but i just don't know how to code the time part if it's even possible.

[Sniper_E]

May be off topic...
Your post reads: by spaceace on Mar 6, 2011, 6:36 pm
Does it show the same time to everyone in all the posts?
Does anyone see a different time on spaceace's post other than 6:36 pm? I'm curious...

[barri123]

Hello,
I am studied this topic at CSS, in the CSS it is even too much difficult coding but using the ASP.net it would be much easy I am giving you some codes you can check them hopefully it will work for you.

Option 1: Color Picker

Use this color picker to find a suitable color. To use it:

1. Use the slider on the right to change the hue.
2. Click anywhere in the large square to pick a color.
3. Once you're happy with the color, copy the hexadecimal value from the bottom field (the series of 6 digits/letters in bold (for example #FFFFFF).

[spaceace]

May be off topic...
Your post reads: by spaceace on Mar 6, 2011, 6:36 pm
Does it show the same time to everyone in all the posts?
Does anyone see a different time on spaceace's post other than 6:36 pm? I'm curious...

i have this - by spaceace on March 6th, 2011, 7:36 pm

it should show different for each members time zone and dst setting. if we all had the same tz, it would all be the same time

i guess what i'm looking for is something like <!-- IF THIS_TIME --> use this stylesheet <!-- ESLE --> use this one <!-- ENDIF -->

i know it's not going to be quite that simple, but that should at least show what i'm trying to do. and that code would go into the overall_header.html and simple_header.html to load the stylesheet. i just need to know if there's a piece of code that would pull the users time and work solely from the style without adding or changing core code.

[spaceace]

ok, i think i found the code that i need to use to pull the time data. small piece of js and it should in theory execute each stylesheet accordingly. what i need to know is if i'm correct in my js before i even begin to work on this.

Code: Select all

<script type="text/javascript">
var d = new Date()
var time = d.getHours()
if (time<10)
  {
  document.write("<link href="{T_THEME_PATH}/morning.css" rel="stylesheet" type="text/css" media="screen, projection" />");
  }
else if (time>10 && time<16)
  {
  document.write("<link href="{T_THEME_PATH}/day.css" rel="stylesheet" type="text/css" media="screen, projection" />");
  }
else
  {
  document.write("<link href="{T_THEME_PATH}/evening.css" rel="stylesheet" type="text/css" media="screen, projection" />");
  }
</script>

[spaceace]

someone looked over the code i have and told me of a small change that i needed to make and now all is working fine for when i start to develop a new style that changes as a day progresses

i've never seen anyone do this kind of style and now i just hope that i can do it before anyone else LOL

[Sniper_E]

shhhhhhh, *wispers* don't tell anyone.
It's a very nice idea Ace! I haven't thought of it before. Look forward to seeing your finished product.
Does that code of yours above work? I'd like to use it for a background change in another mod if I could.

[spaceace]

no, that code does not work. but this code does

tested it this morning.

Spoiler:

Code: Select all

<script type="text/javascript">
var d = new Date()
var time = d.getHours()
if (time<10)
  {
  document.write('<link href="{T_THEME_PATH}/morning.css" rel="stylesheet" type="text/css" media="screen, projection" />');
  }
else if (time>10 && time<16)
  {
  document.write('<link href="{T_THEME_PATH}/day.css" rel="stylesheet" type="text/css" media="screen, projection" />');
  }
else
  {
  document.write('<link href="{T_THEME_PATH}/evening.css" rel="stylesheet" type="text/css" media="screen, projection" />');
  }
</script>

i did however find that several aspects of the stylesheet have to be changed as it's still wanting to use stylesheet.css for some things. it's going to be a lot of work to get this one done

[spaceace]

got all the final pieces of the code finished and have had to add the part for people who have js disabled and the style is going to be called "Time and space". no demo or screens yet as the basics are still in dev

[Honor]

Would love this!