No replies to this topic

[bellis]

Hi people!!! :-D
Here I am for the first time and it seems to me that this is the best place for
asking about game developing.
As newbie I wasted my time for chosing programing language. I don't know where I can find
a lot of source code of games. I chosed javascript, just because I can view
others code. After some short learnig about javascript I encouraged myself to
write something myself, so I decide to make simple 2D map(rectangles). Problem
is I can't make it faster to move,only if I increase step It will move for
10px, but i want to move it by 1px faster. Here is my code

[source lang="jscript"]var canvas;var ctx;var wCanvas;var hCanvas;var row;var speed =10;/** r = red* b = blue* o = empty*/var map =["b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "b", "b", "o", "r", "r", "o", "o", "o", "o", "o", "o", "o", "b", "b", "b", "b", "o", "o", "o", "o", "o", "o", "o", "o", "o", "r", "r", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "b", "b", "b", "r", "r", "o", "o", "o", "o", "o", "o", "o", "b", "o", "o", "b", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "r", "o", "o", "o", "o", "o", "o", "o", "o", "r", "o", "o", "o", "o", "b", "b", "b", "o", "o", "o", "o", "o", "o", "o", "o", "o", "b", "o", "o", "b", "o", "o", "o", "o", "o", "o", "b", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "r", "o", "o", "o", "b", "b", "o", "r", "o", "o", "o", "o", "o", "o", "o", "o", "b", "o", "o", "b", "o", "o", "o", "o", "o", "o", "b", "b", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "r", "o", "o", "b", "b", "o", "o", "r", "o", "o", "o", "o", "o", "o", "o", "b", "b", "b", "b", "o", "o", "o", "o", "o", "o", "o", "b", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "r", "o", "b", "b", "o", "o", "o", "r", "o", "o", "o", "o", "o", "o", "b", "o", "o", "b", "o", "o", "o", "o", "o", "o", "o", "b", "o", "o", "o", "o", "o", "b", "b", "b", "o", "o", "o", "o", "o", "o", "o", "r", "b", "b", "o", "o", "o", "o", "r", "o", "o", "o", "o", "o", "b", "o", "o", "b", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "b", "b", "o", "o", "o", "o", "o", "r", "o", "o", "o", "o", "b", "o", "o", "b", "o", "o", "r", "r", "r", "r", "r", "r", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "b", "b", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "o", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b", "b"];var scroll = - 10;function clearCanvas() { ctx.fillStyle = "white"; ctx.fillRect(0, 0, wCanvas, hCanvas);}function drawTile() { var x = -41; var y = 0; clearCanvas(); row = 1; for (var i = 0; i < map.length; i++) { x = x+ 41; if (map[i] == "b") ctx.fillStyle = "blue"; else if (map[i] == "r") ctx.fillStyle = "red"; else if (map[i] == "o") continue; if (i == row * 40) { y = y + 41; x = 0; row++; } // painting rectangle ctx.fillRect(scroll + x, y, 40, 40); ctx.strokeStyle = "Black"; // painting border of rectangle ctx.lineWidth = 4; ctx.strokeRect(scroll + x, y, 40, 40); } // painting red border of canvas ctx.strokeStyle = "red"; ctx.strokeRect(0, 0, wCanvas, hCanvas);}function init() { canvas = document.getElementById("canvas"); wCanvas = canvas.width; hCanvas = canvas.height; ctx = canvas.getContext("2d"); drawTile();}function keyThing(event) { switch (event.keyCode) { case 37: //left scroll = scroll + speed; break; case 39: //right scroll = scroll - speed; break; }}init();window.addEventListener("keydown", keyThing, true);setInterval(drawTile, 1);[/source]
And html

[source lang="plain"]<html><title>Drawing map</title><canvas id="canvas" width="500" height="500"></canvas><script type="text/javascript" src="dMap.js"></script></html>[/source]