Touch Controller Component

A place to post your custom classes and engine extensions to share with the community.

Touch Controller Component

Postby robaldred » Wed Feb 05, 2014 2:54 pm

Hey I just thought I would share my TouchControllerComponent

It allows you to controller a player or entity when working with touch screens.
It can have two touch controlled sticks.
A left stick for movement, and a right stick for aiming and firing.

Image


There are some configuration options to change the behaviour of the sticks.

Options (* = required):
Code: Select all
scene *: (an IgeScene) the scene to which the controllers will be mounted to.
controller_texture *: (IgeTexture) a texture that will be rendered for the controller base
controller_stick_texture *: (IgeTexture) a texture that will render for the controller stick under
movement: (boolean) enable or disable the movement stick
aiming: (boolean) enable or disable the aiming/firing stick
events: (boolean) if true the controller will emit events


Notes
- If one of the sticks is enabled it will be triggered by the entire screen.
- If both 'movement' and 'aiming' are false the movement stick will be enabled.

Events (if enabled):

controllerOn
- Emitted when the screen is touched
- Receives two arguments
1. stickname, a string either 'movement' or 'aiming' so you know which stick triggered the event
2. vector, an IgePoint with the stick's current vector from the origin touch point.

controllerMove
- Emitted as the stick is moved
- Receives the same two arguments as controllerOn

controllerOff
- Emitted when the touch is removed.
- Receives a single argument the 'stickname' same as the other events.



I recommend using live assets, if you
A couple of example texture assets are included in the zip.

If both sticks are enabled, the movement stick will triggered by pressing the left side of the screen, the aiming/firing stick the right.

To initialise the controller:
Code: Select all
var entity = new IgeEntity();
entity.addComponent(TouchControllerComponent,{
   scene: ige.client.uiScene,
   movement: true,
   aiming: true,
   controller_texture: ige.client.gameTexture.controller,
   controller_stick_texture: ige.client.gameTexture.controller_stick,
   events: false
});


The data of the sticks are accessible directly on the component.

Here's a little example of how it could be used to take input from a player and sent the control vectors to a multiplayer server.
A copy of the current controller stick vectors are stored in the player here to make it easily possible to determine if the stick has moved from the last tick.
This saves you pinging your server with unnecessary updates.

Code: Select all
Player = IgeEntity.extend({
   classId: 'Player',
   init: function() {
      this.movement = {
         id: -1,
         vector: new IgePoint(0,0,0)
      };
      this.aiming = {
         id: -1,
         vector: new IgePoint(0,0,0)
      };
      this.firing = false;
      this.addBehaviour('control_behaviour', this._behaviour);
   },
   _behaviour: function(ctx) {

      if(!ige.isServer) {
         # if control vectors have changed, tell the server
         if(!this.movement.vector.compare(this.controller.movement.vector)
            this.movement.id = this.controller.movement.id
            this.movement.vector = this.controller.movement.vector.clone()
            ige.network.send('playerMove',[this.movement.id,this.movement.vector.x,this.movement.vector.y])
         }
         if(!this.aiming.vector.compare(this.controller.aiming.vector)
            this.aiming.id = this.controller.aiming.id
            this.aiming.vector = this.controller.aiming.vector.clone()
            ige.network.send('playerAim',[this.aiming.id,this.aiming.vector.x,this.aiming.vector.y])
         }
         if(this.firing != this.controller.firing) {
            this.firing = this.controller.firing
            ige.network.send('playerFire',[this.firing,this.aiming.id,this.aiming.vector.x,this.aiming.vector.y])
         }
      }

   }
});


Zip contains:
coffeescript source, compiled js and example assets

Hope this is useful for someone, if you notice any issues please let me know.
Attachments
TouchControllerComponent.zip
(4.34 KiB) Downloaded 600 times
I don't work for Irrelon. All comments are my own.
I would strongly encourage anyone building production projects with Isogenic to buy a premium licence, it costs very little and will help towards continued development of the engine. Irrelon have spent thousands of hours developing this wonderful platform with many features found in AAA game engine.
User avatar
robaldred
 
Posts: 243
Joined: Wed Oct 23, 2013 8:09 pm
Location: Manchester, England

Return to Custom Code

Who is online

Users browsing this forum: No registered users and 0 guests
cron