/*global jQuery*/
//var $ = jQuery.noConflict();



$(document).ready(function () {

    webcam = {
        player: flowplayer("player", {src: "http://www.breconbeacons.org/webcam/flowplayer-3.1.5.swf", wmode: "transparent"}),
        largePhotoBlock: $("#large-static-img"),
        largePhotoLink: $("#seePhoto"),
        largePhoto: $("#large-webcam-image"),
        largeVideoBlock: $("#large-video"),
        largeVideoLink: $("#seeVideo"),
        largeVideo: $("a#player"),
        mode: "video",
        videoURI: "",

        showVideo: function (evt) {
            if (!!evt) {
                evt.preventDefault();
            }
            webcam.largeVideoBlock.show();
            webcam.largePhotoBlock.hide();
            webcam.mode = "video";
            //console.log("v", webcam.videoURI);

            try {
                webcam.player.stop();
            } catch(e) {
                console.log(e);
            }
            window.setTimeout( function () {
            webcam.player.stop();

            webcam.player.setClip(webcam.videoURI);
            webcam.player.play();
        }, 1000);
            /*
            try {
                webcam.player.stop();
            } catch (e) {
                if (!!console) {
                    console.log(e);
                }
            }
            try {
             console.log("setclip1");
             webcam.player.setClip(webcam.videoURI);
             console.log("setclip2");
            } catch (e) {
                if (!!console) {
                    console.log(e);
                }
            }
            //console.log(webcam.player.getClip().url);
            try {
            // console.log("play");
                webcam.player.play(webcam.videoURI);
            } catch (e) {
                if (!!console) {
                    console.log(e);
                }
            }
*/
        },

        showPhoto: function (evt) {
            if (!!evt) {
                evt.preventDefault();
            }
            webcam.largePhotoBlock.show();
            webcam.largeVideoBlock.hide();
            webcam.mode = "photo";
        },

        setSource: function (evt) {
            evt.preventDefault();
            var cid = $(this).find("img").attr("src").match(/npvc|cyncp/)[0];
            //console.log(cid);
            var oldImgURI = webcam.largePhoto.attr("src");
            var oldVidURI = webcam.largeVideo.attr("href");
            var newVidURI = "";
            if (cid === "npvc") {
                webcam.largePhoto.attr("src", oldImgURI.replace("cyncp", "npvc"));
                newVidURI = oldVidURI.replace("cyncp", "npvc");
            } else {
                webcam.largePhoto.attr("src", oldImgURI.replace("npvc", "cyncp"));
                newVidURI = oldVidURI.replace("npvc", "cyncp");
            }
            webcam.largeVideo.attr("href", newVidURI);
            webcam.videoURI = newVidURI;
           // console.log(newVidURI);



            $(this).addClass("selected");
            $(this).siblings(".webcamVideo.small").removeClass("selected");


            if (webcam.mode === "video") {
                webcam.showVideo();
            } else {
                webcam.showPhoto();
            }

        },

        setToShowVC: function (evt) {
            if (!!evt) {
                evt.preventDefault();
            }

            $(".webcamsPage").hide();
        }

    };

    webcam.largePhotoLink.click(webcam.showPhoto);
    webcam.largeVideoLink.click(webcam.showVideo);
    webcam.largePhotoBlock.hide();
    webcam.largeVideoBlock.show();
    $(".webcamVideo.small").click(webcam.setSource);


    /* Webcams 2012... */

    $("#webcam-cyn").click(webcam.setToShowVC);

});