red circle

by Nick Hulea

HTML

<script src="http://cdn.eyahuska.com/paper.js"></script>
<canvas resize="true" id="canvas-1" style="width:100%;"></canvas>
<script type="text/paperscript" canvas="canvas-1">
    var raster = new Raster({
        source: 'http://eyahuska.com/files/one.jpg',
        // position: view.center,
        size: view.bounds

    });

    var raster2 = new Raster({
        source: 'http://eyahuska.com/files/two.jpg',
        // position: view.center,
        size: view.bounds

    });

    raster.on('load', function() {
        loaded = true;
        onResize();
    });
    raster2.on('load', function() {
        loaded = true;
        onResize();
    });

    var circle = new Path.Circle({
        radius: 50,
        strokeColor: 'red'
    });

    var group = new Group();
    group.addChild(raster);
    group.addChild(raster2);
    //group.addChild();
    group.clipped = true;


    function onMouseMove(event) {
        circle.position = event.point;
    }

    function onMouseDown(event) {
        var circle = new Path.Circle({
            radius: 50,
            strokeColor: 'red',
    FILLColor: 'red'
        });
        circle.position = event.point;


    }

    function onResize(event) {
        ///circle.fitBounds(view.bounds, true);
        raster.fitBounds(view.bounds, true);
        raster2.fitBounds(view.bounds, true);
    }
</script>