Skip to content
Toggle navigation
Toggle navigation
This project
Loading...
Sign in
brainfood
/
videojs-contrib-hls
Go to a project
Toggle navigation
Toggle navigation pinning
Projects
Groups
Snippets
Help
Project
Activity
Repository
Graphs
Network
Create a new issue
Commits
Issue Boards
Files
Commits
Network
Compare
Branches
Tags
31f3e4db
authored
2014-09-26 15:27:22 -0700
by
Simeon Bateman
Committed by
David LaPalomento
2015-07-31 16:41:56 -0400
Browse Files
Options
Browse Files
Tag
Download
Email Patches
Plain Diff
fixed conflicts, added aacstream and h264stream elements
1 parent
f239b405
Expand all
Show whitespace changes
Inline
Side-by-side
Showing
4 changed files
with
96 additions
and
31 deletions
src/transmuxer.js
test/muxer/mp4.html
test/muxer/parts.html
test/muxer/ts2/Header_boxes.json
src/transmuxer.js
View file @
31f3e4d
...
...
@@ -14,7 +14,7 @@
(
function
(
window
,
videojs
,
undefined
)
{
'use strict'
;
var
PacketStream
,
ParseStream
,
ProgramStream
,
Transmuxer
,
MP2T_PACKET_LENGTH
,
H264_STREAM_TYPE
,
ADTS_STREAM_TYPE
,
mp4
;
var
PacketStream
,
ParseStream
,
ProgramStream
,
Transmuxer
,
AacStream
,
H264Stream
,
MP2T_PACKET_LENGTH
,
H264_STREAM_TYPE
,
ADTS_STREAM_TYPE
,
mp4
;
MP2T_PACKET_LENGTH
=
188
;
// bytes
H264_STREAM_TYPE
=
0x1b
;
...
...
@@ -273,15 +273,22 @@ ProgramStream = function() {
data
:
[],
size
:
0
},
flushStream
=
function
(
stream
,
type
)
{
flushStream
=
function
(
stream
,
type
,
pes
)
{
var
event
=
{
type
:
type
,
data
:
new
Uint8Array
(
stream
.
size
)
data
:
new
Uint8Array
(
stream
.
size
)
,
},
i
=
0
,
fragment
;
// move over data from PES into Stream frame
event
.
pts
=
pes
.
pts
;
event
.
dts
=
pes
.
dts
;
event
.
pid
=
pes
.
pid
;
event
.
dataAlignmentIndicator
=
pes
.
dataAlignmentIndicator
;
event
.
payloadUnitStartIndicator
=
pes
.
payloadUnitStartIndicator
// do nothing if there is no buffered data
if
(
!
stream
.
data
.
length
)
{
return
;
...
...
@@ -323,7 +330,7 @@ ProgramStream = function() {
// if a new packet is starting, we can flush the completed
// packet
if
(
data
.
payloadUnitStartIndicator
)
{
flushStream
(
stream
,
streamType
);
flushStream
(
stream
,
streamType
,
data
);
}
// buffer this fragment until we are sure we've received the
...
...
@@ -369,28 +376,69 @@ ProgramStream = function() {
* will flush the buffered packets.
*/
this
.
end
=
function
()
{
debugger
flushStream
(
video
,
'video'
);
flushStream
(
audio
,
'audio'
);
};
};
ProgramStream
.
prototype
=
new
videojs
.
Hls
.
Stream
();
/*
* Accepts a ProgramStream and emits data events with parsed
* AAC Audio Frames of the individual packets.
*/
AacStream
=
function
()
{
var
self
;
AacStream
.
prototype
.
init
.
call
(
this
);
self
=
this
;
this
.
push
=
function
(
packet
)
{
if
(
packet
.
type
==
"audio"
)
{
console
.
log
(
'AAC Stream Push!'
);
this
.
trigger
(
'data'
,
packet
);
}
};
};
AacStream
.
prototype
=
new
videojs
.
Hls
.
Stream
();
/**
* Accepts a ProgramStream and emits data events with parsed
* AAC Audio Frames of the individual packets.
*/
H264Stream
=
function
()
{
var
self
;
H264Stream
.
prototype
.
init
.
call
(
this
);
self
=
this
;
this
.
push
=
function
(
packet
)
{
if
(
packet
.
type
==
"video"
)
{
console
.
log
(
'h264 Stream Push!'
);
this
.
trigger
(
'data'
,
packet
);
}
};
};
H264Stream
.
prototype
=
new
videojs
.
Hls
.
Stream
();
Transmuxer
=
function
()
{
var
self
=
this
,
packetStream
,
parseStream
,
programStream
;
var
self
=
this
,
packetStream
,
parseStream
,
programStream
,
aacStream
,
h264Stream
;
Transmuxer
.
prototype
.
init
.
call
(
this
);
// set up the parsing pipeline
packetStream
=
new
PacketStream
();
parseStream
=
new
ParseStream
();
programStream
=
new
ProgramStream
();
aacStream
=
new
AacStream
();
h264Stream
=
new
H264Stream
();
packetStream
.
pipe
(
parseStream
);
parseStream
.
pipe
(
programStream
);
programStream
.
pipe
(
aacStream
);
// generate an init segment
this
.
initSegment
=
mp4
.
initSegment
();
program
Stream
.
on
(
'data'
,
function
(
data
)
{
aac
Stream
.
on
(
'data'
,
function
(
data
)
{
self
.
trigger
(
'data'
,
data
);
});
...
...
@@ -411,6 +459,8 @@ window.videojs.mp2t = {
PacketStream
:
PacketStream
,
ParseStream
:
ParseStream
,
ProgramStream
:
ProgramStream
,
Transmuxer
:
Transmuxer
Transmuxer
:
Transmuxer
,
AacStream
:
AacStream
,
H264Stream
:
H264Stream
};
})(
window
,
window
.
videojs
);
...
...
test/muxer/mp4.html
View file @
31f3e4d
...
...
@@ -63,8 +63,7 @@
</div>
<div
class=
"result-wrapper"
>
<h3>
Working
</h3>
<pre
class=
"working-boxes"
>
</pre>
<pre
class=
"working-boxes"
></pre>
</div>
</section>
<section>
...
...
@@ -107,6 +106,8 @@
<script
src=
"../../src/stream.js"
></script>
<script
src=
"../../src/mp4-generator.js"
></script>
<script
src=
"../../src/transmuxer.js"
></script>
<script
src=
"../../src/flv-tag.js"
></script>
<script
src=
"../../src/exp-golomb.js"
></script>
<script
src=
"js/mp4-inspector.js"
></script>
<script
src=
"../../src/bin-utils.js"
></script>
...
...
@@ -123,6 +124,7 @@
video
=
document
.
createElement
(
'video'
),
mediaSource
=
new
MediaSource
(),
FlvTag
=
videojs
.
Hls
.
FlvTag
;
logevent
=
function
(
event
)
{
console
.
log
(
event
.
type
);
...
...
@@ -150,13 +152,17 @@
videojs
.
log
=
console
.
log
.
bind
(
console
);
original
.
addEventListener
(
'change'
,
function
()
{
var
reader
=
new
FileReader
();
var
reader
=
new
FileReader
(),
videoSegments
=
[],
audioSegments
=
[],
videoBuffer
=
[],
audioBuffer
=
[];
reader
.
addEventListener
(
'loadend'
,
function
()
{
var
segment
=
new
Uint8Array
(
reader
.
result
),
transmuxer
=
new
videojs
.
mp2t
.
Transmuxer
(),
hex
=
''
;
transmuxer
.
on
(
'data'
,
function
(
data
)
{
if
(
data
)
{
console
.
log
(
data
);
...
...
@@ -182,6 +188,8 @@
var
hex
=
''
,
bytes
=
new
Uint8Array
(
reader
.
result
);
console
.
log
(
"boxes"
,
videojs
.
inspectMp4
(
bytes
));
// clear old box info
workingBoxes
.
innerHTML
=
JSON
.
stringify
(
videojs
.
inspectMp4
(
bytes
),
null
,
' '
);
...
...
test/muxer/parts.html
View file @
31f3e4d
...
...
@@ -14,7 +14,15 @@
<link
rel=
"stylesheet"
href=
"css/main.css"
>
<script
src=
"js/vendor/modernizr-2.6.2.min.js"
></script>
<script
src=
"min-m4s.js"
></script>
<script>
window
.
videojs
=
window
.
videojs
||
{
Hls
:
{}
};
</script>
<!--<script src="min-m4s.js"></script>-->
<script
src=
"./js/mdat.js"
></script>
<script
src=
"../../src/mp4-generator.js"
></script>
</head>
<body>
<!--[if lt IE 7]>
...
...
@@ -59,7 +67,6 @@
sourceBuffer
,
video
;
function
closed
()
{
console
.
log
(
"MediaSource Closed."
);
}
...
...
@@ -69,38 +76,38 @@
if
(
done
)
{
return
;
}
console
.
log
(
"LOAD FRAGMENT"
);
/*
var req = new XMLHttpRequest();
req.responseType = "arraybuffer";
req.open("GET", "../fixtures/dash/1-avc1.42c00d.m4s", true);
*/
var
moov
=
videojs
.
mp4
.
moov
(
100
,
600
,
300
,
"video"
);
var
moof
=
videojs
.
mp4
.
moof
([{
trackId
:
1
}]);
var
frag
=
Array
.
prototype
.
slice
.
call
(
moov
);
frag
=
frag
.
concat
(
Array
.
prototype
.
slice
.
call
(
moof
));
frag
=
frag
.
concat
(
Array
.
prototype
.
slice
.
call
(
mdat
));
//req.onload = function () {
console
.
log
(
"FRAGMENT DONE LOADING"
);
sourceBuffer
.
appendBuffer
(
new
Uint8Array
(
m4s
));
sourceBuffer
.
appendBuffer
(
new
Uint8Array
(
frag
)
);
done
=
true
;
//};
/*
req.onerror = function () {
window.alert("Could not load fragment.");
};
}
function
loadMdat
(){
console
.
log
(
'mdat'
,
mdat
);
setTimeout
(
function
(){
sourceBuffer
.
appendBuffer
(
new
Uint8Amdat
);
},
0
);
req.send();
*/
}
function
loadInit
()
{
console
.
log
(
"LOAD INIT"
);
var
req
=
new
XMLHttpRequest
();
req
.
responseType
=
"arraybuffer"
;
req
.
open
(
"GET"
,
".
./fixtures/dash/init.mp4
"
,
true
);
req
.
open
(
"GET"
,
".
/ts2/Header.m4s
"
,
true
);
req
.
onload
=
function
()
{
req
.
onload
=
function
()
{
console
.
log
(
"INIT DONE LOADING"
);
sourceBuffer
.
appendBuffer
(
new
Uint8Array
(
req
.
response
));
sourceBuffer
.
addEventListener
(
'update'
,
loadFragment
);
...
...
test/muxer/ts2/Header_boxes.json
View file @
31f3e4d
This diff is collapsed.
Click to expand it.
Please
register
or
sign in
to post a comment