// medika.jp
// このスクリプトはmootoolsフレームワークを使用しています www.mootools.net

var Site = {
	init: function() {
		this.wrapper_bottom = $('wrapper_bottom');
		this.wrapper_footer = $('wrapper_footer');
		
		// safari fix
		this.safariFix();
		
		// effect
		this.pngFix();
		this.interactive();
		Imagefader.init();
		this.pulldown();
		
		// top page
		//if($('home')) {
			this.flashFx();
			//this.injectFlash();
		//};
		
		// 合格体験談
		if($('success')) Littlebox.init();
		
		/*
		if($('content') && $('content').getElements('a[href=#wrapper]')) {
			var links = $('content').getElements('a[href=#wrapper]');
			new SmoothScroll({duration:320, transition:Fx.Transitions.Quad.easeOut, links:links});
		};
		*/
		new SmoothScroll({duration:320, transition:Fx.Transitions.Quad.easeOut});
		
		
		// google tracker
		if($('conversion')) {
			$ES('a', 'conversion').each(function(el){
				el.addEvent('click', function() {
					var ttl = '/CLICK/footer/'+el.title;
					Site.googleTracker(ttl);
				})
			});
		}
	},
	
	loadedInit: function(){
		this.injectFlash();
		// switch page
		if($$('.switch_content')[0]) SwitchContent.init();
		// 採用情報
		if($$('.accordion_trigger')[0]) this.accordionFx2();
	},
	
	injectFlash: function() {
		// Flash埋め込み
		if($('home') && $('flash')) swfobject.embedSWF("top.swf", "flash", "835", "280", "8.0.24");
	},
	
	pulldown: function() {
		var target = $$('#header ul li');
		target.each(function(el) {
			var fx = el.effect('margin-top',{duration:380, transition:Fx.Transitions.Elastic.easeOut});
			var ttl = '/CLICK/header/'+el.getChildren()[0].title;
			el.addEvents({
				'mouseenter': function() {
					fx.stop();
					fx.start(-3);
				},
				'mouseleave': function() {
					fx.stop();
					fx.start(-10);
				},
				'click': function() {
					Site.googleTracker(ttl);
				}
			});
		});
	},
	
	flashFx: function() {
		var box = $$('.flashfx');
		box.each(function(el) {
			var fx = el.effect('opacity',{duration:350, transition:Fx.Transitions.Circ.easeIn});
			el.addEvent('mouseenter', function() {
				fx.stop();
				el.setStyle('opacity', 0.45);
				fx.start(0.999);
			});
		});
		
	},
	
	interactive: function() {
		var width = window.getWidth();
		if(width < 838) {
			this.wrapper_bottom.setStyle('width', 838);
			this.wrapper_footer.setStyle('margin-left', 0);
		} else {
			this.wrapper_bottom.setStyle('width', '100%');
			this.wrapper_footer.setStyle('margin-left', 'auto');
		}
	},
	
	safariFix: function() {
		if(window.webkit && navigator.userAgent.indexOf('Macintosh') != -1) {
			$$('#home #information dd').setStyles({
				'margin': '-1.5em 0 0 5.6em',
				'font-size': 12
			});
		}
	},
	
	// PNG fix (imgタグ用)
	// <img src="XX.png" alt="" class="pigfix" />
	pngFix: function(){
		if(!$$('.pngfix')[0] || !window.ie6) return;
		var target=$$('.pngfix');
		var url = $('homeulr').getProperty('href');
		target.each(function(el,i) {
			if(el.getTag() == "img") {
				var src = el.getProperty('src');
				el.src = url+'transparent.gif';
				el.setStyle('filter','progid:DXImageTransform.Microsoft.AlphaImageLoader(src='+src+')');
			} else {
				var src = el.getStyle('background-image');
				src = src.replace('url(','');
				src = src.replace(')','');
				el.setStyles({
					'background-image': 'url('+url+'transparent.gif)',
					'filter': 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src='+src+')'
				});
			};
		});
	},
	
	
	// Accordion エフェクト
	accordionFx: function(){
		this.requireOnceAcFX = true;
		var ctnBox = $('switchOverlay');
		var trigger = $$('#accordion h5 a');
		var target = $$('#accordion .ac_body');
		var fx = ctnBox.effect('height', {duration:280, transition:Fx.Transitions.Quad.easeOut});

		function changeHeight(h){
			var height = ctnBox.getStyle('height').toInt() + h;
			//ctnBox.setStyle('height',height);
			fx.start(height).chain(function(){
				if(h<0) appearTrigger();
			});
		};
		function appearTrigger(){
			trigger.setStyle('opacity',0.999);
		}
		
		before = false;
		this.acc = new Accordion(trigger, target, {
			duration: 520,
			start: close,
			//show: 0,
			wait: true,
			alwaysHide: true,
			opacity: true,
			transition: Fx.Transitions.Quad.easeInOut,
			onStart: function() {
				var i = this.previous;
				this.togglers.setStyle('opacity',0);
				this.elements.each(function(el,i) { //既にオープンしているボックスがあるかどうか判定
					if(this.from[i].opacity) before = i;
				}, this);
				if(!$chk(before) && this.to[i].opacity) { //新規オープン時
					changeHeight(this.to[this.previous].height);
				} else if($chk(before) && this.to[i].opacity) { //クロスオープン時(height加算)
					var h = this.to[this.previous].height - this.from[before].height;
					if(h>0) changeHeight(h);
				};
			},
			onComplete: function() {
				if($chk(before) && this.to[this.previous].opacity) { //クロスオープン時(height減算)
					var h = this.to[this.previous].height - this.from[before].height;
					if(h<0) {
						changeHeight(h);
					} else {
						appearTrigger();
					}
				} else if (this.from[this.previous].opacity) {
					changeHeight(-this.from[this.previous].height); //クローズ時
				} else {
					appearTrigger();
				}
			},
			onActive: function(el) {
				el.addClass('on');
			},
			onBackground: function(el) {
				el.removeClass('on');
			}
		});
	},
	
	// Accordion エフェクト : リクルートページ
	accordionFx2: function(){
		var trigger = $$('.accordion_trigger');
		var target = $$('.accordion_recruit');
		
		target.setStyle('display', 'block');
		var acc = new Accordion(trigger, target, {
			duration: 520,
			start: close,
			//show: 0,
			wait: true,
			alwaysHide: true,
			opacity: true,
			transition: Fx.Transitions.Quad.easeInOut
		});
		
		acc.display(0);
		trigger.each(function(el,i) {
			el.addEvents({
				'mouseenter': function() {
					el.setStyle('opacity',0.6);
				},
				'mouseleave': function() {
					el.setStyle('opacity',0.999);
				}
			});
		});
	
	},
	
	
	// Google Analytics
	googleTracker: function(trackName){
		if(location.hostname.indexOf('medika.jp') >= 0) {
			pageTracker._trackPageview(trackName);
		}
	}
};



