// JavaScript Document

(function($){
	$.fn.kefMenu=function(setting){
		var setting=$.extend(true,{},setting);
		var popmenu,container,levelList,overflow;
		
		var level1,lev2Width,lev2Height,lev3Width,lev3Height,caption;
		var level2Container,level3Container,captionContainer;
		var showing;
		
		var tab; //determine tab
		var tablist;
		var tabTop;
		var tabTopWidth,tabTopHeight;
		
		var bg={}; //Control BG;
		var level3line=$('<div class="line"></div>')[0];
		var captionline=$('<div class="line"></div>')[0];
		
		var
		
		//Resize Animation
		resize=function(w,h){
			$(levelList).stop(true,true).animate({width:w,height:h},0);
			$(container).stop(true,true).animate({width:w,height:h},500,function(){$(this).css('overflow','visible')}).css('overflow','visible');
			$(overflow).stop(true,true).animate({width:w,height:h},500);
			$(popmenu).stop(true,true).animate({width:w+14,height:h+11},500);
		},
		//Reset All Dimension
		resetSize=function(){
			$(levelList).stop(true,true).css({width:'auto',height:'auto'});
			$(container).stop(true,true).css({width:'auto',height:'auto'});
			$(overflow).stop(true,true).css({width:'auto',height:'auto'});
			$(popmenu).stop(true,true).css({width:'auto',height:'auto'});
			$(level2Container).css({width:0,height:0});			
			$(level3Container).css({width:0,height:0});
			$(captionContainer).css({width:0,height:0});
		},
		
		//Auto Resize Container accodering to contents
		autoResize=function(){
			width=$(level2Container).width()+$(level3Container).width()+$(captionContainer).width();
			height=Math.max($(level2Container).height(),$(level3Container).height(),$(captionContainer).height());
			$([level2Container,level3Container,captionContainer]).css('height',height);
			
			if(tab){
				width=Math.max(tabTopWidth,width);
				height+=tabTopHeight;
			}
			//Fix All Container to same hight
			
			resize(width,height);
			
			//console.log('Resize Width:'+ width +', Resize Height:'+height);
		},
		
		calculateDimension=function(container,content){
			$(container).css({width:1000,height:0});
			return {'w':$(content).width()+10,'h':$(content).height()+11};
		},
		
		registerTab=function(){
			$('a',tablist).each(function(){
				$(this).click(function(){
					targetIdx=$(this).closest('li').index();
					$('.tab.showing',level2Container).removeClass('showing');
					target=$('.tab',level2Container).eq(targetIdx).addClass('showing');
					
					dimension=calculateDimension(level2Container,target);
					$(level2Container).css({width:dimension.w,height:dimension.h});
					$(level3Container).empty().css({width:0,height:0});
					$(captionContainer).empty().css({width:0,height:0});
					autoResize();
				})
			})
		};
		
		//init
		$('body').append(
			popmenu=$('<div class="kefMainMenu"></div>').append(
				container=$('<div class="menuContainer"></div>').append(
					overflow=$('<div class="overflow"></div>').append(
						levelList=$('<div class="levelList"></div>').append(
							level2Container=$('<div class="level2Container"></div>')[0],
							level3Container=$('<div class="level3Container"></div>')[0],
							captionContainer=$('<div class="captionContainer"></div>')[0]
						)[0]
					)[0],
					bg.left=$('<div class="bg left"></div>')[0],
					bg.right=$('<div class="bg right"></div>')[0],
					bg.bottomLeft=$('<div class="bg bottom-left"></div>')[0],
					bg.bottom=$('<div class="bg bottom"></div>')[0],
					bg.bottomRight=$('<div class="bg bottom-right"></div>')[0]
				)[0]
			)[0]
		)
		
		//Resize border image
		resizeBorder=function(w,h,t){
			//$(bg.bottom).animate({'width':w-14},t);
			//$([bg.left,bg.right]).animate({'height':h},t);
		}
		
		//Show Popup Menu
		popmenu.show=function(callback){
			$(this).stop(true,true).show(0,function(){
				if(callback!=null)
					callback();
			});
		}
		//Hide Popup Menu
		popmenu.hide=function(callback){
			$(this).stop(true,true).hide(0);
		}
		//Relocating Popup Menu
		popmenu.move=function(x,y){
			$(this).stop(true,true).animate({left:x,top:y},0);
		}
		//Level 1
		level1=$('li',this).not('li ul li').has('ul').each(function(){		   
			$(this).mouseenter(function(){
				resetSize();
				$(tabTop).remove();
				$(level2Container).empty();
				$(level3Container).empty();
				$(captionContainer).empty();
				
				popmenu.show();
				popmenu.move($(this).offset().left,$(this).offset().top+$(this).height());
				
				tab=$('.tablist',this).length>0;
				if(tab){
					$(levelList).prepend(
						tabTop=$('<div class="tabTop"></div>').append(
										tablist=$('.tablist',this).clone()
						)[0]
					);
					tabTopWidth=$(tablist).width();
					tabTopHeight=$('li',tablist).height();
					
					registerTab();
					$(level2Container).append(level2=$('.level2',this).clone());
					showing=$(level2).eq(0).addClass('showing').show();
					
					dimension=calculateDimension(level2Container,showing);
				}else{
					$(level2Container).append(level2=$('.level2',this).clone().show());
					
					dimension=calculateDimension(level2Container,level2);
				}
				
				$(level2Container).css({width:dimension.w,height:dimension.h});
				autoResize();
				//templevel2=$(level2).map(function(index,elems){});
				
				//bind Level2
				$('li',level2).not('li ul li').each(function(){
					$(this).mouseenter(function(){
						if(tab){
							dimension=calculateDimension(level2Container,$('.tab.showing',level2Container));
						}else{
							dimension=calculateDimension(level2Container,level2);
						}
						$(level2Container).css({width:dimension.w,height:dimension.h});
						
						$(level3Container).empty().css({width:0,height:0});
						$(captionContainer).empty().css({width:0,height:0});
						
						level3=$('.level3',this).clone();
						caption=$('.caption',this).not('.level3 .caption').clone();
						if(level3.length==0&&caption.length==0){
							autoResize();
							return true;  //Break when no any level3 element and caption.
						}
						if(caption.length!=0){
							$(captionContainer).empty().css({width:0,height:0});
							caption=$('.caption',this).clone();
							
							if(caption.length==0){
								autoResize();
								return true;  //Break when no any level3 element.
							}
							$(captionContainer).append(captionline);
							$(captionContainer).append(caption);
							
							$(captionContainer).css({width:$(captionline).width()+$(caption).width(),height:$(caption).height()});
							
							autoResize();
							return true;
						}
						
						$(level3Container).append(level3line);
						$(level3Container).append(level3);
						
						dimension=calculateDimension(level3Container,level3);
						$(level3Container).css({width:$(level3line).width()+dimension.w,height:dimension.h});
						
						autoResize();
						
						//bind Level3
						$('li',level3).each(function(){
							$(this).mouseenter(function(){
								$(captionContainer).empty().css({width:0,height:0});
								caption=$('.caption',this).clone();
								
								if(caption.length==0||$('.level4 .caption',this).length!=0){
									autoResize();
									return true;  //Break when no any level3 element.
								}
								$(captionContainer).append(captionline);
								$(captionContainer).append(caption);
								
								$(captionContainer).css({width:$(captionline).width()+$(caption).width(),height:$(caption).height()});
								
								autoResize();
							});//level3 mouse enter
						});//level3 each
						
						
					});//level2 mouse enter									
				});//level2 each
				
			});//level1 mouse enter
		});//level1 each
		
		// Setting class for detecting mouse focus
		$(popmenu).mouseenter(function(){
			$(this).addClass('hovering');
		});
		$(level1).mouseenter(function(){
			$(this).addClass('hovering');
		});
		$(popmenu).mouseleave(function(){
			$(this).removeClass('hovering');
		});
		$(level1).mouseleave(function(){
			$(this).removeClass('hovering');
		});
		
		// Detecting mouse
		$(level1).mouseleave(function(){
			setTimeout(function(){
				//console.log('popmenu : '+$(popmenu).hasClass('hovering'));		
				//console.log('level1 : '+$(level1).hasClass('hovering'));	
				if(!$(popmenu).hasClass('hovering')&&!$(level1).hasClass('hovering')){
					resetSize();
					popmenu.hide();
				}
			},0)
		})
		$(popmenu).mouseleave(function(){
			setTimeout(function(){
				//console.log('popmenu : '+$(popmenu).hasClass('hovering'));		
				//console.log('level1 : '+$(level1).hasClass('hovering'));	
				if(!$(popmenu).hasClass('hovering')&&!$(level1).hasClass('hovering')){
					resetSize();
					popmenu.hide();
				}
			},0)
		})
		
		
	}
})(jQuery);



