window.addEvent('domready', setButtons);
    
    function setButtons()
    {
        if(!$defined($('bundle')))
            return;
        var bundle = $('bundle').getChildren();
        if(bundle[1].getProperty('class') == '' || bundle[1].getProperty('class') == 's')
            bundle[0].setOpacity(0.3);
        else
            bundle[0].setOpacity(1);                
        if(bundle[bundle.length - 2].getProperty('class') == '' || bundle[bundle.length - 2].getProperty('class') == 's')
            bundle.getLast().setOpacity(0.3);
        else
            bundle.getLast().setOpacity(1);
    }
    function moveOne(bundle)
    {
        // if the last item (before the button) is visible, quit
        var cls = bundle[bundle.length - 2].getProperty('class')
        if(cls == '' || cls == 's')
            return;
            
        var lastLesson;
        var setHidden = false;
        var setShown = false;
        bundle.each(function(lesson) {
            if(lesson.getProperty('class') == 'btn') {
                return;
            }
            if(lesson.getProperty('class') == '' && !setHidden) {
                lesson.setProperty('class', 'hideL');
                setHidden = true;
                return;
            }
            if(lesson.getProperty('class') == 's' && !setHidden) {
                lesson.setProperty('class', 'hideS');
                setHidden = true;
                return;
            }
            if(lesson.getProperty('class') == 'hideL' && setHidden && !setShown) {
                lesson.setProperty('class', '');
                setShown = true;
            }
            if(lesson.getProperty('class') == 'hideS' && setHidden && !setShown) {
                lesson.setProperty('class', 's');
                setShown = true;
            }
        });
    }
    function moveRight()
    {
        if($defined(arrImg))
            loadImages();
        var bundle = $('bundle').getChildren();
        moveOne(bundle);
        setButtons();
    }
    function moveLeft()
    {
        if($defined(arrImg))
            loadImages();
        var bundle = $('bundle').getChildren();
        var rvrsBundle = reverseArray(bundle);
        moveOne(rvrsBundle);
        setButtons();
    }
    function reverseArray(array)
    {
        var i = 0;
        var bundle = new Array();
        while(array.length > 0) {
            bundle[i] = array.getLast();
            array.remove(array.getLast());
            i++;
        }
        return bundle;
    }
    function loadImages()
    {
        if(arrImg.length > 0) {
            arrImg.each(function(img){
               var loadedImg = new Asset.image(img[1]);
               $('i' + img[0]).setAttribute('src', loadedImg.src);
            });
        }
        arrImg = null;
    }