/* Varaibles controlling the add playlist button for Related Videos*/
function panelControls(panelName){
	this.panelShowing = true;
	this.videoClipNumber = 0;
	this.videoClipClickState = new Array();
	this.name = panelName;
}

var RelatedPanelControls = new panelControls("Related");
var MyPlaylistPanelControls = new panelControls("MyPlaylist");
var SearchPanelControls = new panelControls("Search");
var RelatedProductPanelControls = new panelControls("RelatedProduct");
//The Temp Panel
var RelatedProductsPanelControls = new panelControls("RelatedProducts");

var imageUrl = "/assets/images/playlist/";

ToggleArrowsRelatedProducts = function(panelType){
	if(!panelType.panelShowing){	
		$("#relatedProducts").css("height","297px");
		$("#"+panelType.name+"ContentOuter").show("slow");
		
		//Update the Arrow
		$("#"+panelType.name+"VideosArrow")
			.attr("src",imageUrl+"arrow_open.png")
			.css("width","16px")
			.css("height","16px");
			
		panelType.panelShowing = true;
	}
	else{
		$("#"+panelType.name+"ContentOuter").hide("slow", function(){
			$("#relatedProducts").css("height","33px");
		});
		
		//Update the Arrow
		$("#"+panelType.name+"VideosArrow")
			.attr("src",imageUrl+"arrow_closed.png")
			.css("width","16px")
			.css("height","16px");
			
		panelType.panelShowing = false;
	}
	
	return false;
}

AddSearchClickEvents = function(){
	/////////////////////////////
	//Search Videos Setup
	/////////////////////////////
	
	$("#SearchVideosContent").find(".SearchVideosItemThumbnail").each(function(i){
		//Add click event to the Search Videos Panel thumbnail.
		var thumbIndex = i;
		$(this).click(function() {
			window.open(searchVideos.destinationURL[thumbIndex],"_self","");
		});	
	});
	
	$("#SearchVideosContent").find(".SearchVideosItemTitleText").each(function(i){
		//Add click event to the Search Videos Panel thumbnail.
		var thumbIndex = i;
		$(this).click(function() {			
			window.open(searchVideos.destinationURL[thumbIndex],"_self","");
		});	
	});
	
	$('#SearchVideosWrapper .panelArrows').unbind("click");
	$('#SearchVideosWrapper .panelTitle').unbind("click");

	//Add click event to the Search Videos Panel Arrow Image so have a show/hide animation.	
	$('#SearchVideosWrapper .panelArrows').click(function() {
	    ToggleArrowsTmp("#Search", SearchPanelControls);
	});

	//Add click event to the Search Videos Panel title text so have a show/hide animation.
	$('#SearchVideosWrapper .panelTitle').click(function() {
	    ToggleArrowsTmp("#Search", SearchPanelControls);
	});
	
	//Activate the scrollbars for Search Videos.
	$('#SearchVideosContent').jScrollPane({ scrollbarWidth: 16, reinitialiseOnImageLoad: true, arrowSize: 16, showArrows: true, arrowSize: 16 });
	
	//Get the number of items added to the Search Video panel.
	SearchPanelControls.videoClipNumber = parseInt($("#SearchVideosContent").find(".SearchVideosItem").length);
	
	//Adding playlist flag so items can't be added more then once.
	for(i=0;i<SearchPanelControls.videoClipNumber;i++){
		//set button state to can be added.
		SearchPanelControls.videoClipClickState[i] = 1;
	}
	
	//Add a click event to the add item.
	$("#SearchVideosContent").find(".SearchVideosItem").each(function(i){
		var itemIndex = i;
		$(this).unbind("click");
		$(this).click(function(){
			
			if(SearchPanelControls.videoClipClickState[itemIndex] == 1){
				SearchPanelControls.videoClipClickState[itemIndex] = 0;
				addItem(searchVideos.clipIds[itemIndex], searchVideos.channels[itemIndex]);
			}	
		});
	});	
}

var tmpSearchData = "";
//function for suppressing form submission
function noEnter(e){	
	var characterCode
	if(e && e.which){
		e = e
		characterCode = e.which
	}
	else{
		e = event
		characterCode = e.keyCode
	}
	if(characterCode == 13){
		//alert("e: "+e.keyCode);
		runSearch();
		return false;
	}
	else{
		return true
	}
}

