$.fn.itemStrip = function(options){
    
    var itemStrip = this;

    if (!itemStrip.length) {
        return false;
    }

    var defaults = {
        arrLeft: false,// object of left arrow
        arrRight: false,// object of right arrow
        
        itemsToScrollX: 0,
        addScrollToX: 0,// this value increase scroll width
        
        visibleItemsX: 0, // number of items that user can see on a time

        duration: 'slow',// daration of item's movement
        animateParam: 'margin-',// wich css param to use for itemStrip movement (ex.: margin-left: -20px or left: -20px)
        itemFilter: '> div'// how to find item object from itemStrip
    };
    
    // creating a common settings
    var settings = jQuery.extend({}, defaults, options);
    itemStrip.settings = settings;
    
    /* gathering errors for alert */
    var error = 'itemStrip Error:\n';
    var showError = false;
    
    if(!itemStrip.settings.itemsToScrollX){
        showError = true;
        error += 'You must set the "itemsToScrollX" option to a non-zero value \n';
    }

    if(!itemStrip.settings.visibleItemsX){
        showError = true;
        error += 'You must set the "visibleItemsX" option to a non-zero value \n';
    }
    
    if(showError){
        alert(error);
    }
    /* end of error alert */


    // binding a click event for objects
    if(itemStrip.settings.arrLeft){
        itemStrip.settings.arrLeft.click(function(){ itemStrip.move('right') });
    }
    if(itemStrip.settings.arrRight){
        itemStrip.settings.arrRight.click(function(){ itemStrip.move('left') });
    }
        

    
    // How many items do we have?
    itemStrip.totalItems = itemStrip.find(itemStrip.settings.itemFilter).length;
    
    // Object of first item
    itemStrip.firstItem = itemStrip.find(itemStrip.settings.itemFilter).filter(':first');
    
    if(itemStrip.settings.itemsToScrollX){
        // horizontal displacement of itemStrip after click
        // We must use onload because element's width will change after it's content will be loaded (images for example)
        $(window).bind('load', function(){
            itemStrip.scrollWidthX = itemStrip.getScrollWidth(itemStrip.settings.itemsToScrollX);
            //FIRE!!!
            itemStrip.checkEnd();
        });
        
    }

    
    return itemStrip;
    
}




// METHODS

/*
    Calculates width in px to move strip based on items count
*/
$.fn.getScrollWidth = function(itemsToScroll){
    return itemsToScroll * (this.firstItem.get(0).offsetWidth + this.settings.addScrollToX);
}


/*
    Checks if there are items behind the sides
*/
$.fn.checkEnd = function(){

    if(this.scrollWidthX){// if exists x-scroll
    
        var behindLeftSide = this.itemsLeft('left');
        //TODO: если остаются два элемента, а скролят по три штуки за раз - тогда стрелочку все равно спрячет
        if(behindLeftSide>0){
            this.settings.arrLeft.css('visibility','visible');
        }else{
            this.settings.arrLeft.css('visibility','hidden');
        }

        var behindRightSide = this.itemsLeft('right');
        if(behindRightSide > 0){
            this.settings.arrRight.css('visibility','visible');
        }else{
            this.settings.arrRight.css('visibility','hidden');
        }
    }

}


/*
    Counts how many items left behind the side
*/
$.fn.itemsLeft = function(side){

    var itemsLeftCount = 0;// remaining items behind the visible area
    var itemStrip_shift = -(parseInt(this.css(this.settings.animateParam + side)));

    switch(side){
        case 'left':    itemsLeftCount = Math.round(itemStrip_shift / (this.scrollWidthX / this.settings.itemsToScrollX));
                        break;

        case 'right':   itemsLeftCount = this.totalItems - this.settings.visibleItemsX - this.itemsLeft('left');
                        break;
                        
    }
    
    return itemsLeftCount;
}


/*
    Moves strip with animation effects
*/
$.fn.move = function(side, itemsToMove, callback){
    callback = callback || new Function;
    var $this = this;
    var animateProperties = {};
    if (itemsToMove == undefined) {
        var scroll_width = this.scrollWidthX;
    } else {
        var scroll_width = this.getScrollWidth(itemsToMove);
    }
    
    
    switch(side){
        case 'left':    var prefix = '-';
                        break;
                        
        case 'right':   var prefix = '+';
                        side = 'left';
                        break;
    }

    animateProperties[this.settings.animateParam+side] = prefix + "=" + scroll_width + "px";
    this.animate(animateProperties, this.settings.duration, function(){$this.checkEnd(); callback(); } );

}

/*
    index begins from 1, not from 0
    returns frame object
*/
$.fn.getFrameByPosition = function(position){
    index = --position;
    return this.find(''+ this.settings.itemFilter+ ':eq('+ index +')');
}

$.fn.positionFromBegin = function(frame){
    var behindLeftSide = this.itemsLeft('left');
    var framePosition = frame.prevAll().length + 1;
    return behindLeftSide - framePosition;
}

$.fn.putFrameToPosition = function(frame, position, callback){
    callback = callback || new Function;
    var fromBegin = this.positionFromBegin(frame);
    var itemsToMove = fromBegin + position
    itemStrip.move('right', itemsToMove, callback);
}