// CONSTANTS
var CONTENT_DIV_PREFIX = "contentDiv"; var CONTENT_PAGE_LINK_PREFIX = "pageLink";
var SUB_CATEGORY_DIV_PREFIX = "subCategoryDiv";var SUB_CATEGORY_ITEM_LINK_PREFIX = "itemLink";
var SUB_CATEGORY_ITEM_LINK_CSS = "dock_sub_nav";var SUB_CATEGORY_ITEM_LINK_WHITE_CSS = "dock_sub_nav_white";
var SUB_CATEGORY_ITEM_LINK_SELECTED_CSS = "dock_sub_nav_selected";var CONTENT_PAGE_LINK_SELECTED_CSS = "page_selected";
var INITIAL_CATEGORY_INDEX = 0;var INITIAL_SUB_CATEGORY_INDEX = 0;var INITIAL_PLAY_INTERVAL = 10000;
// CONTROL IDS
var demo_WrapperDivID = "demo_WrapperDiv";
var demo_TransElementID = "demoDiv";var demo_ContentBodyDivID;
var demo_ContentPageCountHiddenFieldID = "demo_ContentPageCountHiddenField";
var demo_subCatergoryItemIdsHiddenFieldID;var demo_subCatergoryItemCountsHiddenFieldID;
// GLOBAL VARIABLES
var demo_ObjContent = null; var demo_ObjCategory = null; // class objects
var demo_Interval = INITIAL_PLAY_INTERVAL; //play interval
var demo_TimeOut = null; //time out variable
var demo_Play = true; //variable to store the state whether play or pause
//Item indexes
var demo_CategoryItemCurrentIndex = INITIAL_CATEGORY_INDEX;
var demo_SubCategoryItemCurrentIndex = INITIAL_SUB_CATEGORY_INDEX;
// variable to store the state of transition
var demo_TransFadedOut = false;var demo_TransFadedOutTime = null;var isManualClick = false;

// FUNCTIONS
function Demo_ShowContentByID(subCategoryItemIndex){
    document.title = "App Development Company, App Developers, 3D Animation, Custom Software Developer";
	demo_ObjCategory.SubCategories[demo_CategoryItemCurrentIndex]
		.ShowItemByIndex(subCategoryItemIndex);
}
function Demo_InitializeCategoryObject(){
	var subCatergoryItemIdsHiddenField = document.getElementById(demo_subCatergoryItemIdsHiddenFieldID);
	var subCatergoryItemCountsHiddenField = document.getElementById(demo_subCatergoryItemCountsHiddenFieldID);
	demo_ObjCategory = new Demo_CategoryObject(subCatergoryItemCountsHiddenField.value ,subCatergoryItemIdsHiddenField.value);
}
function Demo_InitializeContentObject(){
	demo_ObjContent = null; 
	var pageCount = parseInt(document.getElementById(demo_ContentPageCountHiddenFieldID).value);
	demo_ObjContent = new Demo_ContentObject(pageCount);
	demo_ObjContent.Initialize();
}
function Demo_ShowContentPage(pageIndex){
    document.title = "App Development Company, App Developers, 3D Animation, Custom Software Developer";
	demo_ObjContent.ShowContentPage(pageIndex);
}
function Demo_ShowNextContentPage(){
	demo_ObjContent.ShowNextContentPage()
}
// PLAY CONTROLLING FUNCTIONS
function ClearTimeOut(){
    clearTimeout(demo_TimeOut); //Modified to implement auto rotation of dock 
}
function SetTimeOut(strExpression){//Modified to implement auto rotation of dock
	ClearTimeOut();			
	demo_TimeOut = setTimeout(strExpression,demo_Interval);	
}
function SetInterval(intSecond) {//Modified to implement auto rotation of dock
	demo_Interval = (intSecond * 1000);
}

// CLASSES