/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * **
 * Api		$(list).kefImgSlider({xxx:xxx,xxx:xxx})													*
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * **
 * option   	|   Default Value			|	Description											*
 * dimension	|	width,height:current	|	Can customize viewport size							*
 * loop			|	true					|	Set looping image									*
 * intervalTime	|	5000					|	Set the duration for showing single image			*
 * speed		|	1000					|	Animation Time of Transaction take					*
 * transaction	|	'fade'					|	Can setup difference Effect.						*
 * 				|							|	'fade'	:crossfade effect							*
 * 				|							|	'slide' :slide effect								*
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * **/

(function($){
	$.fn.kefImgSlider=function(setting){
		var container,imgHolder,dots,active,prev,next,original=this,showing,target;
		var interval,semaphone=true,
		
		nextSlide=function(){
			if(semaphone){
				if(setting.loop){
					target=$(showing).next().length>0?$(showing).next():$('.item:first',imgHolder);
				}else{
					target=$(showing).next().length>0?$(showing).next():showing;
				}
				$(showing).removeClass('showing');
				target.addClass('showing');
				
				transactionAnimate();
				updateDots();
				showing=target;
			}
		},
		
		prevSlide=function(){
			if(semaphone){
				if(setting.loop){
					target=$(showing).prev().length>0?$(showing).prev():$('.item:last',imgHolder);
				}else{
					target=$(showing).prev().length>0?$(showing).prev():showing;
				}
				$(showing).removeClass('showing');
				target.addClass('showing');
				
				transactionAnimate();
				updateDots();
				showing=target;
			}
		},
		
		toIndex=function(idx){
			if(semaphone){
				target=$('.item',imgHolder).eq(idx);
				
				$(showing).removeClass('showing');
				target.addClass('showing');
				
				transactionAnimate();
				updateDots();
				showing=target;
			}
		},
		
		transactionAnimate=function(){
			semaphone=false;
			switch (setting.transaction){
				case 'slide':
					pos=positionCheck();
					$(imgHolder).stop(true,false).animate({'margin-left':pos.x,'margin-top':pos.y},setting.speed,function(){semaphone=true;});
					break;
				case 'fade':
					$(target).animate({opacity:0},0).css('z-index',1300);
					$(showing).css('z-index',1200);
					
					temp=showing;
					$(target).stop(true,false).animate({opacity:1},setting.speed,function(){semaphone=true;$(temp).animate({opacity:0},0).css('z-index','')});
					
					
					break;
			}
		},
		
		positionCheck=function(){
			return {x:$(target).index()*-setting.dimension.width,y:0};
		},
		
		resetInterval=function(){
			clearInterval(interval);
			interval=setInterval(nextSlide,setting.intervalTime);
		},
		
		updateDots=function(){
			$('a',dots).removeClass('active').eq($(target).index()).addClass('active');
		};
		
		
		//Hide Original Element
		$(original).hide(0);
		
		//init
		$(original).after(
			container=$('<div class="img-slider"></div>').append(
				imgHolder=$('<div class="img-holder"></div>')[0],
				dots=$('<div class="dots"></div>')[0],
				prev=$('<a class="prev" href="#"></a>')[0],
				next=$('<a class="next" href="#"></a>')[0]
			)[0]
		)
		//Basic Setting
		var setting=$.extend(true,{
			dimension:{width:$(container).width(),height:$(container).height()},
			loop:true,
			intervalTime:5000,
			speed:1000,
			transaction:'fade'
		},setting);
		
		//re-create plug-in own component 
		$('li',original).each(function(){
			switch (setting.transaction){
				case 'slide':
					$(imgHolder).addClass('slide');
					$(imgHolder).append('<div class="item" style="float:left;">'+$(this).html()+'</div>');
					break;
				case 'fade':
					$(imgHolder).addClass('fade');
					$(imgHolder).append('<div class="item" style="position:absolute;top:0;left:0;">'+$(this).html()+'</div>');
					break;
			}
			$(dots).append('<a href="#"></a>');
		});
		
		//Setting according to received data
		var setting=$.extend(true,{
			noOfFrame:$('.item',imgHolder).length
		},setting);
		
		$(imgHolder).css({width:setting.dimension.width*setting.noOfFrame,height:setting.dimension.height});
		showing=target=$('.item:eq(0)',imgHolder).addClass('showing');
		
		
		
		resetInterval();
		updateDots();
		$(next).click(function(e){
			e.preventDefault();
			nextSlide();
			resetInterval();
		});
		$(prev).click(function(e){
			e.preventDefault();
			prevSlide();
			resetInterval();
		});
		$('a',dots).click(function(e){
			e.preventDefault();
			toIndex($(this).index());
			resetInterval();
		})
	}
})(jQuery);




