JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.createjs.com/easeljs-0.8.0.min.js"></script>
<canvas id="draw" width="300" height="300"></canvas>
<div id="status">
    <div>--</div>
</div>

CSS

#draw {
    background: #55EE55;
}
#status {
    border: 1px solid #CCCCCC;
}

JavaScript

var
    stage, circle,
    which_click = function (e) {
        var ne = e.nativeEvent;
        return (
            (ne.which ? ne.which === 1 : ne.button === 1) ? 'left' :
            (
                (ne.which ? ne.which === 3 : ne.button === 3) ? 'right' :
                    (ne.which ? ne.which === 2 : ne.button === 2) ? 'middle' : '?'
            )
        );
    },
    status = function (t) {
        $('#status').append($('<div />').text(t));
        if ($('#status > div').length > 10) { $('#status > div').first().remove(); }
        console.log(t);
    };

stage = new createjs.Stage('draw');

var circle = new createjs.Shape();
circle.graphics.beginFill('red').drawCircle(0, 0, 50);
circle.x = circle.y = 100;

circle.on('pressup', function (e) {
    status(e.type + ' ' + which_click(e));
});
circle.on('mousedown', function (e) {
    status(e.type + ' ' + which_click(e));
});

stage.addChild(circle);
stage.update();