JSFiddle - React, Tailwind, and code Playground

by monteslu

HTML

<script src="http://monwarp.com/js/libs/mwe-0.0.1.js"></script>
<canvas id='myCanvas' width='300' height='300' ></canvas>

JavaScript

dojo.require('mwe.GameCore');
        dojo.require('mwe.Sprite');
        dojo.require('mwe.ResourceManager');
        dojo.require('mwe.GameAction');
               
          
          dojo.ready(function(){
              
            var sprite = {fillStyle:'rgb(0,0,255)',                 x:100,y:100, w:50, h: 50, dx:0.5, dy: 0.5,
            xStartVelocity: 0.5, yStartVelocity: 0.5};
        
            var game = new mwe.GameCore({
                canvasId: 'myCanvas',
                update : function(elapsedTime){
                    sprite.x += sprite.dx * elapsedTime;
                    sprite.y += sprite.dy * elapsedTime;
                },
                draw: function(context){
                    //fill background
                    context.fillStyle = "rgb(255,255,255)";
                  context.fillRect(0,0,this.width,this.height);
                  //draw square
                  context.fillStyle = sprite.fillStyle; 
                  context.fillRect(sprite.x,sprite.y, sprite.w, sprite.h);
                },
                initInput: function(im) {                
                    this.moveLeft = new mwe.GameAction({name:"moveLeft"});
                    this.moveRight = new mwe.GameAction({name:"moveRight"});
                    this.moveUp = new mwe.GameAction({name:"moveUp"});
                    this.moveDown = new mwe.GameAction({name:"moveDown"});
                    
                    im.mapToKey(this.moveLeft, dojo.keys.LEFT_ARROW);
                    im.mapToKey(this.moveRight, dojo.keys.RIGHT_ARROW);
                    im.mapToKey(this.moveUp, dojo.keys.UP_ARROW);
                    im.mapToKey(this.moveDown, dojo.keys.DOWN_ARROW);                  
                },
                handleInput: function(im){
                    if(this.moveLeft.isPressed()){
                        sprite.dx = Math.abs(sprite.xStartVelocity) * -1;
                    }
                    else if(this.moveRight.isPressed()){
          ...