Tykrael

Members
  • Content Count

    4
  • Joined

  • Last visited

  1. Tykrael

    Phaser + vuejs

    yup that's a coworker of mine wich reposted the issue in the hopes of finding a solution.
  2. Tykrael

    Phaser + vuejs

    Hello, I know debugging other people's projects isn't easy I've been in the game for almost 10 years, 8 being lead, so trust me there was absolutely no aggressivity behind my words . The debug pointer show mouse down fine, but the inputinfo doesn't see the pointer over. The same phaser code without vuejs works fine. I even tried having the phaser code in an object outside of vue, and then running only an initialization function via vue, but it didn't work any different. So i know it's a conflict between vue and phaser, but i can't take vue out of the picture it's my whole data management. Phaser would be the easy way for the second part of the project but if i can't make it work i'll use something else (D3), it's just phaser is perfect for my project and i'm sure the conflict is just plain stupid I just can't find it. I was really just hoping someone would have ran into that problem and maybe found a solution which i didn't think of. Thanks
  3. Tykrael

    Phaser + vuejs

    Wow 90 views not even 1 reply ... How about with a git of the project for anyone who's willing to help ? https://github.com/Tykrael/test-phaser
  4. Tykrael

    Phaser + vuejs

    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.