/*
------------------------------------------------------------------------
	update: 09/04/10
------------------------------------------------------------------------
*/
$(function() {
	//変数定義
	var _slidObj, _slidPosX, _barSize, _barZoom, _itemObj, _sliderShow, _sliderChk;
	var _barArea = 652;
	var _curPosX = _beforePosX = 0;
	var _productObj, _pPosX, _pPosY;
	var _pCurPosX = _pCurPosY = _pBeforePosX = _pBeforePosY = 0;
	var _animeTime = 1050;
	var img = {};
	var wheel, _showProductFlg, _curProduct;
	var pageload, animateMenu, loadContents, _hashChk;
	var _menuFlg, _menuList = ['contents', 'profile', 'inquiry', 'thanks'];
	
	//スライダーの追加
	$( '#mainBox' ).append( $( '<div id="slidView"></div>' ).css( 'visibility', 'hidden' ) );
	$( '#slidView' ).load( 'slid.html' );
	
	//スライダーの幅設定
	_sliderChk = function() {
		if( $( '#slidBox .slidItem' ).width() ) {
			_barSize = _barArea * _barArea / $( '#slidBox .slidItem' ).width();
			_barZoom = $( '#slidBox .slidItem' ).width() / _barArea;
			$( '#sliderBar' ).width( _barSize );
			$( '#sliderBar' ).mousedown(function( evt ) {
				_slidObj = $( this );
				_itemObj = $( '#slidBox .slidItem' );
				_slidPosX = evt.pageX;
			});
			
			if( $.browser.msie ) {
				$( '#slidBox a' ).click( function(){
					var hash = this.href;
					hash = hash.replace( /^.*#/, '' );
					// moves to a new page. 
					// pageload is called at once. 
					$.historyLoad( hash );
				});
			}
		} else {
			setTimeout( function() {
				_sliderChk();
			}, 500 );
		}
	}
	
	_sliderChk();
	
	//スライドリンクのカレント化
	_sliderShow = function( h ) {
		function chk() {
			if( !$( '#slidBox .slidItem li a' ).get(0) ) {
				setTimeout(function() {
					chk();
				}, 500 );
			} else {
				h.match( /^(p_)?([a-zA-Z0-9]*)(_s|_l)?$/g );
				var chkHref = RegExp.$2;
				var reg = new RegExp( '#' + chkHref + '$', 'g' );
				$( '#slidBox .slidItem li a' ).each(function() {
					if( $( this ).attr( 'href' ).match( reg ) ) {
						$( this ).addClass( 'current' );
					} else {
						$( this ).removeClass( 'current' );
					}
				});
			}
		}
		
		chk();
		
		$( '#slidView:hidden' ).css({
			'display': 'none',
			'visibility': 'visible'
		});
		$( '#slidView:hidden' ).fadeIn();
	}
	
	/* --------------------------------------
		ロードコンテンツ
	----------------------------------------- */
	loadContents = function( file ) {
		_animeTime = 0;
		$( '#contentsView' ).hide();
		$( '#contentsView' ).load( file, function() {
			if( $.browser.msie && $.browser.version.indexOf( '6' ) !== -1 ) {
				DD_belatedPNG.fix( '#contentsView .contents .thumbnail img');
			}
			$( '#contentsView' ).fadeIn(function() {
				if( _hashChk === 'inquiry' ) {
					$( 'dd.subject input' ).focus();
				}
			});
			
			if( /contents.*/g.test( file ) && $.browser.msie ) {
				$( '.productList a' ).click(function() {
						var hash = this.href;
						hash = hash.replace( /^.*#/, '' );
						// moves to a new page. 
						// pageload is called at once. 
						$.historyLoad( hash );
				});
			}
		});
	}
	
	/* --------------------------------------
		メニューのアニメーション
	----------------------------------------- */
	animateMenu = function( callback ) {
		if( _animeTime === 0 ) {
			callback();
		} else {
			$( '#mainBox' ).animate({
				bottom: '0%'
			}, _animeTime, 'easeInOutCubic', function() {
				callback();
				if( _hashChk ) {
					for( var i=0; i<_menuList.length; i++) {
						if( _menuList[i] === _hashChk ) {
							_menuFlg = true;
						}
					}
					
					if( !_menuFlg ) {
						$( '#slidView' ).css({
							'display': 'none',
							'visibility': 'visible'
						});
						$( '#slidView' ).fadeIn();
					}
				}
			});
		}
	}
	
	/* --------------------------------------
		TOP読み込み時のアニメーション
	----------------------------------------- */
	$( '#title img, #copyright' ).hide();
	$( '#title' ).css( 'width', '0' );
	
	if( $.support.opacity ) {
		$( '#mainBox' ).fadeIn( 1000, function() {
			$( '#title' ).animate({
				width: '100%'
			}, 1000, 'easeInOutCubic', function() {
				$( '#title img, #copyright' ).fadeIn( 'slow' );
			});
		});
	} else {
		$( '#mainBox' ).show( 1, function() {
			if( $.browser.msie && $.browser.version.indexOf( '6' ) !== -1 ) {
				DD_belatedPNG.fix( '#mainBox h1 a img');
			}
			$( '#title' ).animate({
				width: '100%'
			}, 1000, 'easeInOutCubic', function() {
				$( '#title img, #copyright' ).fadeIn( 'slow' );
			});
		});
	}
	
	//アンカーがあればそれを読み込み
	pageload = function( hash ) {
		_hashChk = hash;
		
		// hash doesn't contain the first # character.
		if( hash ) {
			// restore ajax loaded state
			if( !$( '#contentsView' ).get(0) ) {
				$( '#contentsBox' ).append( '<div id="contentsView"></div>' );
			}
			if( hash.match( /^(p_)(.*)(_l|_s)/g ) ) {
				var con = RegExp.$2;
				animateMenu( function() { loadContents( con + '.html' ); } );
			} else {
				animateMenu( function() { loadContents( hash + '.html' ); } );
			}
			
			_menuFlg = false;
			for( var i=0; i<_menuList.length; i++ ) {
				if( hash === _menuList[i] ) {
					$( document.body ).attr( 'class', hash );
					_menuFlg = true;
					break;
				}
			}
			
			if( !_menuFlg ) {
				_sliderShow( hash );
				$( document.body ).attr( 'class', 'contents' );
			} else {
				$( '#slidView' ).css({
					'display': 'none',
					'visibility': 'visible'
				});
				$( '#slidView' ).hide();
			}
		}
	}

	// Initialize history plugin.
	// The callback is called at once by present location.hash. 
	$.historyInit( pageload );
	
	// set onlick event for buttons
	$( 'a[href^="#"]:not(.productZoom)' ).live( 'click', function(){
		var hash = this.href;
		hash = hash.replace( /^.*#/, '' );
		// moves to a new page. 
		// pageload is called at once. 
		$.historyLoad( hash );
	});

	
	
	
	/* --------------------------------------
		ドラッグイベント関連
	----------------------------------------- */
	$( document ).mousemove(function( evt ) {
		if( _slidObj ) {
			evt.preventDefault();
			evt.returnValue = false;
			if( window.getSelection ) {
				window.getSelection().removeAllRanges();
			}
			
			_curPosX = _beforePosX + evt.pageX - _slidPosX;
			if( _curPosX < 0 ) {
				_curPosX = 0;
			}
			if( _curPosX > _barArea - _barSize ) {
				_curPosX = _barArea - _barSize;
			}
			_slidObj.css( 'left', _curPosX + 'px' );
			_itemObj.css( 'left', -( _curPosX * _barZoom ) + 'px' );
			
		} else if( _productObj ) {
			evt.preventDefault();
			evt.returnValue = false;
			if( window.getSelection ) {
				window.getSelection().removeAllRanges();
			}
			
			_pCurPosX = _pBeforePosX + evt.pageX - _pPosX;
			_pCurPosY = _pBeforePosY + evt.pageY - _pPosY;
			
			_productObj.css({
				'left': _pCurPosX + 'px',
				'top': _pCurPosY + 'px'
			});
		}
	});
	
	$( document ).mouseup(function() {
		if( _slidObj ) {
			_beforePosX = _curPosX;
			_slidObj = null;
		} else if( _productObj ) {
			_pBeforePosX = _pCurPosX;
			_pBeforePosY = _pCurPosY;
			_productObj = null;
		}
	});
	/* --------------------------------------
		/ドラッグイベント関連
	----------------------------------------- */	
	
	//サムネイル小のクリックイベント
	$( '#slidBox ul li a' ).live( 'click', function() {
		$( '#slidBox ul li a' ).removeClass( 'current' );
		$( this ).addClass( 'current' );
	});
	
	//サンプルクリックイベント（拡大表示）
	$( 'a.productZoom' ).live( 'click', function( evt ) {
		evt.preventDefault();
		_showProductFlg = true;
		
		var loader = $( '<div id="coverLoader"><img src="images/loader.gif" alt="読み込み中…" /></div>' );
		var cover = $( '<div id="cover"></div>' ).click(function() {
			$( '#cover, #coverLoader' ).fadeOut(function() {
				$( '#cover, #coverLoader' ).remove();
			});
		});
		
		//画像URLの取得
		var sp = this.href.split( '#' );
		var url = 'images/' + sp[1] + '.jpg';
		
		if( img[sp[1]] ) {
			$( document.body ).append( cover );
			$( '#cover' ).css( 'filter', 'alpha(opacity=70)' ).fadeIn( 'slow' );
		} else {
			$( document.body ).append( cover );
			$( document.body ).append( loader );
			$( '#cover, #coverLoader' ).css( 'filter', 'alpha(opacity=70)' ).fadeIn( 'slow' );
		}
		
		//画像コントローラー
		var controlFlg = false;
		var control = $( '<div id="imgCtrl"></div>' )
			.append( '<span id="zoomCtrl" class="btnWrap"><span>画像を等倍表示</span></span> <span id="closeCtrl" class="btnWrap"><span>画像を閉じる</span></span>' );
		$( document.body ).append( control );
		
		//クローズのイベント登録
		$( '#closeCtrl' ).click(function( evt ) {
			evt.preventDefault();
			_showProductFlg = false;
			_curProduct = null;
			
			$( '#cover, #coverLoader, #imgWrap, #imgCtrl' ).fadeOut(function() {
				//画像を元の縮小サイズに
				$( img[sp[1]] ).css({
					'width': img[sp[1]].backWidth + 'px',
					'height': img[sp[1]].backHeight + 'px'
				});
				$( '#cover, #coverLoader, #imgWrap, #imgCtrl' ).remove();
			});
		});
		
		var zoomEvent = function( evt ) {
			if( !controlFlg ) {
				controlFlg = true;
				$( '#zoomCtrl span' ).text( '画像を縮小表示' );
				
				//リサイズアニメーション
				$( img[sp[1]] ).animate({
					width: img[sp[1]].defWidth + 'px',
					height: img[sp[1]].defHeight + 'px',
					left: ( $( 'html' ).attr( 'clientWidth' ) / 2 ) - ( img[sp[1]].defWidth / 2 ) + 'px',
					top: '40px'
				}, 500, 'easeOutQuint', function() {
					_pBeforePosX = parseInt( $( this ).css( 'left' ) );
					_pBeforePosY = parseInt( $( this ).css( 'top' ) );
				});
				
				evt.preventDefault();
			} else {
				controlFlg = false;
				$( '#zoomCtrl span' ).text( '画像を等倍表示' );
			
				//リサイズアニメーション
				$( img[sp[1]] ).animate({
					width: img[sp[1]].backWidth + 'px',
					height: img[sp[1]].backHeight + 'px',
					left: ( $( 'html' ).attr( 'clientWidth' ) / 2 ) - ( img[sp[1]].backWidth / 2 ) + 'px',
					top: '60px'
				}, 500, 'easeOutQuint', function() {
					_pBeforePosX = parseInt( $( this ).css( 'left' ) );
					_pBeforePosY = parseInt( $( this ).css( 'top' ) );
				});
				
				evt.preventDefault();
			}
		}
		
		//ズームのイベント登録
		$( '#zoomCtrl' ).click( zoomEvent );
		
		//画像表示用オブジェクト
		var imgWrap = $( '<div id="imgWrap"></div>' ).click(function() {
			_showProductFlg = false;
			_curProduct = null;
			
			$( '#cover, #coverLoader, #imgWrap, #imgCtrl' ).fadeOut(function() {
				//画像を元の縮小サイズに
				$( img[sp[1]] ).css({
					'width': img[sp[1]].backWidth + 'px',
					'height': img[sp[1]].backHeight + 'px'
				});
				$( '#cover, #coverLoader, #imgWrap, #imgCtrl' ).remove();
			});
		});
		
		//画像の表示
		if( img[sp[1]] ) {
			_curProduct = img[sp[1]];
			
			$( img[sp[1]] ).css( 'top', '60px' ).mousedown(function( evt ) {
				evt.preventDefault();
				_productObj = $( this );
				_pPosX = evt.pageX;
				_pPosY = evt.pageY;
			}).click(function( evt ) {
				evt.stopPropagation();
			}).dblclick( zoomEvent );
			
			imgWrap.append( img[sp[1]] );
			$( document.body ).append( imgWrap );
			$( img[sp[1]] ).css({
				'left': ( $( 'html' ).attr( 'clientWidth' ) / 2 ) - ( $( img[sp[1]] ).width() / 2 ) + 'px',
				'display': 'none',
				'visibility': 'visible'
			});
			
			$( img[sp[1]] ).fadeIn( 'slow', function() {
				control.animate({
					top: 0
				}, 'easeInOutCubic' );
			});
			_pBeforePosX = parseInt( $( img[sp[1]] ).css( 'left' ) );
			_pBeforePosY = parseInt( $( img[sp[1]] ).css( 'top' ) );
			
		} else {
			img[sp[1]] = new Image();
			img[sp[1]].src = url;
			_curProduct = img[sp[1]];
			
			$( img[sp[1]] ).mousedown(function( evt ) {
				evt.preventDefault();
				_productObj = $( this );
				_pPosX = evt.pageX;
				_pPosY = evt.pageY;
			}).click(function( evt ) {
				evt.stopPropagation();
			}).dblclick( zoomEvent );
			
			img[sp[1]].loadChk = function() {
				if( !img[sp[1]].width ) {
					return (function() {
						setTimeout(function() {
							img[sp[1]].loadChk();
						}, 500 );
					})();
				}
				//%の取得
				var hPer = $( 'html' ).attr( 'clientHeight' ) * 0.8;
				var wPer = img[sp[1]].width * hPer / img[sp[1]].height;
				if( hPer > img[sp[1]].height ) {
					hPer = img[sp[1]].height;
					wPer = img[sp[1]].width;
				}
				
				$( img[sp[1]] ).css({
					'cursor': 'move',
					'position': 'absolute',
					'top': '60px',
					'visibility': 'hidden',
					'width': wPer + 'px',
					'height': hPer + 'px'
				});
				
				img[sp[1]].defWidth = img[sp[1]].width;
				img[sp[1]].defHeight = img[sp[1]].height;
				
				$( '#coverLoader' ).fadeOut(function() {
					$( '#coverLoader' ).remove();
				});
				
				imgWrap.append( img[sp[1]] );
				$( document.body ).append( imgWrap );
				$( img[sp[1]] ).css({
					'left': ( $( 'html' ).attr( 'clientWidth' ) / 2 ) - ( $( img[sp[1]] ).width() / 2 ) + 'px',
					'display': 'none',
					'visibility': 'visible'
				});
				
				$( img[sp[1]] ).fadeIn( 'slow', function() {
					control.animate({
						top: 0
					}, 'easeInOutCubic' );
				});
				_pBeforePosX = parseInt( $( img[sp[1]] ).css( 'left' ) );
				_pBeforePosY = parseInt( $( img[sp[1]] ).css( 'top' ) );
				//縮小サイズのバックアップ
				img[sp[1]].backWidth = $( img[sp[1]] ).width();
				img[sp[1]].backHeight = $( img[sp[1]] ).height();
			}
			
			img[sp[1]].loadChk();
		}
	});
	
	//マウスホイール処理
	wheel = function( evt ) {
		evt = evt || event;
		var delta = 0;
		if( evt.wheelDelta ) {
			delta = evt.wheelDelta / 120;
		} else if( evt.detail ) {
			delta = -evt.detail / 3;
		}
		
		if( delta && _showProductFlg) {
			if( delta < 0 ) {
				_pBeforePosY = parseInt( $( _curProduct ).css( 'top' ) ) - 40;
				$( _curProduct ).css( 'top', _pBeforePosY + 'px' );
			} else {
				_pBeforePosY = parseInt( $( _curProduct ).css( 'top' ) ) + 40;
				$( _curProduct ).css( 'top', _pBeforePosY + 'px' )
			}
			if( evt.preventDefault ) {
				evt.preventDefault();
			} else {
				evt.returnValue = false;
			}
		}
	}

	
	//マウスホイール処理
	if( window.addEventListener ) {
		window.addEventListener( 'DOMMouseScroll', wheel, false );
		if( window.opera ) {
			window.addEventListener( 'mousewheel', wheel, false );
		}
	} else {
		document.attachEvent( 'onmousewheel', wheel );
	}
	window.onmousewheel = wheel;
	
	//Google Analytics page tracker.
	$( 'a' ).live( 'click', function() {
		if( !this.href.match( /(http:\/\/|https:\/\/|javascript)/ig ) ) {
			var pId = this.href.replace( /^.*#/, '' );
			pageTracker._trackPageview( '/' + pId );
		}
	});
	
});