Processing mouseDragged

Mouse dragged, clicked

by schrodingers

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/processing.js/1.4.13/processing.min.js"></script>
<canvas></canvas>

CSS

</style> <script type="text/javascript"> window.addEventListener('load', function() {
    var scripts=document.body.getElementsByTagName('script');
    var canvases=document.body.getElementsByTagName('canvas');
    new Processing(canvases[0], scripts[0].text);
}
, false);
 // Here prevent javascript in body from throwing error </script> <style>

JavaScript

/* 
 title: Mouse moved, mouseDragged
 date: 2015-07-25
 */

color violet = color(58, 48, 66);
color yellow = color(237, 230, 35);
color cyan = color(5, 190, 255);

int dragX, dragY, moveX, moveY;
float targetX;
float targetY;
float x = 0;
float y = 0;
float easing = 0.03;

void setup() {
    size(700, 600);
    smooth();
    background(violet);
    noStroke();
}

void draw() {
    fill(violet, 50);
    rect(0, 0, width, height);

    fill(cyan);
    ellipse(dragX, dragY, 30, 30);

    float targetX = dragX-30;
    float targetY = dragY-30;
    float a = atan2(dragY, dragX);
    fill(yellow);
        ellipse(x, y, 20, 20);
    
    x += (targetX - x) * easing;
    y += (targetY - y) * easing;

    

}


void mouseDragged() {
    dragX = mouseX * 0.98;
    dragY = mouseY;
}

void mouseClicked() {
    dragX = mouseX * 0.95;
    dragY = mouseY * 0.95;
}