내가 예를 들어 픽시 게임은 엠버 응용 프로그램 내에서 실행하는 캔버스를

Question

엠버 구성 요소 (나는 이것에 대한 https://github.com/Ferdev/ember-cli-pixijs 사용)에 Pixi.js에서 이벤트를 보내기 http://ipotaje.es/en/complete-html5-concentration-game-made-with-pixi-js-3/

보시다시피 Pixi 구성 요소에는 게임 논리가 아닌 그림/렌더링 논리 만 포함되어 있습니다. 그것은 외부 클래스에 저장되어 있으며, log 액션을 호출하고 싶습니다. ,

import PIXI from 'pixi'; 

var PairsGame = function() {}; 
PairsGame.prototype.init = function (renderer) 
{ 
    this.renderer = renderer; 
    // create an empty container 
    this.gameContainer = new PIXI.Container(); 
    const graphics = new PIXI.Graphics(); 
    this.gameContainer.addChild(graphics); 
    // allow chain calling 
    return this; 
}; 
PairsGame.prototype.preload = function() 
{ // importing a texture atlas created with texturepacker 
    var tileAtlas = ["assets/images/images.json"]; 
    // create a new loader 
    PIXI.loader.add(tileAtlas) 
      // use callback 
      .once('complete', this.onLoaded.bind(this)) 
      //begin load 
      .load(); 
    //allow chain calling 
    return this; 
}; 
PairsGame.prototype.animate = function() 
{ 
    this.renderer.render(this.gameContainer); 
    requestAnimationFrame(this.animate.bind(this)); 
    //allow chain calling 
    return this; 
}; 

... 
ET CETERA 
I WOULD LIKE TO CALL THE log ACTION FROM THESE METHODS 
... 

지금 나는 어떤 조치를 취할 수 있도록 내 엠버 구성 요소에 각각의 차례에 '성공'또는 '실패'메시지를 보낼 싶습니다 (예 : 게임의 파일은 다음과 같이 보입니다 단순히 '성공'/ '실패'를 콘솔에 기록하십시오). 그것을 성취하는 방법은 무엇입니까?

나는 해결책 here보고 시도하고 픽시 코드

Ember.Instrumentation.instrument("pixi.gameEvent", 'success'); 

을 추가하는 듯했으나 가입자는 아무 것도받지 않을 것으로 보인다.

Answer 1

PixiCanvas 구성 요소 컨텍스트는 PairsGame 초기화 메서드에 전달할 수 있으며 sendAction을 사용하여 호출 할 수 있습니다.

PairsGame.prototype.init = function (renderer, pixiCanvasComp) 
{ 
    //store component reference 
    this.pixiCanvasComp = pixiCanvasComp ; 
    this.renderer = renderer; 
    // create an empty container 
    this.gameContainer = new PIXI.Container(); 
    const graphics = new PIXI.Graphics(); 
    this.gameContainer.addChild(graphics); 
    // allow chain calling 
    return this; 
} 

사용 액션 (SendAction) log 메소드를 호출하는 당신이 PixiCanvas 구성 요소에 대한 참조를 저장할 수 있습니다 init 메소드 내부

var game = new PairsGame() 
     .init(renderer,this) 
     .preload() 
     .animate(); 
    } 

,

PairsGame.prototype.animate = function() 
{ 
    this.renderer.render(this.gameContainer); 
    requestAnimationFrame(this.animate.bind(this)); 
    //allow chain calling 
    //To call log method of PixiCanvas component, 
    this.pixiCanvasComp.sendAction('log'); 
    return this; 
} 

Answer 2

pixi 구성 요소 (https://guides.emberjs.com/v2.10.0/components/triggering-changes-with-actions/)에 작업을 전달하려고합니다. 본질적으로 이것은 다음 다른 곳에서 추가 작업을 트리거하는 Pixi 구성 요소 내부에서 호출 할 수있는 콜백입니다.