update the conf, add demo.srs.com, add players and players_pub, add __defaultVhost__ for rtmp

README.md

@@ -49,7 +49,7 @@ For example, use ffmpeg to publish:
     for((;;)); do \
         ./objs/ffmpeg/bin/ffmpeg -re -i ./doc/source.200kbps.768x320.flv \
         -vcodec copy -acodec copy \
-        -f flv -y rtmp://127.0.0.1/live/livestream; \
+        -f flv -y rtmp://127.0.0.1/live?vhost=demo.srs.com/livestream; \
         sleep 1; \
     done
 </pre>

trunk/conf/srs.19350.conf

@@ -3,9 +3,11 @@ chunk_size          65000;
 vhost __defaultVhost__ {
     enabled         on;
     gop_cache       on;
-    hls             on;
+    hls {
+        enabled         on;
         hls_path        ./objs/nginx/html/forward;
         hls_fragment    5;
         hls_window      30;
+    }
 }
 

trunk/conf/srs.conf

@@ -17,10 +17,17 @@ max_connections     2000;
 # vhost list, the __defaultVhost__ is the default vhost
 # for example, user use ip to access the stream: rtmp://192.168.1.2/live/livestream.
 # for which cannot identify the required vhost.
-# for default demo.
 vhost __defaultVhost__ {
     enabled         on;
     gop_cache       on;
+}
+# vhost list, the __defaultVhost__ is the default vhost
+# for example, user use ip to access the stream: rtmp://192.168.1.2/live/livestream.
+# for which cannot identify the required vhost.
+# for default demo.
+vhost demo.srs.com {
+    enabled         on;
+    gop_cache       on;
     queue_length    30;
     forward         127.0.0.1:19350;
     hls {
@@ -44,7 +51,7 @@ vhost __defaultVhost__ {
         engine ld {
             enabled         on;
             vfilter {
-                vf                  'drawtext=text=SimpleRtmpServer(SRS):x=10:y=10:fontcolor=#cccccc:fontfile=./doc/FreeSerifBold.ttf';
+                vf                  'drawtext=text=SimpleRtmpServer(SRS):x=10:y=10:fontsize=30:fontcolor=#cccccc:fontfile=./doc/FreeSerifBold.ttf';
             }
             vcodec          libx264;
             vbitrate        300;
@@ -89,6 +96,48 @@ vhost __defaultVhost__ {
         }
     }
 }
+# for the players site, to play or publish.
+# the flash player publisher need to transcode to support hls,
+# we add players_hls vhost to support it.
+vhost players {
+    enabled         on;
+    gop_cache       on;
+    transcode {
+        enabled         on;
+        ffmpeg          ./objs/ffmpeg/bin/ffmpeg;
+        engine hls {
+            enabled         on;
+            vfilter {
+                vf                  'drawtext=text=SRS(SimpleRtmpServer):x=10:y=10:fontcolor=#cccccc:fontfile=./doc/FreeSerifBold.ttf';
+            }
+            vcodec          libx264;
+            vbitrate        300;
+            vfps            20;
+            vwidth          768;
+            vheight         320;
+            vthreads        1;
+            vprofile        baseline;
+            vpreset         superfast;
+            vparams {
+            }
+            acodec          libaacplus;
+            abitrate        30;
+            asample_rate    44100;
+            achannels       2;
+            aparams {
+            }
+            output          rtmp://127.0.0.1:[port]/[app]?vhost=players_pub/[stream];
+        }
+    }
+}
+vhost players_pub {
+    hls {
+        enabled         on;
+        hls_path        ./objs/nginx/html;
+        hls_fragment    5;
+        hls_window      30;
+    }
+}
 # for development
 vhost dev {
     enabled         on;

trunk/research/players/index.html

@@ -17,7 +17,8 @@
         $(function(){
             update_nav();
             
-            window.location.href = "srs_player.html";
+            // direct to the default vhost for players.
+            window.location.href = "srs_player.html?vhost=" + srs_get_player_vhost();
         });
     </script>
 </head>
@@ -25,7 +26,7 @@
 <div class="navbar navbar-fixed-top">
     <div class="navbar-inner">
         <div class="container">
-        <a class="brand" href="#">SRS</a>
+        <a class="brand" href="index.html">SRS</a>
             <div class="nav-collapse collapse">
                 <ul class="nav">
                     <li><a id="nav_srs_player" href="srs_player.html">SRS播放器</a></li>

trunk/research/players/js/srs.js

@@ -30,13 +30,28 @@ function update_nav() {
 * parse the query string to object.
 */
 function parse_query_string(){
+    var obj = {};
+    
+    // parse the host(hostname:http_port), pathname(dir/filename)
+    obj.host = window.location.host;
+    obj.hostname = window.location.hostname;
+    obj.http_port = (window.location.port == "")? 80:window.location.port;
+    obj.pathname = window.location.pathname;
+    if (obj.pathname.lastIndexOf("/") <= 0) {
+        obj.dir = "/";
+        obj.filename = "";
+    } else {
+        obj.dir = obj.pathname.substr(0, obj.pathname.lastIndexOf("/"));
+        obj.filename = obj.pathname.substr(obj.pathname.lastIndexOf("/"));
+    }
+    
+    // parse the query string.
     var query_string = String(window.location.search).replace(" ", "").split("?")[1];
     if(query_string == undefined){
-        return {};
+        return obj;
     }
     
     var queries = query_string.split("&");
-    var obj = {};
     $(queries).each(function(){
         var query = this.split("=");
         obj[query[0]] = query[1];
@@ -46,6 +61,7 @@ function parse_query_string(){
 }
 
 /**
+@param server the ip of server. default to window.location.hostname
 @param vhost the vhost of rtmp. default to window.location.hostname
 @param port the port of rtmp. default to 1935
 @param app the app of rtmp. default to live.
@@ -54,16 +70,23 @@ function parse_query_string(){
 function build_default_rtmp_url() {
     var query = parse_query_string();
 
+    var server = (query.server == undefined)? window.location.hostname:query.server;
     var port = (query.port == undefined)? 1935:query.port;
     var vhost = (query.vhost == undefined)? window.location.hostname:query.vhost;
     var app = (query.app == undefined)? "live":query.app;
     var stream = (query.stream == undefined)? "livestream":query.stream;
 
-    return "rtmp://" + vhost + ":" + port + "/" + app + "/" + stream;
+    if (server == vhost || vhost == "") {
+        return "rtmp://" + server + ":" + port + "/" + app + "/" + stream;
+    } else {
+        return "rtmp://" + server + ":" + port + "/" + app + "...vhost..." + vhost + "/" + stream;
+    }
 }
 
 /**
+@param server the ip of server. default to window.location.hostname
 @param vhost the vhost of hls. default to window.location.hostname
+@param hls_vhost the vhost of hls. override the server if specified.
 @param hls_port the port of hls. default to window.location.port
 @param app the app of hls. default to live.
 @param stream the stream of hls. default to livestream.
@@ -71,7 +94,14 @@ function build_default_rtmp_url() {
 function build_default_hls_url() {
     var query = parse_query_string();
 
-    var vhost = (query.vhost == undefined)? window.location.hostname:query.vhost;
+    // for http, use hls_vhost to override server if specified.
+    var server = window.location.hostname;
+    if (query.server != undefined) {
+        server = query.server;
+    } else if (query.hls_vhost != undefined) {
+        server = query.hls_vhost;
+    }
+    
     var port = (query.hls_port == undefined)? window.location.port:query.hls_port;
     var app = (query.app == undefined)? "live":query.app;
     var stream = (query.stream == undefined)? "livestream":query.stream;
@@ -79,7 +109,45 @@ function build_default_hls_url() {
     if (port == "" || port == null || port == undefined) {
         port = 80;
     }
-    return "http://" + vhost + ":" + port + "/" + app + "/" + stream + ".m3u8";
+    
+    return "http://" + server + ":" + port + "/" + app + "/" + stream + ".m3u8";
+}
+
+/**
+* parse the rtmp url,
+* for example: rtmp://demo.srs.com:1935/live...vhost...players/livestream
+* @return object {server, port, vhost, app, stream}
+*/
+function srs_parse_rtmp_url(rtmp_url) {
+    // @see: http://stackoverflow.com/questions/10469575/how-to-use-location-object-to-parse-url-without-redirecting-the-page-in-javascri
+    var a = document.createElement("a");
+    a.href = rtmp_url.replace("rtmp://", "http://");
+    
+    var vhost = a.hostname;
+    var port = (a.port == "")? "1935":a.port;
+    var app = a.pathname.substr(1, a.pathname.lastIndexOf("/") - 1);
+    var stream = a.pathname.substr(a.pathname.lastIndexOf("/") + 1);
+
+    // parse the vhost in the params of app, that srs supports.
+    app = app.replace("...vhost...", "?vhost=");
+    if (app.indexOf("?") >= 0) {
+        var params = app.substr(app.indexOf("?"));
+        app = app.substr(0, app.indexOf("?"));
+        
+        if (params.indexOf("vhost=") > 0) {
+            vhost = params.substr(params.indexOf("vhost=") + "vhost=".length);
+            if (vhost.indexOf("&") > 0) {
+                vhost = vhost.substr(0, vhost.indexOf("&"));
+            }
+        }
+    }
+    
+    var ret = {
+        server: a.hostname, port: port, 
+        vhost: vhost, app: app, stream: stream
+    };
+    
+    return ret;
 }
 
 /**
@@ -91,6 +159,13 @@ function srs_get_player_height() { return srs_get_player_width() * 9 / 19; }
 
 // to query the swf anti cache.
 function srs_get_version_code() { return "1.1"; }
+// get the default vhost for players.
+function srs_get_player_vhost() { return "players"; }
+// get the stream published to vhost,
+// generally we need to transcode the stream to support HLS and filters.
+// for example, src_vhost is "players", we transcode stream to vhost "players_pub".
+// if not equals to the player vhost, return the orignal vhost.
+function srs_get_player_publish_vhost(src_vhost) { return (src_vhost != srs_get_player_vhost())? src_vhost:(src_vhost + "_pub"); }
 
 /**
 * initialize the page.

trunk/research/players/jwplayer6.html

@@ -62,6 +62,15 @@
                 _url = $("#txt_hls_url").val();
                 $("#main_modal").modal({show:true, keyboard:false});
             });
+            
+            var query = parse_query_string();
+            if (query.hls_autostart == "true") {
+                _url = $("#txt_hls_url").val();
+                $("#main_modal").modal({show:true, keyboard:false});
+            } else if (query.rtmp_autostart == "true") {
+                _url = $("#txt_rtmp_url").val();
+                $("#main_modal").modal({show:true, keyboard:false});
+            }
         });
     </script>
 </head>
@@ -69,7 +78,7 @@
 <div class="navbar navbar-fixed-top">
     <div class="navbar-inner">
         <div class="container">
-        <a class="brand" href="#">SRS</a>
+        <a class="brand" href="index.html">SRS</a>
             <div class="nav-collapse collapse">
                 <ul class="nav">
                     <li><a id="nav_srs_player" href="srs_player.html">SRS播放器</a></li>

trunk/research/players/osmf.html

@@ -74,7 +74,7 @@
 <div class="navbar navbar-fixed-top">
     <div class="navbar-inner">
         <div class="container">
-        <a class="brand" href="#">SRS</a>
+        <a class="brand" href="index.html">SRS</a>
             <div class="nav-collapse collapse">
                 <ul class="nav">
                     <li><a id="nav_srs_player" href="srs_player.html">SRS播放器</a></li>

trunk/research/players/srs_bwt.html

@@ -23,7 +23,7 @@
 <div class="navbar navbar-fixed-top">
     <div class="navbar-inner">
         <div class="container">
-        <a class="brand" href="#">SRS</a>
+        <a class="brand" href="index.html">SRS</a>
             <div class="nav-collapse collapse">
                 <ul class="nav">
                     <li><a id="nav_srs_player" href="srs_player.html">SRS播放器</a></li>

trunk/research/players/srs_player.html

@@ -26,6 +26,7 @@
     </style>
     <script type="text/javascript">
         var srs_player = null;
+        var url = null;
         
         var __active_dar = null;
         function select_dar(dar_id, num, den) {
@@ -88,8 +89,6 @@
                 $(player).attr("id", "player_id");
                 $(div_container).append(player);
                 
-                var url = $("#txt_url").val();
-                
                 srs_player = new SrsPlayer("player_id", srs_get_player_width(), srs_get_player_height());
                 srs_player.on_player_ready = function() {
                     select_buffer_time("#btn_bt_0_8", 0.8);
@@ -138,6 +137,7 @@
             });
             
             $("#btn_play").click(function(){
+                url = $("#txt_url").val();
                 $("#main_modal").modal({show:true, keyboard:false});
             });
             
@@ -151,6 +151,41 @@
                 }
             });
             
+            $("#srs_publish").click(function(){
+                url = $("#srs_publish").text();
+                $("#main_modal").modal({show:true, keyboard:false});
+            });
+            $("#srs_publish_ld").click(function(){
+                url = $("#srs_publish_ld").text();
+                $("#main_modal").modal({show:true, keyboard:false});
+            });
+            $("#srs_publish_sd").click(function(){
+                url = $("#srs_publish_sd").text();
+                $("#main_modal").modal({show:true, keyboard:false});
+            });
+            $("#srs_publish_fw").click(function(){
+                url = $("#srs_publish_fw").text();
+                $("#main_modal").modal({show:true, keyboard:false});
+            });
+            $("#srs_publish_fw_ld").click(function(){
+                url = $("#srs_publish_fw_ld").text();
+                $("#main_modal").modal({show:true, keyboard:false});
+            });
+            $("#srs_publish_fw_sd").click(function(){
+                url = $("#srs_publish_fw_sd").text();
+                $("#main_modal").modal({show:true, keyboard:false});
+            });
+            
+            var query = parse_query_string();
+            var jwplayer_url = "http://" + query.host + query.dir + "/jwplayer6.html?vhost=demo.srs.com&app=live&hls_autostart=true";
+            $("#srs_publish_hls").attr("href", jwplayer_url + "&stream=livestream");
+            $("#srs_publish_ld_hls").attr("href", jwplayer_url + "&stream=livestream_ld");
+            $("#srs_publish_sd_hls").attr("href", jwplayer_url + "&stream=livestream_sd");
+            var jwplayer_url = "http://" + query.host + query.dir + "/jwplayer6.html?vhost=demo.srs.com&app=forward/live&hls_autostart=true";
+            $("#srs_publish_fw_hls").attr("href", jwplayer_url + "&stream=livestream");
+            $("#srs_publish_fw_ld_hls").attr("href", jwplayer_url + "&stream=livestream_ld");
+            $("#srs_publish_fw_sd_hls").attr("href", jwplayer_url + "&stream=livestream_sd");
+            
             if (true) {
                 $("#btn_dar_original").click(function(){
                     select_dar("#btn_dar_original", 0, 0);
@@ -228,7 +263,7 @@
 <div class="navbar navbar-fixed-top">
     <div class="navbar-inner">
         <div class="container">
-        <a class="brand" href="#">SRS</a>
+        <a class="brand" href="index.html">SRS</a>
             <div class="nav-collapse collapse">
                 <ul class="nav">
                     <li class="active"><a id="nav_srs_player" href="srs_player.html">SRS播放器</a></li>
@@ -252,6 +287,171 @@
         <input type="text" id="txt_url" class="input-xxlarge" value=""></input>
         <button class="btn btn-primary" id="btn_play">播放视频</button>
     </div>
+    <div class="container">
+        <hr/>
+        <span>
+            注意：必须按照<a href="https://github.com/winlinvip/simple-rtmp-server/blob/master/README.md">SRS README.md</a>
+            中的11个Step做完，下面所有的链接才能观看。
+        </span>
+        <div class="accordion" id="main_accordion">
+            <div class="accordion-group">
+                <div class="accordion-heading">
+                    <span class="accordion-toggle" data-toggle="collapse" data-parent="#main_accordion" href="#collapse1">
+                        <strong>[1] SRS示例播放流: 原始流</strong>
+                    </span>
+                </div>
+                <div id="collapse1" class="accordion-body collapse">
+                    <div class="accordion-inner">
+                        <a href="#" id="srs_publish">rtmp://demo.srs.com/live/livestream</a> <br/>
+                        <span>用户推送过来的唯一一路流，经过服务器的多种变换和再转发。</span>
+                    </div>
+                </div>
+            </div>
+            <div class="accordion-group">
+                <div class="accordion-heading">
+                    <span class="accordion-toggle" data-toggle="collapse" data-parent="#main_accordion" href="#collapse10">
+                        <strong>[2] SRS示例播放流: 原始流HLS</strong>
+                    </span>
+                </div>
+                <div id="collapse10" class="accordion-body collapse">
+                    <div class="accordion-inner">
+                        <a href="#" id="srs_publish_hls">http://demo.srs.com/live/livestream.m3u8</a> <br/>
+                        <span>对用户的流进行HLS切片（若编码为非H264/AAC，HLS流会自动禁用）。</span>
+                    </div>
+                </div>
+            </div>
+            <div class="accordion-group">
+                <div class="accordion-heading">
+                    <span class="accordion-toggle" data-toggle="collapse" data-parent="#main_accordion" href="#collapse2">
+                        <strong>[3] SRS示例播放流: 转码配置LD流</strong>
+                    </span>
+                </div>
+                <div id="collapse2" class="accordion-body collapse">
+                    <div class="accordion-inner">
+                        <a href="#" id="srs_publish_ld">rtmp://demo.srs.com/live/livestream_ld</a> <br/>
+                        <span>对原始流加了<a href="http://ffmpeg.org/ffmpeg-filters.html#drawtext-1">FFMPEG文字水印</a></span>
+                    </div>
+                </div>
+            </div>
+            <div class="accordion-group">
+                <div class="accordion-heading">
+                    <span class="accordion-toggle" data-toggle="collapse" data-parent="#main_accordion" href="#collapse11">
+                        <strong>[4] SRS示例播放流: 转码配置LD流HLS</strong>
+                    </span>
+                </div>
+                <div id="collapse11" class="accordion-body collapse">
+                    <div class="accordion-inner">
+                        <a href="#" id="srs_publish_ld_hls">http://demo.srs.com/live/livestream_ld.m3u8</a> <br/>
+                        <span>对转码配置LD流进行HLS切片。</span>
+                    </div>
+                </div>
+            </div>
+            <div class="accordion-group">
+                <div class="accordion-heading">
+                    <span class="accordion-toggle" data-toggle="collapse" data-parent="#main_accordion" href="#collapse3">
+                        <strong>[5] SRS示例播放流: 转码配置SD流</strong>
+                    </span>
+                </div>
+                <div id="collapse3" class="accordion-body collapse">
+                    <div class="accordion-inner">
+                        <a href="#" id="srs_publish_sd">rtmp://demo.srs.com/live/livestream_sd</a> <br/>
+                        <span>对原始流应用了<a href="http://ffmpeg.org/ffmpeg-filters.html#Filtering-Introduction">FFMPEG翻转滤镜</a></span>
+                    </div>
+                </div>
+            </div>
+            <div class="accordion-group">
+                <div class="accordion-heading">
+                    <span class="accordion-toggle" data-toggle="collapse" data-parent="#main_accordion" href="#collapse12">
+                        <strong>[6] SRS示例播放流: 转码配置SD流HLS</strong>
+                    </span>
+                </div>
+                <div id="collapse12" class="accordion-body collapse">
+                    <div class="accordion-inner">
+                        <a href="#" id="srs_publish_sd_hls">http://demo.srs.com/live/livestream_sd.m3u8</a> <br/>
+                        <span>对转码配置SD流进行HLS切片。</span>
+                    </div>
+                </div>
+            </div>
+            <div class="accordion-group">
+                <div class="accordion-heading">
+                    <span class="accordion-toggle" data-toggle="collapse" data-parent="#main_accordion" href="#collapse4">
+                        <strong>[7] SRS示例播放流: 转发原始流</strong>
+                    </span>
+                </div>
+                <div id="collapse4" class="accordion-body collapse">
+                    <div class="accordion-inner">
+                        <a href="#" id="srs_publish_fw">rtmp://demo.srs.com:19350/live/livestream</a> <br/>
+                        <span>将用户推送的流转发到另外的vhost或服务器，做热备用。</span>
+                    </div>
+                </div>
+            </div>
+            <div class="accordion-group">
+                <div class="accordion-heading">
+                    <span class="accordion-toggle" data-toggle="collapse" data-parent="#main_accordion" href="#collapse13">
+                        <strong>[8] SRS示例播放流: 转发原始流HLS</strong>
+                    </span>
+                </div>
+                <div id="collapse13" class="accordion-body collapse">
+                    <div class="accordion-inner">
+                        <a href="#" id="srs_publish_fw_hls">http://demo.srs.com/forward/live/livestream.m3u8</a> <br/>
+                        <span>对转发原始流进行HLS切片（若编码为非H264/AAC，HLS流会自动禁用）。</span>
+                    </div>
+                </div>
+            </div>
+            <div class="accordion-group">
+                <div class="accordion-heading">
+                    <span class="accordion-toggle" data-toggle="collapse" data-parent="#main_accordion" href="#collapse5">
+                        <strong>[9] SRS示例播放流: 转发转码配置LD流</strong>
+                    </span>
+                </div>
+                <div id="collapse5" class="accordion-body collapse">
+                    <div class="accordion-inner">
+                        <a href="#" id="srs_publish_fw_ld">rtmp://demo.srs.com:19350/live/livestream_ld</a> <br/>
+                        <span>FFMPEG加水印后的流也会自动转发。</span>
+                    </div>
+                </div>
+            </div>
+            <div class="accordion-group">
+                <div class="accordion-heading">
+                    <span class="accordion-toggle" data-toggle="collapse" data-parent="#main_accordion" href="#collapse14">
+                        <strong>[10] SRS示例播放流: 转发转码配置LD流HLS</strong>
+                    </span>
+                </div>
+                <div id="collapse14" class="accordion-body collapse">
+                    <div class="accordion-inner">
+                        <a href="#" id="srs_publish_fw_ld_hls">http://demo.srs.com/forward/live/livestream_ld.m3u8</a> <br/>
+                        <span>对转发转码配置LD流进行HLS切片，所有转发的流会自动支持HLS。</span>
+                    </div>
+                </div>
+            </div>
+            <div class="accordion-group">
+                <div class="accordion-heading">
+                    <span class="accordion-toggle" data-toggle="collapse" data-parent="#main_accordion" href="#collapse6">
+                        <strong>[11] SRS示例播放流: 转发转码配置SD流</strong>
+                    </span>
+                </div>
+                <div id="collapse6" class="accordion-body collapse">
+                    <div class="accordion-inner">
+                        <a href="#" id="srs_publish_fw_sd">rtmp://demo.srs.com:19350/live/livestream_sd</a> <br/>
+                        <span>FFMPEG翻转后的流也会自动转发。</span>
+                    </div>
+                </div>
+            </div>
+            <div class="accordion-group">
+                <div class="accordion-heading">
+                    <span class="accordion-toggle" data-toggle="collapse" data-parent="#main_accordion" href="#collapse15">
+                        <strong>[12] SRS示例播放流: 转发转码配置SD流HLS</strong>
+                    </span>
+                </div>
+                <div id="collapse15" class="accordion-body collapse">
+                    <div class="accordion-inner">
+                        <a href="#" id="srs_publish_fw_sd_hls">http://demo.srs.com/forward/live/livestream_sd.m3u8</a> <br/>
+                        <span>对转发转码配置SD流进行HLS切片，所有转发的流会自动支持HLS。</span>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </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>

trunk/research/players/srs_player/src/srs_player.as

@@ -140,6 +140,7 @@ package
         private function system_on_metadata(metadata:Object):void {
             this.media_metadata = metadata;
             
+            if (metadata.hasOwnProperty("server")) {
                 // for context menu
                 var customItems:Array = [new ContextMenuItem("SrsPlayer")];
                 if (metadata.hasOwnProperty("server")) {
@@ -149,6 +150,7 @@ package
                     customItems.push(new ContextMenuItem("Contributor: " + metadata.contributor));
                 }
                 contextMenu.customItems = customItems;
+            }
             
             // for js.
             var obj:Object = __get_video_size_object();

trunk/research/players/srs_publisher.html

@@ -123,32 +123,39 @@
             remote_player.start();
         });
         
+        /**
+        * we generate the transcoded stream url for flash publish donot support HLS
+        * which requires aac, so the publish vhost maybe players for example, we
+        * use players_pub vhost(transcoded stream to which) for all clients,
+        * both players and players_pub are write HLS to the sample dir, 
+        * it's ok for the players vhost disabled the HLS, only the 
+        * players_pub enalbed HLS.
+        */
         function update_play_url() {
-            // @see: http://stackoverflow.com/questions/10469575/how-to-use-location-object-to-parse-url-without-redirecting-the-page-in-javascri
-            var a = document.createElement("a");
-            a.href = $("#txt_url").val().replace("rtmp://", "http://");
+            var ret = srs_parse_rtmp_url($("#txt_url").val());
+            var query = parse_query_string();
             
-            var url = "http://" + window.location.host;
-            url += window.location.pathname.substr(0, window.location.pathname.lastIndexOf("/"));
-            url += "/srs_player.html?";
+            var srs_player_url = "http://" + query.host + query.dir + "/srs_player.html?";
+            srs_player_url += "vhost=" + srs_get_player_publish_vhost(ret.vhost) + "&port=" + ret.port + "&app=" + ret.app + "&stream=" + ret.stream;
+            srs_player_url += "&autostart=true";
             
-            url += "vhost=" + a.hostname;
-            url += "&port=" + a.port;
-            url += "&app=" + a.pathname.substr(1, a.pathname.lastIndexOf("/") - 1);
-            url += "&stream=" + a.pathname.substr(a.pathname.lastIndexOf("/") + 1);
+            var jwplayer_url = "http://" + query.host + query.dir + "/jwplayer6.html?";
+            jwplayer_url += "vhost=" + srs_get_player_publish_vhost(ret.vhost) + "&port=" + ret.port + "&app=" + ret.app + "&stream=" + ret.stream;
+            jwplayer_url += "&hls_autostart=true";
             
-            // autostart
-            url += "&autostart=true";
+            var hls_url = "http://" + ret.server + ":" + query.http_port + "/" + ret.app + "/" + ret.stream + ".m3u8";
             
-            $("#txt_play_url").text(url);
-            $("#txt_play_url").attr("href", url);
-            $("#txt_play_url").attr("target", "_blank");
+            $("#txt_play_url").text("点击或右键复制").attr("href", srs_player_url).attr("target", "_blank");
+            $("#txt_play_hls").text("点击或右键复制").attr("href", hls_url).attr("target", "_blank");
+            $("#txt_play_jwplayer").text("点击或右键复制").attr("href", jwplayer_url).attr("target", "_blank");
         }
         function on_user_publish() {
             if ($("#btn_publish").text() == "停止发布") {
                 srs_publisher.stop();
                 $("#btn_publish").text("发布视频");
                 $("#txt_play_url").text("请发布视频").attr("href", "#").attr("target", "_self");
+                $("#txt_play_hls").text("请发布视频").attr("href", "#").attr("target", "_self");
+                $("#txt_play_jwplayer").text("请发布视频").attr("href", "#").attr("target", "_self");
                 return;
             }
             
@@ -178,8 +185,11 @@
             srs_publisher.publish(url, vcodec, acodec);
             
             // replay the url.
+            var ret = srs_parse_rtmp_url(url);
+            var pub_url = "rtmp://" + ret.server + ":" + ret.port + "/" + ret.app;
+            pub_url += "?vhost=" + srs_get_player_publish_vhost(ret.vhost) + "/" + ret.stream;
             remote_player.stop();
-            remote_player.play(url);
+            remote_player.play(pub_url);
         }
         
         function info(desc) {
@@ -198,7 +208,7 @@
 <div class="navbar navbar-fixed-top">
     <div class="navbar-inner">
         <div class="container">
-        <a class="brand" href="#">SRS</a>
+        <a class="brand" href="index.html">SRS</a>
             <div class="nav-collapse collapse">
                 <ul class="nav">
                     <li><a id="nav_srs_player" href="srs_player.html">SRS播放器</a></li>
@@ -233,10 +243,22 @@
     </div>
     <div class="control-group">
         <div class="form-inline">
-            观看地址:
+            观看地址(rtmp地址):
             <a id="txt_play_url" class="input-xxlarge" href="#">请发布视频</a>
         </div>
     </div>
+    <div class="control-group">
+        <div class="form-inline">
+            HLS地址(m3u8地址):
+            <a id="txt_play_hls" class="input-xxlarge" href="#">请发布视频</a>
+        </div>
+    </div>
+    <div class="control-group">
+        <div class="form-inline">
+            HLS地址(JWPlayer):
+            <a id="txt_play_jwplayer" class="input-xxlarge" href="#">请发布视频</a>
+        </div>
+    </div>
     <div id="video_modal" class="modal hide fade">
         <div class="modal-header">
             <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>

trunk/research/players/vlc.html

@@ -24,7 +24,7 @@
 <div class="navbar navbar-fixed-top">
     <div class="navbar-inner">
         <div class="container">
-        <a class="brand" href="#">SRS</a>
+        <a class="brand" href="index.html">SRS</a>
             <div class="nav-collapse collapse">
                 <ul class="nav">
                     <li><a id="nav_srs_player" href="srs_player.html">SRS播放器</a></li>