3 files modified
9 files added
| | |
| | | |
| | | #renite famehistory info |
| | | famehistory.ip=192.168.1.120 |
| | | |
| | | #springmvc访问静态页 |
| | | spring.mvc.static-path-pattern=/public/* |
| | | |
| | |
| | | return; |
| | | } |
| | | isPlaying = true; |
| | | $.get("http://127.0.0.1:8088/monica/test/video", function (data) { |
| | | /* $.get("http://127.0.0.1:8088/monica/test/video", function (data) { |
| | | h5lc.play(data) |
| | | } |
| | | ); |
| | | //play(); |
| | | );*/ |
| | | play(); |
| | | $playDom.style.display = 'none'; |
| | | $stopDom.style.display = 'block'; |
| | | }, false); |
| | |
| | | //h5lc.play("ws://" + (firstResponseIp || source) + ":8080/live/" + stream) |
| | | //h5lc.play("ws://pull2.afb1188.com/live/" + stream + ".flv") |
| | | //h5lc.play("ws://localhost:8080/live/" + stream) |
| | | //h5lc.play("ws://localhost:8080/live/test.flv") |
| | | h5lc.play("ws://172.16.30.113:8082/live/video1.flv") |
| | | //h5lc.play("ws://localhost:8072/live/test.flv") |
| | | // h5lc.play("ws://119.9.118.39:8080/live/user1", canvas) |
| | | // h5lc.play("ws://test.qihaipi.com/gnddragon/test.flv", canvas) |
| | | // h5lc.play("ws://localhost:8080/live/test.flv", canvas) |
| New file |
| | |
| | | <!DOCTYPE html> |
| | | <html> |
| | | |
| | | <head> |
| | | <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> |
| | | <title>Jessibuca 1.0</title> |
| | | <meta charset="utf-8"/> |
| | | <style> |
| | | .btn { |
| | | display: inline-block; |
| | | line-height: 1; |
| | | white-space: nowrap; |
| | | cursor: pointer; |
| | | -webkit-appearance: none; |
| | | text-align: center; |
| | | box-sizing: border-box; |
| | | outline: none; |
| | | margin: 0; |
| | | transition: .1s; |
| | | font-weight: 500; |
| | | -moz-user-select: none; |
| | | -webkit-user-select: none; |
| | | -ms-user-select: none; |
| | | padding: 12px 20px; |
| | | font-size: 14px; |
| | | border-radius: 4px; |
| | | color: #fff; |
| | | background-color: #409eff; |
| | | border-color: #409eff; |
| | | width: 100%; |
| | | } |
| | | |
| | | .btn-danger { |
| | | color: #fff; |
| | | background-color: #f56c6c; |
| | | border-color: #f56c6c; |
| | | } |
| | | |
| | | .btn-success { |
| | | color: #fff; |
| | | background-color: #67c23a; |
| | | border-color: #67c23a; |
| | | } |
| | | |
| | | .player-wrapper { |
| | | width: 900px; |
| | | height: 500px; |
| | | /*overflow-y: auto;*/ |
| | | margin: 0 auto; |
| | | text-align: center; |
| | | } |
| | | |
| | | .btn-wrapper { |
| | | width: 900px; |
| | | height: 50px; |
| | | margin: 0 auto; |
| | | margin-top: 10px; |
| | | } |
| | | |
| | | /*.player-wrapper canvas { |
| | | width: 100%; |
| | | height: 100%; |
| | | }*/ |
| | | |
| | | .logs { |
| | | border: 1px solid #333; |
| | | width: 900px; |
| | | height: 300px; |
| | | margin: 0 auto; |
| | | overflow-y: auto; |
| | | padding: 5px; |
| | | } |
| | | </style> |
| | | </head> |
| | | |
| | | <body> |
| | | <div class="player-wrapper" id="container" style="background-color: #0D0E1B;width:900px;height:500px"> |
| | | </div> |
| | | <div class="btn-wrapper" id="playDom"> |
| | | <button class="btn" id="play">播放</button> |
| | | </div> |
| | | <div class="btn-wrapper btn-wrapper2" id="stopDom" style="display: none"> |
| | | <div style="margin-top: 5px"> |
| | | <button class="btn btn-danger" id="stop">结束</button> |
| | | </div> |
| | | </div> |
| | | <button class="btn" onclick="h5lc.fullscreen=true">全屏</button> |
| | | <div id="logout" class="logs"> |
| | | </div> |
| | | |
| | | <script src="./ajax.js"></script> |
| | | <script src="./renderer.js"></script> |
| | | <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script> |
| | | |
| | | <script> |
| | | onerror = handleErr; |
| | | var txt = ""; |
| | | window.onkeydown = function () { |
| | | h5lc.fullscreen = false |
| | | } |
| | | var $play = document.getElementById('play'); |
| | | var $stop = document.getElementById('stop'); |
| | | var $playDom = document.getElementById('playDom'); |
| | | var $stopDom = document.getElementById('stopDom'); |
| | | var container = document.getElementById("container"); |
| | | var isPlaying = false; |
| | | disabledMouseWheel(container); |
| | | let stream = queryParam('stream') || 'user1'; |
| | | let decoder = queryParam('decoder') || 'ff'; |
| | | let source = queryParam('source') || 'localhost'; |
| | | var h5lc = new Jessibuca({container, decoder: decoder + ".js", videoBuffer: 0}); |
| | | |
| | | h5lc.onLoad = function () { |
| | | //this.play("wss://pulls.1234326.cn/live/L01.flv") |
| | | //this.play("ws://localhost:8080/live/test.flv") |
| | | //this.play("ws://" + source + ":8080/live/" + stream) |
| | | //this.play("ws://pull3.afb1188.com/live/" + stream + ".flv") |
| | | //this.play("ws://pull2.afb1188.com/live/" + stream + ".flv") |
| | | } |
| | | h5lc.onPlay = function () { |
| | | isPlaying = true; |
| | | $playDom.style.display = 'none'; |
| | | $stopDom.style.display = 'block'; |
| | | } |
| | | $play.addEventListener('click', function () { |
| | | if (isPlaying) { |
| | | return; |
| | | } |
| | | isPlaying = true; |
| | | /* $.get("http://127.0.0.1:8088/monica/test/video", function (data) { |
| | | h5lc.play(data) |
| | | } |
| | | );*/ |
| | | play(); |
| | | $playDom.style.display = 'none'; |
| | | $stopDom.style.display = 'block'; |
| | | }, false); |
| | | |
| | | $stop.addEventListener('click', function () { |
| | | if (!isPlaying) { |
| | | return; |
| | | } |
| | | |
| | | isPlaying = false; |
| | | $.get("http://127.0.0.1:8088/monica/video/stop?param=live/test", function () { |
| | | alert("视频流已关闭"); |
| | | h5lc.close() |
| | | } |
| | | ); |
| | | //stop(); |
| | | |
| | | $playDom.style.display = 'block'; |
| | | $stopDom.style.display = 'none'; |
| | | }, false); |
| | | |
| | | |
| | | function play(firstResponseIp) { |
| | | //h5lc.play("ws://" + (firstResponseIp || source) + ":8080/live/" + stream) |
| | | //h5lc.play("ws://pull2.afb1188.com/live/" + stream + ".flv") |
| | | //h5lc.play("ws://localhost:8080/live/" + stream) |
| | | h5lc.play("ws://172.16.30.113:8082/live/video10.flv") |
| | | //h5lc.play("ws://localhost:8072/live/test.flv") |
| | | // h5lc.play("ws://119.9.118.39:8080/live/user1", canvas) |
| | | // h5lc.play("ws://test.qihaipi.com/gnddragon/test.flv", canvas) |
| | | // h5lc.play("ws://localhost:8080/live/test.flv", canvas) |
| | | |
| | | } |
| | | |
| | | function getFastCdnFromList(ipList) { |
| | | ipList = ipList || []; |
| | | var firstResponseIp = ''; |
| | | |
| | | for (var i = 0, len = ipList.length; i < len; i++) { |
| | | var tempIp = ipList[i].name; |
| | | var reqHref = 'http://' + tempIp + '/test'; |
| | | var request = _ajax.get(reqHref); |
| | | request.then(function (data) { |
| | | if (!firstResponseIp) { |
| | | firstResponseIp = tempIp; |
| | | // 直接可以播放了。 |
| | | play(firstResponseIp); |
| | | } |
| | | }) |
| | | } |
| | | } |
| | | |
| | | function stop() { |
| | | h5lc.close() |
| | | } |
| | | |
| | | function queryParam(name, url) { |
| | | var search = window.location.search; |
| | | var qArr = ''; |
| | | var key = {}; |
| | | |
| | | if (url) { |
| | | qArr = url.split("?")[1].split("&") |
| | | |
| | | } else { |
| | | if (!window.location.search) { |
| | | return |
| | | } |
| | | qArr = search.substr(1).split("&") |
| | | } |
| | | |
| | | for (var i = 0; i < qArr.length; i++) { |
| | | |
| | | var firstPos = qArr[i].indexOf('='); |
| | | key[qArr[i].slice(0, firstPos)] = qArr[i].slice(firstPos + 1) |
| | | } |
| | | |
| | | if (name) { |
| | | return key[name] |
| | | } else { |
| | | if (url) { |
| | | return key[name] |
| | | } else { |
| | | return key |
| | | } |
| | | } |
| | | } |
| | | |
| | | function disabledMouseWheel(ele) { |
| | | if (ele.addEventListener) { |
| | | ele.addEventListener('DOMMouseScroll', scrollFunc, false); |
| | | } //W3C |
| | | ele.onmousewheel = scrollFunc; //IE/Opera/Chrome |
| | | } |
| | | |
| | | function scrollFunc(evt) { |
| | | evt = evt || window.event; |
| | | if (evt.preventDefault) { |
| | | // Firefox |
| | | evt.preventDefault(); |
| | | evt.stopPropagation(); |
| | | } else { |
| | | // IE |
| | | evt.cancelBubble = true; |
| | | evt.returnValue = false; |
| | | } |
| | | return false; |
| | | } |
| | | |
| | | function handleErr(msg, url, l) { |
| | | txt = "There was an error on this page.\n\n"; |
| | | txt += "Error: " + msg + "\n"; |
| | | txt += "URL: " + url + "\n"; |
| | | txt += "Line: " + l + "\n\n"; |
| | | document.getElementById("logout").innerHTML += txt + "<br>"; |
| | | return true; |
| | | } |
| | | </script> |
| | | |
| | | </body> |
| | | |
| | | </html> |
| New file |
| | |
| | | <!DOCTYPE html> |
| | | <html> |
| | | |
| | | <head> |
| | | <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> |
| | | <title>Jessibuca 1.0</title> |
| | | <meta charset="utf-8"/> |
| | | <style> |
| | | .btn { |
| | | display: inline-block; |
| | | line-height: 1; |
| | | white-space: nowrap; |
| | | cursor: pointer; |
| | | -webkit-appearance: none; |
| | | text-align: center; |
| | | box-sizing: border-box; |
| | | outline: none; |
| | | margin: 0; |
| | | transition: .1s; |
| | | font-weight: 500; |
| | | -moz-user-select: none; |
| | | -webkit-user-select: none; |
| | | -ms-user-select: none; |
| | | padding: 12px 20px; |
| | | font-size: 14px; |
| | | border-radius: 4px; |
| | | color: #fff; |
| | | background-color: #409eff; |
| | | border-color: #409eff; |
| | | width: 100%; |
| | | } |
| | | |
| | | .btn-danger { |
| | | color: #fff; |
| | | background-color: #f56c6c; |
| | | border-color: #f56c6c; |
| | | } |
| | | |
| | | .btn-success { |
| | | color: #fff; |
| | | background-color: #67c23a; |
| | | border-color: #67c23a; |
| | | } |
| | | |
| | | .player-wrapper { |
| | | width: 900px; |
| | | height: 500px; |
| | | /*overflow-y: auto;*/ |
| | | margin: 0 auto; |
| | | text-align: center; |
| | | } |
| | | |
| | | .btn-wrapper { |
| | | width: 900px; |
| | | height: 50px; |
| | | margin: 0 auto; |
| | | margin-top: 10px; |
| | | } |
| | | |
| | | /*.player-wrapper canvas { |
| | | width: 100%; |
| | | height: 100%; |
| | | }*/ |
| | | |
| | | .logs { |
| | | border: 1px solid #333; |
| | | width: 900px; |
| | | height: 300px; |
| | | margin: 0 auto; |
| | | overflow-y: auto; |
| | | padding: 5px; |
| | | } |
| | | </style> |
| | | </head> |
| | | |
| | | <body> |
| | | <div class="player-wrapper" id="container" style="background-color: #0D0E1B;width:900px;height:500px"> |
| | | </div> |
| | | <div class="btn-wrapper" id="playDom"> |
| | | <button class="btn" id="play">播放</button> |
| | | </div> |
| | | <div class="btn-wrapper btn-wrapper2" id="stopDom" style="display: none"> |
| | | <div style="margin-top: 5px"> |
| | | <button class="btn btn-danger" id="stop">结束</button> |
| | | </div> |
| | | </div> |
| | | <button class="btn" onclick="h5lc.fullscreen=true">全屏</button> |
| | | <div id="logout" class="logs"> |
| | | </div> |
| | | |
| | | <script src="./ajax.js"></script> |
| | | <script src="./renderer.js"></script> |
| | | <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script> |
| | | |
| | | <script> |
| | | onerror = handleErr; |
| | | var txt = ""; |
| | | window.onkeydown = function () { |
| | | h5lc.fullscreen = false |
| | | } |
| | | var $play = document.getElementById('play'); |
| | | var $stop = document.getElementById('stop'); |
| | | var $playDom = document.getElementById('playDom'); |
| | | var $stopDom = document.getElementById('stopDom'); |
| | | var container = document.getElementById("container"); |
| | | var isPlaying = false; |
| | | disabledMouseWheel(container); |
| | | let stream = queryParam('stream') || 'user1'; |
| | | let decoder = queryParam('decoder') || 'ff'; |
| | | let source = queryParam('source') || 'localhost'; |
| | | var h5lc = new Jessibuca({container, decoder: decoder + ".js", videoBuffer: 0}); |
| | | |
| | | h5lc.onLoad = function () { |
| | | //this.play("wss://pulls.1234326.cn/live/L01.flv") |
| | | //this.play("ws://localhost:8080/live/test.flv") |
| | | //this.play("ws://" + source + ":8080/live/" + stream) |
| | | //this.play("ws://pull3.afb1188.com/live/" + stream + ".flv") |
| | | //this.play("ws://pull2.afb1188.com/live/" + stream + ".flv") |
| | | } |
| | | h5lc.onPlay = function () { |
| | | isPlaying = true; |
| | | $playDom.style.display = 'none'; |
| | | $stopDom.style.display = 'block'; |
| | | } |
| | | $play.addEventListener('click', function () { |
| | | if (isPlaying) { |
| | | return; |
| | | } |
| | | isPlaying = true; |
| | | /* $.get("http://127.0.0.1:8088/monica/test/video", function (data) { |
| | | h5lc.play(data) |
| | | } |
| | | );*/ |
| | | play(); |
| | | $playDom.style.display = 'none'; |
| | | $stopDom.style.display = 'block'; |
| | | }, false); |
| | | |
| | | $stop.addEventListener('click', function () { |
| | | if (!isPlaying) { |
| | | return; |
| | | } |
| | | |
| | | isPlaying = false; |
| | | $.get("http://127.0.0.1:8088/monica/video/stop?param=live/test", function () { |
| | | alert("视频流已关闭"); |
| | | h5lc.close() |
| | | } |
| | | ); |
| | | //stop(); |
| | | |
| | | $playDom.style.display = 'block'; |
| | | $stopDom.style.display = 'none'; |
| | | }, false); |
| | | |
| | | |
| | | function play(firstResponseIp) { |
| | | //h5lc.play("ws://" + (firstResponseIp || source) + ":8080/live/" + stream) |
| | | //h5lc.play("ws://pull2.afb1188.com/live/" + stream + ".flv") |
| | | //h5lc.play("ws://localhost:8080/live/" + stream) |
| | | h5lc.play("ws://172.16.30.113:8082/live/video2.flv") |
| | | //h5lc.play("ws://localhost:8072/live/test.flv") |
| | | // h5lc.play("ws://119.9.118.39:8080/live/user1", canvas) |
| | | // h5lc.play("ws://test.qihaipi.com/gnddragon/test.flv", canvas) |
| | | // h5lc.play("ws://localhost:8080/live/test.flv", canvas) |
| | | |
| | | } |
| | | |
| | | function getFastCdnFromList(ipList) { |
| | | ipList = ipList || []; |
| | | var firstResponseIp = ''; |
| | | |
| | | for (var i = 0, len = ipList.length; i < len; i++) { |
| | | var tempIp = ipList[i].name; |
| | | var reqHref = 'http://' + tempIp + '/test'; |
| | | var request = _ajax.get(reqHref); |
| | | request.then(function (data) { |
| | | if (!firstResponseIp) { |
| | | firstResponseIp = tempIp; |
| | | // 直接可以播放了。 |
| | | play(firstResponseIp); |
| | | } |
| | | }) |
| | | } |
| | | } |
| | | |
| | | function stop() { |
| | | h5lc.close() |
| | | } |
| | | |
| | | function queryParam(name, url) { |
| | | var search = window.location.search; |
| | | var qArr = ''; |
| | | var key = {}; |
| | | |
| | | if (url) { |
| | | qArr = url.split("?")[1].split("&") |
| | | |
| | | } else { |
| | | if (!window.location.search) { |
| | | return |
| | | } |
| | | qArr = search.substr(1).split("&") |
| | | } |
| | | |
| | | for (var i = 0; i < qArr.length; i++) { |
| | | |
| | | var firstPos = qArr[i].indexOf('='); |
| | | key[qArr[i].slice(0, firstPos)] = qArr[i].slice(firstPos + 1) |
| | | } |
| | | |
| | | if (name) { |
| | | return key[name] |
| | | } else { |
| | | if (url) { |
| | | return key[name] |
| | | } else { |
| | | return key |
| | | } |
| | | } |
| | | } |
| | | |
| | | function disabledMouseWheel(ele) { |
| | | if (ele.addEventListener) { |
| | | ele.addEventListener('DOMMouseScroll', scrollFunc, false); |
| | | } //W3C |
| | | ele.onmousewheel = scrollFunc; //IE/Opera/Chrome |
| | | } |
| | | |
| | | function scrollFunc(evt) { |
| | | evt = evt || window.event; |
| | | if (evt.preventDefault) { |
| | | // Firefox |
| | | evt.preventDefault(); |
| | | evt.stopPropagation(); |
| | | } else { |
| | | // IE |
| | | evt.cancelBubble = true; |
| | | evt.returnValue = false; |
| | | } |
| | | return false; |
| | | } |
| | | |
| | | function handleErr(msg, url, l) { |
| | | txt = "There was an error on this page.\n\n"; |
| | | txt += "Error: " + msg + "\n"; |
| | | txt += "URL: " + url + "\n"; |
| | | txt += "Line: " + l + "\n\n"; |
| | | document.getElementById("logout").innerHTML += txt + "<br>"; |
| | | return true; |
| | | } |
| | | </script> |
| | | |
| | | </body> |
| | | |
| | | </html> |
| New file |
| | |
| | | <!DOCTYPE html> |
| | | <html> |
| | | |
| | | <head> |
| | | <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> |
| | | <title>Jessibuca 1.0</title> |
| | | <meta charset="utf-8"/> |
| | | <style> |
| | | .btn { |
| | | display: inline-block; |
| | | line-height: 1; |
| | | white-space: nowrap; |
| | | cursor: pointer; |
| | | -webkit-appearance: none; |
| | | text-align: center; |
| | | box-sizing: border-box; |
| | | outline: none; |
| | | margin: 0; |
| | | transition: .1s; |
| | | font-weight: 500; |
| | | -moz-user-select: none; |
| | | -webkit-user-select: none; |
| | | -ms-user-select: none; |
| | | padding: 12px 20px; |
| | | font-size: 14px; |
| | | border-radius: 4px; |
| | | color: #fff; |
| | | background-color: #409eff; |
| | | border-color: #409eff; |
| | | width: 100%; |
| | | } |
| | | |
| | | .btn-danger { |
| | | color: #fff; |
| | | background-color: #f56c6c; |
| | | border-color: #f56c6c; |
| | | } |
| | | |
| | | .btn-success { |
| | | color: #fff; |
| | | background-color: #67c23a; |
| | | border-color: #67c23a; |
| | | } |
| | | |
| | | .player-wrapper { |
| | | width: 900px; |
| | | height: 500px; |
| | | /*overflow-y: auto;*/ |
| | | margin: 0 auto; |
| | | text-align: center; |
| | | } |
| | | |
| | | .btn-wrapper { |
| | | width: 900px; |
| | | height: 50px; |
| | | margin: 0 auto; |
| | | margin-top: 10px; |
| | | } |
| | | |
| | | /*.player-wrapper canvas { |
| | | width: 100%; |
| | | height: 100%; |
| | | }*/ |
| | | |
| | | .logs { |
| | | border: 1px solid #333; |
| | | width: 900px; |
| | | height: 300px; |
| | | margin: 0 auto; |
| | | overflow-y: auto; |
| | | padding: 5px; |
| | | } |
| | | </style> |
| | | </head> |
| | | |
| | | <body> |
| | | <div class="player-wrapper" id="container" style="background-color: #0D0E1B;width:900px;height:500px"> |
| | | </div> |
| | | <div class="btn-wrapper" id="playDom"> |
| | | <button class="btn" id="play">播放</button> |
| | | </div> |
| | | <div class="btn-wrapper btn-wrapper2" id="stopDom" style="display: none"> |
| | | <div style="margin-top: 5px"> |
| | | <button class="btn btn-danger" id="stop">结束</button> |
| | | </div> |
| | | </div> |
| | | <button class="btn" onclick="h5lc.fullscreen=true">全屏</button> |
| | | <div id="logout" class="logs"> |
| | | </div> |
| | | |
| | | <script src="./ajax.js"></script> |
| | | <script src="./renderer.js"></script> |
| | | <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script> |
| | | |
| | | <script> |
| | | onerror = handleErr; |
| | | var txt = ""; |
| | | window.onkeydown = function () { |
| | | h5lc.fullscreen = false |
| | | } |
| | | var $play = document.getElementById('play'); |
| | | var $stop = document.getElementById('stop'); |
| | | var $playDom = document.getElementById('playDom'); |
| | | var $stopDom = document.getElementById('stopDom'); |
| | | var container = document.getElementById("container"); |
| | | var isPlaying = false; |
| | | disabledMouseWheel(container); |
| | | let stream = queryParam('stream') || 'user1'; |
| | | let decoder = queryParam('decoder') || 'ff'; |
| | | let source = queryParam('source') || 'localhost'; |
| | | var h5lc = new Jessibuca({container, decoder: decoder + ".js", videoBuffer: 0}); |
| | | |
| | | h5lc.onLoad = function () { |
| | | //this.play("wss://pulls.1234326.cn/live/L01.flv") |
| | | //this.play("ws://localhost:8080/live/test.flv") |
| | | //this.play("ws://" + source + ":8080/live/" + stream) |
| | | //this.play("ws://pull3.afb1188.com/live/" + stream + ".flv") |
| | | //this.play("ws://pull2.afb1188.com/live/" + stream + ".flv") |
| | | } |
| | | h5lc.onPlay = function () { |
| | | isPlaying = true; |
| | | $playDom.style.display = 'none'; |
| | | $stopDom.style.display = 'block'; |
| | | } |
| | | $play.addEventListener('click', function () { |
| | | if (isPlaying) { |
| | | return; |
| | | } |
| | | isPlaying = true; |
| | | /* $.get("http://127.0.0.1:8088/monica/test/video", function (data) { |
| | | h5lc.play(data) |
| | | } |
| | | );*/ |
| | | play(); |
| | | $playDom.style.display = 'none'; |
| | | $stopDom.style.display = 'block'; |
| | | }, false); |
| | | |
| | | $stop.addEventListener('click', function () { |
| | | if (!isPlaying) { |
| | | return; |
| | | } |
| | | |
| | | isPlaying = false; |
| | | $.get("http://127.0.0.1:8088/monica/video/stop?param=live/test", function () { |
| | | alert("视频流已关闭"); |
| | | h5lc.close() |
| | | } |
| | | ); |
| | | //stop(); |
| | | |
| | | $playDom.style.display = 'block'; |
| | | $stopDom.style.display = 'none'; |
| | | }, false); |
| | | |
| | | |
| | | function play(firstResponseIp) { |
| | | //h5lc.play("ws://" + (firstResponseIp || source) + ":8080/live/" + stream) |
| | | //h5lc.play("ws://pull2.afb1188.com/live/" + stream + ".flv") |
| | | //h5lc.play("ws://localhost:8080/live/" + stream) |
| | | h5lc.play("ws://172.16.30.113:8082/live/video3.flv") |
| | | //h5lc.play("ws://localhost:8072/live/test.flv") |
| | | // h5lc.play("ws://119.9.118.39:8080/live/user1", canvas) |
| | | // h5lc.play("ws://test.qihaipi.com/gnddragon/test.flv", canvas) |
| | | // h5lc.play("ws://localhost:8080/live/test.flv", canvas) |
| | | |
| | | } |
| | | |
| | | function getFastCdnFromList(ipList) { |
| | | ipList = ipList || []; |
| | | var firstResponseIp = ''; |
| | | |
| | | for (var i = 0, len = ipList.length; i < len; i++) { |
| | | var tempIp = ipList[i].name; |
| | | var reqHref = 'http://' + tempIp + '/test'; |
| | | var request = _ajax.get(reqHref); |
| | | request.then(function (data) { |
| | | if (!firstResponseIp) { |
| | | firstResponseIp = tempIp; |
| | | // 直接可以播放了。 |
| | | play(firstResponseIp); |
| | | } |
| | | }) |
| | | } |
| | | } |
| | | |
| | | function stop() { |
| | | h5lc.close() |
| | | } |
| | | |
| | | function queryParam(name, url) { |
| | | var search = window.location.search; |
| | | var qArr = ''; |
| | | var key = {}; |
| | | |
| | | if (url) { |
| | | qArr = url.split("?")[1].split("&") |
| | | |
| | | } else { |
| | | if (!window.location.search) { |
| | | return |
| | | } |
| | | qArr = search.substr(1).split("&") |
| | | } |
| | | |
| | | for (var i = 0; i < qArr.length; i++) { |
| | | |
| | | var firstPos = qArr[i].indexOf('='); |
| | | key[qArr[i].slice(0, firstPos)] = qArr[i].slice(firstPos + 1) |
| | | } |
| | | |
| | | if (name) { |
| | | return key[name] |
| | | } else { |
| | | if (url) { |
| | | return key[name] |
| | | } else { |
| | | return key |
| | | } |
| | | } |
| | | } |
| | | |
| | | function disabledMouseWheel(ele) { |
| | | if (ele.addEventListener) { |
| | | ele.addEventListener('DOMMouseScroll', scrollFunc, false); |
| | | } //W3C |
| | | ele.onmousewheel = scrollFunc; //IE/Opera/Chrome |
| | | } |
| | | |
| | | function scrollFunc(evt) { |
| | | evt = evt || window.event; |
| | | if (evt.preventDefault) { |
| | | // Firefox |
| | | evt.preventDefault(); |
| | | evt.stopPropagation(); |
| | | } else { |
| | | // IE |
| | | evt.cancelBubble = true; |
| | | evt.returnValue = false; |
| | | } |
| | | return false; |
| | | } |
| | | |
| | | function handleErr(msg, url, l) { |
| | | txt = "There was an error on this page.\n\n"; |
| | | txt += "Error: " + msg + "\n"; |
| | | txt += "URL: " + url + "\n"; |
| | | txt += "Line: " + l + "\n\n"; |
| | | document.getElementById("logout").innerHTML += txt + "<br>"; |
| | | return true; |
| | | } |
| | | </script> |
| | | |
| | | </body> |
| | | |
| | | </html> |
| New file |
| | |
| | | <!DOCTYPE html> |
| | | <html> |
| | | |
| | | <head> |
| | | <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> |
| | | <title>Jessibuca 1.0</title> |
| | | <meta charset="utf-8"/> |
| | | <style> |
| | | .btn { |
| | | display: inline-block; |
| | | line-height: 1; |
| | | white-space: nowrap; |
| | | cursor: pointer; |
| | | -webkit-appearance: none; |
| | | text-align: center; |
| | | box-sizing: border-box; |
| | | outline: none; |
| | | margin: 0; |
| | | transition: .1s; |
| | | font-weight: 500; |
| | | -moz-user-select: none; |
| | | -webkit-user-select: none; |
| | | -ms-user-select: none; |
| | | padding: 12px 20px; |
| | | font-size: 14px; |
| | | border-radius: 4px; |
| | | color: #fff; |
| | | background-color: #409eff; |
| | | border-color: #409eff; |
| | | width: 100%; |
| | | } |
| | | |
| | | .btn-danger { |
| | | color: #fff; |
| | | background-color: #f56c6c; |
| | | border-color: #f56c6c; |
| | | } |
| | | |
| | | .btn-success { |
| | | color: #fff; |
| | | background-color: #67c23a; |
| | | border-color: #67c23a; |
| | | } |
| | | |
| | | .player-wrapper { |
| | | width: 900px; |
| | | height: 500px; |
| | | /*overflow-y: auto;*/ |
| | | margin: 0 auto; |
| | | text-align: center; |
| | | } |
| | | |
| | | .btn-wrapper { |
| | | width: 900px; |
| | | height: 50px; |
| | | margin: 0 auto; |
| | | margin-top: 10px; |
| | | } |
| | | |
| | | /*.player-wrapper canvas { |
| | | width: 100%; |
| | | height: 100%; |
| | | }*/ |
| | | |
| | | .logs { |
| | | border: 1px solid #333; |
| | | width: 900px; |
| | | height: 300px; |
| | | margin: 0 auto; |
| | | overflow-y: auto; |
| | | padding: 5px; |
| | | } |
| | | </style> |
| | | </head> |
| | | |
| | | <body> |
| | | <div class="player-wrapper" id="container" style="background-color: #0D0E1B;width:900px;height:500px"> |
| | | </div> |
| | | <div class="btn-wrapper" id="playDom"> |
| | | <button class="btn" id="play">播放</button> |
| | | </div> |
| | | <div class="btn-wrapper btn-wrapper2" id="stopDom" style="display: none"> |
| | | <div style="margin-top: 5px"> |
| | | <button class="btn btn-danger" id="stop">结束</button> |
| | | </div> |
| | | </div> |
| | | <button class="btn" onclick="h5lc.fullscreen=true">全屏</button> |
| | | <div id="logout" class="logs"> |
| | | </div> |
| | | |
| | | <script src="./ajax.js"></script> |
| | | <script src="./renderer.js"></script> |
| | | <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script> |
| | | |
| | | <script> |
| | | onerror = handleErr; |
| | | var txt = ""; |
| | | window.onkeydown = function () { |
| | | h5lc.fullscreen = false |
| | | } |
| | | var $play = document.getElementById('play'); |
| | | var $stop = document.getElementById('stop'); |
| | | var $playDom = document.getElementById('playDom'); |
| | | var $stopDom = document.getElementById('stopDom'); |
| | | var container = document.getElementById("container"); |
| | | var isPlaying = false; |
| | | disabledMouseWheel(container); |
| | | let stream = queryParam('stream') || 'user1'; |
| | | let decoder = queryParam('decoder') || 'ff'; |
| | | let source = queryParam('source') || 'localhost'; |
| | | var h5lc = new Jessibuca({container, decoder: decoder + ".js", videoBuffer: 0}); |
| | | |
| | | h5lc.onLoad = function () { |
| | | //this.play("wss://pulls.1234326.cn/live/L01.flv") |
| | | //this.play("ws://localhost:8080/live/test.flv") |
| | | //this.play("ws://" + source + ":8080/live/" + stream) |
| | | //this.play("ws://pull3.afb1188.com/live/" + stream + ".flv") |
| | | //this.play("ws://pull2.afb1188.com/live/" + stream + ".flv") |
| | | } |
| | | h5lc.onPlay = function () { |
| | | isPlaying = true; |
| | | $playDom.style.display = 'none'; |
| | | $stopDom.style.display = 'block'; |
| | | } |
| | | $play.addEventListener('click', function () { |
| | | if (isPlaying) { |
| | | return; |
| | | } |
| | | isPlaying = true; |
| | | /* $.get("http://127.0.0.1:8088/monica/test/video", function (data) { |
| | | h5lc.play(data) |
| | | } |
| | | );*/ |
| | | play(); |
| | | $playDom.style.display = 'none'; |
| | | $stopDom.style.display = 'block'; |
| | | }, false); |
| | | |
| | | $stop.addEventListener('click', function () { |
| | | if (!isPlaying) { |
| | | return; |
| | | } |
| | | |
| | | isPlaying = false; |
| | | $.get("http://127.0.0.1:8088/monica/video/stop?param=live/test", function () { |
| | | alert("视频流已关闭"); |
| | | h5lc.close() |
| | | } |
| | | ); |
| | | //stop(); |
| | | |
| | | $playDom.style.display = 'block'; |
| | | $stopDom.style.display = 'none'; |
| | | }, false); |
| | | |
| | | |
| | | function play(firstResponseIp) { |
| | | //h5lc.play("ws://" + (firstResponseIp || source) + ":8080/live/" + stream) |
| | | //h5lc.play("ws://pull2.afb1188.com/live/" + stream + ".flv") |
| | | //h5lc.play("ws://localhost:8080/live/" + stream) |
| | | h5lc.play("ws://172.16.30.113:8082/live/video4.flv") |
| | | //h5lc.play("ws://localhost:8072/live/test.flv") |
| | | // h5lc.play("ws://119.9.118.39:8080/live/user1", canvas) |
| | | // h5lc.play("ws://test.qihaipi.com/gnddragon/test.flv", canvas) |
| | | // h5lc.play("ws://localhost:8080/live/test.flv", canvas) |
| | | |
| | | } |
| | | |
| | | function getFastCdnFromList(ipList) { |
| | | ipList = ipList || []; |
| | | var firstResponseIp = ''; |
| | | |
| | | for (var i = 0, len = ipList.length; i < len; i++) { |
| | | var tempIp = ipList[i].name; |
| | | var reqHref = 'http://' + tempIp + '/test'; |
| | | var request = _ajax.get(reqHref); |
| | | request.then(function (data) { |
| | | if (!firstResponseIp) { |
| | | firstResponseIp = tempIp; |
| | | // 直接可以播放了。 |
| | | play(firstResponseIp); |
| | | } |
| | | }) |
| | | } |
| | | } |
| | | |
| | | function stop() { |
| | | h5lc.close() |
| | | } |
| | | |
| | | function queryParam(name, url) { |
| | | var search = window.location.search; |
| | | var qArr = ''; |
| | | var key = {}; |
| | | |
| | | if (url) { |
| | | qArr = url.split("?")[1].split("&") |
| | | |
| | | } else { |
| | | if (!window.location.search) { |
| | | return |
| | | } |
| | | qArr = search.substr(1).split("&") |
| | | } |
| | | |
| | | for (var i = 0; i < qArr.length; i++) { |
| | | |
| | | var firstPos = qArr[i].indexOf('='); |
| | | key[qArr[i].slice(0, firstPos)] = qArr[i].slice(firstPos + 1) |
| | | } |
| | | |
| | | if (name) { |
| | | return key[name] |
| | | } else { |
| | | if (url) { |
| | | return key[name] |
| | | } else { |
| | | return key |
| | | } |
| | | } |
| | | } |
| | | |
| | | function disabledMouseWheel(ele) { |
| | | if (ele.addEventListener) { |
| | | ele.addEventListener('DOMMouseScroll', scrollFunc, false); |
| | | } //W3C |
| | | ele.onmousewheel = scrollFunc; //IE/Opera/Chrome |
| | | } |
| | | |
| | | function scrollFunc(evt) { |
| | | evt = evt || window.event; |
| | | if (evt.preventDefault) { |
| | | // Firefox |
| | | evt.preventDefault(); |
| | | evt.stopPropagation(); |
| | | } else { |
| | | // IE |
| | | evt.cancelBubble = true; |
| | | evt.returnValue = false; |
| | | } |
| | | return false; |
| | | } |
| | | |
| | | function handleErr(msg, url, l) { |
| | | txt = "There was an error on this page.\n\n"; |
| | | txt += "Error: " + msg + "\n"; |
| | | txt += "URL: " + url + "\n"; |
| | | txt += "Line: " + l + "\n\n"; |
| | | document.getElementById("logout").innerHTML += txt + "<br>"; |
| | | return true; |
| | | } |
| | | </script> |
| | | |
| | | </body> |
| | | |
| | | </html> |
| New file |
| | |
| | | <!DOCTYPE html> |
| | | <html> |
| | | |
| | | <head> |
| | | <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> |
| | | <title>Jessibuca 1.0</title> |
| | | <meta charset="utf-8"/> |
| | | <style> |
| | | .btn { |
| | | display: inline-block; |
| | | line-height: 1; |
| | | white-space: nowrap; |
| | | cursor: pointer; |
| | | -webkit-appearance: none; |
| | | text-align: center; |
| | | box-sizing: border-box; |
| | | outline: none; |
| | | margin: 0; |
| | | transition: .1s; |
| | | font-weight: 500; |
| | | -moz-user-select: none; |
| | | -webkit-user-select: none; |
| | | -ms-user-select: none; |
| | | padding: 12px 20px; |
| | | font-size: 14px; |
| | | border-radius: 4px; |
| | | color: #fff; |
| | | background-color: #409eff; |
| | | border-color: #409eff; |
| | | width: 100%; |
| | | } |
| | | |
| | | .btn-danger { |
| | | color: #fff; |
| | | background-color: #f56c6c; |
| | | border-color: #f56c6c; |
| | | } |
| | | |
| | | .btn-success { |
| | | color: #fff; |
| | | background-color: #67c23a; |
| | | border-color: #67c23a; |
| | | } |
| | | |
| | | .player-wrapper { |
| | | width: 900px; |
| | | height: 500px; |
| | | /*overflow-y: auto;*/ |
| | | margin: 0 auto; |
| | | text-align: center; |
| | | } |
| | | |
| | | .btn-wrapper { |
| | | width: 900px; |
| | | height: 50px; |
| | | margin: 0 auto; |
| | | margin-top: 10px; |
| | | } |
| | | |
| | | /*.player-wrapper canvas { |
| | | width: 100%; |
| | | height: 100%; |
| | | }*/ |
| | | |
| | | .logs { |
| | | border: 1px solid #333; |
| | | width: 900px; |
| | | height: 300px; |
| | | margin: 0 auto; |
| | | overflow-y: auto; |
| | | padding: 5px; |
| | | } |
| | | </style> |
| | | </head> |
| | | |
| | | <body> |
| | | <div class="player-wrapper" id="container" style="background-color: #0D0E1B;width:900px;height:500px"> |
| | | </div> |
| | | <div class="btn-wrapper" id="playDom"> |
| | | <button class="btn" id="play">播放</button> |
| | | </div> |
| | | <div class="btn-wrapper btn-wrapper2" id="stopDom" style="display: none"> |
| | | <div style="margin-top: 5px"> |
| | | <button class="btn btn-danger" id="stop">结束</button> |
| | | </div> |
| | | </div> |
| | | <button class="btn" onclick="h5lc.fullscreen=true">全屏</button> |
| | | <div id="logout" class="logs"> |
| | | </div> |
| | | |
| | | <script src="./ajax.js"></script> |
| | | <script src="./renderer.js"></script> |
| | | <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script> |
| | | |
| | | <script> |
| | | onerror = handleErr; |
| | | var txt = ""; |
| | | window.onkeydown = function () { |
| | | h5lc.fullscreen = false |
| | | } |
| | | var $play = document.getElementById('play'); |
| | | var $stop = document.getElementById('stop'); |
| | | var $playDom = document.getElementById('playDom'); |
| | | var $stopDom = document.getElementById('stopDom'); |
| | | var container = document.getElementById("container"); |
| | | var isPlaying = false; |
| | | disabledMouseWheel(container); |
| | | let stream = queryParam('stream') || 'user1'; |
| | | let decoder = queryParam('decoder') || 'ff'; |
| | | let source = queryParam('source') || 'localhost'; |
| | | var h5lc = new Jessibuca({container, decoder: decoder + ".js", videoBuffer: 0}); |
| | | |
| | | h5lc.onLoad = function () { |
| | | //this.play("wss://pulls.1234326.cn/live/L01.flv") |
| | | //this.play("ws://localhost:8080/live/test.flv") |
| | | //this.play("ws://" + source + ":8080/live/" + stream) |
| | | //this.play("ws://pull3.afb1188.com/live/" + stream + ".flv") |
| | | //this.play("ws://pull2.afb1188.com/live/" + stream + ".flv") |
| | | } |
| | | h5lc.onPlay = function () { |
| | | isPlaying = true; |
| | | $playDom.style.display = 'none'; |
| | | $stopDom.style.display = 'block'; |
| | | } |
| | | $play.addEventListener('click', function () { |
| | | if (isPlaying) { |
| | | return; |
| | | } |
| | | isPlaying = true; |
| | | /* $.get("http://127.0.0.1:8088/monica/test/video", function (data) { |
| | | h5lc.play(data) |
| | | } |
| | | );*/ |
| | | play(); |
| | | $playDom.style.display = 'none'; |
| | | $stopDom.style.display = 'block'; |
| | | }, false); |
| | | |
| | | $stop.addEventListener('click', function () { |
| | | if (!isPlaying) { |
| | | return; |
| | | } |
| | | |
| | | isPlaying = false; |
| | | $.get("http://127.0.0.1:8088/monica/video/stop?param=live/test", function () { |
| | | alert("视频流已关闭"); |
| | | h5lc.close() |
| | | } |
| | | ); |
| | | //stop(); |
| | | |
| | | $playDom.style.display = 'block'; |
| | | $stopDom.style.display = 'none'; |
| | | }, false); |
| | | |
| | | |
| | | function play(firstResponseIp) { |
| | | //h5lc.play("ws://" + (firstResponseIp || source) + ":8080/live/" + stream) |
| | | //h5lc.play("ws://pull2.afb1188.com/live/" + stream + ".flv") |
| | | //h5lc.play("ws://localhost:8080/live/" + stream) |
| | | h5lc.play("ws://172.16.30.113:8082/live/video5.flv") |
| | | //h5lc.play("ws://localhost:8072/live/test.flv") |
| | | // h5lc.play("ws://119.9.118.39:8080/live/user1", canvas) |
| | | // h5lc.play("ws://test.qihaipi.com/gnddragon/test.flv", canvas) |
| | | // h5lc.play("ws://localhost:8080/live/test.flv", canvas) |
| | | |
| | | } |
| | | |
| | | function getFastCdnFromList(ipList) { |
| | | ipList = ipList || []; |
| | | var firstResponseIp = ''; |
| | | |
| | | for (var i = 0, len = ipList.length; i < len; i++) { |
| | | var tempIp = ipList[i].name; |
| | | var reqHref = 'http://' + tempIp + '/test'; |
| | | var request = _ajax.get(reqHref); |
| | | request.then(function (data) { |
| | | if (!firstResponseIp) { |
| | | firstResponseIp = tempIp; |
| | | // 直接可以播放了。 |
| | | play(firstResponseIp); |
| | | } |
| | | }) |
| | | } |
| | | } |
| | | |
| | | function stop() { |
| | | h5lc.close() |
| | | } |
| | | |
| | | function queryParam(name, url) { |
| | | var search = window.location.search; |
| | | var qArr = ''; |
| | | var key = {}; |
| | | |
| | | if (url) { |
| | | qArr = url.split("?")[1].split("&") |
| | | |
| | | } else { |
| | | if (!window.location.search) { |
| | | return |
| | | } |
| | | qArr = search.substr(1).split("&") |
| | | } |
| | | |
| | | for (var i = 0; i < qArr.length; i++) { |
| | | |
| | | var firstPos = qArr[i].indexOf('='); |
| | | key[qArr[i].slice(0, firstPos)] = qArr[i].slice(firstPos + 1) |
| | | } |
| | | |
| | | if (name) { |
| | | return key[name] |
| | | } else { |
| | | if (url) { |
| | | return key[name] |
| | | } else { |
| | | return key |
| | | } |
| | | } |
| | | } |
| | | |
| | | function disabledMouseWheel(ele) { |
| | | if (ele.addEventListener) { |
| | | ele.addEventListener('DOMMouseScroll', scrollFunc, false); |
| | | } //W3C |
| | | ele.onmousewheel = scrollFunc; //IE/Opera/Chrome |
| | | } |
| | | |
| | | function scrollFunc(evt) { |
| | | evt = evt || window.event; |
| | | if (evt.preventDefault) { |
| | | // Firefox |
| | | evt.preventDefault(); |
| | | evt.stopPropagation(); |
| | | } else { |
| | | // IE |
| | | evt.cancelBubble = true; |
| | | evt.returnValue = false; |
| | | } |
| | | return false; |
| | | } |
| | | |
| | | function handleErr(msg, url, l) { |
| | | txt = "There was an error on this page.\n\n"; |
| | | txt += "Error: " + msg + "\n"; |
| | | txt += "URL: " + url + "\n"; |
| | | txt += "Line: " + l + "\n\n"; |
| | | document.getElementById("logout").innerHTML += txt + "<br>"; |
| | | return true; |
| | | } |
| | | </script> |
| | | |
| | | </body> |
| | | |
| | | </html> |
| New file |
| | |
| | | <!DOCTYPE html> |
| | | <html> |
| | | |
| | | <head> |
| | | <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> |
| | | <title>Jessibuca 1.0</title> |
| | | <meta charset="utf-8"/> |
| | | <style> |
| | | .btn { |
| | | display: inline-block; |
| | | line-height: 1; |
| | | white-space: nowrap; |
| | | cursor: pointer; |
| | | -webkit-appearance: none; |
| | | text-align: center; |
| | | box-sizing: border-box; |
| | | outline: none; |
| | | margin: 0; |
| | | transition: .1s; |
| | | font-weight: 500; |
| | | -moz-user-select: none; |
| | | -webkit-user-select: none; |
| | | -ms-user-select: none; |
| | | padding: 12px 20px; |
| | | font-size: 14px; |
| | | border-radius: 4px; |
| | | color: #fff; |
| | | background-color: #409eff; |
| | | border-color: #409eff; |
| | | width: 100%; |
| | | } |
| | | |
| | | .btn-danger { |
| | | color: #fff; |
| | | background-color: #f56c6c; |
| | | border-color: #f56c6c; |
| | | } |
| | | |
| | | .btn-success { |
| | | color: #fff; |
| | | background-color: #67c23a; |
| | | border-color: #67c23a; |
| | | } |
| | | |
| | | .player-wrapper { |
| | | width: 900px; |
| | | height: 500px; |
| | | /*overflow-y: auto;*/ |
| | | margin: 0 auto; |
| | | text-align: center; |
| | | } |
| | | |
| | | .btn-wrapper { |
| | | width: 900px; |
| | | height: 50px; |
| | | margin: 0 auto; |
| | | margin-top: 10px; |
| | | } |
| | | |
| | | /*.player-wrapper canvas { |
| | | width: 100%; |
| | | height: 100%; |
| | | }*/ |
| | | |
| | | .logs { |
| | | border: 1px solid #333; |
| | | width: 900px; |
| | | height: 300px; |
| | | margin: 0 auto; |
| | | overflow-y: auto; |
| | | padding: 5px; |
| | | } |
| | | </style> |
| | | </head> |
| | | |
| | | <body> |
| | | <div class="player-wrapper" id="container" style="background-color: #0D0E1B;width:900px;height:500px"> |
| | | </div> |
| | | <div class="btn-wrapper" id="playDom"> |
| | | <button class="btn" id="play">播放</button> |
| | | </div> |
| | | <div class="btn-wrapper btn-wrapper2" id="stopDom" style="display: none"> |
| | | <div style="margin-top: 5px"> |
| | | <button class="btn btn-danger" id="stop">结束</button> |
| | | </div> |
| | | </div> |
| | | <button class="btn" onclick="h5lc.fullscreen=true">全屏</button> |
| | | <div id="logout" class="logs"> |
| | | </div> |
| | | |
| | | <script src="./ajax.js"></script> |
| | | <script src="./renderer.js"></script> |
| | | <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script> |
| | | |
| | | <script> |
| | | onerror = handleErr; |
| | | var txt = ""; |
| | | window.onkeydown = function () { |
| | | h5lc.fullscreen = false |
| | | } |
| | | var $play = document.getElementById('play'); |
| | | var $stop = document.getElementById('stop'); |
| | | var $playDom = document.getElementById('playDom'); |
| | | var $stopDom = document.getElementById('stopDom'); |
| | | var container = document.getElementById("container"); |
| | | var isPlaying = false; |
| | | disabledMouseWheel(container); |
| | | let stream = queryParam('stream') || 'user1'; |
| | | let decoder = queryParam('decoder') || 'ff'; |
| | | let source = queryParam('source') || 'localhost'; |
| | | var h5lc = new Jessibuca({container, decoder: decoder + ".js", videoBuffer: 0}); |
| | | |
| | | h5lc.onLoad = function () { |
| | | //this.play("wss://pulls.1234326.cn/live/L01.flv") |
| | | //this.play("ws://localhost:8080/live/test.flv") |
| | | //this.play("ws://" + source + ":8080/live/" + stream) |
| | | //this.play("ws://pull3.afb1188.com/live/" + stream + ".flv") |
| | | //this.play("ws://pull2.afb1188.com/live/" + stream + ".flv") |
| | | } |
| | | h5lc.onPlay = function () { |
| | | isPlaying = true; |
| | | $playDom.style.display = 'none'; |
| | | $stopDom.style.display = 'block'; |
| | | } |
| | | $play.addEventListener('click', function () { |
| | | if (isPlaying) { |
| | | return; |
| | | } |
| | | isPlaying = true; |
| | | /* $.get("http://127.0.0.1:8088/monica/test/video", function (data) { |
| | | h5lc.play(data) |
| | | } |
| | | );*/ |
| | | play(); |
| | | $playDom.style.display = 'none'; |
| | | $stopDom.style.display = 'block'; |
| | | }, false); |
| | | |
| | | $stop.addEventListener('click', function () { |
| | | if (!isPlaying) { |
| | | return; |
| | | } |
| | | |
| | | isPlaying = false; |
| | | $.get("http://127.0.0.1:8088/monica/video/stop?param=live/test", function () { |
| | | alert("视频流已关闭"); |
| | | h5lc.close() |
| | | } |
| | | ); |
| | | //stop(); |
| | | |
| | | $playDom.style.display = 'block'; |
| | | $stopDom.style.display = 'none'; |
| | | }, false); |
| | | |
| | | |
| | | function play(firstResponseIp) { |
| | | //h5lc.play("ws://" + (firstResponseIp || source) + ":8080/live/" + stream) |
| | | //h5lc.play("ws://pull2.afb1188.com/live/" + stream + ".flv") |
| | | //h5lc.play("ws://localhost:8080/live/" + stream) |
| | | h5lc.play("ws://172.16.30.113:8082/live/video6.flv") |
| | | //h5lc.play("ws://localhost:8072/live/test.flv") |
| | | // h5lc.play("ws://119.9.118.39:8080/live/user1", canvas) |
| | | // h5lc.play("ws://test.qihaipi.com/gnddragon/test.flv", canvas) |
| | | // h5lc.play("ws://localhost:8080/live/test.flv", canvas) |
| | | |
| | | } |
| | | |
| | | function getFastCdnFromList(ipList) { |
| | | ipList = ipList || []; |
| | | var firstResponseIp = ''; |
| | | |
| | | for (var i = 0, len = ipList.length; i < len; i++) { |
| | | var tempIp = ipList[i].name; |
| | | var reqHref = 'http://' + tempIp + '/test'; |
| | | var request = _ajax.get(reqHref); |
| | | request.then(function (data) { |
| | | if (!firstResponseIp) { |
| | | firstResponseIp = tempIp; |
| | | // 直接可以播放了。 |
| | | play(firstResponseIp); |
| | | } |
| | | }) |
| | | } |
| | | } |
| | | |
| | | function stop() { |
| | | h5lc.close() |
| | | } |
| | | |
| | | function queryParam(name, url) { |
| | | var search = window.location.search; |
| | | var qArr = ''; |
| | | var key = {}; |
| | | |
| | | if (url) { |
| | | qArr = url.split("?")[1].split("&") |
| | | |
| | | } else { |
| | | if (!window.location.search) { |
| | | return |
| | | } |
| | | qArr = search.substr(1).split("&") |
| | | } |
| | | |
| | | for (var i = 0; i < qArr.length; i++) { |
| | | |
| | | var firstPos = qArr[i].indexOf('='); |
| | | key[qArr[i].slice(0, firstPos)] = qArr[i].slice(firstPos + 1) |
| | | } |
| | | |
| | | if (name) { |
| | | return key[name] |
| | | } else { |
| | | if (url) { |
| | | return key[name] |
| | | } else { |
| | | return key |
| | | } |
| | | } |
| | | } |
| | | |
| | | function disabledMouseWheel(ele) { |
| | | if (ele.addEventListener) { |
| | | ele.addEventListener('DOMMouseScroll', scrollFunc, false); |
| | | } //W3C |
| | | ele.onmousewheel = scrollFunc; //IE/Opera/Chrome |
| | | } |
| | | |
| | | function scrollFunc(evt) { |
| | | evt = evt || window.event; |
| | | if (evt.preventDefault) { |
| | | // Firefox |
| | | evt.preventDefault(); |
| | | evt.stopPropagation(); |
| | | } else { |
| | | // IE |
| | | evt.cancelBubble = true; |
| | | evt.returnValue = false; |
| | | } |
| | | return false; |
| | | } |
| | | |
| | | function handleErr(msg, url, l) { |
| | | txt = "There was an error on this page.\n\n"; |
| | | txt += "Error: " + msg + "\n"; |
| | | txt += "URL: " + url + "\n"; |
| | | txt += "Line: " + l + "\n\n"; |
| | | document.getElementById("logout").innerHTML += txt + "<br>"; |
| | | return true; |
| | | } |
| | | </script> |
| | | |
| | | </body> |
| | | |
| | | </html> |
| New file |
| | |
| | | <!DOCTYPE html> |
| | | <html> |
| | | |
| | | <head> |
| | | <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> |
| | | <title>Jessibuca 1.0</title> |
| | | <meta charset="utf-8"/> |
| | | <style> |
| | | .btn { |
| | | display: inline-block; |
| | | line-height: 1; |
| | | white-space: nowrap; |
| | | cursor: pointer; |
| | | -webkit-appearance: none; |
| | | text-align: center; |
| | | box-sizing: border-box; |
| | | outline: none; |
| | | margin: 0; |
| | | transition: .1s; |
| | | font-weight: 500; |
| | | -moz-user-select: none; |
| | | -webkit-user-select: none; |
| | | -ms-user-select: none; |
| | | padding: 12px 20px; |
| | | font-size: 14px; |
| | | border-radius: 4px; |
| | | color: #fff; |
| | | background-color: #409eff; |
| | | border-color: #409eff; |
| | | width: 100%; |
| | | } |
| | | |
| | | .btn-danger { |
| | | color: #fff; |
| | | background-color: #f56c6c; |
| | | border-color: #f56c6c; |
| | | } |
| | | |
| | | .btn-success { |
| | | color: #fff; |
| | | background-color: #67c23a; |
| | | border-color: #67c23a; |
| | | } |
| | | |
| | | .player-wrapper { |
| | | width: 900px; |
| | | height: 500px; |
| | | /*overflow-y: auto;*/ |
| | | margin: 0 auto; |
| | | text-align: center; |
| | | } |
| | | |
| | | .btn-wrapper { |
| | | width: 900px; |
| | | height: 50px; |
| | | margin: 0 auto; |
| | | margin-top: 10px; |
| | | } |
| | | |
| | | /*.player-wrapper canvas { |
| | | width: 100%; |
| | | height: 100%; |
| | | }*/ |
| | | |
| | | .logs { |
| | | border: 1px solid #333; |
| | | width: 900px; |
| | | height: 300px; |
| | | margin: 0 auto; |
| | | overflow-y: auto; |
| | | padding: 5px; |
| | | } |
| | | </style> |
| | | </head> |
| | | |
| | | <body> |
| | | <div class="player-wrapper" id="container" style="background-color: #0D0E1B;width:900px;height:500px"> |
| | | </div> |
| | | <div class="btn-wrapper" id="playDom"> |
| | | <button class="btn" id="play">播放</button> |
| | | </div> |
| | | <div class="btn-wrapper btn-wrapper2" id="stopDom" style="display: none"> |
| | | <div style="margin-top: 5px"> |
| | | <button class="btn btn-danger" id="stop">结束</button> |
| | | </div> |
| | | </div> |
| | | <button class="btn" onclick="h5lc.fullscreen=true">全屏</button> |
| | | <div id="logout" class="logs"> |
| | | </div> |
| | | |
| | | <script src="./ajax.js"></script> |
| | | <script src="./renderer.js"></script> |
| | | <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script> |
| | | |
| | | <script> |
| | | onerror = handleErr; |
| | | var txt = ""; |
| | | window.onkeydown = function () { |
| | | h5lc.fullscreen = false |
| | | } |
| | | var $play = document.getElementById('play'); |
| | | var $stop = document.getElementById('stop'); |
| | | var $playDom = document.getElementById('playDom'); |
| | | var $stopDom = document.getElementById('stopDom'); |
| | | var container = document.getElementById("container"); |
| | | var isPlaying = false; |
| | | disabledMouseWheel(container); |
| | | let stream = queryParam('stream') || 'user1'; |
| | | let decoder = queryParam('decoder') || 'ff'; |
| | | let source = queryParam('source') || 'localhost'; |
| | | var h5lc = new Jessibuca({container, decoder: decoder + ".js", videoBuffer: 0}); |
| | | |
| | | h5lc.onLoad = function () { |
| | | //this.play("wss://pulls.1234326.cn/live/L01.flv") |
| | | //this.play("ws://localhost:8080/live/test.flv") |
| | | //this.play("ws://" + source + ":8080/live/" + stream) |
| | | //this.play("ws://pull3.afb1188.com/live/" + stream + ".flv") |
| | | //this.play("ws://pull2.afb1188.com/live/" + stream + ".flv") |
| | | } |
| | | h5lc.onPlay = function () { |
| | | isPlaying = true; |
| | | $playDom.style.display = 'none'; |
| | | $stopDom.style.display = 'block'; |
| | | } |
| | | $play.addEventListener('click', function () { |
| | | if (isPlaying) { |
| | | return; |
| | | } |
| | | isPlaying = true; |
| | | /* $.get("http://127.0.0.1:8088/monica/test/video", function (data) { |
| | | h5lc.play(data) |
| | | } |
| | | );*/ |
| | | play(); |
| | | $playDom.style.display = 'none'; |
| | | $stopDom.style.display = 'block'; |
| | | }, false); |
| | | |
| | | $stop.addEventListener('click', function () { |
| | | if (!isPlaying) { |
| | | return; |
| | | } |
| | | |
| | | isPlaying = false; |
| | | $.get("http://127.0.0.1:8088/monica/video/stop?param=live/test", function () { |
| | | alert("视频流已关闭"); |
| | | h5lc.close() |
| | | } |
| | | ); |
| | | //stop(); |
| | | |
| | | $playDom.style.display = 'block'; |
| | | $stopDom.style.display = 'none'; |
| | | }, false); |
| | | |
| | | |
| | | function play(firstResponseIp) { |
| | | //h5lc.play("ws://" + (firstResponseIp || source) + ":8080/live/" + stream) |
| | | //h5lc.play("ws://pull2.afb1188.com/live/" + stream + ".flv") |
| | | //h5lc.play("ws://localhost:8080/live/" + stream) |
| | | h5lc.play("ws://172.16.30.113:8082/live/video7.flv") |
| | | //h5lc.play("ws://localhost:8072/live/test.flv") |
| | | // h5lc.play("ws://119.9.118.39:8080/live/user1", canvas) |
| | | // h5lc.play("ws://test.qihaipi.com/gnddragon/test.flv", canvas) |
| | | // h5lc.play("ws://localhost:8080/live/test.flv", canvas) |
| | | |
| | | } |
| | | |
| | | function getFastCdnFromList(ipList) { |
| | | ipList = ipList || []; |
| | | var firstResponseIp = ''; |
| | | |
| | | for (var i = 0, len = ipList.length; i < len; i++) { |
| | | var tempIp = ipList[i].name; |
| | | var reqHref = 'http://' + tempIp + '/test'; |
| | | var request = _ajax.get(reqHref); |
| | | request.then(function (data) { |
| | | if (!firstResponseIp) { |
| | | firstResponseIp = tempIp; |
| | | // 直接可以播放了。 |
| | | play(firstResponseIp); |
| | | } |
| | | }) |
| | | } |
| | | } |
| | | |
| | | function stop() { |
| | | h5lc.close() |
| | | } |
| | | |
| | | function queryParam(name, url) { |
| | | var search = window.location.search; |
| | | var qArr = ''; |
| | | var key = {}; |
| | | |
| | | if (url) { |
| | | qArr = url.split("?")[1].split("&") |
| | | |
| | | } else { |
| | | if (!window.location.search) { |
| | | return |
| | | } |
| | | qArr = search.substr(1).split("&") |
| | | } |
| | | |
| | | for (var i = 0; i < qArr.length; i++) { |
| | | |
| | | var firstPos = qArr[i].indexOf('='); |
| | | key[qArr[i].slice(0, firstPos)] = qArr[i].slice(firstPos + 1) |
| | | } |
| | | |
| | | if (name) { |
| | | return key[name] |
| | | } else { |
| | | if (url) { |
| | | return key[name] |
| | | } else { |
| | | return key |
| | | } |
| | | } |
| | | } |
| | | |
| | | function disabledMouseWheel(ele) { |
| | | if (ele.addEventListener) { |
| | | ele.addEventListener('DOMMouseScroll', scrollFunc, false); |
| | | } //W3C |
| | | ele.onmousewheel = scrollFunc; //IE/Opera/Chrome |
| | | } |
| | | |
| | | function scrollFunc(evt) { |
| | | evt = evt || window.event; |
| | | if (evt.preventDefault) { |
| | | // Firefox |
| | | evt.preventDefault(); |
| | | evt.stopPropagation(); |
| | | } else { |
| | | // IE |
| | | evt.cancelBubble = true; |
| | | evt.returnValue = false; |
| | | } |
| | | return false; |
| | | } |
| | | |
| | | function handleErr(msg, url, l) { |
| | | txt = "There was an error on this page.\n\n"; |
| | | txt += "Error: " + msg + "\n"; |
| | | txt += "URL: " + url + "\n"; |
| | | txt += "Line: " + l + "\n\n"; |
| | | document.getElementById("logout").innerHTML += txt + "<br>"; |
| | | return true; |
| | | } |
| | | </script> |
| | | |
| | | </body> |
| | | |
| | | </html> |
| New file |
| | |
| | | <!DOCTYPE html> |
| | | <html> |
| | | |
| | | <head> |
| | | <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> |
| | | <title>Jessibuca 1.0</title> |
| | | <meta charset="utf-8"/> |
| | | <style> |
| | | .btn { |
| | | display: inline-block; |
| | | line-height: 1; |
| | | white-space: nowrap; |
| | | cursor: pointer; |
| | | -webkit-appearance: none; |
| | | text-align: center; |
| | | box-sizing: border-box; |
| | | outline: none; |
| | | margin: 0; |
| | | transition: .1s; |
| | | font-weight: 500; |
| | | -moz-user-select: none; |
| | | -webkit-user-select: none; |
| | | -ms-user-select: none; |
| | | padding: 12px 20px; |
| | | font-size: 14px; |
| | | border-radius: 4px; |
| | | color: #fff; |
| | | background-color: #409eff; |
| | | border-color: #409eff; |
| | | width: 100%; |
| | | } |
| | | |
| | | .btn-danger { |
| | | color: #fff; |
| | | background-color: #f56c6c; |
| | | border-color: #f56c6c; |
| | | } |
| | | |
| | | .btn-success { |
| | | color: #fff; |
| | | background-color: #67c23a; |
| | | border-color: #67c23a; |
| | | } |
| | | |
| | | .player-wrapper { |
| | | width: 900px; |
| | | height: 500px; |
| | | /*overflow-y: auto;*/ |
| | | margin: 0 auto; |
| | | text-align: center; |
| | | } |
| | | |
| | | .btn-wrapper { |
| | | width: 900px; |
| | | height: 50px; |
| | | margin: 0 auto; |
| | | margin-top: 10px; |
| | | } |
| | | |
| | | /*.player-wrapper canvas { |
| | | width: 100%; |
| | | height: 100%; |
| | | }*/ |
| | | |
| | | .logs { |
| | | border: 1px solid #333; |
| | | width: 900px; |
| | | height: 300px; |
| | | margin: 0 auto; |
| | | overflow-y: auto; |
| | | padding: 5px; |
| | | } |
| | | </style> |
| | | </head> |
| | | |
| | | <body> |
| | | <div class="player-wrapper" id="container" style="background-color: #0D0E1B;width:900px;height:500px"> |
| | | </div> |
| | | <div class="btn-wrapper" id="playDom"> |
| | | <button class="btn" id="play">播放</button> |
| | | </div> |
| | | <div class="btn-wrapper btn-wrapper2" id="stopDom" style="display: none"> |
| | | <div style="margin-top: 5px"> |
| | | <button class="btn btn-danger" id="stop">结束</button> |
| | | </div> |
| | | </div> |
| | | <button class="btn" onclick="h5lc.fullscreen=true">全屏</button> |
| | | <div id="logout" class="logs"> |
| | | </div> |
| | | |
| | | <script src="./ajax.js"></script> |
| | | <script src="./renderer.js"></script> |
| | | <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script> |
| | | |
| | | <script> |
| | | onerror = handleErr; |
| | | var txt = ""; |
| | | window.onkeydown = function () { |
| | | h5lc.fullscreen = false |
| | | } |
| | | var $play = document.getElementById('play'); |
| | | var $stop = document.getElementById('stop'); |
| | | var $playDom = document.getElementById('playDom'); |
| | | var $stopDom = document.getElementById('stopDom'); |
| | | var container = document.getElementById("container"); |
| | | var isPlaying = false; |
| | | disabledMouseWheel(container); |
| | | let stream = queryParam('stream') || 'user1'; |
| | | let decoder = queryParam('decoder') || 'ff'; |
| | | let source = queryParam('source') || 'localhost'; |
| | | var h5lc = new Jessibuca({container, decoder: decoder + ".js", videoBuffer: 0}); |
| | | |
| | | h5lc.onLoad = function () { |
| | | //this.play("wss://pulls.1234326.cn/live/L01.flv") |
| | | //this.play("ws://localhost:8080/live/test.flv") |
| | | //this.play("ws://" + source + ":8080/live/" + stream) |
| | | //this.play("ws://pull3.afb1188.com/live/" + stream + ".flv") |
| | | //this.play("ws://pull2.afb1188.com/live/" + stream + ".flv") |
| | | } |
| | | h5lc.onPlay = function () { |
| | | isPlaying = true; |
| | | $playDom.style.display = 'none'; |
| | | $stopDom.style.display = 'block'; |
| | | } |
| | | $play.addEventListener('click', function () { |
| | | if (isPlaying) { |
| | | return; |
| | | } |
| | | isPlaying = true; |
| | | /* $.get("http://127.0.0.1:8088/monica/test/video", function (data) { |
| | | h5lc.play(data) |
| | | } |
| | | );*/ |
| | | play(); |
| | | $playDom.style.display = 'none'; |
| | | $stopDom.style.display = 'block'; |
| | | }, false); |
| | | |
| | | $stop.addEventListener('click', function () { |
| | | if (!isPlaying) { |
| | | return; |
| | | } |
| | | |
| | | isPlaying = false; |
| | | $.get("http://127.0.0.1:8088/monica/video/stop?param=live/test", function () { |
| | | alert("视频流已关闭"); |
| | | h5lc.close() |
| | | } |
| | | ); |
| | | //stop(); |
| | | |
| | | $playDom.style.display = 'block'; |
| | | $stopDom.style.display = 'none'; |
| | | }, false); |
| | | |
| | | |
| | | function play(firstResponseIp) { |
| | | //h5lc.play("ws://" + (firstResponseIp || source) + ":8080/live/" + stream) |
| | | //h5lc.play("ws://pull2.afb1188.com/live/" + stream + ".flv") |
| | | //h5lc.play("ws://localhost:8080/live/" + stream) |
| | | h5lc.play("ws://172.16.30.113:8082/live/video8.flv") |
| | | //h5lc.play("ws://localhost:8072/live/test.flv") |
| | | // h5lc.play("ws://119.9.118.39:8080/live/user1", canvas) |
| | | // h5lc.play("ws://test.qihaipi.com/gnddragon/test.flv", canvas) |
| | | // h5lc.play("ws://localhost:8080/live/test.flv", canvas) |
| | | |
| | | } |
| | | |
| | | function getFastCdnFromList(ipList) { |
| | | ipList = ipList || []; |
| | | var firstResponseIp = ''; |
| | | |
| | | for (var i = 0, len = ipList.length; i < len; i++) { |
| | | var tempIp = ipList[i].name; |
| | | var reqHref = 'http://' + tempIp + '/test'; |
| | | var request = _ajax.get(reqHref); |
| | | request.then(function (data) { |
| | | if (!firstResponseIp) { |
| | | firstResponseIp = tempIp; |
| | | // 直接可以播放了。 |
| | | play(firstResponseIp); |
| | | } |
| | | }) |
| | | } |
| | | } |
| | | |
| | | function stop() { |
| | | h5lc.close() |
| | | } |
| | | |
| | | function queryParam(name, url) { |
| | | var search = window.location.search; |
| | | var qArr = ''; |
| | | var key = {}; |
| | | |
| | | if (url) { |
| | | qArr = url.split("?")[1].split("&") |
| | | |
| | | } else { |
| | | if (!window.location.search) { |
| | | return |
| | | } |
| | | qArr = search.substr(1).split("&") |
| | | } |
| | | |
| | | for (var i = 0; i < qArr.length; i++) { |
| | | |
| | | var firstPos = qArr[i].indexOf('='); |
| | | key[qArr[i].slice(0, firstPos)] = qArr[i].slice(firstPos + 1) |
| | | } |
| | | |
| | | if (name) { |
| | | return key[name] |
| | | } else { |
| | | if (url) { |
| | | return key[name] |
| | | } else { |
| | | return key |
| | | } |
| | | } |
| | | } |
| | | |
| | | function disabledMouseWheel(ele) { |
| | | if (ele.addEventListener) { |
| | | ele.addEventListener('DOMMouseScroll', scrollFunc, false); |
| | | } //W3C |
| | | ele.onmousewheel = scrollFunc; //IE/Opera/Chrome |
| | | } |
| | | |
| | | function scrollFunc(evt) { |
| | | evt = evt || window.event; |
| | | if (evt.preventDefault) { |
| | | // Firefox |
| | | evt.preventDefault(); |
| | | evt.stopPropagation(); |
| | | } else { |
| | | // IE |
| | | evt.cancelBubble = true; |
| | | evt.returnValue = false; |
| | | } |
| | | return false; |
| | | } |
| | | |
| | | function handleErr(msg, url, l) { |
| | | txt = "There was an error on this page.\n\n"; |
| | | txt += "Error: " + msg + "\n"; |
| | | txt += "URL: " + url + "\n"; |
| | | txt += "Line: " + l + "\n\n"; |
| | | document.getElementById("logout").innerHTML += txt + "<br>"; |
| | | return true; |
| | | } |
| | | </script> |
| | | |
| | | </body> |
| | | |
| | | </html> |
| New file |
| | |
| | | <!DOCTYPE html> |
| | | <html> |
| | | |
| | | <head> |
| | | <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> |
| | | <title>Jessibuca 1.0</title> |
| | | <meta charset="utf-8"/> |
| | | <style> |
| | | .btn { |
| | | display: inline-block; |
| | | line-height: 1; |
| | | white-space: nowrap; |
| | | cursor: pointer; |
| | | -webkit-appearance: none; |
| | | text-align: center; |
| | | box-sizing: border-box; |
| | | outline: none; |
| | | margin: 0; |
| | | transition: .1s; |
| | | font-weight: 500; |
| | | -moz-user-select: none; |
| | | -webkit-user-select: none; |
| | | -ms-user-select: none; |
| | | padding: 12px 20px; |
| | | font-size: 14px; |
| | | border-radius: 4px; |
| | | color: #fff; |
| | | background-color: #409eff; |
| | | border-color: #409eff; |
| | | width: 100%; |
| | | } |
| | | |
| | | .btn-danger { |
| | | color: #fff; |
| | | background-color: #f56c6c; |
| | | border-color: #f56c6c; |
| | | } |
| | | |
| | | .btn-success { |
| | | color: #fff; |
| | | background-color: #67c23a; |
| | | border-color: #67c23a; |
| | | } |
| | | |
| | | .player-wrapper { |
| | | width: 900px; |
| | | height: 500px; |
| | | /*overflow-y: auto;*/ |
| | | margin: 0 auto; |
| | | text-align: center; |
| | | } |
| | | |
| | | .btn-wrapper { |
| | | width: 900px; |
| | | height: 50px; |
| | | margin: 0 auto; |
| | | margin-top: 10px; |
| | | } |
| | | |
| | | /*.player-wrapper canvas { |
| | | width: 100%; |
| | | height: 100%; |
| | | }*/ |
| | | |
| | | .logs { |
| | | border: 1px solid #333; |
| | | width: 900px; |
| | | height: 300px; |
| | | margin: 0 auto; |
| | | overflow-y: auto; |
| | | padding: 5px; |
| | | } |
| | | </style> |
| | | </head> |
| | | |
| | | <body> |
| | | <div class="player-wrapper" id="container" style="background-color: #0D0E1B;width:900px;height:500px"> |
| | | </div> |
| | | <div class="btn-wrapper" id="playDom"> |
| | | <button class="btn" id="play">播放</button> |
| | | </div> |
| | | <div class="btn-wrapper btn-wrapper2" id="stopDom" style="display: none"> |
| | | <div style="margin-top: 5px"> |
| | | <button class="btn btn-danger" id="stop">结束</button> |
| | | </div> |
| | | </div> |
| | | <button class="btn" onclick="h5lc.fullscreen=true">全屏</button> |
| | | <div id="logout" class="logs"> |
| | | </div> |
| | | |
| | | <script src="./ajax.js"></script> |
| | | <script src="./renderer.js"></script> |
| | | <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script> |
| | | |
| | | <script> |
| | | onerror = handleErr; |
| | | var txt = ""; |
| | | window.onkeydown = function () { |
| | | h5lc.fullscreen = false |
| | | } |
| | | var $play = document.getElementById('play'); |
| | | var $stop = document.getElementById('stop'); |
| | | var $playDom = document.getElementById('playDom'); |
| | | var $stopDom = document.getElementById('stopDom'); |
| | | var container = document.getElementById("container"); |
| | | var isPlaying = false; |
| | | disabledMouseWheel(container); |
| | | let stream = queryParam('stream') || 'user1'; |
| | | let decoder = queryParam('decoder') || 'ff'; |
| | | let source = queryParam('source') || 'localhost'; |
| | | var h5lc = new Jessibuca({container, decoder: decoder + ".js", videoBuffer: 0}); |
| | | |
| | | h5lc.onLoad = function () { |
| | | //this.play("wss://pulls.1234326.cn/live/L01.flv") |
| | | //this.play("ws://localhost:8080/live/test.flv") |
| | | //this.play("ws://" + source + ":8080/live/" + stream) |
| | | //this.play("ws://pull3.afb1188.com/live/" + stream + ".flv") |
| | | //this.play("ws://pull2.afb1188.com/live/" + stream + ".flv") |
| | | } |
| | | h5lc.onPlay = function () { |
| | | isPlaying = true; |
| | | $playDom.style.display = 'none'; |
| | | $stopDom.style.display = 'block'; |
| | | } |
| | | $play.addEventListener('click', function () { |
| | | if (isPlaying) { |
| | | return; |
| | | } |
| | | isPlaying = true; |
| | | /* $.get("http://127.0.0.1:8088/monica/test/video", function (data) { |
| | | h5lc.play(data) |
| | | } |
| | | );*/ |
| | | play(); |
| | | $playDom.style.display = 'none'; |
| | | $stopDom.style.display = 'block'; |
| | | }, false); |
| | | |
| | | $stop.addEventListener('click', function () { |
| | | if (!isPlaying) { |
| | | return; |
| | | } |
| | | |
| | | isPlaying = false; |
| | | $.get("http://127.0.0.1:8088/monica/video/stop?param=live/test", function () { |
| | | alert("视频流已关闭"); |
| | | h5lc.close() |
| | | } |
| | | ); |
| | | //stop(); |
| | | |
| | | $playDom.style.display = 'block'; |
| | | $stopDom.style.display = 'none'; |
| | | }, false); |
| | | |
| | | |
| | | function play(firstResponseIp) { |
| | | //h5lc.play("ws://" + (firstResponseIp || source) + ":8080/live/" + stream) |
| | | //h5lc.play("ws://pull2.afb1188.com/live/" + stream + ".flv") |
| | | //h5lc.play("ws://localhost:8080/live/" + stream) |
| | | h5lc.play("ws://172.16.30.113:8082/live/video9.flv") |
| | | //h5lc.play("ws://localhost:8072/live/test.flv") |
| | | // h5lc.play("ws://119.9.118.39:8080/live/user1", canvas) |
| | | // h5lc.play("ws://test.qihaipi.com/gnddragon/test.flv", canvas) |
| | | // h5lc.play("ws://localhost:8080/live/test.flv", canvas) |
| | | |
| | | } |
| | | |
| | | function getFastCdnFromList(ipList) { |
| | | ipList = ipList || []; |
| | | var firstResponseIp = ''; |
| | | |
| | | for (var i = 0, len = ipList.length; i < len; i++) { |
| | | var tempIp = ipList[i].name; |
| | | var reqHref = 'http://' + tempIp + '/test'; |
| | | var request = _ajax.get(reqHref); |
| | | request.then(function (data) { |
| | | if (!firstResponseIp) { |
| | | firstResponseIp = tempIp; |
| | | // 直接可以播放了。 |
| | | play(firstResponseIp); |
| | | } |
| | | }) |
| | | } |
| | | } |
| | | |
| | | function stop() { |
| | | h5lc.close() |
| | | } |
| | | |
| | | function queryParam(name, url) { |
| | | var search = window.location.search; |
| | | var qArr = ''; |
| | | var key = {}; |
| | | |
| | | if (url) { |
| | | qArr = url.split("?")[1].split("&") |
| | | |
| | | } else { |
| | | if (!window.location.search) { |
| | | return |
| | | } |
| | | qArr = search.substr(1).split("&") |
| | | } |
| | | |
| | | for (var i = 0; i < qArr.length; i++) { |
| | | |
| | | var firstPos = qArr[i].indexOf('='); |
| | | key[qArr[i].slice(0, firstPos)] = qArr[i].slice(firstPos + 1) |
| | | } |
| | | |
| | | if (name) { |
| | | return key[name] |
| | | } else { |
| | | if (url) { |
| | | return key[name] |
| | | } else { |
| | | return key |
| | | } |
| | | } |
| | | } |
| | | |
| | | function disabledMouseWheel(ele) { |
| | | if (ele.addEventListener) { |
| | | ele.addEventListener('DOMMouseScroll', scrollFunc, false); |
| | | } //W3C |
| | | ele.onmousewheel = scrollFunc; //IE/Opera/Chrome |
| | | } |
| | | |
| | | function scrollFunc(evt) { |
| | | evt = evt || window.event; |
| | | if (evt.preventDefault) { |
| | | // Firefox |
| | | evt.preventDefault(); |
| | | evt.stopPropagation(); |
| | | } else { |
| | | // IE |
| | | evt.cancelBubble = true; |
| | | evt.returnValue = false; |
| | | } |
| | | return false; |
| | | } |
| | | |
| | | function handleErr(msg, url, l) { |
| | | txt = "There was an error on this page.\n\n"; |
| | | txt += "Error: " + msg + "\n"; |
| | | txt += "URL: " + url + "\n"; |
| | | txt += "Line: " + l + "\n\n"; |
| | | document.getElementById("logout").innerHTML += txt + "<br>"; |
| | | return true; |
| | | } |
| | | </script> |
| | | |
| | | </body> |
| | | |
| | | </html> |
| | |
| | | package com.hbbh.adapter; |
| | | |
| | | import com.alibaba.fastjson.JSON; |
| | | import com.google.common.collect.Maps; |
| | | import com.hbbh.adapter.utils.HttpClientUtil; |
| | | import org.junit.jupiter.api.Test; |
| | | |
| | | import java.util.List; |
| | | import java.util.Map; |
| | | |
| | | public class HttpClientUtilTest { |
| | |
| | | * Referer: http://192.168.1.109:3000/ |
| | | * Accept-Encoding: gzip, deflate |
| | | * Accept-Language: zh-CN,zh;q=0.9 |
| | | * |
| | | * <p> |
| | | * path: E:\store\live |
| | | * name: live |
| | | * info: [Monibuca] |
| | |
| | | * #StreamPath = "live/rtsp2" |
| | | * clear: true |
| | | */ |
| | | private String info="[Monibuca]\n" + |
| | | private String info = "[Monibuca]\n" + |
| | | "# 是否等待流,如果为true则订阅一个尚未发布的流会进入等待发布的状态,否则返回订阅失败\n" + |
| | | "EnableWaitStream = true\n" + |
| | | "EnableAudio = true\n" + |
| | |
| | | @Test |
| | | void init() { |
| | | String result = createInstance(); |
| | | if (result.contains("success")){ |
| | | System.out.println(result); |
| | | /*if (result.contains("success")) { |
| | | startInstance(); |
| | | }else { |
| | | } else { |
| | | //创建实例失败 |
| | | System.out.println("创建实例失败"); |
| | | } |
| | | }*/ |
| | | } |
| | | |
| | | /** |
| | | * 创建实例 |
| | | * GET |
| | | */ |
| | | private String createInstance(){ |
| | | String url="http://127.0.0.1:3000/api/instance/create"; |
| | | private String createInstance() { |
| | | String url = "http://127.0.0.1:3000/api/instance/create"; |
| | | Map<String, String> params = Maps.newLinkedHashMap(); |
| | | params.put("path","/Users/xucheng/Downloads/store/live"); |
| | | params.put("name","live"); |
| | | params.put("info",info); |
| | | params.put("clear","true"); |
| | | params.put("path", "/Users/xucheng/Downloads/store/live"); |
| | | params.put("name", "live"); |
| | | params.put("info", info); |
| | | params.put("clear", "true"); |
| | | String result = HttpClientUtil.doGet(url, params); |
| | | return result; |
| | | } |
| | | |
| | | /** |
| | | * [{ |
| | | * "Name": "history", |
| | | * "Path": "/Users/xucheng/Downloads/store/history", |
| | | * "config": { |
| | | * "Monibuca": { |
| | | * "EnableWaitStream": true, |
| | | * "EnableAudio": true, |
| | | * "EnableVideo": true, |
| | | * "RingSize": 10, |
| | | * "PublishTimeout": 60000000000 |
| | | * }, |
| | | * "RTMP": { |
| | | * "ListenAddr": ":1933" |
| | | * }, |
| | | * "GateWay": { |
| | | * "ListenAddr": ":8071" |
| | | * }, |
| | | * "Jessica": { |
| | | * "ListenAddr": ":8072" |
| | | * }, |
| | | * "LogRotate": { |
| | | * "Path": "logs", |
| | | * "Size": 0, |
| | | * "Days": 1 |
| | | * }, |
| | | * "Cluster": { |
| | | * "ListenAddr": ":2011", |
| | | * "OriginServer": "", |
| | | * "Push": true |
| | | * }, |
| | | * "HLS": { |
| | | * "EnableWrite": false, |
| | | * "EnableMemory": false, |
| | | * "Fragment": 10, |
| | | * "Window": 2, |
| | | * "Path": "resource" |
| | | * }, |
| | | * "HDL": { |
| | | * "ListenAddr": ":2012" |
| | | * }, |
| | | * "TS": { |
| | | * "AutoPublish": false, |
| | | * "Path": "resource" |
| | | * }, |
| | | * "Record": { |
| | | * "Path": "resource", |
| | | * "AutoPublish": false, |
| | | * "AutoRecord": false |
| | | * }, |
| | | * "RTSP": { |
| | | * "ListenAddr": ":551", |
| | | * "AutoPull": true, |
| | | * "Reconnect": true, |
| | | * "RemoteAddr": "rtsp://wowzaec2demo.streamlock.net/vod/mp4:BigBuckBunny_115k.mov", |
| | | * "StreamPath": "live/rtsp" |
| | | * }, |
| | | * "WebRTC": { |
| | | * "PublicIP": ["127.0.0.1"] |
| | | * }, |
| | | * "GB28181": { |
| | | * "Serial": "34020000002000000001", |
| | | * "Realm": "3402000000", |
| | | * "Expires": 3600, |
| | | * "AutoInvite": false, |
| | | * "ListenAddr": "192.168.1.120:5062" |
| | | * }* }, |
| | | * "pid": "46533", |
| | | * "status": "offline" |
| | | * }, { |
| | | * "Name": "live", |
| | | * "Path": "/Users/xucheng/Downloads/store/live", |
| | | * "config": { |
| | | * "Monibuca": { |
| | | * "EnableWaitStream": true, |
| | | * "EnableAudio": true, |
| | | * "EnableVideo": true, |
| | | * "RingSize": 10, |
| | | * "PublishTimeout": 60000000000 |
| | | * } , |
| | | * "RTMP": { |
| | | * "ListenAddr": ":1935" |
| | | * }, |
| | | * "GateWay": { |
| | | * "ListenAddr": ":8081" |
| | | * }, |
| | | * "Jessica": { |
| | | * "ListenAddr": ":8080" |
| | | * }, |
| | | * "LogRotate": { |
| | | * "Path": "logs", |
| | | * "Size": 0, |
| | | * "Days": 1 |
| | | * }, |
| | | * "Cluster": { |
| | | * "ListenAddr": ":2019", |
| | | * "OriginServer": "", |
| | | * "Push": true |
| | | * }, |
| | | * "HLS": { |
| | | * "EnableWrite": false, |
| | | * "EnableMemory": false, |
| | | * "Fragment": 10, |
| | | * "Window": 2, |
| | | * "Path": "resource" |
| | | * }, |
| | | * "HDL": { |
| | | * "ListenAddr": ":2020" |
| | | * }, |
| | | * "TS": { |
| | | * "AutoPublish": false, |
| | | * "Path": "resource" |
| | | * }, |
| | | * "Record": { |
| | | * "Path": "resource", |
| | | * "AutoPublish": false, |
| | | * "AutoRecord": false |
| | | * }, |
| | | * "RTSP": { |
| | | * "ListenAddr": ":554", |
| | | * "AutoPull": true, |
| | | * "Reconnect": true, |
| | | * "RemoteAddr": "rtsp://wowzaec2demo.streamlock.net/vod/mp4:BigBuckBunny_115k.mov", |
| | | * "StreamPath": "live/rtsp" |
| | | * }, |
| | | * "WebRTC": { |
| | | * "PublicIP": ["127.0.0.1"] |
| | | * }, |
| | | * "GB28181": { |
| | | * "Serial": "34020000002000000001", |
| | | * "Realm": "3402000000", |
| | | * "Expires": 3600, |
| | | * "AutoInvite": false, |
| | | * "ListenAddr": "192.168.1.120:5060" |
| | | * } |
| | | * }, |
| | | * "pid": "17003", |
| | | * "status": "offline" |
| | | * }] |
| | | * |
| | | * @return |
| | | */ |
| | | private String findList() { |
| | | String url = "http://localhost:3000/api/instance/list"; |
| | | String result = HttpClientUtil.doGet(url); |
| | | return result; |
| | | } |
| | | |
| | | @Test |
| | | public void findListTest() throws Exception { |
| | | String list = findList(); |
| | | List<Map> maps = JSON.parseObject(list, List.class); |
| | | for (Map map : maps) { |
| | | String name = map.get("Name") + "";//实例名称 |
| | | String path = map.get("Path") + "";//实例存放路径 |
| | | String status = map.get("status") + "";// offline 不在线 online 在线 |
| | | System.out.println(status); |
| | | } |
| | | |
| | | } |
| | | |
| | | @Test |
| | | public void test01() throws Exception { |
| | | startInstance(); |
| | | } |
| | | |
| | | /** |
| | |
| | | * POST |
| | | * http://localhost:3000/api/instance/start?name=live |
| | | */ |
| | | private void startInstance(){ |
| | | String url="http://localhost:3000/api/instance/start?name=live"; |
| | | private void startInstance() { |
| | | String url = "http://localhost:3000/api/instance/start?name=live"; |
| | | String result = HttpClientUtil.doPost(url); |
| | | System.out.println(result); |
| | | } |
| | |
| | | * http://localhost:8081/rtsp/pull? |
| | | * target=rtsp://wowzaec2demo.streamlock.net/vod/mp4:BigBuckBunny_115k.mov& |
| | | * streamPath=live/test |
| | | * |
| | | * |
| | | * <p> |
| | | * <p> |
| | | * return :http://localhost:2020/live/test1.flv |
| | | */ |
| | | private void pullRTSPURL(){ |
| | | String url="http://localhost:8081/rtsp/pull"; |
| | | private void pullRTSPURL() { |
| | | String url = "http://localhost:8081/rtsp/pull"; |
| | | Map<String, String> params = Maps.newLinkedHashMap(); |
| | | /* params.put("target","rtsp://wowzaec2demo.streamlock.net/vod/mp4:BigBuckBunny_115k.mov"); |
| | | params.put("streamPath","live/test"); |
| | |
| | | */ |
| | | |
| | | for (int i = 0; i < 10; i++) { |
| | | params.put("target","rtsp://wowzaec2demo.streamlock.net/vod/mp4:BigBuckBunny_115k.mov"); |
| | | params.put("streamPath","live/test"+i); |
| | | params.put("target", "rtsp://wowzaec2demo.streamlock.net/vod/mp4:BigBuckBunny_115k.mov"); |
| | | params.put("streamPath", "live/test" + i); |
| | | String result = HttpClientUtil.doGet(url, params); |
| | | if (result.contains("0")){ |
| | | }else { |
| | | System.out.println("第"+i+"次创建失败"); |
| | | if (result.contains("0")) { |
| | | } else { |
| | | System.out.println("第" + i + "次创建失败"); |
| | | } |
| | | |
| | | params.clear(); |
| | |
| | | } |
| | | |
| | | @Test |
| | | public void pullRTSP(){ |
| | | String url="http://localhost:8081/rtsp/pull"; |
| | | public void pullRTSP() { |
| | | String url = "http://localhost:8081/rtsp/pull"; |
| | | Map<String, String> params = Maps.newLinkedHashMap(); |
| | | |
| | | params.put("target","rtsp://wowzaec2demo.streamlock.net/vod/mp4:BigBuckBunny_115k.mov"); |
| | | params.put("streamPath","live/test"); |
| | | params.put("target", "rtsp://wowzaec2demo.streamlock.net/vod/mp4:BigBuckBunny_115k.mov"); |
| | | params.put("streamPath", "live/test"); |
| | | String result = HttpClientUtil.doGet(url, params); |
| | | System.out.println(result); |
| | | } |