testWidth=window.innerWidth-75;


function canvasSupport(){
    return Modernizr.canvas;
}

function canvasApp(){
    if(!canvasSupport()){
        return;
    }else{
        var theCanvas = document.getElementById("canvasBanner");
        var context = theCanvas.getContext('2d');
        var fontSize=10;
        var shadowX=0;
        var shadowY=0;
        var fontStyle='normal';
        var repeatDraw;
        startUp();
       theCanvas.addEventListener('mouseover',eventMouseOver,false);
      theCanvas.addEventListener('mouseout',eventMouseOut,false);
      theCanvas.addEventListener('click',eventClick,false);
    }

    function drawScreen(){

      if(fontSize<100){
          fontSize=fontSize+10;

      }
      if(fontSize==100 && shadowX<10 && shadowY<10){
          shadowX++;
          shadowY++;
      }
      if (fontSize==100 && shadowX==10 && shadowY==10){
       clearInterval(repeatDraw);
      }
     //background
      var message="Testing Testing";
      theCanvas.width=testWidth;
      theCanvas.height=150;
      var my_gradient = context.createLinearGradient(0, 0, 0, 150);
      my_gradient.addColorStop(0, "#007e7e");
      my_gradient.addColorStop(1, "#9baeae");
      context.fillStyle = my_gradient;
      context.fillRect(0,0,testWidth,150);
      context.shadowOffsetX = shadowX;
      context.shadowOffsetY = shadowY;
      context.shadowColor   = '#707070';


//text
      context.font="bold "+fontStyle+" "+ fontSize+"px "+ "sans-serif";
      var metrics =context.measureText(message);
      var textWidth=metrics.width;
      var xPosition=(theCanvas.width/2)-(textWidth/2);
      var yPosition=(theCanvas.height/2)+35;
      context.fillStyle='white';
      context.fillText("Testing Testing",xPosition,yPosition);


    }

    function eventMouseOut(){
        fontStyle='normal';
       drawScreen();
    }

    function eventMouseOver(){
        fontStyle='oblique';
        drawScreen();

    }

    function eventClick(){
        showBlog(5);
    }


    function startUp(){
          repeatDraw=setInterval(drawScreen,100);
      }

}