// Copyright 2008 MSE-iT - Thomas Maierhofer
// All rights reserved


function BackgroundPaintFkt(context, width, height, canvas, $canvas, $canvasDiv, $content, $element )  
{

    var options = {x:0, y:0, height: height, width: width, radiusTL:20, radiusTR:20, radiusBL:20, radiusBR:20, border: 0 };

    // Draw a red red border round corner rectangle
    context.fillStyle = "#003399";
    $.canvasPaint.roundedRect(context,options);

    
    options.border = 1;

    var backgroundGradient1 = context.createLinearGradient(0, 0, 0, 40 );
    backgroundGradient1.addColorStop(0, '#99BEFF;');
    backgroundGradient1.addColorStop(1 ,'#F4F8FF;');

    context.fillStyle = backgroundGradient1; 
    options.height = 42;
    options.radiusBL=0;
    options.radiusBR=0;
    $.canvasPaint.roundedRect(context,options);


    var backgroundGradient2 = context.createLinearGradient(0, 40, 0,  height-40 );
    backgroundGradient2.addColorStop(0 ,'#F4F8FF;');
    backgroundGradient2.addColorStop(1, '#E8F0FF;');

    context.fillStyle =  backgroundGradient2; 
    options.y = 38;
    options.height = height-76;
    options.radiusTL=0;
    options.radiusTR=0;
    options.radiusBL=0;
    options.radiusBR=0;
    $.canvasPaint.roundedRect(context,options);

    var backgroundGradient3 = context.createLinearGradient(0, height-40, 0,  height);
    backgroundGradient3.addColorStop(0, '#E8F0FF;');
    backgroundGradient3.addColorStop(1 ,'#99BEFF;');


    context.fillStyle =  backgroundGradient3; 
    options.y = height-42;
    options.height = 42;
    options.radiusTL=0;
    options.radiusTR=0;
    options.radiusBL=20;
    options.radiusBR=20;
    $.canvasPaint.roundedRect(context,options);



}