/
CanvasSnapshot.js
90 lines (75 loc) · 2.76 KB
/
CanvasSnapshot.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
/**
* @author Richard Davey <rich@photonstorm.com>
* @copyright 2013-2023 Photon Storm Ltd.
* @license {@link https://opensource.org/licenses/MIT|MIT License}
*/
var CanvasPool = require('../../display/canvas/CanvasPool');
var Color = require('../../display/color/Color');
var GetFastValue = require('../../utils/object/GetFastValue');
/**
* Takes a snapshot of an area from the current frame displayed by a canvas.
*
* This is then copied to an Image object. When this loads, the results are sent
* to the callback provided in the Snapshot Configuration object.
*
* @function Phaser.Renderer.Snapshot.Canvas
* @since 3.0.0
*
* @param {HTMLCanvasElement} sourceCanvas - The canvas to take a snapshot of.
* @param {Phaser.Types.Renderer.Snapshot.SnapshotState} config - The snapshot configuration object.
*/
var CanvasSnapshot = function (canvas, config)
{
var callback = GetFastValue(config, 'callback');
var type = GetFastValue(config, 'type', 'image/png');
var encoderOptions = GetFastValue(config, 'encoder', 0.92);
var x = Math.abs(Math.round(GetFastValue(config, 'x', 0)));
var y = Math.abs(Math.round(GetFastValue(config, 'y', 0)));
var width = Math.floor(GetFastValue(config, 'width', canvas.width));
var height = Math.floor(GetFastValue(config, 'height', canvas.height));
var getPixel = GetFastValue(config, 'getPixel', false);
if (getPixel)
{
var context = canvas.getContext('2d', { willReadFrequently: false });
var imageData = context.getImageData(x, y, 1, 1);
var data = imageData.data;
callback.call(null, new Color(data[0], data[1], data[2], data[3]));
}
else if (x !== 0 || y !== 0 || width !== canvas.width || height !== canvas.height)
{
// Area Grab
var copyCanvas = CanvasPool.createWebGL(this, width, height);
var ctx = copyCanvas.getContext('2d', { willReadFrequently: true });
if (width > 0 && height > 0)
{
ctx.drawImage(canvas, x, y, width, height, 0, 0, width, height);
}
var image1 = new Image();
image1.onerror = function ()
{
callback.call(null);
CanvasPool.remove(copyCanvas);
};
image1.onload = function ()
{
callback.call(null, image1);
CanvasPool.remove(copyCanvas);
};
image1.src = copyCanvas.toDataURL(type, encoderOptions);
}
else
{
// Full Grab
var image2 = new Image();
image2.onerror = function ()
{
callback.call(null);
};
image2.onload = function ()
{
callback.call(null, image2);
};
image2.src = canvas.toDataURL(type, encoderOptions);
}
};
module.exports = CanvasSnapshot;