var RED0 = '#b13a22';
var RED1 = '#8b2e1b';
var BORDER = 3;
var RADIUS = 16;
var PI = Math.PI;


$("body").ready(function(){
    $("body").removeClass("nocanvas-redbackground");
});

$("#header").ready(function(){
    $("#header").jqcanvas(function (canvas, width, height) {
        var ctx = canvas.getContext("2d");
        var lingrad = ctx.createLinearGradient(0,0,width,0);
            lingrad.addColorStop(0, RED0);
            lingrad.addColorStop(1, RED1);
        
        ctx.fillStyle = lingrad;
        ctx.fillRect(0, 0, width, height);
    });
    $("#header").removeClass("nocanvas-redbackground");
});

// $("#footer").ready(function(){
//     $("#footer").jqcanvas(function (canvas, width, height) {
//         var ctx = canvas.getContext("2d");
//         var lingrad = ctx.createLinearGradient(0,0,width,0);
//             lingrad.addColorStop(0, RED0);
//             lingrad.addColorStop(1, RED1);
//         
//         ctx.fillStyle = lingrad;
//         ctx.fillRect(0, BORDER, width, height);
//         
//         ctx.strokeStyle = "#FFFFFF";
//         ctx.lineWidth = BORDER;
//         ctx.beginPath();
//         ctx.moveTo(0, BORDER/2);
//         ctx.lineTo(width, BORDER/2);
//         ctx.stroke();
//         ctx.closePath();
//     });
//     $("#footer").removeClass("nocanvas-redbackground");
// });

$("#content_root").ready(function(){
    $("#content_root").jqcanvas(function (canvas, width, height) {
        var ctx = canvas.getContext("2d");
        ctx.clearRect(0,0,width,height);
        var lingrad = ctx.createLinearGradient(0,0,0,height);
        lingrad.addColorStop(0.05, '#000000');
        lingrad.addColorStop(0.99, '#40150c');
        ctx.fillStyle = lingrad;
        ctx.fillRect(0, 0, width, height);
    });
    $("#content_root").removeClass("nocanvas-blackbackground");
});

$("#header_menu").ready(function(){
    $("#header_menu").jqcanvas(function (canvas, width, height) {
        var ctx = canvas.getContext("2d");
        var lingrad = ctx.createLinearGradient(0,0,width,0);
            lingrad.addColorStop(0, RED0);
            lingrad.addColorStop(1, RED1);
        var menu_item_x = $("#header_menu .menu_item:eq(0)").position().left - RADIUS;
        
        ctx.fillStyle = lingrad;
        ctx.beginPath();
        ctx.moveTo(0,0);
        ctx.lineTo(0, height-BORDER);
        ctx.arc(menu_item_x, height-BORDER-RADIUS, RADIUS, PI/2, PI/4, true);
        ctx.arc(menu_item_x+height+BORDER, RADIUS+BORDER, RADIUS, PI+PI/4, 3*PI/2, false);
        ctx.lineTo(width, BORDER);
        ctx.lineTo(width, 0);
        ctx.fill();
        ctx.closePath();
        
        ctx.strokeStyle = "#FFFFFF";
        ctx.lineWidth = BORDER;
        ctx.beginPath();
        ctx.moveTo(0,height-BORDER/2);
        ctx.arc(menu_item_x, height-BORDER/2-RADIUS, RADIUS, PI/2, PI/4, true);
        ctx.arc(menu_item_x+height+BORDER*2, RADIUS+BORDER/2, RADIUS, PI+PI/4, 3*PI/2, false);
        ctx.lineTo(width, BORDER/2);
        ctx.stroke();
        ctx.closePath();
    });
});

$("#content_menu .menu_item").ready(function(){
    $("#content_menu .menu_item").not('.active').jqcanvas(function (canvas, width, height) {
        var ctx = canvas.getContext("2d");
        var x = 0;
        var y = 0;
        var h = height;
        var w = width;
        ctx.fillStyle = '#FFFFFF';
        var c = 12;
        var b = 3;
        
        ctx.beginPath();
        ctx.moveTo(0,h);
        ctx.lineTo(0,c);
        ctx.bezierCurveTo(0,0,c,0,c,0);
        ctx.lineTo(w-c*2,0);
        ctx.bezierCurveTo(w-c/2,0,w-c/2,h,w,h);
        ctx.fill();
        ctx.closePath();
        //if (!active){
            ctx.beginPath();
            ctx.moveTo(b,h);
            ctx.lineTo(b,c);
            ctx.bezierCurveTo(b,b,c,b,c,b);
            ctx.lineTo(w-c*2,b);
            ctx.bezierCurveTo(w-c/2-b,b,w-c/2-b,h,w-b,h);
            var lingrad = ctx.createLinearGradient(h/2,0,w,h/2);
                lingrad.addColorStop(0, RED0);
                lingrad.addColorStop(1, RED1);
            ctx.fillStyle = lingrad;
            ctx.fill();
            ctx.closePath();
        //}
    },
    {
        extraWidth: 16,
        verifySize: true
    }
    );
    
    $("#content_menu .active").jqcanvas(function (canvas, width, height) {
        var ctx = canvas.getContext("2d");
        var x = 0;
        var y = 0;
        var h = height;
        var w = width;
        ctx.fillStyle = '#FFFFFF';
        var c = 12;
        var b = 3;
        
        ctx.beginPath();
        ctx.moveTo(0,h);
        ctx.lineTo(0,c);
        ctx.bezierCurveTo(0,0,c,0,c,0);
        ctx.lineTo(w-c*2,0);
        ctx.bezierCurveTo(w-c/2,0,w-c/2,h,w,h);
        ctx.fill();
        ctx.closePath();
    },
    {
        extraWidth: 16,
        verifySize: true
    }
    );
});

