Skip to content

Commit 12aab35

Browse files
committed
Add ImageBitmap and ImageBitmapRenderingContext
1 parent 4be0e2f commit 12aab35

16 files changed

+812
-28
lines changed

content/Browser/window.jsdoc

+430
Large diffs are not rendered by default.

content/Canvas/ImageBitmap.jsdoc

+28
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
ImageBitmap : Object
2+
3+
An image that can be passed to most %%/CanvasRenderingContext|CanvasRenderingContext%%
4+
methods in place of %%/HTMLImageElement|HTMLImageElements%%. ImageBitmaps are
5+
more efficient than creating %%/HTMLImageElement|HTMLImageElements%% DOM element
6+
if you don't need to render the element directly in the page.
7+
Created via %%/Window#createImageBitmap|window.createImageBitmap()%%.
8+
See also %%/ImageBitmapRenderingContext|ImageBitmapRenderingContext%%.
9+
10+
Spec:
11+
https://html.spec.whatwg.org/multipage/imagebitmap-and-animations.html#imagebitmap
12+
13+
----
14+
instance.height : Number
15+
16+
ReadOnly:
17+
true
18+
19+
----
20+
instance.width : Number
21+
22+
ReadOnly:
23+
true
24+
25+
----
26+
prototype.close() : undefined
27+
28+
Releases the memory holding the bitmap data.
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
ImageBitmapRenderingContext : Object
2+
3+
Constructed by passing **'bitmaprenderer'** to %%/HTMLCanvasElement|**canvas.getContext('bitmaprenderer')**%%.
4+
5+
You can pass an additional options argument:
6+
7+
<code>
8+
{
9+
alpha : Number /* Default = true */
10+
}
11+
</code>
12+
13+
14+
Spec:
15+
https://html.spec.whatwg.org/multipage/canvas.html#imagebitmaprenderingcontext
16+
17+
----
18+
instance.canvas : HTMLCanvasElement
19+
20+
----
21+
prototype.transferFromImageBitmap(bitmap : ImageBitmap) : undefined
+4-3
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
11
CanvasRenderingContext : Object
22

33
The object used to render into a %%/HTMLCanvasElement|Canvas%% element.
4-
There are currently 2 types of contexts, the
5-
%%/CanvasRenderingContext2D|**CanvasRenderingContext2D**%%
4+
There are currently 3 types of contexts,
5+
%%/CanvasRenderingContext2D|**CanvasRenderingContext2D**%%,
6+
%%/ImageBitmapRenderingContext|**ImageBitmapRenderingContext**%%,
67
and
78
%%/WebGLRenderingContext|**WebGLRenderingContext**%%. You can retrieve
8-
these contexts for the canvas by passing in **'2d'** or **'webgl'**
9+
these contexts for the canvas by passing in **'2d'**, **'bitmaprenderer'**, or **'webgl'**
910
into %%/HTMLCanvasElement#getContext|**canvas.getContext()**%%.
1011

content/Canvas/canvasrenderingcontext2d.jsdoc

+12-8
Original file line numberDiff line numberDiff line change
@@ -335,8 +335,9 @@ Creates a pattern for the specified **image**.
335335

336336
**image** can be either a
337337
%%/HTMLImageElement|**HTMLImageElement**%%,
338-
%%/HTMLCanvasElement|**HTMLCanvasElement**%%, or
339-
%%/HTMLVideoElement|**HTMLVideoElement**%%.
338+
%%/HTMLCanvasElement|**HTMLCanvasElement**%%,
339+
%%/HTMLVideoElement|**HTMLVideoElement**%%, or
340+
%%/ImageBitmap|**ImageBitmap**%%.
340341

341342
**repetition** must be one of
342343
**'repeat'**, **'repeat-x'**, **'repeat-y'**, or **'no-repeat'**.
@@ -757,8 +758,9 @@ Draws **image** to the canvas at **dx**, **dy** using the natural size of the im
757758

758759
**image** can be either an
759760
%%/HTMLImageElement|**HTMLImageElement**%%,
760-
%%/HTMLCanvasElement|**HTMLCanvasElement**%%, or
761-
%%/HTMLVideoElement|**HTMLVideoElement**%%.
761+
%%/HTMLCanvasElement|**HTMLCanvasElement**%%,
762+
%%/HTMLVideoElement|**HTMLVideoElement**%%, or
763+
%%/ImageBitmap|**ImageBitmap**%%.
762764

