/*	halfclub debec department store category script

	The copyright of this script belongs to Sensitivefreak.
	The final frame of this work was done on Fed. 11th, 2009. 
	ps. this whole work has been done following prototype.js,
	and for the further questions, please email to studiolog.jang@gmail.com 
----------------------------------------------------*/

try {
  document.execCommand('BackgroundImageCache', false, true);
} catch(e) {}

/*===================================================
°øÅë_·Ñ¿À¹ö¼¼ÆÃ
----------------------------------------------------*/
var RollOver = Class.create({
	initialize: function(container){
		this.element = $$("#"+container+" img");
		this.initEvent();
	},
	initEvent: function(){
		this.handler1 = this.handleOn.bind(this);
		this.handler2 = this.handleOf.bind(this);
		this.element.each(function(e, index){
			if(e.className == "reffer"){
				e.setAttribute("src", e.getAttribute("src").replace(".gif", "_on.gif"));
			}else{
				e.observe("mouseover", this.handler1);
				e.observe("mouseout",  this.handler2);
			}
		}.bind(this));
	},
	handleOn: function(e){
		var e = e.element();
		e.setAttribute("src", e.getAttribute("src").replace(".gif", "_on.gif"));
	},
	handleOf: function(e){
		var e = e.element();
		e.setAttribute("src", e.getAttribute("src").replace("_on.gif", ".gif"));
	}
});

/*===================================================
ÀüüīÅ×°í¸®º¸±â
----------------------------------------------------*/
var AllCate = Class.create({
	initialize: function(){
		if(!$("AllCate_Button")) return;
		this.opener = $("AllCate_Button");
		this.open_content = $("AllCate");
		this.initEvent();
		new RollOver("AllCate_Group");
	},
	initEvent: function(){
		this.handler = this.handleOpen.bind(this);
		this.opener.observe("click", this.handler)
	},
	handleOpen: function(){
		this.open_content.setStyle({visibility:"visible"});
	},
	handleClose: function(){
		this.open_content.setStyle({visibility:"hidden"});
	}
});

/*===================================================
»ó¼¼ÆäÀÌÁö
----------------------------------------------------*/
var Detail = Class.create({
	initialize: function(){
		this.thumb = $$("#DetailThumb img");
		this.initEvent();
	},
	initEvent: function(){
		this.handler1 = this.handleOn.bind(this);
		this.handler2 = this.handleOf.bind(this);
		this.thumb.each(function(e, index){
			e.observe("mouseover", this.handler1);
			e.observe("mouseout",  this.handler2);
		}.bind(this));
	},
	handleOn: function(e){
		var element = e.element();
		element.setStyle({border:"2px solid #6989b2"});
	},
	handleOf: function(e){
		var element = e.element();
		element.setStyle({border:"2px solid #fff"});
	}
});


/*===================================================
´ë¹é¸Þ´º
----------------------------------------------------*/
/*
//var DebecCategory = Class.create ´Â LeftMenuTrendBrand_off.asp Á¸ÀçÇÏ´Â °ÍÀ» ¾¸ (LeftMenuTrendBrand_off.asp ¾È¿¡ Àִ°ÍÀÌ ÃֽŰÍ)
//¾Æ¸® ¸Þ´º °ü·Ã js´Â ´õÀÌ»ó »ç¿ë ¾ÈÇÔ
var DebecCategory = Class.create({
	initialize: function(){
		this.d1 = $$("#DebecCategory td.over img");
		this.d2 = $$("div .DebecSub_D2");
		this.d3 = new Array();
		this.initEvent();
	},
	initEvent: function(){
		for(var i = 0; i < this.d1.length; i++){
			this.handler1 = this.handleOnD1.bindAsEventListener(this, i);
			this.handler2 = this.handleOfD1.bindAsEventListener(this, i);
			this.d1[i].observe("mouseover", this.handler1);
			this.d1[i].observe("mouseout",  this.handler2);
			this.d2[i].observe("mouseover", this.handler1);
			this.d2[i].observe("mouseout",  this.handler2);
			var d2 = this.d2[i].getElementsByTagName("img");
			this.d3[i] = new Array();
			for(var n = 0; n < d2.length; n++){
				this.d3[i][n] = new Array();
				this.d3[i][n][0] = d2[n];
				this.d3[i][n][0].index = n;
				this.d3[i][n][1] = $("M_" + (i + 1) + "_" + (n + 1));
				this.handler3 = this.handleOnD2.bind(this, i, n);
				this.handler4 = this.handleOfD2.bind(this, i, n);
				this.d3[i][n][1].observe("mouseover", this.handler1);
				this.d3[i][n][1].observe("mouseout",  this.handler2);
				this.d3[i][n][1].observe("mouseover", this.handler3);
				this.d3[i][n][1].observe("mouseout",  this.handler4);
			}
		}
	},
	handleOnD1: function(e, index){
		this.d1[index].setAttribute("src", this.d1[index].getAttribute("src").replace(".gif", "_on.gif"));
		this.d2[index].setStyle({visibility:"visible"});
		if(e.element().index != undefined)
			this.handleOnD2(index, e.element().index);
	},
	handleOfD1: function(e, index){
		this.d1[index].setAttribute("src", this.d1[index].getAttribute("src").replace("_on.gif", ".gif"));
		this.d2[index].setStyle({visibility:"hidden"});
		if(e.element().index != undefined)
			this.handleOfD2(index, e.element().index);
	},
	handleOnD2: function(index1, index2){
		this.d3[index1][index2][0].setAttribute("src", this.d3[index1][index2][0].getAttribute("src").replace(".gif", "_on.gif"));
		this.d3[index1][index2][1].setStyle({visibility:"visible"});
	},
	handleOfD2: function(index1, index2){
		this.d3[index1][index2][0].setAttribute("src", this.d3[index1][index2][0].getAttribute("src").replace("_on.gif", ".gif"));
		this.d3[index1][index2][1].setStyle({visibility:"hidden"});
	}
});
*/

