//뻬Ч,Ҫһװ,marginʵ

Fx.Slide = new Class({


 //̳Fx

 Extends: Fx,

 

 options: {

  mode: 'vertical'

 },

 

 //ǸFxͬ캯
 initialize: function(element, options){
  //onComplete¼,openԱǵֵ

  this.addEvent('onComplete', function(){

   this.open = (this.wrapper['offset' + this.layout.capitalize()] != 0);

   if (this.open && Browser.Engine.webkit419) this.element.dispose().inject(this.wrapper);

  }, true);
 
  //Чö

  this.element = this.subject = $(element);
 
  //øFxͬ

  arguments.callee.parent(options);

  //ȴӻȡǰöİװ

  var wrapper = this.element.retrieve('wrapper');
  //δ򴴽

  this.wrapper = wrapper || new Element('div', {

   styles: $extend(this.element.getStyles('margin', 'position'), {'overflow': 'hidden'})

  }).wraps(this.element);
  //

  this.element.store('wrapper', this.wrapper).setStyle('margin', 0);

  this.now = [];
  //״̬

  this.open = true;

 },


 //ֱ򻬶ʱĹؼ

 vertical: function(){
  //ֱʱҪʹmargin-top,öڰװڵĴֱλ

  this.margin = 'margin-top';
  //װĸ߶

  this.layout = 'height';
  //װڵĸ߶ֵ

  this.offset = this.element.offsetHeight;

 },

 

 //ˮƽ򻬶ʱĹؼ

 horizontal: function(){

  //ˮƽʱҪʹmargin-left,öڰװڵˮƽλ

  this.margin = 'margin-left';

  //װĿ

  this.layout = 'width';

  //װڵĿֵ

  this.offset = this.element.offsetWidth;

 },


 //Ŀֵ

 set: function(now){
  //öڰװڵˮƽֱλ

  this.element.setStyle(this.margin, now[0]);
  //ðװڵĿȻ߶ֵ

  this.wrapper.setStyle(this.layout, now[1]);

  return this;

 },


 //ݳʼֵֵͱĿֵ

 compute: function(from, to, delta){

  var now = [];
  //Rubyѭ,תΪfromtoǳΪ2

  (2).times(function(i){

   now[i] = Fx.compute(from[i], to[i], delta);

  });

  return now;

 },


 //ʼ

 start: function(how, mode){
  //Լ

  if (!this.check(how, mode)) return this;
  //òѡ񻬶ģʽ

  this[mode || this.options.mode]();
  //ȡǰöⲹֵ

  var margin = this.element.getStyle(this.margin).toInt();

  //ȡװĳߴ

  var layout = this.wrapper.getStyle(this.layout).toInt();
  //ʱĿֵ

  var caseIn = [[margin, layout], [0, this.offset]];

  //ʱĿֵ

  var caseOut = [[margin, layout], [-this.offset, 0]];

  var start;
  //ʽѡ

  switch (how){

   case 'in': start = caseIn; break;

   case 'out': start = caseOut; break;

   case 'toggle': start = (this.wrapper['offset' + this.layout.capitalize()] == 0) ? caseIn : caseOut;

  }

  return arguments.callee.parent(start[0], start[1]);

 },


 //Ŀݷ

 slideIn: function(mode){

  return this.start('in', mode);

 },

 

 //Ŀݷ

 slideOut: function(mode){

  return this.start('out', mode);

 },

 

 //ػ

 hide: function(mode){

  this[mode || this.options.mode]();
  //ʾصı

  this.open = false;

  return this.set([-this.offset, 0]);

 },

 

 //ʾ

 show: function(mode){

  this[mode || this.options.mode]();

  //ʾصı

  this.open = true;

  return this.set([0, this.offset]);

 },


 //
Ŀݷ
 toggle: function(mode){

  return this.start('toggle', mode);

 }

 

});


//ΪElementslide

Element.Properties.slide = {


 //setter

 set: function(options){
  //ӻȡڵǰElementFx.Slideʵ

  var slide = this.retrieve('slide');
  //дFx.Slideʵ
,ȡִ
  if (slide) slide.cancel();
  //Fx.Slideò

  return this.eliminate('slide').store('slide:options', $extend({link: 'cancel'}, options));

 },

 

 //getter

 get: function(options){
  //ṩò򲻴ڻFx.Sliderʵ

  if (options || !this.retrieve('slide')){
   //ò

   if (options || !this.retrieve('slide:options')) this.set('slide', options);
   //Fx.Slideʵ

   this.store('slide', new Fx.Slide(this, this.retrieve('slide:options')));

  }
  //ӻȡFx.Sliderʵ

  return this.retrieve('slide');

 }

 

};


//չslide

Element.implement({


 //ΪElementӵFx.Slideݷ

 slide: function(how, mode){
  //ָʽ

  how = how || 'toggle';
  //ȡеFx.Slideʵ

  var slide = this.get('slide'), toggle;
  //ͬʽĴ

  switch (how){

   case 'hide': slide.hide(mode); break;

   case 'show': slide.show(mode); break;

   case 'toggle':
    //ȴӻȡ״̬

    var flag = this.retrieve('slide:flag', slide.open);
    //ݱִл뻹ǻ

    slide[(flag) ? 'slideOut' : 'slideIn'](mode);
    //״̬

    this.store('slide:flag', !flag);
    //ִжhowĲֵΪtoggle,false,潫ɾı

    toggle = true;

   break;
   //Ĭϻʽ

   default: slide.start(how, mode);

  }
  //ûʹtoggleʽ,ɾı

  if (!toggle) this.eliminate('slide:flag');

  return this;

 }

 

});

