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

Side by Side Diff: ppapi/examples/video_encode/video_encode.html

Issue 937643006: Pepper: add video_encoder example (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@bbudge-ppb-video-encoder-impl
Patch Set: Nits update Created 5 years, 10 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
(Empty)
1 <!DOCTYPE html>
2 <html>
3 <!--
4 Copyright 2014 The Chromium Authors. All rights reserved.
bbudge 2015/02/19 21:54:38 nit: 2015
llandwerlin-old 2015/02/27 14:19:44 Done.
5 Use of this source code is governed by a BSD-style license that can be
6 found in the LICENSE file.
7 -->
8 <head>
9 <title>Video Encoder Example</title>
10 <style type="text/css">
11 #video {
12 position: fixed;
13 }
14 #plugin {
15 position: fixed;
16 }
17 </style>
18 <script type="text/javascript">
19 var plugin;
20 var track;
21 var video;
22
23 function success(stream) {
24 track = stream.getVideoTracks()[0];
25 video.src = URL.createObjectURL(stream);
26 video.play();
27
28 plugin.postMessage({
29 command: 'start',
30 track: track
31 });
32 }
33
34 function failure(e) {
35 console.log("Error: ", e);
36 }
37
38 function startRecord() {
39 console.log("starting record");
40 navigator.webkitGetUserMedia({audio: false, video: true}, success, failure );
bbudge 2015/02/19 21:54:38 nit: line length > 80
llandwerlin-old 2015/02/27 14:19:44 Done.
41 }
42
43 function stopRecord() {
44 plugin.postMessage({
45 command: "stop"
46 });
47 var video = document.getElementById('video');
48 video.pause();
49 track.stop();
50 }
51
52 function saveBlob(blob) {
53 var blobUrl = URL.createObjectURL(blob);
54 window.location = blobUrl;
55 }
56
57 function handleMessage(msg) {
58 if (msg.data.name == 'started') {
59 console.log('recording!');
60 } else if (msg.data.name == 'data') {
61 appendData(msg.data.data);
62 } else if (msg.data.name == 'stopped') {
63 console.log('done recording! bytes: ' + dataArray.byteLength);
64 saveBlob(new Blob([dataArray], { type: "application/octet-stream" }));
bbudge 2015/02/19 21:54:38 On my Mac, the encoder failed (no hardware) and I
65 resetData();
66 }
67 }
68
69 function resetData() {
70 window.dataArray = new ArrayBuffer(0);
71 }
72
73 function appendData(data) {
74 var tmp = new Uint8Array(dataArray.byteLength + data.byteLength);
75 tmp.set(new Uint8Array(dataArray), 0 );
76 tmp.set(new Uint8Array(data), dataArray.byteLength);
77 dataArray = tmp.buffer;
78 }
79
80 function initialize() {
81 plugin = document.getElementById('plugin');
82 plugin.addEventListener('message', handleMessage, false);
83
84 video = document.getElementById('video');
85
86 var selectEl = document.getElementById('start');
87 selectEl.addEventListener('click', function (e) {
88 resetData();
89 startRecord();
90 });
91 selectEl = document.getElementById('stop');
92 selectEl.addEventListener('click', function (e) {
93 stopRecord();
94 });
95 }
96
97 document.addEventListener('DOMContentLoaded', initialize, false);
98 </script>
99 </head>
100
101 <body>
102 <h1>Video Encoder API Example</h1><br>
103 This example demonstrates receiving frames from a video MediaStreamTrack and
104 encoding them in a plugin.
105 <br>
106 <input type="button" id="start" value="Start Recording"/>
107 <input type="button" id="stop" value="Stop Recording"/>
108 <br>
109 <div>
110 <embed id="plugin" type="application/x-ppapi-example-video-encode"
111 width="640" height="480"/>
112 <video id="video" width="640" height="480"/>
113 </div>
114 </body>
115 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698