var active = 'Active';
var attr = 'lang';

$(function(){
    
    vocab = $('#Vocab');
    vocab.oneItemSlider({
        'terms': '.termen span span',
        'arrPrev': vocab.find('.termen a:eq(0)'),
        'arrNext': vocab.find('.termen a:eq(1)')
    });
    
    
})

$.fn.oneItemSlider = function(options){

    var slider = $(this);
    var defaults = {

    };
    $.extend(slider, defaults, options);

    slider.arrPrev.click(function(e){
        e.preventDefault();
        slider.changeTerm('prev');
    });

    slider.arrNext.click(function(e){
        e.preventDefault();
        this.blur();
        slider.changeTerm('next');
    });
    
    // fire !!!
    slider.changeTerm();

}

$.fn.changeTerm = function(mode){
    
    var $this = $(this);
    var currentTerm = this.currentTerm();
    
    currentTerm.hideTerm();
    
    switch (mode) {
        case 'next':    currentTerm.next().showTerm();
            break;

        case 'prev':    currentTerm.prev().showTerm();
            break;

        default:        currentTerm.showTerm();
            break;
    }
    
    this.manageArrows();
}

$.fn.manageArrows = function(){
    if ( this.currentTerm().next().length < 1) {
        this.arrNext.invisible();
    } else {
        this.arrNext.visible();
    }

    if ( this.currentTerm().prev().length < 1) {
        this.arrPrev.invisible();
    } else {
        this.arrPrev.visible();
    }
}

$.fn.showTerm = function(){
    var $this = $(this);
    var query = $this.attr(attr);
    var desc = $(query);
    
    $this.addClass(active);
    desc.addClass(active);
}
$.fn.hideTerm = function(){
    var $this = $(this);
    var query = $this.attr(attr);
    var desc = $(query);
    
    $this.removeClass(active);
    desc.removeClass(active);
}

$.fn.currentTerm = function(){
    var activeTerm = this.find(this.terms+'.'+active);
    var currentTerm = activeTerm.length ? activeTerm : this.find(this.terms+':first');
    return currentTerm;
}

$.fn.visible = function(){
    return this.each(function(){
        var $this = $(this);
        $this.css('visibility', 'visible');
    });
}
$.fn.invisible = function(){
    return this.each(function(){
        var $this = $(this);
        $this.css('visibility', 'hidden');
    });
}




