| | |
|---|
| | | <body> |
|---|
| | | |
|---|
| | | <!-- jessiebuca播放器 --> |
|---|
| | | <div id="jessibucaContainer"></div> |
|---|
| | | <div id="jessibucaContainer"> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <script src="../js/jquery.min.js"></script> |
|---|
| | | <script src="../js/ajax.js"></script> |
|---|
| | | <script src="../js/renderer.js"></script> |
|---|
| | | <script src="../js/jquery.min.js"></script> |
|---|
| | | <script src="../js/live/livepler.js"></script> |
|---|
| | | <script src="../js/live/liveComponent.js"></script> |
|---|
| | | |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | var video_id; |
|---|
| | | var stream_path; |
|---|
| | | |
|---|
| | | |
|---|
| | | var $play = document.getElementById('play'); |
|---|
| | | var $stop = document.getElementById('stop'); |
|---|
| | | var $close = document.getElementById('close'); |
|---|
| | | var container = document.getElementById("container"); |
|---|
| | | |
|---|
| | | var $jessibucaContainer = document.getElementById("jessibucaContainer"); |
|---|
| | | |
|---|
| | | |
|---|
| | | //入参 |
|---|
| | | let url = getQueryVariable("url"); |
|---|
| | | |
|---|
| | | var isPlaying = false; |
|---|
| | | |
|---|
| | | var h5lc = new Jessibuca({container, decoder: "../js/jessibuca/ff.js", videoBuffer: 0}); |
|---|
| | | |
|---|
| | | h5lc.onLoad = function () { |
|---|
| | | //this.play("ws://172.16.30.113:8082/live/ff80808178af424e0178af44e677000343616d657261.flv") |
|---|
| | | //this.play("ws://pull3.afb1188.com/live/" + stream + ".flv") |
|---|
| | | } |
|---|
| | | h5lc.onPlay = function () { |
|---|
| | | isPlaying = true; |
|---|
| | | $play.style.display = 'none'; |
|---|
| | | $stop.style.display = 'inline'; |
|---|
| | | } |
|---|
| | | $play.addEventListener('click', function () { |
|---|
| | | isPlaying = true; |
|---|
| | | h5lc.play("ws://172.16.30.113:8082/live/ff80808178af424e0178af44e677000343616d657261.flv") |
|---|
| | | $play.style.display = 'none'; |
|---|
| | | $stop.style.display = 'inline'; |
|---|
| | | }, false); |
|---|
| | | |
|---|
| | | $stop.addEventListener('click', function () { |
|---|
| | | if (!isPlaying) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | isPlaying = false; |
|---|
| | | //stop(); |
|---|
| | | $play.style.display = 'inline'; |
|---|
| | | $stop.style.display = 'none'; |
|---|
| | | }, false); |
|---|
| | | |
|---|
| | | $close.addEventListener('click', function () { |
|---|
| | | if (!isPlaying) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | isPlaying = false; |
|---|
| | | //stop(); |
|---|
| | | $jessibucaContainer.style.display = 'none'; |
|---|
| | | }, false); |
|---|
| | | |
|---|
| | | function stop() { |
|---|
| | | $.get("http://127.0.0.1:8088/monica/video/stop?param=live/test", function () { |
|---|
| | | h5lc.close() |
|---|
| | | } |
|---|
| | | ); |
|---|
| | | } |
|---|
| | | |
|---|
| | | function getQueryVariable(variable) { |
|---|
| | | var query = window.location.search.substring(1); |
|---|
| | | var vars = query.split("&"); |
|---|
| | | for (var i = 0; i < vars.length; i++) { |
|---|
| | | var pair = vars[i].split("="); |
|---|
| | | if (pair[0] == variable) { |
|---|
| | | return pair[1]; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | return (false); |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | //播放 |
|---|
| | | function play_video(video_id) { |
|---|
| | | windows.video_id = video_id; |
|---|
| | | $.ajax({ |
|---|
| | | type: "get", |
|---|
| | | url: "../../webapi/media/live?param=" + video_id, |
|---|
| | | timeout: 5000, |
|---|
| | | async: false, |
|---|
| | | success: function (result) { |
|---|
| | | h5lc.onLoad = function () { |
|---|
| | | this.play(result.jessica); |
|---|
| | | } |
|---|
| | | window.stream_path = result.streamPath; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | |
|---|
| | | //关闭 |
|---|
| | | function close_video(streamPath) { |
|---|
| | | jessibuca.destroy(); |
|---|
| | | if (streamPath) { |
|---|
| | | $.ajax({ |
|---|
| | | type: "get", |
|---|
| | | url: "../../webapi/media/stop?param=" + stream_path, |
|---|
| | | async: false, |
|---|
| | | success: function (result) { |
|---|
| | | $jessibucaContainer.style.display = 'none'; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | let liveComponent = new LiveComponent({ |
|---|
| | | elem: "jessibucaContainer", |
|---|
| | | cameraId: "", |
|---|
| | | rtspUrl: "rtsp://admin:abcd1234@192.168.12.211:554/Streaming/Channels/202", |
|---|
| | | }); |
|---|
| | | //关闭流 |
|---|
| | | //liveComponent.close(); |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | </body> |
|---|
