Tile Editor Issues

[cwright]

My tileset for my editor only shows when Ctrl is held down. When I release Ctrl after picking a tile, this.input.activePointer.isDown remains true and starts drawing all over the map. It stays true until I move my mouse outside the game window. Anyone know why?

GameEngine.Editor = function (game) {

    //  When a State is added to Phaser it automatically has the following properties set on it, even if they already exist:

    this.game;      //  a reference to the currently running game (Phaser.Game)
    this.add;       //  used to add sprites, text, groups, etc (Phaser.GameObjectFactory)
    this.camera;    //  a reference to the game camera (Phaser.Camera)
    this.cache;     //  the game cache (Phaser.Cache)
    this.input;     //  the global input manager. You can access this.input.keyboard, this.input.mouse, as well from it. (Phaser.Input)
    this.load;      //  for preloading assets (Phaser.Loader)
    this.math;      //  lots of useful common math operations (Phaser.Math)
    this.sound;     //  the sound manager - add a sound, play one, set-up markers, etc (Phaser.SoundManager)
    this.stage;     //  the game stage (Phaser.Stage)
    this.time;      //  the clock (Phaser.Time)
    this.tweens;    //  the tween manager (Phaser.TweenManager)
    this.state;     //  the state manager (Phaser.StateManager)
    this.world;     //  the game world (Phaser.World)
    this.particles; //  the particle manager (Phaser.Particles)
    this.physics;   //  the physics manager (Phaser.Physics)
    this.rnd;       //  the repeatable random number generator (Phaser.RandomDataGenerator)

    this.map;
    this.groundLayer;
    this.bgLayer;
    this.fgLayer;
    this.currentLayer;

    this.mapWidth;
    this.mapHeight;
    this.tileSize;

    this.tilesetKey;
    this.tilesetContainer;
    this.tileset;
    this.tileNumber;
    this.marker;
};

GameEngine.Editor.prototype = {

    create: function () {
        
        // temporary - need user input
        this.mapWidth = 50;
        this.mapHeight = 50;
        this.tileSize = 32;

        this.createMap();
        this.createAssets();

        // create tileset toggle key - ctrl
        this.tilesetKey = this.input.keyboard.addKey(Phaser.Keyboard.CONTROL);
        this.tilesetKey.onDown.add(this.showTileset, this);
        this.tilesetKey.onUp.add(this.hideTileset, this);
        
        // create input
        this.input.onDown.add(this.pickTile, this);
        this.input.addMoveCallback(this.updateMarker, this);
    },

    update: function () {

    },

    quitGame: function (pointer) {

        //this.state.start('MainMenu');

    },

    createMap: function () {

        this.stage.backgroundColor = '#2d2d2d';

        this.map = this.add.tilemap();
        this.map.addTilesetImage("tileset");

        // add layers
        this.groundLayer = this.map.create("ground", this.mapWidth, this.mapHeight, this.tileSize, this.tileSize);
        this.groundLayer.resizeWorld();
        this.bgLayer = this.map.createBlankLayer("bg", this.mapWidth, this.mapHeight, this.tileSize, this.tileSize);
        this.fgLayer = this.map.createBlankLayer("fg", this.mapWidth, this.mapHeight, this.tileSize, this.tileSize);

        this.currentLayer = this.groundLayer;

    },

    createAssets: function () {

        this.tilesetContainer = this.add.group();
        this.tileset = this.tilesetContainer.create(0, 0, "tileset");
        //this.tileset.inputEnabled = true;
        this.tilesetContainer.fixedToCamera = true;
        this.tilesetContainer.visible = false;
        console.log("Tileset Created");

        this.marker = this.add.graphics();
        this.marker.lineStyle(2, 0x000000, 1);
        this.marker.drawRect(0, 0, this.tileSize, this.tileSize);
        console.log("Marker Created");
        
    },

    showTileset: function (pointer) {

        console.log("Show Tileset");
        this.tilesetContainer.visible = true;
        
    },

    hideTileset: function (pointer) {

        console.log("Hide Tileset");
        this.tilesetContainer.visible = false;
        //this.input.activePointer.isDown = false;

    },

    pickTile: function (pointer) {

        if (this.tilesetContainer.visible) {
            if (this.input.x < this.tileset.width &&
                this.input.y < this.tileset.height) {
                var xPos = Math.floor(this.input.x / this.tileSize);
                var yPos = Math.floor(this.input.y / this.tileSize);
                this.tileNumber = xPos + (yPos * (this.tileset.width / this.tileSize));
                console.log("Picked tile: " + this.tileNumber);
            }
        }
        
    },

    updateMarker: function () {
        
        this.marker.x = this.currentLayer.getTileX(this.input.activePointer.worldX) * this.tileSize;
        this.marker.y = this.currentLayer.getTileY(this.input.activePointer.worldY) * this.tileSize;

        if (this.input.activePointer.isDown && !this.tilesetContainer.visible) {
            this.map.putTile(
                this.tileNumber, 
                this.currentLayer.getTileX(this.marker.x), 
                this.currentLayer.getTileY(this.marker.y), 
                this.currentLayer
            );
            // map.fill(currentTile, currentLayer.getTileX(marker.x), currentLayer.getTileY(marker.y), 4, 4, currentLayer);
        }

    }

};