var Chart = new Class({
  initialize: function(pid, small, options){
    this.small = small
    this.pid = pid.toInt()
    this.options = $merge({h:(small ? 400: 640), w:(small ? 300 : 480)}, options || {})
    this.attr = $('attributes').get('value')
    if(this.attr == 'cloud')
      this.attr = 'describe'
    this.name = 'chart'+pid
    this.swiff = new Swiff('/charts.swf', {
      vars: {
        library_path: '/charts_library',
        xml_source: this.url()
      },
      width: this.options.w,
      height: this.options.h,
      id: this.name,
      properties: {
        name: this.name
      }
    })
    this.wrapper = new Element('div').adopt([this.swiff, this.options.dl || new Element('dl', {id:'stats'+this.pid, 'class':'stats'})])
    this.wrapper.inject('chart')
    if($('attributes').get('value') == 'cloud')
      this.wrapper.setStyle('display', 'none')
  },
  replace: function(small, pid) {
    var dl = this.wrapper.getElement('dl') || new Element('dl', {'class':'stats'}).inject(this.wrapper)
    dl.set('id', 'stats'+pid)
    this.wrapper.dispose()
    return new Chart(pid || this.pid, small, {dl:dl})
  },
  url: function() {
    var params = $merge({pid:this.pid, attr:this.attr}, (this.small ? {small: this.small} : {}))
    return '/stats/chart.xml?'+Hash.toQueryString(params)
  },
  update: function(attr) {
    this.attr = attr
    var poo = function(){
      document[this.name].SetVariable('update_url', this.url())
    }.delay(500, this) 
  }
})