var appContentHeight = 0;
var appObj = null;
var appContentObj = null;

$(document).ready(function(){
	appObj = $('#appList');
	appContentObj = $('#appContent');
    appContentHeight = appContentObj.height();
    appContentObj.css('top',0-appContentHeight);
    
    setAppProductsList(document.getElementById('selectedAppID').value);
    
    $("body").click(function(e){
		var target = $(e.target);
		var targetID = target.attr("id");
		
		if ((targetID != 'appSelect') && (targetID != 'appActive'))
		{
			appContentObj.animate({
			    top: 0-appContentHeight
			  }, 500, function() {
				  appObj.css('visibility','hidden');
			  });
		}
	});
});

function setAppProductsList(selectedAppID)
{
	$("#appContainer_content").load("controller/products_by_app.php",
		{
			'appID':selectedAppID
		},function(){
			if ($("#appContainer_content").outerHeight() <= $("#appContainer").outerHeight())
			{
				$("#appContainer_scrollUpBtn").hide();
				$("#appContainer_scrollContainer").hide();
				$("#appContainer_scrollDownBtn").hide();
			}else{
				$("#appContainer_scrollUpBtn").show();
				$("#appContainer_scrollContainer").show();
				$("#appContainer_scrollDownBtn").show();
				
				var dragger=$("#appContainer_dragger");
				dragger.css('top',0);
				dragger.css('height',60);
				$("#appContainer_content").css('top',0);
				
				mCustomScrollbars();
			}
		}
	);
}

function showAppList()
{
	if (appObj.css('visibility') == 'visible')
	{
		appContentObj.animate({
		    top: 0-appContentHeight
		  }, 500, function() {
			  appObj.css('visibility','hidden');
		  });
	}else{
		appObj.css('visibility','visible');
		appContentObj.animate({
		    top: 0
		  }, 500, function() {
			  
		  });
	}
}

function selectedApp(appID)
{
	document.getElementById('selectedAppID').value = appID;
	document.getElementById('appSelect').innerHTML = document.getElementById('app_'+appID).innerHTML;
	setAppProductsList(appID);
}

function showAppScrollbar()
{
	$('#appScrollbarBlock').css('display','block');
	$('#appContentBlock').animate({
	    width: 143
	  }, 500, function() {
		  
	  });
	$('#appScrollbarBlock').animate({
	    width: 15
	  }, 500, function() {
		  
	  });
	
}

function closeAppScrollbar()
{
	$('#appScrollbarBlock').animate({
	    width: 0
	  }, 500, function() {
		  $('#appScrollbarBlock').css('display','none');
	  });
	$('#appContentBlock').animate({
	    width: 158
	  }, 500, function() {
		  
	  });
}

function mCustomScrollbars()
{
	/* 
	malihu custom scrollbar function parameters: 
	1) scroll type (values: "vertical" or "horizontal")
	2) scroll easing amount (0 for no easing) 
	3) scroll easing type 
	4) extra bottom scrolling space for vertical scroll type only (minimum value: 1)
	5) scrollbar height/width adjustment (values: "auto" or "fixed")
	6) mouse-wheel support (values: "yes" or "no")
	7) scrolling via buttons support (values: "yes" or "no")
	8) buttons scrolling speed (values: 1-20, 1 being the slowest)
	*/
	
	$("#appContainer").mCustomScrollbar("vertical",400,"easeOutCirc",1.05,"auto","yes","yes",10);
}