// コンテンツ切り替えエフェクト
var SwitchContent = {
	init: function() {
		// サポートシステム(accordionFx)
		if($('accordion')) Site.accordionFx();
		
		this.trigger = $$('#switch_trigger li a');
		this.target = $$('.switch_content');
		this.page = $$('body')[0].id;
		this.overlay = $('switchOverlay');
		this.loadingImg = $('loadingImg');
		this.pageTitle = [];// [0]=title tag; [1]=title text
		this.pageTitle[0] = $$('title')[0];
		this.pageTitle[1] = this.pageTitle[0].text.split(' | ')[1];
		
		this.num = []; // [0]=active; [1]=previous
		this.status = false;
		this.anchors = [];
		this.anchorFx = new Fx.Styles($('switch_trigger'), {
			duration:380,
			transition:Fx.Transitions.Back.easeOut,
			onStart: function() {
				(function(){
					if(SwitchContent.num[1] == 'noreferer') {
						return SwitchContent.overlayFX();
					} else {
						return SwitchContent.hide();
					}
				}).delay(250)
			}
		});
		this.fx = [];
		this.fxoverlay = this.overlay.effect('height', {duration:350, transition:Fx.Transitions.Quad.easeOut});
		
		// access with hash
		if(location.hash.indexOf("/") != -1) {
			var uri = location.hash.split("/")[1];
			this.firstView = $(uri);
		} else {
			this.firstView = false;
		}
		
		this.trigger.each(function(el,i) {
			this.fx[i] = this.target[i].effect('opacity', {duration:350, transition:Fx.Transitions.Sine.easeOut});
			var anchor = el.rel;
			this.anchors.push(anchor);
			el.onfocus = function(){this.blur()};
			el.onclick = this.vali.pass(i,this);
			
			if(this.firstView && el.rel.indexOf(this.firstView.id) != -1){
				this.vali(i);
			};
		},this);
		
		// access without hash
		if(!this.firstView) {
			this.vali(0);
		}
	},
	
	vali: function(i) {
		//cancel action
		if(this.status == 'active') return false;
		if(this.trigger[i].hasClass('active')) return false;
		// set value
		this.num[0] = i;
		this.status = 'active';
		
		location.href = this.anchors[this.num[0]];
		this.set(i);
		return false;
	},
	
	set: function(i) {
		// for trigger style
		if(!$chk(this.num[1])) {
			this.num[1] = 'noreferer';
		} else {
			this.trigger[this.num[1]].removeClass('active');
		};
		this.trigger[i].addClass('active');
		// page title
		document.title = this.trigger[i].innerHTML +' | '+ this.pageTitle[1];
		// effect fire
		this.triggerFx();
	},
	
	triggerFx: function() {
		var prePos = (this.num[1] == 'noreferer') ? 15 : 45*this.num[1]+15;
		var nextPos = '0 '+(45*this.num[0]+15);
		this.anchorFx.start({
			'background-position': ['0 '+prePos ,nextPos]
		})
	},
	
	hide: function() {
		this.loadingImg.setStyle('margin-top', this.target[this.num[0]].clientHeight/2-25);
		this.target[this.num[1]].removeClass('active');
		return this.overlayFX();
	},
	
	overlayFX: function() {
		this.fxoverlay.start(this.target[this.num[0]].clientHeight).chain(this.show.bind(this));
	},
	
	show: function() {
		this.target[this.num[0]].setStyle('opacity',0.001);
		this.target[this.num[0]].addClass('active');
		this.fx[this.num[0]].start(0.999).chain(this.endProcess.bind(this));
	},
	
	endProcess: function(){
		// google tracker
		var tracking = '/AJAX/'+this.page+'/'+this.trigger[this.num[0]].innerHTML;
		if(this.num[1] != 'noreferer') Site.googleTracker(tracking);
		
		// open accordion once
		if($('accordion') && Site.requireOnceAcFX && this.num[0]==0) {
			Site.acc.display(0);
			Site.requireOnceAcFX = false;
		}
		
		// end process
		this.status = false;
		this.num[1] = this.num[0];
		
	}
};



