var keywordThumb = '';
keywordThumb += '<p><img src="{imgUrl}" width="132" height="68" alt=""><strong>{keyword}</strong>';
keywordThumb += '<span class="fs11 em">{count}장</span>';
keywordThumb += '</p>';
var showKeywordThumb = function(obj, imgUrl, keyword, count) {
	if(!pageLoaded && UI.getBrowser().ie_ver==6) {return false;}
	var pos = UI.getPosition(obj);
	if(!UI.$('keywordThumb')) {
		var oSPAN = $C('span');
		oSPAN.id = "keywordThumb";
		oSPAN.className = "keywordThumb";
		oSPAN.style.background = "url(http://img-contents.daum-img.net/movie/2008_home/photo/bg_tooltip_box2.gif) no-repeat 0 0";
	} else {
		var oSPAN = UI.$('keywordThumb');
	};
	var html = keywordThumb;
	html = html.replace('{imgUrl}', imgUrl);
	html = html.replace('{keyword}', keyword);
	html = html.replace('{count}', count);
	oSPAN.innerHTML = html;
	oSPAN.style.top = pos.y-8+'px';
	oSPAN.style.left = pos.x+obj.offsetWidth+10+'px';
	if(!UI.$('keywordThumb')) {
		document.body.appendChild(oSPAN);
	};
	oSPAN.style.display = 'none';
	UI.smoothToggle(oSPAN,200)
};
var hideKeywordThumb = function(obj) {
	var oSPAN = UI.$('keywordThumb');
	if(!!oSPAN) {
		oSPAN.parentNode.removeChild(oSPAN);
	};
};
var EzFinder = function(id, values) {
	this.id = id;
	this.URL = 'http://movie.daum.net/photo/collection/JSON/list.do';
	this.param = '';
	this.skipRender = false;
	this.loading = null;
	this.container = null;
	this.values = {
		categoryId : null,
		genreId : null,
		countryId : null,
		admissionId : null,
		startYear : null,
		endYear : null,
		order : null,
		photoPerPage : null,
		page : null
	};
	this.init();
};
EzFinder.prototype = {
	init : function() {
		//UI.$('photoList').innerHTML += '<span id="loading" style="display:block;position:absolute;z-index:2;left:8px;top:0;background-color:#229922;color:#fff;">로딩중...</span>';
		UI.$('photoList').innerHTML += '<img id="loading" src="http://img-contents.daum-img.net/movie/2008_home/photo/loading02.gif" width="87" height="84" style="display:block;position:absolute;z-index:2;left:8px;top:0;">';
		UI.$('sel_order').onchange = null;
		UI.$('sel_photoPerPage').onchange = null;
		UI.addEvent(UI.$('sel_order'), 'change', (function(that) {
			return function() {
				that.values.order = UI.$F('sel_order');
				that.setParam();
				that.send();
			};
		})(this));
		UI.addEvent(UI.$('sel_photoPerPage'), 'change', (function(that) {
			return function() {
				that.values.photoPerPage = UI.$F('sel_photoPerPage');
				that.setParam();
				that.send();
			};
		})(this));
		this.loading = UI.$('loading');
		this.container = UI.$('contPhotoList');
	},
	startLoading : function() {
		this.loading.style.display = 'block';
		UI.setOpacity(this.container, 30);
	},
	endLoading : function() {
		this.loading.style.display = 'none';
		UI.setOpacity(this.container, 100);
	},
	send : function() {
		UI.$(this.id).style.position = "relative";
		this.startLoading();
		var ajax = new UI.Ajax( { url:this.URL, param:this.param, onComplete:this.render.bind(this) } );
		window.unload = function() { return function() { ajax = null } };
	},
	setParam : function() {
		for(v in this.values) {
			if(v=='categoryId'){
				this.param = '';
			} else {
				this.param += '&';
			};
			this.param += (v + '=' + this.values[v]);
		}
		return this.param;
	},
	setValue : function(name, value) {
		this.values[name] = value;
		UI.$F(name);
		this.setParam();
	},
	setLabel : function(obj) {
		var child = obj.parentNode.childNodes;
		child = UI.cleanNode(child);
		for(i in child) {
			if(!!child[i].nodeName && child[i].nodeName.toLowerCase() == 'label') {
				child[i].className = '';
			};
		};
		obj.className = 'on';
		obj.checked = true;
	},
	render : function(req) {
		var items = eval('(' + req.responseText + ')');
		if(!this.skipRender) {
			this.values.page = 1;
			clickCheck('/photo/collection/list.do');
			var totalCount = items.totalCount;
			var imgs = items.imgs;
			UI.$('totalCount').innerHTML = totalCount;
			var html = '';
			for(img in imgs) {
				if(!!imgs[img].link) {
					html += '<span class="image"><a href="'+imgs[img].link+'" title="'+imgs[img].title+'"><img src="'+imgs[img].src+'" width="155" height="225" alt="'+imgs[img].title+'"><span>'+imgs[img].short_title+'('+imgs[img].year+')</span></a></span>';
				}
			};
			if(imgs.length > 0) {
				UI.$(this.id).innerHTML = html;
			} else {
				UI.$(this.id).innerHTML = '조건에 맞는 이미지가 없습니다.<br><br><br><br><br><br><br><br><br><br><br>';
			}
		}
		this.skipRender = false;
		this.renderPagination(items.pagination);
		this.endLoading();
	},
	renderPagination : function(pagination) {
		var oDiv = $C('div');
		oDiv.className = 'pagination';
		var p = pagination;
		var temp = this.values.page;
		var oA = $C('a');
		if(!!p.prevPage) {
			oA = $C('a');
			this.values.page = p.prevPage[1];
			oA.href = 'http://' + location.host + location.pathname + '?' + this.setParam();
			oA.className = 'text';
			oA.innerHTML = '<span class="symbol">&lt; </span>'+p.prevPage[0]+' ~ '+p.prevPage[1];
			oA.onclick = (function(obj, p) {
				return function(event) {
					obj.values.page = p;
					obj.setParam();
					obj.send();
					UI.stopEvent(event);
				}
			})(this, p.prevPage[1]);
			oDiv.appendChild(oA);
		};
		if(!!p.pageSet) {
			for(i in p.pageSet) {
				if(!!p.pageSet[i][0]) {
					if(p.pageSet[i][1]==1) {
						oSpan = $C('span');
						oSpan.className = 'current';
						oSpan.innerHTML = p.pageSet[i][0];
						oDiv.appendChild(oSpan);
					} else {
						oA = $C('a');
						oA.innerHTML = p.pageSet[i][0];
						this.values.page = p.pageSet[i][0];
						oA.href = 'http://' + location.host + location.pathname + '?' + this.setParam();
						oA.onclick = (function(obj, p) {
							return function(event) {
								obj.values.page = p;
								obj.setParam();
								obj.send();
								location.href = "#";
								UI.stopEvent(event);
							}
						})(this, p.pageSet[i][0]);
						oDiv.appendChild(oA);
					}
				}
			}
		};
		if(!!p.nextPage) {
			oA = $C('a');
			this.values.page = p.nextPage[0];
			oA.href = 'http://' + location.host + location.pathname + '?' + this.setParam();
			oA.className = 'text';
			oA.innerHTML = p.nextPage[0]+' ~ '+p.nextPage[1]+' <span class="symbol"> &gt;</span></a>';
			oA.onclick = (function(obj, p) {
				return function(event) {
					obj.values.page = p;
					obj.setParam();
					obj.send();
					UI.stopEvent(event);
				}
			})(this, p.nextPage[0]);
			oDiv.appendChild(oA);
		};
		this.values.page = temp;
		this.setParam();
		UI.$('paginationWrap').innerHTML = '';
		UI.$('paginationWrap').appendChild(oDiv);
	},
	reset : function(obj) {
		slider.reset();
		var labels = obj.parentNode.getElementsByTagName('label');
		for(i in labels) {
			if(!!labels[i].nodeName && labels[i].nodeName.toLowerCase() == 'label') {
				if(labels[i].htmlFor.indexOf('all') > 0) {
					labels[i].className = 'on';
					labels[i].checked = true;
				} else {
					labels[i].className = '';
				};
			};
		};
		this.values.genreId = -1;
		this.values.countryId = '';
		this.values.admissionId = '';
		this.values.page = 1;
		this.setParam();
		this.send();
	}
};
var ezSelector = function( _prefix ) {
	var prefix = _prefix;
	var cont_depth1 = UI.$(prefix+'_depth1');
	var cont_depth2 = UI.$(prefix+'_depth2');
	var data = {
			keywordType : null,
			key : null,
			keywordId : null,
			keySet : null
	};
	var member = {
		reset : function() {
			cont_depth1.innerHTML = '';
			cont_depth2.innerHTML = '';
		},
		setData : function( _data ) {
			Object.extend(data, _data);
		},
		getData : function() {
			return data;
		},
		clickKeywordType : function(type) {
			member.setData({keywordType:type});
			member.setKey(type);
			UI.$(prefix+'_btn_theme').className = '';
			UI.$(prefix+'_btn_alpha').className = '';
			UI.$(prefix+'_btn_'+type).className = 'on';
		},
		setKey : function(type) {
			var container = cont_depth1;
			var oLi = $C('li');
			var oA = $C('a');
			container.innerHTML = '';
			for(key in data.keySet[data.keywordType]) {
				if(!!key) {
					oLi = $C('li');
					oA = $C('a');
					oA.innerHTML = key;
					oA.href = 'javascript:;'
					UI.addEvent(oA, 'click', function(member, key) { return function() { member.clickKey(key); } }(member, key));
					oLi.appendChild(oA);
					container.appendChild(oLi);
				};
			};
		},
		clickKey : function(key) {
			member.setData({key:key})
			member.setKeyword(key);
			var arr_key = cont_depth1.getElementsByTagName('a');
			for(i in arr_key) {
				if(!!arr_key[i].innerHTML) {
					if(UI.trim(arr_key[i].innerHTML) == UI.trim(key)) {
						arr_key[i].className = 'on';
					} else {
						arr_key[i].className = '';
					}
				}
			}
		},
		setKeyword : function(key) {
			var container = cont_depth2;
			var oLi = $C('li');
			var oA = $C('a');
			var keywords = data.keySet[data.keywordType][key];
			container.innerHTML = '';
			for(keyword in keywords) {
				if(!!keywords[keyword].keyword) {
					oLi = $C('li');
					oA = $C('a');
					oA.innerHTML = keywords[keyword].keyword + '(' + keywords[keyword].photoCount + ')';
					oA.href = 'javascript:;'
					if(keywords[keyword].on) {
						UI.addClassName(oA, 'on')
					};
					UI.addEvent(oA, 'click', function(member, keyword) { return function() { member.clickKeyword(keyword); return false; } }(member, keywords[keyword]));
					oLi.appendChild(oA);
					container.appendChild(oLi);
				};
			};
		},
		clickKeyword : function(keyword) {
			member.setData({keywordId:keyword.id});
			var arr_key = cont_depth2.getElementsByTagName('a');
			for(i in arr_key) {
				if(!!arr_key[i].innerHTML) {
					if(UI.trim(arr_key[i].innerHTML) == UI.trim(keyword.keyword)) {
						arr_key[i].className = 'on';
					} else {
						arr_key[i].className = '';
					}
				}
			}
			member.submit();
		},
		submit : function() {
			location.href = '?keywordId=' + data.keywordId + '&keywordType=' + data.keywordType;
		},
		init : function() {
			UI.addEvent(UI.$(prefix+'_btn_theme'), 'click', function(member) { return function() { member.clickKeywordType('theme'); } }(member));
			UI.addEvent(UI.$(prefix+'_btn_alpha'), 'click', function(member) { return function() { member.clickKeywordType('alpha'); } }(member));
			UI.addEvent(UI.$(prefix+'_btn_submit'), 'click', function(member) { return function() { member.submit(); } }(member));
			member.clickKeywordType(data.keywordType);
			member.clickKey(data.key);
			member.setData({keywordId:data.keywordId});
		}
	};
	return member;
};