/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 *
 *
 *
 *
 *
 *
 *
 *
 */
(function($){
	$.fn.kefNewsRoller=function(setting){
		var container,dots,news,title,original=this,showing,target,interval,
		
		
		//Go to Specified News
		toIndex=function(idx){
			target=$('li',news).eq(idx);
			
			$(showing).removeClass('showing');
			target.addClass('showing');
			
			changeNews();
			updateDots();
			showing=target;
		},
		
		nextNews=function(){
			target=$(showing).next().length>0?$(showing).next():$('li:first',news);
			$(showing).removeClass('showing');
			target.addClass('showing');
			
			changeNews();
			updateDots();
			showing=target;
		},
		
		//Update current indicator
		updateDots=function(){
			$('a',dots).removeClass('active').eq($(target).index()).addClass('active');
		},
		
		//News transit animation
		changeNews=function(){
			$(showing).stop(true,true).fadeOut(500);
			$(target).stop(true,true).delay(500).fadeIn(500);
		},
		
		resetInterval=function(){
			clearInterval(interval);
			interval=setInterval(nextNews,setting.intervalTime);
		};
		
		var setting=$.extend(true,{
			noOfNews:$('li',original).length,
			title:$('#lang_kef_news').val(),
			intervalTime:5000,
			speed:1000
		},setting);
		
		//Hide Original Element
		$(original).hide(0);
		
		//init
		$(original).after(
			container=$('<div class="news-container"></div>').append(
				title=$('<div class="title"></div>')[0],
				news=$('<ul class="news"></ul>')[0],
				dots=$('<div class="dots"></div>')[0]
			)[0]
		)
		$(title).html(setting.title+':');
		
		for(newCounter=0;newCounter<setting.noOfNews;newCounter++){
			$(news).append($('li',original).eq(newCounter).clone());
			$(dots).append('<a href="#"></a>');
		}
		//Highlight
		showing=target=$('li:first',news).addClass('showing').css('display','block');
		
		resetInterval();
		updateDots();
		
		$('a',dots).click(function(e){
			e.preventDefault();
			toIndex($(this).index());
			resetInterval();
		})
	}
})(jQuery);