// 合格体験談表示エフェクト
var Littlebox = {
	init: function() {
		this.parserURL = 'success_inner.php';
		this.triggers = [];
		this.anchors = $$('.littlebox');
		this.anchors.each(function(el) {
			el.onclick = this.ajax.bind(this,el);
		},this);
		
		this.overlay = $('overlay');
		this.overlay.style.top = '-10px';
		this.overlayBg = $('overlay_bg');
		this.bgWrapper = $('overlay_bg_wrapper');
		
		this.overlay.setStyle('opacity', 0.001);
		
		this.fx = this.overlay.effects();
		this.fxbg = this.overlayBg.effect('top');
		
	},
	
	ajax: function(el) {
		var param = el.rel.split('|');
		var url = this.parserURL+'?year='+param[0]+'&id='+param[1];
		new Ajax(url,{
			method: 'get',
			update: 'overlay',
			onComplete: this.show.bind(this)
		}).request();
		return false;
	},
	
	show: function() {

		this.btnClose = $('btnClose');
		var btnSrc = this.btnClose.src;
		var btnOnSrc = btnSrc.replace('.jpg','_on.jpg');
		this.btnClose.addEvents({
			'mouseenter': function() {
				this.src = btnOnSrc;
			},
			'mouseleave': function() {
				this.src = btnSrc;
			},
			'click': this.close.bind(this)
		});
		
		this.fx.stop();
		this.overlay.style.left = this.overlayBg.style.left = this.bgWrapper.style.left = 0;
		this.fx.start({
			'opacity': 0.999,
			'top': [-10,0]
		});
	},
	
	close: function() {
		this.fx.start({
			'opacity': 0.001,
			'top': [0,10]
		}).chain(this.remove.bind(this));
		this.fxbg.start(0,700);
	},
	
	remove: function() {
		//this.fxbg.start(0.2);
		this.overlay.style.top = '-10px';
		this.overlayBg.style.top = 0;
		this.overlay.style.left = this.bgWrapper.style.left = '-9999px';
	}
};




