JSFiddle - React, Tailwind, and code Playground

by Batzi

HTML

<script src="https://github.com/photonstorm/phaser/releases/download/v2.4.4/phaser.js"></script>

JavaScript

var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create, update: update, render: render });

var map;
var currentX;
var currentY;

function preload(){
    
    game.load.crossOrigin = 'anonymous';
    game.load.image('map','http://cdn.shopify.com/s/files/1/0071/5032/products/World_Maps_International_20mil_1.jpg');
    
    
}

function create(){
    currentX = game.input.activePointer.x;
    currentY = game.input.activePointer.y;
    
    map = game.add.sprite(0,0,'map');
    
    game.input.mouse.mouseWheelCallback = mouseWheel;
    var t = game.add.tween(map.scale);
    
    var worldX = 1.0;
    var worldY = 1.0;
    
    function mouseWheel(event){
           if (event.wheelDelta > 0 && worldX<=1) {

            worldX += 0.1;
            worldY += 0.1;

            map.scale.x = worldX;
            map.scale.y = worldY;
            game.world.setBounds(0, 0, 2048*worldX, 1202*worldX);

        } else if (event.wheelDelta < 0 &&worldX>=0.6) {
            worldX -= 0.1;
            worldY -= 0.1;
            
        } else {
          t.stop();   
        }
        
        map.scale.x = worldX;
        map.scale.y = worldY;
        game.world.setBounds(0,0,2048*worldX,1202*worldX);


    }
    }


function update(){
if(game.input.activePointer.isDown && game.input.activePointer.x>currentX){
              game.camera.x -= 8;
              currentX = game.input.activePointer.x;
            }
            if(game.input.activePointer.isDown && game.input.activePointer.x<currentX){
              game.camera.x += 8;
              currentX = game.input.activePointer.x;
            }
            if(game.input.activePointer.isDown && game.input.activePointer.y>currentY){
              game.camera.y -= 8;
              currentY = game.input.activePointer.y;
            }
            if(game.input.activePointer.isDown && game.input.activePointer.y<currentY){
              game.camera.y += 8;
              currentY =...