//
// ============================
//  file name : howtokiss.js
//  jQuery required.
// ============================
//


// ====================================================================================
// sendForm

function sendForm(){
	var url = 'http://www.rohto.co.jp/howtokiss/system/save_kiss_name.php';
	var str = $("#postkiss").serialize();
	var httpObj = $.post(url,str,function(data,status) {
		$('div.register form').fadeOut(200);
		$('p.txtCompletion').fadeIn(400);
	});			
	return false;
}


// ====================================================================================
// popupWindow ver.1.2

function popupWindow(url, width, height, option, windowName){	
	if (!width) width = window.innerWidth || document.documentElement.clientWidth;
	if (!height) height = window.innerHeight || document.documentElement.clientHeight;
	if (!option) option = 'menubar=yes, toolbar=yes, location=yes, status=yes, scrollbars=yes, resizable=yes';
	if (!windowName) windowName = "popup";
	var x = (screen.availWidth - width)/2;
	var y = (screen.availHeight - height)/4;
	var o = option+', width='+width+', height='+height+', left='+x+', top='+y;
	var blockMessage = "ウィンドウがお使いのブラウザでポップアップブロックされました。\nポップアップブロックを解除してください。";
	var win = window.open(url, windowName, o);
	if (win){
		win.focus();
	} else {
		alert(blockMessage);
	}
}


// ====================================================================================
// 画像のhover設定

function initRollovers(){
	if (!document.getElementById){ return; };
	
	var aPreLoad = new Array();
	var sTempSrc;
	
	var aImages = new Array();
	var imgs = document.getElementsByTagName('img');
	var inputs = document.getElementsByTagName('input');
	for (var i=0; i<imgs.length; i++){
		aImages.push(imgs[i]);
	}
	for (var i=0; i<inputs.length; i++){
		aImages.push(inputs[i]);
	}

	for (var i = 0; i < aImages.length; i++){		
		if (aImages[i].className == 'hover'){
			var src = aImages[i].getAttribute('src');
			var ftype = src.substring(src.lastIndexOf('.'), src.length);
			var hsrc = src.replace(ftype, '_on'+ftype);

			aImages[i].setAttribute('hsrc', hsrc);
			
			aPreLoad[i] = new Image();
			aPreLoad[i].src = hsrc;
			
			if (aImages[i].parentNode.nodeName == "A" || aImages[i].type == "image"){
				aImages[i].onmouseover = function(){
					sTempSrc = this.getAttribute('src');
					this.setAttribute('src', this.getAttribute('hsrc'));
				};	
				
				aImages[i].onmouseout = function()	{
					if (!sTempSrc) sTempSrc = this.getAttribute('src').replace('_on'+ftype, ftype);
					this.setAttribute('src', sTempSrc);
				};
			}
		}
	}
}


// ====================================================================================
// マウス横スクロール

function horizontalScroll(event){
	if (!event){ var event = window.event; }
	
	var delta;
	
	if (event.wheelDelta){
		/* for IE,Opera,Safari,Chrome */
		delta = -event.wheelDelta/24;
	} else if (event.detail){
		/* for Mozilla */
		delta = event.detail;
	}

	if (delta <= 0){  
		window.scrollBy(80,0);
	} else {
		window.scrollBy(-80,0); 
	}
}


// ====================================================================================
// 初期ページスクロール

function startPageScroll(){	
	var easing = 0.06;
	var interval = 30;
	
	var targetElement = document.getElementById("first");
					
	// ターゲット要素のx座標を取得
	var targetX = 0;
	while(targetElement){
	   targetX += targetElement.offsetLeft;
	   targetElement = targetElement.offsetParent;
	}
	
	// windowWidth 取得
	if(window.innerWidth){
		var box = document.createElement('div');
		with(box.style){
			position = 'absolute';
			top = '0';
			left = '0';
			width = '100%';
			height = '100%';
			margin = '0';
			padding = '0';
			border = 'none';
			visibility = 'hidden';
		}
		document.body.appendChild(box);
		var windowWidth = box.offsetWidth;
		document.body.removeChild(box);
	}else{
		var windowWidth = document.documentElement.clientWidth || document.body.clientWidth;
	}
	
	var bodyWidth = Math.max(document.body.scrollWidth, document.documentElement.scrollWidth);
	var deltaWidth = bodyWidth - targetX + windowWidth;
	var adjustX = deltaWidth - (bodyWidth - targetX);									
	var scrollLeft = document.body.parentNode.scrollLeft || window.pageXOffset || document.body.scrollLeft;
	var toX = Math.max(targetX - scrollLeft - windowWidth, targetX - scrollLeft - windowWidth + (windowWidth - targetX));
	
	var moveX,myTimer;
	function windowScroll(){
		moveX = Math.floor(toX*easing);	
		
		window.scrollBy(moveX,0);
		toX -= moveX;
		myTimer = setTimeout(windowScroll,interval);
		if(moveX == 0){ clearTimeout(myTimer); };
	}								
	windowScroll();	
	return false;
}


