lars

Members
  • Content Count

    51
  • Joined

  • Last visited

Everything posted by lars

  1. Im using spine version 3.7.94 an pixi-spine is from: https://github.com/pixijs/pixi-spine Im using it with ES6 and Node.js
  2. Hey Im trying to catch a spine timeline event in pixi: this.myMille.state.setAnimation(0, "BB-react-benzin-smallCar", false); this.myMille.state.onEvent = function(i, event) { console.log(event); if (event.name == "pickup"){ console.log('pickup'); } }; But it´s does not seems to work. Any ideas?
  3. Ok solved it, or my college did 🙂 this.collectNinjas.forEach(ninja =>{ if (this.ht.checkme(this.spr_hitArea, ninja )) { this.scene.removeChild(ninja); } } Thank you very much for the help Ivan. Super nice to have guys like you around 🙂
  4. Heres a working app. Its still in the Actors.js i doing my intersection. Thank you very much for having a look at it.
  5. Sorry. Theres only one comparison. So maybe thats the problem. But how do I compare with multiple object. I tried something like looping through my comparison this.setNinja = setInterval(() => { this.spr_ninjaCon = new PIXI.Container(); this.scene.addChild(this.spr_ninjaCon); this.ninja_hitArea = new PIXI.Graphics(); this.ninja_hitArea.beginFill("0x000000"); this.ninja_hitArea.alpha= 0.5; this.ninja_hitArea.drawRect(-20, -20, 40, 40); this.spr_ninjaCon.addChild(this.ninja_hitArea); this.collectNinjas.push(this.spr_ninjaCon); // pushing object into a array }, 10); //END interval These are drawn to stage in a interval And then I tried to compare intersection in a for loop like this: this.app.ticker.add(() => { if ( this.collectNinjas.length > 0) { // is there any object for(let ii = 0; ii < collectNinjas.length; ii++){ if (this.ht.checkme(this.spr_hitArea, collectNinjas[ii])) { console.log('intersection true'); this.scene.removeChild(this.spr_ninjaCon); } } } }); //End app.ticker But that did'nt do it. I will send you a clean working app 🙂 31/5000 31/5000
  6. Ok. Heres it is. And thank you very much for your time. Hope the code make sense 🙂 I have attached 2 files: The Hittest class and the Actor class. Where it all happens. Hopefully you will be able to read it in a minute 🙂 Hittest.js Actors.js
  7. Hello Everybody Trying to make a collision detection between two object. I have one object there is going to catch another object. Theres a new obejct to catcht every 10 seconds, and every thing goes fine when i catchs one object at time. But when theres multiple object on stage, something going wrong: Heres what im doing: Creating a "collector": this.spr_Con = new PIXI.Container(); this.scene.addChild(this.spr_Con); //Then creating the hitarea this.spr_hitArea = new PIXI.Graphics(); this.spr_hitArea.beginFill("0xffffff"); this.spr_hitArea.alpha= 0.5; this.spr_hitArea.drawRect(-20, 0, 40, 40); this.spr_Con.addChild(this.spr_hitArea); Then creating some objects to collide with: this.setNinja = setInterval(() => { this.spr_ninjaCon = new PIXI.Container(); this.scene.addChild(this.spr_ninjaCon); this.ninja_hitArea = new PIXI.Graphics(); this.ninja_hitArea.beginFill("0x000000"); this.ninja_hitArea.alpha= 0.5; this.ninja_hitArea.drawRect(-20, -20, 40, 40); this.spr_ninjaCon.addChild(this.ninja_hitArea); }, 10); //END interval So every 10 seconds i spawn a new object. Then I have a simple hittest class: export default class Hittest { constructor() { } checkme(a,b){ var ab = a.getBounds(); var bb = b.getBounds(); return ab.x + ab.width > bb.x && ab.x < bb.x + bb.width && ab.y + ab.height > bb.y && ab.y < bb.y + bb.height; } }; And check for intersection: this.app.ticker.add(() => { if ( this.collectNinjas.length > 0) { // is there any object if (this.ht.checkme(this.spr_hitArea, this.ninja_hitArea)) { console.log('intersection true'); this.scene.removeChild(this.spr_ninjaCon); } } }); //End app.ticker Every things goes fine as long as there is only one object "living" on stage, but as soon I have multiple object on stage it cant allways recognize the intersection. Is it my Hittest.js class that fails om multiple object? Hope someone can help me.
  8. Right now, when i want to "disable multitouch" I do the following: this.mouseCounter = 0: On a pointerDown event: this.mouseCounter++; if(this.mouseCounter < 2 ){ doSomeThing } On a pointerUp event: this.mouseCounter = 0; Simply q 🙂 Is there a better way to do this.
  9. Hi Ivan My drag and is not included in my example, it´s work ok, only, some attemp to add a object from one container to another container, and atemp to get it back to the original container 🙂
  10. Hello All I trying to make a object be dragged into a container and then be a child of this container like this: //places in a pointerup event let bl = otc.skeleton.findBone("left-hand-bone"); let point = oc.toGlobal({ 'x': bl.x, 'y': bl.y }); this.position.set(point.x - (oc.width - 5), point.y - (oc.height - 30)); // oCon.toLocal(this.position, this.parent, this.newPosition);//this i did not manage to get to work oc.addChild(this);//the container where drop the object(this) this.position.set(point.x - (oc.width - 30), point.y - (oc.height + 30)); And work fairly 🙂 But then when i want to drag the object out of the container again i gives me som problems: //placed in a pointerdown event if (globals.objectUsed) { // if the object is dragged to the new container in first place oCon.addChild(this); // send it back to its original container this.position.set(e.data.getLocalPosition(oCon).x, e.data.getLocalPosition(oCon).y); globals.objectUsed = false; isIntersected = false; } It´s kind of work. But the idea is that when the object is placed the first time and I want to drag it back to the original container its should happend when I startDrag(pointerdown), but i have to wait for the pointerup otherwise I still drag the object in its parent container (whichs is having a drag method. Could anyone guide be in the right direction it would be so nice ... hopefully me explaining its not to much rubbish 🙂 Regards Lars
  11. Thank´s a lot Enpu. Was actually looking in the Spine doc. But did´nt find it ... sorry :-)
  12. Hello Anyone knows how to check if a Spine animation is complete. Tried: player.onComplete();
  13. lars

    Spine and events

    That did it. thank´s a lot :-)
  14. lars

    Spine and events

    Yes im using Pixi plugin and my spine works fine, but is not interactive. Where do I disable webGL. Tried to set it to false in the config.
  15. lars

    Spine and events

    Ok. I tried that to, and I cannot visual see the debug draw in the Panda2 editor when activate #. If I work outside Panda2 editor (Brackets) would i still be possible for me to debug the hit area in a browser like: ?debugDraw=true Heres what i tried (I startet with a class, but for now, to test is down to basic :-) : var container = new game.Container(); container.position.set(300, 800); container.interactive = true; container.hitArea = new game.Rectangle(237.15, 218.37); container.hitArea.x = -200; container.hitArea.y = 218; container.addTo(this.stage); var player = new game.Spine('kristian-ronnie.json'); //player.hitArea = new game.Rectangle(200, 500); //player.position.set(300, 800); player.play('idle', true); player.addTo(container); container.click = function() { console.log('check clicked'); }; }
  16. lars

    Spine and events

    Hello Im trying to make my spine object interactive: var player = new game.Spine('mySpine.json'); //player.hitArea = new game.Rectangle(200, 500); player.position.set(300, 800); player.interactive = true; player.play('idle', true); //player.speed = 0.01 player.addTo(this.stage); player.click = function() { console.log('check clicked'); }; That did not work. I tried to put it in a container. That did not help either. It works OK an a sprite object.
  17. lars

    Spine and mesh

    Works perfectly :-) Thanks
  18. lars

    Spine and mesh

    So cool.
  19. lars

    Spine and mesh

    Super fantastic ... I really like what you have done with Panda...
  20. lars

    Spine and mesh

    Hello First of all. I m so glad to see Panda on the road again :-) I have just bought the full version and playing around with Spritesheets developed in Spine 3.6.52 professional. It seems like mesh is not supported in panda 2 version 1.5.0. When I export from spine as a spritesheet with mesh animations it won´t show the spritesheet, If i remove the Mesh animation it shows the animation fine: game.module( 'game.main' ) .require( 'plugin.spine' ) .body(function() { //game.addAsset('panda.png'); game.addAsset('sheep.atlas'); game.addAsset('sheep.json'); game.createScene('Main', { init: function() { var player = new game.Player(); player.sprite.addTo(this.stage); } }); game.createClass('Player', { init: function() { //this.sprite = new game.Sprite('panda.png'); this.sprite = new game.Spine('sheep.json'); this.sprite.position.x = 200; this.sprite.position.y = 800; this.sprite.play('idle', true); } }); });
  21. lars

    Loader in Pandajs 2

    Ehh .... ok. No support of MP3 :-)
  22. lars

    Loader in Pandajs 2

    Only one thing: If I try to preload mp3 like: game.addMedia('sound/soundwaterdrop.*', 'water'); Errror: Uncaught Unsupported file format * or game.addMedia('sound/soundwaterdrop.mp3', 'water'); Error: Unsupported file format mp3 This happens in the updated 2.0 version: https://github.com/ekelokorpi/panda-engine/tree/develop/src Have been trying to look around in the Loader.js file ... but ... :-)
  23. lars

    Loader in Pandajs 2

    Hello Enpu So f...... nice to have you back :-) . It´s working now. Thanks a lot ... Heres how I did (just a dummy, with some stolen parts), and put a reference in the config.js file as you said :-) : game.config = { system: { width: 1024, height: 768, center: true, scale: true, loader: 'MyLoader' } }; And the dummy loader: game.module( 'game.main' ) .require( 'game.assets' ) .body(function() { this.bar; game.createClass('MyLoader', 'Loader', { onStart: function() { this.bar = new game.Graphics(); this.bar.beginFill('#ccc'); this.bar.drawRect(0, 0, 260, 40); this.bar.x = game.system.width / 2 - (260 / 2); this.bar.y = game.system.height / 2 - (40 / 2); this.bar.scale.x = this.percent / 100; this.bar.addTo(this.stage); }, onProgress: function() { console.log(this.percent); //console.log(this.sprite.x); this.bar.scale.x = this.percent / 100; }, onComplete: function() { game.system.setScene('Main'); } }); game.createScene('Main', { backgroundColor: '#666', init: function() { console.log('opo'); } }); });
  24. lars

    Loader in Pandajs 2

    I have tried with a panda 2 update version from: https://github.com/ekelokorpi/panda-engine/tree/develop/src And tried the following: game.module( 'game.main' ) .body(function() { game.addMedia('baggrund_level1.png','bb'); game.createScene('Main', { backgroundColor: '#666', init: function() { console.log('im started'); this.loader = new game.Loader(); this.loader.onStart = this.setGame.bind(this); this.loader.onProgress = this.setPercentGame.bind(this); this.loader.onComplete = this.loadingGame.bind(this); this.loader.start(); }, setGame: function() { console.log('Started'); }, setPercentGame: function() { console.log('percent'); }, loadingGame: function(){ var sprite = new game.Sprite('bb'); sprite.addTo(this.stage); } }); }); With the same result. No response from the onProgress listener.
  25. lars

    Loader in Pandajs 2

    And heres the file that starting the game with the loader: assets.js