/**************************************************************

  Script    : corners
  Version   : 0.2
  Authors   : Nicolas Charpotier
  Desc      : Ajoute les éléments permettant de la création de bords arrondis grâce aux styles css.
              Evite de surcharger le code avec des balises utilisés pour de la mise en forme (meilleur séparation contenu/forme)
              Non obstrusif : bords droits si javascript non activé.
  Licence   : Open Source MIT Licence


**************************************************************/

var corners = new Class({

  Implements: [Options, Events],

  options: {
    elementType: 'div',
    // type des élément générés
    className: 'corner' // préfixe des classes des élément générés ex : corner-t,corner-b,corner-bl etc...
  },

  initialize: function(els, options) {
    this.setOptions(options);
    if ($type(els) == 'element') //un seul élément modifié
    this.construct(els);
    else {
      els.each(function(el) { //plusieurs éléments modifiés
        this.construct(el);
      },
      this);
    }
  },

  construct: function(el) {
    var divContent = el.get('html'),
    paddingTmp = el.getStyle('padding').split(' '),
    //récupération de la valeur du padding de l'élément modifié pour l'appliquer au dernier élément généré
    paddingValue = new Array(),
    overflow = el.getStyle('overflow'),
    //récupération de la valeur de l'overflow de l'élément modifié pour l'appliquer au dernier élément généré
    elWidth = el.getSize().x,
    //on récupère la largeur réelle de l'élément modifié (et non pas la valeur css où les valeurs de padding sont soustraites)
    bordersWidth = el.getStyle('border-width').split(' '),
    //on récupère aussi la taille des bordures pour l'inclure dans le padding généré
    elWidthCss = el.getStyle('width'),
    // largeur en css pour l'appliquer au dernier élément généré (pour IE6,bug Width non définie / clear float)
    cornerT,
    cornerB,
    cornerR,
    cornerL,
    cornerBL,
    cornerBR,
    cornerTL,
    cornerTR;
    bordersWidth.each(function(item, index) {
      paddingValue[index] = paddingTmp[index].toInt() + item.toInt() + 'px'; //addition des mages intérieures et des bordures
    },
    this);
    paddingValue = paddingValue.join(' ');
    el.erase('html');
    el.setStyles({
      'padding': '0',
      'border': 'none'
    }); // supression des styles de l'élément modifié
    cornerT = new Element(this.options.elementType, {
      'class': this.options.className + '-t',
      'styles': {
        'display': 'block'
      }
    });
    cornerB = new Element(this.options.elementType, {
      'class': this.options.className + '-b',
      'styles': {
        'display': 'block'
      }
    });
    cornerR = new Element(this.options.elementType, {
      'class': this.options.className + '-r',
      'styles': {
        'display': 'block'
      }
    });
    cornerL = new Element(this.options.elementType, {
      'class': this.options.className + '-l',
      'styles': {
        'display': 'block'
      }
    });
    cornerBL = new Element(this.options.elementType, {
      'class': this.options.className + '-bl',
      'styles': {
        'display': 'block'
      }
    });
    cornerBR = new Element(this.options.elementType, {
      'class': this.options.className + '-br',
      'styles': {
        'display': 'block'
      }
    });
    cornerTL = new Element(this.options.elementType, {
      'class': this.options.className + '-tl',
      'styles': {
        'display': 'block'
      }
    });
    cornerTR = new Element(this.options.elementType, {
      'class': this.options.className + '-tr',
      'html': divContent,
      'styles': {
        'padding': paddingValue,
        'overflow': overflow,
        'display': 'block',
        'width': elWidthCss
      }
    }); // insertion du contenu et application des styles pour le dernier élément généré
    cornerT.inject(el, 'top');
    cornerB.inject(cornerT, 'top');
    cornerR.inject(cornerB, 'top');
    cornerL.inject(cornerR, 'top');
    cornerBL.inject(cornerL, 'top');
    cornerBR.inject(cornerBL, 'top');
    cornerTL.inject(cornerBR, 'top');
    cornerTR.inject(cornerTL, 'top');
    el.setStyle('width', elWidth + 'px'); //on redimmensionne l'élément pour que sa taille soit identique une fois modifié
  }
});