// use JQuery to feel the flash funk!
// dominic winsor

var swfPath = '/furniture/flvplayer/mediaplayer.swf'; // full path to media player SWF
var flvPath = '/assets/video/'; // folder containing FLV files
var imgPath = '/assets/video/'; // folder containing JPG key frame

// locate the div and replace with flash
// fileName: filename without the extension, assume the FLV and JPG files have same name
function setFlashMovie(fileName) {
    // add path to movie
    var flvFile = flvPath + fileName + '.flv';
    var imgFile = imgPath + fileName + '.jpg';

    // clear then replace with flash
    $('#featured-brand-video').empty();
    $('#featured-brand-video').flash(
        {
            src: swfPath,
            width: 284,
            height: 160,
            wmode: 'transparent',
            quality: 'high',
            title: 'Bandai video',
            allowscriptaccess: 'always',
            allowfullscreen: 'false',
            flashvars: {
                file: flvFile,
                image: imgFile,
                shownavigation: false
            }
        },
        { version: 8 }
    );
}

// read the href from the link and update the video content with either a flash video or an image based on the path
function updateVideoContent(ele) {
    if (!ele)
        return false;

    // does the href point to the video folder?
    if (ele.href.indexOf(flvPath) != -1) {
        // read the href (a full http path) e.g. http://bandai.co.uk/assets/video/myfile.jpg and trim it down to just 'myfile'
        var file = ele.href.substring(ele.href.lastIndexOf('/') + 1, ele.href.lastIndexOf('.'));
        setFlashMovie(file);
    }
    else {
        // not a video, must be a link to an image
        // draw a new image in the featured video container and set its src to the link href
        $('#featured-brand-video').empty();
        $('#featured-brand-video').html('<img src="' + ele.href + '" alt=""/>');
    }

    $("#featured-brand-thumbs a").addClass("faded");
    $(ele).removeClass("faded");
}


// handle thumb image click
$("#featured-brand-thumbs a").click(function() {
    updateVideoContent(this);

    var featuredToy = "#" + $(this).attr("rel");
    if (featuredToy != "#") {

        $(".featured-toy:visible").fadeOut("fast", function() {
            $(featuredToy).fadeIn("fast");
        });

    }
    return false;
});


// handle onload - set initial video content
$(document).ready(function() {

    var $videoLinks = $("#featured-brand-thumbs").children(); // get list of A links inside the video container
    updateVideoContent($videoLinks[0]); // set the video content to the first in the list
    // TODO: can the above be done using :first-child selector in JQuery?

    // hide all bar first 3 thumbnails
    $("#featured-brand-thumbs a:gt(2)").hide();
    $("#featured-brand-thumbs a:eq(2)").after('<div id="featured-brand-thumbs-more"><a href="#more">...view more videos</a></div>');
    $("#featured-brand-thumbs-more a").click(function() {
        $("#featured-brand-thumbs-more").remove();
        $("#featured-brand-thumbs a:gt(2)").show();
        return false;
    });

    // hide all bar the first featured toy
    $(".featured-toy").hide();
    $(".featured-toy:first").show();

});