Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(106)

Side by Side Diff: third_party/WebKit/LayoutTests/fast/canvas/OffscreenCanvas-2d-drawImage.html

Issue 2294383002: Make OffscreenCanvas a member of CanvasImageSource (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: rebase Created 4 years, 3 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 <html> 1 <html>
2 <head> 2 <head>
3 <style type="text/css"> 3 <style type="text/css">
4 video { 4 video {
5 display: none; 5 display: none;
6 } 6 }
7 </style> 7 </style>
8 </head> 8 </head>
9 <body> 9 <body>
10 <video id="video" width="30" height="30"> 10 <video id="video" width="30" height="30">
11 <source src="resources/canvas_video.webm" type="video/webm" /> 11 <source src="resources/canvas_video.webm" type="video/webm" />
12 </video> 12 </video>
13 <canvas id="videoOutput" width="150" height="150"></canvas> 13 <canvas id="videoOutput" width="150" height="150"></canvas>
14 <canvas id="imageOutput" width="150" height="150"></canvas> 14 <canvas id="imageOutput" width="150" height="150"></canvas>
15 <canvas id="canvasOutput" width="150" height="150"></canvas> 15 <canvas id="canvasOutput" width="150" height="150"></canvas>
16 <canvas id="offscreenCanvas2DOutput" width="150" height="150"></canvas>
17 <canvas id="offscreenCanvasWebGLOutput" width="150" height="150"></canvas>
16 18
17 <script> 19 <script>
18 function drawImageSourceToOffscreenCanvas(imageSource, outputCanvas) { 20 function drawImageSourceToOffscreenCanvas(imageSource, outputCanvas) {
19 var aCanvas = new OffscreenCanvas(150, 150); 21 var aCanvas = new OffscreenCanvas(150, 150);
20 var ctx = aCanvas.getContext('2d'); 22 var ctx = aCanvas.getContext('2d');
21 23
22 ctx.drawImage(imageSource, 0, 0); 24 ctx.drawImage(imageSource, 0, 0);
23 ctx.drawImage(imageSource, 30, 30, 30, 30); 25 ctx.drawImage(imageSource, 30, 30, 30, 30);
24 // stretch the image 26 // stretch the image
25 ctx.drawImage(imageSource, 8, 8, 15, 15, 60, 60, 60, 60); 27 ctx.drawImage(imageSource, 8, 8, 15, 15, 60, 60, 60, 60);
(...skipping 26 matching lines...) Expand all
52 var htmlCanvas = document.createElement('canvas'); 54 var htmlCanvas = document.createElement('canvas');
53 htmlCanvas.width = 30; 55 htmlCanvas.width = 30;
54 htmlCanvas.height = 30; 56 htmlCanvas.height = 30;
55 var htmlCanvasCtx = htmlCanvas.getContext("2d"); 57 var htmlCanvasCtx = htmlCanvas.getContext("2d");
56 htmlCanvasCtx.fillStyle = "blue"; 58 htmlCanvasCtx.fillStyle = "blue";
57 htmlCanvasCtx.fillRect(0, 0, 15, 30); 59 htmlCanvasCtx.fillRect(0, 0, 15, 30);
58 htmlCanvasCtx.fillStyle = "red"; 60 htmlCanvasCtx.fillStyle = "red";
59 htmlCanvasCtx.fillRect(15, 0, 30, 30); 61 htmlCanvasCtx.fillRect(15, 0, 30, 30);
60 drawImageSourceToOffscreenCanvas(htmlCanvas, document.getElementById('canvasOutp ut')); 62 drawImageSourceToOffscreenCanvas(htmlCanvas, document.getElementById('canvasOutp ut'));
61 63
64 // image source as OffscreenCanvas with 2D context
65 var offscreenCanvas2D = new OffscreenCanvas(30, 30);
66 var offscreenCanvas2DCtx = offscreenCanvas2D.getContext("2d");
67 offscreenCanvas2DCtx.fillStyle = "blue";
68 offscreenCanvas2DCtx.fillRect(0, 0, 15, 30);
69 offscreenCanvas2DCtx.fillStyle = "red";
70 offscreenCanvas2DCtx.fillRect(15, 0, 30, 30);
71 drawImageSourceToOffscreenCanvas(offscreenCanvas2D, document.getElementById('off screenCanvas2DOutput'));
72
73 // Image source as OffscreenCanvas with webGL context
74 var offscreenCanvasWebGL = new OffscreenCanvas(30, 30);
75 var gl = offscreenCanvasWebGL.getContext("webgl");
76 gl.clearColor(0.0, 0.0, 1.0, 1.0);
77 gl.clear(gl.COLOR_BUFFER_BIT);
78 drawImageSourceToOffscreenCanvas(offscreenCanvasWebGL, document.getElementById(' offscreenCanvasWebGLOutput'));
79
62 </script> 80 </script>
63 </body> 81 </body>
64 82
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698