# Implimentation

Key:

- x in the p5 canvas column means that the element is part of the p5 canvas element.
- g in the p5 canvas column means that the element is a global part of p5 even though it is not part of the canvas.
- x in the CanvasClass column means that the element is at least partially emplimented in CanvasClass.

Many of the global methods had to be added to CanvasClass. For example, in the normal p5, `rectMode` is global which is fine when there is only one canvas. But in a multi-canvas page, each canvas needs to have its own `rectMode`.

Surprisingly, very few of the "_xxxxxxx" elements had to be implimented.

element | Implemented in p5 canvas | Implemented in CanvasClass
--- | --- | ---
strings
_textFont | x |
_textStyle | x |
_textAlign | x |
_textBaseline | x |
_rectMode | x |
_ellipseMode | x |
_colorMode | g |
_imageMode | x | x
_cachedStrokeStyle | x |
_cachedFillStyle | x |
_cachedBlendMode | x |
_id |  |
numbers
width | x | x
height | x | x
_textSize | x |
_textLeading | x |
_curveTightness | x |
_strokeWeight |  |
_textWeight |  |
_textStrokeWeight |  |
mouseX | g | x (when mouse over canvas)
mouseY | g | x (when mouse over canvas)
pmouseX | g | x (when mouse over canvas)
pmouseY | g | x (when mouse over canvas)
winMouseX | g | x (same as p5 winmouseX over canvas when the mouse is over the canvas. )
winMouseY | g | x (same as p5 winmouseY over canvas when the mouse is over the canvas. )
pwinMouseX | g | x (when mouse over canvas. It appears the p5 pwinMouseX gets updated more frequently that CanvasClass pwinMouseX)
pwinMouseY | g | x (when mouse over canvas. It appears the p5 pwinMouseY gets updated more frequently that CanvasClass pwinMouseY)
movedX | g | x (when mouse over canvas)
movedY | g | x (when mouse over canvas)
functions
_applyDefaults | x |
resizeCanvas | x | x
background | x | x
clear | x | x
fill | x | x
stroke | x | x
erase | x | x
noErase | x | x
image | x | x
_getTintedImageCanvas | x |
blendMode | x | x
blend | x | x
_getPixel | x |
loadPixels | x | x
set | x | x
updatePixels | x | x
_acuteArcToBezier | x |
arc | x | x
ellipse | x | x
line | x | x
point | x | x
quad | x | x
rect | x | x
triangle | x | x
endShape | x | x
strokeCap | x | x
strokeJoin | x | x
strokeWeight | x | x
_getFill | x |
_setFill | x |
_getStroke | x |
_setStroke | x |
bezier | x | x
curve | x | x
_doFillStrokeClose | x |
applyMatrix | x | x P5 canvases apply `resetMatrix()` every time a new frame is drawn.When needed, add `resetMatrix()` at the beginning of `draw()`.
resetMatrix | x | x
rotate | x | x (See `applyMatrix`).
scale | x | x (See `applyMatrix`).
translate | x | x (See `applyMatrix`).
text | x | x
_renderText | x |
textWidth | x | x
_applyTextProperties | x |
push | x | x
pop | x | x
get | x | x The two argument version seems to work correctly. But the no argument and 4 argument versions have problems. First, it is not really known how they should work because there are no examples. Second, the image they produce may be "obsolete" not the final one.
textLeading | x | x
textSize | x | x
textStyle | x | x
textAscent | x | x
textDescent | x | x
textAlign | x | x
_isOpenType | x |
_updateTextMetrics | x |
parent | x | x
id | x | x
class | x | x
mousePressed | x | x
doubleClicked | x | x
mouseWheel | x | x
mouseReleased | x | x
mouseClicked | x | x
mouseMoved | x | x
mouseOver | x | x
mouseOut | x | x
touchStarted | x | x
touchMoved | x | x
touchEnded | x | x
dragOver | x | x
dragLeave | x | x
_setProperty | x |
changed | x | (Apppears to be useless for canvases.)
input | x | (Apppears to be useless for canvases.)
addClass | x | x
removeClass | x | x
hasClass | x | x
toggleClass | x | x
child | x | x
center | x | x Works well if parent is a div. May be a little off if no parent.
html | x | x
position | x | x
_translate | x |
_rotate | x |
style | x | x
attribute | x | x
removeAttribute | x | x
value | x | (Apppears to be useless for canvases.)
show | x | x Has an optional extra parameter: `show(true)` displays inline
hide | x | x
size | x | x No arguments: returns size. Arguments seem useless.
remove | x | x
drop | x | x
color | g | x
colorMode | g | x
loadImage | g | x
noFill | g | x
noStroke | g | x
rectMode | g | x
ellipseMode | g | x
textFont | g | x
square | g | x
circle | g | x
bezierPoint | g | x
bezierTangent | g | x
_decrementPreload | g |
beginShape | g | x
vertex | g | x
keyDown |  | x An event listener like mousePressed
keyUp |  | x An event listener like moiseReleased
blue | g | x
green | g | x
red | g | x
brightness | g | x
hue | g | x
saturation | g | x
lerp | g | x
smooth | g | x
noSmooth | g | x
beginContour | g | x
endContour | g | x
curveVertex | g | x
bezierVertex | g | x
bezierDetail | g | x
curveDetail | g | x
curveTightness | g | x
curvePoint | g | x
curveTangent | g | x
loadFont | g | x
normalMaterial | g | x
emissiveMaterial | g | x
box | g | x Works but problems with "in-motion" rotations.
sphere | g | x Works but problems with "in-motion" rotations.
cone | g | x Works but problems with "in-motion" rotations.
cylinder | g | x Works but problems with "in-motion" rotations.
torus | g | x Works but problems with "in-motion" rotations.
plane | g | x Works but problems with "in-motion" rotations.
rotateX | g | x Works in `setup()` but problems with "in-motion" rotations.
rotateY | g | x Works in `setup()` but problems with "in-motion" rotations.
rotateZ | g | x Works in `setup()` but problems with "in-motion" rotations.
ambientMaterial | g | x (not tested "in-motion")
specularMaterial | g | x (not tested "in-motion")
emissiveMaterial | g | x (not tested "in-motion")
ambientLight | g | x (only tested with 1 and 3 arguments)
pointLight | g | x (only tested with 6 arguments")
specularColor | g | x (only tested with 3 arguments)
shininess | g | x
shearX | g | x
shearY | g | x
imageMode | g | x
save | g | (Use saveCanvas instead)
saveCanvas | g | x
pixelDensity | g | x
objects
elt | x | x
_pixelsState | x |
_pInst | x | x
_events | x | x
canvas | x | x
_textAscent | x (null) |
_textDescent | x (null) |
_tint | x (null) |
drawingContext | x |
_backgoundColor |  |
_fillColor |  |
_strokeColor |  |
touches | g | x
_colorMaxes | g |
renderer |  | x
boolean
_isMainCanvas | x |
_doStroke | x |
_doFill | x |
_strokeSet | x |
_fillSet | x |
_dragDisabled | x |
mouseIsPressed | g | x
keyIsPressed | g | x if keyDown() and keyUp() are declared
isOver |  | x True if the mouse is over the canvas.
_strokeText |  |
_dragStarted |  |
Extras not part of the class
globalMouse |  | If one wants to be able to follow the mouse even when it is outside of the canvas. Set globalMouse equal to the canvas name and use gMouseX and gMouseY. This works for only one canvas at a time.

James Brink, 7/23/2020