763765
<htmlexample>
764766
<canvas id='canvas'></canvas>
@@ -785,8 +787,9 @@ Draws **image** to the canvas at **dx**, **dy** of size **dw** by **dh**.
785787

786788
**image** can be either an
787789
%%/HTMLImageElement|**HTMLImageElement**%%,
788-
%%/HTMLCanvasElement|**HTMLCanvasElement**%%, or
789-
%%/HTMLVideoElement|**HTMLVideoElement**%%.
790+
%%/HTMLCanvasElement|**HTMLCanvasElement**%%,
791+
%%/HTMLVideoElement|**HTMLVideoElement**%%, or
792+
%%/ImageBitmap|**ImageBitmap**%%.
790793

791794
<htmlexample>
792795
<canvas id='canvas'></canvas>
@@ -813,8 +816,9 @@ The image will be stretched and scaled if **sw**, **sh** does not match **dw** b
813816

814817
**image** can be either an
815818
%%/HTMLImageElement|**HTMLImageElement**%%,
816-
%%/HTMLCanvasElement|**HTMLCanvasElement**%%, or
817-
%%/HTMLVideoElement|**HTMLVideoElement**%%.
819+
%%/HTMLCanvasElement|**HTMLCanvasElement**%%,
820+
%%/HTMLVideoElement|**HTMLVideoElement**%%, or
821+
%%/ImageBitmap|**ImageBitmap**%%.
818822

819823

820824
<htmlexample>

content/DOM/htmlcanvaselement.jsdoc

+7-2
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,13 @@ It corresponds to the **<canvas>** tag.
88
prototype.getContext(contextType : String, [contextAttributes : Object]) : CanvasRenderingContext
99

1010
Returns a context that can be used to draw into the canvas. **contextType** can be
11-
either **'2d'** to retrieve a %%CanvasRenderingContext2D|**CanvasRenderingContext2D**%%
12-
or **'webgl'** to retrieve a %%WebGLRenderingContext|**WebGLRenderingContext**%%. When
11+
**'2d'** to retrieve a %%CanvasRenderingContext2D|**CanvasRenderingContext2D**%%
12+
**'bitmaprenderer'** to retrieve an %%ImageBitmapRenderingContext|**ImageBitmapRenderingContext**%%
13+
or **'webgl'** to retrieve a %%WebGLRenderingContext|**WebGLRenderingContext**%%.
14+
15+
<br>
16+
17+
When
1318
specifying **'webgl'**, you can configure how the context is initialized by passing
1419
a %%/WebGLContextAttributes|**WebGLContextAttributes**%% as the second parameter.
1520

