grapefruitjs / grapefruit

Outdated, I recommend you use photonstorm/phaser instead!

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

keyboard events and some questions

mgutz opened this issue · comments

I've been learning grapefruit and create a basics tutorial here grapefruit basics

I have a few issues and questions

  • Keyboard events handlers not working within an iframe. Handlers work if iframe is opened in a new tab. The plain pixi.js example works in an iframe too.
  • How do you move a child within isometric world space? Am I supposed to do all the model to world calculations myself or is that handled somewhere?

I can force the keyboard handlers to work by calling window.focus() on mouse down. Still a mystery why I didn't need to do that in pixi example.

Hmm, interesting. Key events work by adding listeners to document, pixi doesn't do keyboard events in the examples, so I wouldn't expect it to be weird.

I am going to try and change this to bind key events directly to the canvas, and use the tabindex/focus trick to make them capture properly. I think this will fix the iframe issue you are having.

Landed in e22ff5c, let me know how the latest master works for you.

P.S: Reading your tutorial, a world is one TiledEditor map instance which is loaded into a GameState (if you don't create one yourself, the Game instance uses a default one). GameStates are what you can think of as a "scene", whereas a world is the map, which contains all the TiledEditor stuff and all entities you add to the world to interact. The world is just an object container (the map) for all those layers and entities and object groups, etc.

You will also notice that your game insance has game.audio, game.input, game.physics, game.camera, and game.world eaach of those are getters that access the active game state's properties named the same. So if you swap game states (using game.enableState()) then game.world will now be the new active state's world.

You can do prevent default on a keyboard event like this:

game.input.keyboard.on(gf.input.KEY.SPACE, onSpace);

function onSpace(e) {
    e.input.preventDefault(e.originalEvent);
}

Which will properly prevent default cross browser.

That fixed it.

How do I move a player? You have the tiled map nicely abstracted between orthogonal/isometric. Just wondering if there is an easy way to move a sprite in world coordinates without having to do all the iso transformations manually.

Unfortunately, no there isn't. You should move your player by doing:

playerSprite.setPosition(x, y);

And I will probably make that function do isometric transforms for you eventually, but right now it does not. Isometric support is not complete on grapefruit yet and is scheduled for the v0.0.2 release.

No problem, I might try to implement this. If you want to give a high level
description of how you want it done, I can fill in the blanks and submit a
request.

On Wed, Jul 31, 2013 at 1:55 PM, Chad Engler notifications@github.comwrote:

Unfortunately, no there isn't. You should move your player by doing:

playerSprite.setPosition(x, y);

And I will probably make that function do isometric transforms for you
eventually, but right now it does not. Isometric support is _not_complete on grapefruit yet and is scheduled for the
v0.0.2https://github.com/grapefruitjs/grapefruit/issues?milestone=3&state=openrelease.


Reply to this email directly or view it on GitHubhttps://github.com//issues/55#issuecomment-21894946
.

Bsasically TiledObjectGroup already does this for spawned entities (lines 156 - 163). But then if their position is set later the same calculations are not done.

The reason I haven't done it yet, is I'm not sure how the best way to tell if a sprite is in an isometric world or not is. Without touch any other classes (only PhysicsTarget, which defines .setPosition) I would have to do some weird .parent.parent stuff.

By the way, I was incorrect in what I said before. If you are dealing with an sprite that has physics enabled, you should move it like so:

spr.setVelocity(x, y);
//or set the position directly
spr.setPosition(x, y);

and if the sprite has no physics, you have to set the position directly:

spr.setPosition(x, y);

You can enable physics on a sprite by doing:

spr.enablePhysics(game.physics);

Then set the velocity, as you want. It is weird things like this, and the fact the API is highly in flux that I haven't officially announced this engine yet. I'm really still developing most of it.

Got it, gives me something to think about.