Untitled


//factoid dimensions and alpha
var factoid_w = 423;
var factoid_h = 348;
var factoid_a = 0;

//social chat dimensions and alpha
var socialchat_w = 275;
var socialchat_h = 400;
var socialchatwin_a = 100;

//footer details
var footer_w = 0;
var footer_h = 0;
var footer_a = 0;

//header details

var header_w = 0;
var header_h = 0;
var header_exp_h = 0;
var img_index = 0;

function drawImageOnCanvas(context, src, x, y) {


        img_index++;

        var theImg = ['img'+img_index];

        console.log(theImg);

        theImg = new Image();
        theImg.style.zIndex = img_index;
        theImg.src = src;

        theImg.onload = function()
        {
                context.drawImage(theImg, x, y);
        }
}


function init() {


        var a = document.getElementById('stage');

        //select the canvas and get it's drawing context
        var a_cont = a.getContext('2d');


        drawStage(a, a_cont);
        drawFactoid(a, a_cont);


}


function drawStage(canvas, context) {
        drawImageOnCanvas(context, 'images/bg/main_bg.jpg', 0, 0);
}


function drawFactoid(canvas, context) {

                //apply shadowing
                context.shadowOffsetX = 0;
                context.shadowOffsetY = 3;
                context.shadowBlur = 3;

                var the_grad = context.createLinearGradient(0,0,0,0);

                the_grad.addColorStop(0, "#76a833");
                the_grad.addColorStop(1, "#8dc63f");


                //drawImageOnCanvas(context, 'images/card/box_bg.png', 384, 75);
                drawImageOnCanvas(context, 'images/card/bg_shadow.png', 384, 75);

                //draw a rect on screen- x,y,w,h
                context.fillRect(384, 75, factoid_w, factoid_h);


}