var currentDate = new Date()
var clientTime = (currentDate.getHours() * 60) + currentDate.getMinutes()
clientTime -= 60 * 7
if(clientTime < 0){
	clientTime += 60 * 18
}

if(clientTime < 0){
	clientTime = 0
	}
else if(clientTime > 1440){
	clientTime = 1440
	}
	
var currentDayIndex = (clientTime / 1440) * 2500

var currentlyPlaying = true

$(document).ready(function(){
	$(".slider").slider({
		max: 2500,
		value: currentDayIndex,
		start: function(event, ui){
			currentlyPlaying = false
		},
		stop: function(event, ui){
			currentlyPlaying = true
		},
		slide: function(event, ui){
			currentlyPlaying = false
			currentDayIndex = $(this).slider('option', 'value')
			dayScene(currentDayIndex)
		}
	})
	dayScene(currentDayIndex)
	setInterval('moveDay()', 100)
})

function animateCloud(index, speed){
	$("#cloud"+index).css({backgroundPosition: "0px 0px"})
	$("#cloud"+index).animate({backgroundPosition: "1600px 0px"}, speed)
	setTimeout('animateCloud('+index+', ' + speed + ')', 11000)
}

function moveDay(){
	if(!currentlyPlaying) return
	currentDayIndex++
	if(currentDayIndex  > 2500) currentDayIndex -= 2500
	$(".slider").slider('option', 'value', currentDayIndex)
	dayScene(currentDayIndex)
}


function dayScene(dayIndex){
	/*
	Range of 2500
	0-1000 = day
	1000-1250 = day>night
	1250-2250 = night
	2250-2500 = night>day
	*/
	spacing = 500
	wavelength = 800
	for(var cloudIndex = 0; cloudIndex < 2; cloudIndex++) {
		customSpacing = spacing * (cloudIndex / 2 + 1)
		accelerator = ((dayIndex % customSpacing) / customSpacing) * wavelength
		$("#cloud" + cloudIndex).css({backgroundPosition: accelerator + "px 0px"})
	}


	if(dayIndex < 1000){
		var maxHeight = 300
		$("#day").css({"opacity": 1, "display": "block"})
		$("#night").css({"opacity": 0, "display": "none" })
		var top = -((dayIndex / 900) - 0.5) * ((dayIndex / 900) - 0.5) * $(window).height()
		$("#sun").css({backgroundPosition: (((dayIndex / 800) * $(window).width() + 200) - 400) + "px 0px", bottom: top + 500 + "px"})
	}
	else if(dayIndex < 1250){
		dayIndex -= 1000
		$("#day").css({"opacity": 1 - dayIndex / 250, "display": "block"})
		$("#night").css({"opacity": dayIndex / 250, "display": "block"})
	}
	else if(dayIndex < 2250){
		dayIndex -= 1250
		$("#day").css({"display": "none", "opacity": 0})
		$("#night").css({"opacity": 1, "display": "block"})
		var top = -((dayIndex / 900) - 0.5) * ((dayIndex / 900) - 0.5) * $(window).height()
		$("#moon").css({backgroundPosition: (((dayIndex / 800) * $(window).width() + 200) - 400) + "px 0px", bottom: top + 500 + "px"})
	}
	else{
		dayIndex -= 2250
		$("#day").css({"opacity": dayIndex / 250, "display": "block"})
		$("#night").css({"opacity": 1 - dayIndex / 250, "display": "block"})
	}


}