Game buatan Galih Widosamodra

Game saya ini dibuat dengan html5 dan javascript.
Silahkan mencoba:

1. Kartun Japarr
2. Tebak Karya Galih

Memang cukup lama saat membuka game ini.
Saya masih mencari cara supaya lebih cepat dan enteng untuk di buka di browser.

Mohon kritik dan saran dari teman-teman. Thanks
Maklum, masih belajar ... :)

Cara close window javascript-html5

Pengen buat program yang ada tombol close nya.
Akhirnya googling dulu ...
Alhamdulillah ketemu beberapa contoh yang bisa di pakai.

Berikut contoh-contoh program yang bisa dipakai untuk menutup window kita.

Cara 1:
window.open('', '_self', ''); //bug fix
window.close();

Cara 2:
window.open(...);
setTimeout(function(){
    window.open('', '_self', '');
    window.close();
}, 100);

Cara 3:
setTimeout(function() { window.close(); },50);

Cara 4:
top.window.close()


semoga bermanfaat :)

sumber:
http://stackoverflow.com/questions/2032640/problem-with-window-close-and-chrome

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];
}

HTML5 - error di firefox

Kemarin ada error di html5 yang saya buat, ketika dijalankan dengan Firefox.

akhirnya googling deh ...
ketemu: http://www.lynnnayko.com/2012/06/declaration-of-character-encoding-in.html

Ini dia Error nya:
Error: The character encoding of the HTML document was not declared. The document will render with garbled text in some browser configurations if the document contains characters from outside the US-ASCII range. The character encoding of the page must be declared in the document or in the transfer protocol.


Nah begini caranya supaya menghilangkan error tersebut:

Letakkan :
<meta http-equiv="Content-Type" content="text/html" charset="utf-8" />

di <head>
seperti ini:



!DOCTYPE HTML>
<html>
<head>
<title>Animasi PNG Sequence</title>

<meta http-equiv="Content-Type" content="text/html" charset="utf-8" />
<style>
body {
margin: 0px;
padding: 0px;
}

</style>
.........
</html>

resize_canvas html5

function resize_canvas(){
var sizecanvas = document.getElementById("myCanvas");
var sizecontext = sizecanvas.getContext('2d');
if (sizecanvas.width  < window.innerWidth){
sizecanvas.width  = window.innerWidth;
}

if (sizecanvas.height < window.innerHeight) {
sizecanvas.height = window.innerHeight;
}

innerWidth = window.innerWidth;
innerHeight = window.innerHeight;
outerWidth = window.outerWidth;
outerHeight = window.outerHeight;

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

sizecanvas.width=canvasWidth*scaleFix;
sizecanvas.height=canvasHeight*scaleFix;
context.scale(scaleFix, scaleFix);
sizecanvas.style.left=((innerWidth-canvasWidth*scaleFix)/2)+"px";
sizecanvas.style.top=((innerHeight-canvasHeight*scaleFix)/2)+"px";

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