function MultiPane(obj) {this.create(obj);}

//constructor=================================================================== 
MultiPane.prototype.create = function(obj) {
  var params = obj;
  var instance = this;
  
  //vars-------------------------------------------------
  var instance = this;
  this.numChildren = 0;
  this.curIndex = 0;
  this.curPercent = 0;
  
  //show params-------------------------------------------------
  function showParams() {
    var params_str = '';
    for(var p in params){
      params_str += p+'=>'+params[p]+', ';
    }
    alert(params_str);
  }
  //showParams();
  
  //params-------------------------------------------------
  
  //get
  this._target = params.target;
  this._item = params.item;
  this._active = params.active;
  this._type = params.type;
  this._snap = params.snap;
  this._animation = params.animation;
  this._speed = params.speed;
  this._direction = params.direction;
  this._onActivate = params.onActivate;
  
  //defaults
  if (this._trigger==undefined) {this._trigger='click';}
  if (this._item==undefined) {this._item='.item';}
  if (this._active==undefined) {this._active=0;}
  if (this._type==undefined) {this._type='toggle';}
  if (this._snap==undefined) {this._snap='content';}
  if (this._animation==undefined) {this._animation='show';}
  if (this._speed==undefined) {this._speed='default';}
  if (this._direction==undefined) {this._direction='h';}
  if (this._onActivate==undefined) {this._onActivate=function(){}}
  
  //set other vars-------------------------------------------------
  this._paneWidth = $(this._target).width();
  this._paneHeight = $(this._target).height();
  
  //set container direction
  if (this._direction=='h') {$(this._target+' .mp_container').css('width','9999px');}
  
  //get number of content items
  this.numChildren = $(this._target+' .mp_container '+this._item).length;
  
  //totalContentWidth/Height
  this.totalContentWidth = (this._direction=='h') ?
    $(this._target+' .mp_container '+this._item).width() * this.numChildren :
    $(this._target+' .mp_container '+this._item).width();
  this.totalContentHeight = (this._direction=='v') ?
    $(this._target+' .mp_container '+this._item).height() * this.numChildren :
    $(this._target+' .mp_container '+this._item).height();
  
  //snapping
  if (this._snap=='content') {
    if (this._direction=='h'){this._snap = this._paneWidth;}
    if (this._direction=='v'){this._snap = this._paneHeight;}
  }
  
  //prepare-------------------------------------------------
  if(this._type=='accordion'){
    //close content panes
    var openSize =  $(this._target+' .mp_container '+this._item).height();
    $(this._target+' .mp_container '+this._item).attr('_openSize',openSize);
    $(this._target+' .mp_container '+this._item).css('height','0px');
    //evt:mousedown
    $(this._target+' .mp_container h4').each(function(i){
      $(this).attr('_index',i);
    });
    $(this._target+' .mp_container h4').bind('mousedown',function(e){
      instance.activate($(this).attr('_index'));
    });
  }
  
  //auto activate-------------------------------------------------
  this.activate(this._active);
  
  //show objects-------------------------------------------------
  function show(obj) {
    var str = '';
    for(var p in obj){
      var val = obj[p];
      if ( typeof(obj[p]) == 'function' ) {
        val = 'function';
      }
      str += p+'=>'+val+'\n';
    }
    alert(str);
  }
  //show(instance);
}

//methods & properties===================================================================
MultiPane.prototype.activate = function(index){
  
  //never re-activate what's already been activated...
  if (this.curIndex != index) {
    this.curIndex = index;
    this.curPercent = index/(this.numChildren-1);
    
    //toggle
    if (this._type=='toggle') {
      //show
      if (this._animation=='show'){
        $(this._target+' .mp_container '+this._item).hide();
        $(this._target+' .mp_container '+this._item).eq(index).show();
      }
      
      //fade
      if (this._animation=='fade'){
        $(this._target+' .mp_container '+this._item).hide();
        $(this._target+' .mp_container '+this._item).eq(index).fadeIn(this._speed);
      }
    }
    
    //slider
    if (this._type=='slider') {
      
      //direction
      var dirX = 0;
      var dirY = 0;
      if (this._direction=='h'){dirX=1}
      if (this._direction=='v'){dirY=1}
      var toX = (index*this._paneWidth) *-1*dirX;
      var toY = (index*this._paneHeight) *-1*dirY;
      
      //slide
      $(this._target+' .mp_container').stop();
      $(this._target+' .mp_container').animate({
        left:toX,
        top:toY
      },this._speed);
    }
    
    //accordion
    if (this._type=='accordion') {
      //hide the rest
      $(this._target+' .mp_container '+this._item).stop(true);
      $(this._target+' .mp_container '+this._item).animate({height:'0px'},this._speed,'linear');
      //show selected
      var openSize = $(this._target+' .mp_container '+this._item).eq(index).attr('_openSize');
      $(this._target+' .mp_container '+this._item).eq(index).stop(true);
      $(this._target+' .mp_container '+this._item).eq(index).animate({height:openSize+'px'},this._speed,'linear');
    }
    
    //callback
    this._onActivate();
  }
}
MultiPane.prototype.slide = function(percent) {
  var dirX = 0;
  var dirY = 0;
  if (this._direction=='v'){dirY=1}
  if (this._direction=='h'){dirX=1}
  
  var maxX = this.totalContentWidth - this._paneWidth;
  var maxY = this.totalContentHeight - this._paneHeight;
  var toX = (maxX * percent) *-1*dirX;
  var toY = (maxY * percent) *-1*dirY;
  
  //snapping
  if (this._snap) {
    var snapFix = this.numChildren/(this.numChildren-1);
    toX = Math.ceil( (toX*snapFix)/this._snap )*this._snap;
    toY = Math.ceil( (toY*snapFix)/this._snap )*this._snap;
    if ( (toX*-1) > maxX) {toX=maxX*-1}
    if ( (toY*-1) > maxY) {toY=maxY*-1}
  }
  
  //set index
  var newIndex = Math.floor( percent*snapFix*(this.numChildren-1) );
  if ( newIndex > (this.numChildren-1) ){newIndex=this.numChildren-1}
  var oldIndex = this.curIndex;
  this.curIndex = newIndex;
  
  //index change?
  var indexChange = false
  if (oldIndex != newIndex) {
    indexChange = true;
  }
  
  //snap=false? set to position
  if (!this._snap) {
    $(this._target+' > div').css({
      left:toX,
      top:toY
    });
  }
  
  //snap=true? animate to position
  if (this._snap && indexChange) {
    $(this._target+' .mp_container ').stop();
    $(this._target+' .mp_container ').animate({
      left:toX,
      top:toY
    });
  }
  
  //callback
  if (indexChange) {
    this._onActivate();
  }
}
MultiPane.prototype.advance = function(direction){ //+1 or -1
  var index = this.curIndex+direction;
  if (index > this.numChildren-1){index=0}
  if (index < 0){index=this.numChildren-1}
  this.activate(index);
}
