Hello peeps,
I've been trying for a long time now to make it work, but i can't find any new ideas to test out.
My project is a vuejs webpack template project i've been able to initialize phaser make things display changing the game's background color on input etc
But i can't for the life of me find the way to make sprite input detect pointer.
I've followed this tutorial : https://www.sebastianklier.com/node/vue/phaser/game/2017/06/03/node-vue-phaser-webpack.html
Here's the code of my game vue
<template>
<div id="plano"></div>
</template>
<style>
#plano {
position:absolute;
top:0;
left:0;
width:1280px;
height:640px;
margin: 0 auto;
}
#plano canvas {
display: block;
margin: 0 auto;
}
</style>
<script>
/* eslint-disable */
/* eslint-disable no-unused-vars */
import 'pixi'
import 'p2'
import Phaser from 'phaser'
/* eslint-enable no-unused-vars */
export default{
name: 'phaser',
data: () => ({
game: null,
sprites: {},
}),
mounted () {
this.$on('click', function(){
console.log('click')
})
let self = this
if (this.game == null) {
this.game = new Phaser.Game({
width: 1280,
height: 640,
renderer: Phaser.AUTO,
antialias: true,
parent: this.$el,
state: {
preload: function preload () {
self.preload(this)
},
create: function create () {
self.create(this)
},
update: function update () {
self.update(this)
},
render: function render () {
self.render(this)
}
}
})
}
},
methods: {
preload () {
this.game.load.image('block', './static/assets/block.png')
},
create (phaser) {
let self = this;
var sprite = this.game.add.sprite(this.game.world.centerX, this.game.world.centerY, 'block')
sprite.anchor.set(0.5)
sprite.inputEnabled = true
sprite.input.enableDrag()
sprite.events.onInputDown.add(function() {
console.log('sprite down')
})
},
update (phaser) {
},
render() {
var debug
debug = this.game.debug
debug.inputInfo(32, 32);
debug.pointer( this.game.input.activePointer );
debug.spriteInputInfo(this.game.world.children[0], 32, 150)
}
},
destroyed () {
// this.game.destroy()
}
}
</script>
As you can see it's pretty simple i just want to be able to drag the block, the debug.spriteInputInfo shows no signs of life.
Of course the code works outside of vue ...
If anyone got an idea I'll gladly take it, i'm at my wits end.
