jQuery(function() {
    var imagePath = "/framework/graphics/jobs/";

    var Carrousel = function( id, prefix, suffix, num ) {
        var elm = document.getElementById(id);
        if (!elm) return;

        var handles = elm.getElementsByTagName("li");

        if (handles.length != 2) return;

        var prev = handles[0];
        var next = handles[1];

        var navigation = null;
        var active = 1;

        prev.onclick = function(){ move(-1); return false; };
        next.onclick = function(){ move(1);  return false; }

        if (arguments[4]) {
            navigation = new Navigation();
            navigation.setActive();
        }

        function move( step ) {
            active += step;
            if ( active > num ) {
                active = 1;
            } else if ( active < 1 ) {
                active = num;
            }

            setPicture();
        }

        function setPicture() {
            if (navigation) {
                navigation.setActive();
            }
            var numStr = active.toString();
            numStr = numStr.length == 1 ? "0"+numStr : numStr;
            var file = imagePath + prefix + numStr + suffix;
            elm.style.backgroundImage = 'url('+ file  +')';
        }

        function Navigation() {
            var navi = elm.parentNode.getElementsByTagName("ul")[1];
            var numbers = navi.getElementsByTagName("li");

            for ( var i=0; i<numbers.length; i++ ) {
                var link = numbers[i].getElementsByTagName("a")[0];

                link.onclick = onNaviClick;
            }

            function onNaviClick() {
            	active = parseInt(this.innerHTML);
                setPicture();
                return false;
            }

            function setActive() {
                for ( var i=0; i<numbers.length; i++ ) {
                    var link = numbers[i].getElementsByTagName("a")[0];
                    link.className = "";
                }
                var activeLink = numbers[active-1].getElementsByTagName("a")[0];
                activeLink.className = "active";
            }
            this.setActive = setActive;
        }
    }

    Carrousel( "teaser-cologne", "jobs_koeln_", ".png", 3 );
    Carrousel( "teaser-freiburg", "jobs_freiburg_", ".png", 3 );

    Carrousel( "gallery05", "f_03_", ".jpg", 3, true );
    Carrousel( "gallery03", "k_03_", ".jpg", 2, true );
	
    Carrousel( "gallery02", "k_02_", ".jpg", 3, true );
    Carrousel( "gallery04", "k_04_", ".jpg", 2, true );
});