Module to create images to canvas of HTML5.

CONST
black, white, red, green, blue;
Most common colors.

VAR mouseX, mouseY, width, height: INTEGER;
focus: BOOLEAN;
key: CHAR;
keyCode: INTEGER; (* http://keycode.info *)
fontName: ARRAY 64 OF CHAR;

PROCEDURE Start

Opens a canvas and starts looping the procedure that was set by SetDrawProc.

PROCEDURE NoLoop

Stops looping the procedure that was set by SetDrawProc.

PROCEDURE Loop

Reactivates the DrawProc looping that was stopped by NoLoop.

PROCEDURE Redraw

Calls only once the DrawProc procedure that was set by SetDrawProc.

PROCEDURE ColorARGB (alpha, red, green, blue: INTEGER): INTEGER;

Make color code from four variables from 0-255.

PROCEDURE SetSetupProc(s: CallbackType);

Setting up a procedure for setting up a model.

PROCEDURE SetDrawProc(d: CallbackType);

Setting up a procedure for drawing.

PROCEDURE SetPressedProc(c: CallbackType);

Setting up a procedure for handling mouse clicks.

PROCEDURE SetReleasedProc(c: CallbackType);

Set up a procedure to handle mouse release.

PROCEDURE SetOutProc(c: CallbackType);

Setting the procedure for the event of the cursor leaving the canvas.

PROCEDURE SetOverProc(c: CallbackType);

Setting up a procedure for the event that the cursor appears over the canvas.

PROCEDURE SetKeyPressedProc(c: CallbackType);

Set up a procedure for a keypress event on a keyboard.

PROCEDURE SetFrameRate* (fps : INTEGER);

Specifies the number of frames per second (fps) to be displayed in the animation. If the processor is not fast enough to maintain the specified rate, the frame rate will not be achieved. Setting the frame rate within the Setup procedure is recommended. The default rate is 60 frames per second.

PROCEDURE SetBackground(argb : INTEGER);

PROCEDURE SetSize(w, h : INTEGER);

PROCEDURE Fill(argb : INTEGER);

Sets the color used to fill shapes, incl. characters

PROCEDURE NoFill;

Disabl filling shapes. If NoFill are called, nothing will be drawn to the screen. PROCEDURE Stroke(argb : INTEGER);

Sets the color used to draw lines and borders around shapes. PROCEDURE NoStroke;

Disable drawing the stroke (outline) shapes. If NoStroke are called, nothing will be drawn to the screen.

PROCEDURE StrokeWidth(width : INTEGER);

PROCEDURE Smooth; PROCEDURE NoSmooth;

Enables or disables Drawing all geometry with smooth (anti-aliased) edges.

PROCEDURE Point(x0, y0: REAL);

PROCEDURE Line(x0, y0, x1, y1: REAL);

PROCEDURE Ellipse(x, y, w, h: REAL);

PROCEDURE Rect(x, y, w, h: REAL);

PROCEDURE RectRounded(x, y, w, h, r: REAL);

PROCEDURE Pointi(x0, y0: INTEGER);

PROCEDURE Linei(x0, y0, x1, y1: INTEGER);

PROCEDURE Ellipsei(x, y, w, h: INTEGER);

PROCEDURE Recti(x, y, w, h: INTEGER);

PROCEDURE RectRoundedi(x, y, w, h, r: INTEGER);

PROCEDURE SetFont* (name: ARRAY OF CHAR);

PROCEDURE StringWidth*(mystr: ARRAY OF CHAR; size: INTEGER): INTEGER;

PROCEDURE String(mystr: ARRAY OF CHAR; x, y: REAL; size: INTEGER);

PROCEDURE Stringi(mystr: ARRAY OF CHAR; x, y, size: INTEGER);

PROCEDURE LoadImage* (name: ARRAY OF CHAR): Image;

PROCEDURE PlaceImage* (image: Image; x, y: REAL);

PROCEDURE Translate(x, y: REAL);

Shifts the origin (0, 0) of the coordinates of the canvas in the specified direction: x to the right, y downwards.

PROCEDURE PushMatrix;

PROCEDURE PopMatrix;

Pushes or pops the current transformation matrix onto the matrix stack. PushMatrix saves the current coordinate system to the stack and PopMatrix restores the prior coordinate system.

PROCEDURE Rotate(angle : REAL);

Rotates the amount specified by the angle parameter. Angles must be specified in radians (values from 0 to 2π), or they can be converted from degrees to radians with the Math.Radians() function.