View Single Post
Old 02-16-2013, 09:16 PM   PM User | #1
MrTIMarshall
Regular Coder

 
Join Date: Nov 2010
Posts: 347
Thanks: 44
Thanked 1 Time in 1 Post
MrTIMarshall is an unknown quantity at this point
Question Changing a div colour via fetching the Sunrise and Sunset times and calculating the..

// Fetch Data form an external website, for this data I used timeanddate.com.
Feb 16, 2013;
SunRise: 7:12 AM
SunSet: 5:18 PM

//Changing their values into seconds
var SunRise = calc ((7*3600)+(60*12))))
var SunSet = calc (43200+((5*3600)+(18*60)))

// How long the day time is
Var DayTIme = calc SunSet - SunRise

// Calculating how long a particular sky colour lasts for (day).
var DayColourSwitch = DayTime/10

// Working out when the sky colours change.
var DayColourTime01 = SunRise
var DayColourTime02 = SunRise + DayColourSwitch
var DayColourTime03 = SunRise + (DayColourSwitch *2)
var DayColourTime04 = SunRise + (DayColourSwitch *3)
var DayColourTime05 = SunRise + (DayColourSwitch *4)
var DayColourTime06 = SunRise + (DayColourSwitch *5)
var DayColourTime07 = SunRise + (DayColourSwitch *6)
var DayColourTime08 = SunRise + (DayColourSwitch *7)
var DayColourTime09 = SunRise + (DayColourSwitch *8)
var DayColourTime10 = SunRise + (DayColourSwitch *9)

So above is the calculations for how long the say tie is which will be based upon the actual sun rise and sun set. To start with, the colour of the sky will change throughout the day, first starting to become bright at DayColourTime01 and then you will see the final daytime bright colour at DayColourTime10.

Eventually there will also be a sun in the sky which you first see at DayColourTime01 and unnoticeable to the user will go across the sky and disappear once it reaches SunSet.

The whole reason I have calculated the colour switches, is due to, in the past having difficulties gaining help on this to load the correct colour upon loading the website, therefore using the my above calculations, you can then check the GMT time upon loading the website and load the correct time and then whilst they are on the website, it will listen to the time to know when to switch the colour.

On to the nighttime colours:

// Fetch tomorrows SunRise time which is 7:10 AM

// Next days sunrise in seconds from 00:00
var NextSunRise = calc ((7*3600)+(60*10))))

// Calculating the Night Time period
var NightTime = (86400-(SunSet))+NextSunRise

// Calculating how long a particular sky colour lasts for (night).
var NightColourSwitch = NightTime/10

This is where I yet again become stuck with teh theory on how to do this. Although I don't know how to do this programming wise, I understand the theory, whether it is a good on or not. I know how to calculate the times for the listening for when to swich the colour, however I do not know how to do it when it goes past 00:00, whether you can put an iff statement into a calculation.

I do hope what I am trying to explain what I am trying to do, does not look like a big mess and I will be watching my thread to explain any answers.

To summarize:

I want a div on my website for the sky to dynamically change throughout the day but not by a fixed time. I would like to actually fetch the sun rise and sun set times and calculate the tweens between the colour changes, eventually add a moon and sun motion into the div with only show between these periods and progress from there.

Thank you very much for any help and/or advice in helping me achieve what I am trying to accomplish.

Best Regards,
Tim
MrTIMarshall is offline   Reply With Quote