Synnefo

/*        

        // for the carousel index

        indicate_step: function(step) {

                $('.wizard .top .sub-menu[data-step]').hide();

                $('.wizard .top .sub-menu[data-step='+step+']').fadeIn();

        },

}

*/

/*

kpap:

Πώς κάνω extend κάτι;

Πχ θέλω στο carousel να ενσωματώσω το πάνω μενου...

*/

/*

Wrapper element must have set width and overflow hidden properties;

Item elements should have no margin

*/

function Carousel(options) {

        var defaults = {

                'wrapper': $('.carousel-wrapper'),

                'container': $('.carousel-container'),

                'item': $('.carousel-item'),

                'next': $('.carousel-next'),

                'prev': $('.carousel-prev'),

                'speed': 1000,

                'current_step': 1,

                // αυτά δεν τα θέλω εδώ

                'cancel_text': 'CANCEL',

                'previous_text': 'PREVIOUS',

                'submit_text': 'SUBMIT',

                'next_text': 'NEXT',

        }

        this.options = _.defaults(options,defaults);

        // TODO with _.map

        this.wrapper = options.wrapper;

        this.container = options.container;

        this.item = options.item;

        this.next = options.next;

        this.prev = options.prev;

        this.speed = options.speed;

        this.cancel_text = options.cancel_text;

        this.previous_text = options.previous_text;

        this.submit_text = options.submit_text;

        this.next_text = options.next_text;

        this.current_step = options.current_step;

        this.total_items = this.item.length;

        this.initEvents();

}

Carousel.prototype.alterNav = function () {

        var self = this;

        this.prev.find('span').html(this.previous_text);

        this.next.find('span').html(this.next_text);

        if ( this.current_step == 1) {

                self.prev.find('span').html(self.cancel_text);

        }

        else if (this.current_step == this.total_items ) {

                self.next.find('span').html(self.submit_text);

        }

        $('.nums').children('li').removeClass('current');

        $('.nums li:nth-child('+self.current_step+')').addClass('current');

}

Carousel.prototype.alterSubMenu = function () {

        $('.wizard .top .sub-menu[data-step]').hide();

        $('.wizard .top .sub-menu[data-step='+this.current_step+']').fadeIn();

}

Carousel.prototype.resetForm = function () {

        console.log('dummy form reset');

}

Carousel.prototype.submitForm = function () {

        console.log('dummy form submit');

}

Carousel.prototype.closeOverlay = function () {

        $('.overlay-area, .overlay-div').hide();

}

Carousel.prototype.setDimensions = function (){

        this.wrapper.css('width', 100*this.total_items+'%');

        this.container.find(this.item).css('width', 100/this.total_items+'%');

}

Carousel.prototype.move = function () {

        var percentage = -(this.current_step-1)/this.total_items*100+'%';

        this.container.stop().animate({ 'left': percentage }, this.speed);

        this.alterNav();

        this.alterSubMenu();

}

// if is_clicked is true, -duh- something has been clicked

Carousel.prototype.moveNext = function (is_clicked) {

        var self = this;

        if (this.current_step < this.total_items) {

                self.current_step = self.current_step + 1;

                self.move();

        } else {

                if (is_clicked) {

                        self.closeOverlay();

                        self.submitForm();                        

                }

        }

} 

// if is_clicked is true, -duh- something has been clicked

Carousel.prototype.movePrev = function (is_clicked) {

        var self = this;

        if (this.current_step > 1) {

                this.current_step = this.current_step - 1;

                self.move();

        } else {

                if (is_clicked) {

                        self.closeOverlay();

                        self.resetForm();                        

                }

        }

} 

Carousel.prototype.initEvents = function () {

        var self = this;

        this.setDimensions();

        this.next.click(function(e){

                e.preventDefault();

                self.moveNext(true);

        })

        this.prev.click(function(e){

                e.preventDefault();

                self.movePrev(true);

        })

        $('body').keydown(function(e) {

          if(e.keyCode == 37) { // left

                  e.preventDefault();

            self.movePrev(false);

          }

          else if(e.keyCode == 39) { // right

                  e.preventDefault();

            self.moveNext(false);

          }

          else if(e.keyCode == 27) { // ESC

                  e.preventDefault();

                  self.closeOverlay();

          }

        });

}

$(document).ready(function(){ 

        carousel_options = { 

                'wrapper': $('.wizard-content'),

                'container': $('.vm-wizard-carousel'),

                'item': $('.step'),

                'next' : $('.bottom').find('.nav.next'),

                'prev' : $('.bottom').find('.nav.prev'),

        }

        $('.wizard-content').width($(window).width());

        var carousel = new Carousel(carousel_options);

});