|
|
@@ -1,5 +1,4 @@
|
|
1
|
|
-jsmpeg
|
|
2
|
|
-==========
|
|
|
1
|
+# jsmpeg
|
|
3
|
2
|
|
|
4
|
3
|
#### An MPEG1 Video Decoder in JavaScript ####
|
|
5
|
4
|
|
|
|
@@ -9,7 +8,44 @@ emscripten or similar. This will probably make it obsolete with the advent of as
|
|
9
|
8
|
Some demos and more info: [phoboslab.org/log/2013/05/mpeg1-video-decoder-in-javascript](http://www.phoboslab.org/log/2013/05/mpeg1-video-decoder-in-javascript)
|
|
10
|
9
|
|
|
11
|
10
|
|
|
12
|
|
-### Usage ###
|
|
|
11
|
+## API ##
|
|
|
12
|
+
|
|
|
13
|
+
|
|
|
14
|
+### Constructor ###
|
|
|
15
|
+
|
|
|
16
|
+`var player = new jsmpeg(file [, options])`
|
|
|
17
|
+
|
|
|
18
|
+The `file` argument accepts a URL to a .mpg file or a (yet unconnected) WebSocket instance for streaming playback.
|
|
|
19
|
+
|
|
|
20
|
+The `options` argument to the `jsmpeg()` supports the following properties:
|
|
|
21
|
+
|
|
|
22
|
+- `benchmark` whether to log benchmark results to the browser's console
|
|
|
23
|
+- `canvas` the HTML Canvas element to use; jsmpeg will create its own Canvas element if none is provided
|
|
|
24
|
+- `autoplay` whether playback should start automatically after loading
|
|
|
25
|
+- `loop` whether playback is looped
|
|
|
26
|
+- `seekable` whether a seek-index is build during load time; neccessary for `seekToFrame` and `seekToTime` methods
|
|
|
27
|
+- `onload` a function that's called once, after the .mpg file has been completely loaded
|
|
|
28
|
+- `ondecodeframe` a function that's called after every frame that's decoded and rendered to the canvas
|
|
|
29
|
+- `onfinished` a function that's called when playback ends
|
|
|
30
|
+
|
|
|
31
|
+
|
|
|
32
|
+### Methods ###
|
|
|
33
|
+
|
|
|
34
|
+- `play()` begin playback
|
|
|
35
|
+- `pause()` pause playback
|
|
|
36
|
+- `stop()` stop playback and revert play position to the beginning
|
|
|
37
|
+- `seekToFrame(frame)` seek to the specified frame (Number)
|
|
|
38
|
+- `seekToTime(seconds)` seek to the specified time (Number)
|
|
|
39
|
+- `nextFrame()` if playback is paused, decode and render the next frame; returns then HTML Canvas element
|
|
|
40
|
+
|
|
|
41
|
+When live streaming, jsmpeg supports the following methods for recording the stream clientside
|
|
|
42
|
+- `canRecord()` returns `true` when streaming has started and recording can begin, `false` otherwise
|
|
|
43
|
+- `startRecording(callback)` attempts to start recording, calls the optional callback when recording started - usually when the next intraframe was received
|
|
|
44
|
+- `stopRecording()` stops recording and returns a `Blob` with the recorded .mpg data
|
|
|
45
|
+
|
|
|
46
|
+
|
|
|
47
|
+
|
|
|
48
|
+## Usage Examples ##
|
|
13
|
49
|
|
|
14
|
50
|
```javascript
|
|
15
|
51
|
// Synopsis: var player = new jsmpeg(urlToFile, options);
|
|
|
@@ -63,6 +99,8 @@ while( (frame = player.nextFrame()) ) {
|
|
63
|
99
|
}
|
|
64
|
100
|
```
|
|
65
|
101
|
|
|
|
102
|
+
|
|
|
103
|
+
|
|
66
|
104
|
### Live Streaming ###
|
|
67
|
105
|
|
|
68
|
106
|
jsmpeg supports streaming live video through WebSockets. You can use ffmpeg and a nodejs server to serve the MPEG video. See this [blog post](http://phoboslab.org/log/2013/09/html5-live-video-streaming-via-websockets) for the details of setting up a server. Also have a look at the `stream-server.js` and `stream-example.html`.
|
|
|
@@ -99,7 +137,7 @@ a.href = window.URL.createObjectURL(blob);
|
|
99
|
137
|
|
|
100
|
138
|
|
|
101
|
139
|
|
|
102
|
|
-### Limitations ###
|
|
|
140
|
+## Limitations ##
|
|
103
|
141
|
|
|
104
|
142
|
- Playback can only start when the file is fully loaded (when not streaming through WebSockets). I'm waiting for chunked XHR with ArrayBuffers to arrive in browsers.
|
|
105
|
143
|
- MPEG files with B-Frames look weird - frames are not reordered. This should be relatively easy
|