From 5636fc7ca2d4142482593e329728b8c487b252e5 Mon Sep 17 00:00:00 2001 From: winlin Date: Tue, 24 Dec 2013 10:29:51 +0800 Subject: [PATCH] update ui, remove the collaps of local video. --- trunk/research/players/srs_chat.html | 31 +++++++++++++----- trunk/research/players/srs_publisher.html | 40 +++++++++++++++++------ 2 files changed, 53 insertions(+), 18 deletions(-) diff --git a/trunk/research/players/srs_chat.html b/trunk/research/players/srs_chat.html index 4db93c89b..dc9e6ab89 100755 --- a/trunk/research/players/srs_chat.html +++ b/trunk/research/players/srs_chat.html @@ -28,6 +28,10 @@ // url set to: rtmp://demo:1935/live/livestream srs_init_publish("#txt_url"); + $("#realtime_player_url").tooltip({ + title: "右键复制RTMP地址" + }); + // if no play specified, donot show the player, for debug the publisher. var query = parse_query_string(); if (query.no_play == "true") { @@ -63,6 +67,8 @@ }; srs_publisher.start(); + update_play_url(); + if (!no_play) { // start the realtime player. realtime_player = new SrsPlayer("realtime_player", 430, 185); @@ -77,6 +83,12 @@ refresh(); }); + function update_play_url() { + var url = $("#txt_url").val(); + + $("#realtime_player_url").attr("href", url).attr("target", "_blank"); + } + function refresh() { if (!self_chat) { setTimeout(refresh, 1000); @@ -200,8 +212,8 @@ $(obj).attr("chat_id", chat.id); $(obj).attr("id", "div_" + chat.id); // for specifed chat: $("#div_" + chat_id) $(obj).attr("class", "div_chat"); // for all chats: $(".div_chat") - $(obj).find("#realtime_player").attr("id", "rp_" + chat.id); // for specifed player: $("#rp_" + chat_id) - $(obj).find("#realtime_player_raw").attr("id", "rp_raw_" + chat.id); // for specifed player: $("#rp_raw_" + chat_id) + $(obj).find("#chat_player").attr("id", "rp_" + chat.id); // for specifed player: $("#rp_" + chat_id) + $(obj).find("#chat_player_raw").attr("id", "rp_raw_" + chat.id); // for specifed player: $("#rp_raw_" + chat_id) $(obj).find("#user_name").text(chat.username); $(obj).find("#join_date").text(chat.join_date_str); $(obj).find("#collapseM").attr("id", "collapse_" + global_chat_user_id); @@ -456,11 +468,11 @@
- + [我的] 本地摄像头
-
+
@@ -470,11 +482,14 @@
- + [我的] 远程服务器流 + + 播放地址 +
-
+
@@ -498,8 +513,8 @@
-
-
+
+
diff --git a/trunk/research/players/srs_publisher.html b/trunk/research/players/srs_publisher.html index 451d852b2..cb3a4cae5 100755 --- a/trunk/research/players/srs_publisher.html +++ b/trunk/research/players/srs_publisher.html @@ -37,6 +37,12 @@ $("#low_latecy_tips").tooltip({ title: "服务器不转码直接转发FLASH编码器的流，所以延迟比支持HLS的流要低很多" }); + $("#realtime_player_url").tooltip({ + title: "右键复制RTMP地址" + }); + $("#remote_player_url").tooltip({ + title: "右键复制RTMP地址" + }); $("#btn_publish").click(on_user_publish); @@ -61,6 +67,8 @@ }; srs_publisher.start(); + update_play_url(); + // if no play specified, donot show the player, for debug the publisher. var query = parse_query_string(); if (query.no_play != "true") { @@ -95,6 +103,10 @@ var ret = srs_parse_rtmp_url(url); var query = parse_query_string(); + var remote_url = "rtmp://" + ret.server + ":" + ret.port + "/" + ret.app + "...vhost..." + srs_get_player_publish_vhost(ret.vhost) + "/" + ret.stream; + $("#realtime_player_url").attr("href", url).attr("target", "_blank"); + $("#remote_player_url").attr("href", remote_url).attr("target", "_blank"); + 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"; @@ -118,10 +130,12 @@ if ($("#btn_publish").text() == "停止发布") { srs_publisher.stop(); $("#btn_publish").text("发布视频"); - $("#txt_play_realtime").text("RTMP低延时(请发布视频)").attr("href", "#").attr("target", "_self"); - $("#txt_play_url").text("RTMP已转码(请发布视频)").attr("href", "#").attr("target", "_self"); - $("#txt_play_hls").text("HLS-m3u8(请发布视频)").attr("href", "#").attr("target", "_self"); - $("#txt_play_jwplayer").text("HLS-JWPlayer(请发布视频)").attr("href", "#").attr("target", "_self"); + //$("#txt_play_realtime").text("RTMP低延时(请发布视频)").attr("href", "#").attr("target", "_self"); + //$("#txt_play_realtime").attr("href", "#").attr("target", "_self"); + //$("#txt_play_url").text("RTMP已转码(请发布视频)").attr("href", "#").attr("target", "_self"); + //$("#remote_player_url").attr("href", "#").attr("target", "_self"); + //$("#txt_play_hls").text("HLS-m3u8(请发布视频)").attr("href", "#").attr("target", "_self"); + //$("#txt_play_jwplayer").text("HLS-JWPlayer(请发布视频)").attr("href", "#").attr("target", "_self"); return; } @@ -339,11 +353,11 @@
- + 本地摄像头
-
+
@@ -353,14 +367,17 @@
- + 远程服务器 黑屏 + + 播放地址 +
-
+
@@ -374,14 +391,17 @@
- + 远程服务器 低延时 + + 播放地址 +
-
+