var leftZone = 0;
var leftRight = 0;
var position = 1;
var countImg = 0;
var leftPos = 0;
var rightPos = 0;
var movimientOver = 20;
var velocidad = 500;

$(document).ready(function () {
    
    initPage();

    $(window).resize(function () { placePrincipal(); replaceRight(); placeFoot();getFullscreen();});
 
});

function initPage(){
    
    var imgs = $("#cacheRandom>img");
    var randomnumber=Math.floor(Math.random()*imgs.length);
    $("#cache").prepend($(imgs[randomnumber]).detach());
    $("#cacheRandom").remove();
    
    initPage2();
    
}

function initPage2(){

    
    if ($("#cache img").height() > 400){
    
        $("#cache > div").height($("#cache img").height()).css("overflow", "auto");
    
        paintMenu();
        placePrincipal();
        placeImgs();
        placeFoot();
        getFullscreen();
        
        
    }else{
        setTimeout(initPage2, 100);
    }

}

function getFullscreen(){

    var flashVars = {
        css: "css/FullScreenViewer.css",
        url: getBigImage("img1"),
        font: "font/Marke.swf",
        label: "fullscreen"
    };

    var flashParams = {
        wmode: "opaque",
        align: "middle",
        quality: "high",
        bgcolor: "#FEFEFE",
        allowScriptAccess: "sameDomain",
        allowFullScreen: "true"
    }

    // Flash attributes for SWFObject
    var flashAttrs = {
        id: "FullScreenViewer",
        name: "FullScreenViewer"

    }

    swfobject.embedSWF("js/FullScreenViewer.swf", "flashContent", "63", "20", "9", "js/expressInstall.swf", flashVars, flashParams, flashAttrs);

}

function replaceRight() {
    var posAfter = position + 1;
    posAfter = verifyRangePos(posAfter);
    $("#img" + posAfter).css("left", rightPos);
}

function placePrincipal() {

    //alert ($("#cache > *:first").height());

    var PrincipalHeight = $("#cache > *:first").height() + 200; 
    $("#principal").height(PrincipalHeight);
    var top = (($(window).height() - $("#principal").height()) / 2);
    var left = ($(window).width() - $("#principal").width()) / 2;
    if (top < 0) { top = 0; }
    if (left < 0) { left = 0; }
    $("#principal").css({ "top": top + "px", "left": left + "px" });
    rightPos = ($("#principal").width() - 30);
}

function placeImgs() {

    var imgs = $("#cache > div, #cache > img");
    
    var topZone = 168; //$(imgs[0]).height()) - 1;
    imgs.each(function () {
        countImg += 1;
        $(this).attr("id", "img" + countImg);
        $(this).css({ "position": "absolute", "top": topZone + "px", "left": ($("#principal").width() + 1000) + "px" })
    });

    $("#img1").css({ "left": "80px" });
    $("#img2").css({ "left": rightPos + "px" });
    placeLast();

    giveHover(countImg, 1, 2);

    $("#totalPagina").html(countImg);

}

function placeLast() {

    leftPos = (-$("#img" + countImg).width() + 30);
    if (leftPos != 30) {
        $("#img" + countImg).css({ "left": leftPos + "px" });
    } else {
        setTimeout(placeLast, 500);
    }

}

function placeFoot(){
    
    var imgs = $("#cache > *:first");   
    var topTitle = parseInt(parseFloat($("#principal").offset().top)) + 180 + imgs.height();
    $("#tituloFoto").css("top", topTitle + "px");
    $("#logoMurray").css("top", (topTitle - 8) + "px");
   
}

function giveHover(posBefore, pos, posAfter) {

    $("#img" + posBefore).unbind("mouseenter mouseleave click").css({ "cursor": "pointer" });
    $("#img" + posBefore).bind("mouseleave", function () { moveTo(this, leftPos) })
                .bind("mouseenter", function () { moveTo(this, leftPos + movimientOver) });
    $("#img" + posBefore).click(function () {
        moveThis(-1, this);
    });

    $("#img" + posAfter).unbind("mouseenter mouseleave click").css({ "cursor": "pointer" });
    $("#img" + posAfter).bind("mouseleave", function () { moveTo(this, rightPos); })
                .bind("mouseenter", function () { moveTo(this, rightPos - movimientOver) });
    $("#img" + posAfter).click(function () {
        moveThis(1, this);
    });

    $("#img" + pos).unbind("mouseover mouseleave click").css({ "cursor": "auto" });

    $("#idPagina").animate({ "opacity": 0 }, "fast", function () {
        $(this).html(pos);
        $(this).animate({ "opacity": 1 }, "slow");
    });
    
    var tit = "";
    var desc = "";
    if ($("#img" + pos).attr("titulo") != null){tit = $("#img" + pos).attr("titulo");}
    if ($("#img" + pos).attr("desc") != null){desc = $("#img" + pos).attr("desc");}

    $("#tituloFoto, #descFoto").animate({ "opacity": 0 }, "fast", function () {
        $("#tituloFoto").html( "<span style='font-weight:bold; padding-right:25px'>" + tit + "</span>" + desc );
        //$("#descFoto").html(desc);
        $(this).animate({ "opacity": 1 }, "slow");
    });


}

function moveTo(img, where) {
    $(img).stop().animate({ "left": where + "px" }, "fast");
}


function verifyRangePos(pos) {

    if (pos == 0) pos = countImg;
    if (pos == countImg + 1) pos = 1;

    return pos;
}

function moveThis(direction) {

    var posBefore = 0;

    if (direction > 0) {
        posBefore = verifyRangePos(position - 1);
    } else {
        posBefore = verifyRangePos(position + 1);
    }
    $("#img" + posBefore).css("display", "none");

    position += direction;
    position = verifyRangePos(position);

    var posBefore = position - 1;
    posBefore = verifyRangePos(posBefore);

    var posAfter = position + 1;
    posAfter = verifyRangePos(posAfter);

    leftPos = (-$("#img" + posBefore).width() + 30);

    if (direction > 0) {
        $("#img" + posAfter).css("left", rightPos + 150);
    } else {
        $("#img" + posBefore).css("left", "-500px");
    }

    $("#img" + position).animate({ "left": "80px" }, velocidad, "easeOutCirc");
    $("#img" + posBefore).css({ "display": "block" }).animate({ "left": leftPos + "px" }, velocidad, "easeOutCirc");
    $("#img" + posAfter).css({ "display": "block" }).animate({ "left": rightPos + "px" }, velocidad, "easeOutCirc");

    giveHover(posBefore, position, posAfter);

    if (($("#img" + position)[0].tagName == "IMG") && ($("#img" + position).attr("nobig") == null)) {
        $("#FullScreenViewer").css("visibility","visible");
        $("#FullScreenViewer")[0].setImageUrl(getBigImage("img" + position));
    } else {
        $("#FullScreenViewer").css("visibility","hidden");
    }

}

function getBigImage(id) {

    //alert (id);
    var src = $("#" + id).attr("src").toLowerCase();
    src = src.replace(".jpg", "_big.jpg");
    return src;

}