Skip to content

Instantly share code, notes, and snippets.

@corbanbrook
Created December 17, 2009 01:33
Show Gist options
  • Save corbanbrook/258430 to your computer and use it in GitHub Desktop.
Save corbanbrook/258430 to your computer and use it in GitHub Desktop.
<html>
<head>
<script language="javascript" src="processing.min.js"></script>
<script language="javascript" src="init.js"></script>
</head>
<body>
<script type="application/processing" target="demo">
// Global variables
float radius = 50.0;
int X, Y;
int nX, nY;
int delay = 16;
// Setup the Processing Canvas
void setup(){
size( 200, 200 );
strokeWeight( 10 );
frameRate( 15 );
X = width / 2;
Y = width / 2;
nX = X;
nY = Y;
}
// Main draw loop
void draw(){
radius = radius + sin( frameCount / 4 );
// Track circle to new destination
X+=(nX-X)/delay;
Y+=(nY-Y)/delay;
// Fill canvas grey
background( 100 );
// Set fill-color to blue
fill( 0, 121, 184 );
// Set stroke-color white
stroke(255);
// Draw circle
ellipse( X, Y, radius, radius );
}
// Set circle's next destination
void mouseMoved(){
nX = mouseX;
nY = mouseY;
}
</script>
<script type="application/processing" target="not">
void setup(){
size( 200, 200 );
}
// Main draw loop
void draw(){
background(0,0,255);
}
</script>
<canvas id="not" width="200px" height="200px"></canvas>
<canvas id="demo" width="200px" height="200px"></canvas>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment