
function SC(id, vis) {
  this.sc_id = id;
  this.tabs_cont = $(this.sc_id+' .tabs-container');
  this.tabs_list = $(this.sc_id+' .tabs-list');
  this.tabs_item = $(this.sc_id+' .tabs-item');
  this.tabs_nav_up = $(this.sc_id+' .tabs-nav-up');
  this.tabs_nav_down = $(this.sc_id+' .tabs-nav-down');

  this.canvas_list = $(this.sc_id+' .canvas-list');
  this.canvas_item = $(this.sc_id+' .canvas-item');
  this.canvas_nav_left = $(this.sc_id+' .canvas-nav-left');
  this.canvas_nav_right = $(this.sc_id+' .canvas-nav-right');
  this.canvas_width = 0;

  this.visible_tabs = 9;
  this.item_count = 0;
  this.visi_median = Math.ceil(this.visible_tabs/2);
  this.tabs_height = 0;
  this.canvas_current = 1;


  this.getItemCount = function() {
    count = 0;
    this.tabs_list.find('li').each(function() {
      count++;
    });
	if (count %2 ==0)
	{
		return count+1;
	}
	  {
    return count;
	  }
  };

  this.slide_canvas = function(n) {
    $(this.sc_id+' .tabs-selected').removeClass('tabs-selected');
    $(this.sc_id+' .tabs-item-'+n).addClass('tabs-selected');

    $(this.sc_id+' .canvas-nav-left').removeClass('canvas-nav-inactive');
    $(this.sc_id+' .canvas-nav-right').removeClass('canvas-nav-inactive');
    if (n == 1) {
      $(this.sc_id+' .canvas-nav-left').addClass('canvas-nav-inactive');
    }
    if (n == this.item_count) {
      $(this.sc_id+' .canvas-nav-right').addClass('canvas-nav-inactive');
    }

    var canvas_left = -this.canvas_width * (n-1);
    this.canvas_list.animate({'left': canvas_left}, 200);


    var top = 0;
    if (n <= this.visi_median) {
      top = 0 * -this.tabs_height;
    }
    if (this.visi_median < n && n <= this.item_count-this.visi_median) {
      top = (n - this.visi_median) * -this.tabs_height;
    }
    if (this.item_count-this.visi_median < n) {
      top = ((this.item_count - this.visi_median) - this.visi_median + 1) * -this.tabs_height;
    }
    this.tabs_list.animate({'top': top}, 200);

	console.log(top);

  };

  this.load_current = function() {
    var current_hash = window.location.hash;
    var pathRE = /#([0-9]+)$/;
    if (pathRE.test(current_hash)) {
      var current = current_hash.replace(pathRE, "$1");
      this.slide_canvas(current);
      this.canvas_current = current;
    }
  }

  this.init = function() {
    this.item_count = this.getItemCount();
//    this.visible_tabs = (this.visible_tabs%2 == 0) ? this.visible_tabs-1 : this.visible_tabs;
    this.visible_tabs = (this.item_count > 9) ? 9 : this.item_count;
	this.visible_tabs = (this.visible_tabs%2 == 0) ? this.visible_tabs-1 : this.visible_tabs;
	this.visi_median = Math.ceil(this.visible_tabs/2);

    this.tabs_height = this.tabs_item.height();
    this.tabs_list.height(this.tabs_height * this.item_count);
    this.tabs_cont.height(this.tabs_height * this.visible_tabs);

    this.canvas_width = this.canvas_item.width();
    this.canvas_list.width(this.canvas_width * this.item_count);

    if (this.item_count == this.visible_tabs) {
      this.tabs_nav_up.css({'display': 'none'});
      this.tabs_nav_down.css({'display': 'none'});
	  
    }


//  Events
    var self = this;
    this.canvas_nav_left.click(function() {
      self.canvas_current--;
      if (self.canvas_current >= 1) {
        self.slide_canvas(self.canvas_current);
        return false;
      }
      if (self.canvas_current < 1) {
        self.canvas_current = 1;
        return false;
      }
    });

    var self = this;
    this.canvas_nav_right.click(function() {
      self.canvas_current++;
	 
      if (self.canvas_current <= self.item_count) {
        self.slide_canvas(self.canvas_current);
        return false;
      }
      if (self.canvas_current > self.item_count) {
        self.canvas_current = self.item_count;
        return false;
      }
    });


    var self = this;
    this.tabs_nav_up.click(function () {
      self.canvas_current--;
      if (self.canvas_current >= 1) {
        self.slide_canvas(self.canvas_current);
        return false;
      }
      if (self.canvas_current < 1) {
        self.canvas_current = 1;
        return false;
      }
    });

    var self = this;
    this.tabs_nav_down.click(function() {
      self.canvas_current++;
      if (self.canvas_current <= self.item_count) {
        self.slide_canvas(self.canvas_current);
        return false;
      }
      if (self.canvas_current > self.item_count) {
        self.canvas_current = self.item_count;
        return false;
      }
    });

    var self = this;
    this.tabs_item.find('a').click(function() {
      self.canvas_current = $(this).attr('rel');
      self.slide_canvas(self.canvas_current);
    });

  };



  this.init();
  this.load_current();

}