daum.widget = {};
daum.widget.slider = function( _id ) {
	var objEle = daum.$( _id );
	var eleInfo = {
		width : objEle.offsetWidth,
		height : objEle.offsetHeight
	};

	var scope = {
		x : { start : null, end : null, init : 0 },
		y : { start : null, end : null, init : 0 }
	};

	var onMouseUp = null;
	var onMouseDown = null;
	var onMouseMove = null;

	var deltaX, deltaY;
	var origX, origY;

	var that = {
		getScope : function(){
			return scope;
		},
		setScopeX : function( pos ){
			daum.extend( scope.x, pos );
			return that;
		},
		getScopeX : function(){
			return scope.x;
		},
		setScopeY : function( pos ){
			daum.extend( scope.y, pos );
			return that;
		},
		getScopeY : function(){
			return scope.y;
		},
		getPos : function(){
			return {
				left : objEle.offsetLeft,
				top : objEle.offsetTop
			};
		},
		setPosX : function( pos ){
			daum.Element.setLeft( objEle, pos );
		},
		setPosY : function( pos ){
			daum.Element.setTop( objEle, pos );
		},
		getElementInfo : function(){
			return eleInfo;
		},
		dummyHandler : function( _event ){
			return false;
		},
		downHandler : function( _event ){
		    var startX = _event.clientX, startY = _event.clientY;
			origX = objEle.offsetLeft;
			origY = objEle.offsetTop;

			deltaX = startX - origX;
			deltaY = startY - origY;

			daum.Event.addEvent(document,"mousemove",that.moveHandler, true);
			daum.Event.addEvent(document,"mouseup",that.upHandler, true);
			daum.Event.addEvent(document,"selectstart",that.dummyHandler, true);

			if( onMouseDown && typeof onMouseDown == "function" ){
				onMouseDown.call();
			}

			daum.Event.stopEvent( _event );
			daum.Event.preventDefault( _event );

		},
		clickHandler : function( e ){
			daum.Event.stopEvent(e);
			daum.Event.preventDefault( e );
		},
		moveHandler : function( e ){
			var x;
			if( scope.x.start != null ){
				x = e.clientX - deltaX;

				if( x < scope.x.start ){
					x = scope.x.start;
				} else if( x > scope.x.end ){
					x = scope.x.end;
				}
			} else {
				x = origX;
			}

			var y;
			if( scope.y.start != null ){
				y = e.clientY - deltaY;
				if( y < scope.y.start ){
					y = scope.y.start;
				}
				if( y > scope.y.end ){
					y = scope.y.end;
				}
			} else {
				y = origY;
			}

			daum.Element.setPosition( objEle, x, y );

			if( onMouseMove && typeof onMouseMove == "function" ){
				onMouseMove.call();
			}

			daum.Event.stopEvent(e);
			daum.Event.preventDefault( e );

		},
		upHandler : function( e ){
			daum.Event.removeEvent(document,"mousemove",that.moveHandler, true);
	        daum.Event.removeEvent(document,"mouseup",that.upHandler, true);
			daum.Event.removeEvent(document,"selectstart",that.dummyHandler, true);
			if( onMouseUp && typeof onMouseUp == "function" ){
				onMouseUp.call();
			}
			daum.Event.stopEvent(e);
			daum.Event.preventDefault(e);
		},
		addEventListener : function( obj ){
			switch( obj.type ){
			case "onMouseUp":
				onMouseUp = obj.func;
				break;
			case "onMouseDown":
				onMouseDown = obj.func;
				break;
			case "onMouseMove":
				onMouseMove = obj.func;
				break;
			}
			return that;
		},
		destroy : function(){
			daum.Event.removeEvent(objEle,"mousedown",that.downHandler, true);
			daum.Event.removeEvent(objEle,"click",that.clockHandler, true);
		},
		setup : function(){
			daum.Event.addEvent(objEle,"mousedown",that.downHandler, true);
			daum.Event.addEvent(objEle,"click",that.clickHandler, true);
		},
		run : function(){
			objEle.style.position = "absolute";
			daum.Element.setPosition( objEle, scope.x.init, scope.y.init );
			that.setup();
		}
	};
	return that;
};