// Verze 3.1
// - ... opraven trapny bug s vycentrovanim (za hodnotou left MUSI byt "px")

function pruhlednost (el, endOpacity, ms) {
    // el:          id nebo samotny element, se kterym se manipuluje
    // endOpacity:  hodnota opacity po skonceni animace
    // ms:          delka animace v milisekundach

    var startOpacity    = endOpacity > 0 ? 0 : 1,
        numOfSteps      = Math.abs(startOpacity - endOpacity)*10,
        step            = startOpacity > endOpacity ? -(0.1) : (0.1),
        interval        = ms/numOfSteps,
        i;

    if (typeof el === "string") {el = document.getElementById(el);}
    
    if (endOpacity > 0) {el.style.display = "block";}

    for (i = 1; i <= numOfSteps; i++) {
        setTimeout(
            function (t) {
                return function () {
                    el.style.opacity = startOpacity + t*step;
                    el.style.filter = "alpha(opacity = " +
                        (startOpacity + t*step)*100 +")";
                }
            }(i), (i*interval)
        );
    }

    if (endOpacity === 0) {
        setTimeout(function () {el.style.display = "none";}, ms);
    }
}

function zavritFotku () {
    pruhlednost("fixed", 0, 200);
}

function prohlizecFotek () {

    var fixedDiv = document.createElement("div"),
        obsahDiv = document.getElementById("obsah");
    
    fixedDiv.id = "fixed";
    fixedDiv.innerHTML =
        "<div id = 'fotkaLista'>" +
            "<div id = 'sipkaPredchozi'></div>" +
            "<div id = 'fotkaZavrit' onclick = 'zavritFotku()'></div>" +
            "<div id = 'sipkaDalsi'></div>" +
            "<span id = 'fixedPopisek'></span>" +
        "</div>" +
        "<div id = 'fixedFotka'></div>";

    obsahDiv.insertBefore(fixedDiv, obsahDiv.firstChild);
}

function zobrazitFotku (id) {
    // nejdrive zjisti, jestli script jede poprve. Pokud ano, musi se vytvorit
    // okno, ve kterem se budou zobrazovat fotky. To dela funkce prohlizecFotek
    if (!document.getElementById("fixed")) {
        prohlizecFotek();
    }

    // so that the actual html doesn't have to be changed
    if (typeof id !== "string") {id = id.id;}

    var fixedDiv        = document.getElementById("fixed"),
        sipkaPredchozi  = document.getElementById("sipkaPredchozi"),
        popisek         = document.getElementById("fixedPopisek"),
        sipkaDalsi      = document.getElementById("sipkaDalsi"),
        fotkaDiv        = document.getElementById("fixedFotka"),
        img             = document.createElement("img"),
        idSplit         = id.split("f"),
        cisloSkupiny    = +idSplit[0],
        cisloFotky      = +idSplit[1],
        miniatura       = document.getElementById(id);

    if (cisloFotky === 1) {
        // pokud je toto prvni fotka v rade, schovat sipku "predchozi"
        sipkaPredchozi.style.display = "none";
    } else {
        sipkaPredchozi.onclick = function () {
            zobrazitFotku(cisloSkupiny + "f" + (cisloFotky - 1));
        };
        sipkaPredchozi.style.display = "block";
    }
    
    if (document.getElementById(cisloSkupiny + "f" + (cisloFotky + 1))) {
        sipkaDalsi.onclick = function () {
            zobrazitFotku(cisloSkupiny + "f" + (cisloFotky + 1));
        };
        sipkaDalsi.style.display = "block";
    } else {
        // pokud je toto posledni fotka v rade, schovat sipku "dalsi"
        sipkaDalsi.style.display = "none";
    }
    
    if (fixedDiv.style.display !== "block") {
        pruhlednost("fixed", 1, 200);
    }

    img.onload = function () {
        // odstranit predchozi fotku a popisek
        if (popisek.firstChild) {popisek.removeChild(popisek.firstChild);}
        if (fotkaDiv.firstChild) {fotkaDiv.removeChild(fotkaDiv.firstChild);}
        
        // vycentrovat okno
        if (window.innerWidth) {
            // pro normalni prohlizece
            fixedDiv.style.left = ((window.innerWidth - img.width - 14)/2)+"px";
        } else {
            // pro IE
            fixedDiv.style.left = ((document.body.offsetWidth - img.width)/2)+"px";
        }
        
        // nacist hodnotu popisku podle miniatury a nacist novou fotku
        popisek.appendChild(document.createTextNode(miniatura.title));
        fotkaDiv.appendChild(img);
        
        // zuzit sirku okna na sirku fotky
        fixedDiv.style.width = img.width + "px";
        
        // iPHONE, iPOD, iPAD
        if (navigator.userAgent.indexOf("iPhone") !== -1 ||
        navigator.userAgent.indexOf("iPod") !== -1 ||
        navigator.userAgent.indexOf("iPad") !== -1) {
            
            fixedDiv.style.top = window.scrollY + 35 + "px";
        }
        // END OF iPHONE, iPOD, iPAD
    };
	
    // nacte adresu velkeho obrazku podle adresy miniatury
    img.src = miniatura.src.slice(0, -5) + "b.jpg";	
}


// iOS
if (navigator.userAgent.indexOf("iPhone") !== -1 ||
navigator.userAgent.indexOf("iPod") !== -1 ||
navigator.userAgent.indexOf("iPad") !== -1) {

    document.addEventListener(
        "scroll", function () {
            var fixedDiv = document.getElementById("fixed"),
                modifier;
            
            fixedDiv.style.top = window.scrollY + 35 + "px";
        }, false
    );
}

window.onload = function () {
    // dopredu nacte vsechny velke fotky na strance
    var imgs    = document.getElementsByTagName("img"),
        loadImg = [],
        i, k;

    for (i = 0, k = imgs.length; i < k; i++) {
        if (imgs[i].id.indexOf("f") === 1) {
            loadImg[i] = document.createElement("img");
            loadImg[i].src = imgs[i].src.slice(0, -5) + "b.jpg";
        }
    }
};