[canvaskit] Allow providing webgl context and canvas element
Maybe one day we'll want to expose makeWebGLContext too, thus
it takes in the attrs as a configurable parameter.
Bug: skia:
Change-Id: Idb38f932b5ea6b364d823283b262e8508bff07c4
Reviewed-on: https://skia-review.googlesource.com/c/180776
Reviewed-by: Joe Gregorio <jcgregorio@google.com>
diff --git a/experimental/canvaskit/CHANGELOG.md b/experimental/canvaskit/CHANGELOG.md
index f1869a2..3ca5c27 100644
--- a/experimental/canvaskit/CHANGELOG.md
+++ b/experimental/canvaskit/CHANGELOG.md
@@ -7,6 +7,8 @@
## [Unreleased]
### Added
- `SkFont` now exposed.
+ - `MakeCanvasSurface` can now take a canvas element directly.
+ - `MakeWebGLCanvasSurface` can now take a WebGL context as an integer and use it directly.
### Removed
- `SkPaint.measureText` - use `SkFont.measureText` instead.
diff --git a/experimental/canvaskit/canvaskit_bindings.cpp b/experimental/canvaskit/canvaskit_bindings.cpp
index a83c252..2464b47 100644
--- a/experimental/canvaskit/canvaskit_bindings.cpp
+++ b/experimental/canvaskit/canvaskit_bindings.cpp
@@ -70,23 +70,10 @@
// Wraps the WebGL context in an SkSurface and returns it.
// This function based on the work of
// https://github.com/Zubnix/skia-wasm-port/, used under the terms of the MIT license.
-sk_sp<SkSurface> getWebGLSurface(std::string id, int width, int height) {
- // Context configurations
- EmscriptenWebGLContextAttributes attrs;
- emscripten_webgl_init_context_attributes(&attrs);
- attrs.alpha = true;
- attrs.premultipliedAlpha = true;
- attrs.majorVersion = 1;
- attrs.enableExtensionsByDefault = true;
-
- EMSCRIPTEN_WEBGL_CONTEXT_HANDLE context = emscripten_webgl_create_context(id.c_str(), &attrs);
- if (context < 0) {
- printf("failed to create webgl context %d\n", context);
- return nullptr;
- }
+sk_sp<SkSurface> getWebGLSurface(EMSCRIPTEN_WEBGL_CONTEXT_HANDLE context, int width, int height) {
EMSCRIPTEN_RESULT r = emscripten_webgl_make_context_current(context);
if (r < 0) {
- printf("failed to make webgl current %d\n", r);
+ printf("failed to make webgl context current %d\n", r);
return nullptr;
}
diff --git a/experimental/canvaskit/cpu.js b/experimental/canvaskit/cpu.js
index 8951be7..5a20c98 100644
--- a/experimental/canvaskit/cpu.js
+++ b/experimental/canvaskit/cpu.js
@@ -3,11 +3,15 @@
(function(CanvasKit){
CanvasKit._extraInitializations = CanvasKit._extraInitializations || [];
CanvasKit._extraInitializations.push(function() {
- CanvasKit.MakeSWCanvasSurface = function(htmlID) {
- var canvas = document.getElementById(htmlID);
- if (!canvas) {
- throw 'Canvas with id ' + htmlID + ' was not found';
- }
+ // Takes in an html id or a canvas element
+ CanvasKit.MakeSWCanvasSurface = function(idOrElement) {
+ var canvas = idOrElement;
+ if (canvas.tagName !== 'CANVAS') {
+ canvas = document.getElementById(idOrElement);
+ if (!canvas) {
+ throw 'Canvas with id ' + idOrElement + ' was not found';
+ }
+ }
// Maybe better to use clientWidth/height. See:
// https://webglfundamentals.org/webgl/lessons/webgl-anti-patterns.html
var surface = CanvasKit.MakeSurface(canvas.width, canvas.height);
diff --git a/experimental/canvaskit/gpu.js b/experimental/canvaskit/gpu.js
index 41cbb65..6dca353 100644
--- a/experimental/canvaskit/gpu.js
+++ b/experimental/canvaskit/gpu.js
@@ -3,17 +3,81 @@
(function(CanvasKit){
CanvasKit._extraInitializations = CanvasKit._extraInitializations || [];
CanvasKit._extraInitializations.push(function() {
- CanvasKit.MakeWebGLCanvasSurface = function(htmlID) {
- var canvas = document.getElementById(htmlID);
- if (!canvas) {
- throw 'Canvas with id ' + htmlID + ' was not found';
+ function get(obj, attr, defaultValue) {
+ if (obj && obj.hasOwnProperty(attr)) {
+ return obj[attr];
}
+ return defaultValue;
+ }
+
+ function makeWebGLContext(canvas, attrs) {
+ // These defaults come from the emscripten _emscripten_webgl_create_context
+ var contextAttributes = {
+ 'alpha': get(attrs, 'alpha', 1),
+ 'depth': get(attrs, 'depth', 1),
+ 'stencil': get(attrs, 'stencil', 0),
+ 'antialias': get(attrs, 'antialias', 1),
+ 'premultipliedAlpha': get(attrs, 'premultipliedAlpha', 1),
+ 'preserveDrawingBuffer': get(attrs, 'preserveDrawingBuffer', 0),
+ 'preferLowPowerToHighPerformance': get(attrs, 'preferLowPowerToHighPerformance', 0),
+ 'failIfMajorPerformanceCaveat': get(attrs, 'failIfMajorPerformanceCaveat', 0),
+ 'majorVersion': get(attrs, 'majorVersion', 1),
+ 'minorVersion': get(attrs, 'minorVersion', 0),
+ 'enableExtensionsByDefault': get(attrs, 'enableExtensionsByDefault', 1),
+ 'explicitSwapControl': get(attrs, 'explicitSwapControl', 0),
+ 'renderViaOffscreenBackBuffer': get(attrs, 'renderViaOffscreenBackBuffer', 0),
+ };
+ if (!canvas) {
+ SkDebug('null canvas passed into makeWebGLContext');
+ return 0;
+ }
+ // This check is from the emscripten version
+ if (contextAttributes['explicitSwapControl']) {
+ SkDebug('explicitSwapControl is not supported');
+ return 0;
+ }
+ return GL.createContext(canvas, contextAttributes);
+ }
+
+ // arg can be of types:
+ // - String - in which case it is interpreted as an id of a
+ // canvas element.
+ // - HTMLCanvasElement - in which the provided canvas element will
+ // be used directly.
+ // - int - in which case it will be used as a WebGLContext. Only 1.0
+ // contexts are known to work for now.
+ // Width and height can be provided to override those on the canvas
+ // element, or specify a height for when a context is provided.
+ CanvasKit.MakeWebGLCanvasSurface = function(arg, width, height) {
+ var ctx = arg;
+ // ctx is only > 0 if it's an int, and thus a valid context
+ if (!(ctx > 0)) {
+ var canvas = arg;
+ if (canvas.tagName !== 'CANVAS') {
+ canvas = document.getElementById(arg);
+ if (!canvas) {
+ throw 'Canvas with id ' + arg + ' was not found';
+ }
+ }
+ // we are ok with all the defaults
+ ctx = makeWebGLContext(canvas);
+ }
+
+ if (!ctx || ctx < 0) {
+ throw 'failed to create webgl context: err ' + ctx;
+ }
+
+ if (!canvas && (!width || !height)) {
+ throw 'height and width must be provided with context';
+ }
+
// Maybe better to use clientWidth/height. See:
// https://webglfundamentals.org/webgl/lessons/webgl-anti-patterns.html
- var surface = this._getWebGLSurface(htmlID, canvas.width, canvas.height);
+ var surface = this._getWebGLSurface(ctx, width || canvas.width,
+ height || canvas.height);
if (!surface) {
SkDebug('falling back from GPU implementation to a SW based one');
- return CanvasKit.MakeSWCanvasSurface(htmlID);
+ return CanvasKit.MakeSWCanvasSurface(arg);
}
return surface;
};