JSFiddle - React, Tailwind, and code Playground

by jeykeu

HTML

<script src="http://www.kineticjs.com/download/kinetic-v3.9.7.js"></script>
Drag me around
<div id="container">
</div>
You shouldn't be able to drag me when Shift key is pressed

JavaScript

var stage = new Kinetic.Stage({
    container: "container",
    width: 578,
    height: 200
});

var layer = new Kinetic.Layer();
var group = new Kinetic.Group({
    draggable: true
});

var circle = new Kinetic.Circle({
    x: stage.getWidth() / 2,
    y: stage.getHeight() / 2,
    radius: 50,
    fill: "#3A5BDE",
    stroke: "#162459",
    strokeWidth: 15
});

circle.on("mousedown", function(e) {

    if (e.shiftKey) {
        
        // Cancel further dragging somehow
        
        console.log("[mousedown] How do I cancel this dragstart event?");

        e.cancelBubble = true;
    }
});

circle.on("dragstart", function(e) {

    if (e.shiftKey) {
        // Cancel further dragging somehow
        
        console.log("[dragstart] How do I cancel this dragstart event?");

        e.cancelBubble = true;
    }
});

group.add(circle);
layer.add(group);
stage.add(layer);