pu428f3pz
/
NewEduCoderBuild
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from '15d3d8a831'
${ noResults }
NewEduCoderBuild/8423.async.js

818 lines
33 KiB
Raw Blame History

"use strict";
(self["webpackChunk"] = self["webpackChunk"] || []).push([[8423],{
/***/ 8423:
/*!*********************************************************!*\
!*** ./src/components/Video/Play/index.jsx + 1 modules ***!
\*********************************************************/
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
// EXPORTS
__webpack_require__.d(__webpack_exports__, {
"Z": function() { return /* binding */ Play; }
});
// EXTERNAL MODULE: ./node_modules/antd/es/message/style/index.js + 1 modules
var style = __webpack_require__(14934);
// EXTERNAL MODULE: ./node_modules/antd/es/message/index.js + 1 modules
var message = __webpack_require__(12461);
// EXTERNAL MODULE: ./node_modules/@babel/runtime/helpers/regeneratorRuntime.js
var regeneratorRuntime = __webpack_require__(17061);
var regeneratorRuntime_default = /*#__PURE__*/__webpack_require__.n(regeneratorRuntime);
// EXTERNAL MODULE: ./node_modules/@babel/runtime/helpers/asyncToGenerator.js
var asyncToGenerator = __webpack_require__(17156);
var asyncToGenerator_default = /*#__PURE__*/__webpack_require__.n(asyncToGenerator);
// EXTERNAL MODULE: ./node_modules/react/index.js
var react = __webpack_require__(67294);
// EXTERNAL MODULE: ./node_modules/flv.js/src/flv.js + 38 modules
var flv = __webpack_require__(99160);
// EXTERNAL MODULE: ./node_modules/hls.js/dist/hls.js
var dist_hls = __webpack_require__(67631);
var hls_default = /*#__PURE__*/__webpack_require__.n(dist_hls);
// EXTERNAL MODULE: ./src/utils/authority.ts
var authority = __webpack_require__(7);
// EXTERNAL MODULE: ./node_modules/react-copy-to-clipboard/lib/index.js
var lib = __webpack_require__(74855);
// EXTERNAL MODULE: ./src/utils/fullscreen.ts
var fullscreen = __webpack_require__(15994);
;// CONCATENATED MODULE: ./src/components/Video/Play/index.less?modules
// extracted by mini-css-extract-plugin
/* harmony default export */ var Playmodules = ({"watermark":"watermark___hNYlv","videovideo":"videovideo___ovOkV","animate__loop":"animate__loop___mvL6s","upDown":"upDown___SlgHv","container":"container___g1WYG","video-container":"video-container___XPkWR","video-controls":"video-controls___to0Zq","hide":"hide___NA3DV","video-progress":"video-progress___gqHsd","seek":"seek___iZHBm","seek-tooltip":"seek-tooltip___uWyXx","bottom-controls":"bottom-controls___uoIBm","left-controls":"left-controls___mBEx4","right-controls":"right-controls___e9L6r","volume-controls":"volume-controls___fa3mE","fullscreen-button":"fullscreen-button___ur0es","fullscreen-button1":"fullscreen-button1___rfaXm","pip-button":"pip-button___GFO8W","playback-animation":"playback-animation___ndURq","volume":"volume___OTmpP","hidden":"hidden___o7GkT"});
// EXTERNAL MODULE: ./node_modules/react/jsx-runtime.js
var jsx_runtime = __webpack_require__(85893);
;// CONCATENATED MODULE: ./src/components/Video/Play/index.jsx
function formatTime(timeInSeconds) {
if (isNaN(timeInSeconds)) {
return {
minutes: '00',
seconds: '00'
};
}
var result = new Date(timeInSeconds * 1000).toISOString().substr(11, 8);
return {
hour: result.substr(0, 2),
minutes: result.substr(3, 2),
seconds: result.substr(6, 2)
};
}
Object.defineProperty(HTMLMediaElement.prototype, 'playing', {
get: function get() {
return !!(this.currentTime > 0 && !this.paused && !this.ended && this.readyState > 2);
}
});
function compareNumbers(a, b) {
return a - b;
}
function getTotalEffectTime(pos) {
pos.sort(compareNumbers);
var sum = 0;
for (var i = 0; i < pos.length - 1; i++) {
var v = Math.abs(pos[i + 1] - pos[i]);
if (v < 21) {
sum += v;
}
}
return sum;
}
var regex = /(android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini)/i;
//接口文档 https://www.showdoc.cc/educoder?page_id=4029884447803706
/* harmony default export */ var Play = (/*#__PURE__*/(0,react.forwardRef)(function (_ref, ref) {
var _src, _src2, _src2$split;
var src = _ref.src,
toLog = _ref.toLog,
videoId = _ref.videoId,
logWatchHistory = _ref.logWatchHistory,
_ref$courseId = _ref.courseId,
courseId = _ref$courseId === void 0 ? null : _ref$courseId,
startTime = _ref.startTime,
_ref$handlePause = _ref.handlePause,
handlePause = _ref$handlePause === void 0 ? function () {} : _ref$handlePause,
_ref$handlePlay = _ref.handlePlay,
handlePlay = _ref$handlePlay === void 0 ? function () {} : _ref$handlePlay,
_ref$handlePlayEnded = _ref.handlePlayEnded,
handlePlayEnded = _ref$handlePlayEnded === void 0 ? function () {} : _ref$handlePlayEnded,
_ref$videoSpeed = _ref.videoSpeed,
videoSpeed = _ref$videoSpeed === void 0 ? 1 : _ref$videoSpeed;
src = (_src = src) === null || _src === void 0 ? void 0 : _src.replace('http://', 'https://');
var suf = (_src2 = src) === null || _src2 === void 0 ? void 0 : (_src2$split = _src2.split('.')) === null || _src2$split === void 0 ? void 0 : _src2$split.pop();
var isFlv = suf === 'flv';
var el = (0,react.useRef)();
var watermarkRef = (0,react.useRef)();
var warpEl = (0,react.useRef)();
var pauseIcon = (0,react.useRef)();
var playIcon = (0,react.useRef)();
var seekEl = (0,react.useRef)();
var progressBarEl = (0,react.useRef)();
var durationEl = (0,react.useRef)();
var timeElapsedEl = (0,react.useRef)();
var seekTooltipEl = (0,react.useRef)();
var noMuteVolEl = (0,react.useRef)();
var highVolEl = (0,react.useRef)();
var lowVolEl = (0,react.useRef)();
var volumeEl = (0,react.useRef)();
var deviceMatch = navigator.userAgent.toLowerCase().match(regex);
var device = deviceMatch ? deviceMatch[0] : 'pc';
var firstOnPlayFlag = (0,react.useRef)(false);
var user = (0,authority/* userInfo */.eY)();
var totalDuration = 0;
var sumTimePlayed = 0;
var lastUpdatedTime = 0;
var logId = null;
var initLog = false;
var timeTick = 20; //记录频率 默认20s
var logCount = 1;
var isLoging = false;
var isSeeking = false;
var pos = []; //播放时间点集
(0,react.useImperativeHandle)(ref, function () {
return {
getLastUpdatedTime: function getLastUpdatedTime() {
return el.current.currentTime;
},
getDuration: function getDuration() {
return el.current.duration;
}
};
});
var log = (0,react.useCallback)(function (callback) {
var isEnd = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
var params = {
point: el.current.currentTime
};
if (logId) {
params['log_id'] = logId;
params['watch_duration'] = getTotalEffectTime(pos); //当前观看视频时长，拖放进度条，重复的视频片段观看时，不会把重复的时长累积进来，最大时长是视频的总时长
params['total_duration'] = sumTimePlayed; //累计观看视频时长，拖放进度条，重复的视频片段观看时，重复观看时长要累积进来
} else {
if (courseId) {
params['video_id'] = parseInt(videoId, 10);
params['course_id'] = courseId;
} else {
params['video_id'] = videoId;
}
params['duration'] = totalDuration;
params['device'] = device;
}
if (isEnd) {
params['ed'] = '1';
}
function getLogId() {
return _getLogId.apply(this, arguments);
}
function _getLogId() {
_getLogId = asyncToGenerator_default()( /*#__PURE__*/regeneratorRuntime_default()().mark(function _callee() {
var id;
return regeneratorRuntime_default()().wrap(function _callee$(_context) {
while (1) switch (_context.prev = _context.next) {
case 0:
isLoging = true;
_context.next = 3;
return logWatchHistory(params);
case 3:
id = _context.sent;
logId = id;
isLoging = false;
if (callback) {
callback();
}
case 7:
case "end":
return _context.stop();
}
}, _callee);
}));
return _getLogId.apply(this, arguments);
}
getLogId();
}, [videoId, courseId]);
(0,react.useEffect)(function () {
var _src3;
message/* default.destroy */.ZP.destroy();
var player = null;
if (flv/* default.isSupported */.Z.isSupported && isFlv && src && ((_src3 = src) === null || _src3 === void 0 ? void 0 : _src3.indexOf('.m3u8')) < 0) {
player = flv/* default.createPlayer */.Z.createPlayer({
type: 'flv',
volume: 0.8,
cors: true,
url: src,
muted: false
});
if (el.current) {
player.attachMediaElement(el.current);
player.load();
}
} else {
el.current.setAttribute('src', src);
}
updateVolumeIcon();
return function () {
if (player) {
player.unload();
player.pause();
player.destroy();
player = null;
}
};
}, [el, isFlv, src]);
function playIconStatus() {
if (el.current.paused) {
pauseIcon.current.style.display = 'none';
playIcon.current.style.display = 'block';
} else {
pauseIcon.current.style.display = 'block';
playIcon.current.style.display = 'none';
}
}
function updateVolumeIcon() {
noMuteVolEl.current.style.display = 'none';
lowVolEl.current.style.display = 'none';
highVolEl.current.style.display = 'none';
if (el.current.muted || el.current.volume === 0) {
noMuteVolEl.current.style.display = 'block';
} else if (el.current.volume > 0 && el.current.volume <= 0.5) {
lowVolEl.current.style.display = 'block';
} else {
highVolEl.current.style.display = 'block';
}
}
(0,react.useEffect)(function () {
var playButton = document.getElementById('play');
var playbackIcons = document.querySelectorAll('.playback-icons use');
function onPlay() {
handlePlay();
if (startTime && !firstOnPlayFlag.current) {
el.current.currentTime = startTime;
}
firstOnPlayFlag.current = true;
pos.push(el.current.currentTime);
if (!initLog) {
initLog = true;
if (toLog) {
log();
}
}
}
//循环播放， 累计时长不能清空
function onEnded() {
return _onEnded.apply(this, arguments);
}
function _onEnded() {
_onEnded = asyncToGenerator_default()( /*#__PURE__*/regeneratorRuntime_default()().mark(function _callee2() {
return regeneratorRuntime_default()().wrap(function _callee2$(_context2) {
while (1) switch (_context2.prev = _context2.next) {
case 0:
playIconStatus();
pos.push(el.current.currentTime);
if (toLog) {
log(function () {
logId = null;
lastUpdatedTime = 0;
initLog = false;
isLoging = false;
isSeeking = false;
pos = []; //有效时长重新累计，算新的一遍
sumTimePlayed = 0;
logCount = 1;
}, true);
}
case 3:
case "end":
return _context2.stop();
}
}, _callee2);
}));
return _onEnded.apply(this, arguments);
}
function updateProgress() {
// seekEl.current.value = Math.floor(el.current.currentTime);
// progressBarEl.current.value = Math.floor(el.current.currentTime);
seekEl.current.value = Math.round(el.current.currentTime);
progressBarEl.current.value = Math.round(el.current.currentTime);
}
function updateTimeElapsed() {
var time = formatTime(Math.round(el.current.currentTime));
timeElapsedEl.current.innerText = "".concat(time.hour > 0 ? time.hour + ':' : '').concat(time.minutes, ":").concat(time.seconds);
timeElapsedEl.current.setAttribute('datetime', "".concat(time.hour > 0 ? ' ' + time.hour + ' ' : '').concat(time.minutes, "m ").concat(time.seconds, "s"));
}
function initializeVideo() {
var videoDuration = Math.round(el.current.duration);
seekEl.current.setAttribute('max', videoDuration);
progressBarEl.current.setAttribute('max', videoDuration);
var time = formatTime(videoDuration);
durationEl.current.innerText = "".concat(time.hour > 0 ? time.hour + ':' : '').concat(time.minutes, ":").concat(time.seconds);
durationEl.current.setAttribute('datetime', "".concat(time.hour > 0 ? ' ' + time.hour + ' ' : '').concat(time.minutes, "m ").concat(time.seconds, "s"));
}
function onTimeupdate() {
var videoDuration = Math.round(el.current.duration);
seekEl.current.setAttribute('max', videoDuration);
progressBarEl.current.setAttribute('max', videoDuration);
var time = formatTime(videoDuration);
durationEl.current.innerText = "".concat(time.hour > 0 ? time.hour + ':' : '').concat(time.minutes, ":").concat(time.seconds);
durationEl.current.setAttribute('datetime', "".concat(time.hour > 0 ? ' ' + time.hour + ' ' : '').concat(time.minutes, "m ").concat(time.seconds, "s"));
updateProgress();
updateTimeElapsed();
var _watermarkRef$current = watermarkRef.current.getBoundingClientRect(),
width = _watermarkRef$current.width,
height = _watermarkRef$current.height,
x = _watermarkRef$current.x,
y = _watermarkRef$current.y;
if (x < 0 || y < 0 || !width) {
// el.current.src = '';
// el.current.pause();
// message.warn({
// content: '当前操作非法，已禁止观看视频',
// key: 'watermarkRef',
// });
return;
}
if (!isSeeking) {
var newTime = el.current.currentTime;
var timeDiff = newTime - lastUpdatedTime;
//currenttime update before Seeking & Seeked fired
if (Math.abs(timeDiff) < 10) {
sumTimePlayed += Math.abs(timeDiff);
lastUpdatedTime = newTime;
if (!isLoging) {
if (sumTimePlayed - logCount * timeTick >= 0) {
logCount++;
pos.push(lastUpdatedTime);
if (toLog) {
log();
}
}
}
} else {
lastUpdatedTime = newTime;
if (toLog) {
log();
}
}
}
}
function onSeeking() {
isSeeking = true;
}
function onSeeked() {
if (el.current.playing) {
pos.push(el.current.currentTime, lastUpdatedTime);
}
lastUpdatedTime = el.current.currentTime;
isSeeking = false;
}
function onCanPlay() {
totalDuration = el.current.duration;
if (totalDuration <= 20) {
timeTick = totalDuration / 3;
}
el.current.addEventListener('play', onPlay);
}
function onFullscreenchange(e) {
e.preventDefault();
if ((0,fullscreen/* IsFull */.vp)()) {
el.current.style.width = '100%';
el.current.style.height = '100%';
} else {
el.current.style.cssText = '';
}
}
function onPause() {
handlePause();
}
function skipAhead(event) {
var skipTo = event.target.dataset.seek ? event.target.dataset.seek : event.target.value;
el.current.currentTime = skipTo;
progressBarEl.current.value = skipTo;
seekEl.current.value = skipTo;
}
function updateSeekTooltip(event) {
var skipTo = Math.round(event.offsetX / event.target.clientWidth * parseInt(event.target.getAttribute('max'), 10));
seekEl.current.setAttribute('data-seek', skipTo);
var t = formatTime(skipTo);
seekTooltipEl.current.textContent = "".concat(t.hour > 0 ? t.hour + ':' : '').concat(t.minutes, ":").concat(t.seconds);
var rect = el.current.getBoundingClientRect();
seekTooltipEl.current.style.left = "".concat(event.pageX - rect.left, "px");
}
warpEl.current.addEventListener((0,fullscreen/* fullscreenChange */.gH)(), onFullscreenchange);
el.current.addEventListener('canplay', onCanPlay);
el.current.addEventListener('ended', onEnded);
el.current.addEventListener('seeking', onSeeking);
el.current.addEventListener('seeked', onSeeked);
el.current.addEventListener('loadedmetadata', initializeVideo);
seekEl.current.addEventListener('mousemove', updateSeekTooltip);
seekEl.current.addEventListener('input', skipAhead);
el.current.addEventListener('timeupdate', onTimeupdate);
el.current.addEventListener('pause', onPause);
el.current.addEventListener('volumechange', updateVolumeIcon);
return function () {
var _el$current, _el$current2, _el$current3, _el$current4, _el$current5, _seekEl$current, _seekEl$current2, _el$current6, _el$current7, _el$current8, _el$current9, _el$current10;
(_el$current = el.current) === null || _el$current === void 0 ? void 0 : _el$current.removeEventListener('canplay', onCanPlay);
(_el$current2 = el.current) === null || _el$current2 === void 0 ? void 0 : _el$current2.removeEventListener('play', onPlay);
(_el$current3 = el.current) === null || _el$current3 === void 0 ? void 0 : _el$current3.removeEventListener('ended', onEnded);
(_el$current4 = el.current) === null || _el$current4 === void 0 ? void 0 : _el$current4.removeEventListener('seeking', onSeeking);
(_el$current5 = el.current) === null || _el$current5 === void 0 ? void 0 : _el$current5.removeEventListener('seeked', onSeeked);
(_seekEl$current = seekEl.current) === null || _seekEl$current === void 0 ? void 0 : _seekEl$current.removeEventListener('mousemove', updateSeekTooltip);
(_seekEl$current2 = seekEl.current) === null || _seekEl$current2 === void 0 ? void 0 : _seekEl$current2.removeEventListener('input', skipAhead);
(_el$current6 = el.current) === null || _el$current6 === void 0 ? void 0 : _el$current6.removeEventListener('timeupdate', onTimeupdate);
(_el$current7 = el.current) === null || _el$current7 === void 0 ? void 0 : _el$current7.removeEventListener('pause', onPause);
(_el$current8 = el.current) === null || _el$current8 === void 0 ? void 0 : _el$current8.removeEventListener('loadedmetadata', initializeVideo);
(_el$current9 = el.current) === null || _el$current9 === void 0 ? void 0 : _el$current9.removeEventListener('volumechange', updateVolumeIcon);
if ((_el$current10 = el.current) !== null && _el$current10 !== void 0 && _el$current10.playing) {
pos.push(lastUpdatedTime, el.current.currentTime);
if (toLog) {
log();
}
}
};
}, [el, src]);
(0,react.useEffect)(function () {
var _src4;
el.current.onended = function () {
handlePlayEnded(el);
};
el.current.oncontextmenu = function () {
return false;
};
if (((_src4 = src) === null || _src4 === void 0 ? void 0 : _src4.indexOf('.m3u8')) > -1) {
if (el.current.canPlayType('application/vnd.apple.mpegurl')) {
el.current.src = src;
} else if (hls_default().isSupported()) {
var hls = new (hls_default())();
hls.loadSource(src);
hls.attachMedia(el.current);
}
}
}, [src]);
(0,react.useEffect)(function () {
el.current.playbackRate = videoSpeed;
}, [videoSpeed]);
var togglePlay = function togglePlay() {
if (el.current.paused || el.current.ended) {
el.current.play();
} else {
el.current.pause();
}
playIconStatus();
};
function toggleMute() {
el.current.muted = !el.current.muted;
if (el.current.muted) {
volumeEl.current.setAttribute('data-volume', volume.value);
volumeEl.current.value = 0;
} else {
volumeEl.current.value = volumeEl.current.dataset.volume;
}
}
return /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
style: {
position: 'relative'
},
ref: warpEl,
children: [/*#__PURE__*/(0,jsx_runtime.jsx)("div", {
ref: watermarkRef,
className: "".concat(Playmodules.watermark, " animated_alternate animate__animated_10s animate__infinite animate__stepstart ").concat(Playmodules.animate__loop),
children: user ? user.login : ' '
}), /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
className: Playmodules.container,
children: /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
className: Playmodules["video-container"],
id: "video-container",
children: [/*#__PURE__*/(0,jsx_runtime.jsx)("div", {
className: Playmodules["playback-animation"],
id: "playback-animation",
children: /*#__PURE__*/(0,jsx_runtime.jsxs)("svg", {
className: Playmodules["playback-icons"],
children: [/*#__PURE__*/(0,jsx_runtime.jsx)("use", {
className: "hidden",
href: "#play-icon"
}), /*#__PURE__*/(0,jsx_runtime.jsx)("use", {
href: "#pause"
})]
})
}), /*#__PURE__*/(0,jsx_runtime.jsx)("video", {
className: Playmodules.video,
id: "video",
preload: "auto",
disablePictureInPicture: true,
ref: el,
autoPlay: false
}), /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
className: "".concat(Playmodules["video-controls"], " "),
id: "video-controls",
children: [/*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
className: Playmodules["bottom-controls"],
children: [/*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
className: Playmodules["left-controls"],
children: [/*#__PURE__*/(0,jsx_runtime.jsx)("button", {
"data-title": "\u64AD\u653E/\u6682\u505C",
id: "play",
onClick: togglePlay,
children: /*#__PURE__*/(0,jsx_runtime.jsxs)("svg", {
className: Playmodules["playback-icons"],
children: [/*#__PURE__*/(0,jsx_runtime.jsx)("use", {
ref: playIcon,
href: "#play-icon"
}), /*#__PURE__*/(0,jsx_runtime.jsx)("use", {
ref: pauseIcon,
style: {
display: 'none'
},
href: "#pause"
})]
})
}), /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
className: Playmodules.time,
children: [/*#__PURE__*/(0,jsx_runtime.jsx)("time", {
id: "time-elapsed",
ref: timeElapsedEl,
children: "00:00"
}), /*#__PURE__*/(0,jsx_runtime.jsx)("span", {
children: " / "
}), /*#__PURE__*/(0,jsx_runtime.jsx)("time", {
id: "duration",
ref: durationEl,
children: "00:00"
})]
})]
}), /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
className: Playmodules["right-controls"],
children: [/*#__PURE__*/(0,jsx_runtime.jsx)(lib.CopyToClipboard, {
text: src,
onCopy: function onCopy() {
return message/* default.success */.ZP.success('复制成功');
},
children: /*#__PURE__*/(0,jsx_runtime.jsx)("button", {
"data-title": '复制链接',
children: /*#__PURE__*/(0,jsx_runtime.jsx)("i", {
className: "icon-lianjie2 iconfont",
style: {
fontSize: '12px',
color: 'white'
}
})
})
}), /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
className: Playmodules["volume-controls"],
children: [/*#__PURE__*/(0,jsx_runtime.jsxs)("button", {
"data-title": "\u5F00\u542F/\u5173\u95ED\u58F0\u97F3",
className: Playmodules["volume-button"],
id: "volume-button",
onClick: toggleMute,
children: [/*#__PURE__*/(0,jsx_runtime.jsx)("i", {
ref: noMuteVolEl,
className: "icon-a-bianzu8 iconfont",
style: {
fontSize: '14px',
color: 'white'
}
}), /*#__PURE__*/(0,jsx_runtime.jsx)("i", {
ref: lowVolEl,
className: "icon-shengyinkaibeifen iconfont",
style: {
fontSize: '14px',
color: 'white'
}
}), /*#__PURE__*/(0,jsx_runtime.jsx)("i", {
ref: highVolEl,
className: "icon-shengyinkai iconfont",
style: {
fontSize: '14px',
color: 'white'
}
})]
}), /*#__PURE__*/(0,jsx_runtime.jsx)("input", {
className: Playmodules.volume,
id: "volume",
value: "1",
"data-mute": "0.5",
type: "range",
max: "1",
min: "0",
step: "0.01",
ref: volumeEl,
style: {
display: 'none'
},
onClick: updateVolumeIcon
})]
}), /*#__PURE__*/(0,jsx_runtime.jsx)("button", {
"data-title": "\u5168\u5C4F/\u9000\u51FA\u5168\u5C4F",
className: Playmodules["fullscreen-button"],
onClick: function onClick() {
if ((0,fullscreen/* IsFull */.vp)()) {
(0,fullscreen/* exitFull */.BU)();
} else {
(0,fullscreen/* requestFullScreen */.Dj)(warpEl.current);
}
},
children: /*#__PURE__*/(0,jsx_runtime.jsx)("i", {
className: "icon-fangda1 iconfont",
style: {
fontSize: '12px',
color: 'white'
}
})
})]
})]
}), /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
className: Playmodules["video-progress"],
children: [/*#__PURE__*/(0,jsx_runtime.jsx)("progress", {
ref: progressBarEl,
value: "0",
min: "0"
}), /*#__PURE__*/(0,jsx_runtime.jsx)("input", {
className: Playmodules.seek,
ref: seekEl,
value: "0",
min: "0",
type: "range",
step: "1"
}), /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
className: Playmodules["seek-tooltip"],
ref: seekTooltipEl,
id: "seek-tooltip",
children: "00:00"
})]
})]
})]
})
}), /*#__PURE__*/(0,jsx_runtime.jsx)("svg", {
style: {
display: 'none'
},
children: /*#__PURE__*/(0,jsx_runtime.jsxs)("defs", {
children: [/*#__PURE__*/(0,jsx_runtime.jsx)("symbol", {
id: "pause",
viewBox: "0 0 24 24",
children: /*#__PURE__*/(0,jsx_runtime.jsx)("path", {
d: "M14.016 5.016h3.984v13.969h-3.984v-13.969zM6 18.984v-13.969h3.984v13.969h-3.984z"
})
}), /*#__PURE__*/(0,jsx_runtime.jsx)("symbol", {
id: "play-icon",
viewBox: "0 0 24 24",
children: /*#__PURE__*/(0,jsx_runtime.jsx)("path", {
d: "M8.016 5.016l10.969 6.984-10.969 6.984v-13.969z"
})
}), /*#__PURE__*/(0,jsx_runtime.jsx)("symbol", {
id: "volume-high",
viewBox: "0 0 24 24",
children: /*#__PURE__*/(0,jsx_runtime.jsx)("path", {
d: "M14.016 3.234q3.047 0.656 5.016 3.117t1.969 5.648-1.969 5.648-5.016 3.117v-2.063q2.203-0.656 3.586-2.484t1.383-4.219-1.383-4.219-3.586-2.484v-2.063zM16.5 12q0 2.813-2.484 4.031v-8.063q1.031 0.516 1.758 1.688t0.727 2.344zM3 9h3.984l5.016-5.016v16.031l-5.016-5.016h-3.984v-6z"
})
}), /*#__PURE__*/(0,jsx_runtime.jsx)("symbol", {
id: "volume-low",
viewBox: "0 0 24 24",
children: /*#__PURE__*/(0,jsx_runtime.jsx)("path", {
d: "M5.016 9h3.984l5.016-5.016v16.031l-5.016-5.016h-3.984v-6zM18.516 12q0 2.766-2.531 4.031v-8.063q1.031 0.516 1.781 1.711t0.75 2.32z"
})
}), /*#__PURE__*/(0,jsx_runtime.jsx)("symbol", {
id: "volume-mute",
viewBox: "0 0 24 24",
children: /*#__PURE__*/(0,jsx_runtime.jsx)("path", {
d: "M12 3.984v4.219l-2.109-2.109zM4.266 3l16.734 16.734-1.266 1.266-2.063-2.063q-1.547 1.313-3.656 1.828v-2.063q1.172-0.328 2.25-1.172l-4.266-4.266v6.75l-5.016-5.016h-3.984v-6h4.734l-4.734-4.734zM18.984 12q0-2.391-1.383-4.219t-3.586-2.484v-2.063q3.047 0.656 5.016 3.117t1.969 5.648q0 2.203-1.031 4.172l-1.5-1.547q0.516-1.266 0.516-2.625zM16.5 12q0 0.422-0.047 0.609l-2.438-2.438v-2.203q1.031 0.516 1.758 1.688t0.727 2.344z"
})
}), /*#__PURE__*/(0,jsx_runtime.jsx)("symbol", {
id: "fullscreen",
viewBox: "0 0 24 24",
children: /*#__PURE__*/(0,jsx_runtime.jsx)("path", {
d: "M14.016 5.016h4.969v4.969h-1.969v-3h-3v-1.969zM17.016 17.016v-3h1.969v4.969h-4.969v-1.969h3zM5.016 9.984v-4.969h4.969v1.969h-3v3h-1.969zM6.984 14.016v3h3v1.969h-4.969v-4.969h1.969z"
})
}), /*#__PURE__*/(0,jsx_runtime.jsx)("symbol", {
id: "fullscreen-exit",
viewBox: "0 0 24 24",
children: /*#__PURE__*/(0,jsx_runtime.jsx)("path", {
d: "M15.984 8.016h3v1.969h-4.969v-4.969h1.969v3zM14.016 18.984v-4.969h4.969v1.969h-3v3h-1.969zM8.016 8.016v-3h1.969v4.969h-4.969v-1.969h3zM5.016 15.984v-1.969h4.969v4.969h-1.969v-3h-3z"
})
}), /*#__PURE__*/(0,jsx_runtime.jsx)("symbol", {
id: "pip",
viewBox: "0 0 24 24",
children: /*#__PURE__*/(0,jsx_runtime.jsx)("path", {
d: "M21 19.031v-14.063h-18v14.063h18zM23.016 18.984q0 0.797-0.609 1.406t-1.406 0.609h-18q-0.797 0-1.406-0.609t-0.609-1.406v-14.016q0-0.797 0.609-1.383t1.406-0.586h18q0.797 0 1.406 0.586t0.609 1.383v14.016zM18.984 11.016v6h-7.969v-6h7.969z"
})
})]
})
})]
});
}));
/***/ }),
/***/ 15994:
/*!*********************************!*\
!*** ./src/utils/fullscreen.ts ***!
\*********************************/
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "BU": function() { return /* binding */ exitFull; },
/* harmony export */ "Dj": function() { return /* binding */ requestFullScreen; },
/* harmony export */ "gH": function() { return /* binding */ fullscreenChange; },
/* harmony export */ "vp": function() { return /* binding */ IsFull; }
/* harmony export */ });
function requestFullScreen(element) {
try {
if (element.mozRequestFullScreen) {
element.mozRequestFullScreen();
} else if (element.webkitRequestFullScreen) {
element.webkitRequestFullScreen();
}
} catch (e) {
console.log(e, ":e");
}
}
function exitFull() {
if (window.top.document.webkitExitFullscreen) {
window.top.document.webkitExitFullscreen();
} else if (document.exitFullscreen) {
window.top.document.exitFullscreen();
} else if (document.msExitFullscreen) {
window.top.document.msExitFullscreen();
} else if (document.mozCancelFullScreen) {
window.top.document.mozCancelFullScreen();
}
}
// esliint disabled
var fullscreenChange = function fullscreenChange() {
//['fullscreenchange','msfullscreenchange','webkitfullscreenchange', 'mozfullscreenchange']
if (document.webkitExitFullscreen) {
// document.webkitExitFullscreen()
return 'webkitfullscreenchange';
} else if (document.exitFullscreen) {
// document.exitFullscreen()
return 'fullscreenchange';
} else if (document.msExitFullscreen) {
// document.msExitFullscreen()
return 'msfullscreenchange';
} else if (document.mozCancelFullScreen) {
// document.mozCancelFullScreen()
return 'mozfullscreenchange';
}
};
//判断是否全屏
function IsFull() {
var fullscreenElement = window.top.document.fullscreenElement || window.top.document.mozFullscreenElement || window.top.document.webkitFullscreenElement;
var fullscreenEnabled = document.fullscreenEnabled || document.mozFullscreenEnabled || document.webkitFullscreenEnabled;
if (fullscreenElement == null) {
return false;
} else {
return true;
}
}
// document.addEventListener("mozfullscreenchange", function (event) {
// console.log("mozfullscreenchange ", event);
// if (IsFull()) {
// console.log('进入全屏')
// $("#closescreen").show();
// $("#openscreen").hide();
// } else {
// console.log('退出全屏')
// $("#closescreen").hide();
// $("#openscreen").show();
// }
// });
// document.addEventListener("webkitfullscreenchange", function (event) {
// console.log("webkitfullscreenchange", event);
// if (IsFull()) {
// console.log('进入全屏')
// $("#closescreen").show();
// $("#openscreen").hide();
// } else {
// console.log('退出全屏')
// $("#closescreen").hide();
// $("#openscreen").show();
// }
// });
// document.addEventListener("msfullscreenchange", function (event) {
// console.log("msfullscreenchange", event);
// if (IsFull()) {
// console.log('进入全屏')
// $("#closescreen").show();
// $("#openscreen").hide();
// } else {
// console.log('退出全屏')
// $("#closescreen").hide();
// $("#openscreen").show();
// }
// });
/***/ })
}]);
Reference in new issue View Git Blame Copy Permalink