(function($){
	$.fn.kefGallery=function(option){
		var appleDetection=navigator.userAgent.toLowerCase().match(/(iphone|ipod|ipad)/);
		var container,prev,next,viewport,navigation,original=this,listContainer,list,semophone=true,
		singleWidth,totalWidth,length,listLength=0,
		imagesList,videosList,tabList,imageBtn,videoBtn,
		preload=$('<div class="preload"></div>'),
		preImage,currentImage,
		
		changeImg=function(href){
			currentImage=$('img',viewport);
			preImage=$('<img class="preloadImage" src="'+href+'" />')
			$(viewport).prepend(preImage[0]);
			
			preImage.load(function(){
				imgAnimation();
			})
		},
		imgAnimation=function(){
			$(currentImage).stop(true,true).fadeOut(500,function(){
				$(this).remove();
				$(preImage).removeClass('preloadImage');
			});
		},
		
		changeImage=function(el){
			changeImg($(el).attr('href'));
			//$(viewport).html('<img src="'+$(el).attr('href')+'" />');
		},
		
		changeVideo=function(el){
			path=$(el).attr('href');
			if(path.match(/\/\//)){
				//absolute path
				key=path;
			}else{
				key=document.location.protocol+"//"+document.location.host+path;
			}
			
			if(!appleDetection){
				$(viewport).html(
					  "<object width='"+option.viewport.width+"' height='"+option.viewport.height+"' id='StrobeMediaPlayback' name='StrobeMediaPlayback' type='application/x-shockwave-flash' classid='clsid:d27cdb6e-ae6d-11cf-96b8-444553540000'>"+
						  "<param name='movie' value='"+option.pluginPath+"StrobeMediaPlayback.swf' /> "+
						  "<param name='quality' value='high' /> "+
						  "<param name='allowScriptAccess' value='always' /> "+
						  "<param name='bgcolor' value='#000000' /> "+
						  "<param name='allowfullscreen' value='true' /> "+
						  "<param name='flashvars' value= '&src="+key+"&autoHideControlBar=true&streamType=recorded&autoPlay=true'/>"+
						  "<embed src='"+option.pluginPath+"StrobeMediaPlayback.swf' width='"+option.viewport.width+"' height='"+option.viewport.height+"' id='StrobeMediaPlayback' quality='high' allowScriptAccess='always' bgcolor='#000000' name='StrobeMediaPlayback' allowfullscreen='true' pluginspage='http://www.adobe.com/go/getflashplayer'   flashvars='&src="+key+"&autoHideControlBar=true&streamType=recorded&autoPlay=true' type='application/x-shockwave-flash'> </embed>"+
					  "</object>"
				);
				
				return false;
			}else{
				$(viewport).html( 
						videoPlugin=$(
							'<video src="'+key+'" width="'+option.viewport.width+'" height="'+option.viewport.height+'" controls preload="none"></video>')[0]				   
				);
				tvc = $(videoPlugin).mediaelementplayer({
					//Shows Debugs
					enablePluginDebug: false,
					// remove or reorder to change plugin priority
					plugins: ['flash'],
					// path to Flash and Silverlight plugins
					pluginPath: '/plugin/',
					// name of flash file
					flashName: 'flashmediaelement.swf',
					features: ['playpause','progress','current','duration','tracks','volume'],
					success: function (mediaElement, domObject) {
						mediaElement.addEventListener('canplay', function(e) {
							setTimeout(function(){
								mediaElement.play();
							},2000);
						}, false);
						mediaElement.play();
						setTimeout(function(){
							mediaElement.play();
						},2000);
					}
				 });
			}
		},
		
		calculation=function(){
			itemWidth=$('li',list).width();
			length=$('li',list).length<option.itemOfPage?$('li',list).length:option.itemOfPage;
			singleWidth=$(listContainer).width()/length;
			gapWidth=singleWidth-itemWidth;
			totalWidth=$('li',list).length*singleWidth;
			
			$('li',list).css({'margin-left':gapWidth/2,'margin-right':gapWidth/2})
			$(list).css({'width':totalWidth});
		},
		nextPage=function(){
			//Navigation bar moving from right to left
			marginLeft=parseInt($(list).css('margin-left'));
			if(marginLeft+singleWidth*$('li',list).length-(singleWidth*option.itemOfPage)>0&&$('li',list).length>option.itemOfPage){
				if(semophone){
					semophone=false;
					animation({'margin-left':'-='+singleWidth*length});
				}
			}
		},
		prevPage=function(){
			//Navigation bar moving from left to right
			marginLeft=parseInt($(list).css('margin-left'));
			if(marginLeft+singleWidth*length<=0){
				if(semophone){
					semophone=false;
					animation({'margin-left':'+='+singleWidth*length});
				}
			}
		},
		animation=function(param){
			$(list).animate(param,500,openSemophone);
		},
		openSemophone=function(){
			semophone=true;	
		},
		changeList=function(targetList,typeFunction){
			$(list).html(targetList.clone()).css('margin-left',0);
			$(viewport).empty();
			
			//Bind Event
			$('li a',list).unbind('click').click(function(e){
				e.preventDefault();
				$('li a',list).removeClass('active');
				$(this).addClass('active');
				
				typeFunction(this);
			})
			$(next).unbind('click').click(function(e){
				e.preventDefault();
				nextPage();
			})
			$(prev).unbind('click').click(function(e){
				e.preventDefault();
				prevPage();
			})
			
			calculation();
			$('li:eq(0) a',list).trigger('click');
		}
		
		
		//init
		$(original).hide(0);
		$(original).after(
			container=$('<div class="mediaGallery"></div>').append(
				viewport=$('<div class="viewport"></div>')[0],
				navigation=$('<div class="gallery-nav"></div>').append(
					prev=$('<a class="prev" href="javascript:;"></a>')[0],
					next=$('<a class="next" href="javascript:;"></a>')[0],
					listContainer=$('<div class="item-list">').append(
						list=$('<ul></ul>')[0]
					)[0]
				)[0],
				preload
			)[0]
		)
		
		option=$.extend(true,{
			/* Default Setting */
			itemOfPage:5,
			label:{
				images:$('#series_lang_images').val(),
				video:$('#series_lang_video').val()
			},
			viewport:{
				width:$(viewport).width(),
				height:$(viewport).height()
			},
			pluginPath:'/flash/'
		},option)
		
		//Copying data from orginal list and counting.
		listLength+=(imagesList=$('.images li',original)).length!=0?1:0;
		listLength+=(videosList=$('.videos li',original)).length!=0?1:0;
		
		//Video list checking and binding switch list function.
		if(listLength>1){
			$(navigation).before(
				tabList=$('<div class="tabList"></div>').append(
					imageBtn=$('<a href="javascript:;">'+option.label.images+'</a>')[0],
					videoBtn=$('<a href="javascript:;">'+option.label.video+'</a>')[0]
				)[0]														   
			);
			$(imageBtn).click(function(e){
				e.preventDefault();
				changeList(imagesList,changeImage);
			})
			
			$(videoBtn).click(function(e){
				e.preventDefault();
				changeList(videosList,changeVideo);
			})
			
			$('a',tabList).click(function(){
				$('a',tabList).removeClass('current');
				$(this).addClass('current');
			})
			
			//Bind Event
			$('a:first',tabList).trigger('click');
			$('a:last-child',tabList).addClass('last-child');
			
		}else{
			//Single List Setup
			if($(videosList).length!=0)
				changeList(videosList,changeVideo);
			else if($(imagesList).length!=0)
				changeList(imagesList,changeImage);
		}
		
	}	  
})(jQuery);

(function($){
	$.fn.popVideo=function(option){
		var appleDetection=navigator.userAgent.toLowerCase().match(/(iphone|ipod|ipad)/);
		
		option=$.extend(true,{
			width:852,
			height:508,
			pluginPath:'/flash/'
		},option)
		
		
		var playFlash=function(key){
			$.fancybox({
				'content':"<object width='"+option.width+"' height='"+option.height+"' id='StrobeMediaPlayback' name='StrobeMediaPlayback' type='application/x-shockwave-flash' classid='clsid:d27cdb6e-ae6d-11cf-96b8-444553540000'>"+
						  "<param name='movie' value='"+option.pluginPath+"StrobeMediaPlayback.swf' /> "+
						  "<param name='quality' value='high' /> "+
						  "<param name='allowScriptAccess' value='always' /> "+
						  "<param name='bgcolor' value='#000000' /> "+
						  "<param name='allowfullscreen' value='true' /> "+
						  "<param name='flashvars' value= '&src="+key+"&autoHideControlBar=true&streamType=recorded&autoPlay=true'/>"+
						  "<embed src='"+option.pluginPath+"StrobeMediaPlayback.swf' width='"+option.width+"' height='"+option.height+"' id='StrobeMediaPlayback' quality='high' allowScriptAccess='always' bgcolor='#000000' name='StrobeMediaPlayback' allowfullscreen='true' pluginspage='http://www.adobe.com/go/getflashplayer'   flashvars='&src="+key+"&autoHideControlBar=true&streamType=recorded&autoPlay=true' type='application/x-shockwave-flash'> </embed>"+
					  "</object>"
			
			})
		}
		
		var playHTML5=function(key){
			videoPlugin=$('<video src="'+key+'" width="'+option.width+'" height="'+option.height+'" controls preload="auto"></video>')[0]
			$.fancybox({
				'width': option.width,
				'height' : option.height,
				'content':'<div id="popVideo" style="width:'+option.width+'px;height:'+option.height+'px;"></div>',
				'onComplete':function(){
					$('#popVideo').html(videoPlugin);
					/*
						tvc = $(videoPlugin).mediaelementplayer({
						//Shows Debugs
						enablePluginDebug: false,
						// remove or reorder to change plugin priority
						// path to Flash and Silverlight plugins
						pluginPath: '/plugin/',
						// name of flash file
						features: ['playpause','progress','current','duration','tracks','volume'],
						success: function (mediaElement, domObject) {
							mediaElement.addEventListener('canplay', function(e) {
								setTimeout(function(){
									mediaElement.play();
								},2000);
							}, false);
							mediaElement.play();
							setTimeout(function(){
								mediaElement.play();
							},2000);
						}
						
					 });*/
				}
			})
		}
		
		
		$(this).click(function(e){
			e.preventDefault();
			path=$(this).attr('href');
			if(path.match(/\/\//)){
				//absolute path
				key=path;
			}else{
				key=document.location.protocol+"//"+document.location.host+path;
			}
			
			if(appleDetection){
				playHTML5(key);
			}else{
				playFlash(key);
			}			   
		});
	}
})($);





(function($){
	$.fn.kefAccordionPane=function(option){
		var container,prev,next,viewport,navigation,original=this,listContainer,list,semophone=true,singleWidth,totalWidth
		
		option=$.extend(true,{
			onShow:function(el){$('span',el).html('-')},
			onHide:function(el){$('span',el).html('+')},
			showed:false
		},option),
		
		hide=function(el,time){
			option.onHide(el)
			$(el.next('div')).slideUp(time);
		},
		show=function(el,time){
			option.onShow(el)
			$(el.next('div')).slideDown(time);
		},
		showHide=function(el){
			if($(el).next('div').is(':visible')){
				hide(el,500);
			}else{
				show(el,500);
			}
		}
		
		//init
		return $(this).each(function(){
			if(option.showed){
				show($('h3',this),0);
			}else{
				hide($('h3',this),0);
			}
			$('h3',this).click(function(){
				showHide($(this));
			})
		})
	}	  
})(jQuery);





(function($){
	$.fn.colorChooser=function(){
		var target=$('#colorChooserViewport');
		var preload=$('<div class="preload"></div>');
		var image,current;
		
		//init
		$(target).append(preload);
		
		var changeImg=function(href){
			current=$('img',target);
			$(preload).load(href,function(response, status, xhr){
				if(status=='success'){
					$(target).prepend(image=$('<img class="preloadImage" src="'+href+'" />')[0]);
					animation();
				}
			})
		}
		
		var animation=function(){
			$(current).stop(true,true).fadeOut(500,function(){
				$(this).remove();
				$(image).removeClass('preloadImage');
			});
		}
		
		return $(this).each(function(){
			$(this).click(function(e){
				e.preventDefault();
				changeImg($(this).attr('href'));
				
				
			});
		})
	}
})(jQuery);




(function($){
	$.fn.kefProductSlider=function(option){
		var container,prev,next,original=this,listContainer,list,semophone=true,
		singleWidth,totalWidth,length,listLength=0,
		
		
		calculation=function(){
			totalWidth=$('li',list).length*singleWidth;
			$(list).css({'width':totalWidth});
		},
		nextPage=function(){
			//Navigation bar moving from right to left
			marginLeft=parseInt($(list).css('margin-left'));
			if(marginLeft+800>0&&$('li',list).length>option.itemOfPage){
				if(semophone){
					semophone=false;
					animation({'margin-left':'-='+800});
				}
			}
		},
		prevPage=function(){
			//Navigation bar moving from left to right
			marginLeft=parseInt($(list).css('margin-left'));
			if(marginLeft+800<=0){
				if(semophone){
					semophone=false;
					animation({'margin-left':'+='+800});
				}
			}
		},
		animation=function(param){
			$(list).animate(param,500,openSemophone);
		},
		openSemophone=function(){
			semophone=true;	
		}
		
		//init
		$(original).hide(0);
		$(original).after(
			container=$('<div class="productSlider"></div>').append(
				prev=$('<a class="prev" href="javascript:;"></a>')[0],
				next=$('<a class="next" href="javascript:;"></a>')[0],
				listContainer=$('<div class="item-list">').append(
					list=$('<ul></ul>')[0]
				)[0]
			)[0]
		)
		
		option=$.extend(true,{
			/* Default Setting */
			itemOfPage:5
		},option)
		
		
		$('li',original).each(function(){
			$(list).append(
				$('<li></li>').append(
					$('<div class="item"></div>').append(
						$(this).html()
					)[0]
				)[0]
			)
		})
		
		
		
		//Bind Event
		
		$(next).unbind('click').click(function(e){
			e.preventDefault();
			nextPage();
		})
		$(prev).unbind('click').click(function(e){
			e.preventDefault();
			prevPage();
		})
		
		calculation();
	}
})(jQuery);




(function($){
	$.fn.kefPageMenu=function(){
		var btn={};
		var container,list=$('ul',this),totalWidth=0,containerWidth,semophone=true;
		
		var calculation=function(){
			$('li',list).each(function(){
				totalWidth+=$(this).width()+1;
			})
			containerWidth=$(container).width();
			return totalWidth;
		},
		animation=function(param){
			$(list).animate(param,500,function(){
				semophone=true;
				checking();
			});
		},
		
		nextPage=function(){
			
			//Navigation bar moving from right to left
			if(semophone){
				semophone=false;
				marginLeft=parseInt($(list).css('margin-left'));
				
				param=(marginLeft*-1)+containerWidth*2<totalWidth?{'margin-left':'-='+containerWidth}:{'margin-left':(totalWidth-containerWidth)*-1};
				animation(param);
			}
		},
		prevPage=function(){
			
			//Navigation bar moving from left to right
			if(semophone){
				semophone=false;
				marginLeft=parseInt($(list).css('margin-left'));
				
				param=(marginLeft*-1)-containerWidth<0?{'margin-left':0}:{'margin-left':'+='+containerWidth};
				animation(param);
			}
		},
		checking=function(){
			marginLeft=parseInt($(list).css('margin-left'));
			
			if(marginLeft==0){
				$(btn.right).addClass('dim');
			}else{
				$(btn.right).removeClass('dim');
			}
				
			
			if((marginLeft*-1)+containerWidth==totalWidth){
				$(btn.left).addClass('dim');
			}else{
				$(btn.left).removeClass('dim');
			}
		}
		
		//init
		$(this).append(
			container=$('<div class="container"></div>').append(list)[0],
			btn.left=$('<a href="#" class="btnLeft btn disable"></a>')[0],
			btn.right=$('<a href="#" class="btnRight btn disable"></a>')[0]
		)
		
		calculation();
		
		//if width of all item is less than the container, stop function
		if(totalWidth<containerWidth){return this;}
		
		$(list).css({width:totalWidth});
		checking();
		//$([btn.left,btn.right]).addClass('dim');
		
		$(btn.left).click(function(e){
			e.preventDefault();
			if($(this).hasClass('dim')){
				prevPage();
			}
			
		});
		
		$(btn.right).click(function(e){
			e.preventDefault();
			if($(this).hasClass('dim')){
				nextPage();
			}
		});
	
	
	}
})(jQuery);






(function($) {
    $.fn.globalPopup = function() {
        var popup, container, closeBtn,prevBtn,nextBtn;

        popup = $('<div class="global-popup"></div>').append(
			container = $('<div class="container"></div>').append(
				$('<div class="ne corner"></div>')[0],
				$('<div class="nw corner"></div>')[0],
				$('<div class="se corner"></div>')[0],
				$('<div class="sw corner"></div>')[0],
				$('<div class="n corner"></div>')[0],
				$('<div class="e corner"></div>')[0],
				$('<div class="s corner"></div>')[0],
				$('<div class="w corner"></div>')[0]
			)[0]
		)[0]
        closeBtn = $('<a href="#" class="close"></a>')
        prevBtn = $('<a href="#" class="prev"></a>')
        nextBtn = $('<a href="#" class="next"></a>')


        var show = function(id) {
            //original code
            /*
            if ($('div[id^=' + id + ']').length != 0 && id != "") {
            content=$('div[id^='+id+']').clone().addClass('popup-content');
            $(container).append(markup(content));
            $('body').append(popup);
            $(popup).css({ 'top': $('.countryMenu').offset().top, 'left': $('.countryMenu').offset().left });

                $(popup).hide();
            $(popup).animate({ 'opacity': 0, 'left': '+=20' }, 0);
            $(popup).show();
            $(popup).animate({ 'opacity': 1, 'left': '-=20' }, 500);
            }
            */

            //update on 2011-07-15
            if ($('#' + id + '-pop').length != 0 && id != "") {
                content = $('#' + id + '-pop').clone().addClass('popup-content');
                $(container).find(".popup-content").remove();
                $(container).append(markup(content));
                
                if($('.item',content).length>1){
                	setupMulti(content);
                }
                
                
                
                $('body').append(popup);
                $(popup).css({'top':$('.countryMenu').offset().top,'left':$('.countryMenu').offset().left});
				
				
				//animation
                $(popup).hide();
                $(popup).animate({ 'opacity': 0, 'margin-left': '+=20' }, 0);
                $(popup).show();
                $(popup).animate({ 'opacity': 1, 'margin-left': '-=20' }, 500);
            }
            
            
        }

        var hide = function() { 
            $(popup).animate({ 'opacity': 0, 'left': '+=20' }, 500, function() { $(popup).detach(); $(content).remove(); });
        }

        var markup = function(obj) {
            $('h1', obj).append(closeBtn[0]);
            return obj;
        }

        $(this).change(function() {
            show($(this).val())
        });

        $(popup).delegate('.close', 'click', function(e) {
            e.preventDefault();
            hide();
        })
        
        $(popup).delegate('.prev.active', 'click', function(e) {
            e.preventDefault();
            prevContent();
        })
        
        $(popup).delegate('.next.active', 'click', function(e) {
            e.preventDefault();
            nextContent();
        })
        
        var nextContent=function(){
        	target=$('.item:visible',content).hide(0).next('.item').show(0);
        	
        	if(target.next('.item').length==0){
        		nextBtn.removeClass('active');
        	}
        	prevBtn.addClass('active');
        }
        
        var prevContent=function(){
        	target=$('.item:visible',content).hide(0).prev('.item').show(0);
        	
        	if(target.prev('.item').length==0){
        		prevBtn.removeClass('active');
        	}
        	nextBtn.addClass('active');
        	
        }
        
        
        var setupMulti=function(content){
        	
        	//Controls
        	closeBtn.after(nextBtn[0]);
        	nextBtn.after(prevBtn[0]);
        	nextBtn.addClass('active')
        	$('.item:first',content).show(0);
        	
        }

    }
})($);


//---For playing video in lightbox if target=self----


$(function(){
	$('a[target="_self"]').popVideo();
})

//---For popup image in fancybox if target=top----
$(function() {
    $('a[target="_top"]').fancybox();
})