function runSearch(){
	SubmitSearch();
	tmpSearchData = $(".searchData").val();
	$(".searchData").val("Submitting search information...");
	return false;
}

function clearSearch(){
	$(".searchData").val("");
	tmpSearchData = "";
}

//Need to make the playlist and related products widgets use this function.
AddClickEvents = function(wrapperName, controls, clips) {
    $(wrapperName + ' .panelTitles').unbind("click");

    //Add click event to the Related Videos Panel title text so have a show/hide animation.
    $(wrapperName + ' .panelTitles').click(function() {
        ToggleArrows(wrapperName, controls);
    });

    //Activate the scrollbars for Related Videos.
    $(wrapperName + ' .videosContent').jScrollPane({ scrollbarWidth: 16, reinitialiseOnImageLoad: true, arrowSize: 16, showArrows: true, arrowSize: 16 });

    //Get the number of items added to the Related Video panel.
    controls.videoClipNumber = parseInt($(wrapperName + " .videosContent").find(".videosItem").length);

    //Adding playlist flag so items can't be added more then once.
    for (i = 0; i < controls.videoClipNumber; i++) {
        //set button state to can be added.
        controls.videoClipClickState[i] = 1;
    }    
}

//Controls for the Arrow the title text links
ToggleArrows = function(wrapperName, panelType) {   
    if (!panelType.panelShowing) {
        $(wrapperName).css("height", "297px");
        $(wrapperName + " .videosContainer").show("slow");

        //Update the Arrow
        $(wrapperName + " .videosArrow")
			.attr("src", imageUrl + "arrow_open.png")
			.css("width", "16px")
			.css("height", "16px");

        panelType.panelShowing = true;
    }
    else {
        $(wrapperName + " .videosContainer").hide("slow", function() {
            $(wrapperName).css("height", "33px");
        });

        //Update the Arrow
        $(wrapperName + " .videosArrow")
			.attr("src", imageUrl + "arrow_closed.png")
			.css("width", "16px")
			.css("height", "16px");

        panelType.panelShowing = false;
    }

    return false;
}

AddRelatedVideosEvents = function(wrapperName, controls, clips) {
    AddClickEvents(wrapperName, controls, clips);
}

AddWidgetEvents = function(wrapperName, controls, clips) {
    $(wrapperName + " .videosContent").find(".videosItemThumbnail").each(function(i) {
        //Add click event to the widget Videos Panel thumbnail.
        var thumbIndex = i;
        $(this).click(function() {
            window.open(clips.destinationURL[thumbIndex], "_self", "");
        });
    });

    $(wrapperName + " .videosContent").find(".videosItemTitleText").each(function(i) {
        //Add click event to the widget Videos Panel title text.
        var thumbIndex = i;
        $(this).click(function() {
            window.open(clips.destinationURL[thumbIndex], "_self", "");
        });
    });

    AddClickEvents(wrapperName, controls, clips);

    if (clips == null) return;

    //Add a click event to the add item item.
    $(wrapperName + " .videosContent").find(".videosSubItem").each(function(i) {
        var itemIndex = i;
        $(this).click(function() {
            //if (controls.videoClipClickState[itemIndex] == 1) {
            //controls.videoClipClickState[itemIndex] = 0;

            //Removed the clip item from the flash cache.
            removeItem(clips.clipIds[i]);
            //}
        });
    });

    //Add a click event to the add item item.
    $(wrapperName + " .videosContent").find(".videosAddItem").each(function(i) {
        var itemIndex = i;
        $(this).click(function() {
            //alert("clipIds[i]: " + clips.clipIds[i] + " typeof: " + typeof clips.clipIds[i]);
            //alert("channels[i]: " + clips.channels[i] + " typeof: " + typeof clips.channels[i]);

            //Add the clip item from the flash cache.
            addItem(clips.clipIds[i], clips.channels[i]);
        });
    });

    if (wrapperName == "#Search") {
        //Add a click event to the add item item.
        $(wrapperName + " .videosContent").find(".addPlaylistButton").each(function(i) {
            var itemIndex = i;
            $(this).click(function() {
                //Add the clip item from the flash cache.
                addItem(clips.clipIds[i], clips.channels[i]);
            });
        });
    }
}

$(document).ready(function() {
    AddRelatedVideosEvents("#RelatedVideos", RelatedPanelControls, relatedVideos);

    AddSearchClickEvents();
    addRelatedProductsCloseEvent();
});

//Controls for the Arrow the title text links
ToggleArrowsTmp = function(panelType){
	if(!panelType.panelShowing){	
		$("#"+panelType.name+"Wrapper").css("height","297px");
		$("#"+panelType.name+"Container").show("slow");
		
		//Update the Arrow
		$("#"+panelType.name+"Arrow")
			.attr("src",imageUrl+"arrow_open.png")
			.css("width","16px")
			.css("height","16px");
			
		panelType.panelShowing = true;
	}
	else{
		$("#"+panelType.name+"Container").hide("slow", function(){
			$("#"+panelType.name+"Wrapper").css("height","33px");
		});
		
		//Update the Arrow
		$("#"+panelType.name+"Arrow")
			.attr("src",imageUrl+"arrow_closed.png")
			.css("width","16px")
			.css("height","16px");
			
		panelType.panelShowing = false;
	}
	
	return false;
}

addRelatedProductsCloseEvent = function(){
	$('#RelatedProductTitlePanel .panelArrows').unbind("click");
	$('#RelatedProductTitlePanel .panelTitle').unbind("click");
	
	//Add click event to the RelatedProducts Panel title text so have a show/hide animation.
	$('#RelatedProductTitlePanel .panelTitle').click(function() {
		ToggleArrowsRelatedProducts(RelatedProductPanelControls);
	});
}

$(document).ready(function() {
    var cliplength = $(".allvideos ul li .clipgroup div").length;
    if (cliplength < 4) {
        $(".allvideos .button.left").css("margin-top", "45px");
        $(".allvideos .button.right").css("margin-top", "45px");
    }
    else if (cliplength < 7) {
        $(".allvideos .button.left").css("margin-top", "109px");
        $(".allvideos .button.right").css("margin-top", "109px");
    }

    /*Not sure why the works but it seems that chrome has a problem with the carousel on the home page and will only get the correct width for the panels if 
      the width is set again.
    */
    try {
        $("#home .carousel .clipgroup").css("width", "532px");
    }
    catch (err) {
    }
});


$(document).ready(function() {
    try {
        //Adding social network tooltips
        $(".clip-info-panel-bookmarks img[title]").tooltip('#tooltip');
    }
    catch (err) { }

    try {
        //Adding video panel tooltips
        $(".videoheader a").tooltip({

            // each trashcan image works as a trigger
            tip: '#tooltip2',

            // custom positioning
            position: 'center center',

            // move tooltip a little bit to the right
            offset: [-50, 0]

        });
    }
    catch (err) { /*console.log(".videoheader a[title] not found");*/ }

    //Add events for the playlist button in the video information panel.
    try {
        var clipID = $(".clip-info-panel .clip-id").attr("value");
        var channelID = $(".clip-info-panel .channel-id").attr("value");

        $('#playlistButton').click(function() {
            //alert('Second handler for .toggle() called.');
            $("#playlistButton img").attr("src", "/assets/images/playlist/add_playlist.png");
            //$("#playlistButton span").html(" ADD FROM MY PLAYLIST");
            addItem(clipID.toString(), channelID.toString());
        });

        /*$('#playlistButton').toggle(function() {
        //alert('First handler for .toggle() called.');
        $("#playlistButton img").attr("src", "/assets/images/playlist/remove_playlist.png");
        $("#playlistButton span").html(" REMOVE FROM MY PLAYLIST");
        removeItem(clipID.toString());
        }, function() {
        //alert('Second handler for .toggle() called.');
        $("#playlistButton img").attr("src", "/assets/images/playlist/add_playlist.png");
        $("#playlistButton span").html(" ADD FROM MY PLAYLIST");
        addItem(clipID.toString(), channelID.toString());
        });*/
    }
    catch (err) {
    }
});