/*===================================================
All Brand
----------------------------------------------------*/
var Scroller = Class.create({
	initialize: function(element, handle, track, options) {
	    var scroller = this;

		this.element	= $(element);
		this.wrapper	= $(element).up();
		this.handle		= $(handle);
		this.track		= $(track);
		this.value		= 0;

	    this.options = options || { };
		this.options = Object.extend({
			axis: "vertical",
			minHeight: scroller.wrapper.offsetHeight,
			maxHeight: scroller.element.scrollHeight,
			trackSize: this.track.offsetHeight,
			onChange: function(value)  {
				scroller.setScroll(value);
			},
			onSlide: function(value)  {
				scroller.setScroll(value);
			}
		}, options);

		var barSize = parseInt((this.options.minHeight / this.options.maxHeight) * this.options.trackSize);
		this.unit = (this.options.maxHeight - this.options.minHeight) / (this.options.trackSize - barSize);
		this.handle.style.height = barSize + "px";
	    this.options.range = $R(0,this.options.trackSize - barSize);

		this.eventWheel = this.wheelAction.bindAsEventListener(this);
		if(window.addEventListener)
			Event.observe(document, "DOMMouseScroll", this.eventWheel);
		else
			Event.observe(document, "mousewheel", this.eventWheel);

		this.slider = new Control.Slider(this.handle, this.track, this.options);
	},
	update: function(){
		this.options.minHeight = this.wrapper.offsetHeight;
		this.options.maxHeight = this.element.scrollHeight;
		this.options.trackSize = this.track.offsetHeight;
		var barSize = parseInt((this.options.minHeight / this.options.maxHeight) * this.options.trackSize);
		this.unit = (this.options.maxHeight - this.options.minHeight) / (this.options.trackSize - barSize);
		this.handle.style.height = barSize + "px";
	    this.options.range = $R(0,this.options.trackSize - barSize);
		this.slider.newRange(this.options.range);
	},
	wheelAction: function(e) {
		if(!e) e = window.event;

		if(e.pointerY() < this.wrapper.cumulativeOffset()[1] || e.pointerY() > this.wrapper.cumulativeOffset()[1] + this.wrapper.getHeight()) return;
		if(e.pointerX() < this.wrapper.cumulativeOffset()[0] || e.pointerX() > this.wrapper.cumulativeOffset()[0] + this.wrapper.getWidth()) return;
		if(e.wheelDelta) {
			this.multiplier = -e.wheelDelta/120; 
			if (e.opera) this.multiplier = -this.multiplier;
		}else if(e.detail){
			this.multiplier = e.detail/3;
		}
		e.stop();
		this.setSlider();
	},
	setSlider: function() {
		this.slider.setValue(this.value + 5 * this.multiplier, 0);
	},
	setScroll: function(value) {
		this.value = value;
		this.element.style.marginTop = (-this.value*this.unit) + "px";
		(this.options.onScroll || Prototype.emptyFunction)(value, this);
	}
});

var ABO = Class.create({
	initialize: function(opener, box, element, handle, track, option){
		this.opener = $(opener);
		this.box = $(box);
		this.content = $(element);
		this.wrap = this.content.up();
		this.track = $(track);
		this.status = 0;
		this.scroller = new Scroller(element, handle, track, option);
		this.initEvent();
	},
	initEvent: function(){
		this.handler = this.handleToggle.bind(this);
		this.opener.observe("click", this.handler);
	},
	handleToggle: function(){
		if(this.status == 0){
			this.status = 1;
			this.box.style.top = ($('DebecBrandTab')) ? "380px" : "120px";
			this.content.style.height = "302px";
			this.wrap.style.height = "302px";
			this.track.style.height = "302px";
			this.opener.setAttribute("src", this.opener.getAttribute("src").replace(".gif", "_on.gif"));
		}else{
			this.status = 0;
			this.box.style.top =  ($('DebecBrandTab')) ? "567px" : "307px";
			this.content.style.height = "115px";
			this.wrap.style.height = "115px";
			this.track.style.height = "115px";
			this.opener.setAttribute("src", this.opener.getAttribute("src").replace("_on.gif", ".gif"));
		}
		this.scroller.update();
	}
});

