xAttachEventOnLoad("load", cornerInt);
function cornerInt(){
var divElements = document.getElementsByTagName("DIV");
var divCount = divElements.length;
var t = 0;
objsArray = new Array();
for(var i = 0; i < divCount; i++){
var currentDiv = divElements[i];
if(radius = currentDiv.getAttribute("radius")){
if(!(corners = currentDiv.getAttribute("corners")))
corners = "TR,TL,BR,BL";
var newObj = new curvyCorners(currentDiv, radius, corners);
objsArray[t] = newObj;
t++;
}
}
var arrayLength = objsArray.length;
for(var x = 0; x < arrayLength; x++){
objsArray[x].doCorners();
}
}
function curvyCorners(boxObj, radiusInt, cornersCSVStr) {
this.box= boxObj;
this.radius = (Math.round(parseInt(radiusInt)/2))*2;
this.corners= cornersCSVStr.split(",");
this.masterCorner = null;
this.masterCornerType = null;
this.cornersAvailable = new Array("TR", "TL", "BR", "BL");
this.boxHeight= parseInt(((this.box.style.height != "")? this.box.style.height.substring(0, this.box.style.height.indexOf("px")) : this.box.scrollHeight));
this.boxWidth = parseInt(((this.box.style.width != "")? this.box.style.width.substring(0, this.box.style.width.indexOf("px")) : this.box.scrollWidth));
this.borderWidth= parseInt(((this.box.style.borderWidth != "")? this.box.style.borderWidth.slice(0, this.box.style.borderWidth.indexOf("px")) : 0));
this.boxColour= ((this.box.style.backgroundColor.substr(0, 3) == "rgb")? rgb2Hex(this.box.style.backgroundColor) : this.box.style.backgroundColor);
this.borderColour = ((this.box.style.borderColor != "" && this.borderWidth > 0)? ((this.box.style.borderColor.substr(0, 3) == "rgb")? rgb2Hex(this.box.style.borderColor) : this.box.style.borderColor) : this.boxColour);
this.borderRadius = parseInt(this.radius - this.borderWidth);
this.borderString = this.borderWidth + "px" + " solid " + this.borderColour;
this.posStart = (0 - this.radius);
this.posAdjust = (Math.floor(Math.sqrt(Math.pow((this.radius - this.borderWidth),2)/2)));
if(this.box.style.position != "absolute") this.box.style.position = "relative";
this.doCorners = function()
{
for(var i in this.cornersAvailable)
{
var currentCorner = this.cornersAvailable[i];
if(inArray(this.corners, currentCorner) === false)
{
var newCorner = document.createElement("DIV");
newCorner.style.height = this.radius - this.borderWidth + "px";
newCorner.style.width= this.radius - this.borderWidth + "px";
newCorner.style.position = "absolute";
newCorner.style.fontSize = "1px";
newCorner.style.overflow = "hidden";
newCorner.style.backgroundColor = this.boxColour;
switch(currentCorner)
{
case "TL":
newCorner.style.borderLeft = this.borderString;
newCorner.style.borderTop= this.borderString;
break;
case "TR":
newCorner.style.borderRight = this.borderString;
newCorner.style.borderTop = this.borderString;
break;
case "BL":
newCorner.style.borderLeft = this.borderString;
newCorner.style.borderBottom = this.borderString;
break;
case "BR":
newCorner.style.borderRight= this.borderString;
newCorner.style.borderBottom = this.borderString;
break;
}
}
else{
if(this.masterCorner != null)
{
var newCorner = this.masterCorner.cloneNode(true);
}
else
{
var newCorner = document.createElement("DIV");
newCorner.style.height = this.radius + "px";
newCorner.style.width= this.radius + "px";
newCorner.style.position = "absolute";
newCorner.style.fontSize = "1px";
newCorner.style.overflow = "hidden";
for(var intx = 0; intx < this.radius; intx++)
{
if((intx +1) >= this.borderRadius)
var y1 = -1;
else
var y1 = (Math.floor(Math.sqrt(Math.pow(this.borderRadius, 2) - Math.pow((intx+1), 2))) - 1);
if(this.borderRadius != this.radius)
{
if((intx) >= this.borderRadius)
var y2 = -1;
else
var y2 = Math.ceil(Math.sqrt(Math.pow(this.borderRadius,2) - Math.pow(intx, 2)));
if((intx+1) >= this.radius)
var y3 = -1;
else
var y3 = (Math.floor(Math.sqrt(Math.pow(this.radius,2) - Math.pow((intx+1), 2))) - 1);
}
if((intx) >= this.radius)
var y4 = -1;
else
var y4 = Math.ceil(Math.sqrt(Math.pow(this.radius,2) - Math.pow(intx, 2)));
if(y1 > -1) this.drawPixel(intx, 0, this.boxColour, 100, (y1+1), newCorner);
if(this.borderRadius != this.radius)
{
for(var inty = (y1 + 1); inty < y2; inty++)
{
var pixelcolour = BlendColour(this.boxColour, this.borderColour, pixelFraction(intx, inty, this.borderRadius));
this.drawPixel(intx, inty, pixelcolour, 100, 1, newCorner);
}
if(y3 >= y2)
{
if (y1 == -1)
y1 = 0;
this.drawPixel(intx, y2, this.borderColour, 100, (y3 - y2 + 1), newCorner);
}
var outsideColour = this.borderColour;
}
else
{
var outsideColour = this.boxColour;
var y3 = y1;
}
for(var inty = (y3 + 1); inty < y4; inty++)
{
this.drawPixel(intx, inty, outsideColour, (pixelFraction(intx, inty ,this.radius) * 100), 1, newCorner);
}
}
this.masterCorner = newCorner.cloneNode(true);
this.masterCornerType = "BR";
}
}
if(currentCorner != "BR")
{
var pixelCount = newCorner.childNodes.length;
for(var t = 0; t < pixelCount; t++)
{
var pixelBar = newCorner.childNodes[t];
var pixelBarTop= parseInt(pixelBar.style.top.substring(0, pixelBar.style.top.indexOf("px")));
var pixelBarLeft = parseInt(pixelBar.style.left.substring(0, pixelBar.style.left.indexOf("px")));
var pixelBarHeight = parseInt(pixelBar.style.height.substring(0, pixelBar.style.height.indexOf("px")));
if(currentCorner == "TL" || currentCorner == "BL"){
pixelBar.style.left = this.radius -pixelBarLeft -1 + "px"; // Left
}
if(currentCorner == "TR" || currentCorner == "TL"){
pixelBar.style.top =this.radius -pixelBarHeight -pixelBarTop + "px"; // Top
}
}
}
switch(currentCorner)
{
case "TL":
newCorner.style.top= (this.posStart + this.posAdjust) + "px";
newCorner.style.left = (this.posStart + this.posAdjust) + "px";
break;
case "TR":
newCorner.style.top= (this.posStart + this.posAdjust) + "px";
newCorner.style.left = (this.boxWidth - this.posAdjust) + "px";
break;
case "BL":
newCorner.style.top = (this.boxHeight - this.posAdjust) + "px";
newCorner.style.left = (this.posStart + this.posAdjust) + "px";
break;
case "BR":
newCorner.style.top = (this.boxHeight - this.posAdjust)+ "px";
newCorner.style.left = (this.boxWidth - this.posAdjust)+ "px";
break;
}
this.box.appendChild(newCorner);
this.box.style.borderWidth = "0px";
for(var s = 0; s < 4; s++)
{
var bar = document.createElement("DIV");
bar.style.height = this.boxHeight + "px";
bar.style.width= this.boxWidth + "px";
bar.style.position = "absolute";
bar.style.fontSize = "1px";
bar.style.overflow = "hidden";
bar.style.backgroundColor = this.boxColour;
switch(s)
{
case 0:
bar.style.top = this.posAdjust + "px";
bar.style.left = (this.posStart + this.posAdjust) + "px";
bar.style.width = (this.radius - this.posAdjust - this.borderWidth) + "px";
bar.style.height = (this.boxHeight - (2 * this.posAdjust)) + "px";
bar.style.borderLeft = this.borderString;
break;
case 1:
bar.style.top = this.posAdjust + "px";
bar.style.right = (this.posStart + this.posAdjust) + "px";
bar.style.width = (this.radius - this.posAdjust - this.borderWidth) + "px";
bar.style.height = (this.boxHeight - (2 * this.posAdjust)) + "px";
bar.style.borderRight = this.borderString;
break;
case 2:
bar.style.top = (this.posStart + this.posAdjust) + "px";
bar.style.left = this.posAdjust + "px";
bar.style.height = (this.radius - this.posAdjust - this.borderWidth) + "px";
bar.style.width = (this.boxWidth - (2 * this.posAdjust)) + "px";
bar.style.borderTop = this.borderString;
break;
case 3:
bar.style.bottom = (this.posStart + this.posAdjust) + "px";
bar.style.left = this.posAdjust + "px";
bar.style.height = (this.radius - this.posAdjust - this.borderWidth) + "px";
bar.style.width = (this.boxWidth - (2 * this.posAdjust)) + "px";
bar.style.borderBottom = this.borderString;
break;
}
this.box.appendChild(bar);
}
}
}

this.drawPixel = function(intx, inty, colour, transAmount, height, newCorner) {
var pixel = document.createElement("DIV");
pixel.style.height = height + "px";
pixel.style.width= "1px";
pixel.style.position = "absolute";
pixel.style.fontSize = "1px";
pixel.style.overflow = "hidden";
pixel.style.backgroundColor = colour;
if (transAmount != 100)
setOpacity(pixel, transAmount);
pixel.style.top = inty + "px";
pixel.style.left = intx + "px";
newCorner.appendChild(pixel);
}
}
function BlendColour(Col1, Col2, Col1Fraction) {
var red1 = parseInt(Col1.substr(1,2),16);
var green1 = parseInt(Col1.substr(3,2),16);
var blue1 = parseInt(Col1.substr(5,2),16);
var red2 = parseInt(Col2.substr(1,2),16);
var green2 = parseInt(Col2.substr(3,2),16);
var blue2 = parseInt(Col2.substr(5,2),16);
if(Col1Fraction > 1 || Col1Fraction < 0) Col1Fraction = 1;
var endRed = Math.round((red1 * Col1Fraction) + (red2 * (1 - Col1Fraction)));
if(endRed > 255) endRed = 255;
if(endRed < 0) endRed = 0;
var endGreen = Math.round((green1 * Col1Fraction) + (green2 * (1 - Col1Fraction)));
if(endGreen > 255) endGreen = 255;
if(endGreen < 0) endGreen = 0;
var endBlue = Math.round((blue1 * Col1Fraction) + (blue2 * (1 - Col1Fraction)));
if(endBlue > 255) endBlue = 255;
if(endBlue < 0) endBlue = 0;
return "#" + IntToHex(endRed)+ IntToHex(endGreen)+ IntToHex(endBlue);
}
function IntToHex(strNum) {
base = strNum / 16;
rem = strNum % 16;
base = base - (rem / 16);
baseS = MakeHex(base);
remS = MakeHex(rem);
return baseS + '' + remS;
}
function MakeHex(x) {
if((x >= 0) && (x <= 9))
{
return x;
}
else
{
switch(x)
{
case 10: return "A";
case 11: return "B";
case 12: return "C";
case 13: return "D";
case 14: return "E";
case 15: return "F";
}
}
}
function pixelFraction(x, y, r) {
var pixelfraction = 0;
var xvalues = new Array(1);
var yvalues = new Array(1);
var point = 0;
var whatsides = "";
var intersect = Math.sqrt((Math.pow(r,2) - Math.pow(x,2)));
if ((intersect >= y) && (intersect < (y+1))) {
whatsides = "Left";
xvalues[point] = 0;
yvalues[point] = intersect - y;
point =point + 1;
}
var intersect = Math.sqrt((Math.pow(r,2) - Math.pow(y+1,2)));
if ((intersect >= x) && (intersect < (x+1))) {
whatsides = whatsides + "Top";
xvalues[point] = intersect - x;
yvalues[point] = 1;
point = point + 1;
}
var intersect = Math.sqrt((Math.pow(r,2) - Math.pow(x+1,2)));
if ((intersect >= y) && (intersect < (y+1))) {
whatsides = whatsides + "Right";
xvalues[point] = 1;
yvalues[point] = intersect - y;
point =point + 1;
}
var intersect = Math.sqrt((Math.pow(r,2) - Math.pow(y,2)));
if ((intersect >= x) && (intersect < (x+1))) {
whatsides = whatsides + "Bottom";
xvalues[point] = intersect - x;
yvalues[point] = 0;
}
switch (whatsides) {
case "LeftRight":
pixelfraction = Math.min(yvalues[0],yvalues[1]) + ((Math.max(yvalues[0],yvalues[1]) - Math.min(yvalues[0],yvalues[1]))/2);
break;
case "TopRight":
pixelfraction = 1-(((1-xvalues[0])*(1-yvalues[1]))/2);
break;
case "TopBottom":
pixelfraction = Math.min(xvalues[0],xvalues[1]) + ((Math.max(xvalues[0],xvalues[1]) - Math.min(xvalues[0],xvalues[1]))/2);
break;
case "LeftBottom":
pixelfraction = (yvalues[0]*xvalues[1])/2;
break;
default:
pixelfraction = 1;
}
return pixelfraction;
}
function rgb2Hex(rgbColour) {
try{
var rgbValues = rgbColour.substring(4, rgbColour.indexOf(")"));
var rgbArray = rgbValues.split(", ");
var red = parseInt(rgbArray[0]);
var green = parseInt(rgbArray[1]);
var blue= parseInt(rgbArray[2]);
var hexColour = "#" + IntToHex(red) + IntToHex(green) + IntToHex(blue);
}
catch(e){
alert("There was an error converting the RGB value to Hexadecimal in function rgb2Hex");
}
return hexColour;
}
function setOpacity(obj, opacity) {
opacity = (opacity == 100)?99.999:opacity;
obj.style.filter = "alpha(opacity:"+opacity+")";
obj.style.KHTMLOpacity = opacity/100;
obj.style.MozOpacity = opacity/100;
obj.style.opacity = opacity/100;
}
function inArray(array, value) {
for(var i = 0; i < array.length; i++){
if (array[i] === value) return i;
}
return false;
}
function inArrayKey(array, value) {
for(key in array){
if(key === value) return true;
}
return false;
}
function xAttachEventOnLoad(event, func) {
if(window.addEventListener)
window.addEventListener(event, func, false);
else if(window.attachEvent)
window.attachEvent("on" + event, func);
else
window.onload = func;
}