Window Debug Javascript - IE, Firefox, Chrome

Ada kalanya program html5 kita error, dan tak bisa berjalan sesuai yang kita ingikan.
Untuk itu, kita bisa menampilkan Window Debug Javascript di Browser.
Error di program kita pun bisa di deteksi.

Ini shortcut nya:
1. Chrome : Ctrl + Shift + J
2. Firefox  : Ctrl + Shift + J
3. IE         : F12


semoga bermanfaat :)

sumber:
http://stackoverflow.com/questions/9464545/debugging-firefox-extension-from-add-on-builder
http://stackoverflow.com/questions/66420/how-do-you-launch-the-javascript-debugger-in-google-chrome
https://developers.google.com/chrome-developer-tools/docs/javascript-debugging
http://stackoverflow.com/questions/10191099/debugging-javascript-in-ie

resize_canvas - setelah di modifikasi untuk Firefox

function resize_canvas(){
var t = getViewport();

innerWidth = t[0];//window.innerWidth;
innerHeight = t[1];//window.innerHeight;

sizeDiffW = innerWidth-canvasWidth;
sizeDiffH = innerHeight-canvasHeight;
chkscaleW = innerWidth/canvasWidth;
chkscaleH = innerHeight/canvasHeight;
scaleFix = Math.min(chkscaleW,chkscaleH);

canvas.width=canvasWidth*scaleFix;
canvas.height=canvasHeight*scaleFix;
context.scale(scaleFix, scaleFix);

canvas.style.left="100px";
canvas.style.top="100px";
canvas.style.marginLeft="100px";
canvas.style.marginTop="100px";


canvas.style.left=((innerWidth-canvasWidth*scaleFix)/2)+"px";
canvas.style.top=((innerHeight-canvasHeight*scaleFix)/2)+"px";

canvas.style.marginLeft=""+((innerWidth-canvasWidth*scaleFix)/2)+"px";
canvas.style.marginTop=""+((innerHeight-canvasHeight*scaleFix)/2)+"px";

}

getViewport - window.style.left - di Firefox

function getViewport() {
var viewPortWidth;
var viewPortHeight;

// the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
if (typeof window.innerWidth != 'undefined') {
viewPortWidth = window.innerWidth,
viewPortHeight = window.innerHeight
}

// IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
else if (typeof document.documentElement != 'undefined'
&& typeof document.documentElement.clientWidth !=
'undefined' && document.documentElement.clientWidth != 0) {
viewPortWidth = document.documentElement.clientWidth,
viewPortHeight = document.documentElement.clientHeight
}

// older versions of IE
else {
viewPortWidth = document.getElementsByTagName('body')[0].clientWidth,
viewPortHeight = document.getElementsByTagName('body')[0].clientHeight
}
return [viewPortWidth, viewPortHeight];
}