//Load when the page is ready - Using jQuery to run events
$(document).ready(function(){

$("#main").fadeIn(500);
$("#gallery img").fadeTo(1,0.7)
    .hover( 
        function(){// マウスオーバー時
            $(this).fadeTo(200, 1.0);
        },
        function(){// マウスアウト時
            $(this).fadeTo(500, 0.7);
        }
    );
scrollbackground();
});

// ***
// Scrolling background
// ***

function scrollbackground() {
// height of background image in pixels
var backgroundheight = 4000;

// get the current minute/hour of the day
var now = new Date();
var hour = now.getHours();
var minute = now.getMinutes();

// work out how far through the day we are as a percentage - e.g. 6pm = 75%
var hourpercent = hour / 24 * 100;
var minutepercent = minute / 60 / 24 * 100;
var percentofday = hourpercent + minutepercent;

// calculate which pixel row to start graphic from based on how far through the day we are
var startoffset = backgroundheight / 100 * percentofday;

// graphic starts at approx 6am, so adjust offset by 1/4
// scratch that, IE doesnt like negaive starts.. TODO: find a better way.
// var startoffset = 0;

// end 1x background height after the start offset so we get a smooth loop
var endoffset = startoffset + backgroundheight;

	// set the background start position
	// animate through to the end
	$('body').animate({
		backgroundPosition:'(50% -' + endoffset + 'px)'},
		100000,
		"linear",
		function () {
			// callback to self to loop animation
			scrollbackground();
		}
	);
}

/**
 * @author Alexander Farkas
 * v. 1.1
 */

(function($){
	
	if(!document.defaultView || !document.defaultView.getComputedStyle){
		var oldCurCSS = jQuery.curCSS;
		jQuery.curCSS = function(elem, name, force){
			if(name !== 'backgroundPosition' || !elem.currentStyle || elem.currentStyle[ name ]){
				return oldCurCSS.apply(this, arguments);
			}
			var style = elem.style;
			if ( !force && style && style[ name ] ){
				return style[ name ];
			}
			return oldCurCSS(elem, 'backgroundPositionX', force) +' '+ oldCurCSS(elem, 'backgroundPositionY', force);
		};
	}
})(jQuery);

(function($) {
	
	function toArray(strg){
		strg = strg.replace(/left|top/g,'0px');
		strg = strg.replace(/right|bottom/g,'100%');
		strg = strg.replace(/([0-9\.]+)(\s|\)|$)/g,"$1px$2");
		var res = strg.match(/(-?[0-9\.]+)(px|\%|em|pt)\s(-?[0-9\.]+)(px|\%|em|pt)/);
		return [parseFloat(res[1],10),res[2],parseFloat(res[3],10),res[4]];
	}
	
	$.fx.step. backgroundPosition = function(fx) {
		if (!fx.bgPosReady) {
			
			var start = $.curCSS(fx.elem,'backgroundPosition');
			if(!start){//FF2 no inline-style fallback
				start = '0px 0px';
			}
			
			start = toArray(start);
			fx.start = [start[0],start[2]];
			
			var end = toArray(fx.options.curAnim.backgroundPosition);
			fx.end = [end[0],end[2]];
			
			fx.unit = [end[1],end[3]];
			fx.bgPosReady = true;
		}
		
		var nowPosX = [];
		nowPosX[0] = ((fx.end[0] - fx.start[0]) * fx.pos) + fx.start[0] + fx.unit[0];
		nowPosX[1] = ((fx.end[1] - fx.start[1]) * fx.pos) + fx.start[1] + fx.unit[1];           
		fx.elem.style.backgroundPosition = nowPosX[0]+' '+nowPosX[1];

	};
})(jQuery);
