Created
May 2, 2011 07:17
-
-
Save hiroshi/951256 to your computer and use it in GitHub Desktop.
processing png
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<title>processing png</title> | |
<script src="http://processingjs.org/content/download/processing-js-1.1.0/processing-1.1.0.min.js"></script> | |
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script> | |
</head> | |
<body> | |
<div> | |
<canvas width="0" height="0"></canvas> (Canvas) | |
</div> | |
<div> | |
<img class="png" /> <- Save or drag and drop this image as a file. | |
</div> | |
<form class="preview" action="javascript:void(0);"> | |
<div> | |
<textarea rows="12" cols="60"> | |
void setup() { | |
int m = 4; // mergin | |
int s = 16; // size | |
size(s, s); | |
// smooth(); // This can have meaning with orignal Java implementation of Processing | |
strokeWeight(2); | |
background(200); | |
stroke(100); | |
line(m, m, s - m, s - m); | |
line(s - m, m, m, s - m); | |
//save("close.png"); | |
} | |
</textarea> | |
</div> | |
<div> | |
<input type="submit" value="update" /> | |
</div> | |
</form> | |
<script> | |
function updateCanvasAndImg () { | |
var canvas = $("canvas")[0]; | |
new Processing(canvas, $("textarea")[0].value); | |
$("img.png").attr("src", canvas.toDataURL()); | |
} | |
$("form").live("submit", updateCanvasAndImg); | |
$(updateCanvasAndImg); | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment