var carousel = {

    container: null,

    list: null,

    original_list_width: null,

    multiplied_list_width: null,

    items: [],

    prev_link: null,

    next_link: null,

    animating: null,

    current_slide: 0,

    slides_no: 0,

    last_photo_item: null,

    items_visible: 7,

    item_width: 200,

    si: null,

    update_interval: 50,

    carousel_width: 550,

    target_offset: 0,

    current_offset: 0,

    move_by_slide: false,

    move_by_items_no: 1,

    speed: 40,

    move_offset: 20,

    easing: false,





    setup: function(container_id) {



        this.container = $(container_id);

        if(!this.container) return;

        this.container_id = container_id;

        

        if(this.container_id == 'teaser') {

            this.item_width = 80;

            this.carousel_width = 800;

            this.items_visible = 7;

        } else if(this.container_id == 'collection') {

            this.item_width = 226;

            var body_width = $(document.getElementsByTagName('body')[0]).getWidth();

            $('main-content').addClassName('collection-loaded');

            this.carousel_width = body_width;

            this.items_visible = Math.floor(body_width/this.item_width);

            $('collection').setStyle({'width':body_width+'px'});

            $('collection-items').setStyle({'width':body_width+'px'});

        } else if(this.container_id == 'saved-wishlist') {

            this.item_width = 187;

            var body_width = $(document.getElementsByTagName('body')[0]).getWidth();

            $('main-content').addClassName('wishlist-loaded');

            this.carousel_width = body_width;

            this.items_visible = Math.floor(body_width/this.item_width);

            $('saved-wishlist').setStyle({'width':body_width+'px'});

            $('saved-wishlist-items').setStyle({'width':body_width+'px'});

		} else if(this.container_id == 'teaser-gallery') {

            this.item_width = 205;

            this.carousel_width = 610;

            this.items_visible = 3;

			

         } else {

            return;

        }

        

        this.container.addClassName('loaded');

        this.list = $(this.container).select('ul')[0];

        this.items = $(this.list).select('li');

        this.slides_no = Math.ceil(this.items.length/this.items_visible);



        this.original_list_width = this.items.length * this.item_width;

        this.multiplied_list_width = this.slides_no * this.carousel_width;

        this.list.style.width = this.multiplied_list_width  +'px';



        if(this.items.length <= this.items_visible) {

            if(this.container_id == 'collection' || this.container_id == 'saved-wishlist') {

                 this.list.style.width = this.original_list_width + 1 + 'px';

                 var margin_diff = Math.floor((this.multiplied_list_width - this.original_list_width)/2) + 'px';

                 this.list.style.marginLeft = margin_diff;

                 this.list.style.marginRight = margin_diff;

                 $(this.list).select('li')[0].style.borderLeft = '1px solid #e2e2e2';

                 this.removeControls();

            }



            return;

        } else {

            if(this.container_id == 'collection' || this.container_id == 'saved-wishlist') {

                this.list.style.marginLeft = '0px';

                this.list.style.marginRight = '0px';

                $(this.list).select('li')[0].style.borderLeft = '0';

             }

        }



        this.createControls();

   },

   

   insertFirstLast: function() {

        var first_li = document.createElement('li')

            first_li.className = 'first-child';

        var first_img = document.createElement('img')

            first_img.setAttribute('src', '/images/layout/first-photo.gif');

            first_li.appendChild(first_img);

            

        var last_li = document.createElement('li')

            last_li.className = 'last-child';

        var last_img = document.createElement('img')

            last_img.setAttribute('src', '/images/layout/last-photo.gif');

            last_li.appendChild(last_img);         

              

        

        $(this.container).select('ul')[0].insert({top:first_li});

        $(this.container).select('ul')[0].insert({bottom:last_li});



   },

   

   

   removeControls: function() {

        var current_controls = $(this.container).select('.controls')[0];

        if(current_controls) {

            $(current_controls).remove();

        }

   },

   

   createControls: function() {

        if($(this.container).select('.controls')[0]) return;

        

        var ul = document.createElement('ul');

            ul.className = 'controls';



        var prev_li = document.createElement('li');

            prev_li.className = 'prev';



        var prev_a = document.createElement('a');

            prev_a.className = 'prev';            

            prev_a.setAttribute('href', '#');

            

        var prev_img = document.createElement('img');

            prev_img.setAttribute('alt', 'Natrag');

            prev_img.setAttribute('title', 'Natrag');

            

            if(this.container_id == 'teaser') {

                prev_img.setAttribute('src', 'images/layout/teaser-arrow-prev.gif');

            } else if(this.container_id == 'collection') {

                prev_img.setAttribute('src', 'images/layout/collection-arrow-prev.png');

            } else if(this.container_id == 'saved-wishlist') {

                prev_img.setAttribute('src', 'images/layout/wishlist-arrow-prev.png');

			} else if(this.container_id == 'teaser-gallery') {

                prev_img.setAttribute('src', 'images/layout/teaser-arrow-prev.gif');

            }

                        

            prev_a.appendChild(prev_img);

            prev_li.appendChild(prev_a);

            ul.appendChild(prev_li);

            

        var next_li = document.createElement('li');

            next_li.className = 'next';



        var next_a = document.createElement('a');

            next_a.className = 'next';            

            next_a.setAttribute('href', '#');

            

        var next_img = document.createElement('img');

            next_img.setAttribute('alt', 'Naprijed');

            next_img.setAttribute('title', 'Naprijed');



            if(this.container_id == 'teaser') {

                next_img.setAttribute('src', 'images/layout/teaser-arrow-next.gif');

            } else if(this.container_id == 'collection') {

                next_img.setAttribute('src', '/images/layout/collection-arrow-next.png');

            } else if(this.container_id == 'saved-wishlist') {

                next_img.setAttribute('src', '/images/layout/wishlist-arrow-next.png');

            } else if(this.container_id == 'teaser-gallery') {

                next_img.setAttribute('src', '/images/layout/teaser-arrow-next.gif');

            }                       

            next_a.appendChild(next_img);

            next_li.appendChild(next_a);

            ul.appendChild(next_li);            

            

            this.container.appendChild(ul);

            



        Event.observe(prev_a, 'click', this.clickListener.bindAsEventListener(this), false);

        Event.observe(next_a, 'click', this.clickListener.bindAsEventListener(this), false);

            

            

   },



   clickListener: function(e) {

        if(window.event) {

            window.event.returnValue = false;

        } else {

            e.preventDefault();

        }



        var event = window.event ? window.event : e;

        var eventTarget = event.srcElement ? event.srcElement :  event.target;

        if(eventTarget.nodeName.toLowerCase() == 'img') {

            eventTarget = eventTarget.parentNode;

        }



        var direction = eventTarget.parentNode.className;

        if(!this.animating) {

            this.prepareScrolling(direction);

        }

   },

   



   prepareScrolling: function(direction) {



        if(direction == 'prev') {

            if(this.move_by_slide) {

                var requested_slide = this.current_slide - 1;

                if(requested_slide >= 0) {

                    this.target_offset = (this.current_slide-1) * this.carousel_width;

                    this.initMoving();

                    this.current_slide--;

                }

            } else {



                //--------------

                var items_prev_hidden = (this.current_offset / this.item_width);

                if(items_prev_hidden < this.move_by_items_no)  {

                    requested_offset = this.current_offset - (items_prev_hidden*this.item_width);

                } else {

                    var requested_offset = this.current_offset - (this.move_by_items_no * this.item_width);

                }

                //--------------



                if((this.container_id == 'collection' || this.container_id == 'saved-wishlist') && this.half_img_fix) {

                    requested_offset = requested_offset+this.half_img_fix-this.item_width;

                    this.half_img_fix = null;

                }





                if(items_prev_hidden > 0) {

                    this.target_offset = requested_offset;

                    this.initMoving();

                }

            }

        } else {

            if(this.move_by_slide) {

                var requested_slide = this.current_slide + 1;

                if(requested_slide < this.slides_no) {

                    this.target_offset = (this.current_slide+1) * this.carousel_width;

                    this.initMoving();

                    this.current_slide++;

                }

            } else {

                var items_prev_hidden = (this.current_offset / this.item_width);

                var items_next_hidden = this.items.length - items_prev_hidden - this.items_visible;

                

                if(items_next_hidden < this.move_by_items_no)  {

                    requested_offset = this.current_offset + (items_next_hidden*this.item_width);

                } else {

                    var requested_offset = this.current_offset + (this.move_by_items_no * this.item_width);

                }



                

                if((this.container_id == 'collection' || this.container_id == 'saved-wishlist') && items_next_hidden == 1) {

                    var img_part = this.carousel_width % (this.move_by_items_no * this.item_width);                    

                   

                    if(img_part < this.item_width) {

                        requested_offset -= img_part;

                        this.half_img_fix = img_part;

                    }

                }

                

                

                if(items_next_hidden >= 1) {

                    this.target_offset = requested_offset;

                    this.initMoving();

                }

            }

        }

   },



   initMoving: function() {

         this.animating = true;

         var o = this;

         this.si = setInterval( function() {o.moveCalculation();}, this.update_interval);

        //setTimeout(function() { o.animating = false; o.container.className = o.container.className += ' collapsed'; o.tabsClean()}, 700);

   },

   

   jumpTo: function(item_id) {

        var related_item = document.getElementById('wishlist-photo-item-' + item_id);



        if(this.animating) { return; }        

        

        var item_index = this.getIndex(related_item);

        var half_visible_index = Math.floor(this.items_visible/2);

        

        var items_prev_hidden = this.current_offset/this.item_width;

        var items_visible = items_prev_hidden + this.items_visible;



        if(item_index <= items_prev_hidden) {

            this.move_by_items_no = items_prev_hidden-item_index+1;

            this.prepareScrolling('prev');

        } 



        if(item_index > items_visible) {

            this.move_by_items_no = item_index-items_visible-1;

            this.prepareScrolling('next');

        } 

        

        related_item.addClassName('highlighted');

        if(this.last_photo_item != null) {

            this.last_photo_item.removeClassName('highlighted');

        }

        this.last_photo_item = related_item;

        

   },

   

   getIndex: function(related_item) {

    

        var position = null;

        var il = this.items.length;

        for(var i = 0; i < il; i++) {

            var current_item = this.items[i];

            if(current_item == related_item) {

                position = i;

                break;

            }

        }

        return position+1;

   },



   moveCalculation: function () {

        var diff = this.target_offset - this.current_offset;



        this.easing = true;

        if(diff > 0) {

            if(this.easing) {

                var step = this.move_offset;

                if(diff < this.move_offset) {

                    step = diff;

                }

            } else {

                var step = Math.ceil(diff/this.speed);

            }

        } else {

            if(this.easing) {

                var step = -this.move_offset;

                if(diff > step) {

                    step = diff;

                }

            } else {

                var step = Math.floor(diff/this.speed);

            }

        }



        if(step == 0) {

            clearInterval(this.si);

            this.animating = false;

            this.move_by_items_no = 1; 

        }



        this.current_offset += step;

        this.moveItems(step);

   },



   moveItems: function(current_step) {



        var il = this.items.length;

        for( var i = 0 ; i < il; i++ ) {

            var item_to_move = this.items[i];

            if( item_to_move.style.left ) {

                var new_offset = parseInt(item_to_move.style.left) - current_step + 'px';

            } else {

                var new_offset = - current_step + 'px';

            }

            item_to_move.style.left = new_offset;

            item_to_move.style.position = 'relative';

        }



   }



}
