Skip to content

Commit 5642576

Browse files
dmesterdmester
committed
Added JSDoc to typings.
1 parent 0b99864 commit 5642576

File tree

3 files changed

+153
-0
lines changed

3 files changed

+153
-0
lines changed

‎types/canvas.d.ts‎

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,54 @@
11
import { CanvasContext } from "./canvasContext";
22

3+
/**
4+
* Represents a canvas partly compatible with the official `HTMLCanvasElement`.
5+
*/
36
export interface Canvas {
7+
/**
8+
* The width of the canvas in pixels.
9+
*/
410
width: number;
11+
/**
12+
* The height of the canvas in pixels.
13+
*/
514
height: number;
15+
/**
16+
* Specifies the background color. Default is fully transparent. Allowed values are:
17+
* - 32 bit integers on the format `0xRRGGBBAA`
18+
* - strings on the format `"#RGB"`
19+
* - strings on the format `"#RGBA"`
20+
* - strings on the format `"#RRGGBB"`
21+
* - strings on the format `"#RRGGBBAA"`
22+
* - strings on the format `"rgb(255, 255, 255)"`
23+
* - strings on the format `"rgb(255, 255, 255, 0.5)"`
24+
* - strings on the format `"rgb(255, 255, 255, 50%)"`
25+
* - strings on the format `"rgba(255, 255, 255, 0.5)"`
26+
* - strings on the format `"rgba(255, 255, 255, 50%)"`
27+
* - strings on the format `"hsl(134, 50%, 50%)"`
28+
* - strings on the format `"hsl(134, 50%, 50%, 0.5)"`
29+
* - strings on the format `"hsl(134, 50%, 50%, 50%)"`
30+
* - strings on the format `"hsla(134, 50%, 50%, 0.5)"`
31+
* - strings on the format `"hsla(134, 50%, 50%, 50%)"`
32+
* - strings on the format `"hwb(134, 50%, 50%)"`
33+
* - strings on the format `"hwb(134, 50%, 50%, 0.5)"`
34+
* - strings on the format `"hwb(134, 50%, 50%, 50%)"`
35+
*/
636
backColor: number | string;
37+
/**
38+
* Gets a context used to draw polygons on this canvas.
39+
* @param contextId Type of context. Only `"2d"` is supported, and also the default value.
40+
* @param contextAttributes Options passed to the context. Currently no options are supported. Provided for compatibility with `HTMLCanvasElement`.
41+
*/
742
getContext(contextId?: string, contextAttributes?: {}): CanvasContext;
43+
/**
44+
* Renders the canvas as a PNG data stream.
45+
* @param keywords Keywords to be written to the PNG stream. See https://www.w3.org/TR/PNG/#11keywords.
46+
*/
847
toPng(keywords?: { [key: string]: string }): Buffer;
48+
/**
49+
* Renders the canvas as a data URI.
50+
* @param type Content type of returned image. Only `"image/png"` is supported, and also the default value.
51+
* @param encoderOptions Options passed to the image encoder. Currently no options are recognized. Provided for compatibility with `HTMLCanvasElement`.
52+
*/
953
toDataURL(type?: string, encoderOptions?: any): string;
1054
}

‎types/canvasContext.d.ts‎

Lines changed: 104 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,54 @@
11
import { Canvas } from "./canvas";
22