// Class Demo_ContentObject
// -------------------------------
function Demo_ContentObject(pageCount)
{
	this.CurrentPageIndex = 0;
	this.PageCount = pageCount;
	
	this.ShowContentPage = function (pageIndex)
	{
		ShowContentByPageIndex(this.CurrentPageIndex, pageIndex);
		this.CurrentPageIndex = pageIndex;
		
		if(demo_Play == true)
		{
			SetTimeOut("Demo_ShowNextContentPage()");
		}
	}
	
	this.ShowNextContentPage = function ()
	{
		if(this.CurrentPageIndex < this.PageCount-1)
		{
			ShowContentByPageIndex(this.CurrentPageIndex, this.CurrentPageIndex+1);
			++this.CurrentPageIndex;
			SetTimeOut("Demo_ShowNextContentPage()");
		}else{
			demo_ObjCategory.ShowNextItem();
		}
	}
	
	this.Play = function ()
	{
		demo_Play = true;
		SetTimeOut("Demo_ShowNextContentPage()");
	}
	
	this.Initialize = function ()
	{
		if (demo_Play = true) this.Play();
	}
	
	var tmpNewPageIndex = 0;
	var tmpCurPageIndex = 0;
		
	//Private Fucntions
	function ShowContentByPageIndex(curPageIndex,newPageIndex)
	{	
	    tmpNewPageIndex = newPageIndex;
	    tmpCurPageIndex = curPageIndex;
         if (!isManualClick)
         {  
	        Demo_TransFadeOut(); 
	        setTimeout("demo_TransFadeIn()", demo_TimeToFade);
	        setTimeout("demo_DoDisplayContent()", demo_TimeToFade);	   
	   	 }  
	   	 else
	   	 {
	        document.getElementById(CONTENT_DIV_PREFIX+ curPageIndex.toString()).style.display = "none";
	        document.getElementById(CONTENT_DIV_PREFIX + newPageIndex.toString()).style.display = "block";
		 }
		isManualClick = false;
		//change page navigation link selection
		ChangePageNavigationSelection(curPageIndex,newPageIndex);

	}
	

	this.doDisplayContent = function()
	{
		document.getElementById(CONTENT_DIV_PREFIX+ tmpCurPageIndex.toString()).style.display = 'none';
	    document.getElementById(CONTENT_DIV_PREFIX + tmpNewPageIndex.toString()).style.display = 'block';	
	}	

	function ChangePageNavigationSelection(curPageIndex,newPageIndex)
	{
		document.getElementById(CONTENT_PAGE_LINK_PREFIX + curPageIndex.toString()).className = "";
		document.getElementById(CONTENT_PAGE_LINK_PREFIX + newPageIndex.toString()).className = CONTENT_PAGE_LINK_SELECTED_CSS;
	}
}

function demo_DoDisplayContent()
{
    demo_ObjContent.doDisplayContent();
}

// Class Demo_CategoryObject
// -------------------------------

function Demo_CategoryObject(commaSeperatedSubCategoryItemCounts , colonAndCommaSeperatedSubCategoryItemIds)
{

	this.SubCategories = new Array();
	
	var subCategoryCounts = commaSeperatedSubCategoryItemCounts.split(",");
	this.ItemCount = subCategoryCounts.length;
	var commaSeperatedSubCategoryItemIds = colonAndCommaSeperatedSubCategoryItemIds.split(":");

	for (var i=0; i<subCategoryCounts.length; i++)
	{
		var subCategoryCount = parseInt(subCategoryCounts[i]);
		this.SubCategories.push(new Demo_SubCategoryObject(subCategoryCount, commaSeperatedSubCategoryItemIds[i],i));
	}	
	
	this.ShowItemByIndex = function (categoryIndex)
	{
		this.Reset();
		ShowSubCategoryByIndex(categoryIndex)
	}
	
	this.ShowNextItem = function ()
	{
		var subCategory = this.SubCategories[demo_CategoryItemCurrentIndex];
		subCategory.ShowNextItem();
	}
	
	this.Reset = function()
	{
		var subCategory = this.SubCategories[demo_CategoryItemCurrentIndex];
		subCategory.Reset()
		
	}
	
	function ShowSubCategoryByIndex(categoryIndex)
	{
	//Call Flash Function	
			
		ChangeSelectedImages(categoryIndex);
		var curSubCatDivId = SUB_CATEGORY_DIV_PREFIX + demo_CategoryItemCurrentIndex.toString();
		var curSubCatDiv = document.getElementById(curSubCatDivId);
		curSubCatDiv.style.display = "none";
		
		var newSubCatDivId = SUB_CATEGORY_DIV_PREFIX + categoryIndex.toString();
		var newSubCatDiv = document.getElementById(newSubCatDivId);
		newSubCatDiv.style.display = "block";
		
		demo_CategoryItemCurrentIndex = categoryIndex;
		
		var subCategory = demo_ObjCategory.SubCategories[demo_CategoryItemCurrentIndex];
		subCategory.ShowItemByIndex(0);
		SelectCategory(categoryIndex);
	}	
}

// Class Demo_SubCategoryObject
// -------------------------------

