HTML 5 refers to new web technologies such as high performance JavaScript engines, canvas 2D and WebGL, video and audio tags.

learn more… | top users | synonyms

2
votes
1answer
147 views

Centering camera on player div

I've been making a roguelike-style game in HTML5 without using canvas (only divs) with pure JS (fiddle!). I've been trying to enlarge the tile size (font size) while keeping the player centered within ...
2
votes
0answers
310 views

Any open source editor to make video games online without programming knowledge? [closed]

With Scratch we can create video games online, from its web platform, and publish them on the same web. I could download its source code and use it, as many others already did (see Scratch ...
2
votes
0answers
54 views

Presentation / input layer that communicates with server [closed]

I want to learn more abot how to use some kind of presentation/input layer that communicates with server for HTML5 games. Instead of sending all the code to the clients browser, I would like to just ...
2
votes
1answer
1k views

Making a Photo Hunt Game using Javascript and HTML5 [closed]

I am looking for a way to make a photo hunt game using HTML5 and Javascript. Where should I start after the images. And How would I make clickable areas on the image, using javascript? If you know of ...
2
votes
1answer
340 views

How can I repeat only a portion of an image in Javascript?

So I'm trying to repeat a portion of my spritesheet as a background. So far, I have attempted this: var canvas = $("#board")[0], ctx = canvas.getContext("2d"), sprite = new Image(); ...
2
votes
0answers
272 views

Independent HTML5 Physics Game: Any Feedback? [closed]

I've been independently developing a physics-based HTML5 game. I haven't used any libraries or engines; all the code, including the physics, is my own. It is free for a while on the Chrome Web Store ...
1
vote
3answers
1k views

2D maps, how to structure?

I'm new to this. And I don't really understand 2D tile maps. The tutorials I've read use arrays, but doesn't this get really difficult to manage when they get big? And what if I want different ...
1
vote
2answers
2k views

How to make an infinite map

I was wondering if someone could explain to me how to implement a seemingly dynamic infinite map like the one at http://wordsquared.com/ My main issue is really generating new tiles in any direction ...
1
vote
1answer
288 views

Can't create “hero walking” animation

I'm creating a Fez-based HTML5 Canvas game and animating my hero image using sprite sheets. The problem is that I can't create the animation of the hero walking, don't matter how much I try, the ...
1
vote
3answers
915 views

Need Guidance Making HTML5 Canvas Game Engine

So I have some free time this winter break and want to build a simple 2d HTML5 canvas game engine. Mostly a physics engine that will dictate the way objects move and interact(collisions, etc). I made ...
1
vote
3answers
1k views

Where to start, to develop an online Backgammon game? [closed]

I would like to develop a backgammon game to play against other players online, as a way of learning more Javascript/jQuery and a little game development. I'm a web developer and most of my experience ...
1
vote
4answers
545 views

Protecting the integrity of a game state while minimizing amount of data sent

I'm developing a multiplayer game in PHP/jQuery, and naturally have to be wary of any sort of data coming from the client. At present, I have tables of data representing the map (2D roguelike), ...
1
vote
2answers
838 views

PHP and Javascript/HTML5 Collaboration [closed]

I've recently been working on a fairly complicated game. I've stored information with local storage, but that allows the player to edit it, and does not transfer from computer to computer. The two ...
1
vote
3answers
1k views

What Javascript game engines are out there, other than Impact? [closed]

Does anybody know of a decent (meaning preferably free ;)) alternative to Impact? Any suggestions are very much appreciated!
1
vote
2answers
2k views

How to draw a tileset using HTML5 canvas?

I have a tileset something like this: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20 My tileset draw code looks like this: var image = new Image(); image.src = ...
1
vote
1answer
814 views

How to develop a real-time game server for html5 web app?

I'm contemplating a graduate project proposal of developing a rather complex HTML5 game that requires real-time server communication. The premise of the actual game play is simple: 10 players battle ...
1
vote
2answers
610 views

How can I move an object over a drawn tile map in HTML 5 without constant buffering?

I've been messing around with HTML5 for quite some time now but this is something that I guess I haven't figured out how to handle well yet. I'm sure there's an extremely easy solution and I just ...
1
vote
1answer
2k views