// ====================================================================================
// 表示位置の制御

function setElementsPosition(){
	
	// 初期設定
	$('html').css({
		'background-image':'url(null)',
		'background-attachment':'fixed'
	});
	
	var angelRightPosition,angelLeftPosition;
	var angelWidth = "65";
	
	// documentの幅を取得
	var documentWidth = Math.max(document.body.scrollWidth, document.documentElement.scrollWidth);
	// ウィンドウの高さを取得
	var windowHeight = window.innerHeight || document.documentElement.clientHeight;
	// コンテンツのtopポジション
	var contentsTopPosition = (Math.floor((windowHeight-$("div#content").height())/2))-20;
	
	// ウィンドウの横幅を取得
	if (window.innerWidth){
		var box = document.createElement('div');
		with(box.style){
			position = 'absolute';
			top = '0';
			left = '0';
			width = '100%';
			height = '100%';
			margin = '0';
			padding = '0';
			border = 'none';
			visibility = 'hidden';
		}
		document.body.appendChild(box);
		var windowWidth = box.offsetWidth;
		document.body.removeChild(box);
	} else {
		var windowWidth = document.documentElement.clientWidth || document.body.clientWidth;
	}
	
	// 現在の表示位置のx座標を取得
	var scrollLeft = document.body.parentNode.scrollLeft || window.pageXOffset || document.body.scrollLeft;
	
	// 天使の移動量を計算
	var angelMoveX = (Math.floor(((scrollLeft/(documentWidth-windowWidth))*((windowWidth-angelWidth)/2))+(windowWidth/2)))-13;
	
	// ウィンドウリサイズ対応
	var content = $('div#content').css("top", contentsTopPosition + 'px');
	var line = $('div#line').css("top", contentsTopPosition + 48 + 'px');
	var heart = $('div#heart').css("top", contentsTopPosition + 42 + 'px');
	var foot = $('div#foot').css({
		width: windowWidth + 'px',
		top: contentsTopPosition + 550 + 'px'
	});
	
	var wrap = $('div#wrap').css({
		width: windowWidth + 'px',
		top: contentsTopPosition + 'px',
		left: scrollLeft + 'px'
	});
		
	var angelRight =$('div#angelRight').css({
		top: contentsTopPosition + 13 + 'px',
		left: angelMoveX + 'px'
	});
		
	var angelLeft =$('div#angelLeft').css({
		top: contentsTopPosition + 13 + 'px',
		right: angelMoveX + 'px'
	});
	
	if ($.browser.msie && ($.browser.version < 7.0 || !$.boxModel)) {
		//for IE6
		wrap.css('position','absolute');
		wrap[0].style.setExpression(
			'left',
			'eval(document.body.scrollLeft||document.documentElement.scrollLeft)'
		);
		
		angelRight.css({
			position: 'absolute',
			top: 13 + 'px'
		});
		
		angelLeft.css({
			position: 'absolute',
			top: 13 + 'px'
		});
			
		foot.css({
			position: 'absolute',
			top: contentsTopPosition + 550 + 'px'
		});

		foot[0].style.setExpression(
			'left',
			'eval(document.body.scrollLeft||document.documentElement.scrollLeft)'
		);	
	}
}


// ====================================================================================
// smartScroll ver.2.2

