1459 lines
57 KiB
HTML
1459 lines
57 KiB
HTML
<!DOCTYPE html>
|
||
<html>
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="renderer" content="webkit">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||
<title>直播订货</title>
|
||
<link rel="shortcut icon" type="image/x-icon" href="../favicon.ico" />
|
||
<link rel="stylesheet" href="layuiadmin/layui/css/layui.css">
|
||
<link rel="stylesheet" href="https://g.alicdn.com/de/prismplayer/2.8.7/skins/default/aliplayer-min.css">
|
||
<script src="https://g.alicdn.com/de/prismplayer/2.8.7/aliplayer-min.js" charset="utf-8"></script>
|
||
<script type="text/javascript" charset="utf-8" src="js/aliplayercomponents.min.js"></script>
|
||
|
||
<style>
|
||
/* 用于防止产生不明原因的横向滚动条 */
|
||
.pcki-page {overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch;}
|
||
|
||
#player-con { overflow: hidden; }
|
||
#player-con-close { position: absolute; display: none; z-index: 99; width: 24px; height: 24px; line-height: 24px; text-align: center; color: white; right: 8px; top: 8px; }
|
||
#player-con-close .layui-icon { font-size: 24px; font-weight: bold; }
|
||
|
||
/* 弹幕、产品列表 */
|
||
#player-con .-bottom-controls {
|
||
position: absolute;
|
||
bottom: 44px;
|
||
width: 96%;
|
||
padding: 0 2%;
|
||
z-index: 901;/* .prism-player .prism-info-display 的 z-index 为 900 */
|
||
}
|
||
/* 弹幕列表 */
|
||
#player-con .-bottom-controls .player-dmlist {
|
||
width: 200px;
|
||
max-height: 140px;
|
||
overflow-y: auto;
|
||
color: white;
|
||
}
|
||
/* 元素整体渐变，仅支持webkit核心浏览器 */
|
||
#player-con .-bottom-controls .player-dmlist { -webkit-mask: -webkit-gradient(
|
||
linear,
|
||
0% 100%,
|
||
0% 0%,
|
||
from(rgba(255,255,255,1)),
|
||
to(rgba(255,255,255,0))
|
||
,color-stop(80%, rgba(255,255,255,1))
|
||
)}
|
||
/* 滚动条样式: 通过注释以下内容使得滚动条透明化 */
|
||
#player-con .-bottom-controls .player-dmlist::-webkit-scrollbar-track-piece{
|
||
/* background-color:#fff; */
|
||
-webkit-border-radius:0;
|
||
}
|
||
#player-con .-bottom-controls .player-dmlist::-webkit-scrollbar{
|
||
width:8px;
|
||
height:8px;
|
||
}
|
||
#player-con .-bottom-controls .player-dmlist::-webkit-scrollbar-thumb{
|
||
/* height:50px; */
|
||
/* background-color:#999; */
|
||
-webkit-border-radius:4px;
|
||
/* outline:2px solid #fff; */
|
||
outline-offset:-2px;
|
||
/* border: 2px solid #fff; */
|
||
}
|
||
#player-con .-bottom-controls .player-dmlist::-webkit-scrollbar-thumb:hover{
|
||
/* height:50px; */
|
||
/* background-color:#9f9f9f; */
|
||
-webkit-border-radius:4px;
|
||
}
|
||
#player-con .-bottom-controls .player-dmlist p {
|
||
padding: 6px 8px;
|
||
background-color: rgba(255,255,255,0.2);
|
||
border-radius: 8px;
|
||
margin: 4px 0;
|
||
word-break: break-all;
|
||
}
|
||
/* 发送弹幕 */
|
||
#player-con .-bottom-controls .danmu-control {
|
||
color: #ffffff;
|
||
margin-top: 4px;
|
||
position: relative;
|
||
display: table-cell;
|
||
font-size: 16px;
|
||
}
|
||
#player-con .-bottom-controls .danmu-control .danmu-input-wrap{
|
||
width:200px;
|
||
margin-right: 4px;
|
||
}
|
||
|
||
#player-con .-bottom-controls .danmu-control .danmu-input-wrap .danmu-input{
|
||
position: relative;
|
||
width: 100%;
|
||
display: inline-block;
|
||
}
|
||
|
||
#player-con .-bottom-controls .danmu-control .danmu-input-wrap .danmu-input input {
|
||
display: inline-block;
|
||
width: 100%;
|
||
padding-right: 40px;
|
||
box-sizing: border-box;
|
||
padding: 5px 40px 5px 5px;
|
||
background-color: rgba(130, 132, 138, 0.4);
|
||
border: 1px solid #c0c4cc;
|
||
font-size: 14px;
|
||
color: #fff;
|
||
border-radius: 3px;
|
||
}
|
||
#player-con .-bottom-controls .danmu-control .danmu-input-wrap .danmu-input .danmu-input-enter {
|
||
position: absolute;
|
||
right: 0;
|
||
top: 0;
|
||
border: 1px solid;
|
||
color: #fff;
|
||
background-color: #0f84fd;
|
||
border-color: #0f84fd;
|
||
font-size: 12px;
|
||
padding: 6px 7px;
|
||
display: inline-block;
|
||
height: 28px;
|
||
border-radius: 0 3px 3px 0;
|
||
cursor: pointer;
|
||
}
|
||
|
||
#player-con .-bottom-controls .danmu-control .iconfont {
|
||
font-size: 30px;
|
||
color:white;
|
||
font-weigh:bold;
|
||
cursor: pointer;
|
||
vertical-align: middle;
|
||
user-select: none;
|
||
line-height: initial;
|
||
}
|
||
#player-con .-bottom-controls .-products-box {
|
||
display: none;
|
||
width: 97%;
|
||
padding: 1% 1.5%;
|
||
border-radius: 8px;
|
||
background-color:#ffffff;
|
||
margin-top: 4px;
|
||
position: relative;
|
||
}
|
||
#player-con .-bottom-controls .-products-box .-header {
|
||
border-bottom: solid 1px #ccc;
|
||
padding-bottom: 4px;
|
||
padding-right: 24px;
|
||
font-size: 16px;
|
||
text-align: center;
|
||
}
|
||
#player-con .-bottom-controls .-products-box .-products {
|
||
overflow-x: auto;
|
||
white-space: nowrap;
|
||
}
|
||
#player-con .-bottom-controls .-hidden-products-box {
|
||
display: none;
|
||
padding: 1% 1.5%;
|
||
border-radius: 8px;
|
||
font-size: 16px;
|
||
background-color:#ffffff;
|
||
margin-top: 4px;
|
||
width: 80px;
|
||
}
|
||
/* 评星 */
|
||
.kh_hide{display:none;min-width:100%;position:absolute;right:0px;bottom:23px;background:#f5f5f5;filter:alpha(Opacity=90);-moz-opacity:0.9;opacity: 0.9; width: 100%; z-index: 10;
|
||
}
|
||
.kh_hide table {margin: auto;}
|
||
|
||
#list-con { background-color: #f5f5f5; }
|
||
|
||
#list-con>.-title {height: 36px; line-height: 36px; border-bottom: solid 1px #ccc; padding-bottom: 4px; }
|
||
#list-con>.-title>a {margin: 0 16px; font-size: 16px; padding-bottom: 4px; }
|
||
#list-con>.-title>a.-active { color: red; border-bottom: solid 2px; cursor: default; }
|
||
|
||
#list-con>.-content { overflow-y: auto; }
|
||
|
||
#list-con>.-content .-videos { padding: 8px; }
|
||
#list-con>.-content .-videos .-video { background-color: white; margin: 8px; border-radius: 8px; padding: 8px; height: 200px; }
|
||
#list-con>.-content .-videos .-video>a { cursor: pointer; }
|
||
#list-con>.-content .-videos .-video .-left, #list-con>.-content .-videos .-video .-right { display: inline-block; vertical-align: middle; width: 48%; position: relative; height: 200px; line-height: 200px; }
|
||
#list-con>.-content .-videos .-video .-right { float: right; }
|
||
#list-con>.-content .-videos .-video .-left .-pic { text-align: center; }
|
||
#list-con>.-content .-videos .-video .-left .-pic>img { border-radius: 8px; }
|
||
#list-con>.-content .-videos .-video .-left .-duration { position: absolute; right: 4px; bottom: 4px; width: 50px; height: 20px; line-height: 20px; text-align: center; background-color: rgba(0,0,0,0.5); color: white; border-radius: 10px; }
|
||
#list-con>.-content .-videos .-video .-right .-title1 { line-height: normal; font-size: 16px; }
|
||
#list-con>.-content .-videos .-video .-right .-title2 { line-height: normal; font-size: 16px; }
|
||
#list-con>.-content .-videos .-video .-right .-views { line-height: normal; position: absolute; bottom: 0; right: 0; }
|
||
#list-con>.-content .-videos .-video .-right .-views>span { vertical-align: middle; margin: 0 2px; }
|
||
#list-con>.-content .-videos .-nopc-info { margin: 8px; padding: 8px; }
|
||
#list-con>.-content .-videos .-nopc-info .-info1 { display: inline-block; vertical-align: middle; width: 75%; }
|
||
#list-con>.-content .-videos .-nopc-info .-info2 { display: inline-block; vertical-align: middle; width: 25%; text-align: right; }
|
||
|
||
#list-con>.-content .-products { padding: 8px; background-color: white; overflow-x: auto; overflow-y: hidden; white-space: nowrap; }
|
||
#list-con>.-content .-products .-product { font-size: 14px; }
|
||
#list-con>.-content .-products .-product a { cursor: pointer; }
|
||
#list-con>.-content .-products .-product span { margin: 0 2px; }
|
||
|
||
.showtext{
|
||
margin: auto;
|
||
color:#000000;
|
||
background-color:#ffffff;
|
||
width:200px;
|
||
text-align:center;
|
||
border-radius:25px 25px 25px 25px;
|
||
opacity:0.8;
|
||
filter:Alpha(opacity=80);
|
||
}
|
||
.on-linecss{
|
||
z-index: 999;
|
||
position: absolute;
|
||
height:30px;
|
||
line-height:30px;
|
||
top: 0;
|
||
left: 8px;
|
||
padding: 4px;
|
||
background-color: rgba(255,255,255,0.5);
|
||
border-radius: 8px;
|
||
margin: 4px 0;
|
||
word-break: break-all;
|
||
}
|
||
|
||
/* 动画：热度提升 */
|
||
@keyframes redu-add
|
||
{
|
||
0% {
|
||
opacity: 0.5;
|
||
top: 14px;
|
||
}
|
||
/* 80% {
|
||
opacity: 1;
|
||
top: -1px;
|
||
} */
|
||
100% {
|
||
opacity: 1;
|
||
top: -1px;
|
||
}
|
||
}
|
||
@-webkit-keyframes redu-add /* Safari 与 Chrome */
|
||
{
|
||
0% {
|
||
opacity: 0.5;
|
||
top: 14px;
|
||
}
|
||
/* 80% {
|
||
opacity: 1;
|
||
top: -1px;
|
||
} */
|
||
100% {
|
||
opacity: 1;
|
||
top: -1px;
|
||
}
|
||
}
|
||
.redu-add {
|
||
position: absolute;
|
||
color: red;
|
||
font-weight: bold;
|
||
top: -1px;
|
||
left: 1px;
|
||
}
|
||
.redu-add-animation {
|
||
animation: redu-add 0.5s;
|
||
-webkit-animation: redu-add 0.5s; /* Safari 与 Chrome */
|
||
}
|
||
/* 动画：热度降低 */
|
||
@keyframes redu-del
|
||
{
|
||
0% {
|
||
opacity: 1;
|
||
top: -1px;
|
||
}
|
||
100% {
|
||
opacity: 0;
|
||
top: -14px;
|
||
}
|
||
}
|
||
@-webkit-keyframes redu-del /* Safari 与 Chrome */
|
||
{
|
||
0% {
|
||
opacity: 1;
|
||
top: -1px;
|
||
}
|
||
100% {
|
||
opacity: 0;
|
||
top: -14px;
|
||
}
|
||
}
|
||
.redu-del {
|
||
position: absolute;
|
||
color: black;
|
||
font-weight: bold;
|
||
left: 1px;
|
||
top: -1px;
|
||
}
|
||
.redu-del-animation {
|
||
animation: redu-del 1s;
|
||
-webkit-animation: redu-del 1s; /* Safari 与 Chrome */
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="pcki-page">
|
||
<div id="on-line" class="on-linecss"></div>
|
||
<!-- <div id="player-dm" class="player-dmcss"></div> -->
|
||
<div id="player-con" class="prism-player">
|
||
<div class="-bottom-controls">
|
||
<div class="player-dmlist"></div>
|
||
<div class="danmu-control">
|
||
<div class="danmu-input-wrap" style="display: inline-block;">
|
||
<div class="danmu-input">
|
||
<input type="text" placeholder="输入弹幕">
|
||
<button class="danmu-input-enter">发送</button>
|
||
</div>
|
||
</div>
|
||
<i class="iconfont icon-danmu-close"></i>
|
||
<div class="player-tooltip close">关闭弹幕</div>
|
||
<i class="iconfont icon-danmu-open" style="display: none;"></i>
|
||
<div class="player-tooltip open">打开弹幕</div>
|
||
</div>
|
||
<div class="-products-box">
|
||
<div class="-header"></div>
|
||
<div class="-products"></div>
|
||
</div>
|
||
<div class="-hidden-products-box"><a href="javascript:;" onclick="openCplist()">产品列表...</a></div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<div id="player-con-close"><a href="javascript: closeFullVideo()"><i class="layui-icon layui-icon-close"></i></a></div>
|
||
|
||
<div id="list-con">
|
||
<div class="-title">
|
||
<a list-id="1" href="javascript: switchList(1)" class="-active">产品列表</a><a list-id="2" href="javascript: switchList(2)">录像</a href="javascript: switchList(2)">
|
||
</div>
|
||
<div class="-content">
|
||
<div class="-products layui-anim layui-anim-up"></div>
|
||
<div class="-videos layui-anim layui-anim-up" style="display: none;"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</body>
|
||
<script src="layuiadmin/layui/layui.js"></script>
|
||
<script src="js/function.js"></script>
|
||
<!-- universal -->
|
||
<script src="js/universal/universal.js"></script>
|
||
<script src="js/aliyun-rts-sdk.js"></script>
|
||
<script>
|
||
window.onload = function () {
|
||
document.getElementsByTagName('body')[0].style.zoom=0.999;
|
||
}
|
||
document.onkeydown = function (e) { // 回车提交表单
|
||
layui.use("jquery", function() {
|
||
var $ = layui.$
|
||
|
||
var theEvent = window.event || e;
|
||
var code = theEvent.keyCode || theEvent.which || theEvent.charCode;
|
||
if (code == 13) {
|
||
$(".danmu-input-enter").click();
|
||
}
|
||
|
||
});
|
||
|
||
}
|
||
|
||
|
||
//保存评价
|
||
function save_like (elem, khid){
|
||
layui.use("jquery", function() {
|
||
var $ = layui.$
|
||
|
||
var hidev = $(elem).find(".ixj").val()
|
||
,hidevz = $(elem).find(".izxj").val()
|
||
if(hidev != 5){
|
||
var url="./?_m=client_pj&_a=save_pj&khid="+khid+"&race=5";
|
||
$.ajax({
|
||
url: url
|
||
,success: function() {
|
||
|
||
}
|
||
})
|
||
var old_zxj = parseInt(hidevz ? hidevz : "0")
|
||
,new_zxj = old_zxj + (5 - parseInt(hidev ? hidev : "0"))
|
||
$(elem).find(".zxj").html("<span class='-zxjv'>" + old_zxj + "</span><span class='redu-add redu-add-animation'>+5</span>")
|
||
$(elem).find(".ixj").val(5)
|
||
$(elem).find(".izxj").val(new_zxj)
|
||
// 热度增加的动画结束事件
|
||
var redu_elem = $(elem).find(".redu-add")[0]
|
||
redu_elem.addEventListener("animationend",function(e){
|
||
var new_zxj = $(this).parent().nextAll(".izxj").val()
|
||
$(this).parent().find(".-zxjv").html(new_zxj)
|
||
$(this).parent().prev().find("img").attr("src", "images/star.png")
|
||
$(this).hide()
|
||
refresh()
|
||
}, false)
|
||
}else{
|
||
if(confirm("您已经点赞过该款，您要取消点赞吗？")) {
|
||
var url="index.php?_m=client_pj&_a=del_pj_race&khid="+khid;
|
||
$.ajax({
|
||
url: url
|
||
,success: function() {
|
||
|
||
}
|
||
})
|
||
var old_zxj = parseInt(hidevz ? hidevz : "0")
|
||
,new_zxj = old_zxj - 5
|
||
$(elem).find(".zxj").html("<span class='-zxjv'>"+old_zxj+"</span><span class='redu-del redu-del-animation'>-5</span>")
|
||
$(elem).find(".ixj").val(0)
|
||
$(elem).find(".izxj").val(new_zxj)
|
||
|
||
$(elem).find(".icon img").attr("src", "images/star1.png")
|
||
$(elem).find(".zxj .-zxjv").html(new_zxj)
|
||
// 热度降低的动画结束事件
|
||
var redu_elem = $(elem).find(".redu-del")[0]
|
||
redu_elem.addEventListener("animationend",function(e){
|
||
$(this).hide()
|
||
refresh()
|
||
}, false);
|
||
}
|
||
}
|
||
});
|
||
}
|
||
function IsPC() {
|
||
var userAgentInfo = navigator.userAgent;
|
||
var Agents = ["Android", "iPhone",
|
||
"SymbianOS", "Windows Phone",
|
||
"iPad", "iPod"];
|
||
var flag = true;
|
||
for (var v = 0; v < Agents.length; v++) {
|
||
if (userAgentInfo.indexOf(Agents[v]) > 0) {
|
||
flag = false;
|
||
break;
|
||
}
|
||
}
|
||
return flag;
|
||
}
|
||
var danmukuList = []
|
||
|
||
var global_appzbconfig="n";
|
||
var global_list_switch = 1 // 直播下列表选择
|
||
,global_player;
|
||
var global_videos = [] // 录像
|
||
var dqdz_url;
|
||
var dqdz_count=0;
|
||
var global_watermark = { // 水印
|
||
username: "",
|
||
is_sy: "n"
|
||
}
|
||
var global_zb_is_fullscreen = false // 直播是否全屏标志
|
||
var global_is_dm_auto_scroll = true // 弹幕列表是否自动滚至底部
|
||
var cover_text_sys="";
|
||
var cover_text_time_sys=0;
|
||
//定时器
|
||
var timeInterval1;
|
||
//弹幕用到
|
||
var dm_Interval;
|
||
var systime;
|
||
var currentId=0;
|
||
var speedVal = Math.random() * 5000 + 10000;
|
||
var rwidth;
|
||
var rheight;
|
||
var colorSize = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 'a', 'b', 'c', 'd', 'e', 'f'];
|
||
var dragdata = {
|
||
dragging: false
|
||
,tLeft: 0
|
||
,tTop: 0
|
||
}
|
||
var global_cplist_refresh_mark = "" // 判断产品列表内容是否需要刷新的标志
|
||
|
||
//产品列表
|
||
function refresh() {
|
||
layui.use("jquery", function() {
|
||
var $ = layui.$
|
||
// 首先获取产品列表总体信息与每个单品的3项数据，判断单品数据与本地单品是否有出入，如果有，则重新获取产品列表
|
||
$.ajax({
|
||
url:"./?_m=zbuser&_a=get_khlist1",
|
||
contentType: "application/json",
|
||
method: 'POST',
|
||
success: function (res) {
|
||
var res_1 = $.parseJSON(res);
|
||
// console.log(["产品列表1，简略：", res_1])
|
||
|
||
// 不管产品列表内容为何，都要刷新头部
|
||
$("#player-con .-bottom-controls .-products-box .-header").html("<span style='float: left;'>产品列表</span><span>已定</span><span>"+(res_1.ydjs?res_1.ydjs:"0")+"</span><span>件,金额"+(res_1.ydje?res_1.ydje:"0")+"元,金额完成率:"+res_1.wcl+"</span><span style='position: absolute; right: 8px; top: 8px; cursor: pointer;'><a href='javascript:;' onclick='closeCplist()'><i class='layui-icon layui-icon-close'></i></a></span>")
|
||
|
||
// 判断第一次获取的产品列表信息目录与本地的是否有出入
|
||
var temp_cplist_refresh_mark = ""
|
||
for (var i = 0; i < res_1.khlist.length; i++) {
|
||
var dk = res_1.khlist[i]
|
||
temp_cplist_refresh_mark += dk.khid + "_" + dk.colorno + "|"
|
||
}
|
||
|
||
if (global_cplist_refresh_mark != temp_cplist_refresh_mark) { // 有出入，获取新的产品列表
|
||
global_cplist_refresh_mark = temp_cplist_refresh_mark
|
||
$.ajax({
|
||
url:"./?_m=zbuser&_a=get_khlist",
|
||
contentType: "application/json",
|
||
method: 'POST',
|
||
success: function (res) {
|
||
var res_2 = $.parseJSON(res);
|
||
//console.log(["产品列表2，详细：", res_2])
|
||
|
||
if(res_2.khnum > 0){
|
||
fillProductsList(res_2.khlist, res_2.arr_zbxs)
|
||
}else{
|
||
$("#player-con .-bottom-controls .-hidden-products-box").hide()
|
||
$("#player-con .-bottom-controls .-products-box").hide();
|
||
}
|
||
}
|
||
})
|
||
} else { // 无出入
|
||
for (var i = 0; i < res_1.khlist.length; i++) {
|
||
var dk = res_1.khlist[i]
|
||
for (var j = 0; j < res_1.arr_zbxs.length; j++) {
|
||
var zbx = res_1.arr_zbxs[j]
|
||
$("#product-"+dk.khid+"-"+dk.colorno+" .-"+zbx.no+"v").html(dk[zbx.no] ? dk[zbx.no] : "0")
|
||
}
|
||
$("#product-"+dk.khid+"-"+dk.colorno+" .icon img").attr("src", (parseInt(dk.xj ? dk.xj : "0") < 5 ? "images/star1.png" : "images/star.png"))
|
||
$("#product-"+dk.khid+"-"+dk.colorno+" .ixj").val(dk.xj ? dk.xj : "0")
|
||
$("#product-"+dk.khid+"-"+dk.colorno+" .izxj").val(dk.zxj ? dk.zxj : "0")
|
||
}
|
||
}
|
||
}
|
||
})
|
||
// $.ajax({
|
||
// url:"./?_m=zbuser&_a=get_khlist",
|
||
// contentType: "application/json",
|
||
// method: 'POST',
|
||
// success: function (res) {
|
||
// var res = $.parseJSON(res);
|
||
// // console.log(["产品列表", res])
|
||
|
||
// var temp_cplist_refresh_mark = ""
|
||
// // 不管产品列表内容为何，都要刷新头部、产品三项
|
||
// $("#player-con .-bottom-controls .-products-box .-header").html("<span style='float: left;'>产品列表</span><span>已定</span><span>"+(res.ydjs?res.ydjs:"0")+"</span><span>件,金额"+(res.ydje?res.ydje:"0")+"元,金额完成率:"+res.wcl+"</span><span style='position: absolute; right: 8px; top: 8px; cursor: pointer;'><a href='javascript:;' onclick='closeCplist()'><i class='layui-icon layui-icon-close'></i></a></span>")
|
||
// for (var i = 0; i < res.khlist.length; i++) {
|
||
// var dk = res.khlist[i]
|
||
// temp_cplist_refresh_mark += dk.khid + "_" + dk.colorno + "|"
|
||
// for (var j = 0; j < res.arr_zbxs.length; j++) {
|
||
// var zbx = res.arr_zbxs[j]
|
||
// $("#product-"+dk.khid+"-"+dk.colorno+" .-"+zbx.no+"v").html(dk[zbx.no] ? dk[zbx.no] : "0")
|
||
// }
|
||
// $("#product-"+dk.khid+"-"+dk.colorno+" .icon img").attr("src", (parseInt(dk.xj ? dk.xj : "0") < 5 ? "images/star1.png" : "images/star.png"))
|
||
// $("#product-"+dk.khid+"-"+dk.colorno+" .ixj").val(dk.xj ? dk.xj : "0")
|
||
// $("#product-"+dk.khid+"-"+dk.colorno+" .izxj").val(dk.zxj ? dk.zxj : "0")
|
||
// }
|
||
|
||
// if (global_cplist_refresh_mark != temp_cplist_refresh_mark) {
|
||
// global_cplist_refresh_mark = temp_cplist_refresh_mark
|
||
// if(res.khnum > 0){
|
||
// fillProductsList(res.khlist, res.arr_zbxs)
|
||
// }else{
|
||
// $("#player-con .-bottom-controls .-hidden-products-box").hide()
|
||
// $("#player-con .-bottom-controls .-products-box").hide();
|
||
// }
|
||
// }
|
||
// }
|
||
// })
|
||
})
|
||
|
||
}
|
||
|
||
//
|
||
//开启定时任务
|
||
timeInterval1=setInterval(function() {
|
||
refresh();
|
||
}, 5000)
|
||
|
||
|
||
//刷新在线用户
|
||
function refresh_users() {
|
||
layui.use("jquery", function() {
|
||
var $ = layui.$
|
||
$.ajax({
|
||
url:"./?_m=zbuser&_a=get_userlist",
|
||
contentType: "application/json",
|
||
method: 'POST',
|
||
success: function (res) {
|
||
var res=$.parseJSON(res);
|
||
if(res.usersListNum>0){
|
||
$('#on-line').html('在线:'+res.usersListNum+'人');
|
||
}else{
|
||
$('#on-line').html('在线:0人');
|
||
}
|
||
}
|
||
});
|
||
});
|
||
}
|
||
var userrefresh=setInterval(function() {
|
||
refresh_users();
|
||
}, 5000);
|
||
|
||
|
||
function refresh_state() {
|
||
layui.use("jquery", function() {
|
||
var $ = layui.$
|
||
var state = global_player.getStatus();
|
||
var cilentTime = Date.parse(new Date())/1000;
|
||
|
||
setCookie("system_hzh_current_state", state);
|
||
if(cilentTime>cover_text_time_sys){
|
||
var show_text="等待直播开始...";
|
||
|
||
}else{
|
||
var show_text="直播时间<br>"+cover_text_sys;
|
||
}
|
||
if(state=="init" || state=="ready"){
|
||
$('#player-con .prism-live-display').html('LIVE <span style="color:red;">直播未开始</span>');
|
||
$('#player-con .prism-big-play-btn playing').css('display',"block");
|
||
$('#player-con .prism-info-display').html('<div class="showtext">'+show_text+'</div>');
|
||
}else if(state=="playing" || state=="play"){
|
||
$('#player-con .prism-live-display').html('LIVE <span style="color:green;">直播中</span>');
|
||
$('#player-con .prism-big-play-btn playing').css('display',"none");
|
||
$('#player-con .prism-info-display').html('');
|
||
}else if(state=="pause"){
|
||
$('#player-con .prism-live-display').html('LIVE <span style="color:green;">暂停中</span>');
|
||
$('#player-con .prism-big-play-btn playing').css('display',"none");
|
||
$('#player-con .prism-info-display').html('');
|
||
}else if(state=="loading"){
|
||
$('#player-con .prism-live-display').html('LIVE <span style="color:red;">加载中</span>');
|
||
$('#player-con .prism-big-play-btn playing').css('display',"block");
|
||
$('#player-con .prism-info-display').html('<div class="showtext">'+show_text+'</div>');
|
||
dqdz_count++;
|
||
if(dqdz_count%3==0){
|
||
var url1="./?_m=zbuser&_a=get_pullurl";
|
||
$.ajax({
|
||
url:url1,
|
||
contentType: "application/json",
|
||
method: 'POST',
|
||
success: function (result) {
|
||
var result=$.parseJSON(result);
|
||
|
||
|
||
if(result.appzbconfig=="y"){
|
||
global_player.loadByUrl(result.pull_url4);
|
||
var aliRts = new AliRTS()
|
||
var v1=$("#player-con video");
|
||
aliRts.startLiveStream(result.pull_url4,v1[0]);
|
||
}else{
|
||
if(IsPC()== true){
|
||
var pullurl=result.pull_url2;
|
||
}else{
|
||
var pullurl=result.pull_url3;
|
||
}
|
||
if(dqdz_url!=pullurl){
|
||
global_player.loadByUrl(pullurl);
|
||
}
|
||
}
|
||
|
||
|
||
}
|
||
});
|
||
}
|
||
}else{
|
||
$('#player-con .prism-live-display').html('LIVE <span style="color:red;">直播未开始</span>');
|
||
$('#player-con .prism-big-play-btn playing').css('display',"block");
|
||
$('#player-con .prism-info-display').html('<div class="showtext">'+show_text+'</div>');
|
||
}
|
||
});
|
||
}
|
||
|
||
//setInterval(function() {
|
||
// refresh_state();
|
||
//}, 1000)
|
||
|
||
function openDkSingle(khid) {
|
||
if(face=='2')
|
||
var url1="zb_dk_single_qj.htm";
|
||
else
|
||
var url1="zb_dk_single.htm";
|
||
|
||
layui.use(['layer', 'jquery'], function(){
|
||
var layer = parent.layer
|
||
,$ = layui.jquery
|
||
|
||
var video_elem = $("#playto-con44 video")[0]
|
||
var index = layer.open({
|
||
type: 2,
|
||
title: '',
|
||
area: ["100%", "80%"],
|
||
content: url1+"?khid="+khid,
|
||
offset: 'b',
|
||
closeBtn: 0,
|
||
shadeClose: true,
|
||
anim: 2
|
||
// ,success: function() {
|
||
// // 当 没有打开自定义画中画，并且正在直播，并且支持原生画中画 时，自动启动原生画中画
|
||
// var video_elem = $("#player-con video")[0]
|
||
// if ($("#layerhzh", top.document).length <= 0 && global_player.getStatus() == "playing") {
|
||
// if (document.pictureInPictureEnabled) { // 调用Chrome的原生画中画
|
||
// video_elem.requestPictureInPicture()
|
||
// // video_elem.addEventListener('leavepictureinpicture', function() { // 退出画中画时，不能停止直播
|
||
// // global_player.play()
|
||
// // })
|
||
// } else if (typeof video_elem.webkitSupportsPresentationMode == "function" && video_elem.webkitSupportsPresentationMode("picture-in-picture")) { // 调用iOS的原生画中画
|
||
// video_elem.webkitSetPresentationMode("picture-in-picture")
|
||
// }
|
||
// }
|
||
// }
|
||
// ,end: function() {
|
||
// var video_elem = $("#player-con video")[0]
|
||
// if (document.pictureInPictureEnabled) { // 关闭Chrome的原生画中画
|
||
// document.exitPictureInPicture()
|
||
// } else if (typeof video_elem.webkitSupportsPresentationMode == "function" && video_elem.webkitSupportsPresentationMode("picture-in-picture")) { // 关闭iOS的原生画中画
|
||
// video_elem.webkitSetPresentationMode("inline")
|
||
// }
|
||
// }
|
||
});
|
||
});
|
||
}
|
||
|
||
function show_createhzh(hzhurl,cate){
|
||
// global_player.loadByUrl("http://47.114.132.88/1.mp4")
|
||
|
||
layui.use(['layer', 'jquery'], function(){
|
||
|
||
var layer = parent.layer,
|
||
$ = layui.jquery
|
||
if(window.screen.width<450){
|
||
var index_hzh = layer.open({
|
||
type: 2,
|
||
id: 'layerhzh',
|
||
offset: 'rb',
|
||
area: ['210px','280px'],
|
||
title: '画中画',
|
||
content: ["zbuser_hzh.htm?appzbconfig="+global_appzbconfig+"&hzhurl="+encodeURIComponent(decodeURIComponent(hzhurl))+"&cate="+cate+"&is_sy="+global_watermark.is_sy+"&username="+global_watermark.username,"no"],
|
||
shade: 0,
|
||
anim: 2,
|
||
zIndex: 20200302,
|
||
resize:true,
|
||
success: function(layero, index){
|
||
if (window.parent.touchmoveHzh) window.parent.touchmoveHzh(layero.attr("id"))
|
||
if (window.parent.resizeHzh) window.parent.resizeHzh(layero.attr("id"))
|
||
}
|
||
});
|
||
}else{
|
||
var index_hzh = layer.open({
|
||
type: 2,
|
||
id: 'layerhzh',
|
||
offset: 'rb',
|
||
area: ['400px', '300px'],
|
||
title: '画中画',
|
||
content: ["zbuser_hzh.htm?appzbconfig="+global_appzbconfig+"&hzhurl="+encodeURIComponent(decodeURIComponent(hzhurl))+"&cate="+cate+"&is_sy="+global_watermark.is_sy+"&username="+global_watermark.username,"no"],
|
||
shade: 0,
|
||
anim: 2,
|
||
zIndex: 20200302,
|
||
resize:true,
|
||
success: function(layero, index){
|
||
if (window.parent.touchmoveHzh) window.parent.touchmoveHzh(layero.attr("id"))
|
||
if (window.parent.resizeHzh) window.parent.resizeHzh(layero.attr("id"))
|
||
}
|
||
,full: function(layero, index) {
|
||
//console.log([layero, index])
|
||
}
|
||
});
|
||
}
|
||
|
||
|
||
})
|
||
}
|
||
|
||
var face='4';
|
||
//
|
||
layui.config({
|
||
base: './layuiadmin/'
|
||
}).extend({
|
||
index: 'lib/index'
|
||
}).use(['index', 'user'], function(){
|
||
var $ = layui.$
|
||
,setter = layui.setter
|
||
,admin = layui.admin
|
||
,form = layui.form;
|
||
|
||
var url1="./?_m=zbuser";
|
||
$.ajax({
|
||
url:url1,
|
||
contentType: "application/json",
|
||
method: 'POST',
|
||
success: function (res) {
|
||
var res=$.parseJSON(res);
|
||
|
||
face=res.face;
|
||
|
||
global_watermark.is_sy = res.is_sy
|
||
global_watermark.username = res.username
|
||
|
||
// safari中iframe内的页面宽度会莫名其妙多一点出来，此处强制将本页宽度修正
|
||
$(".pcki-page").width($(self.frameElement).parent().width())
|
||
// 修复iphone端，点击按钮时自动滚到页面顶部以及附带的其他一些问题
|
||
$(".pcki-page").height($(self.frameElement).parent().height())
|
||
|
||
// 禁止frame外层滚动，以阻止小滚动
|
||
$(self.frameElement).parent().css("overflow", "hidden")
|
||
|
||
if(res.code==0){
|
||
//------------------本页返回的错误信息
|
||
layer.msg(res.msg);
|
||
}else if(res.code==1){
|
||
//------------------系统错误
|
||
var msg=res.msg;
|
||
var url2="error.htm?msg="+res.msg+"&btn_title="+res.btn_title+"&btn_url="+res.btn_url;
|
||
window.parent.location.href=url2;
|
||
}else if(res.code==2){
|
||
//------------------重新登录
|
||
var url2="login.htm?error_msg="+res.msg;
|
||
window.parent.location.href=url2;
|
||
}else{
|
||
|
||
rwidth=$('#player-con .-bottom-controls .player-dmlist').width();
|
||
rheight=$('#player-con .-bottom-controls .player-dmlist').height();
|
||
//setTimeout(function() {
|
||
global_appzbconfig=res.appzbconfig;
|
||
if(res.appzbconfig=="y"){
|
||
dqdz_url=res.pull_url4;
|
||
global_player = new Aliplayer({
|
||
"id": "player-con",
|
||
"source": dqdz_url,
|
||
"width": "100%",
|
||
"height": "300px",
|
||
"autoplay": true,
|
||
"isLive": true,
|
||
"rePlay": false,
|
||
"playsinline": true,
|
||
"preload": true,
|
||
"controlBarVisibility": 'click',
|
||
"showBarTime": '3000000',
|
||
"useH5Prism":true,
|
||
"useFlashPrism":false,
|
||
"liveRetry":3,
|
||
"skinLayout": [
|
||
{
|
||
"name": "bigPlayButton",
|
||
"align": "blabs",
|
||
"x": 30,
|
||
"y": 80
|
||
},
|
||
{
|
||
"name": "infoDisplay"
|
||
},
|
||
{
|
||
"name": "controlBar",
|
||
"align": "blabs",
|
||
"x": 0,
|
||
"y": 0,
|
||
"children": [
|
||
{
|
||
"name": "liveDisplay",
|
||
"align": "tlabs",
|
||
"x": 15,
|
||
"y": 6
|
||
},
|
||
{
|
||
"name": "volume",
|
||
"align": "tr",
|
||
"x": 5,
|
||
"y": 10
|
||
}
|
||
]
|
||
}
|
||
]
|
||
}, function (player) {
|
||
//console.log("The player is created");
|
||
})
|
||
|
||
var aliRts = new AliRTS()
|
||
var v1=$("#player-con video");
|
||
|
||
aliRts.startLiveStream(dqdz_url,v1[0]);
|
||
aliRts.subscriber.audioManager.element.play();
|
||
aliRts.subscriber.videoManager.element.play();
|
||
console.log(aliRts.subscriber.audioManager)
|
||
console.log(aliRts.subscriber.videoManager)
|
||
}else{
|
||
if(IsPC()== true){
|
||
dqdz_url=res.pull_url2;
|
||
global_player = new Aliplayer({
|
||
"id": "player-con",
|
||
"source": res.pull_url2,
|
||
"width": "100%",
|
||
"height": "300px",
|
||
"autoplay": true,
|
||
"isLive": true,
|
||
"rePlay": false,
|
||
"playsinline": true,
|
||
"preload": true,
|
||
"controlBarVisibility": 'click',
|
||
"showBarTime": '3000000',
|
||
"useH5Prism":true,
|
||
"useFlashPrism":false,
|
||
"liveRetry":3,
|
||
"skinLayout": [
|
||
{
|
||
"name": "bigPlayButton",
|
||
"align": "blabs",
|
||
"x": 30,
|
||
"y": 80
|
||
},
|
||
{
|
||
"name": "infoDisplay"
|
||
},
|
||
{
|
||
"name": "controlBar",
|
||
"align": "blabs",
|
||
"x": 0,
|
||
"y": 0,
|
||
"children": [
|
||
{
|
||
"name": "liveDisplay",
|
||
"align": "tlabs",
|
||
"x": 15,
|
||
"y": 6
|
||
},
|
||
{
|
||
"name": "volume",
|
||
"align": "tr",
|
||
"x": 5,
|
||
"y": 10
|
||
}
|
||
]
|
||
}
|
||
]
|
||
}, function (player) {
|
||
//console.log("The player is created");
|
||
})
|
||
}else{
|
||
dqdz_url=res.pull_url3;
|
||
global_player = new Aliplayer({
|
||
"id": "player-con",
|
||
"source": res.pull_url3,
|
||
"width": "100%",
|
||
"height": "300px",
|
||
"autoplay": true,
|
||
"isLive": true,
|
||
"rePlay": false,
|
||
"playsinline": true,
|
||
"preload": true,
|
||
"controlBarVisibility": 'click',
|
||
"showBarTime": '3000000',
|
||
"useH5Prism":true,
|
||
"useFlashPrism":false,
|
||
"liveRetry":3,
|
||
"skinLayout": [
|
||
{
|
||
"name": "bigPlayButton",
|
||
"align": "blabs",
|
||
"x": 30,
|
||
"y": 80
|
||
},
|
||
{
|
||
"name": "infoDisplay"
|
||
},
|
||
{
|
||
"name": "controlBar",
|
||
"align": "blabs",
|
||
"x": 0,
|
||
"y": 0,
|
||
"children": [
|
||
{
|
||
"name": "liveDisplay",
|
||
"align": "tlabs",
|
||
"x": 15,
|
||
"y": 6
|
||
},
|
||
{
|
||
"name": "volume",
|
||
"align": "tr",
|
||
"x": 5,
|
||
"y": 10
|
||
}
|
||
]
|
||
}
|
||
]
|
||
}, function (player) {
|
||
//console.log("The player is created");
|
||
});
|
||
}
|
||
}
|
||
global_player.on("pause", function() { // 强制直播进行，无法暂停
|
||
global_player.play()
|
||
})
|
||
//}, 500);
|
||
|
||
|
||
// 全屏
|
||
$('#player-con .prism-volume').before('<div id="fullscreen" style="float:right;margin-right:15px; margin-top:10px;height:28px;line-height:28px; "><a href="javascript:void(0);" style="color:#ffffff;" onclick="show_fullscreen()"><svg t="1582700473916" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6096" width="28" height="28"><path d="M960.096 927.914V672.297c0-32.847-32.029-32.847-32.029-32.847s-32.029 0-31.926 32.847v179.075L630.803 587.058c-23.228-23.229-45.843-0.614-45.843-0.614s-22.614 22.614 0.614 45.843l265.03 264.11h-177.64c-32.848 0-32.848 32.028-32.848 32.028s0 32.03 32.848 31.927h255.001s0.511 0 1.432-0.103c10.233-0.511 17.09-4.195 21.592-9.004 4.707-4.503 8.39-11.257 8.902-21.387 0.103-1.023 0.103-1.535 0.103-1.535s0.102-0.102 0.102-0.41zM630.803 436.737l264.11-265.03v177.642c0 32.847 32.029 32.847 32.029 32.847s32.028 0 31.926-32.847V94.346s0-0.51-0.102-1.432c-0.512-10.233-4.196-17.089-9.005-21.591-4.503-4.707-11.256-8.391-21.387-8.903-1.023-0.102-1.535-0.102-1.535-0.102H670.711c-32.847 0-32.847 32.029-32.847 32.029s0 32.029 32.847 31.926h179.075L585.574 391.508c-23.228 23.229-0.614 45.843-0.614 45.843s22.717 22.615 45.843-0.614zM173.088 126.785H350.73c32.848 0 32.848-32.029 32.848-32.029s0-32.029-32.848-31.926H95.728s-0.511 0-1.432 0.102c-10.336 0.512-17.09 4.195-21.592 8.903-4.707 4.502-8.39 11.256-8.902 21.386-0.103 1.023-0.103 1.535-0.103 1.535v256.128c0 32.847 32.03 32.847 32.03 32.847s32.028 0 31.926-32.847V171.809l265.337 264.315c23.229 23.228 45.843 0.613 45.843 0.613s22.615-22.614-0.614-45.843l-265.133-264.11z m218.881 459.761l-264.11 265.03v-177.64c0-32.848-32.028-32.848-32.028-32.848s-32.03 0-31.927 32.848v255.001s0 0.512 0.102 1.433c0.512 10.232 4.196 17.088 9.005 21.59 4.503 4.708 11.256 8.392 21.387 8.903 1.023 0.103 1.535 0.103 1.535 0.103H352.06c32.847 0 32.847-32.03 32.847-32.03s0-32.028-32.847-31.926H172.986l264.212-265.235c23.229-23.228 0.614-45.843 0.614-45.843s-22.717-22.614-45.843 0.614z" fill="#ffffff" p-id="6097"></path></svg></a></div>');
|
||
// 画中画
|
||
$('#player-con .prism-volume').before('<div id="creatediv" style="float:right;margin-right:10px; margin-top:10px;height:28px;line-height:28px; "><a href="javascript:void(0);" style="color:#ffffff;" id="hzh"><svg t="1582699091002" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2686" width="28" height="28"><path d="M358.4 921.6H102.4a51.2 51.2 0 0 1-51.2-51.2V153.6a51.2 51.2 0 0 1 51.2-51.2h819.2a51.2 51.2 0 0 1 51.2 51.2v230.4a25.6 25.6 0 0 1-25.6 25.6h-51.2a25.6 25.6 0 0 1-25.6-25.6V204.8H153.6v614.4h230.4a25.6 25.6 0 0 1 25.6 25.6v51.2a25.6 25.6 0 0 1-25.6 25.6H358.4z m256-307.2v204.8h307.2v-204.8h-307.2z m-51.2-102.4h409.6a51.2 51.2 0 0 1 51.2 51.2v307.2a51.2 51.2 0 0 1-51.2 51.2h-409.6a51.2 51.2 0 0 1-51.2-51.2v-307.2a51.2 51.2 0 0 1 51.2-51.2z" p-id="2687" fill="#ffffff"></path></svg></a></div>');
|
||
// 水印
|
||
if (global_watermark.is_sy == "y")
|
||
// 其他优先级z-index：
|
||
// -bottom-controls: 901
|
||
// prism-info-display: 900
|
||
$("#player-con").append("<div class='watermark' style='position: absolute; font-size: 64px; color: rgba(183,183,183,0.3); top: 0; left: 0; width: 100%; height: 100%; text-align: center; z-index: 0;'><span>"+global_watermark.username+"</span></div>")
|
||
|
||
// global_player.setPlayerSize("100%", "300px")
|
||
// $("#player-con .watermark").css("line-height", "300px")
|
||
|
||
$("#list-con").show()
|
||
|
||
res.list = {videos:res.videosList,khlists:res.khlist}
|
||
//console.log(["Zbuser", res])
|
||
|
||
//console.log(res.list);
|
||
setTimeout(function() {
|
||
fillVideos(res.list.videos)
|
||
},500);
|
||
|
||
if(res.usersListNum>0){
|
||
$('#on-line').html('在线:'+res.usersListNum+'人');
|
||
}else{
|
||
$('#on-line').html('在线:0人');
|
||
}
|
||
fillProductsList(res.list.khlists, res.arr_zbxs);
|
||
|
||
setAllHeight();
|
||
|
||
$.ajax({
|
||
url: './?_m=tanmu&_a=getCilentTime',
|
||
data: {},
|
||
success: function (backData) {
|
||
systime = backData;
|
||
}
|
||
})
|
||
|
||
dm_Interval=setInterval(add, 2000);
|
||
//先移除原先绑定
|
||
document.querySelector(".danmu-input-enter").onclick = null;
|
||
$(".danmu-input-enter").click(function(){
|
||
var barrageVal=document.querySelector(".danmu-input input").value;
|
||
if(barrageVal!=""){
|
||
$.ajax({
|
||
url: './?_m=tanmu&_a=save_dm',
|
||
data: {
|
||
value: barrageVal
|
||
},
|
||
success: function (backData) {
|
||
document.querySelector(".danmu-input input").value='';
|
||
}
|
||
})
|
||
}
|
||
});
|
||
|
||
//画中画
|
||
$("#hzh").click(function(){
|
||
//show_createhzh(dqdz_url,"zb");
|
||
});
|
||
|
||
//设置cookie
|
||
//菜单切换时画中画地址
|
||
setCookie("system_open_hzh_url",dqdz_url);
|
||
setCookie("system_current_hzh_username_sy", global_watermark.username + '||' + global_watermark.is_sy);
|
||
//提示文字
|
||
if(res.cover_text){
|
||
cover_text_sys=res.cover_text;
|
||
cover_text_time_sys=res.cover_text_time;
|
||
var cilentTime = Date.parse(new Date())/1000;
|
||
|
||
if(cilentTime>cover_text_time_sys){
|
||
$('#player-con .prism-info-display').html('<div class="showtext">等待直播开始...</div>');
|
||
}else{
|
||
$('#player-con .prism-info-display').html('<div class="showtext">直播时间<br>'+res.cover_text+'</div>');
|
||
}
|
||
|
||
}
|
||
|
||
//
|
||
$('.icon-danmu-close').click(function(){
|
||
$('#player-con .-bottom-controls .player-dmlist').html('');
|
||
clearInterval(dm_Interval);
|
||
$(".icon-danmu-close").hide();
|
||
$(".icon-danmu-open").show();
|
||
});
|
||
|
||
$('.icon-danmu-open').click(function(){
|
||
$(".icon-danmu-close").show();
|
||
$(".icon-danmu-open").hide();
|
||
dm_Interval=setInterval(add, 2000);
|
||
|
||
})
|
||
}
|
||
},
|
||
error: function () {
|
||
layui.layer.msg("与服务器通信失败！");
|
||
}
|
||
})
|
||
|
||
$("#player-con .-bottom-controls .player-dmlist").scroll(function(event) {
|
||
var scroll_height = event.target.scrollHeight // 滚动内容高度
|
||
,client_height = event.target.clientHeight // 滚动壳高度
|
||
,scroll_top = event.target.scrollTop // 滚动偏移
|
||
// 当 scroll_top >= (scroll_height - client_height) 时，即表示滚动条触底（越底）了
|
||
if (scroll_top >= (scroll_height - client_height)) { // 滚动条触底，开启弹幕自动滚动
|
||
global_is_dm_auto_scroll = true
|
||
} else { // 否则代表用户正在手动滚动，此时关闭自动滚动
|
||
global_is_dm_auto_scroll = false
|
||
}
|
||
})
|
||
|
||
$(self.frameElement).parent().on("resize", function() {
|
||
// safari中iframe内的页面宽度会莫名其妙多一点出来，此处强制将本页宽度修正
|
||
$(".pcki-page").width($(self.frameElement).parent().width())
|
||
// 修复iphone端，点击按钮时自动滚到页面顶部以及附带的其他一些问题
|
||
$(".pcki-page").height($(self.frameElement).parent().height())
|
||
setAllHeight()
|
||
// 将iframe的高度同步为其父元素.layui-layer-iframe的高度
|
||
$(this).find("[name="+window.name+"]").height($(this).height())
|
||
})
|
||
});
|
||
|
||
function show_fullscreen(){
|
||
layui.use([], function() {
|
||
var $ = layui.$;
|
||
|
||
global_zb_is_fullscreen = true
|
||
|
||
$("#list-con").hide();
|
||
$("#fullscreen").html('<a href="javascript:void(0);" style="color:#ffffff;" onclick="show_channel_fullscreen()"><svg t="1582700249932" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4554" width="28" height="28"><path d="M682.667 896h256a42.667 42.667 0 0 1 0 85.333h-256a42.667 42.667 0 0 1 0-85.333zM85.333 42.667h256a42.667 42.667 0 1 1 0 85.333h-256a42.667 42.667 0 1 1 0-85.333z" p-id="4555" fill="#ffffff"></path><path d="M981.333 682.667v256a42.667 42.667 0 0 1-85.333 0v-256a42.667 42.667 0 0 1 85.333 0zM128 85.333v256a42.667 42.667 0 1 1-85.333 0v-256a42.667 42.667 0 0 1 85.333 0z m42.667 469.334h256a42.667 42.667 0 0 1 0 85.333h-256a42.667 42.667 0 0 1 0-85.333zM597.333 384h256a42.667 42.667 0 0 1 0 85.333h-256a42.667 42.667 0 0 1 0-85.333z" p-id="4556" fill="#ffffff"></path><path d="M72.832 875.648l290.816-290.816a42.667 42.667 0 1 1 60.33 60.33L133.164 935.98a42.667 42.667 0 1 1-60.331-60.331z m501.12-482.901L891.733 74.965a42.667 42.667 0 0 1 60.331 60.331L634.283 453.077a42.667 42.667 0 1 1-60.331-60.33z" p-id="4557" fill="#ffffff"></path><path d="M469.333 597.333v256a42.667 42.667 0 0 1-85.333 0v-256a42.667 42.667 0 0 1 85.333 0zM640 170.667v256a42.667 42.667 0 0 1-85.333 0v-256a42.667 42.667 0 1 1 85.333 0z" p-id="4558" fill="#ffffff"></path></svg></a>');
|
||
|
||
// 隐藏外层头部栏
|
||
$(".layui-header", top.document).hide()
|
||
state_layui_body_top = $(".layui-body", top.document).css("top") // 退出全屏时需要还回去
|
||
$(".layui-body", top.document).css("top", 0)
|
||
|
||
setAllHeight()
|
||
|
||
refresh();
|
||
$("#player-con .-bottom-controls .-products-box").show()
|
||
$("#player-con .-bottom-controls .-hidden-products-box").hide()
|
||
//开启定时任务
|
||
//timeInterval1=setInterval(function() {
|
||
// refresh();
|
||
//}, 5000)
|
||
})
|
||
}
|
||
|
||
function show_channel_fullscreen(){
|
||
layui.use([], function() {
|
||
var $ = layui.$;
|
||
|
||
global_zb_is_fullscreen = false
|
||
|
||
$("#list-con").show();
|
||
// global_player.setPlayerSize("100%", "300px")
|
||
// $("#player-con .watermark").css("line-height", "300px")
|
||
|
||
$("#fullscreen").html('<a href="javascript:void(0);" style="color:#ffffff;" onclick="show_fullscreen()"><svg t="1582700473916" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6096" width="28" height="28"><path d="M960.096 927.914V672.297c0-32.847-32.029-32.847-32.029-32.847s-32.029 0-31.926 32.847v179.075L630.803 587.058c-23.228-23.229-45.843-0.614-45.843-0.614s-22.614 22.614 0.614 45.843l265.03 264.11h-177.64c-32.848 0-32.848 32.028-32.848 32.028s0 32.03 32.848 31.927h255.001s0.511 0 1.432-0.103c10.233-0.511 17.09-4.195 21.592-9.004 4.707-4.503 8.39-11.257 8.902-21.387 0.103-1.023 0.103-1.535 0.103-1.535s0.102-0.102 0.102-0.41zM630.803 436.737l264.11-265.03v177.642c0 32.847 32.029 32.847 32.029 32.847s32.028 0 31.926-32.847V94.346s0-0.51-0.102-1.432c-0.512-10.233-4.196-17.089-9.005-21.591-4.503-4.707-11.256-8.391-21.387-8.903-1.023-0.102-1.535-0.102-1.535-0.102H670.711c-32.847 0-32.847 32.029-32.847 32.029s0 32.029 32.847 31.926h179.075L585.574 391.508c-23.228 23.229-0.614 45.843-0.614 45.843s22.717 22.615 45.843-0.614zM173.088 126.785H350.73c32.848 0 32.848-32.029 32.848-32.029s0-32.029-32.848-31.926H95.728s-0.511 0-1.432 0.102c-10.336 0.512-17.09 4.195-21.592 8.903-4.707 4.502-8.39 11.256-8.902 21.386-0.103 1.023-0.103 1.535-0.103 1.535v256.128c0 32.847 32.03 32.847 32.03 32.847s32.028 0 31.926-32.847V171.809l265.337 264.315c23.229 23.228 45.843 0.613 45.843 0.613s22.615-22.614-0.614-45.843l-265.133-264.11z m218.881 459.761l-264.11 265.03v-177.64c0-32.848-32.028-32.848-32.028-32.848s-32.03 0-31.927 32.848v255.001s0 0.512 0.102 1.433c0.512 10.232 4.196 17.088 9.005 21.59 4.503 4.708 11.256 8.392 21.387 8.903 1.023 0.103 1.535 0.103 1.535 0.103H352.06c32.847 0 32.847-32.03 32.847-32.03s0-32.028-32.847-31.926H172.986l264.212-265.235c23.229-23.228 0.614-45.843 0.614-45.843s-22.717-22.614-45.843 0.614z" fill="#ffffff" p-id="6097"></path></svg></a>');
|
||
|
||
// 显示外层头部栏
|
||
$(".layui-header", top.document).show()
|
||
$(".layui-body", top.document).css("top", state_layui_body_top)
|
||
|
||
setAllHeight()
|
||
|
||
//取消定时
|
||
//clearInterval(timeInterval1);
|
||
$("#player-con .-bottom-controls .-products-box").hide();
|
||
$("#player-con .-bottom-controls .-hidden-products-box").hide();
|
||
})
|
||
}
|
||
|
||
// 录像列表
|
||
function fillVideos(videos) {
|
||
layui.use([], function() {
|
||
var $ = layui.$
|
||
if(IsPC()== true){
|
||
global_videos = []
|
||
for (var i = 0; i < videos.length; i++) {
|
||
var video = videos[i]
|
||
,elem = $('<div class="-video"><div class="-left"><div id="playto-con'+video.id+'" class="-m3u8 prism-player" vurl="'+video.video_url1+'" allowfullscreen></div></div><div class="-right"><div class="-title1"><span>'+video.title1+'</span></div><div class="-title2"><span>'+video.title2+'</span></div><div class="-views"><span><i class="layui-icon layui-icon-play"></i></span><span>'+video.views+'</span></div></div></div>')
|
||
$("#list-con .-content .-videos").append(elem)
|
||
|
||
global_videos.push({
|
||
id: "playto-con"+video.id
|
||
,vurl: video.video_url1
|
||
,vid:video.id
|
||
,aliyun:video.aliyun
|
||
})
|
||
}
|
||
}else{
|
||
global_videos = []
|
||
for (var i = 0; i < videos.length; i++) {
|
||
var video = videos[i]
|
||
,elem = $('<div class="-video"><div id="playto-con'+video.id+'" class="-m3u8 prism-player" vurl="'+video.video_url2+'" allowfullscreen></div></div><div class="-nopc-info"><div class="-info1"><div class="-title1"><span>'+video.title1+'</span></div><div class="-title2"><span>'+video.title2+'</span></div></div><div class="-info2"><div class="-views"><span><i class="layui-icon layui-icon-play"></i></span><span>'+video.views+'</span></div></div></div></a></div>')
|
||
$("#list-con .-content .-videos").append(elem)
|
||
global_videos.push({
|
||
id: "playto-con"+video.id
|
||
,vurl: video.video_url2
|
||
,vid:video.id
|
||
,aliyun:video.aliyun
|
||
})
|
||
}
|
||
}
|
||
// 同时创建播放器有严重bug，暂时未明原因，此处以分批创建播放器避开bug
|
||
$("#list-con .-content .-videos .-video .-m3u8").each(function(index) {
|
||
setTimeout(function(e) {
|
||
var lvurl=global_videos[0].vurl;
|
||
var lvvid=global_videos[0].vid;
|
||
var video_player = new Aliplayer({
|
||
"id": global_videos[0].id,
|
||
"source": lvurl,
|
||
"width": "100%",
|
||
"height": "200px",
|
||
"rePlay": false,
|
||
"playsinline": true,
|
||
"autoplay": false,
|
||
"preload": true,
|
||
"controlBarVisibility": 'click',
|
||
"showBarTime": '10000',
|
||
"useH5Prism":true,
|
||
"useFlashPrism":false,
|
||
"liveRetry":3,
|
||
"skinLayout": [
|
||
{
|
||
"name": "bigPlayButton",
|
||
"align": "blabs",
|
||
"x": 30,
|
||
"y": 80
|
||
},
|
||
{
|
||
"name": "errorDisplay",
|
||
"align": "tlabs",
|
||
"x": 0,
|
||
"y": 0
|
||
},
|
||
{
|
||
"name": "infoDisplay"
|
||
},
|
||
{
|
||
"name": "controlBar",
|
||
"align": "blabs",
|
||
"x": 0,
|
||
"y": 0,
|
||
"children": [
|
||
{"name":"progress","align":"blabs","x":0,"y":44},
|
||
{"name":"playButton","align":"tl","x":15,"y":12},
|
||
{"name": "volume","align": "tr","x": 10, "y": 10},
|
||
{"name":"timeDisplay","align":"tl","x":10,"y":7},
|
||
{"name":"fullScreenButton","align":"tr","x":10,"y":10},
|
||
]
|
||
}
|
||
]
|
||
}, function (player) {
|
||
//console.log("The player is created");
|
||
|
||
})
|
||
|
||
// 画中画
|
||
$('#'+global_videos[0].id+' .prism-volume').before('<div id="creatediv_'+global_videos[0].id+'" style="float:right;margin-right:10px; margin-top:10px;height:28px;line-height:28px;"><a href="javascript:void(0);" style="color:#ffffff;" id="hzh_'+global_videos[0].id+'"><svg t="1582699091002" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2686" width="28" height="28"><path d="M358.4 921.6H102.4a51.2 51.2 0 0 1-51.2-51.2V153.6a51.2 51.2 0 0 1 51.2-51.2h819.2a51.2 51.2 0 0 1 51.2 51.2v230.4a25.6 25.6 0 0 1-25.6 25.6h-51.2a25.6 25.6 0 0 1-25.6-25.6V204.8H153.6v614.4h230.4a25.6 25.6 0 0 1 25.6 25.6v51.2a25.6 25.6 0 0 1-25.6 25.6H358.4z m256-307.2v204.8h307.2v-204.8h-307.2z m-51.2-102.4h409.6a51.2 51.2 0 0 1 51.2 51.2v307.2a51.2 51.2 0 0 1-51.2 51.2h-409.6a51.2 51.2 0 0 1-51.2-51.2v-307.2a51.2 51.2 0 0 1 51.2-51.2z" p-id="2687" fill="#ffffff"></path></svg></a></div>');
|
||
// 水印
|
||
if (global_watermark.is_sy == "y")
|
||
$("#"+global_videos[0].id).append("<div class='watermark' style='position: absolute; font-size: 64px; color: rgba(183,183,183,0.3); top: 0; left: 0; width: 100%; height: 100%; text-align: center; line-height: 200px;'><span>"+global_watermark.username+"</span></div>")
|
||
|
||
|
||
//画中画
|
||
$("#hzh_"+global_videos[0].id).click(function(){
|
||
show_createhzh(lvurl,"lb");
|
||
});
|
||
|
||
$("#"+global_videos[0].id+" .outter").click(function(){
|
||
//alert(lvvid);
|
||
$.ajax({
|
||
url:"./?_m=zbuser&_a=lookvideo&id="+lvvid,
|
||
contentType: "application/json",
|
||
method: 'POST',
|
||
success: function (res) {
|
||
|
||
}
|
||
});
|
||
});
|
||
global_videos.shift()
|
||
}, 500*index)
|
||
})
|
||
})
|
||
}
|
||
// 产品列表
|
||
function fillProductsList(khlists, zbxs) {
|
||
layui.use(['jquery'], function() {
|
||
var $ = layui.$
|
||
var str_khlists= "";
|
||
for (var i = 0; i < khlists.length; i++) {
|
||
var khlists2 = khlists[i]
|
||
str_khlists+="<div id='product-"+khlists2.khid+"-"+khlists2.colorno+"' class='-product' style='display:inline-block;margin: 2px; position: relative; height: 141px;'>";
|
||
str_khlists+="<a href='javascript:;' onclick='openDkSingle("+khlists2.khid+")' style='display: block;'><div style='width: 80px;height: 80px; line-height: 80px; position: relative; text-align: center; margin: auto;'><img data-src="+khlists2.imgurl+" style='max-width: 80px; max-height: 80px;' watermark>";
|
||
str_khlists+= khlists2.js && khlists2.js != "0" ? "<div style='position: absolute; top: 0; left: 0; border: solid 1px black; width: 45px; height: 20px; line-height: 20px; font-size: 12px;color:#ffffff; background-color: green;'>"+khlists2.js+"件</div>" : ""
|
||
|
||
if(khlists2.color!=""){
|
||
str_khlists+="</div><div style='text-align: center;'>"+khlists2.no+"-"+khlists2.color+"</div></a>";
|
||
}else{
|
||
str_khlists+="</div><div style='text-align: center;'>"+khlists2.no+"</div></a>";
|
||
}
|
||
khlists2.xj = khlists2.xj ? khlists2.xj : "0"
|
||
khlists2.khs = khlists2.khs ? khlists2.khs : "0"
|
||
khlists2.zxj = khlists2.zxj ? khlists2.zxj : "0"
|
||
khlists2.zjs = khlists2.zjs ? khlists2.zjs : "0"
|
||
|
||
// 客户数，已订件数，热度
|
||
str_khlists += '<div style="text-align: center;">'
|
||
for (var j = 0; j < zbxs.length; j++) {
|
||
var zbx = zbxs[j]
|
||
str_khlists += '<div class="-'+zbx.no+'" style="display: inline-block; margin: 2px 2px;">'
|
||
if (zbx.no == 'zxj') {
|
||
str_khlists += '<a onclick="save_like(this, '+khlists2.khid+');" style="cursor: pointer; display: block;">'
|
||
str_khlists += '<div class="icon"><img src="images/'+(khlists2.xj < 5 ? 'star1' : 'star')+'.png" style="width: 24px;"></div>'
|
||
str_khlists += '<div class="zxj" style="text-align: center; position: relative;"><span class="-zxjv">'+khlists2[zbx.no]+'</span></div>'
|
||
str_khlists += '<input id="hidden_'+khlists2.khid+'_'+khlists2.colorno+'" type="hidden" class="ixj" value="'+khlists2.xj+'">'
|
||
str_khlists += '<input id="hidden_z_'+khlists2.khid+'_'+khlists2.colorno+'" type="hidden" class="izxj" value="'+khlists2.zxj+'">'
|
||
str_khlists += '</a>'
|
||
} else {
|
||
str_khlists += '<div><img src="images/'+zbx.title+'.png" style="width: 24px;"></div>'
|
||
str_khlists += '<div class="-'+zbx.no+'v" style="text-align: center;">'+khlists2[zbx.no]+'</div>'
|
||
}
|
||
str_khlists += '</div>'
|
||
}
|
||
str_khlists += '</div>'
|
||
|
||
str_khlists += "</div>"
|
||
str_khlists+='</div>'
|
||
}
|
||
|
||
var elem = $(str_khlists)
|
||
$("#list-con .-content .-products").html("")
|
||
$("#player-con .-bottom-controls .-products-box .-products").html("")
|
||
elem.each(function() {
|
||
$("#list-con .-content .-products").append(this.outerHTML)
|
||
$("#player-con .-bottom-controls .-products-box .-products").append(this.outerHTML)
|
||
})
|
||
USetWatermark({
|
||
is_sy: global_watermark.is_sy
|
||
,text: global_watermark.username
|
||
,font_size: 32
|
||
})
|
||
})
|
||
}
|
||
// 切换录像与用户列表
|
||
function switchList(i) {
|
||
layui.use([], function() {
|
||
var $ = layui.$
|
||
if (global_list_switch == i) return 1
|
||
global_list_switch = i
|
||
if (i == 1) {
|
||
$("#list-con .-content .-videos").hide()
|
||
$("#list-con .-content .-products").show()
|
||
} else if (i == 2) {
|
||
$("#list-con .-content .-videos").show()
|
||
$("#list-con .-content .-products").hide()
|
||
}
|
||
$("#list-con>.-title a.-active").removeClass("-active")
|
||
$("#list-con>.-title a:nth-child("+i+")").addClass("-active")
|
||
|
||
setAllHeight()
|
||
})
|
||
}
|
||
|
||
// 关闭录像全屏
|
||
function closeFullVideo() {
|
||
layui.use([], function() {
|
||
var $ = layui.$
|
||
$("#player-con-close").hide()
|
||
})
|
||
}
|
||
|
||
// 设置列表高度
|
||
function setAllHeight() {
|
||
layui.use([], function() {
|
||
var $ = layui.$
|
||
|
||
if (global_zb_is_fullscreen) {
|
||
global_player.setPlayerSize("100%", window.parent.innerHeight+"px")
|
||
$("#player-con .watermark").css({
|
||
"height": $("#player-con").height()+"px"
|
||
,"line-height": $("#player-con").height()+"px"
|
||
})
|
||
} else {
|
||
var list_id = $("#list-con .-title a.-active").attr("list-id")
|
||
if (list_id == "1") {
|
||
// h = 141+16+41 = 198
|
||
$("#list-con").height(198)
|
||
global_player.setPlayerSize("100%", (window.parent.innerHeight - 50 - 198)+"px")
|
||
} else if (list_id == "2") {
|
||
$("#list-con").height(window.parent.innerHeight - 50 - 300)
|
||
global_player.setPlayerSize("100%", "300px")
|
||
}
|
||
$("#list-con>.-content").height($("#list-con").height() - 41)
|
||
$("#list-con>.-content .-products").height($("#list-con").height() - 41 - 16)
|
||
// 直播播放器水印
|
||
$("#player-con .watermark").css({
|
||
"height": $("#player-con").height()+"px"
|
||
,"line-height": $("#player-con").height()+"px"
|
||
})
|
||
}
|
||
|
||
if ($("#player-con").height() > 600) $("#player-con .-bottom-controls .player-dmlist").css("max-height", "268px")
|
||
else $("#player-con .-bottom-controls .player-dmlist").css("max-height", "")
|
||
})
|
||
}
|
||
|
||
// 关闭产品列表
|
||
function closeCplist() {
|
||
layui.use([], function() {
|
||
var $ = layui.$
|
||
$("#player-con .-bottom-controls .-products-box").hide()
|
||
$("#player-con .-bottom-controls .-hidden-products-box").show()
|
||
})
|
||
}
|
||
function openCplist() {
|
||
layui.use([], function() {
|
||
var $ = layui.$
|
||
$("#player-con .-bottom-controls .-products-box").show()
|
||
$("#player-con .-bottom-controls .-hidden-products-box").hide()
|
||
})
|
||
|
||
}
|
||
|
||
function add() {
|
||
layui.use(["jquery"], function() {
|
||
var $ = layui.$
|
||
$.ajax({
|
||
url: './?_m=tanmu&_a=showData',
|
||
data: {
|
||
nowTime: systime,
|
||
barrageId: currentId
|
||
},
|
||
success: function (backData) {
|
||
// console.log(["show dm data", backData])
|
||
var spanArr = JSON.parse(backData)['list'];
|
||
//console.log(spanArr);
|
||
currentId = JSON.parse(backData)['lastId'];
|
||
var dom = [];
|
||
for (var i = 0; i < spanArr.length; i++) {
|
||
//随机高度
|
||
//var topVal = Math.random() * rheight;
|
||
//随机颜色
|
||
//var colorVal = '#' + colorSize[Math.ceil(Math.random() * 16)] + colorSize[Math.ceil(Math.random() * 16)] + colorSize[Math.ceil(Math.random() * 16)] + colorSize[Math.ceil(Math.random() * 16)] + colorSize[Math.ceil(Math.random() * 16)] + colorSize[Math.ceil(Math.random() * 16)];
|
||
|
||
// dom[i] = document.createElement('p');
|
||
// $('#player-con .-bottom-controls .player-dmlist').append(dom[i]);
|
||
$('#player-con .-bottom-controls .player-dmlist').append("<p>"+spanArr[i].value+"</p>")
|
||
// $(dom[i]).html(spanArr[i].value).css({
|
||
// 'color':"#ffffff",
|
||
// 'font-size':"16px"
|
||
// });
|
||
}
|
||
|
||
if (global_is_dm_auto_scroll) $("#player-con .-bottom-controls .player-dmlist").scrollTop($("#player-con .-bottom-controls .player-dmlist")[0].scrollHeight);
|
||
}
|
||
});
|
||
});
|
||
|
||
}
|
||
|
||
|
||
//显示，隐藏评价层
|
||
function show_hide_kh_hide(id){
|
||
layui.use('jquery', function(){
|
||
var $=layui.jquery;
|
||
$("#kh_hide_"+id).toggle(500);
|
||
})
|
||
}
|
||
|
||
//
|
||
function update_yd(khid) {
|
||
refresh()
|
||
}
|
||
</script>
|
||
</html> |