Documentation - TheCoder5550/gcjs GitHub Wiki

Welcome to the gc.js wiki!

Below is the documentation for all the functions, variable, etc

Functions

clearScreen(): Clears the screen.

background (color): Fill the screen with (color)

drawCircle, circle (x, y, radius, fillColor, [strokeColor], [settings]): Draws a circle at (x, y) with a (radius) and (fillColor). Optionally (strokeColor) and (settings)

drawRing, ring (x, y, radius, strokeColor, [thickness]): Draws a ring at (x, y) with a (radius) and a (strokeColor). Optionally a (thickness)

drawRectangle, rectangle, rect (x, y, width, height, fillColor, [strokeColor], [settings]): Draws a rectangle at (x, y) with (width, height) and (fillColor). Optionally (strokeColor) and (settings)

drawTriangle, triangle, tri (x1, y1, x2, y2, x3, y3, fillColor, [strokeColor], [settings]): Draws a triangle with vertices (x1, y2), (x2, y2), (x3, y3) and a (fillColor). Optionally (strokeColor) and (settings)

drawTriangleEquilateral, triangleEq (x, y, radius, fillColor, [strokeColor], [settings]): Draws a equilateral triangle at (x, y) with a (radius), which is the distance from the center to one of the vertices, and a (fillColor). Optionally (strokeColor) and (settings)

drawRegularPolygon, regPolygon (x, y, radius, vertices, fillColor, [strokeColor], [settings]): Draws a regular polygon at (x, y) with a (radius), which is the distance from the center to one of the vertices, a number of (vertices) and (fillColor). Optionally (strokeColor) and (settings)

drawEllipse, ellipse, oval (x, y, width, height, fillColor, [strokeColor], [settings]): Draws a ellipse at (x, y) with a (width) and (height) and a (fillColor). Optionally (strokeColor) and (settings)

preloadImage (source): Preloads a image with (source) as argument. Put this in a function called "preload". Images can then be drawn with the same (source)

drawImage, image, picture (source, x, y, width, height, [settings]): Renders a image with specified (source) at (x, y) with a (width) and a (height). Optionally (settings). Image should be preloaded beforehand with "preloadImage"

imageReadPixel (source, x, y): Get the color of a pixel in image with (source) at index (x, y)

drawLine, line (x1, y1, x2, y2, strokeColor, [settings]) or (p1, p2, strokeColor, [settings]): Draws a line from either (x1, y1) to (x2, y2) or from (p1) to (p2) with a (strokeColor). Optionally (settings)

drawPoint, point (x, y): Draws a black dot a (x, y). Good for testing instead of having to use "circle"

drawText, text (text, x, y, fontSize, fillColor, [strokeColor], [settings]): Renders (text) at (x, y) with specified (fontSize) and (fillColor). Optionally (strokeColor) and (settings)

drawPolygon, polygon (vertexPositions, fillColor, [strokeColor], [settings]): Draws a shape with specified (vertexPositions) and (fillColor). Optionally (strokeColor) and (settings). (vertexPositions) is structured like this: [{x: 0, y: 0}, {x: 10, y: 0}, etc...]

gradient (startColor, endColor, radius, [settings]): Returns a gradient with (startColor), (endColor) and (radius). Optionally (settings). THIS FUNCTION IS WIP!

beginShape (): Creates a new drawing context, equivalent of using ctx.beginPath()

moveTo (x, y): Alias for ctx.moveTo(x, y)

lineTo (x, y): Alias for ctx.lineTo(x, y)

curveTo (x1, y1, x2, y2): Alias for ctx.quadraticCurveTo(x1, y1, x2, y2)

closeShape (): Alias for ctx.closePath()

renderShape (fillColor, [strokeColor], [settings]): Can be used together with beginShape, moveTo, lineTo, curveTo and closeShape to render the shape. This function gets called by drawRectangle, drawCircle etc to render them

updatePixelData (): Reads every pixel on the canvas and stores it in an internal array

updatePixel (x, y, r, g, b, a): Updates a pixels color (r, g, b, a) in the pixel array at (x, y)

readPixel (x, y): Reads the color of a pixel at (x, y) in the pixel array. Returns an array: [r, g, b, a]

renderPixelData (): Renders all pixels from the pixel array back to the canvas

getDistance, distance (x1, y1, x2, y2) or (p1, p2): Returns the shortest distance between (x1, y1) and (x2, y2) or (p1) and (p2) in pixels

getAngle, (x1, y1, x2, y2, [settings]) or (p1, p2, [settings]): Returns the angle in radians between (x1, y1) and (x2, y2) or between (p1) and (p2). Angle mode can be changed from radians to degrees by setting settings to {angleMode: "DEG"} or {angleMode: "DEGREES"}

random (min, [max]): Returns a random float number between (min) and (max) or a random float number between 0 and (min)

randomInt (min, [max]): Returns a random int between (min) and (max) or a random int between 0 and (min)

randomArray (array): Returns a random element from an (array)

canvasToURL (): Returns a base64 address of the canvas

canvasToImage (): Returns the canvas as an image

downloadCanvasPNG ([filename]): Downloads the canvas as an png image with optional (filename)

createArray (n, length): Returns a (n) dimensional array thats (length)^n

isKeyPressed, getKey (key): Return either true or false depending on if the (key) is being pressed. (key) is either the keycode or the key name

Variables

mouse: Contains the x and y position of the mouse and which button is being pressed (left, middle or right)

mouseX: The x position of the mouse

mouseY: The y position of the mouse

touch: Contains the x and y position of the touch, if the screen is being touched (touching) and an array of all touches (touches)