<img id="zdjecieDuze" />
<img id="zdjecieMIN" />

<p id="tytul"></p>
<p id="opis"></p>

<div class="clear"></div><div id="strzalka1"></div>
<div id="strzalka2"></div><div class="clear"></div>

<script src="projekty/skrypt.js"></script>

function TablicaZdjec() {
    var tablicaZdjec = [
        {zrodloZdjecia: 'img/przyklad.png', zrodloMiniaturki : 'img/przyklad.png', tytul : 'tytul1', opis : 'opis1'},
        
        {zrodloZdjecia: 'projekty/1.png',
        zrodloMiniaturki : 'projekty/1.png',
        tytul : '<b>Dom jednorodzinny</b>',
        opis : 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate.'},

        {zrodloZdjecia: 'zdjecie2.jpg', zrodloMiniaturki : 'zdjecie3MIN.jpg', tytul : 'tytul2', opis : 'opis2'},    
        {zrodloZdjecia: 'zdjecie3.jpg', zrodloMiniaturki : 'zdjecie3MIN.jpg', tytul : 'tytul3', opis : 'opis3'},
        {zrodloZdjecia: 'zdjecie4.jpg', zrodloMiniaturki : 'zdjecie4MIN.jpg', tytul : 'tytul4', opis : 'opis4'},
        {zrodloZdjecia: 'zdjecie5.jpg', zrodloMiniaturki : 'zdjecie5MIN.jpg', tytul : 'tytul5', opis : 'opis5'},
        {zrodloZdjecia: 'zdjecie6.jpg', zrodloMiniaturki : 'zdjecie6MIN.jpg', tytul : 'tytul6', opis : 'opis6'},
        {zrodloZdjecia: 'zdjecie7.jpg', zrodloMiniaturki : 'zdjecie7MIN.jpg', tytul : 'tytul7', opis : 'opis7'},
        {zrodloZdjecia: 'zdjecie8.jpg', zrodloMiniaturki : 'zdjecie8MIN.jpg', tytul : 'tytul8', opis : 'opis8'},
    ]
    
    var indeksAktualnegoZdjecia = 0;
    var iloscZdjec = tablicaZdjec.length;
    
    return {
        zwiekszIndeks : function() {
            indeksAktualnegoZdjecia++;
            if(indeksAktualnegoZdjecia > iloscZdjec - 1)
                indeksAktualnegoZdjecia = iloscZdjec - 1;
        },
        
        zmniejszIndeks : function() {
            indeksAktualnegoZdjecia--;
            if(indeksAktualnegoZdjecia < 0)
                indeksAktualnegoZdjecia = 0;
        },
        
        zwrocCaleZdjecie : function() {
            return tablicaZdjec[indeksAktualnegoZdjecia];
        }
    }
}

var tablicaZdjec = TablicaZdjec();

document.getElementById('strzalka1').onclick = function() {
    tablicaZdjec.zmniejszIndeks();
    document.getElementById('zdjecieDuze').src = (tablicaZdjec.zwrocCaleZdjecie()).zrodloZdjecia;
    document.getElementById('zdjecieDuze').alt = (tablicaZdjec.zwrocCaleZdjecie()).zrodloZdjecia;
    document.getElementById('zdjecieMIN').src = (tablicaZdjec.zwrocCaleZdjecie()).zrodloMiniaturki;
    document.getElementById('zdjecieMIN').alt = (tablicaZdjec.zwrocCaleZdjecie()).zrodloMiniaturki;
    document.getElementById('opis').innerHTML = (tablicaZdjec.zwrocCaleZdjecie()).opis;
    document.getElementById('tytul').innerHTML = (tablicaZdjec.zwrocCaleZdjecie()).tytul;
}

document.getElementById('strzalka2').onclick = function() {
    tablicaZdjec.zwiekszIndeks();
    document.getElementById('zdjecieDuze').src = (tablicaZdjec.zwrocCaleZdjecie()).zrodloZdjecia;
    document.getElementById('zdjecieDuze').alt = (tablicaZdjec.zwrocCaleZdjecie()).zrodloZdjecia;
    document.getElementById('zdjecieMIN').src = (tablicaZdjec.zwrocCaleZdjecie()).zrodloMiniaturki;
    document.getElementById('zdjecieMIN').alt = (tablicaZdjec.zwrocCaleZdjecie()).zrodloMiniaturki;
    document.getElementById('opis').innerHTML = (tablicaZdjec.zwrocCaleZdjecie()).opis;
    document.getElementById('tytul').innerHTML = (tablicaZdjec.zwrocCaleZdjecie()).tytul;
}