update the ui, add hls player

trunk/research/players/index.html

@@ -37,5 +37,11 @@
         </div>
     </div>
 </div>
+<div class="container">
+    <hr>
+    <footer>
+        <p><a href="https://github.com/winlinvip/simple-rtmp-server">SRS Team &copy; 2013</a></p>
+    </footer>
+</div>
 </body>
 

trunk/research/players/js/srs.js

@@ -23,22 +23,50 @@ function parse_query_string(){
     return obj;
 }
 
-function build_default_url() {
+/**
+@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.
+@param stream the stream of rtmp. default to livestream.
+*/
+function build_default_rtmp_url() {
     var query = parse_query_string();
 
-    var schema = (query.schema == undefined)? "rtmp":query.schema;
     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 schema + "://" + vhost + ":" + port + "/" + app + "/" + stream;
+    return "rtmp://" + vhost + ":" + port + "/" + app + "/" + stream;
 }
 
-function srs_init(url_obj) {
+/**
+@param vhost the vhost of hls. default to window.location.hostname
+@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.
+*/
+function build_default_hls_url() {
+    var query = parse_query_string();
+
+    var vhost = (query.vhost == undefined)? window.location.hostname:query.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;
+
+    if (port == "" || port == null || port == undefined) {
+        port = 80;
+    }
+    return "http://" + vhost + ":" + port + "/" + app + "/" + stream + ".m3u8";
+}
+
+function srs_init(rtmp_url, hls_url) {
     update_nav();
     
-    if (url_obj) {
-        $(url_obj).val(build_default_url());
+    if (rtmp_url) {
+        $(rtmp_url).val(build_default_rtmp_url());
+    }
+    if (hls_url) {
+        $(hls_url).val(build_default_hls_url());
     }
 }

trunk/research/players/jwplayer6.html

@@ -13,15 +13,9 @@
         }
     </style>
     <script type="text/javascript" src="js/jwplayer.js" ></script>
-    <script>jwplayer.key="L1P3Ig76mGOK94gZ9WAAGD+Fb1VCVhoZ/Dm0fg=="</script>
+    <script type='text/javascript'>jwplayer.key = 'N8zhkmYvvRwOhz4aTGkySoEri4x+9pQwR7GHIQ=='; </script>
     <script type="text/javascript">
-        $(function(){
-            // 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"));
-            
-            $("#btn_play").click(function(){
+        function jwplayer_play(url) {
             $("#main_modal").show(function(){
                 $("#div_container").remove();
                 
@@ -34,17 +28,32 @@
                 
                 $("#player").append(obj);
                 
-                    var url = $("#txt_url").val();
-                    
                 var conf = {
                     file: url,
                     width: "530",
                     height: "300",
                     autostart: true,
+                    analytics: { enabled: false}
                 };
                 jwplayer('player_id').setup(conf);
             });
             $("#main_modal").modal({show:true, keyboard:false});
+        }
+        
+        $(function(){
+            // 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_rtmp_url", "#txt_hls_url");
+            
+            $("#btn_play_rtmp").click(function(){
+                var url = $("#txt_rtmp_url").val();
+                jwplayer_play(url);
+            });
+            
+            $("#btn_play_hls").click(function(){
+                var url = $("#txt_hls_url").val();
+                jwplayer_play(url);
             });
         });
     </script>
@@ -74,8 +83,14 @@
     </div>
     <div class="form-inline">
         URL:
-        <input type="text" id="txt_url" class="input-xxlarge" value=""></input>
-        <button class="btn" id="btn_play">播放视频</button>
+        <input type="text" id="txt_rtmp_url" class="input-xxlarge" value=""></input>
+        <button class="btn" id="btn_play_rtmp">播放RTMP</button>
+    </div>
+    <hr/>
+    <div class="form-inline">
+        URL:
+        <input type="text" id="txt_hls_url" class="input-xxlarge" value=""></input>
+        <button class="btn" id="btn_play_hls"> 播放HLS </button>
     </div>
     <div id="main_modal" class="modal hide fade">
         <div class="modal-header">
@@ -88,6 +103,10 @@
             <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 &copy; 2013</a></p>
+    </footer>
 </div>
 </body>
 

trunk/research/players/osmf.html

@@ -99,5 +99,9 @@
             <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 &copy; 2013</a></p>
+    </footer>
 </div>
 </body>

trunk/research/players/srs_bwt.html

@@ -37,5 +37,11 @@
         </div>
     </div>
 </div>
+<div class="container">
+    <hr>
+    <footer>
+        <p><a href="https://github.com/winlinvip/simple-rtmp-server">SRS Team &copy; 2013</a></p>
+    </footer>
+</div>
 </body>
 

trunk/research/players/srs_player.html

@@ -37,5 +37,11 @@
         </div>
     </div>
 </div>
+<div class="container">
+    <hr>
+    <footer>
+        <p><a href="https://github.com/winlinvip/simple-rtmp-server">SRS Team &copy; 2013</a></p>
+    </footer>
+</div>
 </body>
 

trunk/research/players/srs_publisher.html

@@ -37,5 +37,11 @@
         </div>
     </div>
 </div>
+<div class="container">
+    <hr>
+    <footer>
+        <p><a href="https://github.com/winlinvip/simple-rtmp-server">SRS Team &copy; 2013</a></p>
+    </footer>
+</div>
 </body>
 

trunk/research/players/vlc.html

@@ -41,5 +41,11 @@
 <div class="container">
     <iframe id="main_frame" width="100%" height="800" frameBorder="0"></iframe>
 </div>
+<div class="container">
+    <hr>
+    <footer>
+        <p><a href="https://github.com/winlinvip/simple-rtmp-server">SRS Team &copy; 2013</a></p>
+    </footer>
+</div>
 </body>