/*
 *  Rounded-images version 1.0
 *  (c) 2009 Sander de Goeij <s.degoeij@sixweb.nl>
 *
 *  Rounded-images is freely distributable under the terms of an MIT-style license.
 *
 *  TODO: images without a border don't work except in Firefox
 *
 *--------------------------------------------------------------------------*/

if (typeof Class == 'undefined')
{
  throw("You must have the prototype library to use rounded images");
}

var RoundedImages = Class.create({
  initialize: function(path, imageSize) {

    $$('img[class~="rounded-images"]').each(function(object, index) {

      var borderWidth = (object.style.borderTopWidth != '') ? parseInt(object.style.borderTopWidth) : 0;
      var borderStyle = (object.style.borderTopStyle != '') ? object.style.borderTopStyle : 'solid';
      var borderColor = (object.style.borderTopColor != '') ? object.style.borderTopColor : '#ffffff';
      var positionTop = (object.style.borderTopWidth != '') ? object.height - imageSize + parseInt(object.style.borderTopWidth) : object.height - imageSize;
      var topOffset = (object.style.borderTopWidth != '') ? '-' + parseInt(object.style.borderTopWidth) : 0;
      var bottomOffset = (object.style.borderTopWidth != '') ? imageSize + parseInt(object.style.borderTopWidth) : imageSize;

      object.replace('<div class="rounded-image" style="background-image: url(' + object.src + '); width: ' + object.width + 'px; height: ' + object.height + 'px; background-color: #ffffff; border: ' + borderWidth + 'px' + ' ' + borderStyle + ' ' + borderColor + '">'+
        '<div>'+
          '<div class="lt" style="width: ' + imageSize + 'px; height: ' + imageSize + 'px; top: ' + topOffset + 'px; left: ' + topOffset + 'px"><img src="' + path + 'lt.png" class="rounded-corner" /></div>'+
          '<div class="rt" style="width: ' + imageSize + 'px; height: ' + imageSize + 'px; top: ' + topOffset + 'px; right: ' + topOffset + 'px"><img src="' + path + 'rt.png" class="rounded-corner" /></div>'+
        '</div>'+
        '<div class="lb" style="width: ' + imageSize + 'px; height: ' + imageSize + 'px' + '; top: ' + positionTop + 'px; right: ' + bottomOffset + 'px"><img src="' + path + 'lb.png" class="rounded-corner" /></div>'+
        '<div class="rb" style="width: ' + imageSize + 'px; height: ' + imageSize + 'px' + '; top: ' + positionTop + 'px; left: ' + bottomOffset + 'px"><img src="' + path + 'rb.png" class="rounded-corner" /></div>'+
      '</div>');

    });
  
  }
});

