var Ariel = {}
Element.extend({
  hide: function() {
    this.setStyle('display','none');
    return this;
  },
  show: function() {
    this.setStyle('display','');
    return this;
  },
  toggle: function() {
    if (this.getStyle('display')=='none') {
      this.show();
    }
    else {
      this.hide();
    }
  },
  loadContent: function(url,options) {
    new Ajax(url,Object.extend({
      update:this
    },options || {})).request();
  }
  ,
  effectChain: function(property,options) {
    var fx = new Fx.Style(this,property,options);
    var start = arguments[2] || this.getStyle(property);
    fx.chain(fx.start.pass([start,arguments[3]],fx));
    for (var i=4,l=arguments.length; i<l; i++) {
      fx.chain(fx.start.pass(arguments[i] || start,fx));
    }
    if (options && options.onChainComplete) {
      fx.chain(options.onChainComplete.pass(this,10));
    }
    return fx;
  },
  effectsChain: function(options) {
    var fx = new Fx.Styles(this,options);
    for (var i=1,l=arguments.length; i<l; i++) {
      fx.chain(fx.start.pass(arguments[i],fx));
    }
    if (options && options.onChainComplete) {
      fx.chain(options.onChainComplete.pass(this,10));
    }
    return fx;
  },
  highlight: function(options){
    var color = new Color(this.getStyle('background-color'));
    if (!color) return;
    color = color.setBrightness(100);
    this.effectChain('background-color',options,null,color.rgbToHex(),null).callChain();
  },
  disapear:function(options) {
    options = options || {};
    options.onComplete = function(element) {element.setStyle('display','none')};
     this.effects(options).start({'height':1,'width':1,'opacity':0});
  },
  loadOptions: function(url, options) {
    if (this.getTag() != 'select') return;
    this.loadingOptions = true;
    this.options.length = 0;
    options = Object.extend({
      onComplete :function(response){
        var data = response.data;
        for (var i=0,l=data.length; i<l; i++) {
         var option = data[i];
         this.options[this.options.length] = new Option(option.text,option.value,option.defaultSelected,option.selected);
        }
        this.loadingOptions = null;
        if (options.onAfterLoad) options.onAfterLoad.call(this,response);
        if (this.onchange && options.cascade) this.onchange();
      }.bind(this)},options || {});
    if(options.onBeforeLoad) options.onBeforeLoad.call(this)
    new Json.Remote(url,options).send(); 
  },
  surroundWith:function(tagName,properties,styles) {
    var tag = new Element(tagName);
    if (properties) tag.setProperties(properties);
    if (styles) tag.setStyles(styles);
    this.replaceWith(tag);
    tag.adopt(this);
    return this;
  }
});