JSFiddle - React, Tailwind, and code Playground

by georgie

HTML

<script src="https://rawgit.com/GoodBoyDigital/pixi.js/master/bin/pixi.js"></script>
<body>
</body>

JavaScript

//pathc pixi
var original_processTouchEnd = PIXI.interaction.InteractionManager.prototype.processTouchEnd;
  var original_processMouseUp = PIXI.interaction.InteractionManager.prototype.processMouseUp;

  PIXI.interaction.InteractionManager.prototype.processTouchEnd = function ( displayObject, hit )
  {
      if(!displayObject._touchDown) {
        //full stop, this object was not touched before
        return;
      }

      //everything is fine call the real handler;
      original_processTouchEnd.apply(this, arguments);
  };

  PIXI.interaction.InteractionManager.prototype.processMouseUp = function ( displayObject, hit )
  {
      var e = this.mouse.originalEvent;

      var isRightButton = e.button === 2 || e.which === 3;
      var isDown =  isRightButton ? '_isRightDown' : '_isLeftDown';
      
      if(!displayObject[ isDown ]) {
        //full stop, this object had no mouse down before
        return;
      }

      //everything is fine call the real handler;
      original_processMouseUp.apply(this, arguments);
  };





var renderer, stage;
$(document).ready(function(){
    renderer = new PIXI.autoDetectRenderer($(window).width()*0.98, $(window).height()*0.77, {transparent: true });			
    $("body").append(renderer.view);
    
    stage = new PIXI.Container(); 
    stage.interactive = true;
    stage.on('mousedown',function(data){
       stage.lastDelta = 0;
    });       
    stage.on('mouseup',function(data){
       alert(stage.lastDelta); 
    });   
    stage.on('mousemove',function(data){
        stage.lastDelta++;
    });        
    var g1 = new PIXI.Graphics();
    
    
    g1.beginFill(0x003302);
    g1.drawCircle(0, 0, 100);
    g1.endFill();
    var skill_sprite = new PIXI.Sprite(g1.generateTexture());
    skill_sprite.position.x = 0;
    skill_sprite.interactive = true;
    //skill_sprite.filters = [filter];
    
    stage.addChild(skill_sprite);
    
    
    var g2 = new PIXI.Graphics();
    g2.beginFill(0xC03302);
    g2.drawCircle(0, 0,...