/*
Imagefader エフェクト:
	マウスオーバー時に<img>要素をフェードイン・アウトさせるエフェクト。
	マウスオーバー時に表示させる画像は<img>要素のファイル名に"_on"を追加して
	元画像と同ディレクトリに用意しておく。
	例）表示させておく画像名 <img src="img/xxx.jpg" />
		マウスーバー時の画像 <img src="img/xxx_on.jpg" />
	
	親要素に<a>要素が必要。
	このエフェクトを適応すると、親要素の<a>タグはブロックレベル要素になるので、
	適宜cssは調整すること。
	
Example:
	適応したい<img>タグにclass="Imagefader"を追加するだけ
	<a href="#">
		<img src="xxx.gif" class="Imagefader" />
	</a>
*/
var Imagefader = {
	
	init: function() {
		this.imgArr = [];
		this.parents = [];
		var images = $$('.Imagefader');
		images.each(function(el, i) {
			this.parents[i] = el.getParent();
			var src = el.getProperty('src');
			var extension = src.substring(src.lastIndexOf('.'));
			src = src.replace(extension, '_on'+extension);
			// for modern browser
			if(!window.ie) {
				this.imgArr[i] = new Image();
				this.imgArr[i].onload = this.setParent.bind(this, [el, i]);
				this.imgArr[i].src = src;
				return;
			};
			// for IE
			el.getParent().setStyles({'display':'block', 'width':el.width, 'background':'url('+ src +') no-repeat 0 0'});
			this.setEffect(el,i);
		},this);
	},
	
	setParent: function(el, i) {
		this.parents[i].setStyles({
			'display':'block',
			'width':this.imgArr[i].width,
			'background':'url('+ this.imgArr[i].src +') no-repeat 0 0'
		});
		this.setEffect(el, i);
	},
	
	setEffect: function(el, i) {
		var fx = el.effect('opacity',{duration:430, transition:Fx.Transitions.Sine.easeOut});
		el.addEvents({
			'mouseenter': function() {
				fx.stop();
				el.setStyle('opacity',0.001);
			},
			'mouseleave': function() {
				//fx.stop();
				fx.start(0.999);
			}
		});
	}
};



// DOMの読み込み完了時にスクリプトを実行させる
window.addEvents({
	'domready':Site.init.bind(Site),
	'load':Site.loadedInit.bind(Site),
	'resize':Site.interactive.bind(Site)
});