/*===================================================
°øÅë_ÅÇÄÁÅÙÃ÷
¼³¸í_ÅÇÄÁÅÙÃ÷¸¦ °¨½Î´Â Àüü ÄÁÅ×À̳ÊÀÇ id °ªÀ» ÆĶó¸ÞÅÍ·Î new TacContent(parameta);
	 À̶§, ÅÇÀ̹ÌÁö¸¦ °¨½Î´Â ¿¤¸®¸ÕÆ®¿¡ Ŭ·¡½º¸íÀ» .tabÀ¸·Î..
	 ÅÇÄÁÅÙÃ÷¹Ú½º ¿¤¸®¸ÕÆ®¿¡ Ŭ·¡½º¸íÀ» .tab_content·Î ÁÖ¸é µÊ
----------------------------------------------------*/
var TabContent = Class.create({
	initialize: function(box){
		this.tab = $$("#"+box+" .tab img");
		this.tab_cnt = $$("#"+box+" .tab_content");
		this.initEvent();
	},
	initEvent: function(){
		this.handler = this.handleToggle.bind(this);
		this.tab.each(function(e, index){
			e._index = index;
			e.observe("click", this.handler);
		}.bind(this));
	},
	handleToggle: function(e){
		var element = e.element();
		this.tab.each(function(e, index){
			if(element._index == index){
				e.setAttribute("src", e.getAttribute("src").replace(".gif", "_on.gif"));
				this.tab_cnt[index].setStyle({display:"block"});
			}else{
				e.setAttribute("src", e.getAttribute("src").replace("_on.gif", ".gif"));
				this.tab_cnt[index].setStyle({display:"none"});
			}
		}.bind(this));
	}
});

var TabVertical = Class.create({
	initialize: function(box){
		this.tab = $$("#"+box+" .opener a");
		this.tab_cnt = $$("#"+box+" .content");
		this.initEvent();
	},
	initEvent: function(){
		this.handler = this.handleToggle.bind(this);
		this.tab.each(function(e, index){
			e._index = index;
			e.observe("click", this.handler);
		}.bind(this));
	},
	handleToggle: function(e){
		var element = e.element();
		this.tab.each(function(e, index){
			if(element._index == index){
				this.tab_cnt[index].setStyle({display:"block"});
			}else{
				this.tab_cnt[index].setStyle({display:"none"});
			}
		}.bind(this));
	}
});

var BrandBar = Class.create({
	initialize: function(){
		this.element_view = $("DBB-Wrap");
		this.element_move = $("DBB-Track");
		this.element_body = $$("#DBB-Track ul")[0];
		this.element_width = this.element_body.getWidth();
		this.button_move_l = $("DBB-DL");
		this.button_move_r = $("DBB-DR");
		this.view_width=761;
		this.move_space=0;
		this.speed=3;
		this.speed_count=0;
		this.direction=-1;
		this.move_pos=0;
		this.initDom();
		this.moveCalc();
		this.initMove();
	},
	moveCalc: function(){
		this.move_space = this.view_width-this.element_width;
		if(this.move_space>0)
			return;
		this.move_space-=this.element_width;
	},
	initDom: function(){
		this.handler1=this.moveStop.bind(this);
		this.handler2=this.moveStart.bind(this);
		this.handler3=this.moveRight.bind(this);
		this.handler4=this.moveLeft.bind(this);
		this.handler5=this.moveNormal.bind(this);
		this.element_view.observe("mouseover",this.handler1);
		this.element_view.observe("mouseout", this.handler2);
		this.button_move_l.observe("mouseover",this.handler3);
		this.button_move_r.observe("mouseover",this.handler4);
		this.button_move_l.observe("mouseout", this.handler5);
		this.button_move_r.observe("mouseout", this.handler5);
	},
	initMove: function(){
//		this.interval=setInterval(this.move.bind(this), 5);
		new PeriodicalExecuter(this.move.bind(this), 0.01);
	},
	moveStart: function(){
		this.direction=-1;
	},
	moveStop: function(){
		this.direction=0;
	},
	moveRight: function(){
		this.direction=1;
		this.speed=1;
		if(this.move_pos>-this.element_width)
			this.move_pos-=this.element_width;
	},
	moveLeft: function(){
		this.direction=-1;
		this.speed=1;
		if(this.move_pos<-this.element_width)
			this.move_pos+=this.element_width;
	},
	moveNormal: function(){
		this.speed=3;
	},
	move: function(){
		this.speed_count++;
		if(this.speed_count>this.speed)
			this.speed_count=1;
		else
			return;
		this.move_pos+=this.direction*1;
		if(this.direction==-1 && this.move_pos<=this.move_space)
			this.move_pos=-1;
		if(this.direction==1 && this.move_pos>=-1)
			this.move_pos=-this.element_width;
		this.element_move.setStyle({left:this.move_pos+"px"});
	}
});