diff --git a/demo/mask_detection/README.md b/demo/mask_detection/README.md
new file mode 100644
index 0000000000000000000000000000000000000000..e6c824527fe37ceb0b51b9d4fa9f7e8ed0af0653
--- /dev/null
+++ b/demo/mask_detection/README.md
@@ -0,0 +1,304 @@
+# 百度PaddlePaddle实现口罩检测应用
+
+## 0 项目介绍
+![image](https://note.youdao.com/yws/public/resource/b0a4695bc7d58aed3b1ff797409aee1e/BB6BC87A45D146CEBA7BF237B5383835?ynotemdtimestamp=1582271320612)
+
+### [>点击查看视频链接<](https://www.bilibili.com/video/av88962128)
+
+##### 背景
+本项目可以部署在大型场馆出入口,学校,医院,交通通道出入口,人脸识别闸机,机器人上,支持的方案有:安卓方案(如RK3399的人脸识别机,机器人),ubuntu 边缘计算,windowsPC+摄像头,识别率80%~90%,如果立项使用场景可以达到 99% (如:人脸识别机场景)。但是限于清晰度和遮挡关系,对应用场景有一些要求。
+
+##### 效果分析
+可以看到识别率在80~90%之前,稍小的人脸有误识别的情况,有些挡住嘴的场景也被误识别成了戴口罩,一个人带着口罩,鼻子漏出来识别成没有戴口罩,这个是合理的因为的鼻子漏出来是佩戴不规范。初步判断,这个模型应用在门口,狭长通道,人脸识别机所在位置都是可以的。
+
+![image](https://note.youdao.com/yws/public/resource/b0a4695bc7d58aed3b1ff797409aee1e/7E12DBD91D1D4AB5B33C84786D519065?ynotemdtimestamp=1582271320612)![image](https://note.youdao.com/yws/public/resource/b0a4695bc7d58aed3b1ff797409aee1e/2BD974FB990C4C448B30B04194545054?ynotemdtimestamp=1582271320612)![image](https://note.youdao.com/yws/public/resource/b0a4695bc7d58aed3b1ff797409aee1e/E49E34A071F8484D948511430FAB0360?ynotemdtimestamp=1582271320612)
+
+## 1 部署环境
+参考: https://www.paddlepaddle.org.cn/install/quick
+
+### 安装paddlehub
+`pip install paddlehub`
+
+
+## 2 开发识别服务
+### 加载预训练模型
+```python
+import paddlehub as hub
+module = hub.Module(name="pyramidbox_lite_mobile_mask") #口罩检测模型
+```
+
+>以上语句paddlehub会自动下载口罩检测模型 "pyramidbox_lite_mobile_mask" 不需要提前下载模型
+
+### OpenCV打开摄像头或视频文件
+```python
+import cv2
+
+capture = cv2.VideoCapture(0) # 打开摄像头
+# capture = cv2.VideoCapture('./2.mp4') # 打开视频文件
+while(1):
+ ret, frame = capture.read() # frame即视频的一帧数据
+
+ if ret == False:
+ break
+
+ cv2.imshow('Mask Detection', frame)
+
+ if cv2.waitKey(1) & 0xFF == ord('q'):
+ break
+
+cv2.destroyAllWindows()
+```
+
+### 口罩检测
+```python
+# frame为一帧数据
+
+input_dict = {"data": [frame]}
+
+results = module.face_detection(data=input_dict)
+
+print(results)
+```
+输出结果:
+```json
+[
+ {
+ "data": {
+ "label": "MASK",
+ "left": 258.37087631225586,
+ "right": 374.7980499267578,
+ "top": 122.76758193969727,
+ "bottom": 254.20085906982422,
+ "confidence": 0.5630852
+ },
+ "id": 1
+ }
+]
+```
+>"label":是否戴口罩,"confidence":置信度,其余字段为脸框的位置大小
+
+### 将结果显示到原视频帧中
+```python
+# results为口罩检测结果
+for result in results:
+ # print(result)
+
+ label = result['data']['label']
+ confidence = result['data']['confidence']
+
+ top, right, bottom, left = int(result['data']['top']), int(result['data']['right']), int(result['data']['bottom']), int(result['data']['left'])
+
+ color = (0, 255, 0)
+ if label == 'NO MASK':
+ color = (0, 0, 255)
+
+ cv2.rectangle(frame, (left, top), (right, bottom), color, 3)
+ cv2.putText(frame, label + ":" + str(confidence), (left, top-10), cv2.FONT_HERSHEY_SIMPLEX, 0.8, color, 2)
+```
+![image](https://note.youdao.com/yws/public/resource/b0a4695bc7d58aed3b1ff797409aee1e/F85FCBCA17994C8691024381CBDAFCA7?ynotemdtimestamp=1582271320612)
+
+>原DEMO中是英文+置信度显示在框的上面,尝试改为中文,遇到字体问题,以下是解决办法
+
+### 图片写入中文
+需要事先准备ttf/otf等格式的字体文件
+```python
+def paint_chinese_opencv(im,chinese,position,fontsize,color_bgr):#opencv输出中文
+ img_PIL = Image.fromarray(cv2.cvtColor(im,cv2.COLOR_BGR2RGB))# 图像从OpenCV格式转换成PIL格式
+ font = ImageFont.truetype('思源黑体SC-Heavy.otf',fontsize,encoding="utf-8") # 加载字体文件
+ #color = (255,0,0) # 字体颜色
+ #position = (100,100)# 文字输出位置
+ color = color_bgr[::-1]
+ draw = ImageDraw.Draw(img_PIL)
+ draw.text(position,chinese,font=font,fill=color)# PIL图片上打印汉字 # 参数1:打印坐标,参数2:文本,参数3:字体颜色,参数4:字体
+ img = cv2.cvtColor(np.asarray(img_PIL),cv2.COLOR_RGB2BGR)# PIL图片转cv2 图片
+ return img
+```
+```python
+for result in results:
+ # print(result)
+
+ label = result['data']['label']
+ confidence = result['data']['confidence']
+
+ top, right, bottom, left = int(result['data']['top']), int(result['data']['right']), int(result['data']['bottom']), int(result['data']['left'])
+
+ color = (0, 255, 0)
+ label_cn = "有口罩"
+ if label == 'NO MASK':
+ color = (0, 0, 255)
+ label_cn = "无口罩"
+
+ cv2.rectangle(frame, (left, top), (right, bottom), color, 3)
+ # cv2.putText(frame, label + ":" + str(confidence), (left, top-10), cv2.FONT_HERSHEY_SIMPLEX, 0.8, color, 2)
+ frame = paint_chinese_opencv(frame, label_cn + ":" + str(confidence), (left, top-36), 24, color)
+```
+![image](https://note.youdao.com/yws/public/resource/b0a4695bc7d58aed3b1ff797409aee1e/4F75E5C6F42F4C3CBE1341742D032847?ynotemdtimestamp=1582271320612)
+
+
+### 提取头像文件
+```python
+img_name = "avatar_%d.png" % (maskIndex)
+path = "./result/" + img_name
+image = frame[top - 10: bottom + 10, left - 10: right + 10]
+cv2.imwrite(path, image,[int(cv2.IMWRITE_PNG_COMPRESSION), 9])
+```
+
+
+### 结果写入JSON
+```python
+with open("./result/2-mask_detection.json","w") as f:
+ json.dump(data, f)
+```
+
+>此处可以按照自己的应用需要改为输出到mysql,Redis,kafka ,MQ 供应用消化数据
+
+### 完整代码如下
+```python
+import paddlehub as hub
+import cv2
+from PIL import Image, ImageDraw, ImageFont
+import numpy as np
+import json
+import os
+
+module = hub.Module(name="pyramidbox_lite_mobile_mask")
+
+
+def paint_chinese_opencv(im,chinese,position,fontsize,color_bgr):#opencv输出中文
+ img_PIL = Image.fromarray(cv2.cvtColor(im,cv2.COLOR_BGR2RGB))# 图像从OpenCV格式转换成PIL格式
+ font = ImageFont.truetype('思源黑体SC-Heavy.otf',fontsize,encoding="utf-8") # 加载字体文件
+ #color = (255,0,0) # 字体颜色
+ #position = (100,100)# 文字输出位置
+ color = color_bgr[::-1]
+ draw = ImageDraw.Draw(img_PIL)
+ draw.text(position,chinese,font=font,fill=color)# PIL图片上打印汉字 # 参数1:打印坐标,参数2:文本,参数3:字体颜色,参数4:字体
+ img = cv2.cvtColor(np.asarray(img_PIL),cv2.COLOR_RGB2BGR)# PIL图片转cv2 图片
+ return img
+
+
+result_path = './result'
+if not os.path.exists(result_path):
+ os.mkdir(result_path)
+
+
+name = "./result/1-mask_detection.mp4"
+width = 1920
+height = 1080
+fps = 30
+fourcc = cv2.VideoWriter_fourcc(*'mp4v')
+writer = cv2.VideoWriter(name, fourcc, fps, (width, height))
+
+maskIndex = 0
+index = 0
+data = []
+
+# capture = cv2.VideoCapture(0) # 打开摄像头
+capture = cv2.VideoCapture('./2.mp4') # 打开视频文件
+while(1):
+ frameData = {}
+
+ ret, frame = capture.read() # frame即视频的一帧数据
+
+ if ret == False:
+ break
+
+ frame_copy = frame.copy()
+
+ input_dict = {"data": [frame]}
+
+ results = module.face_detection(data=input_dict)
+ # print(results)
+
+ maskFrameDatas = []
+ for result in results:
+ # print(result)
+
+ label = result['data']['label']
+
+ confidence_origin = result['data']['confidence']
+ confidence = round(confidence_origin, 2)
+ confidence_desc = str(confidence)
+
+ top, right, bottom, left = int(result['data']['top']), int(result['data']['right']), int(result['data']['bottom']), int(result['data']['left'])
+
+ #将当前帧保存为图片
+ img_name = "avatar_%d.png" % (maskIndex)
+ path = "./result/" + img_name
+ image = frame[top - 10: bottom + 10, left - 10: right + 10]
+ cv2.imwrite(path, image,[int(cv2.IMWRITE_PNG_COMPRESSION), 9])
+
+ maskFrameData = {}
+ maskFrameData['top'] = top
+ maskFrameData['right'] = right
+ maskFrameData['bottom'] = bottom
+ maskFrameData['left'] = left
+ maskFrameData['confidence'] = float(confidence_origin)
+ maskFrameData['label'] = label
+ maskFrameData['img'] = img_name
+
+ maskFrameDatas.append(maskFrameData)
+
+ maskIndex += 1
+
+ color = (0, 255, 0)
+ label_cn = "有口罩"
+ if label == 'NO MASK':
+ color = (0, 0, 255)
+ label_cn = "无口罩"
+
+ cv2.rectangle(frame_copy, (left, top), (right, bottom), color, 3)
+ # cv2.putText(frame, label, (left, top-10), cv2.FONT_HERSHEY_SIMPLEX, 0.8, color, 2)
+ frame_copy = paint_chinese_opencv(frame_copy, label_cn, (left, top-36), 24, color)
+
+
+ writer.write(frame_copy)
+
+ cv2.imshow('Mask Detection', frame_copy)
+
+ frameData['frame'] = index
+ # frameData['seconds'] = int(index/fps)
+ frameData['data'] = maskFrameDatas
+
+ data.append(frameData)
+
+ print(json.dumps(frameData))
+
+ index += 1
+
+ if cv2.waitKey(1) & 0xFF == ord('q'):
+ break
+
+with open("./result/2-mask_detection.json","w") as f:
+ json.dump(data, f)
+
+writer.release()
+
+cv2.destroyAllWindows()
+```
+## 3 制作网页呈现效果
+此DEMO是显示一个固定视频,分析导出的 json 渲染到网页里面,如需实时显示需要再次开发
+
+### python 导出的数据
+使用上面的 python 文件完整执行后会有3个种类的数据输出,放到`web/video/result`目录下
+![image](https://note.youdao.com/yws/public/resource/b0a4695bc7d58aed3b1ff797409aee1e/329AC9C2D89447EABE6B8C45D620441E?ynotemdtimestamp=1582271320612)
+
+### json数据结构
+![image](https://note.youdao.com/yws/public/resource/b0a4695bc7d58aed3b1ff797409aee1e/5D46F32061B047D4AB0AC016FE2A63A5?ynotemdtimestamp=1582271320612)
+
+### 使用数据渲染网页
+
+- 网页中左侧 "视频播放视频区",播放同时实时回调当前播放的时间点
+- 根据时间点换算为帧(1秒30帧),遍历 json 数据中的数据
+- 把数据中对应的数据输出到网页右侧 "信息区"
+
+![image](https://note.youdao.com/yws/public/resource/b0a4695bc7d58aed3b1ff797409aee1e/6329B326216A4950BF35E0CB37CDC58F?ynotemdtimestamp=1582271320612)
+
+## 4 欢迎交流
+
+
+**百度飞桨合作伙伴:**
+
+
+![image](https://note.youdao.com/yws/public/resource/b0a4695bc7d58aed3b1ff797409aee1e/DC72DE1CF51747138871BB0E3D54E20D?ynotemdtimestamp=1582271320612)
+
+北京奇想天外科技有限公司
diff --git a/demo/mask_detection/mask_detection/PaddleMaskDetection.py b/demo/mask_detection/mask_detection/PaddleMaskDetection.py
new file mode 100644
index 0000000000000000000000000000000000000000..8d3d7b3219f93f46526ea8b75b65b8076b0aad89
--- /dev/null
+++ b/demo/mask_detection/mask_detection/PaddleMaskDetection.py
@@ -0,0 +1,125 @@
+import paddlehub as hub
+import cv2
+from PIL import Image, ImageDraw, ImageFont
+import numpy as np
+import json
+import os
+
+module = hub.Module(name="pyramidbox_lite_mobile_mask")
+
+
+#opencv输出中文
+def paint_chinese(im, chinese, position, fontsize, color_bgr):
+ img_PIL = Image.fromarray(cv2.cvtColor(
+ im, cv2.COLOR_BGR2RGB)) # 图像从OpenCV格式转换成PIL格式
+ font = ImageFont.truetype('思源黑体SC-Heavy.otf', fontsize, encoding="utf-8")
+ #color = (255,0,0) # 字体颜色
+ #position = (100,100)# 文字输出位置
+ color = color_bgr[::-1]
+ draw = ImageDraw.Draw(img_PIL)
+ # PIL图片上打印汉字 # 参数1:打印坐标,参数2:文本,参数3:字体颜色,参数4:字体
+ draw.text(position, chinese, font=font, fill=color)
+ img = cv2.cvtColor(np.asarray(img_PIL), cv2.COLOR_RGB2BGR) # PIL图片转cv2 图片
+ return img
+
+
+result_path = './result'
+if not os.path.exists(result_path):
+ os.mkdir(result_path)
+
+name = "./result/1-mask_detection.mp4"
+width = 1920
+height = 1080
+fps = 30
+fourcc = cv2.VideoWriter_fourcc(*'mp4v')
+writer = cv2.VideoWriter(name, fourcc, fps, (width, height))
+
+maskIndex = 0
+index = 0
+data = []
+
+# capture = cv2.VideoCapture(0) # 打开摄像头
+capture = cv2.VideoCapture('./2.mp4') # 打开视频文件
+while (1):
+ frameData = {}
+
+ ret, frame = capture.read() # frame即视频的一帧数据
+
+ if ret == False:
+ break
+
+ frame_copy = frame.copy()
+
+ input_dict = {"data": [frame]}
+
+ results = module.face_detection(data=input_dict)
+ # print(results)
+
+ maskFrameDatas = []
+ for result in results:
+ # print(result)
+
+ label = result['data']['label']
+
+ confidence_origin = result['data']['confidence']
+ confidence = round(confidence_origin, 2)
+ confidence_desc = str(confidence)
+
+ top, right, bottom, left = int(result['data']['top']), int(
+ result['data']['right']), int(result['data']['bottom']), int(
+ result['data']['left'])
+
+ #将当前帧保存为图片
+ img_name = "avatar_%d.png" % (maskIndex)
+ path = "./result/" + img_name
+ image = frame[top - 10:bottom + 10, left - 10:right + 10]
+ cv2.imwrite(path, image, [int(cv2.IMWRITE_PNG_COMPRESSION), 9])
+
+ maskFrameData = {}
+ maskFrameData['top'] = top
+ maskFrameData['right'] = right
+ maskFrameData['bottom'] = bottom
+ maskFrameData['left'] = left
+ maskFrameData['confidence'] = float(confidence_origin)
+ maskFrameData['label'] = label
+ maskFrameData['img'] = img_name
+
+ maskFrameDatas.append(maskFrameData)
+
+ maskIndex += 1
+
+ color = (0, 255, 0)
+ label_cn = "有口罩"
+ if label == 'NO MASK':
+ color = (0, 0, 255)
+ label_cn = "无口罩"
+
+ cv2.rectangle(frame_copy, (left, top), (right, bottom), color, 3)
+ # cv2.putText(frame, label, (left, top-10), cv2.FONT_HERSHEY_SIMPLEX, 0.8, color, 2)
+ origin_point = (left, top - 36)
+ frame_copy = paint_chinese(frame_copy, label_cn, origin_point, 24,
+ color)
+
+ writer.write(frame_copy)
+
+ cv2.imshow('Mask Detection', frame_copy)
+
+ frameData['frame'] = index
+ # frameData['seconds'] = int(index/fps)
+ frameData['data'] = maskFrameDatas
+
+ data.append(frameData)
+
+ print(json.dumps(frameData))
+
+ index += 1
+
+ if cv2.waitKey(1) & 0xFF == ord('q'):
+ break
+
+with open("./result/2-mask_detection.json", "w") as f:
+ json.dump(data, f)
+
+writer.release()
+
+cv2.destroyAllWindows()
diff --git a/demo/mask_detection/web/css/css.css b/demo/mask_detection/web/css/css.css
new file mode 100644
index 0000000000000000000000000000000000000000..589c32ee4c4ce7c0f0867d9c6c23b32629a0785b
--- /dev/null
+++ b/demo/mask_detection/web/css/css.css
@@ -0,0 +1,354 @@
+/*reset*/
+*{ margin: 0; padding: 0; box-sizing: border-box; }
+body{ font-family: Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Noto Sans CJK SC,WenQuanYi Micro Hei,Arial,sans-serif; font-size: 14px; line-height: 1.4; color: #fff; -webkit-font-smoothing: antialiased; background: #2f3242;}
+ul,ol{ list-style-type: none; }
+a{ text-decoration: none; transition: all .2s ease; -webkit-transition: all .2s ease;}
+img{border: none; }
+table{ border-collapse:collapse; border-spacing:0; }
+p{ line-height: 1.4 }
+a {color: #333;}
+a:hover {color: #666;}
+input{ outline: none; }
+button {background: none;border:none}
+.clear:after{ content: " "; clear: both; display: block; }
+h1,h2,h3,h4,h5,h6{font-style: normal;margin:0;padding:0;font-weight: normal;}
+.clear:after{ content: " "; clear: both; display: block; }
+.header {height:95px;padding-left:95px;padding-right:25px;}
+.header .logo{padding-left:0px;padding-top:25px;}
+.header .right-bar {float: right;padding-top:20px;}
+.header .search {width: 313px;
+ height: 48px;
+ border: 2px solid #fff; /* stroke */
+ -moz-border-radius: 26px;
+ -webkit-border-radius: 26px;
+ border-radius: 26px; /* border radius */
+ -moz-background-clip: padding;
+ -webkit-background-clip: padding-box;
+ background-clip: padding-box; /* prevents bg color from leaking outside the border */
+ background: url(../image/search.png) 10px center no-repeat;
+ padding-left:50px;
+ color: #fff;
+ font-size: 16px;
+ }
+
+.header .icon {display: inline-block;margin-left:40px;width:31px;height: 31px;vertical-align: middle;position: relative;}
+.icon1 {background: url(../image/icon1.png) no-repeat center center;}
+.icon2 {background: url(../image/icon2.png) no-repeat center center;}
+.header .avatar {width:56px;height: 56px;border-radius: 100%;overflow: hidden;display: inline-block;margin-left:40px;vertical-align: middle;}
+.header .right-bar .news-dot {
+ width: 15px;
+height: 15px;
+border: 3px solid #2f3141; /* stroke */
+-moz-border-radius: 9px;
+-webkit-border-radius: 9px;
+border-radius: 9px; /* border radius */
+-moz-background-clip: padding;
+-webkit-background-clip: padding-box;
+background-clip: padding-box; /* prevents bg color from leaking outside the border */
+background-color: #2195f3; /* layer fill content */
+position: absolute;
+right:0px;
+top:0px;
+}
+.header .arrow {display: inline-block;background: url(../image/arrow.png) no-repeat 0 0;width:12px;height: 8px;margin-left:10px;}
+.bd {padding-left:95px;position: relative;background: #2f3242;}
+.bd .side {width:95px;position: absolute;left:0;top:0;}
+.bd .con {background: #2b2d3c;}
+.bd .con .hd {background: #6d7499;color: #fff;font-size: 18px;padding:0 25px 0 60px;line-height: 60px;height: 60px;}
+.bd.chart {padding:0;}
+.bd .con .hd .right-bar {float:right;}
+.select-wrap {min-width: 150px;margin-top:10px;line-height: 38px;
+ height: 38px;
+ border-radius: 19px;
+ position: relative;
+ border:1px solid #9da3bd;
+ display: inline-block;
+ color: #fff;
+ margin-left:20px;
+}
+.select-wrap select {border: none;
+ outline: none;
+ width: 100%;
+ height: 40px;
+ line-height: 40px;
+ background: transparent;
+ appearance: none;
+ -webkit-appearance: none;
+ -moz-appearance: none;
+ font-size: 16px;
+ color: #fff;
+ padding-left: 20px;}
+.select-wrap:after{
+ content: "";
+ width: 14px;
+ height: 8px;
+ background: url(../image/arrow.png) no-repeat center;
+ position: absolute;
+ right: 20px;
+ top: 45%;
+ pointer-events: none;
+}
+.con-bd {position: relative;min-height: 960px;}
+.maper {padding-left:380px;}
+.con-left {left:0;top:0;position: absolute;width:380px;min-height: 960px;}
+.con-left .map {padding:20px;}
+
+.con-left .ctr-pan {position:absolute;bottom:20px;left:0;width:380px;color: #fff;}
+.con-left .ctr-pan ul{padding-left:20px;}
+.con-left .ctr-pan li {padding:5px 0;}
+.con-left .ctr-pan .icon {width:23px;height: 23px;display: inline-block;vertical-align: middle;margin-right:10px;}
+.con-left .ctr-pan .icon3 {background: url(../image/icon3.png) no-repeat center center;}
+.icon4 {background: url(../image/icon4.png) no-repeat center center;}
+.con-left .ctr-pan .icon5 {background: url(../image/icon5.png) no-repeat center center;}
+.con-left .ctr-pan .switch {border:2px solid #aaaaaa;border-radius:8px;height:15px;width:30px;display: inline-block;line-height: 15px;position: relative;vertical-align: middle;margin-left:10px;}
+.con-left .ctr-pan .switch em {width: 7px;
+ height: 7px;
+ -moz-border-radius: 4px / 3px;
+ -webkit-border-radius: 4px / 3px;
+ border-radius: 4px / 3px; /* border radius */
+ -moz-background-clip: padding;
+ -webkit-background-clip: padding-box;
+ background-clip: padding-box; /* prevents bg color from leaking outside the border */
+ background-color: #aaa; /* layer fill content */
+ display: inline-block;
+ vertical-align: middle;
+ position: absolute;
+ top:2px;
+ }
+
+ .con-left .ctr-pan .switch.on em{left:16px;}
+ .con-left .ctr-pan .switch.off em{left:2px;}
+.map-wrap {padding:20px 0 0 0;}
+
+.map-wrap img {}
+
+.zoom-bar {
+ width: 49px;
+height: 231px;
+border: 3px solid #757da3; /* stroke */
+-moz-border-radius: 27px;
+-webkit-border-radius: 27px;
+border-radius: 27px; /* border radius */
+-moz-background-clip: padding;
+-webkit-background-clip: padding-box;
+background-clip: padding-box; /* prevents bg color from leaking outside the border */
+background-color: #2f3141; /* layer fill content */
+position: absolute;
+right:50px;
+top:30%;
+text-align: center;
+}
+.zoom-bar .icon {width:30px;height: 30px;display: inline-block;}
+.zoom-bar .zoom {background: url(../image/zoom.png) no-repeat center center;margin-top:5px;}
+.zoom-bar .narrow {background: url(../image/narrow.png) no-repeat center center;margin-top:55px;}
+.zoom-bar .mouse {background: url(../image/mu.png) no-repeat center center;margin-top:58px;}
+.side .nav {padding-top:118px;}
+.side .nav a{display: block;width:95px;height: 95px;margin:100px 0 0 0;position: relative;}
+.side .nav a:hover {background-color: #2c2e3d;}
+
+.side .nav .nav1 {background-image: url(../image/nav1.png);background-repeat: no-repeat;background-position: center center;}
+.side .nav .nav2 {background-image: url(../image/nav2.png);background-repeat: no-repeat;background-position: center center;}
+.side .nav .nav3 {background-image: url(../image/nav3.png);background-repeat: no-repeat;background-position: center center;}
+.side .news-dot {
+ width: 15px;
+height: 15px;
+border: 3px solid #2f3141; /* stroke */
+-moz-border-radius: 9px;
+-webkit-border-radius: 9px;
+border-radius: 9px; /* border radius */
+-moz-background-clip: padding;
+-webkit-background-clip: padding-box;
+background-clip: padding-box; /* prevents bg color from leaking outside the border */
+background-color: #2195f3; /* layer fill content */
+position: absolute;
+left:55px;
+top:30px;
+}
+.side .nav a.current {background-color: #2c2e3d;}
+
+.person-list {font-size: 16px;padding-left:60px;}
+.person-list table {width:100%;}
+.person-list thead td{color: #9ea3b4;height:70px;line-height: 70px;text-align: center;background: none;}
+
+.person-list td {color: #fff;text-align: center;padding:10px 0;}
+.person-list .pro .item {display: inline-block;}
+
+.person-list .pro .item span {display:block;width:33px;height: 33px;margin:0 10px;margin-bottom:5px;}
+.t1 {background: url(../image/t1.png) no-repeat center center;}
+.t2 {background: url(../image/t2.png) no-repeat center center;}
+.t3 {background: url(../image/t3.png) no-repeat center center;}
+.t4 {background: url(../image/t4.png) no-repeat center center;}
+.t5 {background: url(../image/t5.png) no-repeat center center;}
+.t6 {background: url(../image/t6.png) no-repeat center center;}
+.t7 {background: url(../image/t7.png) no-repeat center center;}
+.person-list .dot {background: url(../image/dot.png) no-repeat 0 0;width:4px;height: 16px;display: inline-block;}
+.person-list .time {font-size: 14px;color: #9ea3b4;}
+.person-list tr:nth-child(odd) td {background: #3a3e52;}
+.person-list thead tr:nth-child(odd) td {background: none;}
+.person-list tr:nth-child(even) td {height:20px;}
+.person-list tr td:last-child {padding:10px 10px;}
+.line-female {border-left:4px solid #ed70bc;}
+.line-male {border-left:4px solid #2196f3;}
+.line-child {border-left:4px solid #e2e3e8;}
+
+.mask {background: rgba(0,0,0,.90);position: absolute;width: 100%;height: 100%;left: 0;top:0;z-index: 99;}
+.mask .cp {background: url(../image/cp.png) no-repeat 0 0 ;width:154px;height: 59px;margin:10% auto 0 auto;}
+.drop-area {
+ width: 247px;
+ height: 247px;
+ border:4px dotted #fff;
+ border-radius: 30px;
+ background: url(../image/icon6.png) no-repeat center 50px;
+ margin:10% auto 50px auto;
+ }
+
+ .drop-area .text {font-size: 20px;text-align: center;color: #fff;margin-top:170px;}
+.match-box {text-align: center;width:470px;margin: auto;color: #fff;font-size: 20px;}
+
+.match-box .match-bar {width: 316px;
+ height: 8px;
+ -moz-border-radius: 4px;
+ -webkit-border-radius: 4px;
+ border-radius: 4px; /* border radius */
+ -moz-background-clip: padding;
+ -webkit-background-clip: padding-box;
+ background-clip: padding-box; /* prevents bg color from leaking outside the border */
+ background-color: #252734; /* layer fill content */
+ -moz-box-shadow: 0 0 48px rgba(0,0,0,.14); /* outer glow */
+ -webkit-box-shadow: 0 0 48px rgba(0,0,0,.14); /* outer glow */
+ box-shadow: 0 0 48px rgba(0,0,0,.14); /* outer glow */
+ position: relative;
+ display: inline-block;
+ margin:0 10px;
+ vertical-align: middle;
+ }
+ .match-box .match-bar span {
+height: 8px;
+-moz-border-radius: 4px;
+-webkit-border-radius: 4px;
+border-radius: 4px; /* border radius */
+-moz-background-clip: padding;
+-webkit-background-clip: padding-box;
+background-clip: padding-box; /* prevents bg color from leaking outside the border */
+background-color: #71799f; /* layer fill content */
+position: absolute;
+left: 0;
+top:0;
+ }
+ .match-box .match-bar span em {
+ width: 25px;
+height: 25px;
+-moz-border-radius: 12px / 13px;
+-webkit-border-radius: 12px / 13px;
+border-radius: 12px / 13px; /* border radius */
+-moz-background-clip: padding;
+-webkit-background-clip: padding-box;
+background-clip: padding-box; /* prevents bg color from leaking outside the border */
+background-color: #fff; /* layer fill content */
+-moz-box-shadow: 0 5px 5px rgba(0,0,0,.13); /* drop shadow */
+-webkit-box-shadow: 0 5px 5px rgba(0,0,0,.13); /* drop shadow */
+box-shadow: 0 5px 5px rgba(0,0,0,.13); /* drop shadow */
+position: absolute;
+right:0;
+top:-8px;
+}
+.match-res-box {text-align: center;margin:60px auto 80px auto;width:320px;counter-reset: #fff;font-size: 17px;}
+.match-avatar {
+ width: 98px;
+height: 98px;
+-moz-border-radius: 49px;
+-webkit-border-radius: 49px;
+border-radius: 49px; /* border radius */
+-moz-background-clip: padding;
+-webkit-background-clip: padding-box;
+background-clip: padding-box; /* prevents bg color from leaking outside the border */
+background-color: #6b7397; /* layer fill content */
+overflow: hidden;
+background: #6c7398;
+margin: auto;
+}
+.match-res-box .text {text-align: center;margin-top:15px;}
+
+.match-res-box .text span {font-weight: bold;}
+.avatar-s {width: 56px;
+ height: 56px;
+ -moz-border-radius: 28px;
+ -webkit-border-radius: 28px;
+ border-radius: 28px; /* border radius */
+ -moz-background-clip: padding;
+ -webkit-background-clip: padding-box;
+ background-clip: padding-box; /* prevents bg color from leaking outside the border */
+ background-color: #ed6fbb; /* layer fill content */
+ display: inline-block;
+ overflow: hidden;
+ vertical-align: middle;
+ margin-right:20px;
+ }
+
+.camera-list {padding:75px 0 0 90px;}
+
+.camera-list li {float: left;width:400px;padding:0 40px 40px 40px;text-align: center;}
+
+.camera-list .video-box {
+ width: 315px;
+ height: 236px;
+ -moz-border-radius: 24px;
+ -webkit-border-radius: 24px;
+ border-radius: 24px; /* border radius */
+ -moz-background-clip: padding;
+ -webkit-background-clip: padding-box;
+ background-clip: padding-box; /* prevents bg color from leaking outside the border */
+ background-color: #37394b; /* layer fill content */
+ overflow: hidden;
+}
+.camera-list li p {height: 44px;line-height: 44px;font-size: 18px;}
+.camera-list li .icon {width:23px;height: 23px;display: inline-block;vertical-align: middle;margin-right:10px;}
+
+.camera-con {padding-right:350px;position: relative;margin-top:40px;padding-left:40px;}
+.camera-con .list {width:240px;position: absolute;right:50px;top:0;text-align: center;}
+.camera-con .list li {margin-bottom:30px;}
+.camera-con .list li .ca {width:240px;height: 178px;overflow: hidden;border-radius: 20px;}
+.video-box {width:100%;}
+.camera-con .list li p {padding:10px 0 0 0;}
+
+
+.camera-con .list li .icon {width: 23px;
+ height: 23px;
+ display: inline-block;
+ vertical-align: middle;
+ margin-right: 10px;}
+
+ .tab li {float: left;}
+.tab a {font-size: 18px;display: block;width: 180px;height: 58px;list-style: 58px;text-align: center;color: #fff;}
+.tab a:hover,
+.tab a.current {background: #8088ad;}
+.chart .con .hd {padding-left:130px;}
+.chart-bd {padding:20px;}
+.chart-panel {padding-bottom:20px;}
+.left-panel {width:790px;height:380px;float: left;background: #2f3242;padding:10px 20px;}
+
+.right-panel {width:1040px;height: 380px;float: left;margin-left:20px;}
+.panel-hd .right-bar {float:right;color: #9ea3b4;font-size: 16px;}
+.panel-hd {font-size: 25px;color:#fff;height:70px;}
+.panel-hd .select-wrap select{color: #9ea3b4;font-size: 16px;}
+
+.right-panel .panel-hd {background: #3a3e52;height:96px;line-height: 96px;font-size: 25px;color: #fff;text-align: center;}
+.right-panel .list {height:65px;padding:30px 0;}
+.right-panel .list li {padding:30px 100px 30px 85px;position: relative;border-bottom:1px solid #505464;}
+.right-panel .list li .avatar {
+ width: 42px;
+ height: 42px;
+ -moz-border-radius: 21px;
+ -webkit-border-radius: 21px;
+ border-radius: 21px; /* border radius */
+ -moz-background-clip: padding;
+ -webkit-background-clip: padding-box;
+ background-clip: padding-box; /* prevents bg color from leaking outside the border */
+ background-color: #9ba1b1; /* layer fill content */
+ display: block;
+ position: absolute;
+ left:25px;
+ }
+ .right-panel .list li .time {font-size: 16px;color: #fff;}
+ .right-panel .list li .text {color: #9ea3b4;}
+ .right-panel .list li .dot {position: absolute;right:25px;background: url(../image/dot.png) no-repeat center center;width:4px;height: 16px;top:40px;}
diff --git a/demo/mask_detection/web/image/arrow.png b/demo/mask_detection/web/image/arrow.png
new file mode 100644
index 0000000000000000000000000000000000000000..5c636bad6ff3141bd8cfa06c65bcc13eb29e94dc
Binary files /dev/null and b/demo/mask_detection/web/image/arrow.png differ
diff --git a/demo/mask_detection/web/image/ava.png b/demo/mask_detection/web/image/ava.png
new file mode 100644
index 0000000000000000000000000000000000000000..1cfdb55b4508af9c3800d7c8c2d134d1ef7d6ed7
Binary files /dev/null and b/demo/mask_detection/web/image/ava.png differ
diff --git a/demo/mask_detection/web/image/b2f2.png b/demo/mask_detection/web/image/b2f2.png
new file mode 100644
index 0000000000000000000000000000000000000000..5b48d035a3bad3de8745748fc39805bb04df7261
Binary files /dev/null and b/demo/mask_detection/web/image/b2f2.png differ
diff --git a/demo/mask_detection/web/image/cam.png b/demo/mask_detection/web/image/cam.png
new file mode 100644
index 0000000000000000000000000000000000000000..d6616b1ef0754f07ba38deec70227d40e5514ac5
Binary files /dev/null and b/demo/mask_detection/web/image/cam.png differ
diff --git a/demo/mask_detection/web/image/cam1.png b/demo/mask_detection/web/image/cam1.png
new file mode 100644
index 0000000000000000000000000000000000000000..c17ced6cde51b1a0820f55130e1b30d857d54ebb
Binary files /dev/null and b/demo/mask_detection/web/image/cam1.png differ
diff --git a/demo/mask_detection/web/image/cp.png b/demo/mask_detection/web/image/cp.png
new file mode 100644
index 0000000000000000000000000000000000000000..23e6df3b23c795e5fc888c876153abfc35cf994c
Binary files /dev/null and b/demo/mask_detection/web/image/cp.png differ
diff --git a/demo/mask_detection/web/image/df.jpg b/demo/mask_detection/web/image/df.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..81ee01c892c6fa3ea879ed75e0711ff71e49380e
Binary files /dev/null and b/demo/mask_detection/web/image/df.jpg differ
diff --git a/demo/mask_detection/web/image/dot.png b/demo/mask_detection/web/image/dot.png
new file mode 100644
index 0000000000000000000000000000000000000000..ff7b067a59004fa8c5d61e75d1b12201218003c6
Binary files /dev/null and b/demo/mask_detection/web/image/dot.png differ
diff --git a/demo/mask_detection/web/image/icon1.png b/demo/mask_detection/web/image/icon1.png
new file mode 100644
index 0000000000000000000000000000000000000000..15c0d9a95d6a40435003ce12c674524aeb3edcd1
Binary files /dev/null and b/demo/mask_detection/web/image/icon1.png differ
diff --git a/demo/mask_detection/web/image/icon2.png b/demo/mask_detection/web/image/icon2.png
new file mode 100644
index 0000000000000000000000000000000000000000..6e5067406fa028d5c1f25d70476a83350a30076a
Binary files /dev/null and b/demo/mask_detection/web/image/icon2.png differ
diff --git a/demo/mask_detection/web/image/icon3.png b/demo/mask_detection/web/image/icon3.png
new file mode 100644
index 0000000000000000000000000000000000000000..1e08e6b8a7257c9ee92d293d35438ea702b10ba3
Binary files /dev/null and b/demo/mask_detection/web/image/icon3.png differ
diff --git a/demo/mask_detection/web/image/icon4.png b/demo/mask_detection/web/image/icon4.png
new file mode 100644
index 0000000000000000000000000000000000000000..f2e55d4481c25abc11ce44691056d0f35119ee9c
Binary files /dev/null and b/demo/mask_detection/web/image/icon4.png differ
diff --git a/demo/mask_detection/web/image/icon5.png b/demo/mask_detection/web/image/icon5.png
new file mode 100644
index 0000000000000000000000000000000000000000..44f6dd13003dc13063d688674ca8492fad510e5c
Binary files /dev/null and b/demo/mask_detection/web/image/icon5.png differ
diff --git a/demo/mask_detection/web/image/icon6.png b/demo/mask_detection/web/image/icon6.png
new file mode 100644
index 0000000000000000000000000000000000000000..a6a6087780086c4c3a92b4af32093396be9c05cc
Binary files /dev/null and b/demo/mask_detection/web/image/icon6.png differ
diff --git a/demo/mask_detection/web/image/logo.png b/demo/mask_detection/web/image/logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..d42d78883b07db61e117c071950bd831198e2697
Binary files /dev/null and b/demo/mask_detection/web/image/logo.png differ
diff --git a/demo/mask_detection/web/image/map.png b/demo/mask_detection/web/image/map.png
new file mode 100644
index 0000000000000000000000000000000000000000..6319bf6b73640b69902df8eb83a8681b60b72ae5
Binary files /dev/null and b/demo/mask_detection/web/image/map.png differ
diff --git a/demo/mask_detection/web/image/mask.png b/demo/mask_detection/web/image/mask.png
new file mode 100644
index 0000000000000000000000000000000000000000..5f8170c6b302f265c77eccf59baed56ffccce51c
Binary files /dev/null and b/demo/mask_detection/web/image/mask.png differ
diff --git a/demo/mask_detection/web/image/mask1.png b/demo/mask_detection/web/image/mask1.png
new file mode 100644
index 0000000000000000000000000000000000000000..a4c81d96f4909506af07b8f381372947e67bc00e
Binary files /dev/null and b/demo/mask_detection/web/image/mask1.png differ
diff --git a/demo/mask_detection/web/image/mu.png b/demo/mask_detection/web/image/mu.png
new file mode 100644
index 0000000000000000000000000000000000000000..c5142e76ae63ab89da3f66abe4921af7f312e6ad
Binary files /dev/null and b/demo/mask_detection/web/image/mu.png differ
diff --git a/demo/mask_detection/web/image/narrow.png b/demo/mask_detection/web/image/narrow.png
new file mode 100644
index 0000000000000000000000000000000000000000..e320c5f75375dcf73ef8c573a894e3c1c629941a
Binary files /dev/null and b/demo/mask_detection/web/image/narrow.png differ
diff --git a/demo/mask_detection/web/image/nav1.png b/demo/mask_detection/web/image/nav1.png
new file mode 100644
index 0000000000000000000000000000000000000000..1d6fc53cdc7bc5950f88f689c9114b8cd67ccc6e
Binary files /dev/null and b/demo/mask_detection/web/image/nav1.png differ
diff --git a/demo/mask_detection/web/image/nav2.png b/demo/mask_detection/web/image/nav2.png
new file mode 100644
index 0000000000000000000000000000000000000000..76e46557a40a7b10684f21cb803404a3fad7f5a1
Binary files /dev/null and b/demo/mask_detection/web/image/nav2.png differ
diff --git a/demo/mask_detection/web/image/nav3.png b/demo/mask_detection/web/image/nav3.png
new file mode 100644
index 0000000000000000000000000000000000000000..4686a0ee6d4e69c5f4fc84ec6059b2bab7f58310
Binary files /dev/null and b/demo/mask_detection/web/image/nav3.png differ
diff --git a/demo/mask_detection/web/image/point1.png b/demo/mask_detection/web/image/point1.png
new file mode 100644
index 0000000000000000000000000000000000000000..20a9cd5deec1af3909770d80d7c92879e8e18d7f
Binary files /dev/null and b/demo/mask_detection/web/image/point1.png differ
diff --git a/demo/mask_detection/web/image/point2.png b/demo/mask_detection/web/image/point2.png
new file mode 100644
index 0000000000000000000000000000000000000000..24b156f657e80ab8e81714fb174b55014f900fb1
Binary files /dev/null and b/demo/mask_detection/web/image/point2.png differ
diff --git a/demo/mask_detection/web/image/search.png b/demo/mask_detection/web/image/search.png
new file mode 100644
index 0000000000000000000000000000000000000000..af1512bff475474d64bdfdd23626e8e0d89d2fdf
Binary files /dev/null and b/demo/mask_detection/web/image/search.png differ
diff --git a/demo/mask_detection/web/image/t1.png b/demo/mask_detection/web/image/t1.png
new file mode 100644
index 0000000000000000000000000000000000000000..ce8475af2b169bf3611914956e0700bdb1d930d4
Binary files /dev/null and b/demo/mask_detection/web/image/t1.png differ
diff --git a/demo/mask_detection/web/image/t2.png b/demo/mask_detection/web/image/t2.png
new file mode 100644
index 0000000000000000000000000000000000000000..91df4352a696f944dbb5ed2ed6808337e08ce4a8
Binary files /dev/null and b/demo/mask_detection/web/image/t2.png differ
diff --git a/demo/mask_detection/web/image/t3.png b/demo/mask_detection/web/image/t3.png
new file mode 100644
index 0000000000000000000000000000000000000000..8d17abecaa113d58c0d821472ad76732835cdb53
Binary files /dev/null and b/demo/mask_detection/web/image/t3.png differ
diff --git a/demo/mask_detection/web/image/t4.png b/demo/mask_detection/web/image/t4.png
new file mode 100644
index 0000000000000000000000000000000000000000..04b23fe4a54e75b72941bdb6bab2cf6cc2dcae2a
Binary files /dev/null and b/demo/mask_detection/web/image/t4.png differ
diff --git a/demo/mask_detection/web/image/t5.png b/demo/mask_detection/web/image/t5.png
new file mode 100644
index 0000000000000000000000000000000000000000..bcd42b597eafa36fc34fb3a1c5e16be197f6588c
Binary files /dev/null and b/demo/mask_detection/web/image/t5.png differ
diff --git a/demo/mask_detection/web/image/t6.png b/demo/mask_detection/web/image/t6.png
new file mode 100644
index 0000000000000000000000000000000000000000..cc8bbab9bc9a95245300f17ec39fd8f5783ccf62
Binary files /dev/null and b/demo/mask_detection/web/image/t6.png differ
diff --git a/demo/mask_detection/web/image/t7.png b/demo/mask_detection/web/image/t7.png
new file mode 100644
index 0000000000000000000000000000000000000000..b89f96a372c6140fb1757d38503e53d53b15fb15
Binary files /dev/null and b/demo/mask_detection/web/image/t7.png differ
diff --git a/demo/mask_detection/web/image/zoom.png b/demo/mask_detection/web/image/zoom.png
new file mode 100644
index 0000000000000000000000000000000000000000..b642f38e12608b2130a1c098182c95921e92790b
Binary files /dev/null and b/demo/mask_detection/web/image/zoom.png differ
diff --git a/demo/mask_detection/web/index.php b/demo/mask_detection/web/index.php
new file mode 100644
index 0000000000000000000000000000000000000000..41c17aa7684adf72a46929968c16d907520eedab
--- /dev/null
+++ b/demo/mask_detection/web/index.php
@@ -0,0 +1,241 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
摄像头分组显示
+
+
+
摄像头_1
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ |
+
+
+ 无口罩
+
+ 有口罩
+
+ |
+
+
+
+
+
+ deg);"> " height="" />
+
+
+ px;top: px;">
+
+
+ |
+
+
+
+
+
+
+
+
+
+
+
diff --git a/demo/mask_detection/web/js/ckplayer/ckplayer.js b/demo/mask_detection/web/js/ckplayer/ckplayer.js
new file mode 100644
index 0000000000000000000000000000000000000000..6f91adc3a550a6bf2d09cb043623c9b17f875f6f
--- /dev/null
+++ b/demo/mask_detection/web/js/ckplayer/ckplayer.js
@@ -0,0 +1,8182 @@
+/*
+ 软件名称:ckplayer
+ 软件版本:X1
+ 软件作者:http://www.ckplayer.com
+ --------------------------------------------------------------------------------------------------------------------
+ 开发说明:
+ 使用的主要程序语言:javascript(js)及actionscript3.0(as3.0)(as3.0主要用于flashplayer部分的开发,不在该页面呈现)
+ 功能:播放视频
+ 特点:兼容HTML5-VIDEO(优先)以及FlashPlayer
+ =====================================================================================================================
+*/
+function ckplayerConfig() {
+ return {
+ flashvars: {},//用来补充flashvars里的对象
+ languagePath: '',//语言包文件地址
+ stylePath: '',//风格包文件地址
+ config: {
+ fullInteractive: true,//是否开启交互功能
+ delay: 30,//延迟加载视频,单位:毫秒
+ timeFrequency: 100,//计算当前播放时间和加载量的时间频率,单位:毫秒
+ autoLoad: true,//视频是否自动加载
+ loadNext: 0,//多段视频预加载的段数,设置成0则全部加载
+ definition: true,//是否使用清晰度组件
+ smartRemove: true,//是否使用智能清理,使用该功能则在多段时当前播放段之前的段都会被清除出内存,减少对内存的使用
+ bufferTime: 200,//缓存区的长度,单位:毫秒,不要小于10
+ click: true,//是否支持屏幕单击暂停
+ doubleClick: true,//是否支持屏幕双击全屏
+ doubleClickInterval: 200,//判断双击的标准,即二次单击间隔的时间差之内判断为是双击,单位:毫秒
+ keyDown: {
+ space: true,//是否启用空格键切换播放/暂停
+ left: true,//是否启用左方向键快退
+ right: true,//是否启用右方向键快进
+ up: true,//是否支持上方向键增加音量
+ down: true //是否支持下方向键减少音量
+ },
+ timeJump: 10,//快进快退时的秒数
+ volumeJump: 0.1,//音量调整的数量,大于0小于1的小数
+ timeScheduleAdjust: 1,//是否可调节调节栏,0不启用,1是启用,2是只能前进(向右拖动),3是只能后退,4是只能前进但能回到第一次拖动时的位置,5是看过的地方可以随意拖动
+ previewDefaultLoad: true,//预览图片是否默认加载,优点是鼠标第一次经过进度条即可显示预览图片
+ promptSpotTime: false,//提示点文字是否在前面加上对应时间
+ buttonMode: {
+ player: false,//鼠标在播放器上是否显示可点击形态
+ controlBar: false,//鼠标在控制栏上是否显示可点击形态
+ timeSchedule: true,//鼠标在时间进度条上是否显示可点击形态
+ volumeSchedule: true //鼠标在音量调节栏上是否显示可点击形态
+ },
+ liveAndVod: { //直播+点播=回播功能
+ open: false,//是否开启,开启该功能需要设置flashvars里live=true
+ vodTime: 2,//可以回看的整点数
+ start: 'start' //回看请求参数
+ },
+ errorNum: 3,//错误重连次数
+ playCorrect: false,//是否需要错误修正,这是针对rtmp的
+ timeCorrect: true,//http视频播放时间错误纠正,有些因为视频格式的问题导致视频没有实际播放结束视频文件就返回了stop命令
+ m3u8Definition: { //m3u8自动清晰度时按关键字来进行判断
+ //tags:['200k','110k','400k','600k','1000k']
+ },
+ m3u8MaxBufferLength: 30,//m3u8每次缓冲时间,单位:秒数
+ split: '|',//当视频地址采用字符形式并且需要使用逗号或其它符号来切割数组里定义
+ timeStamp: '',//一个地址,用来请求当前时间戳,用于播放器内部时间效准
+ mobileVolumeBarShow: false,//在移动端是否显示音量调节按钮
+ addCallback: 'adPlay,adPause,playOrPause,videoPlay,videoPause,videoMute,videoEscMute,videoClear,changeVolume,fastBack,fastNext,videoSeek,newVideo,getMetaDate,videoRotation,videoBrightness,videoContrast,videoSaturation,videoHue,videoZoom,videoProportion,videoError,addListener,removeListener,addElement,getElement,deleteElement,elementShow,animate,animateResume,animatePause,deleteAnimate,changeConfig,getConfig,openUrl,fullScreen,quitFullScreen,switchFull,screenshot,custom,changeControlBarShow,getCurrentSrc,changeDefinition'//需要支持的事件
+ },
+ menu: { //版权名称支持
+ ckkey: '',
+ name: '',
+ link: '',
+ version: '',
+ domain: '',
+ more: []
+ },
+ style: { //风格部分内容配置,这里主要配置loading和logo以及广告的部分内容
+ loading: { //视频加载前显示在播放器中间的图片,如果不需要可以删除该属性
+ file: 'data:image/swf;base64,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',
+ align: 'center',
+ vAlign: 'middle',
+ offsetX: -100,
+ offsetY: -40
+ },
+ logo: { //显示在右上角的logo图片,如果不需要可以删除该属性
+ file: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFcAAAAUCAYAAAD4BKGuAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAVTSURBVHja1Fl/aJVVGP4cw/mH5tUWi3I53cA0WbeIzMgaq6lQoVawm0S6glHhIKM/TELICotqCxMSGWQRdFfRLEhc9mMxqA0rbdS2wsV0GkZXuaKUWlHvgeeNh7f3u1du3Ft74eGcnXu+c873vD/Pt0nZbDZyZL2gWZAQTBH8IjggeEjgPZASPIB+g/P7EsGT6J/BfHfjHFIv2Jpjj/+dlDskvCm42Jk7X3C7YJOgw/z2oOBGwdEYRW0RVAjOCZ4ugNggqwU3CTLRBJFyQ+xuwVRY14igB78tE9QKpgmeEHwkGKRnq9AeMesHRWwEsYGUxwSdBZ51ecweE4Lct0DsOVjaZvptA8jfC4JfghWpXIJ2jMY+EDShf1pwh6DvX5x1GtpDE43cNFlfhyFWpQ9xd5FgFo3fRi++C+2nCBNBRgU3O6RsEyyEQv4QLMb4CcE9RlFBLqS1WZ6BZ83A35ofVhuvfE5QJrjWebdgCJOx51qM1QgewbMzsO57MDQrB9DeC8ObHd5Xyb2eiNiQQxmtgkZBr+OuZwV7BIcF1RgbF1wTE2MbEccX48VY9sMzBilhTke/m+b1Q9lefpgruI7OsYhIGzPJuAnn3+6EM7vu1YKl5vkrYRSfCGZivCxoMklk7M5j6eFlXyRNRSAvAoFf0Fo/CC7LkbwuQjsZsf0qwbuI9wlYgIqGl6NEzDYibJ/gbmAfxpKoMDRcaSK8xZzjZbK+NMhSYoNSngV5e+ksKXp+JdqZwDDmdpSbsqa9gNAyi5JalSGv3iQ+dtNK9HvI+sNBh2AhvNYVaH+msRtAdsa4ehoKCuQsoP2PY8+kCSkJ5IRWjD2FZ4/BOFSWYv9KhI40eUKQ31CqdnLM1c1OOnHufKSS+iEZvgHNhji8g1yT5VZKdCnHO+ajvrYK/I7GkuSWjwvq8Mzl5M79NF89aCHaBNXmWv0sQVUUZEDwsDnbr2i9s31lKyGuFs7kITEBC+snJaToRYIFrRN0CeYgoSUxJ23WUm85eB41b4IUuIvGtyIMVMY8lzHGMoYworF7J/onKYk10/wVQL6zXYr+Zq9aOEhuXZPDel8Q3If+HMzTeHPKlForEK+mws3SMfH2UMxNLIJbasKsoIQZwVLbKFkN4T1C3HxUMM+EkCAfgjwNV40Y304KriOP+jIHqa+jvYsqnH/kqzKaGCFZxWnoTqooxky8+dHUsOGwr6Jfi9jmlVVTHGLnot9L3qGWqCToWYYRF5fDa96mtb93yI2g8B0IWxlTHWmi/hOG00D4mEJfJ5WhQX7ySCsDUaNkJeud6+sgXCgs3OLEG2/xdZSh10JBeiB1zQU0HuQdSib60rOdm9kFToIL8hmFiRHzm1YM0ylet5k579OFpcUk4I0oD0/QuJ7tcBy5ERY6ixdrh5uNwN3bUV7pd4E+J958HmPxbRRydqK/in6vxj5aH9din/udEPKtuU1GqBL24xJwBInQWiHLcbQVKBXTzkVpHP0tWHsIpZUqPeWcrScXuX2ImRkqlufBhdQl15ig3WLKH0/SeAmtD+uprBqGx1ThhlWN5LKG4lcNKbDblFDjVDU0wWK7yLLqnPNk6cKzKsfXt1GQmQQXSuwymhd3tr9lkvPJMUV152kc2PsmUEMxtzdPRk2SNX2DQ3Vhr02Is18LXjHVAz/bG0NEK8johus3UBiwyfkYlDkQUyLaWrwZBrbHMaB8Z3PJLaYk8IIVKKPSJdxbv3ecynNzLNr33GKLV1YVW4IyfycXfq0UxP4X5HJdXCqX4Wv0AKqYkkipw4LG6WxMNi+GhAtH+M/K8wVe7wuWvwQYAFT+UsGCXmX3AAAAAElFTkSuQmCC',
+ align: 'right',
+ vAlign: 'top',
+ offsetX: -100,
+ offsetY: 10
+ },
+ advertisement: { //广告相关的配置
+ time: 5,//广告默认播放时长以及多个广告时每个广告默认播放时间,单位:秒
+ method: 'get',//广告监测地址默认请求方式,get/post
+ videoForce: false,//视频广告是否强制播放结束
+ videoVolume: 0.8,//视频音量
+ skipButtonShow: true,//是否显示跳过广告按钮
+ linkButtonShow: true,//是否显示广告链接按钮,如果选择显示,只有在提供了广告链接地址时才会显示
+ muteButtonShow: true,//是否在视频广告时显示静音按钮
+ closeButtonShow: true,//暂停时是否显示关闭广告按钮
+ closeOtherButtonShow: true,//其它广告是否需要关闭广告按钮
+ frontSkipButtonDelay: 1,//前置广告跳过广告按钮延时显示的时间,单位:秒
+ insertSkipButtonDelay: 0,//插入广告跳过广告按钮延时显示的时间,单位:秒
+ endSkipButtonDelay: 0,//后置广告跳过广告按钮延时显示的时间,单位:秒
+ frontStretched: 2,//前置广告拉伸方式,0=原始大小,1=自动缩放,2=只有当广告的宽或高大于播放器宽高时才进行缩放,3=参考播放器宽高,4=宽度参考播放器宽、高度自动,5=高度参考播放器高、宽度自动
+ insertStretched: 2,//插入广告拉伸方式,0=原始大小,1=自动缩放,2=只有当广告的宽或高大于播放器宽高时才进行缩放,3=参考播放器宽高,4=宽度参考播放器宽、高度自动,5=高度参考播放器高、宽度自动
+ pauseStretched: 2,//暂停广告拉伸方式,0=原始大小,1=自动缩放,2=只有当广告的宽或高大于播放器宽高时才进行缩放,3=参考播放器宽高,4=宽度参考播放器宽、高度自动,5=高度参考播放器高、宽度自动
+ endStretched: 2 //结束广告拉伸方式,0=原始大小,1=自动缩放,2=只有当广告的宽或高大于播放器宽高时才进行缩放,3=参考播放器宽高,4=宽度参考播放器宽、高度自动,5=高度参考播放器高、宽度自动
+ },
+ video: { //视频的默认比例,当视频元数据里没有宽和高属性时默认使用该宽高
+ defaultWidth: 4,//宽度
+ defaultHeight: 3 //高度
+ }
+ }
+ };
+}
+! (function() {
+ var javascriptPath = '';
+ !function() {
+ var scriptList = document.scripts,
+ thisPath = scriptList[scriptList.length - 1].src;
+ javascriptPath = thisPath.substring(0, thisPath.lastIndexOf('/') + 1);
+ } ();
+ var ckplayer = function(obj) {
+ /*
+ javascript部分开发所用的注释说明:
+ 1:初始化-程序调用时即运行的代码部分
+ 2:定义样式-定义容器(div,p,canvas等)的样式表,即css
+ 3:监听动作-监听元素节点(单击-click,鼠标进入-mouseover,鼠标离开-mouseout,鼠标移动-mousemove等)事件
+ 4:监听事件-监听视频的状态(播放,暂停,全屏,音量调节等)事件
+ 5:共用函数-这类函数在外部也可以使用
+ 6:全局变量-定义成全局使用的变量
+ 7:其它相关注释
+ 全局变量说明:
+ 在本软件中所使用到的全局变量(变量(类型)包括Boolean,String,Int,Object(包含元素对象和变量对象),Array,Function等)
+ 下面列出重要的全局变量:
+ V:Object:视频对象
+ VA:Array:视频列表(包括视频地址,类型,清晰度说明)
+ ID:String:视频ID
+ CB:Object:控制栏各元素的集合对象
+ PD:Object:内部视频容器对象
+ ---------------------------------------------------------------------------------------------
+ 程序开始
+ 下面为需要初始化配置的全局变量
+ 初始化配置
+ config:全局变量定义一些基本配置
+ */
+ this.config = {
+ videoDbClick: true,//是否支持双击全屏/退出全屏动作
+ errorTime: 100,//延迟判断失败的时间,单位:毫秒
+ videoDrawImage: false,//是否使用视频drawImage功能,注意,该功能在移动端表现不了
+ adSkipClick: 'javaScript->adjump' //h5环境中点击跳过广告按钮触发的功能
+ };
+ //全局变量:播放器默认配置,在外部传递过来相应配置后,则进行相关替换
+ this.varsConfig = {
+ playerID: '',//播放器ID
+ container: '',//视频容器的ID
+ variable: 'ckplayer',//播放函数(变量)名称
+ volume: 0.8,//默认音量,范围0-1
+ poster: '',//封面图片地址
+ autoplay: false,//是否自动播放
+ loop: false,//是否需要循环播放
+ live: false,//是否是直播
+ duration: 0,//指定总时间
+ seek: 0,//默认需要跳转的秒数
+ drag: '',//拖动时支持的前置参数
+ front: '',//前一集按钮动作
+ next: '',//下一集按钮动作
+ loaded: '',//加载播放器后调用的函数
+ flashplayer: false,//设置成true则强制使用flashplayer
+ html5m3u8: false,//PC平台上是否使用h5播放器播放m3u8
+ track: null,//字幕轨道
+ cktrack: null,//ck字幕
+ preview: null,//预览图片对象
+ prompt: null,//提示点功能
+ video: null,//视频地址
+ config: '',//调用配置函数名称
+ type: '',//视频格式
+ crossorigin: '',//设置html5视频的crossOrigin属性
+ crossdomain: '',//安全策略文件地址
+ unescape: false,//默认flashplayer里需要解码
+ mobileCkControls: false,//移动端h5显示控制栏
+ mobileAutoFull: true,//移动端是否默认全屏播放
+ playbackrate: 1,//默认倍速
+ h5container: '',//h5环境中使用自定义容器
+ debug: false,//是否开启调试模式
+ //以下为广告相关配置
+ adfront: '',
+ adfronttime: '',
+ adfrontlink: '',
+ adpause: '',
+ adpausetime: '',
+ adpauselink: '',
+ adinsert: '',
+ adinserttime: '',
+ adinsertlink: '',
+ inserttime: '',
+ adend: '',
+ adendtime: '',
+ adendlink: '',
+ advertisements: ''
+ };
+ this.vars = {};//全局变量:语言配置
+ this.language = {
+ volume: '音量:',
+ play: '点击播放',
+ pause: '点击暂停',
+ full: '点击全屏',
+ escFull: '退出全屏',
+ mute: '点击静音',
+ escMute: '取消静音',
+ front: '上一集',
+ next: '下一集',
+ definition: '点击选择清晰度',
+ playbackRate: '点击选择速度',
+ error: '加载出错',
+ adTime: '广告{$second}秒',
+ skipAd: '跳过广告',
+ skipAdTime: '{$second}秒后可跳过广告',
+ adLink: '查看详情'
+ };
+ //全局变量:右键菜单:[菜单标题,类型(link:链接,default:灰色,function:调用函数,javascript:调用js函数),执行内容(包含链接地址,函数名称),[line(间隔线)]]
+ this.contextMenu = [['ckplayer', 'link', 'http://www.ckplayer.com', '_blank'], ['version:X1', 'default', 'line']];
+ //全局变量:错误提示列表
+ this.errorList = [['000', 'Object does not exist'], ['001', 'Variables type is not a object'], ['002', 'Video object does not exist'], ['003', 'Video object format error'], ['004', 'Video object format error'], ['005', 'Video object format error'], ['006', '[error] does not exist '], ['007', 'Ajax error'], ['008', 'Ajax error'], ['009', 'Ajax object format error'], ['010', 'Ajax.status:[error]']];
+ //全局变量:HTML5变速播放的值数组/如果不需要可以设置成null
+ this.playbackRateArr = [[0.5, '0.5倍'], [1, '正常'], [1.25, '1.25倍'], [1.5, '1.5倍'], [2, '2倍速'], [4, '4倍速']];
+ //全局变量:HTML5默认变速播放的值
+ this.playbackRateDefault = 1;
+ //全局变量:定义logo
+ this.logo = '';
+ //全局变量:是否加载了播放器
+ this.loaded = false;
+ //全局变量:计时器,监听视频加载出错的状态
+ this.timerError = null;
+ //全局变量:是否出错
+ this.error = false;
+ //全局变量:出错地址的数组
+ this.errorUrl = [];
+ //全局变量:计时器,监听全屏与非全屏状态
+ this.timerFull = null;
+ //全局变量:是否全屏状态
+ this.full = false;
+ //全局变量:计时器,监听当前的月/日 时=分=秒
+ this.timerTime = null;
+ //全局变量:计时器,监听视频加载
+ this.timerBuffer = null;
+ //全局变量:设置进度按钮及进度条是否跟着时间变化,该属性主要用来在按下进度按钮时暂停进度按钮移动和进度条的长度变化
+ this.isTimeButtonMove = true;
+ //全局变量:进度栏是否有效,如果是直播,则不需要监听时间让进度按钮和进度条变化
+ this.isTimeButtonDown = false;
+ //全局变量:用来模拟双击功能的判断
+ this.isClick = false;
+ //全局变量:计时器,用来模拟双击功能的计时器
+ this.timerClick = null;
+ //全局变量:计时器,旋转loading
+ this.timerLoading = null;
+ //全局变量:计时器,监听鼠标在视频上移动显示控制栏
+ this.timerCBar = null;
+ //全局变量:播放视频时如果该变量的值大于0,则进行跳转后设置该值为0
+ this.needSeek = 0;
+ //全局变量:当前音量
+ this.volume = 0;
+ //全局变量:静音时保存临时音量
+ this.volumeTemp = 0;
+ //全局变量/变量类型:Number/功能:当前播放时间
+ this.time = 0;
+ //全局变量:定义首次调用
+ this.isFirst = true;
+ //全局变量:是否使用HTML5-VIDEO播放
+ this.html5Video = true;
+ //全局变量记录视频容器节点的x;y
+ this.pdCoor = {
+ x: 0,
+ y: 0
+ };
+ //全局变量:判断当前使用的播放器类型,html5video或flashplayer
+ this.playerType = '';
+ //全局变量:加载进度条的长度
+ this.loadTime = 0;
+ //全局变量:body对象
+ this.body = document.body || document.documentElement;
+ //全局变量:播放器
+ this.V = null;
+ //全局变量:保存外部js监听事件数组
+ this.listenerJsArr = [];
+ //全局变量:保存控制栏显示元素的总宽度
+ this.buttonLen = 0;
+ //全局变量:保存控制栏显示元素的数组
+ this.buttonArr = [];
+ //全局变量:保存按钮元素的宽
+ this.buttonWidth = {};
+ //全局变量:保存播放器上新增元件的数组
+ this.elementArr = [];
+ //全局变量:保存播放器上弹幕的临时数组
+ this.elementTempArr = [];
+ //全局变量:字幕内容
+ this.track = [];
+ //全局变量:字幕索引
+ this.trackIndex = 0;
+ //全局变量:当前显示的字幕内容
+ this.nowTrackShow = {
+ sn: ''
+ };
+ //全局变量:保存字幕元件数组
+ this.trackElement = [];
+ //全局变量:将视频转换为图片
+ this.timerVCanvas = null;
+ //全局变量:animate,缓动对象数组
+ this.animateArray = [];
+ //全局变量:保存animate的元件
+ this.animateElementArray = [];
+ //全局变量:保存需要在暂停时停止缓动的数组
+ this.animatePauseArray = [];
+ //全局变量:预览图片加载状态/0=没有加载,1=正在加载,2=加载完成
+ this.previewStart = 0;
+ //全局变量:预览图片容器
+ this.previewDiv = null;
+ //全局变量:预览框
+ this.previewTop = null;
+ //全局变量:预览框的宽
+ this.previewWidth = 120;
+ //全局变量:预览图片容器缓动函数
+ this.previewTween = null;
+ //全局变量:是否是m3u8格式,是的话则可以加载hls.js
+ this.isM3u8 = false;
+ //全局变量:保存提示点数组
+ this.promptArr = [];
+ //全局变量:显示提示点文件的容器
+ this.promptElement = null;
+ //全局变量:配置文件函数
+ this.ckplayerConfig = {};
+ //全局变量:控制栏是否显示
+ this.showFace = true;
+ //全局变量:是否监听过h5的错误
+ this.errorAdd = false;
+ //全局变量:是否发送了错误
+ this.errorSend = false;
+ //全局变量:控制栏是否隐藏
+ this.controlBarIsShow = true;
+ //全局变量,保存当前缩放比例
+ this.videoScale = 1;
+ //全局变量:设置字体
+ this.fontFamily = '"Microsoft YaHei"; YaHei; "\5FAE\8F6F\96C5\9ED1"; SimHei; "\9ED1\4F53";Arial';
+ //全局变量:记录第一次拖动进度按钮时的位置
+ this.timeSliderLeftTemp = 0;
+ //全局变量:判断是否记录了总时间
+ this.durationSendJS = false;
+ //全局变量:初始化广告分析是否结束设置
+ this.adAnalysisEnd = false;
+ //全局变量:广告变量
+ this.advertisements = {};
+ //全局变量:是否是第一次播放视频
+ this.isFirstTimePlay = true;
+ //全局变量:当前需要播放的广告类型
+ this.adType = '';
+ //全局变量:播放广告计数
+ this.adI = 0;
+ //全局变量:要播放的临时地址
+ this.videoTemp = {
+ src: '',
+ source: '',
+ currentSrc: '',
+ loop: false
+ };
+ //全局变量:当前要播放的广告组总时间
+ this.adTimeAllTotal = 0;
+ //全局变量:肖前要播放的广告时间
+ this.adTimeTotal = 0;
+ //全局变量:用来做倒计时
+ this.adCountDownObj = null;
+ //全局变量:前置,中插,结尾广告是否已开始运行
+ this.adPlayStart = false;
+ //全局变量:目前是否在播放广告
+ this.adPlayerPlay = false;
+ //全局变量:当前广告是否暂停
+ this.adIsPause = false;
+ //全局变量:视频广告是否静音
+ this.adVideoMute = false;
+ //全局变量:是否需要记录当前播放的时间供广告播放结束后进行跳转
+ this.adIsVideoTime = false;
+ //全局变量:后置广告是否播放
+ this.endAdPlay = false;
+ //全局变量:暂停广告是否在显示
+ this.adPauseShow = false;
+ //全局变量:是否需要重置广告以实现重新播放时再播放一次
+ this.adReset = false;
+ //全局变量:是否在播放广告时播放过视频广告
+ this.adVideoPlay = false;
+ if (obj) {
+ this.embed(obj);
+ }
+ };
+ ckplayer.prototype = {
+ /*
+ 主要函数部分开始
+ 主接口函数:
+ 调用播放器需初始化该函数
+ */
+ embed: function(c) {
+ //c:Object:是调用接口传递的属性对象
+ if (window.location.href.substr(0, 7) == 'file://') {//如果是使用的file协议打网页则弹出提示
+ alert('Please use the HTTP protocol to open the page');
+ return;
+ }
+ if (c == undefined || !c) {
+ this.eject(this.errorList[0]);
+ return;
+ }
+ if (typeof(c) != 'object') {
+ this.eject(this.errorList[1]);
+ }
+ this.vars = this.standardization(this.varsConfig, c);
+ if (!this.vars['mobileCkControls'] && this.isMobile()) {
+ this.vars['flashplayer'] = false;
+ this.showFace = false;
+ }
+ var videoString = this.vars['video'];
+ if (!videoString) {
+ this.eject(this.errorList[2]);
+ return;
+ }
+ if (typeof(videoString) == 'string') {
+ if (videoString.substr(0, 3) == 'CK:' || videoString.substr(0, 3) == 'CE:' || videoString.substr(8, 3) == 'CK:' || videoString.substr(8, 3) == 'CE:') {
+ this.vars['flashplayer'] = true;
+ }
+ }
+ if (typeof(videoString) == 'object') {
+ if (videoString.length > 1) {
+ if (videoString[0][0].substr(0, 3) == 'CK:' || videoString[0][0].substr(0, 3) == 'CE:' || videoString[0][0].substr(8, 3) == 'CK:' || videoString[0][0].substr(8, 3) == 'CE:') {
+ this.vars['flashplayer'] = true;
+ }
+ }
+ }
+ if (this.vars['config']) {
+ this.ckplayerConfig = eval(this.vars['config'] + '()');
+ } else {
+ this.ckplayerConfig = ckplayerConfig();
+ }
+ if ((!this.supportVideo() && this.vars['flashplayer'] != '') || (this.vars['flashplayer'] && this.uploadFlash()) || !this.isMsie()) {
+ this.html5Video = false;
+ this.getVideo();
+ } else if (videoString) {
+ //判断视频数据类型
+ this.analysedVideoUrl(videoString);
+ return this;
+ } else {
+ this.eject(this.errorList[2]);
+ }
+ },
+ /*
+ 内部函数
+ 根据外部传递过来的video开始分析视频地址
+ */
+ analysedVideoUrl: function(video) {
+ var i = 0,
+ y = 0;
+ var thisTemp = this;
+ this.VA = [];//定义全局变量VA:视频列表(包括视频地址,类型,清晰度说明)
+ if (typeof(video) == 'string') { //如果是字符形式的则判断后缀进行填充
+ if (video.substr(0, 8) != 'website:') {
+ this.VA = [[video, '', '', 0]];
+ var fileExt = this.getFileExt(video);
+ switch (fileExt) {
+ case '.mp4':
+ this.VA[0][1] = 'video/mp4';
+ break;
+ case '.ogg':
+ this.VA[0][1] = 'video/ogg';
+ break;
+ case '.webm':
+ this.VA[0][1] = 'video/webm';
+ break;
+ default:
+ break;
+ }
+ this.getVideo();
+ } else {
+ if (this.html5Video) {
+ var ajaxObj = {
+ url: video.substr(8),
+ success: function(data) {
+ if (data) {
+ thisTemp.analysedUrl(data);
+ } else {
+ thisTemp.eject(thisTemp.errorList[5]);
+ this.VA = video;
+ thisTemp.getVideo();
+ }
+ }
+ };
+ this.ajax(ajaxObj);
+ } else {
+ this.VA = video;
+ this.getVideo();
+ }
+
+ }
+ } else if (typeof(video) == 'object') { //如果视频地址是对象或数组
+ if (!this.isUndefined(typeof(video.length))) { //如果视频地址是数组
+ if (!this.isUndefined(typeof(video[0].length))) { //如果视频地址是二维数组
+ this.VA = video;
+ }
+ this.getVideo();
+ } else {
+ /*
+ 如果video格式是对象形式,则分二种
+ 如果video对象里包含type,则直接播放
+ */
+ if (!this.isUndefined(video['type'])) {
+ this.VA.push([video['file'], video['type'], '', 0]);
+ this.getVideo();
+ } else {
+ this.eject(this.errorList[5]);
+ }
+ }
+ } else {
+ this.eject(this.errorList[4]);
+ }
+ },
+ /*
+ 对请求到的视频地址进行重新分析
+ */
+ analysedUrl: function(data) {
+ this.vars = this.standardization(this.vars, data);
+ if (!this.isUndefined(data['video'])) {
+ this.vars['video'] = data['video'];
+ }
+ this.analysedVideoUrl(this.vars['video']);
+ },
+ /*
+ 内部函数
+ 检查浏览器支持的视频格式,如果是则将支持的视频格式重新分组给播放列表
+ */
+ getHtml5Video: function() {
+ var va = this.VA;
+ var nva = [];
+ var mobile = false;
+ var video = document.createElement('video');
+ var codecs = function(type) {
+ var cod = '';
+ switch (type) {
+ case 'video/mp4':
+ cod = 'avc1.4D401E, mp4a.40.2';
+ break;
+ case 'video/ogg':
+ cod = 'theora, vorbis';
+ break;
+ case 'video/webm':
+ cod = 'vp8.0, vorbis';
+ break;
+ default:
+ break;
+ }
+ return cod;
+ };
+ var supportType = function(vidType, codType) {
+ if (!video.canPlayType) {
+ this.html5Video = false;
+ return;
+ }
+ var isSupp = video.canPlayType(vidType + ';codecs="' + codType + '"');
+ if (isSupp == '') {
+ return false
+ }
+ return true;
+ };
+ if (this.vars['flashplayer'] || !this.isMsie()) {
+ this.html5Video = false;
+ return;
+ }
+ if (this.isMobile()) {
+ mobile = true;
+ }
+ for (var i = 0; i < va.length; i++) {
+ var v = va[i];
+ if (v) {
+ if (v[1] != '' && !mobile && supportType(v[1], codecs(v[1])) && v[0].substr(0, 4) != 'rtmp') {
+ nva.push(v);
+ }
+ if ((this.getFileExt(v[0]) == '.m3u8' || this.vars['type'] == 'video/m3u8' || this.vars['type'] == 'm3u8' || v[1] == 'video/m3u8' || v[1] == 'm3u8') && this.vars['html5m3u8']) {
+ this.isM3u8 = true;
+ nva.push(v);
+ }
+ }
+ }
+ if (nva.length > 0) {
+ this.VA = nva;
+ } else {
+ if (!mobile) {
+ this.html5Video = false;
+ }
+ }
+ },
+ /*
+ 内部函数
+ 根据视频地址开始构建播放器
+ */
+ getVideo: function() {
+ var thisTemp = this;
+ var v = this.vars;
+ //如果存在广告字段则开始分析广告
+ if (!this.adAnalysisEnd && (v['adfront'] != '' || v['adpause'] != '' || v['adinsert'] != '' || v['adend'] != '' || v['advertisements'] != '')) {
+ this.adAnalysisEnd = true;
+ this.adAnalysis();
+ return;
+ }
+ //如果存在字幕则加载
+ if (this.V) { //如果播放器已存在,则认为是从newVideo函数发送过来的请求
+ this.changeVideo();
+ return;
+ }
+ if (this.vars['cktrack']) {
+ this.loadTrack();
+ }
+ if (this.supportVideo() && !this.vars['flashplayer']) {
+ this.getHtml5Video(); //判断浏览器支持的视频格式
+ }
+ var src = '',
+ source = '',
+ poster = '',
+ loop = '',
+ autoplay = '',
+ track = '';
+ var video = v['video'];
+ var i = 0;
+ this.CD = this.getByElement(v['container']);
+ volume = v['volume'];
+ if (!this.CD) {
+ this.eject(this.errorList[6], v['container']);
+ return false;
+ }
+ //开始构建播放器容器
+ this.V = undefined;
+ var thisPd = null;
+ if (v['h5container'] != '') {
+ thisPd = this.getByElement(v['h5container']);
+ if (this.isUndefined(thisPd)) {
+ thisPd = null;
+ }
+ }
+ var isVideoH5 = null; //isUndefined thisPd
+ if (v['playerID'] != '') {
+ isVideoH5 = this.getByElement('#' + v['playerID']);
+ if (this.isUndefined(isVideoH5)) {
+ isVideoH5 = null;
+ }
+ }
+ if (thisPd != null && isVideoH5 != null) {
+ this.PD = thisPd; //PD:定义播放器容器对象全局变量
+ } else {
+ var playerID = 'ckplayer' + this.randomString();
+ var playerDiv = document.createElement('div');
+ playerDiv.className = playerID;
+ this.CD.innerHTML = '';
+ this.CD.appendChild(playerDiv);
+ this.PD = this.getByElement(playerID); //PD:定义播放器容器对象全局变量
+ }
+ this.css(this.CD, {
+ backgroundColor: '#000000',
+ overflow: 'hidden',
+ position: 'relative'
+ });
+ this.css(this.PD, {
+ backgroundColor: '#000000',
+ width: '100%',
+ height: '100%',
+ fontFamily: this.fontFamily
+ });
+ if (this.html5Video) { //如果支持HTML5-VIDEO则默认使用HTML5-VIDEO播放器
+ //禁止播放器容器上鼠标选择文本
+ this.PD.onselectstart = this.PD.ondrag = function() {
+ return false;
+ };
+ //播放器容器构建完成并且设置好样式
+ //构建播放器
+ if (this.VA.length == 1) {
+ this.videoTemp['src'] = decodeURIComponent(this.VA[0][0]);
+ src = ' src="' + this.videoTemp['src'] + '"';
+
+ } else {
+ var videoArr = this.VA.slice(0);
+ videoArr = this.arrSort(videoArr);
+ for (i = 0; i < videoArr.length; i++) {
+ var type = '';
+ var va = videoArr[i];
+ if (va[1]) {
+ type = ' type="' + va[1] + '"';
+ if (type == ' type="video/m3u8"' || type == ' type="m3u8"') {
+ type = '';
+ }
+ }
+ source += '