diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index 1703325..f544fc5 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -30,12 +30,7 @@ jobs: - name: Install dependencies run: npm ci - - name: Install tool dependencies - working-directory: ./tools/TypeScript-DOM-lib-generator - run: npm ci - - - name: Generate ReScript code - working-directory: ./tools/TypeScript-DOM-lib-generator + - name: Build ReScript code run: npm run build - name: Run tests diff --git a/.gitignore b/.gitignore index e7fa681..f3f409f 100644 --- a/.gitignore +++ b/.gitignore @@ -2,4 +2,5 @@ /lib/ .bsb.lock .astro -dist/ \ No newline at end of file +dist/ +tmp/ \ No newline at end of file diff --git a/astro.config.mjs b/astro.config.mjs index c661b71..38237d2 100644 --- a/astro.config.mjs +++ b/astro.config.mjs @@ -23,6 +23,21 @@ export default defineConfig({ editLink: { baseUrl: 'https://github.com/rescript-lang/experimental-rescript-webapi/edit/main/', }, + sidebar: [ + { + slug: '', + }, + { + slug: 'design-philosophy', + }, + { + slug: 'project-status', + }, + { + label: 'Contributing', + autogenerate: { directory: 'contributing' }, + }, + ], customCss: ["./docs/styles/fonts.css", "./docs/styles/theme.css"], expressiveCode: { shiki: { diff --git a/docs/content/docs/contributing/api-modelling.mdx b/docs/content/docs/contributing/api-modelling.mdx new file mode 100644 index 0000000..7b8fe79 --- /dev/null +++ b/docs/content/docs/contributing/api-modelling.mdx @@ -0,0 +1,149 @@ +--- +title: API Modelling +description: Learn more about the API modelling process of @rescript/webapi. +slug: "04-api-modelling" +--- + +import { Aside, Code, Icon } from "@astrojs/starlight/components"; + +One of this projects goals is to provide a consistent and idiomatic API for the Web APIs. +The interopt story of ReScript is quite good, but it it has limitations. +JavaScript is a dynamic language and has a lot of flexibility. +ReScript is a statically typed language and has to model the dynamic parts of JavaScript in a static way. + +## Dynamic parameters and properties + +Some Web APIs have a parameter or property that can be multiple things. +In ReScript, you would model this as a variant type. This is an example wrapper around values with a key property to discriminate them. + +In JavaScript, this strictness is not enforced and you can pass a string where a number is expected. +There are multiple strategies to model this in ReScript and it depends on the specific API which one is the best. + +### Overloads + +One example is [addEventListener](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener). +This can access either a boolean or an object as the third parameter. + +```js +addEventListener(type, listener); +addEventListener(type, listener, options); +addEventListener(type, listener, useCapture); +``` + +Because, this is a method, we can model this as an overloaded function in ReScript. +The first two overloads are the same, so we can merge them into one with an optional options parameter. + +```ReScript +@send +external addEventListener: ( + htmlButtonElement, + eventType, + eventListener<'event>, + ~options: addEventListenerOptions=?, +) => unit = "addEventListener" +``` + +The third overload takes a boolean and is worth using when you want to change the default of the `useCapture` boolean parameter. +We can use [a fixed argument](https://rescript-lang.org/docs/manual/latest/bind-to-js-function#fixed-arguments) to model this. + +```ReScript +@send +external addEventListener_useCapture: ( + htmlButtonElement, + ~type_: eventType, + ~callback: eventListener<'event>, + @as(json`true`) _, +) => unit = "addEventListener" +``` + + + +### Decoded variants + +We can be pragmatic with overloaded functions and use model them in various creative ways. +For properties, we **cannot do this unfortunately**. A propery can only be defined once and have a single type. + +The strategy here is to use a decoded variant. + +Example for the [fillStyle](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/fillStyle) property of the `CanvasRenderingContext2D` interface can be either a: + +- `string` +- `CanvasGradient` +- `CanvasPattern` + +These types are not all primitives and thus we cannot define it as [untagged variants](https://rescript-lang.org/docs/manual/latest/variant#untagged-variants). +What we can do instead is represent the type as an empty type and use a helper module to interact with this. + +export const fillStyleDef = ` +type fillStyle + +type canvasRenderingContext2D = { +// ... other propeties +mutable fillStyle: fillStyle +} +`; + + + +When we wish to read and write the `fillStyle` property, we can use a helper module to lift the type to an actual ReScript variant: + +export const fillStyleModule = ` +open Prelude +open CanvasAPI +open DOMAPI + +external fromString: string => fillStyle = "%identity" +external fromCanvasGradient: canvasGradient => fillStyle = "%identity" +external fromCanvasPattern: canvasGradient => fillStyle = "%identity" + +type decoded = +| String(string) +| CanvasGradient(canvasGradient) +| CanvasPattern(canvasPattern) + +let decode = (t: fillStyle): decoded => { +if CanvasGradient.isInstanceOf(t) { +CanvasGradient(unsafeConversation(t)) +} else if CanvasPattern.isInstanceOf(t) { +CanvasPattern(unsafeConversation(t)) +} else { +String(unsafeConversation(t)) +} +} +` + + + +We can now use `FillStyle.decode` to get the actual value of the `fillStyle` property. +And use `FillStyle.fromString`, `FillStyle.fromCanvasGradient`, and `FillStyle.fromCanvasPattern` to set the value. + +```ReScript +let ctx = myCanvas->HTMLCanvasElement.getContext_2D + +// Write +ctx.fillStyle = FillStyle.fromString("red") + +// Read +switch ctx.fillStyle->FillStyle.decode { +| FillStyle.String(color) => Console.log(`Color: ${color}`) +| FillStyle.CanvasGradient(_) => Console.log("CanvasGradient") +| FillStyle.CanvasPattern(_) => Console.log("CanvasPattern") +} +``` + + +Try and use `decoded` and `decode` as conventions for the type and function +names. diff --git a/docs/content/docs/contributing/code-generation.mdx b/docs/content/docs/contributing/code-generation.mdx new file mode 100644 index 0000000..37ead83 --- /dev/null +++ b/docs/content/docs/contributing/code-generation.mdx @@ -0,0 +1,86 @@ +--- +title: Code Generation +description: Learn more about the code generation process for @rescript/webapi. +slug: "03-code-generation" +--- + +The original bindings were generated using a modified version of [TypeScript-DOM-lib-generator](https://github.com/microsoft/TypeScript-DOM-lib-generator). +These bindings were a great starting point, but they are not perfect. +It is more than likely that you will need to **tweak the generated bindings by hand** to make them more idiomatic to ReScript. + +For example the `window.fetch` function was generated as: + +```ReScript +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/Window/fetch) +*/ +@send +external fetch: (window, ~input: request, ~init: requestInit=?) + => Promise.t = "fetch" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/Window/fetch) +*/ +@send +external fetch2: (window, ~input: string, ~init: requestInit=?) + => Promise.t = "fetch" +``` + +While not that bad and usable, it can be improved: + +- Rename `fetch2` to `fetch` because it is the more common usage of the function. +- Rename `fetch` to `fetch_with_request` for clarity that this is the "overload" with a `Request` object. +- Consider removing the named `~input` and `~init` arguments and use positional arguments instead. + Motivation: If the function does not have any parameters with the same type, it is more ergonomic to use positional arguments. + This heuristic is not set in stone and can be adjusted based on the specific function. +- The documentation can be improved. + +```ReScript +/** TODO: add better docs */ +@send +external fetch: (window, string, ~init: requestInit=?) + => Promise.t = "fetch" + +/** TODO: add better docs */ +@send +external fetch_withRequest: (window, request, ~init: requestInit=?) + => Promise.t = "fetch" +``` + +Once these changes are made, the bindings can be tested and then committed to the repository. +The generation does no longer happen automatically, so manual improvements will not be overwritten. + +## Sandboxed Code Generation + +Not every API was covered by the TypeScript-DOM-lib-generator. +Potentially, you want to add a new API to the bindings and star from code generation. + +In [emitter.ts](https://github.com/rescript-lang/experimental-rescript-webapi/blob/main/tools/TypeScript-DOM-lib-generator/src/build/emitter.ts), +you can override the `interfaceHierarchy` with any new interface or type you want to add. + +```typescript +interfaceHierarchy = [ + { + name: "Temp", + entries: [ + enums(["WebGLPowerPreference"]), + dictionaries([ + "ImageBitmapRenderingContextSettings", + "WebGLContextAttributes", + ]), + ], + opens: [], + }, +]; +``` + +After running the generator (in `tools/TypeScript-DOM-lib-generator`): + +```shell +npm run build +``` + +All the generated files will be in the `tmp` folder. You can use this as inspiration for your own bindings. + +To figure out if you need `enums`, `dictionaries`, or `interfaces`, you can look at the [JSON dump](https://github.com/rescript-lang/experimental-rescript-webapi/blob/main/tools/TypeScript-DOM-lib-generator/dom-dump.json) file +and see how the TypeScript-DOM-lib-generator represents the shape you are after. diff --git a/docs/content/docs/contributing/documentation.mdx b/docs/content/docs/contributing/documentation.mdx new file mode 100644 index 0000000..5f27194 --- /dev/null +++ b/docs/content/docs/contributing/documentation.mdx @@ -0,0 +1,46 @@ +--- +title: "Documentation" +description: Learn more about the relevance of adding documentation to @rescript/webapi. +slug: "06-documentation" +--- + +After the bindings are generated, all you got was a link to the MDN documentation. +While again, not that bad, it can be improved by adding the core of the binding to the documentation. +And explain how it is supposed to be used. + +## Importance + +One could wonder how important documentation is in this case? +A link to MDN is enough, right? Well, not always. +When a method has multiple overloads, it can be hard to understand which one to use. +By adding an example usage, the user can see easily see which one to use. +It keeps the user inside the IDE and avoids context switching. + +## Structure + +The documentation for each binding should roughly follow this structure: + +- signature +- key description (tip: check MDN for inspiration) +- example usage +- link to the MDN documentation + +For example, the `window.fetch` function could be documented as: + +````ReScript +/* +`fetch(string, init)` + +Starts the process of fetching a resource from the network, +returning a promise that is fulfilled once the response is available. + +```res +window->Window.fetch("https://rescript-lang.org") +``` + +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/Window/fetch) +*/ +@send +external fetch: (window, string, ~init: requestInit=?) + => Promise.t = "fetch" +```` diff --git a/docs/content/docs/contributing/getting-started.mdx b/docs/content/docs/contributing/getting-started.mdx new file mode 100644 index 0000000..3665fed --- /dev/null +++ b/docs/content/docs/contributing/getting-started.mdx @@ -0,0 +1,60 @@ +--- +title: Project setup +description: Practical information on how to get started to contribute to the project. +slug: "01-getting-started" +--- + +import { Aside } from "@astrojs/starlight/components"; + + + +The [WebAPI](https://developer.mozilla.org/en-US/docs/Web/API) are vast and ever-growing. We need your help to make them better. +There is no way our [contributors](https://github.com/rescript-lang/experimental-rescript-webapi/graphs/contributors) can cover everything. +And that's where you come in! A small PR, focused on what you want to get out of this project can make a huge difference. + +## Recommended workflow + +We recommend the following overall workflow when developing for this repository: + +- Fork this repository +- Always work in your fork +- Always keep your fork up to date + +Before updating your fork, run this command: + +```shell +git remote add upstream https://github.com/rescript-lang/experimental-rescript-webapi.git +``` + +This will make management of multiple forks and your own work easier over time. + +### Updating your fork + +We recommend the following commands to update your fork: + +```shell +git checkout main +git clean -xdf +git fetch upstream +git rebase upstream/main +git push +``` + +Or more succinctly: + +```shell +git checkout main && git clean -xdf && git fetch upstream && git rebase upstream/main && git push +``` + +This will update your fork with the latest from `rescript-lang/experimental-rescript-webapi` on your machine and push those updates to your remote fork. + +## Initial build + +Install the dependencies and compile the bindings using [Rewatch](https://github.com/rescript-lang/rewatch): + +```shell +npm install && npm run build +``` diff --git a/docs/content/docs/contributing/module-structure.mdx b/docs/content/docs/contributing/module-structure.mdx new file mode 100644 index 0000000..e7bdcfa --- /dev/null +++ b/docs/content/docs/contributing/module-structure.mdx @@ -0,0 +1,87 @@ +--- +title: Module Structure +description: Learn more about the module structure of @rescript/webapi. +slug: "02-module-structure" +--- + +import { Aside } from "@astrojs/starlight/components"; +import { FileTree } from "@astrojs/starlight/components"; + +The bindings are organized by the Web API they represent. Each API has its interfaces and auxiliary types in a module named after the API, suffixed with `API` to prevent collisions with the type module. + + + +- package.json +- src + - DOMAPI.res + - DOMAPI + - HTMLElement.res + + + +Within the API module, the structure is roughly as follows: + +- Enum Types +- Interfaces +- Auxiliary Types + +## Enum types + +Enum types are used to represent constants in the Web API. They are typically used as arguments to methods or properties. +In ReScript terms these are variants: + +```ReScript +type scrollBehavior = + | @as("auto") Auto + | @as("instant") Instant + | @as("smooth") Smooth +``` + +Enums come first as they are always self-contained and do not depend on other types. + +## Interfaces + +[Interfaces](https://developer.mozilla.org/en-US/docs/Web/API#interfaces) are modeled as record types and are the core of the bindings. +They represent the properties and methods of the Web API. If an interface inherits from another interface, the base interface is spread into the inheriting interface. + +```ReScript +type htmlSpanElement = { + ...htmlElement, +} +``` + + + +```ReScript +type rec node = { + nodeName: string + // ... more properties +} + +and element = { + // duplicated property from node + nodeName: string + // ... more properties +} +``` + +## Auxiliary Types + +Auxiliary types are used to represent types that are not directly related to the Web API but are used in the bindings. +These can occur both before interfaces and after interfaces, depending on the context. + +```ReScript +type eventListenerOptions = {mutable capture?: bool} + +// Model after the documentation of +// https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#options +type addEventListenerOptions = { + ...eventListenerOptions, + mutable passive?: bool, + mutable once?: bool, + mutable signal?: abortSignal, +} +``` diff --git a/docs/content/docs/contributing/testing.mdx b/docs/content/docs/contributing/testing.mdx new file mode 100644 index 0000000..97e9cb6 --- /dev/null +++ b/docs/content/docs/contributing/testing.mdx @@ -0,0 +1,52 @@ +--- +title: Testing +description: Learn more about testing the bindings for @rescript/webapi. +slug: "05-testing" +--- + +import { Aside, FileTree } from "@astrojs/starlight/components"; + +Adding some unit tests is a great way to ensure that the bindings work as expected. +It illustrates how the bindings are supposed to be used and can help to catch regressions. + +## Testing the bindings + +Create a new help in the `test` folder with the same name as the module you want to test, followed by `_test.res`. + + + +- src + - DOMAPI.res + - DOMAPI + - HTMLCanvasElement.res +- tests + - DOMAPI + - HTMLCanvasElement_test.res + + + +Add a small sample of valid code that uses the bindings you've changed. +Add it to source control and run + +```shell +git add tests +npm test +``` + +If any of the existing tests have different ouput JavaScript, you will see a diff in the output and the test will fail. + + + +## Why add tests? + +Sometimes adding a test can feel like a bit of a hassle. But we insist that you add tests for the following reasons: + +- **Documentation**: Tests are a form of documentation. They show how the bindings are supposed to be used. +- **Regression**: Tests help to catch regressions. If a change breaks something, the test will fail. +- **Awareness**: Tests make you aware of the API you are using. + In the future we might trim down the generated bindings to only include the most used APIs. + If you have a test, you can be sure that the API is not going away. diff --git a/docs/content/docs/index.mdx b/docs/content/docs/index.mdx index 640e87a..87c4d2c 100644 --- a/docs/content/docs/index.mdx +++ b/docs/content/docs/index.mdx @@ -1,6 +1,20 @@ --- title: Getting started description: Learn more about @rescript/webapi. +hero: + title: "ReScript WebAPI" + tagline: ReScript bindings for everything you need in the browser. + actions: + - text: Let's go! + link: "#installation" + icon: right-arrow + - text: View on GitHub + link: https://github.com/rescript-lang/experimental-rescript-webapi + icon: external + variant: minimal + attrs: + rel: me +tableOfContents: false --- import { Tabs, TabItem, Code } from "@astrojs/starlight/components"; diff --git a/docs/content/docs/philosophy.mdx b/docs/content/docs/philosophy.mdx index 8e922bf..89e34d3 100644 --- a/docs/content/docs/philosophy.mdx +++ b/docs/content/docs/philosophy.mdx @@ -1,6 +1,7 @@ --- title: Design Philosophy description: Learn more about the design philosophy of @rescript/webapi. +slug: "design-philosophy" --- The core idea of these ReScript bindings is that each interface is modeled as a record type. Where possible, inheritance is represented using record spreading, and methods are modeled as functions in a separate module. This design allows for greater familiarity with the underlying JavaScript APIs, making it more friendly for newcomers. diff --git a/docs/content/docs/project-status.mdx b/docs/content/docs/project-status.mdx index 5969ac2..baaaaf6 100644 --- a/docs/content/docs/project-status.mdx +++ b/docs/content/docs/project-status.mdx @@ -1,6 +1,7 @@ --- title: Project Status description: Learn more about the current status of @rescript/webapi. +slug: "project-status" --- This project is highly experimental and subject to change. @@ -10,17 +11,13 @@ We aim to focus on the most used APIs first and then expand from there. ## Contributions -Contributions are welcome! Please [open an issue](https://github.com/rescript-lang/experimental-rescript-webapi/issues/new/choose) if you have a specific API you would like to see added. +[Contributions](./contributing/getting-started) are welcome! Please [open an issue](https://github.com/rescript-lang/experimental-rescript-webapi/issues/new/choose) if you have a specific API you would like to see added. This really helps prioritize our work and ensures that the most important APIs are addressed first. ## Current Status -Currently, all bindings are generated using a modified version of [TypeScript-DOM-lib-generator](https://github.com/microsoft/TypeScript-DOM-lib-generator). -Eventually, the generation may reach a level where manual tweaking can enhance the developer experience. -In the short term, generation could still be improved. - -Coding contributions are encouraged, but please be aware that the project is still in a very experimental stage. -It might be a little daunting and rough to jump right in. +All bindings were generated using a modified version of [TypeScript-DOM-lib-generator](https://github.com/microsoft/TypeScript-DOM-lib-generator). +The next step is to manual tweak these files so they can enhance the developer experience. ## Future diff --git a/docs/styles/theme.css b/docs/styles/theme.css index 4bfb2ac..cc9f342 100644 --- a/docs/styles/theme.css +++ b/docs/styles/theme.css @@ -43,3 +43,8 @@ body { background-color: var(--scrollbar-thumb-background); } } + +.sl-markdown-content .inline-icon { + display: inline-block; + vertical-align: text-bottom; +} diff --git a/src/CanvasAPI.res b/src/CanvasAPI.res index 7f3c77a..11fd4e7 100644 --- a/src/CanvasAPI.res +++ b/src/CanvasAPI.res @@ -10,6 +10,113 @@ type offscreenRenderingContextId = | @as("webgl2") Webgl2 | @as("webgpu") Webgpu +type globalCompositeOperation = + | @as("color") Color + | @as("color-burn") ColorBurn + | @as("color-dodge") ColorDodge + | @as("copy") Copy + | @as("darken") Darken + | @as("destination-atop") DestinationAtop + | @as("destination-in") DestinationIn + | @as("destination-out") DestinationOut + | @as("destination-over") DestinationOver + | @as("difference") Difference + | @as("exclusion") Exclusion + | @as("hard-light") HardLight + | @as("hue") Hue + | @as("lighten") Lighten + | @as("lighter") Lighter + | @as("luminosity") Luminosity + | @as("multiply") Multiply + | @as("overlay") Overlay + | @as("saturation") Saturation + | @as("screen") Screen + | @as("soft-light") SoftLight + | @as("source-atop") SourceAtop + | @as("source-in") SourceIn + | @as("source-out") SourceOut + | @as("source-over") SourceOver + | @as("xor") Xor + +type imageSmoothingQuality = + | @as("high") High + | @as("low") Low + | @as("medium") Medium + +type canvasLineCap = + | @as("butt") Butt + | @as("round") Round + | @as("square") Square + +type canvasLineJoin = + | @as("bevel") Bevel + | @as("miter") Miter + | @as("round") Round + +type canvasTextAlign = + | @as("center") Center + | @as("end") End + | @as("left") Left + | @as("right") Right + | @as("start") Start + +type canvasTextBaseline = + | @as("alphabetic") Alphabetic + | @as("bottom") Bottom + | @as("hanging") Hanging + | @as("ideographic") Ideographic + | @as("middle") Middle + | @as("top") Top + +type canvasDirection = + | @as("inherit") Inherit + | @as("ltr") Ltr + | @as("rtl") Rtl + +type canvasFontKerning = + | @as("auto") Auto + | @as("none") None + | @as("normal") Normal + +type canvasFontStretch = + | @as("condensed") Condensed + | @as("expanded") Expanded + | @as("extra-condensed") ExtraCondensed + | @as("extra-expanded") ExtraExpanded + | @as("normal") Normal + | @as("semi-condensed") SemiCondensed + | @as("semi-expanded") SemiExpanded + | @as("ultra-condensed") UltraCondensed + | @as("ultra-expanded") UltraExpanded + +type canvasFontVariantCaps = + | @as("all-petite-caps") AllPetiteCaps + | @as("all-small-caps") AllSmallCaps + | @as("normal") Normal + | @as("petite-caps") PetiteCaps + | @as("small-caps") SmallCaps + | @as("titling-caps") TitlingCaps + | @as("unicase") Unicase + +type canvasTextRendering = + | @as("auto") Auto + | @as("geometricPrecision") GeometricPrecision + | @as("optimizeLegibility") OptimizeLegibility + | @as("optimizeSpeed") OptimizeSpeed + +type predefinedColorSpace = + | @as("display-p3") DisplayP3 + | @as("srgb") Srgb + +type canvasFillRule = + | @as("evenodd") Evenodd + | @as("nonzero") Nonzero + +type webGLPowerPreference = + | @as("default") Default + | @as("high-performance") HighPerformance + | @as("low-power") LowPower + /** [See OffscreenCanvas on MDN](https://developer.mozilla.org/docs/Web/API/OffscreenCanvas) */ @@ -47,9 +154,293 @@ type imageBitmap = { height: int, } +/** +[See OffscreenCanvasRenderingContext2D on MDN](https://developer.mozilla.org/docs/Web/API/OffscreenCanvasRenderingContext2D) +*/ +type offscreenCanvasRenderingContext2D = { + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/canvas) + */ + canvas: offscreenCanvas, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/globalAlpha) + */ + mutable globalAlpha: float, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/globalCompositeOperation) + */ + mutable globalCompositeOperation: globalCompositeOperation, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/imageSmoothingEnabled) + */ + mutable imageSmoothingEnabled: bool, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/imageSmoothingQuality) + */ + mutable imageSmoothingQuality: imageSmoothingQuality, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/strokeStyle) + */ + mutable strokeStyle: unknown, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/fillStyle) + */ + mutable fillStyle: unknown, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/shadowOffsetX) + */ + mutable shadowOffsetX: float, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/shadowOffsetY) + */ + mutable shadowOffsetY: float, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/shadowBlur) + */ + mutable shadowBlur: float, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/shadowColor) + */ + mutable shadowColor: string, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/filter) + */ + mutable filter: string, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/lineWidth) + */ + mutable lineWidth: float, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/lineCap) + */ + mutable lineCap: canvasLineCap, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/lineJoin) + */ + mutable lineJoin: canvasLineJoin, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/miterLimit) + */ + mutable miterLimit: float, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/lineDashOffset) + */ + mutable lineDashOffset: float, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/font) + */ + mutable font: string, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/textAlign) + */ + mutable textAlign: canvasTextAlign, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/textBaseline) + */ + mutable textBaseline: canvasTextBaseline, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/direction) + */ + mutable direction: canvasDirection, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/letterSpacing) + */ + mutable letterSpacing: string, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/fontKerning) + */ + mutable fontKerning: canvasFontKerning, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/fontStretch) + */ + mutable fontStretch: canvasFontStretch, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/fontVariantCaps) + */ + mutable fontVariantCaps: canvasFontVariantCaps, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/textRendering) + */ + mutable textRendering: canvasTextRendering, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/wordSpacing) + */ + mutable wordSpacing: string, +} + +/** +[See ImageBitmapRenderingContext on MDN](https://developer.mozilla.org/docs/Web/API/ImageBitmapRenderingContext) +*/ +type imageBitmapRenderingContext = { + /** + Returns the canvas element that the context is bound to. + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/ImageBitmapRenderingContext/canvas) + */ + canvas: unknown, +} + +/** +Provides an interface to the OpenGL ES 2.0 graphics rendering context for the drawing surface of an HTML element. +[See WebGLRenderingContext on MDN](https://developer.mozilla.org/docs/Web/API/WebGLRenderingContext) +*/ +type webGLRenderingContext = { + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/WebGLRenderingContext/canvas) + */ + canvas: unknown, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/WebGLRenderingContext/drawingBufferWidth) + */ + drawingBufferWidth: float, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/WebGLRenderingContext/drawingBufferHeight) + */ + drawingBufferHeight: float, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/WebGLRenderingContext/drawingBufferColorSpace) + */ + mutable drawingBufferColorSpace: predefinedColorSpace, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/WebGL2RenderingContext/unpackColorSpace) + */ + mutable unpackColorSpace: predefinedColorSpace, +} + +/** +[See WebGL2RenderingContext on MDN](https://developer.mozilla.org/docs/Web/API/WebGL2RenderingContext) +*/ +type webGL2RenderingContext = { + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/WebGLRenderingContext/canvas) + */ + canvas: unknown, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/WebGLRenderingContext/drawingBufferWidth) + */ + drawingBufferWidth: float, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/WebGLRenderingContext/drawingBufferHeight) + */ + drawingBufferHeight: float, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/WebGLRenderingContext/drawingBufferColorSpace) + */ + mutable drawingBufferColorSpace: predefinedColorSpace, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/WebGL2RenderingContext/unpackColorSpace) + */ + mutable unpackColorSpace: predefinedColorSpace, +} + +/** +An opaque object describing a gradient. It is returned by the methods CanvasRenderingContext2D.createLinearGradient() or CanvasRenderingContext2D.createRadialGradient(). +[See CanvasGradient on MDN](https://developer.mozilla.org/docs/Web/API/CanvasGradient) +*/ +type canvasGradient = {} + +/** +An opaque object describing a pattern, based on an image, a canvas, or a video, created by the CanvasRenderingContext2D.createPattern() method. +[See CanvasPattern on MDN](https://developer.mozilla.org/docs/Web/API/CanvasPattern) +*/ +type canvasPattern = {} + +/** +This Canvas 2D API interface is used to declare a path that can then be used on a CanvasRenderingContext2D object. The path methods of the CanvasRenderingContext2D interface are also present on this interface, which gives you the convenience of being able to retain and replay your path whenever desired. +[See Path2D on MDN](https://developer.mozilla.org/docs/Web/API/Path2D) +*/ +type path2D = {} + +/** +The dimensions of a piece of text in the canvas, as created by the CanvasRenderingContext2D.measureText() method. +[See TextMetrics on MDN](https://developer.mozilla.org/docs/Web/API/TextMetrics) +*/ +type textMetrics = { + /** + Returns the measurement described below. + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/TextMetrics/width) + */ + width: float, + /** + Returns the measurement described below. + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/TextMetrics/actualBoundingBoxLeft) + */ + actualBoundingBoxLeft: float, + /** + Returns the measurement described below. + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/TextMetrics/actualBoundingBoxRight) + */ + actualBoundingBoxRight: float, + /** + Returns the measurement described below. + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/TextMetrics/fontBoundingBoxAscent) + */ + fontBoundingBoxAscent: float, + /** + Returns the measurement described below. + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/TextMetrics/fontBoundingBoxDescent) + */ + fontBoundingBoxDescent: float, + /** + Returns the measurement described below. + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/TextMetrics/actualBoundingBoxAscent) + */ + actualBoundingBoxAscent: float, + /** + Returns the measurement described below. + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/TextMetrics/actualBoundingBoxDescent) + */ + actualBoundingBoxDescent: float, + /** + Returns the measurement described below. + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/TextMetrics/emHeightAscent) + */ + emHeightAscent: float, + /** + Returns the measurement described below. + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/TextMetrics/emHeightDescent) + */ + emHeightDescent: float, + /** + Returns the measurement described below. + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/TextMetrics/hangingBaseline) + */ + hangingBaseline: float, + /** + Returns the measurement described below. + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/TextMetrics/alphabeticBaseline) + */ + alphabeticBaseline: float, + /** + Returns the measurement described below. + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/TextMetrics/ideographicBaseline) + */ + ideographicBaseline: float, +} + type offscreenRenderingContext = any type imageEncodeOptions = { @as("type") mutable type_?: string, mutable quality?: float, } + +type canvasRenderingContext2DSettings = { + mutable alpha?: bool, + mutable desynchronized?: bool, + mutable colorSpace?: predefinedColorSpace, + mutable willReadFrequently?: bool, +} + +type webGLContextAttributes = { + mutable alpha?: bool, + mutable depth?: bool, + mutable stencil?: bool, + mutable antialias?: bool, + mutable premultipliedAlpha?: bool, + mutable preserveDrawingBuffer?: bool, + mutable powerPreference?: webGLPowerPreference, + mutable failIfMajorPerformanceCaveat?: bool, + mutable desynchronized?: bool, +} + +type imageBitmapRenderingContextSettings = {mutable alpha?: bool} diff --git a/src/CanvasAPI/CanvasGradient.js b/src/CanvasAPI/CanvasGradient.js new file mode 100644 index 0000000..de9f910 --- /dev/null +++ b/src/CanvasAPI/CanvasGradient.js @@ -0,0 +1,11 @@ +// Generated by ReScript, PLEASE EDIT WITH CARE + + +function isInstanceOf(param) { + return (param instanceof CanvasGradient); +} + +export { + isInstanceOf, +} +/* No side effect */ diff --git a/src/CanvasAPI/CanvasGradient.res b/src/CanvasAPI/CanvasGradient.res new file mode 100644 index 0000000..86347e0 --- /dev/null +++ b/src/CanvasAPI/CanvasGradient.res @@ -0,0 +1,12 @@ +open CanvasAPI + +/** +Adds a color stop with the given color to the gradient at the given offset. 0.0 is the offset at one end of the gradient, 1.0 is the offset at the other end. + +Throws an "IndexSizeError" DOMException if the offset is out of range. Throws a "SyntaxError" DOMException if the color cannot be parsed. +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasGradient/addColorStop) +*/ +@send +external addColorStop: (canvasGradient, ~offset: float, ~color: string) => unit = "addColorStop" + +let isInstanceOf = (_: 't): bool => %raw(`param instanceof CanvasGradient`) diff --git a/src/CanvasAPI/CanvasPattern.js b/src/CanvasAPI/CanvasPattern.js new file mode 100644 index 0000000..d16a42c --- /dev/null +++ b/src/CanvasAPI/CanvasPattern.js @@ -0,0 +1,11 @@ +// Generated by ReScript, PLEASE EDIT WITH CARE + + +function isInstanceOf(param) { + return (param instanceof CanvasPattern); +} + +export { + isInstanceOf, +} +/* No side effect */ diff --git a/src/CanvasAPI/CanvasPattern.res b/src/CanvasAPI/CanvasPattern.res new file mode 100644 index 0000000..9e3f243 --- /dev/null +++ b/src/CanvasAPI/CanvasPattern.res @@ -0,0 +1,11 @@ +open DOMAPI +open CanvasAPI + +/** +Sets the transformation matrix that will be used when rendering the pattern during a fill or stroke painting operation. +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasPattern/setTransform) +*/ +@send +external setTransform: (canvasPattern, ~transform: domMatrix2DInit=?) => unit = "setTransform" + +let isInstanceOf = (_: 't): bool => %raw(`param instanceof CanvasPattern`) diff --git a/src/CanvasAPI/ImageBitmapRenderingContext.js b/src/CanvasAPI/ImageBitmapRenderingContext.js new file mode 100644 index 0000000..d856702 --- /dev/null +++ b/src/CanvasAPI/ImageBitmapRenderingContext.js @@ -0,0 +1,2 @@ +// Generated by ReScript, PLEASE EDIT WITH CARE +/* This output is empty. Its source's type definitions, externals and/or unused code got optimized away. */ diff --git a/src/CanvasAPI/ImageBitmapRenderingContext.res b/src/CanvasAPI/ImageBitmapRenderingContext.res new file mode 100644 index 0000000..9e422d2 --- /dev/null +++ b/src/CanvasAPI/ImageBitmapRenderingContext.res @@ -0,0 +1,9 @@ +open CanvasAPI + +/** +Transfers the underlying bitmap data from imageBitmap to context, and the bitmap becomes the contents of the canvas element to which context is bound. +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/ImageBitmapRenderingContext/transferFromImageBitmap) +*/ +@send +external transferFromImageBitmap: (imageBitmapRenderingContext, imageBitmap) => unit = + "transferFromImageBitmap" diff --git a/src/CanvasAPI/OffscreenCanvas.res b/src/CanvasAPI/OffscreenCanvas.res index 99f3a30..0683f2c 100644 --- a/src/CanvasAPI/OffscreenCanvas.res +++ b/src/CanvasAPI/OffscreenCanvas.res @@ -1,6 +1,5 @@ open EventAPI open CanvasAPI -open DOMAPI open Prelude open FileAPI @@ -99,11 +98,56 @@ Returns null if the canvas has already been initialized with another context typ [Read more on MDN](https://developer.mozilla.org/docs/Web/API/OffscreenCanvas/getContext) */ @send -external getContext: ( +external getContext_2D: ( offscreenCanvas, - ~contextId: offscreenRenderingContextId, + @as("2d") _, ~options: JSON.t=?, -) => offscreenRenderingContext = "getContext" +) => offscreenCanvasRenderingContext2D = "getContext" + +/** +Returns an object that exposes an API for drawing on the OffscreenCanvas object. contextId specifies the desired API: "2d", "bitmaprenderer", "webgl", or "webgl2". options is handled by that API. + +This specification defines the "2d" context below, which is similar but distinct from the "2d" context that is created from a canvas element. The WebGL specifications define the "webgl" and "webgl2" contexts. [WEBGL] + +Returns null if the canvas has already been initialized with another context type (e.g., trying to get a "2d" context after getting a "webgl" context). +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/OffscreenCanvas/getContext) +*/ +@send +external getContext_WebGL: ( + offscreenCanvas, + @as("webgl") _, + ~options: webGLContextAttributes=?, +) => webGLRenderingContext = "getContext" + +/** +Returns an object that exposes an API for drawing on the OffscreenCanvas object. contextId specifies the desired API: "2d", "bitmaprenderer", "webgl", or "webgl2". options is handled by that API. + +This specification defines the "2d" context below, which is similar but distinct from the "2d" context that is created from a canvas element. The WebGL specifications define the "webgl" and "webgl2" contexts. [WEBGL] + +Returns null if the canvas has already been initialized with another context type (e.g., trying to get a "2d" context after getting a "webgl" context). +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/OffscreenCanvas/getContext) +*/ +@send +external getContext_WebGL2: ( + offscreenCanvas, + @as("webgl2") _, + ~options: webGLContextAttributes=?, +) => webGL2RenderingContext = "getContext" + +/** +Returns an object that exposes an API for drawing on the OffscreenCanvas object. contextId specifies the desired API: "2d", "bitmaprenderer", "webgl", or "webgl2". options is handled by that API. + +This specification defines the "2d" context below, which is similar but distinct from the "2d" context that is created from a canvas element. The WebGL specifications define the "webgl" and "webgl2" contexts. [WEBGL] + +Returns null if the canvas has already been initialized with another context type (e.g., trying to get a "2d" context after getting a "webgl" context). +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/OffscreenCanvas/getContext) +*/ +@send +external getContext_BitmapRenderer: ( + offscreenCanvas, + @as("bitmaprenderer") _, + ~options: imageBitmapRenderingContextSettings=?, +) => imageBitmapRenderingContext = "getContext" /** Returns a newly created ImageBitmap object with the image in the OffscreenCanvas object. The image in the OffscreenCanvas object is replaced with a new blank image. diff --git a/src/CanvasAPI/Path2D.js b/src/CanvasAPI/Path2D.js new file mode 100644 index 0000000..d856702 --- /dev/null +++ b/src/CanvasAPI/Path2D.js @@ -0,0 +1,2 @@ +// Generated by ReScript, PLEASE EDIT WITH CARE +/* This output is empty. Its source's type definitions, externals and/or unused code got optimized away. */ diff --git a/src/CanvasAPI/Path2D.res b/src/CanvasAPI/Path2D.res new file mode 100644 index 0000000..24d4f89 --- /dev/null +++ b/src/CanvasAPI/Path2D.res @@ -0,0 +1,142 @@ +open CanvasAPI +open DOMAPI + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/Path2D) +*/ +@new +external make: (~path: path2D=?) => path2D = "Path2D" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/Path2D) +*/ +@new +external make2: (~path: string=?) => path2D = "Path2D" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/closePath) +*/ +@send +external closePath: path2D => unit = "closePath" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/moveTo) +*/ +@send +external moveTo: (path2D, ~x: float, ~y: float) => unit = "moveTo" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/lineTo) +*/ +@send +external lineTo: (path2D, ~x: float, ~y: float) => unit = "lineTo" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/quadraticCurveTo) +*/ +@send +external quadraticCurveTo: (path2D, ~cpx: float, ~cpy: float, ~x: float, ~y: float) => unit = + "quadraticCurveTo" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/bezierCurveTo) +*/ +@send +external bezierCurveTo: ( + path2D, + ~cp1x: float, + ~cp1y: float, + ~cp2x: float, + ~cp2y: float, + ~x: float, + ~y: float, +) => unit = "bezierCurveTo" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/arcTo) +*/ +@send +external arcTo: (path2D, ~x1: float, ~y1: float, ~x2: float, ~y2: float, ~radius: float) => unit = + "arcTo" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/rect) +*/ +@send +external rect: (path2D, ~x: float, ~y: float, ~w: float, ~h: float) => unit = "rect" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/roundRect) +*/ +@send +external roundRect: ( + path2D, + ~x: float, + ~y: float, + ~w: float, + ~h: float, + ~radii_: array=?, +) => unit = "roundRect" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/roundRect) +*/ +@send +external roundRect2: ( + path2D, + ~x: float, + ~y: float, + ~w: float, + ~h: float, + ~radii_: array=?, +) => unit = "roundRect" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/roundRect) +*/ +@send +external roundRect3: ( + path2D, + ~x: float, + ~y: float, + ~w: float, + ~h: float, + ~radii_: array=?, +) => unit = "roundRect" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/arc) +*/ +@send +external arc: ( + path2D, + ~x: float, + ~y: float, + ~radius: float, + ~startAngle: float, + ~endAngle: float, + ~counterclockwise: bool=?, +) => unit = "arc" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/ellipse) +*/ +@send +external ellipse: ( + path2D, + ~x: float, + ~y: float, + ~radiusX: float, + ~radiusY: float, + ~rotation: float, + ~startAngle: float, + ~endAngle: float, + ~counterclockwise: bool=?, +) => unit = "ellipse" + +/** +Adds to the path the path given by the argument. +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/Path2D/addPath) +*/ +@send +external addPath: (path2D, ~path: path2D, ~transform: domMatrix2DInit=?) => unit = "addPath" diff --git a/src/DOMAPI.res b/src/DOMAPI.res index 0780d4b..df04130 100644 --- a/src/DOMAPI.res +++ b/src/DOMAPI.res @@ -201,6 +201,8 @@ type shareData = { mutable url?: string, } +type fillStyle + /** The location (URL) of the object it is linked to. Changes done on it are reflected on the object it relates to. Both the Document and Window interface have such a linked Location, accessible via Document.location and Window.location respectively. [See Location on MDN](https://developer.mozilla.org/docs/Web/API/Location) @@ -9354,6 +9356,131 @@ type domPoint = { ...domPointReadOnly, } +/** + [Read more on MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/getContext#contextattributes) + */ +type canvasContext2DAttributes = { + alpha: bool, + colorspace?: predefinedColorSpace, + desynchronized: bool, + willReadFrequently: bool, +} + +/** +The CanvasRenderingContext2D interface, part of the Canvas API, provides the 2D rendering context for the drawing surface of a element. It is used for drawing shapes, text, images, and other objects. +[See CanvasRenderingContext2D on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D) +*/ +type canvasRenderingContext2D = { + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/canvas) + */ + canvas: htmlCanvasElement, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/globalAlpha) + */ + mutable globalAlpha: float, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/globalCompositeOperation) + */ + mutable globalCompositeOperation: globalCompositeOperation, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/imageSmoothingEnabled) + */ + mutable imageSmoothingEnabled: bool, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/imageSmoothingQuality) + */ + mutable imageSmoothingQuality: imageSmoothingQuality, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/strokeStyle) + */ + mutable strokeStyle: unknown, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/fillStyle) + */ + mutable fillStyle: fillStyle, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/shadowOffsetX) + */ + mutable shadowOffsetX: float, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/shadowOffsetY) + */ + mutable shadowOffsetY: float, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/shadowBlur) + */ + mutable shadowBlur: float, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/shadowColor) + */ + mutable shadowColor: string, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/filter) + */ + mutable filter: string, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/lineWidth) + */ + mutable lineWidth: float, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/lineCap) + */ + mutable lineCap: canvasLineCap, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/lineJoin) + */ + mutable lineJoin: canvasLineJoin, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/miterLimit) + */ + mutable miterLimit: float, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/lineDashOffset) + */ + mutable lineDashOffset: float, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/font) + */ + mutable font: string, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/textAlign) + */ + mutable textAlign: canvasTextAlign, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/textBaseline) + */ + mutable textBaseline: canvasTextBaseline, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/direction) + */ + mutable direction: canvasDirection, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/letterSpacing) + */ + mutable letterSpacing: string, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/fontKerning) + */ + mutable fontKerning: canvasFontKerning, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/fontStretch) + */ + mutable fontStretch: canvasFontStretch, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/fontVariantCaps) + */ + mutable fontVariantCaps: canvasFontVariantCaps, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/textRendering) + */ + mutable textRendering: canvasTextRendering, + /** + [Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/wordSpacing) + */ + mutable wordSpacing: string, +} + /** [See Animation on MDN](https://developer.mozilla.org/docs/Web/API/Animation) */ diff --git a/src/DOMAPI/CanvasRenderingContext2D.js b/src/DOMAPI/CanvasRenderingContext2D.js new file mode 100644 index 0000000..d856702 --- /dev/null +++ b/src/DOMAPI/CanvasRenderingContext2D.js @@ -0,0 +1,2 @@ +// Generated by ReScript, PLEASE EDIT WITH CARE +/* This output is empty. Its source's type definitions, externals and/or unused code got optimized away. */ diff --git a/src/DOMAPI/CanvasRenderingContext2D.res b/src/DOMAPI/CanvasRenderingContext2D.res new file mode 100644 index 0000000..94bfbf0 --- /dev/null +++ b/src/DOMAPI/CanvasRenderingContext2D.res @@ -0,0 +1,843 @@ +open DOMAPI +open CanvasAPI + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/save) +*/ +@send +external save: canvasRenderingContext2D => unit = "save" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/restore) +*/ +@send +external restore: canvasRenderingContext2D => unit = "restore" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/reset) +*/ +@send +external reset: canvasRenderingContext2D => unit = "reset" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/isContextLost) +*/ +@send +external isContextLost: canvasRenderingContext2D => bool = "isContextLost" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/scale) +*/ +@send +external scale: (canvasRenderingContext2D, ~x: float, ~y: float) => unit = "scale" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/rotate) +*/ +@send +external rotate: (canvasRenderingContext2D, float) => unit = "rotate" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/translate) +*/ +@send +external translate: (canvasRenderingContext2D, ~x: float, ~y: float) => unit = "translate" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/transform) +*/ +@send +external transform: ( + canvasRenderingContext2D, + ~a: float, + ~b: float, + ~c: float, + ~d: float, + ~e: float, + ~f: float, +) => unit = "transform" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/getTransform) +*/ +@send +external getTransform: canvasRenderingContext2D => domMatrix = "getTransform" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/setTransform) +*/ +@send +external setTransform: ( + canvasRenderingContext2D, + ~a: float, + ~b: float, + ~c: float, + ~d: float, + ~e: float, + ~f: float, +) => unit = "setTransform" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/setTransform) +*/ +@send +external setTransform2: (canvasRenderingContext2D, ~transform: domMatrix2DInit=?) => unit = + "setTransform" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/resetTransform) +*/ +@send +external resetTransform: canvasRenderingContext2D => unit = "resetTransform" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/createLinearGradient) +*/ +@send +external createLinearGradient: ( + canvasRenderingContext2D, + ~x0: float, + ~y0: float, + ~x1: float, + ~y1: float, +) => canvasGradient = "createLinearGradient" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/createRadialGradient) +*/ +@send +external createRadialGradient: ( + canvasRenderingContext2D, + ~x0: float, + ~y0: float, + ~r0: float, + ~x1: float, + ~y1: float, + ~r1: float, +) => canvasGradient = "createRadialGradient" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/createConicGradient) +*/ +@send +external createConicGradient: ( + canvasRenderingContext2D, + ~startAngle: float, + ~x: float, + ~y: float, +) => canvasGradient = "createConicGradient" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/createPattern) +*/ +@send +external createPattern: ( + canvasRenderingContext2D, + ~image: htmlImageElement, + ~repetition: string, +) => canvasPattern = "createPattern" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/createPattern) +*/ +@send +external createPattern2: ( + canvasRenderingContext2D, + ~image: svgImageElement, + ~repetition: string, +) => canvasPattern = "createPattern" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/createPattern) +*/ +@send +external createPattern3: ( + canvasRenderingContext2D, + ~image: htmlVideoElement, + ~repetition: string, +) => canvasPattern = "createPattern" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/createPattern) +*/ +@send +external createPattern4: ( + canvasRenderingContext2D, + ~image: htmlCanvasElement, + ~repetition: string, +) => canvasPattern = "createPattern" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/createPattern) +*/ +@send +external createPattern5: ( + canvasRenderingContext2D, + ~image: imageBitmap, + ~repetition: string, +) => canvasPattern = "createPattern" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/createPattern) +*/ +@send +external createPattern6: ( + canvasRenderingContext2D, + ~image: offscreenCanvas, + ~repetition: string, +) => canvasPattern = "createPattern" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/createPattern) +*/ +@send +external createPattern7: ( + canvasRenderingContext2D, + ~image: videoFrame, + ~repetition: string, +) => canvasPattern = "createPattern" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/clearRect) +*/ +@send +external clearRect: (canvasRenderingContext2D, ~x: float, ~y: float, ~w: float, ~h: float) => unit = + "clearRect" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/fillRect) +*/ +@send +external fillRect: (canvasRenderingContext2D, ~x: float, ~y: float, ~w: float, ~h: float) => unit = + "fillRect" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/strokeRect) +*/ +@send +external strokeRect: ( + canvasRenderingContext2D, + ~x: float, + ~y: float, + ~w: float, + ~h: float, +) => unit = "strokeRect" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/beginPath) +*/ +@send +external beginPath: canvasRenderingContext2D => unit = "beginPath" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/fill) +*/ +@send +external fill: (canvasRenderingContext2D, ~fillRule: canvasFillRule=?) => unit = "fill" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/fill) +*/ +@send +external fill2: (canvasRenderingContext2D, ~path: path2D, ~fillRule: canvasFillRule=?) => unit = + "fill" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/stroke) +*/ +@send +external stroke: canvasRenderingContext2D => unit = "stroke" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/stroke) +*/ +@send +external stroke2: (canvasRenderingContext2D, path2D) => unit = "stroke" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/clip) +*/ +@send +external clip: (canvasRenderingContext2D, ~fillRule: canvasFillRule=?) => unit = "clip" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/clip) +*/ +@send +external clip2: (canvasRenderingContext2D, ~path: path2D, ~fillRule: canvasFillRule=?) => unit = + "clip" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/isPointInPath) +*/ +@send +external isPointInPath: ( + canvasRenderingContext2D, + ~x: float, + ~y: float, + ~fillRule: canvasFillRule=?, +) => bool = "isPointInPath" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/isPointInPath) +*/ +@send +external isPointInPath2: ( + canvasRenderingContext2D, + ~path: path2D, + ~x: float, + ~y: float, + ~fillRule: canvasFillRule=?, +) => bool = "isPointInPath" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/isPointInStroke) +*/ +@send +external isPointInStroke: (canvasRenderingContext2D, ~x: float, ~y: float) => bool = + "isPointInStroke" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/isPointInStroke) +*/ +@send +external isPointInStroke2: (canvasRenderingContext2D, ~path: path2D, ~x: float, ~y: float) => bool = + "isPointInStroke" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/drawFocusIfNeeded) +*/ +@send +external drawFocusIfNeeded: (canvasRenderingContext2D, element) => unit = "drawFocusIfNeeded" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/drawFocusIfNeeded) +*/ +@send +external drawFocusIfNeeded2: (canvasRenderingContext2D, ~path: path2D, ~element: element) => unit = + "drawFocusIfNeeded" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/fillText) +*/ +@send +external fillText: ( + canvasRenderingContext2D, + ~text: string, + ~x: float, + ~y: float, + ~maxWidth: float=?, +) => unit = "fillText" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/strokeText) +*/ +@send +external strokeText: ( + canvasRenderingContext2D, + ~text: string, + ~x: float, + ~y: float, + ~maxWidth: float=?, +) => unit = "strokeText" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/measureText) +*/ +@send +external measureText: (canvasRenderingContext2D, string) => textMetrics = "measureText" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/drawImage) +*/ +@send +external drawImage: ( + canvasRenderingContext2D, + ~image: htmlImageElement, + ~dx: float, + ~dy: float, +) => unit = "drawImage" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/drawImage) +*/ +@send +external drawImage2: ( + canvasRenderingContext2D, + ~image: svgImageElement, + ~dx: float, + ~dy: float, +) => unit = "drawImage" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/drawImage) +*/ +@send +external drawImage3: ( + canvasRenderingContext2D, + ~image: htmlVideoElement, + ~dx: float, + ~dy: float, +) => unit = "drawImage" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/drawImage) +*/ +@send +external drawImage4: ( + canvasRenderingContext2D, + ~image: htmlCanvasElement, + ~dx: float, + ~dy: float, +) => unit = "drawImage" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/drawImage) +*/ +@send +external drawImage5: ( + canvasRenderingContext2D, + ~image: imageBitmap, + ~dx: float, + ~dy: float, +) => unit = "drawImage" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/drawImage) +*/ +@send +external drawImage6: ( + canvasRenderingContext2D, + ~image: offscreenCanvas, + ~dx: float, + ~dy: float, +) => unit = "drawImage" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/drawImage) +*/ +@send +external drawImage7: ( + canvasRenderingContext2D, + ~image: videoFrame, + ~dx: float, + ~dy: float, +) => unit = "drawImage" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/drawImage) +*/ +@send +external drawImage8: ( + canvasRenderingContext2D, + ~image: htmlImageElement, + ~dx: float, + ~dy: float, + ~dw: float, + ~dh: float, +) => unit = "drawImage" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/drawImage) +*/ +@send +external drawImage9: ( + canvasRenderingContext2D, + ~image: svgImageElement, + ~dx: float, + ~dy: float, + ~dw: float, + ~dh: float, +) => unit = "drawImage" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/drawImage) +*/ +@send +external drawImage10: ( + canvasRenderingContext2D, + ~image: htmlVideoElement, + ~dx: float, + ~dy: float, + ~dw: float, + ~dh: float, +) => unit = "drawImage" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/drawImage) +*/ +@send +external drawImage11: ( + canvasRenderingContext2D, + ~image: htmlCanvasElement, + ~dx: float, + ~dy: float, + ~dw: float, + ~dh: float, +) => unit = "drawImage" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/drawImage) +*/ +@send +external drawImage12: ( + canvasRenderingContext2D, + ~image: imageBitmap, + ~dx: float, + ~dy: float, + ~dw: float, + ~dh: float, +) => unit = "drawImage" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/drawImage) +*/ +@send +external drawImage13: ( + canvasRenderingContext2D, + ~image: offscreenCanvas, + ~dx: float, + ~dy: float, + ~dw: float, + ~dh: float, +) => unit = "drawImage" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/drawImage) +*/ +@send +external drawImage14: ( + canvasRenderingContext2D, + ~image: videoFrame, + ~dx: float, + ~dy: float, + ~dw: float, + ~dh: float, +) => unit = "drawImage" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/drawImage) +*/ +@send +external drawImage15: ( + canvasRenderingContext2D, + ~image: htmlImageElement, + ~sx: float, + ~sy: float, + ~sw: float, + ~sh: float, + ~dx: float, + ~dy: float, + ~dw: float, + ~dh: float, +) => unit = "drawImage" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/drawImage) +*/ +@send +external drawImage16: ( + canvasRenderingContext2D, + ~image: svgImageElement, + ~sx: float, + ~sy: float, + ~sw: float, + ~sh: float, + ~dx: float, + ~dy: float, + ~dw: float, + ~dh: float, +) => unit = "drawImage" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/drawImage) +*/ +@send +external drawImage17: ( + canvasRenderingContext2D, + ~image: htmlVideoElement, + ~sx: float, + ~sy: float, + ~sw: float, + ~sh: float, + ~dx: float, + ~dy: float, + ~dw: float, + ~dh: float, +) => unit = "drawImage" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/drawImage) +*/ +@send +external drawImage18: ( + canvasRenderingContext2D, + ~image: htmlCanvasElement, + ~sx: float, + ~sy: float, + ~sw: float, + ~sh: float, + ~dx: float, + ~dy: float, + ~dw: float, + ~dh: float, +) => unit = "drawImage" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/drawImage) +*/ +@send +external drawImage19: ( + canvasRenderingContext2D, + ~image: imageBitmap, + ~sx: float, + ~sy: float, + ~sw: float, + ~sh: float, + ~dx: float, + ~dy: float, + ~dw: float, + ~dh: float, +) => unit = "drawImage" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/drawImage) +*/ +@send +external drawImage20: ( + canvasRenderingContext2D, + ~image: offscreenCanvas, + ~sx: float, + ~sy: float, + ~sw: float, + ~sh: float, + ~dx: float, + ~dy: float, + ~dw: float, + ~dh: float, +) => unit = "drawImage" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/drawImage) +*/ +@send +external drawImage21: ( + canvasRenderingContext2D, + ~image: videoFrame, + ~sx: float, + ~sy: float, + ~sw: float, + ~sh: float, + ~dx: float, + ~dy: float, + ~dw: float, + ~dh: float, +) => unit = "drawImage" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/createImageData) +*/ +@send +external createImageData: ( + canvasRenderingContext2D, + ~sw: int, + ~sh: int, + ~settings: imageDataSettings=?, +) => imageData = "createImageData" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/createImageData) +*/ +@send +external createImageData2: (canvasRenderingContext2D, imageData) => imageData = "createImageData" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/getImageData) +*/ +@send +external getImageData: ( + canvasRenderingContext2D, + ~sx: int, + ~sy: int, + ~sw: int, + ~sh: int, + ~settings: imageDataSettings=?, +) => imageData = "getImageData" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/putImageData) +*/ +@send +external putImageData: ( + canvasRenderingContext2D, + ~imagedata: imageData, + ~dx: int, + ~dy: int, +) => unit = "putImageData" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/putImageData) +*/ +@send +external putImageData2: ( + canvasRenderingContext2D, + ~imagedata: imageData, + ~dx: int, + ~dy: int, + ~dirtyX: int, + ~dirtyY: int, + ~dirtyWidth: int, + ~dirtyHeight: int, +) => unit = "putImageData" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/setLineDash) +*/ +@send +external setLineDash: (canvasRenderingContext2D, array) => unit = "setLineDash" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/getLineDash) +*/ +@send +external getLineDash: canvasRenderingContext2D => array = "getLineDash" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/closePath) +*/ +@send +external closePath: canvasRenderingContext2D => unit = "closePath" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/moveTo) +*/ +@send +external moveTo: (canvasRenderingContext2D, ~x: float, ~y: float) => unit = "moveTo" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/lineTo) +*/ +@send +external lineTo: (canvasRenderingContext2D, ~x: float, ~y: float) => unit = "lineTo" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/quadraticCurveTo) +*/ +@send +external quadraticCurveTo: ( + canvasRenderingContext2D, + ~cpx: float, + ~cpy: float, + ~x: float, + ~y: float, +) => unit = "quadraticCurveTo" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/bezierCurveTo) +*/ +@send +external bezierCurveTo: ( + canvasRenderingContext2D, + ~cp1x: float, + ~cp1y: float, + ~cp2x: float, + ~cp2y: float, + ~x: float, + ~y: float, +) => unit = "bezierCurveTo" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/arcTo) +*/ +@send +external arcTo: ( + canvasRenderingContext2D, + ~x1: float, + ~y1: float, + ~x2: float, + ~y2: float, + ~radius: float, +) => unit = "arcTo" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/rect) +*/ +@send +external rect: (canvasRenderingContext2D, ~x: float, ~y: float, ~w: float, ~h: float) => unit = + "rect" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/roundRect) +*/ +@send +external roundRect: ( + canvasRenderingContext2D, + ~x: float, + ~y: float, + ~w: float, + ~h: float, + ~radii_: array=?, +) => unit = "roundRect" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/roundRect) +*/ +@send +external roundRect2: ( + canvasRenderingContext2D, + ~x: float, + ~y: float, + ~w: float, + ~h: float, + ~radii_: array=?, +) => unit = "roundRect" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/roundRect) +*/ +@send +external roundRect3: ( + canvasRenderingContext2D, + ~x: float, + ~y: float, + ~w: float, + ~h: float, + ~radii_: array=?, +) => unit = "roundRect" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/arc) +*/ +@send +external arc: ( + canvasRenderingContext2D, + ~x: float, + ~y: float, + ~radius: float, + ~startAngle: float, + ~endAngle: float, + ~counterclockwise: bool=?, +) => unit = "arc" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/ellipse) +*/ +@send +external ellipse: ( + canvasRenderingContext2D, + ~x: float, + ~y: float, + ~radiusX: float, + ~radiusY: float, + ~rotation: float, + ~startAngle: float, + ~endAngle: float, + ~counterclockwise: bool=?, +) => unit = "ellipse" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/CanvasRenderingContext2D/getContextAttributes) +*/ +@send +external getContextAttributes: canvasRenderingContext2D => canvasRenderingContext2DSettings = + "getContextAttributes" diff --git a/src/DOMAPI/FillStyle.js b/src/DOMAPI/FillStyle.js new file mode 100644 index 0000000..1e79cc4 --- /dev/null +++ b/src/DOMAPI/FillStyle.js @@ -0,0 +1,28 @@ +// Generated by ReScript, PLEASE EDIT WITH CARE + +import * as CanvasPattern$WebApi from "../CanvasAPI/CanvasPattern.js"; +import * as CanvasGradient$WebApi from "../CanvasAPI/CanvasGradient.js"; + +function decode(t) { + if (CanvasGradient$WebApi.isInstanceOf(t)) { + return { + TAG: "CanvasGradient", + _0: t + }; + } else if (CanvasPattern$WebApi.isInstanceOf(t)) { + return { + TAG: "CanvasPattern", + _0: t + }; + } else { + return { + TAG: "String", + _0: t + }; + } +} + +export { + decode, +} +/* No side effect */ diff --git a/src/DOMAPI/FillStyle.res b/src/DOMAPI/FillStyle.res new file mode 100644 index 0000000..312f477 --- /dev/null +++ b/src/DOMAPI/FillStyle.res @@ -0,0 +1,22 @@ +open Prelude +open CanvasAPI +open DOMAPI + +external fromString: string => fillStyle = "%identity" +external fromCanvasGradient: canvasGradient => fillStyle = "%identity" +external fromCanvasPattern: canvasGradient => fillStyle = "%identity" + +type decoded = + | String(string) + | CanvasGradient(canvasGradient) + | CanvasPattern(canvasPattern) + +let decode = (t: fillStyle): decoded => { + if CanvasGradient.isInstanceOf(t) { + CanvasGradient(unsafeConversation(t)) + } else if CanvasPattern.isInstanceOf(t) { + CanvasPattern(unsafeConversation(t)) + } else { + String(unsafeConversation(t)) + } +} diff --git a/src/DOMAPI/HTMLCanvasElement.res b/src/DOMAPI/HTMLCanvasElement.res index 63ad1b1..6fcc4da 100644 --- a/src/DOMAPI/HTMLCanvasElement.res +++ b/src/DOMAPI/HTMLCanvasElement.res @@ -694,17 +694,54 @@ external hidePopover: htmlCanvasElement => unit = "hidePopover" @send external togglePopover: (htmlCanvasElement, ~force: bool=?) => bool = "togglePopover" +/** +Returns an object that provides methods and properties for drawing and manipulating images and graphics on a canvas element in a document. A context object includes information about colors, line widths, fonts, and other graphic parameters that can be drawn on a canvas. +Creates a CanvasRenderingContext2D object representing a two-dimensional rendering context. + +[Read more on MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/getContext#2d) +*/ +@send +external getContext_2D: ( + htmlCanvasElement, + @as("2d") _, + ~options: canvasRenderingContext2DSettings=?, +) => canvasRenderingContext2D = "getContext" + +/** +Returns an object that provides methods and properties for drawing and manipulating images and graphics on a canvas element in a document. A context object includes information about colors, line widths, fonts, and other graphic parameters that can be drawn on a canvas. +@param contextId The identifier (ID) of the type of canvas to create. Internet Explorer 9 and Internet Explorer 10 support only a 2-D context using canvas.getContext("2d"); IE11 Preview also supports 3-D or WebGL context using canvas.getContext("experimental-webgl"); +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/HTMLCanvasElement/getContext) +*/ +@send +external getContext_WebGL: ( + htmlCanvasElement, + @as("webgl") _, + ~options: webGLContextAttributes=?, +) => webGLRenderingContext = "getContext" + +/** +Returns an object that provides methods and properties for drawing and manipulating images and graphics on a canvas element in a document. A context object includes information about colors, line widths, fonts, and other graphic parameters that can be drawn on a canvas. +@param contextId The identifier (ID) of the type of canvas to create. Internet Explorer 9 and Internet Explorer 10 support only a 2-D context using canvas.getContext("2d"); IE11 Preview also supports 3-D or WebGL context using canvas.getContext("experimental-webgl"); +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/HTMLCanvasElement/getContext) +*/ +@send +external getContext_WebGL2: ( + htmlCanvasElement, + @as("webgl2") _, + ~options: webGLContextAttributes=?, +) => webGL2RenderingContext = "getContext" + /** Returns an object that provides methods and properties for drawing and manipulating images and graphics on a canvas element in a document. A context object includes information about colors, line widths, fonts, and other graphic parameters that can be drawn on a canvas. @param contextId The identifier (ID) of the type of canvas to create. Internet Explorer 9 and Internet Explorer 10 support only a 2-D context using canvas.getContext("2d"); IE11 Preview also supports 3-D or WebGL context using canvas.getContext("experimental-webgl"); [Read more on MDN](https://developer.mozilla.org/docs/Web/API/HTMLCanvasElement/getContext) */ @send -external getContext: ( +external getContext_BitmapRenderer: ( htmlCanvasElement, - ~contextId: string, - ~options: JSON.t=?, -) => renderingContext = "getContext" + @as("bitmaprenderer") _, + ~options: imageBitmapRenderingContextSettings=?, +) => imageBitmapRenderingContext = "getContext" /** Returns the content of the current canvas as an image that you can use as a source for another canvas or an HTML element. diff --git a/src/FetchAPI/FormData.res b/src/FetchAPI/FormData.res index 947d244..1530a19 100644 --- a/src/FetchAPI/FormData.res +++ b/src/FetchAPI/FormData.res @@ -31,7 +31,13 @@ external delete: (formData, string) => unit = "delete" [Read more on MDN](https://developer.mozilla.org/docs/Web/API/FormData/get) */ @send -external get: (formData, string) => formDataEntryValue = "get" +external get: (formData, string) => file = "get" + +/** +[Read more on MDN](https://developer.mozilla.org/docs/Web/API/FormData/get) +*/ +@send +external get2: (formData, string) => string = "get" /** [Read more on MDN](https://developer.mozilla.org/docs/Web/API/FormData/getAll) diff --git a/tests/DOMAPI/HTMLCanvasElement__tes.js b/tests/DOMAPI/HTMLCanvasElement__tes.js new file mode 100644 index 0000000..c135597 --- /dev/null +++ b/tests/DOMAPI/HTMLCanvasElement__tes.js @@ -0,0 +1,39 @@ +// Generated by ReScript, PLEASE EDIT WITH CARE + +import * as FillStyle$WebAPI from "../../src/DOMAPI/FillStyle.js"; + +let myCanvas = document.getElementById("myCanvas"); + +let ctx = myCanvas.getContext("2d"); + +ctx.fillStyle = "red"; + +ctx.fillRect(50, 50, 200, 200); + +ctx.fillStyle = "black"; + +ctx.font = "2px Tahoma"; + +ctx.textBaseline = "top"; + +ctx.fillText("MY TEXT", 60, 60); + +let color = FillStyle$WebAPI.decode(ctx.fillStyle); + +switch (color.TAG) { + case "String" : + console.log("Color: " + color._0); + break; + case "CanvasGradient" : + console.log("CanvasGradient"); + break; + case "CanvasPattern" : + console.log("CanvasPattern"); + break; +} + +export { + myCanvas, + ctx, +} +/* myCanvas Not a pure module */ diff --git a/tests/DOMAPI/HTMLCanvasElement__tes.res b/tests/DOMAPI/HTMLCanvasElement__tes.res new file mode 100644 index 0000000..920340b --- /dev/null +++ b/tests/DOMAPI/HTMLCanvasElement__tes.res @@ -0,0 +1,19 @@ +open WebAPI.Global + +let myCanvas: DOMAPI.htmlCanvasElement = + document->Document.getElementById("myCanvas")->Prelude.unsafeConversation +let ctx = myCanvas->HTMLCanvasElement.getContext_2D + +ctx.fillStyle = FillStyle.fromString("red") +ctx->CanvasRenderingContext2D.fillRect(~x=50., ~y=50., ~w=200., ~h=200.) + +ctx.fillStyle = FillStyle.fromString("black") +ctx.font = "2px Tahoma" +ctx.textBaseline = CanvasAPI.Top +ctx->CanvasRenderingContext2D.fillText(~text="MY TEXT", ~x=60., ~y=60.) + +switch ctx.fillStyle->FillStyle.decode { +| FillStyle.String(color) => Console.log(`Color: ${color}`) +| FillStyle.CanvasGradient(_) => Console.log("CanvasGradient") +| FillStyle.CanvasPattern(_) => Console.log("CanvasPattern") +} diff --git a/tools/TypeScript-DOM-lib-generator/src/build/emitter.ts b/tools/TypeScript-DOM-lib-generator/src/build/emitter.ts index 8e3fd3e..ecb58bb 100644 --- a/tools/TypeScript-DOM-lib-generator/src/build/emitter.ts +++ b/tools/TypeScript-DOM-lib-generator/src/build/emitter.ts @@ -260,7 +260,7 @@ type interfaceSettings = { const currentFileName = fileURLToPath(import.meta.url); const currentDir = path.dirname(currentFileName); const repoRoot = path.resolve(currentDir, "..", "..", "..", ".."); -const outputFolder = path.join(repoRoot, "src"); +const outputFolder = path.join(repoRoot, "tmp"); export async function emitRescriptBindings(webidl: Browser.WebIdl) { // Global print target @@ -971,6 +971,20 @@ export async function emitRescriptBindings(webidl: Browser.WebIdl) { } } + // Example case: HTMLCanvasElement->getContext + const returnTypeWithMultipleTypes = allTypeDefs.find( + (t) => t.name === signature.type, + ); + if ( + returnTypeWithMultipleTypes && + Array.isArray(returnTypeWithMultipleTypes.type) && + !signature.overrideType + ) { + return returnTypeWithMultipleTypes.type.map((t) => { + return { ...signature, type: t.type }; + }); + } + return [signature]; } @@ -1070,6 +1084,10 @@ export async function emitRescriptBindings(webidl: Browser.WebIdl) { return "~type_: eventType"; } + if (owner.startsWith("roundRect") && p.name === "radii") { + return "~radii_: array=?"; + } + if (!includeParameterNames) { return t; } @@ -1760,7 +1778,7 @@ export async function emitRescriptBindings(webidl: Browser.WebIdl) { }); } - const interfaceHierarchy: RescriptFile[] = [ + let interfaceHierarchy: RescriptFile[] = [ { name: "Prelude", entries: [ @@ -2225,13 +2243,42 @@ export async function emitRescriptBindings(webidl: Browser.WebIdl) { { name: "CanvasAPI", entries: [ - enums(["OffscreenRenderingContextId"]), - individualInterfaces(["OffscreenCanvas", "ImageBitmap"]), + enums([ + "OffscreenRenderingContextId", + "GlobalCompositeOperation", + "ImageSmoothingQuality", + "CanvasLineCap", + "CanvasLineJoin", + "CanvasTextAlign", + "CanvasTextBaseline", + "CanvasDirection", + "CanvasFontKerning", + "CanvasFontStretch", + "CanvasFontVariantCaps", + "CanvasTextRendering", + "PredefinedColorSpace", + "CanvasFillRule", + ]), + individualInterfaces([ + "OffscreenCanvas", + "ImageBitmap", + "OffscreenCanvasRenderingContext2D", + "ImageBitmapRenderingContext", + "WebGLRenderingContext", + "WebGL2RenderingContext", + "CanvasGradient", + "CanvasPattern", + "Path2D", + "TextMetrics", + ]), byHand( "OffscreenRenderingContext", emitAny("OffscreenRenderingContext"), ), - dictionaries(["ImageEncodeOptions"]), + dictionaries([ + "ImageEncodeOptions", + "CanvasRenderingContext2DSettings", + ]), ], opens: ["Prelude", "EventAPI"], }, @@ -2545,6 +2592,7 @@ export async function emitRescriptBindings(webidl: Browser.WebIdl) { "ImageData", "DOMPointReadOnly", "DOMPoint", + "CanvasRenderingContext2D", ]), chain(["Animation"]), dictionaries([ @@ -2772,6 +2820,17 @@ export async function emitRescriptBindings(webidl: Browser.WebIdl) { }, ]; + interfaceHierarchy = [ + { + name: "Temp", + entries: [ + enums(["WebGLPowerPreference"]), + dictionaries(["ImageBitmapRenderingContextSettings", "WebGLContextAttributes"]), + ], + opens: [], + } + ] + // Ensure the output folder exists. await fs.mkdir(outputFolder, { recursive: true }); @@ -2863,8 +2922,7 @@ export async function emitRescriptBindings(webidl: Browser.WebIdl) { await emitGlobalModule(); - execSync("npx rescript format -all", { cwd: repoRoot, stdio: "inherit" }); - execSync("npx rewatch", { cwd: repoRoot, stdio: "inherit" }); + // execSync("npx rescript format -all", { cwd: repoRoot, stdio: "inherit" }); // let remainers = allInterfaces.filter((i) => { // return !interfaceHierarchy.some((h) => {