Search the Community

Showing results for tags 'event'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • HTML5 Game Coding
    • News
    • Game Showcase
    • Facebook Instant Games
    • Web Gaming Platform
    • Coding and Game Design
  • Frameworks
    • Phaser 3
    • Phaser 2
    • Pixi.js
    • Babylon.js
    • Panda 2
    • melonJS
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



Website URL





Found 83 results

  1. Hey Phaser's, I'm having a problem were I am setting up input events on a sprite and if I turn on pixelPerfectOver then I get a nasty crash when I touch the sprite: "Uncaught SecurityError: Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The canvas has been tainted by cross-origin data." This does not happen with loading assets, so its not a loading issue which all web search results of this error indicate. My access is given in htaccess file. There is no problem if I turn pixelPerfectOver off. The pixelPerfectOver setting is the source of this issue. The following example is modified from my source to cut out the unrelated fat. function PurchaseView() { this.purchaseCmp_group =; var i, iTot, bPosX = [35, 265, 35, 265], bPosY = [75, 75, 305, 305], cBtn; iTot = bPosX.length; for (i=0;i<iTot;i++) { cBtn = game.add.sprite(bPosX, bPosY, 'BuyCards', 'BuyCard'+(i+1)+'.png', this.purchaseCmp_group); cBtn.inputEnabled = true; cBtn.input.pixelPerfectOver = true; // <-- commenting out this line will remove the error cBtn.input.useHandCursor = true;, this); this.cardSelAr.push(cBtn); } }; PurchaseView.prototype.btnUp = function(sprite, pointer, isOver) { if (isOver) { console.log('Correctly Touched'); } };
  2. So I have player and walls as material. Wall collision is made in Tiled polylines. How I can trigger event every time, when player collides to walls? this.walls =, 'Object Layer 1', true); for (this.wall in this.walls) { this.walls[this.wall].setMaterial(this.wallMaterial); } this.layer1 ='Tile Layer 1'); this.collision ='Object Layer 1');I tried to set postbroadphase callback like in example, but it is not working. I have tried to set collision to wall and collision. But it gives just error., this);restart: function (body1, body2) {if ((body1 === this.player && body2 === this.collision) || (body2 === this.player && body1 === this.collision))
  3. Hi all, So, this question stems from this question: Problems with a certain M4A file in iOS with Phaser. So, I have an intro song that I want to play on my game right when the game starts. Obviously, this works fine on desktop and other systems, but not on iOS since iOS needs a touch event before it plays any sound. Unfortunately, I don't want my user to have to click / touch the game first before the intro song starts. What I'm hoping to be able to do is to trigger the touch event so that it registers with iOS. I've tried setting `game.sound.touchLocked` to false, but to no avail: = false;;Does anyone know how to register a touch event on iOS with Phaser?
  4. I have an button in my game where I am popping a Facebook share window using Facebook SDK for JavaScript. When I interact with the popup and close it, the entire game show's a hand cursor and behaves as if it is the button. Anywhere I click on the screen will launch the popup again. I found that I can stop this behavior by adding the code at the bottom of this function, but then I have to click on the game to regain its focus before I can click on another button. Anyone have any ideas on how to deal with this? shareThis.inputEnabled = true;shareThis.input.useHandCursor = true; () { share(shareTitles[level - 1], shareMessages[level - 1], shareImgPath + 'icon_level' + level + '.jpg'); // I can stop the whole game acting like a button thing by doing this... shareThis.inputEnabled = false; shareThis.inputEnabled = true; shareThis.input.useHandCursor = true; // ...but then I have to click on the game once to regain its focus before I can interact with it again});
  5. Now I managed to get moving with mouse working. Now I am creating jumping, which is made by pressing left mouse button. How can I make my sprite to jump only ONCE, when left mouse button is clicked? I explain this kind of procedure: When you press left button of your mouse ONCE. I mean once when you press left mouse button with your index finger and then release it. LIke you clicked the link of this thread. When you click, sprite jumps ONCE and then falls back to floor. Not jump twice, not begin to flow on air. Just jumps once. Please, read this post once again before replying to this, so you fully understand my problem. Because I have seen too many threads on these forums where have been asked help i.e. for p2 physics, and somebody has answered with arcade physics code.
  6. How to know what is clicked on the child-rect?
  7. And again new day new problem. On the mousemove event is subscribed circle. Why react the whole stage?
  8. Do you remember onGameStart conference? That was one of the best Html5 gamedev event out there, with four editions in Warsaw and one in New York. Due to huge work overload, the organizer Michal Budzynski was having a bit of problem to pull this year's edition and he decided to look for help - and so in 2015 onGameStart is coming back as a part of the biggest gamedev event in Central Europe - the Game Industry Conference (GiC). What's going to change? It'll be in Poznan, October 16th - 18th 2015There'll be one onGameStart track about html5 games and 4 other tracks about different game creation aspects (there should be around 100 talks)Last year there was 3,000 attendees from Poland, Germany, Denmark, Czech and FranceThere're going to be special business Pitch&Match meetings (you would be able to schedule those before the event if you would have the business ticket)GiC would takebe in the same place where huge expo PGA is happening (60k visitors last year). What's going to stay the same: Great talks by interesting peopleCool party (even two for those who would have a fancier ticket)Great opportunity to meet publishers and fellow developers.Some links: General GiC page : If you would like to submit your Html5 talk (there are still few days to do that) If you would like to buy tickets for the event:
  9. coter

    pixi and events?

    In Google I find the themes in which they say that no more events. But then I find a more recent topic in which they say that the events exist. In pixi there are events or all of them removed? There is an analog ADDED_TO_STAGE?
  10. Everywhere is written that for interactive events you need to set the flag sprite.interactive = true; but docs have no such Sprite properties. How did a "make" events?
  11. With the first days of July! Please tell me the answers to a couple of things: 1. How to make so that when you double-click on any player object transferred from one stage to the stage 2? In other words - how to do that at an event on the gaming facility dblclick a change of scene. 2. How to do that when you click the player's character was directed to the object (the gate) and in their achievement of a change of scene (location).
  12. Hello all, I am having trouble with a problem that would seem very simple but I haven't been able to find an answer to in the forums and there is not a close example I've been able to find on the site. Explanation: I have a quiz game that asks questions like multiple choice. At the bottom of the game there is a row of circles with numbers inside to show how many questions. When the user answers a question, the circle changes color (red = incorrect, green = correct). Then the row slides to the left. Problem : I use a click event and in the callback function I change the graphics fillColor property ex : rectangle.graphicsData[0].fillColor = 0xFF0000; I put this in the update state, and every frame, the update state looks into an array objects that track the question, the answer chosen and whether or not it was correct. It looks something like this. var tracker = [{question : 1, // Question numberchosen : 'A', // Choice chosenstatus : 0 // 0 for wrong, 1 for right}]So the idea is, that update looks to the question number the game is currently on, subtracts that value by one (the previous question), looks into the array, finds the question number and uses the status to determine whether the circle with the same number should be red or green. rectangle.graphicsData[0].fillColor = tracker[].status ? 0x00FF00 : 0xFF0000; I use a console.log to check the fillColor Property and it's changed to the correct color, but on screen, the rectangle never changes color. Bandaid : The only way I can change the color of the circle is by refiring the create state and using the same logic to redraw the circles based on my tracker array. I have put together a little snippet to recreate, basically the same functionality (change color of graphic on a event) ;(function($){ $ = function(){ var self = this; var Graphics = {} var game = new Phaser.Game( $(self).width(), $(self).height(), Phaser.AUTO, $(self).attr('id') ); var Objects = { rec : null, color: 0xFF0000 } var state = function(game){} state.prototype = { init : function(){ game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL; }, preload : function(){}, create : function(){ Objects.rec =,0); Objects.rec.beginFill(0xFF0000, 1); Objects.rec.drawRect(50,50,50,50); Objects.rec.endFill(); Objects.rec.inputEnabled = true;{ console.log('fire'); Objects.color = 0x00FF00; }); }, refresh : function(){ }, update : function(){ Objects.rec.graphicsData[0].fillColor = Objects.color; console.log(Objects.color); }, } game.state.add('state', state); game.state.start('state'); }})(jQuery);Sorry for all the tab spacing, this editor seems to magnify all my tabs. here's a screen of my console log that shows the property changes
  13. Any good tutorials on how to bind and handle events in Pixi? The documentation of each event handlers reads "interactionData" as parameter, but I don't really understand what that's supposed to be? Thanks.
  14. Hi, how do you handle events and/or callbacks? How do you handle interactions like mouse events, events bubbling, listeners etc? And what do you think are the best libraries or native functions to handle all this? Personally I am an event guy but I am open to other options too, if necessary, just let me know what is best for you and what you use.
  15. I'm developing a game framework and I've just migrated to Pixi.js V3. After some bumps on the road - undocumented loader & interaction management changes - I've managed to put it in the working state. However, one problem is pestering me: every time I press a mouse button on the sprite or container, or release it, two events are registered instead of one - two on the 'mousedown' and two on the 'mouseup'. This happens with left as well as with right mouse button. Now, I did not change anything in my code and everything was working fine with Pixi.js V2. Does someone know what is going on here? Thank you in advance! UPDATE: I've just realized that two events are produced because I have manually instantiated InteractionManager with new PIXI.interaction.InteractionManager(renderer);Apparantly, pixi automatically creates an interaction manager. However, I do not know how to find the reference to that manager. I need to read out container mouse position in every tick... UPDATE: I've just opened a new topic here, because this issue is resolved initself, but my problem of reading a mouse position in every frame in pixi V3 isn't.
  16. Hi, I'm momentarily experiencing really strange behavior of the function window.addEventListener('keydown', onKeyDown, false);now, first I had this integrated into my index.html by just writing: <script>window.addEventListener('resize', onResize, false);window.addEventListener('keydown', onKeyDown, false);</script>after the referencing of my "main.js" in which the functions 'onResize' and 'onKeyDown' are described. Now this works perfectly fine if you visit the original ■URL■ which is hosted on a free web-storage host called "" but it won't work if you visit the forwarded ■URL■ that I pay for. The forwarding is done by a Frame-Redirect, and so the page uses a frameset to display the content. Could this cause the problem and is there a way to fix it? Thanks in advance. ~Dinkelborg
  17. Hi guys! One question... the onInputDown event from a button can ignore the transparent color? Thanks in advance, Nicholls
  18. Hi, i have basic timed event that won't call provided method, not even once... It's so basic that i don't know what can be the cause. EnemiesManager.prototype.singleEnemySpawnUpdate = function () { if({ this.timer.add( Phaser.Timer.SECOND *,2), this.addRandomEnemy, this); this.timer.start(0); }};//never called methodEnemiesManager.prototype.addRandomEnemy = function(){ this.getRandomGroup().addObject(,700),; this.timer.stop(true);};
  19. I am having issues trying to attach input events to a tile sprite. TileSprites extend Phaser Sprites, yet the inputEnabled property of Sprites is undefined on the TileSprite, and therefore does not run the input.start function to create the events when I set it to true. var corner = new Phaser.Sprite(game, 0, 0, 'corner');// contains null properties for the input events.corner.inputEnabled = true;// contains Phaser.Signals for the input, this);//This worked, all good, carry on.var gemBox = game.add.tileSprite(0, 0, 128, 128, 'board');// contains null properties for the input events.gemBox.inputEnabled = true;// still contains null properties for the input, this);//Exception thrown as onInputDown is null.Are TileSprites just not meant to have input love? EDIT: I guess not, because when I called input.start manually on the TileSprites input object and managed to get the input going, I was only able to fire off events by clicking in a region the size of the original sprite.
  20. I am trying to implement some random events happening in my game. For example I want to drop an item on every 5 to 10 seconds. In phaser there is an easy way to create loop events, but they all loop at a certain time. What I am doing so far to achieve this is to add a delay on the event in the timer callback. Is there a smart way to create create events looping in some time range? // Initialize drop timervar cooldown =, this.coolMax);this.dropTimer =;this.dropEvent = this.dropTimer.loop(Phaser.Timer.SECOND * cooldown, this.dropItem, this);this.dropTimer.start();// dropItem function Grabbable.prototype.dropItem= function() { // Do something // Reset timer var cooldown =, this.coolMax); this.dropEvent.delay = Phaser.Timer.SECOND * cooldown;};
  21. I feel like I'm just bad at Javascript to have to ask this question so please keep the disparaging remarks to a minimum. I have some game handling taking place on a server and being sent back to the game via JSON like this: Strategy.Game.prototype = { create: function() { this.greenGroup =; this.greenGroup.create(100,100, 'greenParticle'); this.getPath(); }, getPath: function() { $.getJSON("", function (data) { console.log(JSON.stringify(data)); data.forEach(function(step)) { // need access to "game.greenGroup" here to create group entities and move existing ones. } }); }} There is more to the game obviously but hopefully you get the idea. I need to access game entities as I would normally have done with "this.greenGroup" but within the event handler the context has changed. I've tried pulling up the javascript console and seeing if I could track down how to reference the game object but I haven't found it. I can reference the class but it's not the actual working game object. Strangely the ways I've found to reference the game class the greenGroup is always undefined. Any idea where I've lost it?
  22. Hi, I was looking at the chained tweens example and I tryed to add an onCompete event at the end of the tween but it's look like the event is dispatched after the end of the first tween. var tween ={ alpha: 1 }, 1000, Phaser.Easing.Sinusoidal.InOut, true).to({ alpha: 0 }, 1000, Phaser.Easing.Sinusoidal.InOut, false, 1000).onComplete.add(this.onAnimationDone, this);I found this solution on the forum wich is not ellegant, but at least functional: var tween ={ alpha: 1 }, 1000, Phaser.Easing.Sinusoidal.InOut).to({ alpha: 0 }, 1000, Phaser.Easing.Sinusoidal.InOut, false, 1000).start(); tween._lastChild.onComplete.add(this.onAnimationDone, this);I would like to know if it is the expected behavior or if there is a better way to do that ? Thank you.
  23. Hello Phaser community! I've had a look around for a possible solution and I can't find one. So now I am here to pick your brains for some ideas on how to do it. Basically in my game when my player walks in front of a window, I have the window fade out. When the player is no longer overlapping with the window, I want the window to fade back in. I have it fading out no problem. I am unsure of the best way to fade back in without using a timer. Any ideas? Thanks in advance!
  24. I am writing a game ui for phaser(, here are some demos: I don't know how to handle mouse move/touch move event, could anyone give me some tips? Thanks in advance.
  25. Greetings everyone, I am using pixi.js for a game development project, and I'm importing animations created with Spine. In order to correctly animate certain characters, I need to respond to Spine animation events. However, I can't find any way to add a listener for them. Are they supported in pixi? Edit: For example: when the character stops, I want the walking animation to also stop, but only once the character finishes the current step (i.e. not freeze instantly). The walking loop consists of two steps, and if this little "hack" isn't put into place, sometimes the walk animation keeps playing for a little bit (until completion) after the character has stopped, which looks quite bad.