$(function(){
// ------------------ Document is ready --------------------------
	
	function setScrollBar(NameID){
		var boxContent = $('#'+NameID+" .content-inner .content-scroll");
		var boxScroll = $('#'+NameID+" .box-scrollbar .btn-scroll");
		var varArray = new Array();

		var limitNameID = $('#'+NameID+" .content-inner").css('height');
		var heightNameID = boxContent.css('height');
		var topNameID = boxContent.css('top');
		
		var limitScroll = $('#'+NameID+" .box-scrollbar").css('height');
		var paddingScroll = $('#'+NameID+" .box-scrollbar .btn-scroll").css('top'); // height - (top * 2) = limitScroll
		var heightScroll = $('#'+NameID+" .box-scrollbar .btn-scroll").css('height');
		
		var oldTopScroll = 0;
		var oldMouse = 0;
		var nowMouse = 0;
		var checkMouse = false;
		
		var checkAction = false;
		var checkCondition = 0;
		
		var checkUpDown = false;
		var nameInterval = '';
		
// ------------------ Get Value Content --------------------------
		limitNameID = textSplit(limitNameID);
		heightNameID = textSplit(heightNameID);
		topNameID = textSplit(topNameID);
		
		limitNameID = Math.floor(limitNameID - (topNameID + heightNameID));
		
// ------------------ Get Value Scroll Bar --------------------------
		limitScroll = textSplit(limitScroll);
		paddingScroll = Math.floor(textSplit(paddingScroll));
		heightScroll = textSplit(heightScroll);
		
		limitScroll = Math.floor((limitScroll - (paddingScroll)) - heightScroll);
		
		oldTopScroll = paddingScroll;
		
// ------------------ add Event Scroll Bar --------------------------
		$('#'+NameID+" .box-scrollbar .btn-scroll").mouseenter(function(){
			checkMouse = true;
			oldTopScroll = textSplit($(this).css('top'));
		})
		
		$('#'+NameID+" .box-scrollbar .btn-scroll").mouseleave(function(){
			checkMouse = false;
			//checkAction = false;
		});
		
		$('#'+NameID+" .box-scrollbar .btn-scroll").mousedown(function(){
			//checkMouse = true;
			checkAction = true;
		});
		
		$('#'+NameID+" .box-scrollbar .btn-scroll").mouseup(function(){
			checkMouse = false;
			checkAction = false;
			
			//alert( textSplit($(this).css('top')) +" / limitScroll = "+limitScroll);
			//alert(convertPercentScrollToContent(textSplit($(this).css('top'))));
		});
		
		$('#'+NameID+" .box-scrollbar .btn-scroll").mousemove(function(e){
			if(checkAction){
				nowMouse = e.pageY;
				
				if(checkMouse){
					oldMouse = e.pageY;
					checkMouse = false;	
				}
				else {
					checkCondition = (Math.floor(oldTopScroll) + Math.floor(nowMouse - oldMouse));
					
					if(checkCondition <= paddingScroll){
						$(this).css({"top": paddingScroll+"px"});	
						boxContent.css({"top": topNameID+'px'});
					}
					else if(checkCondition > paddingScroll && checkCondition <= limitScroll){
						$(this).css({"top":(Math.floor(oldTopScroll) + Math.floor(nowMouse - oldMouse))+"px"});	
						boxContent.css({"top": convertPercentScrollToContent(textSplit($(this).css('top')))+'px'});
					}
					else {
						$(this).css({"top": limitScroll+"px"});	
						boxContent.css({"top": limitNameID+'px'});
					}
				}
			}
		});
		
		$('#'+NameID+" .box-scrollbar .btn-up").mouseenter(function(){
			checkUpDown = true;
			oldTopScroll = Math.floor(textSplit(boxScroll.css('top')));
		});
		
		$('#'+NameID+" .box-scrollbar .btn-up").mousedown(function(){
			if(checkUpDown){
				oldTopScroll -= 10;
				
				if(oldTopScroll <= paddingScroll){
					boxScroll.stop().animate({"top":paddingScroll+"px"}, 200);
					boxContent.stop().animate({"top": convertPercentScrollToContent(textSplit(paddingScroll+"px"))+'px'}, 200);
				}else{
					boxScroll.stop().animate({"top":oldTopScroll+"px"}, 200);
					boxContent.stop().animate({"top": convertPercentScrollToContent(textSplit(oldTopScroll+"px"))+'px'}, 200);
				}
			}
		});
		
		$('#'+NameID+" .box-scrollbar .btn-up").mouseleave(function(){
			checkUpDown = false;
		});
		
		$('#'+NameID+" .box-scrollbar .btn-down").mouseenter(function(){
			checkUpDown = true;
			oldTopScroll = Math.floor(textSplit(boxScroll.css('top')));
		});
		
		$('#'+NameID+" .box-scrollbar .btn-down").mousedown(function(){
			if(checkUpDown){
				oldTopScroll += 10;
				
				if(oldTopScroll >= limitScroll){
					boxScroll.stop().animate({"top":limitScroll+"px"}, 200);
					boxContent.stop().animate({"top": convertPercentScrollToContent(textSplit(limitScroll+"px"))+'px'}, 200);
				}else{
					boxScroll.stop().animate({"top":oldTopScroll+"px"}, 200);
					boxContent.stop().animate({"top": convertPercentScrollToContent(textSplit(oldTopScroll+"px"))+'px'}, 200);
				}
			}
		});
		
		$('#'+NameID+" .box-scrollbar .btn-down").mouseleave(function(){
			checkUpDown = false;
		});
		
// ------------------ function --------------------------
		function textSplit(NameForSplit){
			varArray = NameForSplit.split('px');
			NameForSplit = varArray[0];
			return NameForSplit;
		}
		
		function convertPercentScrollToContent(valueScroll){
			if(valueScroll < paddingScroll){
				valueScroll = 0;
			}else if(valueScroll > limitScroll){
				valueScroll = 1;
			}else {
				valueScroll = (valueScroll / limitScroll);
			}
			
			valueScroll = (valueScroll * limitNameID);
			return valueScroll;
		}
	}

// ------------------ add function --------------------------	
	setScrollBar("homeDining");
	setScrollBar("homeEdutainment");
	setScrollBar("homeHealthAndBeauty");
	setScrollBar("homeService");
	setScrollBar("homeTravelAndLeisure");
});
