javascript - how to implement device orientation in html5 with phaser framework -

javascript - how to implement device orientation in html5 with phaser framework -

i trying create simple game phaser framework uses device orientation api , tried motion not done. here code `

preload: function() {

game.stage.backgroundcolor = '#64fe2e'; game.load.image('gau','assets/ball.png'); }, create: function() { this.ball = this.game.add.sprite(100,245, 'gau'); }, update: function() { // function called 60 times per sec if(this.ball.inworld == false) this.restart_game(); keys = this.game.input.keyboard.createcursorkeys(); window.addeventlistener("deviceorientation", this.handleorientation, true); }, handleorientation: function(e) { var x = e.gamma; // range [-90,90] var y = e.beta; // range [-180,180] this.ball.body.velocity.x -= x*2; this.ball.body.velocity.y -= y*4;

}, `

it looks scope issue. 'this' within handleorientation refer 'window'.

window.addeventlistener("deviceorientation", this.handleorientation, true); handleorientation: function(e) { var x = e.gamma; // range [-90,90] var y = e.beta; // range [-180,180] // looking reference ball on window object this.ball.body.velocity.x -= x*2; this.ball.body.velocity.y -= y*4; }

one way round 'bind' handleorientation method current scope so:

window.addeventlistener("deviceorientation", this.handleorientation.bind(this), true); handleorientation: function(e) { var x = e.gamma; // range [-90,90] var y = e.beta; // range [-180,180] // refers game object this.ball.body.velocity.x -= x*2; this.ball.body.velocity.y -= y*4; }

javascript html5 device-orientation phaser-framework