Shapes, Complex Shapes, Colors, Text, Transforms, Environment, Mouse, Keyboard, Math, Trig, Date/Time
Shapes
rect(x, y, w, h) ellipse(x, y, w, h)triangle(x1, y1, x2, y2, x3, y3)line(x1, y1, x2, y2)point(x, y)arc(x, y, w, h, start, stop)bezier(x1, y1, cx1, cy1, cx2, cy2, x2, y2)quad(x1, y1, x2, y2, x3, y3, x4, y4)image(image, x, y, width*, height*)Modes: ellipseMode, rectMode, imageMode, strokeCap, bezierPoint, bezierTangent, curve, curvePoint, curveTangent, curveTightness
Complex Shapes
beginShape()endShape()vertex()curveVertex()bezierVertex()strokeJoin, curveTightness
Colors
background(r, g, b) : Set the background colorfill(r, g, b) : Set the fill color for shapesnoFill() : Turn off fill for shapesstroke(r, g, b) : Set the outline color for shapesstrokeWeight(thickness) : Change the thickness of lines and outlinesnoStroke() : Turn off outlines for shapescolor(r, g, b) : Store a color in a variableblendColor(c1, c2, MODE) : Blend two colors togetherlerpColor(c1, c2, amount) : Find color between 2 colorscolorMode, red, green, blue, alpha, hue, saturation, brightness
Text
text(text, x, y) Draw some texttextFont(font, size*) Changes the font of texttextSize(size) Change the size of textSee also: textWidth, textAscent, textDescent, textLeading, textAlignTransformsrotate(angle) Rotate shapes by an anglescale(amount) Scale shapes in both dimensionstranslate(x, y) Translate shapes by an offsetpushMatrix/popMatrix, resetMatrix, printMatrixEnvironmentwidth / height The size of the canvasdraw = function() { }; Called repeatedly during program execution.playSound(sound) Plays one of the allowed sounds.Program.assertEqual, Program.restart, frameRate(fps) frameCount, loop / noLoop
Mouse
mouseX, mouseY Current coordinates of the mousepmouseX, pmouseY Past coordinates of the mousemouseButton Which button is pressedmouseIsPressed Whether mouse is being pressedmouseClicked = function() { }; Called when mouse is clickedmousePressed = function() { }; Called when mouse is pressedmouseReleased = function() { }; Called when mouse is releasedmouseMoved = function() { }; Called when mouse is movedmouseDragged = function() { }; Called when mouse is draggedmouseOver = function() { }; Called when mouse moves over canvasmouseOut = function() { }; Called when mouse moves out of canvas
Keyboard
key Number representing which key is pressedkeyCode Represents when a special key is pressedkeyIsPressed True if a key is being pressed, false otherwise
keyPressed = function() { }; Called when a key is pressedkeyReleased = function() { }; Called when a key is releasedkeyTyped = function() { }; Called when a key is typed
Math
random(low, high) Generate a random numberdist(x1, y1, x2, y2) Calculates the distance between two pointsconstrain(value, min, max) Constrain value between min and maxmin(num1, num2) Return the minimum of two numbersmax(num1, num2) Return the maximum of two numbersabs(num) Take the absolute value of a numberlog(num) Take the logarithm of a numberpow(num, exponent) Raise a number to an exponentsq(num) Square a numbersqrt(num) Take the square root of a numberround(num) Return nearest integerceil(num) Return nearest integer of greater/equal valuefloor(num) Return nearest integer of lesser/equal valuePVector(x, y) An object that describes a 2-dimensional vectorSee also: mag, exp, map, norm, lerp, noise, noiseDetail, Random.nextGaussian
Trigonometrycos(degrees) Take the cosine of an anglesin(degrees) Take the sine of an angletan(degrees) Take the tangent of an angleSee also: acos, asin, atan, atan2, radians, degrees, angleMode
Date & Timeday()/ month()/ year() Current datehour()/ minute()/ second() Current timemillis() Milliseconds elapsed since program start
Debugging
debug(arg1, arg2, ...) Print to your browser's developer consoleprintln(data) Print to the canvas consoleprint(data) Print to the canvas console
JavaScript
var drawWinston = function() { }; Define a new function if (x < 20) { ... } Only run code if a certain condition is true
while (x < 250) { ... } Only run code while a certain condition is true
for (var i = 0; i < 8; i++) { } Repeat code a fixed number of times
var array = [0, 1, 2, 3, 4];
Make an array of 5 numbers