Skip to content

Instantly share code, notes, and snippets.

@torafugu

torafugu/procrotate.html

Created December 4, 2012 14:40
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save torafugu/4204624 to your computer and use it in GitHub Desktop.
Save torafugu/4204624 to your computer and use it in GitHub Desktop.
Download ZIP
Rotate PShape class without moving to another location.
Raw
procrotate.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<script src="processing-1.4.1.js" type="text/javascript"></script>
<script type="text/processing" data-processing-target="mycanvas">
PShape myicon = loadShape("intrudericon.svg");
int currentAngle = 0;
void setup() {
size(200, 200);
noLoop();
}
void draw() {
background(200);
shape(myicon, 50, 50, 30, 30);
}
void moveRect() {
background(200);
fill(200);
myicon.resetMatrix();
if (currentAngle == TWO_PI) {
currentAngle = 0;
} else {
currentAngle += HALF_PI;
}
myicon.rotate(currentAngle);
shape(myicon, 50, 50, 30, 30);
}
void moveRect2() {
int xAdjust = 0;
int yAdjust = 0;
background(200);
fill(200);
myicon.resetMatrix();
if (currentAngle == TWO_PI) {
currentAngle = 0;
} else {
currentAngle += HALF_PI;
}
myicon.rotate(currentAngle);
if (currentAngle == HALF_PI) {
xAdjust = 30;
yAdjust = 0;
} else if (currentAngle == PI) {
xAdjust = 30;
yAdjust = 30;
} else if (currentAngle == (PI + HALF_PI)) {
xAdjust = 0;
yAdjust = 30;
} else {
xAdjust = 0;
yAdjust = 0;
}
shape(myicon, 50 + xAdjust, 50 + yAdjust, 30, 30);
}
</script>
</head>
<body>
<p>
<canvas id="mycanvas"></canvas>
</p>
<button onClick="moveRect()">Rotate1!</ button>
<button onClick="moveRect2()">Rotate2!</ button>
<script id="script1" type="text/javascript">
function moveRect() {
var p = Processing.getInstanceById("mycanvas");
p.moveRect();
}
function moveRect2() {
var p = Processing.getInstanceById("mycanvas");
p.moveRect2();
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment