OLD | NEW |
---|---|
1 /** | 1 /** |
2 * Copyright (c) 2012 The Chromium Authors. All rights reserved. | 2 * Copyright (c) 2012 The Chromium Authors. All rights reserved. |
3 * Use of this source code is governed by a BSD-style license that can be | 3 * Use of this source code is governed by a BSD-style license that can be |
4 * found in the LICENSE file. | 4 * found in the LICENSE file. |
5 */ | 5 */ |
6 | 6 |
7 /** | 7 /** |
8 * The ID of the video tag from which frames are captured. | |
9 * @private | |
10 */ | |
11 var gVideoId = 'remote-view'; | |
12 | |
13 /** | |
14 * The ID of the canvas tag from which the frames are captured. | |
15 * @private | |
16 */ | |
17 var gCanvasId = 'remote-canvas'; | |
18 | |
19 /** | |
20 * Counts the number of frames that have been captured. Used in timeout | 8 * Counts the number of frames that have been captured. Used in timeout |
21 * adjustments. | 9 * adjustments. |
22 * @private | 10 * @private |
23 */ | 11 */ |
24 var gFrameCounter = 0; | 12 var gFrameCounter = 0; |
25 | 13 |
26 /** | 14 /** |
27 * The gStartOfTime when the capturing begins. Used for timeout adjustments. | 15 * The gStartOfTime when the capturing begins. Used for timeout adjustments. |
28 * @private | 16 * @private |
29 */ | 17 */ |
(...skipping 63 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
93 gFrameCaptureInterval = 1000/frame_rate; | 81 gFrameCaptureInterval = 1000/frame_rate; |
94 gCaptureDuration = 1000 * duration; | 82 gCaptureDuration = 1000 * duration; |
95 var width = videoTag.videoWidth; | 83 var width = videoTag.videoWidth; |
96 var height = videoTag.videoHeight; | 84 var height = videoTag.videoHeight; |
97 | 85 |
98 if (width == 0 || height == 0) { | 86 if (width == 0 || height == 0) { |
99 throw failTest('Trying to capture from ' + videoTag.id + | 87 throw failTest('Trying to capture from ' + videoTag.id + |
100 ' but it is not playing any video.'); | 88 ' but it is not playing any video.'); |
101 } | 89 } |
102 | 90 |
103 setCanvasDimensions_(width, height); | |
104 | |
105 console.log('Received width is: ' + width + ', received height is: ' + height | 91 console.log('Received width is: ' + width + ', received height is: ' + height |
106 + ', capture interval is: ' + gFrameCaptureInterval + | 92 + ', capture interval is: ' + gFrameCaptureInterval + |
107 ', duration is: ' + gCaptureDuration); | 93 ', duration is: ' + gCaptureDuration); |
108 | 94 |
95 var remoteCanvas = document.createElement('canvas'); | |
96 remoteCanvas.width = width; | |
97 remoteCanvas.height = height; | |
98 document.body.appendChild(remoteCanvas); | |
99 | |
109 gStartOfTime = new Date().getTime(); | 100 gStartOfTime = new Date().getTime(); |
110 setTimeout(function() { shoot(width, height); }, | 101 setTimeout(function() { shoot(videoTag, remoteCanvas, width, height); }, |
111 gFrameCaptureInterval); | 102 gFrameCaptureInterval); |
112 } | 103 } |
113 | 104 |
114 /** | 105 /** |
115 * Sets the canvas dimensions. | |
116 * @private | |
117 * @param {Number} The width of the canvas. | |
118 * @param {Number} The height of the canvas. | |
119 */ | |
120 function setCanvasDimensions_(width, height) { | |
amogh.bihani
2014/05/13 13:23:25
Now these changes seem futile. :(
| |
121 var canvas = document.getElementById(gCanvasId); | |
122 canvas.width = width; | |
123 canvas.height = height; | |
124 } | |
125 | |
126 /** | |
127 * Captures an image frame from the provided video element. | 106 * Captures an image frame from the provided video element. |
128 * | 107 * |
108 * @private | |
129 * @param {Video} video HTML5 video element from where the image frame will | 109 * @param {Video} video HTML5 video element from where the image frame will |
130 * be captured. | 110 * be captured. |
111 * @param {!Object} 2d context of the canvas on which the image frame will be | |
112 * captured. | |
131 * @param {Number} The width of the video/canvas area to be captured. | 113 * @param {Number} The width of the video/canvas area to be captured. |
132 * @param {Number} The height of the video/canvas area to be captured. | 114 * @param {Number} The height of the video/canvas area to be captured. |
133 * | 115 * |
134 * @return {Canvas} | 116 * @return {Object} Returns the ImageData object. |
135 */ | 117 */ |
136 function capture(video, width, height) { | 118 function captureFrame_(video, context, width, height) { |
137 var canvas = document.getElementById(gCanvasId); | 119 context.drawImage(video, 0, 0, width, height); |
138 var ctx = canvas.getContext('2d'); | 120 return context.getImageData(0, 0, width, height); |
139 ctx.drawImage(video, 0, 0, width, height); | |
140 return canvas; | |
141 } | 121 } |
142 | 122 |
143 /** | 123 /** |
144 * The function which is called at the end of every gFrameCaptureInterval. Gets | 124 * The function which is called at the end of every gFrameCaptureInterval. Gets |
145 * the current frame from the video and extracts the data from it. Then it saves | 125 * the current frame from the video and extracts the data from it. Then it saves |
146 * it in the frames array and adjusts the capture interval (timers in JavaScript | 126 * it in the frames array and adjusts the capture interval (timers in JavaScript |
147 * aren't precise). | 127 * aren't precise). |
148 * | 128 * |
129 * @param {!Object} The video whose frames are to be captured. | |
130 * @param {Canvas} The canvas on which the image will be captured. | |
149 * @param {Number} The width of the video/canvas area to be captured. | 131 * @param {Number} The width of the video/canvas area to be captured. |
150 * @param {Number} The height of the video area to be captured. | 132 * @param {Number} The height of the video area to be captured. |
151 */ | 133 */ |
152 function shoot(width, height) { | 134 function shoot(video, canvas, width, height) { |
153 // The first two captured frames have big difference between the ideal time | 135 // The first two captured frames have big difference between the ideal time |
154 // interval between two frames and the real one. As a consequence this affects | 136 // interval between two frames and the real one. As a consequence this affects |
155 // enormously the interval adjustment for subsequent frames. That's why we | 137 // enormously the interval adjustment for subsequent frames. That's why we |
156 // have to reset the time after the first two frames and get rid of these two | 138 // have to reset the time after the first two frames and get rid of these two |
157 // frames. | 139 // frames. |
158 if (gFrameCounter == 1 && !gFrameIntervalAdjustment) { | 140 if (gFrameCounter == 1 && !gFrameIntervalAdjustment) { |
159 gStartOfTime = new Date().getTime(); | 141 gStartOfTime = new Date().getTime(); |
160 gFrameCounter = 0; | 142 gFrameCounter = 0; |
161 gFrameIntervalAdjustment = true; | 143 gFrameIntervalAdjustment = true; |
162 gFrames.pop(); | 144 gFrames.pop(); |
163 gFrames.pop(); | 145 gFrames.pop(); |
164 } | 146 } |
165 var video = document.getElementById(gVideoId); | |
166 var canvas = capture(video, width, height); | |
167 | 147 |
168 // Extract the data from the canvas. | |
169 var ctx = canvas.getContext('2d'); | |
170 // We capture the whole video frame. | 148 // We capture the whole video frame. |
171 var img = ctx.getImageData(0, 0, width, height); | 149 var img = captureFrame_(video, canvas.getContext('2d'), width, height); |
172 gFrames.push(img.data.buffer); | 150 gFrames.push(img.data.buffer); |
173 gFrameCounter++; | 151 gFrameCounter++; |
174 | 152 |
175 // Adjust the timer. | 153 // Adjust the timer. |
176 var current_time = new Date().getTime(); | 154 var current_time = new Date().getTime(); |
177 var ideal_time = gFrameCounter*gFrameCaptureInterval; | 155 var ideal_time = gFrameCounter*gFrameCaptureInterval; |
178 var real_time_elapsed = current_time - gStartOfTime; | 156 var real_time_elapsed = current_time - gStartOfTime; |
179 var diff = real_time_elapsed - ideal_time; | 157 var diff = real_time_elapsed - ideal_time; |
180 | 158 |
181 if (real_time_elapsed < gCaptureDuration) { | 159 if (real_time_elapsed < gCaptureDuration) { |
182 // If duration isn't over shoot again | 160 // If duration isn't over shoot again |
183 setTimeout(function() { shoot(width, height); }, | 161 setTimeout(function() { shoot(video, canvas, width, height); }, |
184 gFrameCaptureInterval - diff); | 162 gFrameCaptureInterval - diff); |
185 } else { // Else reset gFrameCounter and send the frames | 163 } else { // Else reset gFrameCounter and send the frames |
186 dDoneFrameCapturing = true; | 164 dDoneFrameCapturing = true; |
187 gFrameCounter = 0; | 165 gFrameCounter = 0; |
188 clearPage_(); | 166 clearPage_(); |
189 prepareProgressBar_(); | 167 prepareProgressBar_(); |
190 sendFrames(); | 168 sendFrames(); |
191 } | 169 } |
192 } | 170 } |
193 | 171 |
(...skipping 91 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
285 /** | 263 /** |
286 * @private | 264 * @private |
287 */ | 265 */ |
288 function prepareProgressBar_() { | 266 function prepareProgressBar_() { |
289 document.body.innerHTML = | 267 document.body.innerHTML = |
290 '<html><body>' + | 268 '<html><body>' + |
291 '<p id="progress-bar" style="position: absolute; top: 50%; left: 40%;">' + | 269 '<p id="progress-bar" style="position: absolute; top: 50%; left: 40%;">' + |
292 'Preparing to send frames.</p>' + | 270 'Preparing to send frames.</p>' + |
293 '</body></html>'; | 271 '</body></html>'; |
294 } | 272 } |
OLD | NEW |