175 lines
6.2 KiB
HTML
Raw Normal View History

2023-10-06 09:13:20 +08:00
<meta charset="UTF-8">
<style type="text/css">
body,html{width:100%;height:100%;background:#000;padding:0;margin:0;overflow-x:hidden;overflow-y:hidden}
*{margin:0;border:0;padding:0;text-decoration:none}
#video {
position:inherit;
}
.total {position: absolute;top: 1px;left: 10px;color: #fff;font-size: 13px;}
/* 移动设备自适应宽高 */
@media only screen and (max-width: 650px) {
#list {
width: 100%;
left: 0px;
max-width: 100%;
min-width: auto;
}
#video {
height: 100% !important;
width: 100% !important;
}
.total {position: absolute;top: 0px;left: 10px;color: #fff;font-size: 12px;}
}
#time {
display: none;
right: 10px;
text-align: center;
top: 3px;
font-size: 12px;
color: #fdfdfd;
text-shadow: 1px 1px 1px #000, 1px 1px 1px #000;
position: fixed;
z-index: 2147483645;
}
.masked h4{
display: block;
/*渐变背景*/
background-image: -webkit-linear-gradient(left, #3498db, #f47920 10%, #d71345 20%, #f7acbc 30%,
#ffd400 40%, #3498db 50%, #f47920 60%, #d71345 70%, #f7acbc 80%, #ffd400 90%, #3498db);
color: transparent; /*文字填充色为透明*/
-webkit-text-fill-color: transparent;
-webkit-background-clip: text; /*背景剪裁为文字,只将文字显示为背景*/
background-size: 200% 100%; /*背景图片向水平方向扩大一倍这样background-position才有移动与变化的空间*/
/* 动画 */
animation: masked-animation 4s infinite linear;
}
@keyframes masked-animation {
0% {
background-position: 0 0; /*background-position 属性设置背景图像的起始位置。*/
}
100% {
background-position: -100% 0;
}
}
</style>
<div id="video"></div>
<div class="total">
<div class="masked">
<h4><div id="stats"></div></h4>
</div>
</div>
<script src="/web/player/p2phls/hls.min.js"></script>
<script src="/web/player/p2phls/cbplayer2.js"></script>
<script src="/web/player/p2phls/jquery.min.js"></script>
<script>
var _peerId = '', _peerNum = 0, _totalP2PDownloaded = 0, _totalP2PUploaded = 0;
var m3u8url = document.location.href.split("url=")[1];
var player = new CBPlayer({
container: document.getElementById('video'),
autoplay: true, //视频自动播放
live: false, //开启直播模式
lang: 'zh-cn', //语言
hotkey: true, //开启热键,支持快进、快退、音量控制、播放暂停
airplay: true, //在 Safari 中开启 AirPlay
screenshot: false, //开启截图,如果开启,视频和视频封面需要允许跨域
preload: 'auto', //视频预加载,可选值: 'none', 'metadata', 'auto'
danmaku: true,
video: {
pic: "/web/player/p2phls/loading_pc.jpg",
url: m3u8url||'https://vip.ffzyread1.com/20230601/13234_55ed2d56/index.m3u8',
},
pluginOptions: {
hls: {
//maxBufferSize: 0,
//maxBufferLength: 10,
//liveSyncDurationCount: 15,
p2pConfig: {
// logLevel: true,
live: false,
geoIpPreflight: false, //向在线IP数据库请求ASN等信息从而获得更准确的调度会延迟P2P启动时间。
useHttpRange: false, //用于补足p2p下载超时的剩余部分数据
sharePlaylist: true, //是否允许m3u8文件的P2P传输。
diskCacheLimit: {"pc": 2500 * 1024 * 1024, "mobile": 1500 * 1024 * 1024}, //磁盘缓存的最大数据量分为PC和mobile。
memoryCacheLimit: {"pc": 600 * 1024 * 1024, "mobile": 300 * 1024 * 1024}, //内存缓存的最大数据量分为PC和mobile。
announce: "https://p2ptrakcer.bapy.top",
wsSignalerAddr: 'wss://cd.swarmcloud.net',
},
webRTCConfig: {
iceServers: [{
urls: "stun:stun.l.google.com:19302"
}, {
urls: "stun:global.stun.twilio.com:3478?transport=udp"
}, {
urls: "stun:stun.cdnbye.com"
}]
}
}
},
danmaku: {
id: m3u8url||'https://vip.ffzyread1.com/20230601/13234_55ed2d56/index.m3u8',
api: 'https://danmu.aip520.cn/v3/?id='
}
});
player.on('stats', function (stats) {
_totalP2PDownloaded = stats.totalP2PDownloaded;
_totalP2PUploaded = stats.totalP2PUploaded;
updateStats();
})
player.on('peerId', function (peerId) {
_peerId = peerId;
})
player.on('peers', function (peers) {
_peerNum = peers.length;
updateStats();
});
//全屏
player.on("fullscreen", function() {
$("#time").show();
});
//退出全屏
player.on("fullscreen_cancel", function() {
$("#time").hide();
});
//移动浏览器video兼容
$('body').find('video')
.attr('playsinline', '')
.attr('x5-playsinline', '')
.attr('webkit-playsinline', '')
.attr('x-webkit-airplay', 'allow')
function updateStats() {
var text = 'P2P开启 加速' + (_totalP2PDownloaded/1024).toFixed(2)
+ 'MB 分享' + (_totalP2PUploaded/1024).toFixed(2) + 'MB' + ' 连接节点' + _peerNum + '个';
document.getElementById('stats').innerText = text
}
//时间更新
function timeUpdate() {
var date = new Date();
var year = date.getFullYear();
var month = date.getMonth() + 1;
var day = date.getDate();
var hour = "00" + date.getHours();
hour = hour.substr(hour.length - 2);
var minute = "00" + date.getMinutes();
minute = minute.substr(minute.length - 2);
var second = "00" + date.getSeconds();
second = second.substr(second.length - 2);
$("#time").html(hour + ":" + minute + ":" + second);
setTimeout("timeUpdate()", 1000);
}
//信息控件
if (!$('#time').length) {$("#video").append("<div id='time'></div>");}
//显示时间
timeUpdate();
</script>