/*
 * Media Center Methods
 * ---------------------
 * build_media_thumbs
 * change_video_page
 * change_video_thumb
 *
 */

/* Function: build_media_thumbs
	Takes the media_array variable (generated by php) and fills the thumbnail portion of the media element

	page: page to display (1st page is 1)
	type: type of thumbnails to generate ('video')
---------------------------------------------*/
function build_media_thumbs(page, type) {
	page = page - 0; // Force Integer
	var output = '';
	var nav_output = '<div id="media_'+type+'_nav" class="media_nav">';

	var page_limit = 6;
	var limit = 6; //page_limit * page;
    if (page==-1) // ALL videos
    {
        page=1;
        limit = 30;
        page_limit = 30;
    }
	var prev_page = page - 1;
	var next_page = page + 1;
	var start = 0;

	// Build the 'previous page' button if needed
	if(page > 1) {
		start = limit - page_limit;
		nav_output += '<a href="#" id="'+type+'_prev_nav" class="'+type+'_nav prev_nav" page="'+ prev_page +'">prev</a>';
	}

	output += '<ul>';
	// Loop through the media array (depending on type and build thumbnail output
	var media_array = video_array;
	var cnt = 0;
	for(var i = start; ((i < media_array.length) && i < limit); i++) {
		var media = media_array[i];

    var title = media.title;
    var title_array = title.split(":");
    var media_title = title_array[0] + ":<br />";
        if(typeof(title_array[1])!='undefined'){
            media_title += title_array[1];
        }

		var media_out = '\n<li><a class="'+type+'_thumb" index="'+ i +'" href="'+ media.uri +'">'
						+ '<img src="'+ media.thumb +'" alt="'+ media.title +'" class="'+type+'_thumb_img" /><span class="thumb-corners"></span></a>'
                        + '<div class="play_btn" index="'+i+'"></div>'
						+ '<div class="media_title">&nbsp;</div>' //'<div class="media_title">'+ media_title +'</div>'
						+ '</li>';
		output += media_out;

		cnt++;
		if((cnt % 3) == 0 && (cnt != 0)) {output += '\n</ul>\n<div class="clear"></div>\n<ul>';}
	}
	output += '\n</ul>';


	// Build the 'next page' button if needed
	if(i < media_array.length) {
		nav_output += '<a href="#" id="'+type+'_next_nav" class="'+type+'_nav next_nav" page="'+ next_page +'">next</a>';
	}
	// Finish Navigation Output
	nav_output += '</div> <!-- #'+type+'_video_nav -->';

	// Finish building thumbnail output and display
	output += nav_output;
	output += '\n<div class="clear"></div>';
	jQuery('#media_'+type+'_list').html(output);

	// Attach methods to generated elements
	jQuery('.video_nav').bind('click', change_video_page, false);
	jQuery('.video_thumb').bind('click', change_video_thumb, false);
	jQuery('.play_btn').bind('click', change_video_thumb, false);
}

/* Function: change_video_page
	Changes the thumbnail page of the 'video' media element
	Calling element (a link) requires the 'page' attribute (target page)
---------------------------------------------*/
function change_video_page() {
	var target_page = jQuery(this).attr("page");
	build_video_thumbs(target_page);
	return false;
}

/* Function: change_video_thumb
	Displays an item from the thumnail page in the 'main video' section

	Calling element (a link) requires the 'index' attribute (target media index)
	manual_index: overrides the attribute-supplied index
---------------------------------------------*/
function change_video_thumb(manual_index) {
    index = jQuery(this).attr("index");
    if(!index) {
            index = manual_index;
    }
    if(is_array(video_array) && video_array.length > 0){
        //console.log(index);
        //console.log(video_array);
	var video = video_array[index];
	// Update URI due to flash/html5 support changes
        if (typeof(video)!='undefined') {
            var video_url = video.uri.replace(/\?.*/,"&hl=en_US&feature=player_embedded&version=3&enablejsapi=1&playerapiid=swfvideo");

            var width = 640;
            var height = 360;
            var vid_html = '<object width="'+ width +'"  height="'+ height +'" id="swfvideo'+ index +'">'
                            + '\n<param name="movie" value="'+ video_url +'"></param>'
                            + '\n<param name="allowFullScreen" value="true"></param>'
                            + '\n<param name="allowscriptaccess" value="always"></param>'
                            + '\n<param name="wmode" value="transparent"></param>'
                            + '\n<embed src='+ video_url +' type="application/x-shockwave-flash" allowscriptaccess="always"'
                            + ' allowfullscreen="true" width="'+ width +'"  height="'+ height +'" wmode="transparent"></embed>\n</object>';
            jQuery('#media_video_main').html(vid_html);
            jQuery('#video_title').html(video.title);
            jQuery('#video_caption').html(video.desc);
            var ytTracker = new Array;
            ytTracker[index] = new YoutubeTracker();
            return false;
        } else {
            jQuery('#media_video_main').html(sorry());
        }
    }else{
        jQuery('#media_video_main').html(sorry());
    }
}

/**
 * @see http://andrewpeace.com/javascript-is-array.html
 */
function is_array(input){
    return typeof(input)=='object'&&(input instanceof Array);
}

function sorry(){
    var sorry = "<p>We're sorry, but at the moment there doesn't seem to be any videos in this gallery.<br/></br/>Please check back later.</p>";
    return sorry;
}