3+
/**
4+
* Provides a rendering context, partly compatible with the official `CanvasRenderingContext2D`, for drawing shapes on a `Canvas`.
5+
*/
36
export interface CanvasContext {
7+
/**
8+
* Gets the canvas for which the context was created.
9+
*/
410
readonly canvas: Canvas;
11+
/**
12+
* Specifies the fill color that is used when the fill method is called. Allowed values are:
13+
* - 32 bit integers on the format 0xRRGGBBAA
14+
* - strings on the format `"#RGB"`
15+
* - strings on the format `"#RGBA"`
16+
* - strings on the format `"#RRGGBB"`
17+
* - strings on the format `"#RRGGBBAA"`
18+
* - strings on the format `"rgb(255, 255, 255)"`
19+
* - strings on the format `"rgb(255, 255, 255, 0.5)"`
20+
* - strings on the format `"rgb(255, 255, 255, 50%)"`
21+
* - strings on the format `"rgba(255, 255, 255, 0.5)"`
22+
* - strings on the format `"rgba(255, 255, 255, 50%)"`
23+
* - strings on the format `"hsl(134, 50%, 50%)"`
24+
* - strings on the format `"hsl(134, 50%, 50%, 0.5)"`
25+
* - strings on the format `"hsl(134, 50%, 50%, 50%)"`
26+
* - strings on the format `"hsla(134, 50%, 50%, 0.5)"`
27+
* - strings on the format `"hsla(134, 50%, 50%, 50%)"`
28+
* - strings on the format `"hwb(134, 50%, 50%)"`
29+
* - strings on the format `"hwb(134, 50%, 50%, 0.5)"`
30+
* - strings on the format `"hwb(134, 50%, 50%, 50%)"`
31+
*/
532
fillStyle: number | string;
33+
/**
34+
* Saves the current drawing state to a stack. The state can later be restored by calling `CanvasContext.restore()`.
35+
*
36+
* The following state is included when being saved to the stack:
37+
* - Current transformation matrix
38+
* - Current fill style
39+
*/
640
save(): void;
41+
/**
42+
* Restores the last drawing state that was saved with `CanvasContext.save()`, and then removes it from the state stack.
43+
*/
744
restore(): void;
45+
/**
46+
* Restores the current transformation to the identity matrix.
47+
*/
848
resetTransform(): void;
49+
/**
50+
* Multiplies the current transformation matrix with the specified values.
51+
*/
952
transform(
1053
a: number,
1154
b: number,
@@ -14,6 +57,9 @@ export interface CanvasContext {
1457
e: number,
1558
f: number
1659
): void;
60+
/**
61+
* Sets the transformation matrix to the specified matrix.
62+
*/
1763
setTransform(
1864
a: number,
1965
b: number,
@@ -22,13 +68,52 @@ export interface CanvasContext {
2268
e: number,
2369
f: number
2470
): void;
71+
/**
72+
* Applies a translation transformation on top of the current transform.
73+
* @param x Distance to move in the horizontal direction in pixels.
74+
* @param y Distance to move in the vertical direction in pixels.
75+
*/
2576
translate(x: number, y: number): void;
77+
/**
78+
* Applies a scale transformation on top of the current transform.
79+
* @param x Scale in the horizontal direction. `1` means no horizontal scaling.
80+
* @param y Scale in the vertical direction. `1` means no vertical scaling.
81+
*/
2682
scale(x: number, y: number): void;
83+
/**
84+
* Applies a rotation transformation on top of the current transform around the current canvas origo.
85+
* @param angle Angle in radians measured clockwise from the positive x axis.
86+
*/
2787
rotate(angle: number): void;
88+
/**
89+
* Removes all existing subpaths and begins a new path.
90+
*/
2891
beginPath(): void;
92+
/**
93+
* Starts a new subpath that begins in the same point as the start and end point of the previous one.
94+
*/
2995
closePath(): void;
96+
/**
97+
* Begins a new subpath by moving the cursor to the specified position.
98+
* @param x X coordinate.
99+
* @param y Y coordinate.
100+
*/
30101
moveTo(x: number, y: number): void;
102+
/**
103+
* Inserts an edge between the last and specified position.
104+
* @param x Target X coordinate.
105+
* @param y Target Y coordinate.
106+
*/
31107
lineTo(x: number, y: number): void;
108+
/**
109+
* Adds an arc to the current path.
110+
* @param x X coordinate of the center of the arc.
111+
* @param y Y coordinate of the center of the arc.
112+
* @param radius Radius of the arc.
113+
* @param startAngle The angle in radians at which the arc starts, measured clockwise from the positive x axis.
114+
* @param endAngle The angle in radians at which the arc end, measured clockwise from the positive x axis.
115+
* @param anticlockwise Specifies whether the arc will be drawn counter clockwise. Default is clockwise.
116+
*/
32117
arc(
33118
x: number,
34119
y: number,
@@ -37,7 +122,26 @@ export interface CanvasContext {
37122
endAngle: number,
38123
anticlockwise?: boolean
39124
): void;
125+
/**
126+
* Fills a specified rectangle with fully transparent black without blending with the background or affecting the current paths.
127+
* @param x X coordinate of the left side of the rectangle.
128+
* @param y Y coordinate of the top of the rectangle.
129+
* @param width Width of the rectangle.
130+
* @param height Height of the rectangle.
131+
*/
40132
clearRect(x: number, y: number, width: number, height: number): void;
133+
/**
134+
* Fills a specified rectangle without affecting the current paths.
135+
* @param x X coordinate of the left side of the rectangle.
136+
* @param y Y coordinate of the top of the rectangle.
137+
* @param width Width of the rectangle.
138+
* @param height Height of the rectangle.
139+
*/
41140
fillRect(x: number, y: number, width: number, height: number): void;
141+
/**
142+
* Fills the defined paths.
143+
* @param windingRule The winding rule to be used for determining
144+
* which areas are covered by the current path. Default is `"nonzero"`.
145+
*/
42146
fill(windingRule?: "nonzero" | "evenodd"): void;
43147
}

‎types/index.d.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,4 +3,9 @@ import { Canvas } from "./canvas";
33
export { Canvas } from "./canvas";
44
export { CanvasContext } from "./canvasContext";
55

6+
/**
7+
* Creates a new canvas.
8+
* @param width Width of the canvas in pixels.
9+
* @param heigth Height of the canvas in pixels.
10+
*/
611
export function createCanvas(width: number, height: number): Canvas;

0 commit comments

Comments
 (0)