function smartScroll(){	
	
	//初期設定
	var easing = 0.18;
	var interval = 30;
	var allLinks = document.links;
	
	for(var i=0;i<allLinks.length;i++){
		var lnk = allLinks[i];
		
		if((lnk.href && lnk.href.indexOf('#') != -1) && ((lnk.pathname == location.pathname) || ('/'+lnk.pathname == location.pathname))){
			var myHash = lnk.hash.replace(/#/g,"");
			if(!(myHash.length == 0)){
				lnk.onclick = function(){
					// ターゲットのid名を取得
					var hash = this.hash;
					var targetId = hash.replace(/#/g,"");
				
					if (!document.getElementById(targetId)){return;};
					
					var element = document.getElementById(targetId);
					
					// ターゲット要素のx座標を取得
					var targetX = 0;
					while(element){
					   targetX += element.offsetLeft;
					   element = element.offsetParent;
					}
					
					// ターゲット要素のy座標を取得
					var targetY = 0;
					while(element){
					   targetY += element.offsetTop;
					   element = element.offsetParent;
					}					
					
					// 現在の表示位置のx座標を取得
					var scrollLeft = document.body.parentNode.scrollLeft || window.pageXOffset || document.body.scrollLeft;					
					
					// 現在の表示位置のy座標を取得
					var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
					
					// windowWidth 取得
					if(window.innerWidth){
						var box = document.createElement('div');
						with(box.style){
							position = 'absolute';
							top = '0';
							left = '0';
							width = '100%';
							height = '100%';
							margin = '0';
							padding = '0';
							border = 'none';
							visibility = 'hidden';
						}
						document.body.appendChild(box);
						var windowWidth = box.offsetWidth;
						document.body.removeChild(box);
					}else{
						var windowWidth = document.documentElement.clientWidth || document.body.clientWidth;
					}
					
					// 横スクール量を調整
					var bodyWidth = Math.max(document.body.scrollWidth, document.documentElement.scrollWidth); //bodyの横幅
					var deltaWidth = bodyWidth - targetX + windowWidth;
					var adjustX = deltaWidth - (bodyWidth - targetX);									
					
					// 横移動距離を計算					
					var toX = Math.max(targetX - scrollLeft - windowWidth, targetX - scrollLeft - windowWidth + (windowWidth - targetX));					
				
					// 縦スクール量の調整			
					var windowHeight = window.innerHeight || document.documentElement.clientHeight; //ウィンドウの高さ	
					var bodyHeight = Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);
					var deltaHeight = bodyHeight - targetY;
					var adjustY = windowHeight - deltaHeight;
					
					// 縦移動量の計算
					if(windowHeight > deltaHeight){				
						var toY = targetY - scrollTop - adjustY;
					} else	{
						var toY = targetY - scrollTop;
					}
					
					var moveX,moveY,myTimer;
					
					function windowScroll(){
						moveX = Math.floor(toX*easing);	
						moveY = Math.floor(toY*easing);	
						
						window.scrollBy(moveX,moveY);
						toX -= moveX;
						toY -= moveY;
						myTimer = setTimeout(windowScroll,interval);
						if(moveY == 0 && moveX == 0){ clearTimeout(myTimer); };
					}								
					windowScroll();	
					return false;					
				};
			}
		}
	}	
}


// ====================================================================================
// ページの読み込みが完了後に実行

$(window).load(function(){
	
	window.scrollTo(0,0);
	$("#loading").css("display", "none");
	
	var content = $("div#content").css("visibility", "visible");
	var line = $("div#line").css("visibility", "visible");
	var heart = $("div#heart").css("visibility", "visible");
	var foot = $("div#foot").css("visibility", "visible");
	var wrap = $("div#wrap").css("visibility", "visible");
	
	// IE以外のブラウザ
	if (!($.browser.msie)) {
		content.fadeTo(0, 0);
		line.fadeTo(0, 0);
		heart.fadeTo(0, 0);
		foot.fadeTo(0, 0);
		wrap.fadeTo(0, 0);
		
		content.fadeTo(1200, 1);
		line.fadeTo(1000, 1);
		heart.fadeTo(2000, 1);
		foot.fadeTo(1200, 1);
		wrap.fadeTo(1400, 1);
	}

	setTimeout(startPageScroll,2000);
});


// ====================================================================================
// init

function init(){
	initRollovers();
	smartScroll();
	
	// 表示位置の制御
	setElementsPosition();
	window.onresize = setElementsPosition;
	window.onscroll = setElementsPosition;
	
	// マウス横スクロール
	if (window.addEventListener) window.addEventListener('DOMMouseScroll', horizontalScroll, false);
	window.onmousewheel = document.onmousewheel = horizontalScroll;
	
	// IE6 Position Fixed
 	$('.exFixed').exFixed();
}


// ====================================================================================
// addLoadEvent

function addLoadEvent(func){
	if(typeof window.addEventListener == 'function'){
		window.addEventListener('load', func, false);
		return true;
	} else if (typeof window.attachEvent == 'object'){
		window.attachEvent('onload', func);
		return true;
	}
	
	var oldonload = window.onload;
	if(typeof window.onload != 'function'){
		window.onload = func;
	} else {
		window.onload = function(){
			oldonload();
			func();
		}
	}
}

addLoadEvent(init);