$("#content").ready(function(){
    $("#content").jqcanvas(function (canvas, width, height) {
        var ctx = canvas.getContext("2d");
        var x = 0;
        var y = 0;
        var iH = height;
        var iW = width;
        var iB = 16;
        ctx.fillStyle = '#FFFFFF';
        
        ctx.beginPath();
        ctx.moveTo(x,y+iH-iB);
        ctx.bezierCurveTo(x,y+iH,x+iB,y+iH,x+iB,y+iH);
        ctx.lineTo(x+iW-iB,y+iH);
        ctx.bezierCurveTo(x+iW,y+iH,x+iW,y+iH-iB,x+iW,y+iH-iB);
        ctx.lineTo(x+iW,y+iB);
        ctx.bezierCurveTo(x+iW,y+iB,x+iW,y,x+iW-iB,y);
        ctx.lineTo(x,y);
        ctx.fill();
        ctx.closePath();
        ctx.beginPath();
        var lingrad = ctx.createLinearGradient(0,0,iW,0);
            lingrad.addColorStop(0, RED0);
            lingrad.addColorStop(1, RED1);
        ctx.fillStyle = lingrad;
        var z = 32;
        var b = 3;
        ctx.moveTo(b,iH-z);
        ctx.lineTo(iW-b,iH-z);
        ctx.lineTo(iW-b,iH-iB);
        ctx.bezierCurveTo(iW-b,iH-b,iW-iB,iH-b,iW-iB,iH-b);
        ctx.lineTo(iB,iH-b);
        ctx.bezierCurveTo(b,iH-b,b,iH-iB,b,iH-iB);
        ctx.fill();
        ctx.closePath();
    });
    $("#content").removeClass("nocanvas-whitebackground");
});

var widget_heading = ".portal_widget_heading";
$(widget_heading).ready(function(){
    $(widget_heading).jqcanvas(function (canvas, width, height) {
        var ctx = canvas.getContext("2d");
        var lingrad = ctx.createLinearGradient(0,0,width,0);
            lingrad.addColorStop(0, "#d49592");
            lingrad.addColorStop(0.1, RED1);
            lingrad.addColorStop(1, RED0);
        
        var b = 2;
        var w = 1;
        
        ctx.beginPath();
        
        ctx.fillStyle = lingrad;
        ctx.arc(b, b, b-w, PI, 3*PI/2, false);
        ctx.arc(width-b-w, b+w, b, 3*PI/2, 0, false);
        ctx.arc(width-b-w, height-b-w, b, 0, PI/2, false);
        ctx.arc(b+w, height-b-w, b, PI/2, PI, false);
        ctx.fill();
        
        ctx.strokeStyle = RED0;
        ctx.lineWidth = 2;
        ctx.arc(b, b, b-w, PI, 3*PI/2, false);
        ctx.arc(width-b-w, b+w, b, 3*PI/2, 0, false);
        ctx.arc(width-b-w, height-b-w, b, 0, PI/2, false);
        ctx.arc(b+w, height-b-w, b, PI/2, PI, false);
        ctx.lineTo(w, b);
        ctx.stroke();
        
        ctx.closePath();
    
    });
    $(".right_portal_widget h1").removeClass("nocanvas-redbackground");
});

$("#album_fotos").ready(function(){
    $("#album_fotos").jqcanvas(function (canvas, width, height) {
        var ctx = canvas.getContext("2d");
        var lingrad = ctx.createLinearGradient(0,0,0,height);
            lingrad.addColorStop(0, "#C0C0C0");
            lingrad.addColorStop(1, "#F0F0F0");
        
        var b = 12;
        var w = 1.5;
        
        ctx.beginPath();
        
        ctx.fillStyle = lingrad;
        ctx.arc(b, b, b-w, PI, 3*PI/2, false);
        ctx.arc(width-b-w, b+w, b, 3*PI/2, 0, false);
        ctx.arc(width-b-w, height-b-w, b, 0, PI/2, false);
        ctx.arc(b+w, height-b-w, b, PI/2, PI, false);
        ctx.fill();
        
        ctx.strokeStyle = "#A0A0A0";
        ctx.lineWidth = w*2;
        
        ctx.arc(b, b, b-w, PI, 3*PI/2, false);
        ctx.arc(width-b-w, b+w, b, 3*PI/2, 0, false);
        ctx.arc(width-b-w, height-b-w, b, 0, PI/2, false);
        ctx.arc(b+w, height-b-w, b, PI/2, PI, false);
        ctx.lineTo(w, b);
        ctx.stroke();
        
        ctx.lineCap = "round";
        ctx.moveTo(180, 24);
        ctx.lineTo(180, height-24);
        ctx.stroke();
        
        ctx.closePath();
    
    });
    $(".right_portal_widget h1").removeClass("nocanvas-redbackground");
});