window.addEvent('domready', function(){
  if($('cat_links'))
  {
    $('cat_links').getElements('a[id^=cat_]').each(function(item){
      new SlideBox(item);
    });
      
    var options = {
       'scrollDuration'  : 1000
      ,'scrollerWidth'   : 379
      ,'ajaxRequest'     : true
      ,'ajaxRequestUrl'  : site_base+'/ajax/'
      ,'ajaxRequestHash' : {'module':'articles'}
      ,'ajaxReplaceId'   : 'old_link_list'
    }
      $$('.js_paging').each(function(element, index){
        new Paging(element, options);
      });
  }
});


var SlideBox = new Class({
  Implements : Options,
  options : {
    
  },
  sliders : [],
  initialize: function(element, options){
    this.setOptions(options);
    this.cat = element;
    this.addSlider(element);
    var requestOptions = {
        'url':site_base+'/ajax/'
      , 'method':'post'
    }
    this.pageRequest = new Request(requestOptions);
    this.pageRequest.onSuccess = this.processAjaxRequest.bind(this);
  },
  addSlider: function(element){
    this.cat_id = this.getCatId(element.getProperty('id'));
    this.slider = new Fx.Slide('links_' + this.cat_id);
    if(!this.cat.hasClass('active'))
    {
      this.slider.hide();
    }
    else
    {
      this.slider.show();
    }
    element.addEvent('click', this.handleClick.bindWithEvent(this));   
  },
  handleClick: function(e) {
    new Event(e).stop();
    if(this.slider.open)
    {
      this.slider.slideOut();
      this.cat.removeClass('active');
    }
    else
    {
      this.pageRequest.send($H({'module':'articles','category':this.cat_id}).toQueryString());
    }
  },
  getCatId: function(cat)
  {
    return cat.substring(4);
  },
  processAjaxRequest: function(responseText, responseXML){
    var links = $('links_'+this.cat_id);
    links.set('html', responseText);
    links.setStyle('visibility','visible');
    this.cat.addClass('active');
    this.slider.slideIn();
  }
});