JavaScript rendering: Canvas or DIV?

I am planning on developing a multiplayer RPG (kinda like RuneScape, but don't worry, with a different gameplay) and i want to do this in the browser. Now before saying things like "A MMORPG is hard ...
1
vote
1answer
3k views

Easy way to do gravity in a simple game?

I'm looking for an easy, beginner friendly way to do gravity in a platformer. I've looked into Box2D tutorials, but they all seem very complicated. All I want is a class that takes into account if my ...
1
vote
2answers
318 views

How can I center a circle around a point on an HTML canvas?

I've got a job to make an engine and light game for canvas in HTML5. I like the things I make to be centered on the x,y positions I give it, I don't know why, it just helps me think about them ...
1
vote
1answer
70 views

How should I efficiently clear and redraw my canvas with lots of animated sprites?

My current solution is to clear the entire canvas and redraw all sprites on every requestFrame(). This works but feels inefficient: I only need to clear the part of the canvas made invalid by ...
1
vote
3answers
747 views

Canvas setTransform function clarification

I'm currently building some kind of fake-3D dungeon, and I'm facing some difficulties understanding the behavior of the setTransform() function. Here's my simplified code: var can = ...
1
vote
2answers
2k views

HTLM5 canvas game (easeljs) slow peformance on ipad (ios7) with phonegap

I have developed a game with easeljs for HTML5 Canvas. the game is a single HTML5 page with canvas and a lot of javascript. All this time I tested the app on iOS Safari (iPad3 iOS7) with 40~50 fps ...
1
vote
1answer
672 views

Do you need to make a tileset for a platformer?

I've been tasked to make a platformer, I've never made a tiled game before, is this necessary? I.e. can I just make different child classes of a Sprite class and add place them on the map, adding ...
1
vote
1answer
136 views

Playing part of a sfx audio file in HTML5 using WebAudio

I have compiled all of my sound effects into one sequenced .ogg file. I have the start and stop times for each sound effect. How do I play the individual effects? That is, how do I play part of an ...
1
vote
1answer
827 views

Saving Scores Using Cookies

I've recently created a small galiga like game recently using JavaScript and HTML5. I've run into a bit of trouble saving cookies, the cookie saves, but then resets itself when the page is refreshed, ...
1
vote
1answer
566 views

Customize Colors for Sprites in Web Game

So I'm working on an html5/javascript/css3-based game. Without going into too much detail, I'm thinking of having the characters be simple 8 or 16-bit style sprites, but I'd like to allow the user to ...
1
vote
1answer
852 views

How do I deploy my JavaScript/HTML 5 to desktop and smartphone?

I'm looking for framework that will let me code on JS for HTML5 canvas and then will let me deploy to desktop and Android. I'm not looking to learn new stuff like Haxe or Lua. I want to do it in plain ...
1
vote
2answers
3k views

Creating several instances of the same object, and selecting only one

I'm playing around with making a puzzle game, haven't done that much before I run into my first problem. I want to create a certain amount of the same object/function. But without hardcoding the ...
1
vote
2answers
722 views

HTML5 collision with images

Can anyone please help me out with a small test game I'm creating. I'm basically creating this game to learn a few things about HTML5 and so far it's all been good. I've been able to create a canvas ...
1
vote
2answers
43 views

Maths ? coordinates rotating around coordinates

could you geave me a tip please, a redirection to what is the "simple" math I need to learn and understand for the rotation of an object (its coordinate x, y) around an other object (an other x, y), I ...
1
vote
1answer
49 views

Why can't CSS Sprites handle vectors?

Almost all the documentation available either says that "sprites are bitmaps" or that "css sprites must be bitmaps". Is there a specific reason for this? Is it, in fact possible to create a css sprite ...
1
vote
1answer
106 views

How are CSS and WebGL coordinates related? [closed]

I'd like to build a simple framework which rendering combines web page DOM elements with WebGL, such that they're manipulable in the same coordinate space. How does the plain CSS coordinate system ...
1
vote
1answer
1k views

Rotate arrow on canvas

I need to draw a flow dynamically based on some user choices. In that flow I want to draw the choices (blue circles with number) and the directions of that choices (line and arrow). For example: node ...
1
vote
1answer
655 views

How do I add my phaser.js game to my pre-made web page?

First off, it's my first time doing a little bit of game development, and I have no idea of the normal flow of making a game, let alone a browser game. My game uses the phaser framework of HTML and ...
1
vote
1answer
85 views

Get speed from vector using box2d and javascript

I need to find the speed of an object in a game. The game is made in HTML5 with jquery and jquery.box2d. For this I can use these methods: GetLinearVelocity().x; GetLinearVelocity().y; I'm then ...
1
vote
1answer
1k views

Should game logic update per second or per frame?

I'm trying to wrap my head around how and when to update an entities position. My game loop updates logic at 25 FPS and renders at 50-60 (Depending on the computer hardware). So lets say I'm moving ...
1
vote
2answers
2k views

Dealing with multiple animation state in one sprite sheet image using html5 canvas

I am recently creating a Game using html5 canvas .The player have multiple state it can walk jump kick and push and multiple other states my question is simple but after some deep research i couldn't ...
1
vote
3answers
423 views

Is it more efficient to encode rotation in a spritesheet or rotate at runtime?

I'm developing a game with JavaScript and HTML5 and I'm wondering about the performance implications of sprite rotations. There are two ways that I know to rotate a sprite: Rotate the actual sprite ...
1
vote
1answer
429 views

WebGL immediate mode

I know that WebGL is based on OpenGL ES 2.0 and that glBegin and glEnd have been removed and replaced with vertex buffer objects. I understand that VBOs are faster and use less code but is there a ...
1
vote
1answer
366 views

Canvas isometric translations to integer coordinates

I'm creating a canvas based game with an isometric playing board. I use the following transformations to get my square tiles to render on the screen: 'applyViewportTransformation' : function() { ...
1
vote
2answers
140 views

Including sprite file for mobile games

I'm making a simple online RPG for Android & IOS using HTML5 & Phonegap and was wondering: should I include sprite file with the game for downloads (because of bandwidth)? What should I do ...
1
vote
1answer
1k views

HTML5 Canvas Depth Sorting

I'm have problem with Isometric. I'm don't know how to name this "problem", but I'm show you some sceen what I get and what I'm need to get. My code now drawing something like: ...
1
vote
2answers
784 views

Multiple setInterval in a HTML5 Canvas game

I'm trying to achieve multiple animations in a game that I am creating using Canvas (it is a simple ping-pong game). This is my first game and I am new to canvas but have created a few experiments ...
1
vote
1answer
246 views

How to perform efficient 2D picking in HTML5?

I'm currently using an R-Tree for both picking and collision testing. Each entity on screen has a bounding box for collisions and a separate one for picking. Since entities may change position very ...
1
vote
2answers
549 views

Frustum Culling/Only rendering what's viewed by the Camera in HTML5 Canvas?

I coded up a simple 2D Camera for my HTML5 Canvas-Based Game Engine but I noticed the performance wasn't very good. So a lot of people suggested only rendering things that are shown by the camera but ...
1
vote
1answer
466 views

Building a simple bomberman game with Node.js and Socket.io [closed]

I'm building this game mostly because I want to experiment with Node.js and Socket.io, and the game is more like a proof of concept. To start with, I have a 2D grid system as the game map. ...
1
vote
2answers
154 views

2d mmo open world connection and reconnection

I am trying to create an 2d html5 open word (the sprite does not have any fancy flare, just shapes around) with only maximum of 10 player at once. My question is how to create a seamless join for new ...
1
vote
2answers
140 views

Why does player still leave map?

I'm making a simple HTML5 RPG in pure JavaScript likened after Nox, Diablo or Titan Quest, with the character centered on the screen and the map moving around it. TL;DR: My character, when colliding ...
1
vote
2answers
224 views

How to access bottom canvas layer in HTML?

I have such html: <div id="main_window"> <canvas id="canvas_hex_logic" width="200" height="100"></canvas> <canvas id="canvas_ground" width="200" height="100"></canvas> ...