function Demo_SubCategoryObject(itemCount, commaSeperatedItemIds,subCategoryIndex)
{

	this.Index = subCategoryIndex;
	this.DivId = SUB_CATEGORY_DIV_PREFIX + this.Index.toString();
	this.Items = new Array()
	
	var itemIds = commaSeperatedItemIds.split(",");
	
	for (var i=0; i<itemCount; i++)
	{
		this.Items.push(new Demo_SubCategoryItemObject(parseInt(itemIds[i]),""));
	}
	
	this.ShowItemByIndex = function (itemIndex)
	{
		var dbId = this.Items[itemIndex].DbId;
		ShowItem(this.DivId,itemIndex, dbId);
	}
	
	this.ShowNextItem = function ()
	{
		if(demo_SubCategoryItemCurrentIndex < this.Items.length -1)
		{
			var itemIndex = demo_SubCategoryItemCurrentIndex + 1
			var dbId = this.Items[itemIndex].DbId;
			ShowItem(this.DivId,itemIndex,dbId);
		}else
		{
			//this.Reset();
			
			if(demo_CategoryItemCurrentIndex == demo_ObjCategory.ItemCount -1 )
				demo_ObjCategory.ShowItemByIndex(0);
			else
				demo_ObjCategory.ShowItemByIndex(demo_CategoryItemCurrentIndex + 1);
		}
	}	
	
	//resets the menu to index of 0
	this.Reset = function()
	{
		ClearTimeOut();
		ShowMenu(this.DivId,0);
	}
	
	//Privat Functions
	function ShowItem(subCategoryDivId, itemIndex, dbId)
	{	
		ClearTimeOut();		
		ShowMenu(subCategoryDivId, itemIndex);
		Demo_ShowContent(dbId);
	}
	
	function ShowMenu(subCategoryDivId, itemIndex)
	{
	
		var curItemLinkId = subCategoryDivId + "_" + SUB_CATEGORY_ITEM_LINK_PREFIX + demo_SubCategoryItemCurrentIndex.toString();
		var curItemLink = document.getElementById(curItemLinkId);
		curItemLink.className = SUB_CATEGORY_ITEM_LINK_CSS;
//		if(demo_CategoryItemCurrentIndex == 4)
//			curItemLink.className = SUB_CATEGORY_ITEM_LINK_WHITE_CSS;
		
		var newItemLinkId = subCategoryDivId + "_" +SUB_CATEGORY_ITEM_LINK_PREFIX + itemIndex.toString();
		var newItemLink = document.getElementById(newItemLinkId);
		newItemLink.className = SUB_CATEGORY_ITEM_LINK_SELECTED_CSS;
		
		demo_SubCategoryItemCurrentIndex = itemIndex;
	}
}

// Class Demo_SubCategoryItemObject
// -------------------------------

	function Demo_SubCategoryItemObject(dbId, imageUrl)
	{
		this.DbId = dbId;
		this.ImageUrl = imageUrl;
	}

// Start Flash Funcions

	window.dock = new Object;
	
	function thisMovie(movieName) {
		var isIE = navigator.appName.indexOf("Microsoft") != -1;
		return (isIE) ? window[movieName] : document[movieName];
	}

	//Call from flash 
	function ChangeCategory(index)
	{

	    document.title = "App Development Company, App Developers, 3D Animation, Custom Software Developer";
		demo_ObjCategory.ShowItemByIndex(index);
		ChangeSelectedImages(index);
		SelectCategory(index);			
	}
    
    function ChangeSelectedImages(selectedindex)
    {
        document.title = "App Development Company, App Developers, 3D Animation, Custom Software Developer";
   
        if(selectedindex==0)//Apple
		{
	        appleImg.src="/Images/apple_2.png";
	        microsoftImg.src="/Images/win_1.png";
	        mobileDevelopImg.src="/Images/mobile_1.png";
	        mediaImg.src="/Images/media_1.png";
	        aboutZcoImg.src="/Images/zco_1.png";
	    }
	    if(selectedindex==1)//Microsoft
	    {
	        microsoftImg.src="/Images/win_2.png";
	        appleImg.src="/Images/apple_1.png";
	        mobileDevelopImg.src="/Images/mobile_1.png";
	        mediaImg.src="/Images/media_1.png";
	        aboutZcoImg.src="/Images/zco_1.png";
	    }
	    if(selectedindex==2)//Mobile
	    {
	        mobileDevelopImg.src="/Images/mobile_2.png";
	        appleImg.src="/Images/apple_1.png";
	        microsoftImg.src="/Images/win_1.png";
	        mediaImg.src="/Images/media_1.png";
	        aboutZcoImg.src="/Images/zco_1.png";
	    }
	    if(selectedindex==3)//Media
	    {
	        mediaImg.src="/Images/media_2.png";
	        appleImg.src="/Images/apple_1.png";
	        microsoftImg.src="/Images/win_1.png";
	        mobileDevelopImg.src="/Images/mobile_1.png";
	        aboutZcoImg.src="/Images/zco_1.png";
	        
	    }
	    if(selectedindex==4)//Zco
	    {
	        aboutZcoImg.src="/Images/zco_2.png";
	        mediaImg.src="/Images/media_1.png";
	        appleImg.src="/Images/apple_1.png";
	        microsoftImg.src="/Images/win_1.png";
	        mobileDevelopImg.src="/Images/mobile_1.png";
	    }
    }
    
	//Call flash funcion
	function SelectCategory(index)
	{	
		if(thisMovie("dock") && thisMovie("dock").ChangeCategorySelection)
			thisMovie("dock").ChangeCategorySelection(index)
		ChangeWrapperBg(index);
		
		//fading out;
		//Demo_TransFadeOut();
	}
	
	//Change the content area background according to the selected dock item
	function ChangeWrapperBg(index)
	{
		var div = document.getElementById(demo_WrapperDivID);		
		switch (index)
		{
			case 0:
			    div.style.background = "url(/images/bg/apple_bg.png)";	    			
			break;
			case 1:
			    div.style.background = "url(/images/bg/microsoft_bg.png)";			
			break;
			case 2:
				div.style.background = "url(/images/bg/mobile_bg.png)";	
				break;
			case 3:
				div.style.background = "url(/images/bg/games_bg.png)";
				break;
			case 4:
				div.style.background = "url(/images/bg/zco_bg.png)";
				break;			
		}	
	}

