mirror of
https://github.com/ossrs/srs.git
synced 2025-03-09 15:49:59 +00:00
add srs player
This commit is contained in:
winlin
parent
b5565073ea
commit
40c1298476
6 changed files with 295 additions and 12 deletions
|
|
@ -22,15 +22,15 @@ vhost __defaultVhost__ {
|
|||
enabled on;
|
||||
gop_cache on;
|
||||
queue_length 30;
|
||||
#forward 127.0.0.1:19350;
|
||||
forward 127.0.0.1:19350;
|
||||
hls {
|
||||
enabled off;
|
||||
enabled on;
|
||||
hls_path ./objs/nginx/html;
|
||||
hls_fragment 5;
|
||||
hls_window 30;
|
||||
}
|
||||
http_hooks {
|
||||
enabled off;
|
||||
enabled on;
|
||||
on_connect http://127.0.0.1:8085/api/v1/clients;
|
||||
on_close http://127.0.0.1:8085/api/v1/clients;
|
||||
on_publish http://127.0.0.1:8085/api/v1/streams;
|
||||
|
|
@ -39,7 +39,7 @@ vhost __defaultVhost__ {
|
|||
on_stop http://127.0.0.1:8085/api/v1/sessions;
|
||||
}
|
||||
transcode {
|
||||
enabled off;
|
||||
enabled on;
|
||||
ffmpeg ./objs/ffmpeg/bin/ffmpeg;
|
||||
engine ld {
|
||||
enabled on;
|
||||
|
|
@ -94,9 +94,9 @@ vhost dev {
|
|||
enabled on;
|
||||
gop_cache on;
|
||||
queue_length 10;
|
||||
forward 127.0.0.1:19350;
|
||||
#forward 127.0.0.1:19350;
|
||||
hls {
|
||||
enabled on;
|
||||
enabled off;
|
||||
hls_path ./objs/nginx/html;
|
||||
hls_fragment 5;
|
||||
hls_window 30;
|
||||
|
|
|
|||
|
|
@ -16,7 +16,12 @@
|
|||
<script type='text/javascript'>jwplayer.key = 'N8zhkmYvvRwOhz4aTGkySoEri4x+9pQwR7GHIQ=='; </script>
|
||||
<script type="text/javascript">
|
||||
function jwplayer_play(url) {
|
||||
$("#main_modal").show(function(){
|
||||
var _player = null;
|
||||
$("#main_modal").on("hide", function(){
|
||||
$("#div_container").remove();
|
||||
_player.stop();
|
||||
});
|
||||
$("#main_modal").on("show", function(){
|
||||
$("#div_container").remove();
|
||||
|
||||
var obj = $("<div/>");
|
||||
|
|
@ -35,7 +40,7 @@
|
|||
autostart: true,
|
||||
analytics: { enabled: false}
|
||||
};
|
||||
jwplayer('player_id').setup(conf);
|
||||
_player = jwplayer('player_id').setup(conf);
|
||||
});
|
||||
$("#main_modal").modal({show:true, keyboard:false});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -21,7 +21,10 @@
|
|||
srs_init($("#txt_url"));
|
||||
|
||||
$("#btn_play").click(function(){
|
||||
$("#main_modal").show(function(){
|
||||
$("#main_modal").on("hide", function(){
|
||||
$("#div_container").remove();
|
||||
});
|
||||
$("#main_modal").on("show", function(){
|
||||
$("#div_container").remove();
|
||||
|
||||
var obj = $("<div/>");
|
||||
|
|
|
|||
|
|
@ -15,8 +15,123 @@
|
|||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function(){
|
||||
srs_init(null);
|
||||
// get the vhost and port to set the default url.
|
||||
// for example: http://192.168.1.213/players/jwplayer6.html?port=1935&vhost=demo
|
||||
// url set to: rtmp://demo:1935/live/livestream
|
||||
srs_init($("#txt_url"));
|
||||
|
||||
var srs_player = null;
|
||||
$("#main_modal").on("show", function(){
|
||||
$("#div_container").remove();
|
||||
|
||||
var obj = $("<div/>");
|
||||
$(obj).attr("id", "div_container");
|
||||
|
||||
var player = $("<div/>");
|
||||
$(obj).append(player);
|
||||
$(obj).attr("id", "player_id");
|
||||
|
||||
$("#player").append(obj);
|
||||
|
||||
var url = $("#txt_url").val();
|
||||
|
||||
srs_player = new SrsPlayer("player_id", url, 530, 300);
|
||||
srs_player.on_player_ready = function() {
|
||||
// hack the callback function, start to play the url.
|
||||
return srs_player.play();
|
||||
}
|
||||
srs_player.start();
|
||||
});
|
||||
$("#main_modal").on("hide", function(){
|
||||
srs_player.stop();
|
||||
});
|
||||
|
||||
$("#btn_play").click(on_btn_play);
|
||||
$("#btn_pause").click(function(){
|
||||
var _v = $("#btn_pause").text();
|
||||
if (_v == "暂停") {
|
||||
$("#btn_pause").text("继续");
|
||||
srs_player.pause();
|
||||
} else {
|
||||
$("#btn_pause").text("暂停");
|
||||
srs_player.resume();
|
||||
}
|
||||
});
|
||||
});
|
||||
function on_btn_play(){
|
||||
$("#main_modal").modal({show:true, keyboard:false});
|
||||
}
|
||||
|
||||
function SrsPlayer(container, stream_url, width, height) {
|
||||
if (!SrsPlayer.__id) {
|
||||
SrsPlayer.__id = 100;
|
||||
}
|
||||
if (!SrsPlayer.__players) {
|
||||
SrsPlayer.__players = [];
|
||||
}
|
||||
|
||||
SrsPlayer.__players.push(this);
|
||||
|
||||
this.container = container;
|
||||
this.stream_url = stream_url;
|
||||
this.width = width;
|
||||
this.height = height;
|
||||
this.id = SrsPlayer.__id++;
|
||||
this.callbackObj = null;
|
||||
}
|
||||
SrsPlayer.prototype.start = function() {
|
||||
// embed the flash.
|
||||
var flashvars = {};
|
||||
flashvars.id = this.id;
|
||||
flashvars.on_player_ready = "__srs_on_player_ready";
|
||||
|
||||
var params = {};
|
||||
params.allowFullScreen = true;
|
||||
|
||||
var attributes = {};
|
||||
|
||||
var self = this;
|
||||
|
||||
swfobject.embedSWF(
|
||||
"srs_player/release/srs_player.swf", this.container,
|
||||
this.width, this.height,
|
||||
"11.1", "js/AdobeFlashPlayerInstall.swf",
|
||||
flashvars, params, attributes,
|
||||
function(callbackObj){
|
||||
self.callbackObj = callbackObj;
|
||||
}
|
||||
);
|
||||
|
||||
return this;
|
||||
}
|
||||
SrsPlayer.prototype.play = function() {
|
||||
return this.callbackObj.ref.__play(this.stream_url, this.width, this.height);
|
||||
}
|
||||
SrsPlayer.prototype.stop = function() {
|
||||
return this.callbackObj.ref.__stop();
|
||||
}
|
||||
SrsPlayer.prototype.pause = function() {
|
||||
return this.callbackObj.ref.__pause();
|
||||
}
|
||||
SrsPlayer.prototype.resume = function() {
|
||||
return this.callbackObj.ref.__resume();
|
||||
}
|
||||
SrsPlayer.prototype.on_player_ready = function() {
|
||||
return this.play();
|
||||
}
|
||||
function __srs_on_player_ready(id) {
|
||||
for (var i = 0; i < SrsPlayer.__players.length; i++) {
|
||||
var player = SrsPlayer.__players[i];
|
||||
|
||||
if (player.id != id) {
|
||||
continue;
|
||||
}
|
||||
|
||||
return player.on_player_ready();
|
||||
}
|
||||
|
||||
throw new Error("player not found. id=" + id);
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
|
@ -38,10 +153,30 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="alert alert-info fade in">
|
||||
<button type="button" class="close" data-dismiss="alert">×</button>
|
||||
<strong><span>Usage:</span></strong> <span>输入地址后点击播放按钮</span>
|
||||
</div>
|
||||
<div class="form-inline">
|
||||
URL:
|
||||
<input type="text" id="txt_url" class="input-xxlarge" value=""></input>
|
||||
<button class="btn" id="btn_play">播放视频</button>
|
||||
</div>
|
||||
<div id="main_modal" class="modal hide fade">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
||||
<h3>SrsPlayer</h3>
|
||||
</div>
|
||||
<div class="modal-body" id="player">
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button id="btn_pause" class="btn">暂停</button>
|
||||
<button class="btn btn-primary" data-dismiss="modal" aria-hidden="true">关闭</button>
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
<footer>
|
||||
<p><a href="https://github.com/winlinvip/simple-rtmp-server">SRS Team © 2013</a></p>
|
||||
</footer>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
</body>
|
||||
Binary file not shown.
|
|
@ -1,11 +1,151 @@
|
|||
package
|
||||
{
|
||||
import flash.display.Sprite;
|
||||
import flash.display.StageAlign;
|
||||
import flash.display.StageScaleMode;
|
||||
import flash.events.Event;
|
||||
import flash.events.NetStatusEvent;
|
||||
import flash.external.ExternalInterface;
|
||||
import flash.media.Video;
|
||||
import flash.net.NetConnection;
|
||||
import flash.net.NetStream;
|
||||
import flash.ui.ContextMenu;
|
||||
import flash.ui.ContextMenuItem;
|
||||
import flash.utils.setTimeout;
|
||||
|
||||
public class srs_player extends Sprite
|
||||
{
|
||||
private var id:String = null;
|
||||
private var on_player_ready:String = null;
|
||||
|
||||
private var url:String = null;
|
||||
|
||||
private var conn:NetConnection = null;
|
||||
private var stream:NetStream = null;
|
||||
private var video:Video = null;
|
||||
|
||||
public function srs_player()
|
||||
{
|
||||
if (!this.stage) {
|
||||
this.addEventListener(Event.ADDED_TO_STAGE, this.onAddToStage);
|
||||
} else {
|
||||
this.onAddToStage(null);
|
||||
}
|
||||
}
|
||||
|
||||
private function onAddToStage(evt:Event):void {
|
||||
this.stage.align = StageAlign.TOP_LEFT;
|
||||
this.stage.scaleMode = StageScaleMode.NO_SCALE;
|
||||
|
||||
this.contextMenu = new ContextMenu();
|
||||
this.contextMenu.hideBuiltInItems();
|
||||
|
||||
var flashvars:Object = this.root.loaderInfo.parameters;
|
||||
|
||||
if (!flashvars.hasOwnProperty("id")) {
|
||||
throw new Error("must specifies the id");
|
||||
}
|
||||
if (!flashvars.hasOwnProperty("on_player_ready")) {
|
||||
throw new Error("must specifies the on_player_ready");
|
||||
}
|
||||
|
||||
this.id = flashvars.id;
|
||||
this.on_player_ready = flashvars.on_player_ready;
|
||||
|
||||
flash.utils.setTimeout(this.onJsReady, 0);
|
||||
}
|
||||
|
||||
private function onJsReady():void {
|
||||
if (!flash.external.ExternalInterface.available) {
|
||||
trace("js not ready, try later.");
|
||||
flash.utils.setTimeout(this.onJsReady, 100);
|
||||
return;
|
||||
}
|
||||
|
||||
flash.external.ExternalInterface.addCallback("__play", this.js_call_play);
|
||||
flash.external.ExternalInterface.addCallback("__stop", this.js_call_stop);
|
||||
flash.external.ExternalInterface.addCallback("__pause", this.js_call_pause);
|
||||
flash.external.ExternalInterface.addCallback("__resume", this.js_call_resume);
|
||||
|
||||
var code:int = flash.external.ExternalInterface.call(this.on_player_ready, this.id);
|
||||
if (code != 0) {
|
||||
throw new Error("callback on_player_ready failed. code=" + code);
|
||||
}
|
||||
}
|
||||
|
||||
public function js_call_pause():int {
|
||||
if (this.stream) {
|
||||
this.stream.pause();
|
||||
}
|
||||
return 0;
|
||||
}
|
||||
|
||||
public function js_call_resume():int {
|
||||
if (this.stream) {
|
||||
this.stream.resume();
|
||||
}
|
||||
return 0;
|
||||
}
|
||||
|
||||
public function js_call_stop():int {
|
||||
if (this.stream) {
|
||||
this.stream.close();
|
||||
this.stream = null;
|
||||
}
|
||||
if (this.conn) {
|
||||
this.conn.close();
|
||||
this.conn = null;
|
||||
}
|
||||
if (this.video) {
|
||||
this.removeChild(this.video);
|
||||
this.video = null;
|
||||
}
|
||||
|
||||
return 0;
|
||||
}
|
||||
|
||||
public function js_call_play(url:String, _width:int, _height:int):int {
|
||||
this.url = url;
|
||||
trace("start to play url: " + this.url);
|
||||
|
||||
js_call_stop();
|
||||
|
||||
this.conn = new NetConnection();
|
||||
this.conn.client = {};
|
||||
this.conn.client.onBWDone = function():void {};
|
||||
this.conn.addEventListener(NetStatusEvent.NET_STATUS, function(evt:NetStatusEvent):void {
|
||||
trace ("NetConnection: code=" + evt.info.code);
|
||||
if (evt.info.code != "NetConnection.Connect.Success") {
|
||||
return;
|
||||
}
|
||||
|
||||
stream = new NetStream(conn);
|
||||
stream.client = {};
|
||||
stream.client.onMetaData = function(metadata:Object):void {
|
||||
var customItems:Array = [new ContextMenuItem("SrsPlayer")];
|
||||
if (metadata.hasOwnProperty("server")) {
|
||||
customItems.push(new ContextMenuItem("Server: " + metadata.server));
|
||||
}
|
||||
if (metadata.hasOwnProperty("contributor")) {
|
||||
customItems.push(new ContextMenuItem("Contributor: " + metadata.contributor));
|
||||
}
|
||||
contextMenu.customItems = customItems;
|
||||
};
|
||||
stream.addEventListener(NetStatusEvent.NET_STATUS, function(evt:NetStatusEvent):void {
|
||||
trace ("NetStream: code=" + evt.info.code);
|
||||
});
|
||||
stream.play(url.substr(url.lastIndexOf("/")));
|
||||
|
||||
video = new Video();
|
||||
video.width = _width;
|
||||
video.height = _height;
|
||||
video.attachNetStream(stream);
|
||||
video.smoothing = true;
|
||||
addChild(video);
|
||||
});
|
||||
this.conn.connect(this.url.substr(0, this.url.lastIndexOf("/")));
|
||||
|
||||
return 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue