q5 3.9.0 → 3.9.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/README.md +1 -1
  2. package/defs/q5-c2d-es.d.ts +3 -3
  3. package/defs/q5-c2d.d.ts +19 -3
  4. package/defs/q5-es.d.ts +9 -2
  5. package/deno.json +1 -1
  6. package/package.json +2 -2
  7. package/q5.d.ts +19 -3
  8. package/q5.js +193 -111
  9. package/q5.min.js +1 -1
  10. package/teach/accessibility.html +503 -0
package/README.md CHANGED
@@ -15,7 +15,7 @@ q5.js was designed to make creative coding fun and accessible for a new generati
15
15
  Familiar with p5? You'll be right at home with q5. It's like getting a free computer upgrade! 🖥️
16
16
 
17
17
  ```js
18
- createCanvas(100, 100);
18
+ await Canvas(100, 100);
19
19
  circle(50, 50, 50);
20
20
  ```
21
21
 
package/defs/q5-c2d-es.d.ts CHANGED
@@ -8,6 +8,8 @@ declare global {
8
8
  * ¿Primera vez programando? Revisa la [guía para principiantes de q5](https://github.com/q5js/q5.js/wiki/q5-Beginner's-Brief).
9
9
  *
10
10
  * En estas páginas de "Aprender" puedes experimentar editando los mini ejemplos. ¡Diviértete! 😎
11
+ *
12
+ * [![](/assets/Authored-By-Humans-Not-By-AI-Badge.png)](https://notbyai.fyi/)
11
13
  */
12
14
 
13
15
  /** ⭐
@@ -27,7 +29,7 @@ declare global {
27
29
  * fondo('silver');
28
30
  * círculo(0, 0, 80);
29
31
  */
30
- function Lienzo(ancho?: number, alto?: number, opciones?: CanvasRenderingContext2DSettings): Promise<HTMLCanvasElement>;
32
+ function Lienzo(ancho?: number, alto?: number, opciones?: object): Promise<HTMLCanvasElement>;
31
33
 
32
34
  /** ⭐
33
35
  * Función a declarar. Se ejecutará 60 veces por segundo de forma predeterminada. Tiene comportamiento de bucle, lo que permite hacer animaciones cuadro a cuadro.
@@ -1959,8 +1961,6 @@ declare global {
1959
1961
  * Limpia el lienzo, haciendo que cada píxel sea completamente transparente.
1960
1962
  *
1961
1963
  * Ten en cuenta que el lienzo solo se puede ver a través si tiene un canal alfa.
1962
- *
1963
- * #### webgpu
1964
1964
  * @example
1965
1965
  * crearLienzo(200, 200, { alpha: true });
1966
1966
  *
package/defs/q5-c2d.d.ts CHANGED
@@ -9,6 +9,8 @@ declare global {
9
9
  *
10
10
  * On these Learn pages, you can experiment with editing the
11
11
  * interactive mini examples. Have fun! 😎
12
+ *
13
+ * [![](/assets/Authored-By-Humans-Not-By-AI-Badge.png)](https://notbyai.fyi/)
12
14
  */
13
15
 
14
16
  /** ⭐
@@ -28,7 +30,7 @@ declare global {
28
30
  * background('silver');
29
31
  * circle(0, 0, 80);
30
32
  */
31
- function Canvas(w?: number, h?: number, options?: CanvasRenderingContext2DSettings): Promise<HTMLCanvasElement>;
33
+ function Canvas(w?: number, h?: number, options?: object): Promise<HTMLCanvasElement>;
32
34
 
33
35
  /** ⭐
34
36
  * The q5 draw function is run 60 times per second by default.
@@ -1968,8 +1970,6 @@ declare global {
1968
1970
  * Clears the canvas, making every pixel completely transparent.
1969
1971
  *
1970
1972
  * Note that the canvas can only be seen through if it has an alpha channel.
1971
- *
1972
- * #### webgpu
1973
1973
  * @example
1974
1974
  * createCanvas(200, 200, { alpha: true });
1975
1975
  *
@@ -2826,6 +2826,22 @@ declare global {
2826
2826
  */
2827
2827
  const QUARTER_PI: number;
2828
2828
 
2829
+ function sin(angle: number): number;
2830
+
2831
+ function cos(angle: number): number;
2832
+
2833
+ function tan(angle: number): number;
2834
+
2835
+ function mag(val1: number, val2: number): number;
2836
+
2837
+ function asin(n: number): number;
2838
+
2839
+ function acos(n: number): number;
2840
+
2841
+ function atan(n: number): number;
2842
+
2843
+ function atan2(y: number, x: number): number;
2844
+
2829
2845
  // 🔊 sound
2830
2846
 
2831
2847
  /**
package/defs/q5-es.d.ts CHANGED
@@ -8,6 +8,8 @@ declare global {
8
8
  * ¿Primera vez programando? Revisa la [guía para principiantes de q5](https://github.com/q5js/q5.js/wiki/q5-Beginner's-Brief).
9
9
  *
10
10
  * En estas páginas de "Aprender" puedes experimentar editando los mini ejemplos. ¡Diviértete! 😎
11
+ *
12
+ * [![](/assets/Authored-By-Humans-Not-By-AI-Badge.png)](https://notbyai.fyi/)
11
13
  */
12
14
 
13
15
  /** ⭐
@@ -27,7 +29,7 @@ declare global {
27
29
  * fondo('silver');
28
30
  * círculo(0, 0, 80);
29
31
  */
30
- function Lienzo(ancho?: number, alto?: number, opciones?: CanvasRenderingContext2DSettings): Promise<HTMLCanvasElement>;
32
+ function Lienzo(ancho?: number, alto?: number, opciones?: object): Promise<HTMLCanvasElement>;
31
33
 
32
34
  /** ⭐
33
35
  * Función a declarar. Se ejecutará 60 veces por segundo de forma predeterminada. Tiene comportamiento de bucle, lo que permite hacer animaciones cuadro a cuadro.
@@ -1884,8 +1886,13 @@ declare global {
1884
1886
  * Limpia el lienzo, haciendo que cada píxel sea completamente transparente.
1885
1887
  *
1886
1888
  * Ten en cuenta que el lienzo solo se puede ver a través si tiene un canal alfa.
1889
+ * @example
1890
+ * await Lienzo(200, { alpha: true });
1887
1891
  *
1888
- * #### webgpu
1892
+ * q5.dibujar = function () {
1893
+ * limpiar();
1894
+ * círculo((frameCount % 200) - 100, 0, 80);
1895
+ * };
1889
1896
  */
1890
1897
  function limpiar(): void;
1891
1898
 
package/deno.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@q5/q5",
3
- "version": "3.9.0",
3
+ "version": "3.9.4",
4
4
  "license": "LGPL-3.0",
5
5
  "description": "Beginner friendly graphics powered by WebGPU and optimized for interactive art!",
6
6
  "author": "quinton-ashley",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "q5",
3
- "version": "3.9.0",
3
+ "version": "3.9.4",
4
4
  "description": "Beginner friendly graphics powered by WebGPU and optimized for interactive art!",
5
5
  "author": "quinton-ashley",
6
6
  "contributors": [
@@ -34,7 +34,7 @@
34
34
  "dist": "bun bundle && bun min",
35
35
  "dist-p5play": "bun dist && cp q5.js ../../web/p5play-web/v3/q5.js && cp q5.min.js ../../web/p5play-web/v3/q5.min.js",
36
36
  "tests": "jest test",
37
- "types": "node lang/types.js",
37
+ "bld": "node lang/types.js",
38
38
  "v": "npm version patch --force",
39
39
  "V": "npm version minor --force",
40
40
  "version": "git add -A",
package/q5.d.ts CHANGED
@@ -9,6 +9,8 @@ declare global {
9
9
  *
10
10
  * On these Learn pages, you can experiment with editing the
11
11
  * interactive mini examples. Have fun! 😎
12
+ *
13
+ * [![](/assets/Authored-By-Humans-Not-By-AI-Badge.png)](https://notbyai.fyi/)
12
14
  */
13
15
 
14
16
  /** ⭐
@@ -28,7 +30,7 @@ declare global {
28
30
  * background('silver');
29
31
  * circle(0, 0, 80);
30
32
  */
31
- function Canvas(w?: number, h?: number, options?: CanvasRenderingContext2DSettings): Promise<HTMLCanvasElement>;
33
+ function Canvas(w?: number, h?: number, options?: object): Promise<HTMLCanvasElement>;
32
34
 
33
35
  /** ⭐
34
36
  * The q5 draw function is run 60 times per second by default.
@@ -1968,8 +1970,6 @@ declare global {
1968
1970
  * Clears the canvas, making every pixel completely transparent.
1969
1971
  *
1970
1972
  * Note that the canvas can only be seen through if it has an alpha channel.
1971
- *
1972
- * #### webgpu
1973
1973
  * @example
1974
1974
  * createCanvas(200, 200, { alpha: true });
1975
1975
  *
@@ -2826,6 +2826,22 @@ declare global {
2826
2826
  */
2827
2827
  const QUARTER_PI: number;
2828
2828
 
2829
+ function sin(angle: number): number;
2830
+
2831
+ function cos(angle: number): number;
2832
+
2833
+ function tan(angle: number): number;
2834
+
2835
+ function mag(val1: number, val2: number): number;
2836
+
2837
+ function asin(n: number): number;
2838
+
2839
+ function acos(n: number): number;
2840
+
2841
+ function atan(n: number): number;
2842
+
2843
+ function atan2(y: number, x: number): number;
2844
+
2829
2845
  // 🔊 sound
2830
2846
 
2831
2847
  /**