docs/CanvasRenderingContext.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<!DOCTYPE html><html><head><meta charset="utf-8"><title>CanvasRenderingContext JavaScript API</title><meta name="description" content="Interactive API reference for the JavaScript CanvasRenderingContext Object. The object used to render into a Canvas element. There are currently 2 types of contexts, the CanvasRenderingContext2D and "><link rel="stylesheet" type="text/css" href="styles.css"><script type="text/javascript">var _gaq = _gaq || [];
1+
<!DOCTYPE html><html><head><meta charset="utf-8"><title>CanvasRenderingContext JavaScript API</title><meta name="description" content="Interactive API reference for the JavaScript CanvasRenderingContext Object. The object used to render into a Canvas element. There are currently 3 types of contexts, CanvasRenderingContext2D, ImageBit"><link rel="stylesheet" type="text/css" href="styles.css"><script type="text/javascript">var _gaq = _gaq || [];
22
_gaq.push(['_setAccount', 'UA-23450559-1']);
33
_gaq.push(['_trackPageview']);
44
(function() {
@@ -7,4 +7,4 @@
77
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
88
})();</script></head><body><script>if (sessionStorage.collapsed === 'true') {
99
document.body.classList.add('members-collapsed');
10-
}</script><div class="topnav"><a href="/">JavaScripture</a><div class="bookmarks"><a class="bookmark contribute" href="https://github.com/nkronlage/JavaScripture">Contribute via GitHub</a> <a class="bookmark" href="/feedback">Feedback</a></div></div><div class="container"><nav class="leftnav"><div id="searchContainer"><input id="searchBox" type="text" placeholder="Search (Ctrl + S)" autocomplete="false" autofocus="autofocus"><div id="resultsBox" style="display:none;"></div></div><div id="apichooser"><a href="#" onclick="openApiChooser(); return false;"><div class="arrow"></div><span id="selectedsets"></span></a><div id="obscure"></div><div id="apisets"><ul></ul></div></div><div class="toc"><h2>CanvasRenderingContext</h2><div class="navgroup"></div><h2>Canvas API</h2><div id="related-apis" class="navgroup"></div><h2>All API</h2><div id="rootObjs" class="navgroup"><span class="empty">No API set selected.</span></div></div></nav><div class="content"><h1 class="declaration"><span class="hide">JavaScript</span> <span class="object">CanvasRenderingContext</span> <span class="type">: <a href="/Object">Object</a></span></h1><div class="metadata"></div><div class="objectdescription">The object used to render into a <a href="/HTMLCanvasElement">Canvas</a> element. There are currently 2 types of contexts, the <a href="/CanvasRenderingContext2D"><code>CanvasRenderingContext2D</code></a> and <a href="/WebGLRenderingContext"><code>WebGLRenderingContext</code></a>. You can retrieve these contexts for the canvas by passing in <code>'2d'</code> or <code>'webgl'</code> into <a href="/HTMLCanvasElement#getContext"><code>canvas.getContext()</code></a>.</div><div class="bottomnav"><a href="/">home</a> <a href="/license">license</a> <a href="https://github.com/nkronlage/JavaScripture">contribute</a> <a href="/feedback">feedback</a></div><div class="copyright">Copyright © JavaScripture Contributors</div></div></div></body><script src="javascripture.js"></script></html>
10+
}</script><div class="topnav"><a href="/">JavaScripture</a><div class="bookmarks"><a class="bookmark contribute" href="https://github.com/nkronlage/JavaScripture">Contribute via GitHub</a> <a class="bookmark" href="/feedback">Feedback</a></div></div><div class="container"><nav class="leftnav"><div id="searchContainer"><input id="searchBox" type="text" placeholder="Search (Ctrl + S)" autocomplete="false" autofocus="autofocus"><div id="resultsBox" style="display:none;"></div></div><div id="apichooser"><a href="#" onclick="openApiChooser(); return false;"><div class="arrow"></div><span id="selectedsets"></span></a><div id="obscure"></div><div id="apisets"><ul></ul></div></div><div class="toc"><h2>CanvasRenderingContext</h2><div class="navgroup"></div><h2>Canvas API</h2><div id="related-apis" class="navgroup"></div><h2>All API</h2><div id="rootObjs" class="navgroup"><span class="empty">No API set selected.</span></div></div></nav><div class="content"><h1 class="declaration"><span class="hide">JavaScript</span> <span class="object">CanvasRenderingContext</span> <span class="type">: <a href="/Object">Object</a></span></h1><div class="metadata"></div><div class="objectdescription">The object used to render into a <a href="/HTMLCanvasElement">Canvas</a> element. There are currently 3 types of contexts, <a href="/CanvasRenderingContext2D"><code>CanvasRenderingContext2D</code></a>, <a href="/ImageBitmapRenderingContext"><code>ImageBitmapRenderingContext</code></a>, and <a href="/WebGLRenderingContext"><code>WebGLRenderingContext</code></a>. You can retrieve these contexts for the canvas by passing in <code>'2d'</code>, <code>'bitmaprenderer'</code>, or <code>'webgl'</code> into <a href="/HTMLCanvasElement#getContext"><code>canvas.getContext()</code></a>.</div><div class="bottomnav"><a href="/">home</a> <a href="/license">license</a> <a href="https://github.com/nkronlage/JavaScripture">contribute</a> <a href="/feedback">feedback</a></div><div class="copyright">Copyright © JavaScripture Contributors</div></div></div></body><script src="javascripture.js"></script></html>

0 commit comments

Comments
 (0)