// End Flash Funcions


// Start Web Methods
	
	var demo_LastContentRetrieved = "";
	
	function Demo_ShowContent(subCatId)
	{
		PageMethods.GetHtmlForDemoSubCategoryPages(subCatId,WebMethodOnSucceed,WebMethodOnFailed);
	}
	
	function Demo_ShowFirstPage()
	{
	    Demo_TransFadeOut();	    
	    setTimeout("demo_TransFadeIn()", demo_TimeToFade);
	    setTimeout("Demo_DisplayContent()", demo_TimeToFade);	   
   	}
   	
   	function Demo_DisplayContent()
   	{
	    document.getElementById(demo_ContentBodyDivID).innerHTML = demo_LastContentRetrieved;
		Demo_InitializeContentObject();   	
   	}
   	
	function makeOpaque()
	{
	   var element = document.getElementById(demo_TransElementID);
	   element.style.opacity = 1;
	   //element.removeAttribute('filter');
	}
	
	function WebMethodOnSucceed(result,userContext,methodName)
	{
		demo_LastContentRetrieved = result;	 
		Demo_ShowFirstPage();
	}

	function WebMethodOnFailed(error,userContext,methodName)
	{
	  //alert("Unable to load the content.")
	  //TODO: Redirect to error page
	  //location.href = "error.aspx";
	}

// End Web Methods

// Start Transition Methods

var demo_TimeToFade = 500.0;

function Demo_TransFadeOut()
{

	demo_TransFade(demo_TransElementID);
	demo_TransFadedOut = true;
}

function demo_TransFadeIn()
{

	demo_TransFade(demo_TransElementID);
	demo_TransFadedOut = false;
}

function demo_TransFade(eid)
{

  var element = document.getElementById(eid);
  if(element == null)
    return;
   
  
  if (demo_TransFadedOut == false) // show 
  {
	   opacity(demo_TransElementID, 100, 0, 500);	   
   }
   else //hide
   {        
        opacity(demo_TransElementID, 0, 100, 500);   
   }
   
}

function opacity(id, opacStart, opacEnd, millisec) 
{           
    //speed for each frame
    var speed = Math.round(millisec / 100);
    var timer = 0;

    //determine the direction for the blending, if start and end are the same nothing happens
    if(opacStart > opacEnd) 
    {
        for(kount = opacStart; kount >= opacEnd; kount--) 
        {
            setTimeout("changeOpac(" + kount + ",'" + id + "')",(timer * speed));
            timer++;
        }
    } 
    else if(opacStart < opacEnd) 
    {
        for(kount = opacStart; kount <= opacEnd; kount++)
            {
            setTimeout("changeOpac(" + kount + ",'" + id + "')",(timer * speed));
            timer++;
        }
    }
}

//change the opacity for different browsers
function changeOpac(opacity, id) 
{
    //var object = document.getElementById(id).style;
    //object.opacity = (opacity / 100);
    //object.MozOpacity = (opacity / 100);
    //object.KhtmlOpacity = (opacity / 100);
    /*if (opacity == 100)
         object.removeAttribute('filter');
    else
        object.filter = "alpha(opacity=" + opacity + ")";*/
}