mirror of
https://github.com/zhw2590582/ArtPlayer.git
synced 2026-10-08 19:06:15 -08:00
remove indicatorGestureInit
This commit is contained in:
Harvey committed
1 parent
26fedfa3d1
commit
a891ccd7d1
7 files changed
+188
-283
No files matched your search
+1
-1
@@ -47,7 +47,7 @@
|
||||
|
||||
var art = new Artplayer({
|
||||
container: '.artplayer-app',
|
||||
url: '/assets/sample/video.mp4',
|
||||
url: 'https://artplayer.org/assets/sample/video.mp4',
|
||||
title: 'One More Time One More Chance',
|
||||
poster: '/assets/sample/poster.jpg',
|
||||
autoSize: true,
|
||||
|
||||
+111
-150
@@ -118,7 +118,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
var css_248z = ".art-video-player{zoom:1;-webkit-tap-highlight-color:rgba(0,0,0,0);-ms-high-contrast-adjust:none;background-color:#000;color:#eee;direction:ltr;display:flex;font-family:Roboto,Arial,Helvetica,sans-serif;font-size:14px;height:100%;line-height:1.3;margin:0 auto;outline:0;position:relative;text-align:left;touch-action:manipulation;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:100%;z-index:20}.art-video-player *{box-sizing:border-box;margin:0;padding:0}.art-video-player ::-webkit-scrollbar{height:5px;width:5px}.art-video-player ::-webkit-scrollbar-thumb{background-color:#666}.art-video-player ::-webkit-scrollbar-thumb:hover{background-color:#ccc}.art-video-player .art-icon{align-items:center;display:inline-flex;justify-content:center;line-height:1.5}.art-video-player .art-icon svg{fill:#fff}.art-video-player img{max-width:100%;vertical-align:top}@supports ((-webkit-backdrop-filter:initial) or (backdrop-filter:initial)){.art-video-player .art-backdrop-filter{-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);background-color:rgba(0,0,0,.7)!important}}.art-video-player .art-video{background-color:#000;cursor:pointer;z-index:10}.art-video-player .art-poster,.art-video-player .art-video{bottom:0;height:100%;left:0;position:absolute;right:0;top:0;width:100%}.art-video-player .art-poster{background-position:50%;background-repeat:no-repeat;background-size:cover;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:11}.art-video-player .art-subtitle{bottom:10px;color:#fff;display:none;font-size:20px;padding:0 20px;pointer-events:none;position:absolute;text-align:center;text-shadow:.5px .5px .5px rgba(0,0,0,.5);width:100%;z-index:20}.art-video-player .art-subtitle p{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;line-height:1.2;margin:5px 0 0;word-break:break-all}.art-video-player.art-subtitle-show .art-subtitle{display:block}.art-video-player.art-control-show .art-subtitle{bottom:50px}.art-video-player.art-mobile.art-control-show .art-subtitle{bottom:55px}.art-video-player .art-danmuku{z-index:30}.art-video-player .art-danmuku,.art-video-player .art-layers{bottom:0;height:100%;left:0;overflow:hidden;pointer-events:none;position:absolute;right:0;top:0;width:100%}.art-video-player .art-layers{display:none;z-index:40}.art-video-player .art-layers .art-layer{pointer-events:auto}.art-video-player.art-layer-show .art-layers{display:block}.art-video-player .art-mask{align-items:center;bottom:0;display:none;height:100%;justify-content:center;left:0;overflow:hidden;pointer-events:none;position:absolute;right:0;top:0;width:100%;z-index:50}.art-video-player .art-mask .art-state{align-items:center;bottom:65px;cursor:pointer;display:flex;height:60px;justify-content:center;opacity:.85;pointer-events:all;position:absolute;right:30px;width:60px}.art-video-player.art-mask-show .art-mask{display:flex}.art-video-player.art-mobile .art-state{position:static}.art-video-player .art-loading{align-items:center;bottom:0;display:none;height:100%;justify-content:center;left:0;pointer-events:none;position:absolute;right:0;top:0;width:100%;z-index:70}.art-video-player.art-loading-show .art-loading{display:flex}.art-video-player .art-bottom{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAADGCAYAAAAT+OqFAAAAdklEQVQoz42QQQ7AIAgEF/T/D+kbq/RWAlnQyyazA4aoAB4FsBSA/bFjuF1EOL7VbrIrBuusmrt4ZZORfb6ehbWdnRHEIiITaEUKa5EJqUakRSaEYBJSCY2dEstQY7AuxahwXFrvZmWl2rh4JZ07z9dLtesfNj5q0FU3A5ObbwAAAABJRU5ErkJggg==) repeat-x bottom;bottom:0;display:flex;flex-direction:column;height:100px;justify-content:space-between;left:0;opacity:0;padding:50px 10px 0;pointer-events:none;position:absolute;right:0;transition:all .2s ease-in-out;visibility:hidden;z-index:60}.art-video-player .art-bottom .art-progress{pointer-events:auto;position:relative;z-index:0}.art-video-player .art-bottom .art-progress .art-control-progress{align-items:center;cursor:pointer;display:flex;flex-direction:row;height:4px;position:relative}.art-video-player .art-bottom .art-progress .art-control-progress .art-control-progress-inner{align-items:center;background:hsla(0,0%,100%,.2);display:flex;height:50%;position:relative;width:100%}.art-video-player .art-bottom .art-progress .art-control-progress .art-control-progress-inner .art-progress-loaded{background:hsla(0,0%,100%,.4);bottom:0;height:100%;left:0;position:absolute;right:0;top:0;width:0;z-index:10}.art-video-player .art-bottom .art-progress .art-control-progress .art-control-progress-inner .art-progress-played{bottom:0;height:100%;left:0;position:absolute;right:0;top:0;width:0;z-index:20}.art-video-player .art-bottom .art-progress .art-control-progress .art-control-progress-inner .art-progress-highlight{bottom:0;height:100%;left:0;pointer-events:none;position:absolute;right:0;top:0;z-index:30}.art-video-player .art-bottom .art-progress .art-control-prLine truncated
|
||||
var css_248z = ".art-video-player{zoom:1;-webkit-tap-highlight-color:rgba(0,0,0,0);-ms-high-contrast-adjust:none;background-color:#000;color:#eee;direction:ltr;display:flex;font-family:Roboto,Arial,Helvetica,sans-serif;font-size:14px;height:100%;line-height:1.3;margin:0 auto;outline:0;position:relative;text-align:left;touch-action:manipulation;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:100%;z-index:20}.art-video-player *{box-sizing:border-box;margin:0;padding:0}.art-video-player ::-webkit-scrollbar{height:5px;width:5px}.art-video-player ::-webkit-scrollbar-thumb{background-color:#666}.art-video-player ::-webkit-scrollbar-thumb:hover{background-color:#ccc}.art-video-player .art-icon{align-items:center;display:inline-flex;justify-content:center;line-height:1.5}.art-video-player .art-icon svg{fill:#fff}.art-video-player img{max-width:100%;vertical-align:top}@supports ((-webkit-backdrop-filter:initial) or (backdrop-filter:initial)){.art-video-player .art-backdrop-filter{-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);background-color:rgba(0,0,0,.7)!important}}.art-video-player .art-video{background-color:#000;cursor:pointer;z-index:10}.art-video-player .art-poster,.art-video-player .art-video{bottom:0;height:100%;left:0;position:absolute;right:0;top:0;width:100%}.art-video-player .art-poster{background-position:50%;background-repeat:no-repeat;background-size:cover;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:11}.art-video-player .art-subtitle{bottom:10px;color:#fff;display:none;font-size:20px;padding:0 20px;pointer-events:none;position:absolute;text-align:center;text-shadow:.5px .5px .5px rgba(0,0,0,.5);width:100%;z-index:20}.art-video-player .art-subtitle p{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;line-height:1.2;margin:5px 0 0;word-break:break-all}.art-video-player.art-subtitle-show .art-subtitle{display:block}.art-video-player.art-control-show .art-subtitle{bottom:50px}.art-video-player .art-danmuku{z-index:30}.art-video-player .art-danmuku,.art-video-player .art-layers{bottom:0;height:100%;left:0;overflow:hidden;pointer-events:none;position:absolute;right:0;top:0;width:100%}.art-video-player .art-layers{display:none;z-index:40}.art-video-player .art-layers .art-layer{pointer-events:auto}.art-video-player.art-layer-show .art-layers{display:block}.art-video-player .art-mask{align-items:center;bottom:0;display:none;height:100%;justify-content:center;left:0;overflow:hidden;pointer-events:none;position:absolute;right:0;top:0;width:100%;z-index:50}.art-video-player .art-mask .art-state{align-items:center;bottom:65px;cursor:pointer;display:flex;height:60px;justify-content:center;opacity:.85;pointer-events:all;position:absolute;right:30px;width:60px}.art-video-player.art-mask-show .art-mask{display:flex}.art-video-player.art-mobile .art-state{position:static}.art-video-player .art-loading{align-items:center;bottom:0;display:none;height:100%;justify-content:center;left:0;pointer-events:none;position:absolute;right:0;top:0;width:100%;z-index:70}.art-video-player.art-loading-show .art-loading{display:flex}.art-video-player .art-bottom{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAADGCAYAAAAT+OqFAAAAdklEQVQoz42QQQ7AIAgEF/T/D+kbq/RWAlnQyyazA4aoAB4FsBSA/bFjuF1EOL7VbrIrBuusmrt4ZZORfb6ehbWdnRHEIiITaEUKa5EJqUakRSaEYBJSCY2dEstQY7AuxahwXFrvZmWl2rh4JZ07z9dLtesfNj5q0FU3A5ObbwAAAABJRU5ErkJggg==) repeat-x bottom;bottom:0;display:flex;flex-direction:column;height:100px;justify-content:space-between;left:0;opacity:0;padding:50px 10px 0;pointer-events:none;position:absolute;right:0;transition:all .2s ease-in-out;visibility:hidden;z-index:60}.art-video-player .art-bottom .art-progress{flex:1;pointer-events:auto;position:relative;z-index:0}.art-video-player .art-bottom .art-progress .art-control-progress{align-items:center;cursor:pointer;display:flex;flex-direction:row;height:4px;position:relative}.art-video-player .art-bottom .art-progress .art-control-progress .art-control-progress-inner{align-items:center;background:hsla(0,0%,100%,.2);display:flex;height:50%;position:relative;width:100%}.art-video-player .art-bottom .art-progress .art-control-progress .art-control-progress-inner .art-progress-loaded{background:hsla(0,0%,100%,.4);bottom:0;height:100%;left:0;position:absolute;right:0;top:0;width:0;z-index:10}.art-video-player .art-bottom .art-progress .art-control-progress .art-control-progress-inner .art-progress-played{bottom:0;height:100%;left:0;position:absolute;right:0;top:0;width:0;z-index:20}.art-video-player .art-bottom .art-progress .art-control-progress .art-control-progress-inner .art-progress-highlight{bottom:0;height:100%;left:0;pointer-events:none;position:absolute;right:0;top:0;z-index:30}.art-video-player .art-bottom .art-progress .art-control-progress .art-control-progress-inner .art-progress-highlight span{bLine truncated
|
||||
styleInject(css_248z);
|
||||
|
||||
var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
|
||||
@@ -930,7 +930,7 @@
|
||||
}], [{
|
||||
key: "html",
|
||||
get: function get() {
|
||||
return "\n <div class=\"art-video-player art-subtitle-show art-layer-show\">\n <video class=\"art-video\"></video>\n <div class=\"art-poster\"></div>\n <div class=\"art-subtitle\"></div>\n <div class=\"art-danmuku\"></div>\n <div class=\"art-layers\"></div>\n <div class=\"art-mask\">\n <div class=\"art-state\"></div>\n </div>\n <div class=\"art-bottom\">\n <div class=\"art-progress\"></div>\n <div class=\"art-controls\">\n <div class=\"art-controls-left\"></div>\n <div class=\"art-controls-right\"></div>\n </div>\n </div>\n <div class=\"art-loading\"></div>\n <div class=\"art-notice\">\n <div class=\"art-notice-inner\"></div>\n </div>\n <div class=\"art-settings\"></div>\n <div class=\"art-info\">\n <div class=\"art-info-panel\">\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Player version:</div>\n <div class=\"art-info-content\">4.3.8</div>\n </div>\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video url:</div>\n <div class=\"art-info-content\" data-video=\"src\"></div>\n </div>\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video volume:</div>\n <div class=\"art-info-content\" data-video=\"volume\"></div>\n </div>\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video time:</div>\n <div class=\"art-info-content\" data-video=\"currentTime\"></div>\n </div>\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video duration:</div>\n <div class=\"art-info-content\" data-video=\"duration\"></div>\n </div>\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video resolution:</div>\n <div class=\"art-info-content\">\n <span data-video=\"videoWidth\"></span> x <span data-video=\"videoHeight\"></span>\n </div>\n </div>\n </div>\n <div class=\"art-info-close\">[x]</div>\n </div>\n <div class=\"art-mini-header\">\n <div class=\"art-mini-title\"></div>\n <div class=\"art-mini-close\">\xD7</div>\n </div>\n <div class=\"art-contextmenus\"></div>\n </div>\n ";
|
||||
return "\n <div class=\"art-video-player art-subtitle-show art-layer-show\">\n <video class=\"art-video\"></video>\n <div class=\"art-poster\"></div>\n <div class=\"art-subtitle\"></div>\n <div class=\"art-danmuku\"></div>\n <div class=\"art-layers\"></div>\n <div class=\"art-mask\">\n <div class=\"art-state\"></div>\n </div>\n <div class=\"art-bottom\">\n <div class=\"art-progress\"></div>\n <div class=\"art-controls\">\n <div class=\"art-controls-left\"></div>\n <div class=\"art-controls-right\"></div>\n </div>\n </div>\n <div class=\"art-loading\"></div>\n <div class=\"art-notice\">\n <div class=\"art-notice-inner\"></div>\n </div>\n <div class=\"art-settings\"></div>\n <div class=\"art-info\">\n <div class=\"art-info-panel\">\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Player version:</div>\n <div class=\"art-info-content\">4.3.9</div>\n </div>\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video url:</div>\n <div class=\"art-info-content\" data-video=\"src\"></div>\n </div>\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video volume:</div>\n <div class=\"art-info-content\" data-video=\"volume\"></div>\n </div>\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video time:</div>\n <div class=\"art-info-content\" data-video=\"currentTime\"></div>\n </div>\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video duration:</div>\n <div class=\"art-info-content\" data-video=\"duration\"></div>\n </div>\n <div class=\"art-info-item\">\n <div class=\"art-info-title\">Video resolution:</div>\n <div class=\"art-info-content\">\n <span data-video=\"videoWidth\"></span> x <span data-video=\"videoHeight\"></span>\n </div>\n </div>\n </div>\n <div class=\"art-info-close\">[x]</div>\n </div>\n <div class=\"art-mini-header\">\n <div class=\"art-mini-title\"></div>\n <div class=\"art-mini-close\">\xD7</div>\n </div>\n <div class=\"art-contextmenus\"></div>\n </div>\n ";
|
||||
}
|
||||
}]);
|
||||
|
||||
@@ -2714,112 +2714,6 @@
|
||||
};
|
||||
}
|
||||
|
||||
function indicatorGestureInit(art, $indicator, setBar) {
|
||||
if (isMobile && !art.option.isLive) {
|
||||
var plugins = art.plugins,
|
||||
$progress = art.template.$progress,
|
||||
proxy = art.events.proxy;
|
||||
var isDroging = false;
|
||||
proxy($indicator, 'touchstart', function (event) {
|
||||
if (event.touches.length === 1) {
|
||||
isDroging = true;
|
||||
}
|
||||
});
|
||||
proxy(document, 'touchmove', function (event) {
|
||||
if (event.touches.length === 1 && isDroging) {
|
||||
var autoOrientation = plugins.autoOrientation && plugins.autoOrientation.state;
|
||||
|
||||
var _$progress$getBoundin = $progress.getBoundingClientRect(),
|
||||
left = _$progress$getBoundin.left,
|
||||
top = _$progress$getBoundin.top;
|
||||
|
||||
var _event$touches$ = event.touches[0],
|
||||
clientX = _event$touches$.clientX,
|
||||
clientY = _event$touches$.clientY;
|
||||
var width = clamp(clientX - left, 0, $progress.clientWidth);
|
||||
var height = clamp(clientY - top, 0, $progress.clientWidth);
|
||||
var size = autoOrientation ? height : width;
|
||||
var secondX = width / $progress.clientWidth * art.duration;
|
||||
var secondY = height / $progress.clientWidth * art.duration;
|
||||
var second = autoOrientation ? secondY : secondX;
|
||||
var percentage = clamp(size / $progress.clientWidth, 0, 1);
|
||||
setBar('played', percentage);
|
||||
art.seek = second;
|
||||
}
|
||||
});
|
||||
proxy(document, 'touchend', function () {
|
||||
if (isDroging) {
|
||||
isDroging = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
function gestureInit(art, events) {
|
||||
if (isMobile && !art.option.isLive) {
|
||||
var notice = art.notice,
|
||||
plugins = art.plugins,
|
||||
_constructor = art.constructor,
|
||||
$video = art.template.$video;
|
||||
var isDroging = false;
|
||||
var startX = 0;
|
||||
var startY = 0;
|
||||
var currentTime = 0;
|
||||
var pressTimer = null;
|
||||
events.proxy($video, 'touchstart', function (event) {
|
||||
if (event.touches.length === 1) {
|
||||
isDroging = true;
|
||||
var _event$touches$2 = event.touches[0],
|
||||
clientX = _event$touches$2.clientX,
|
||||
clientY = _event$touches$2.clientY;
|
||||
startX = clientX;
|
||||
startY = clientY;
|
||||
clearTimeout(pressTimer);
|
||||
pressTimer = setTimeout(function () {
|
||||
art.playbackRate = _constructor.MOBILE_AUTO_PLAYBACKRATE;
|
||||
}, _constructor.MOBILE_AUTO_PLAYBACKRATE_TIME);
|
||||
}
|
||||
});
|
||||
events.proxy($video, 'touchmove', function (event) {
|
||||
if (event.touches.length === 1 && isDroging) {
|
||||
var autoOrientation = plugins.autoOrientation && plugins.autoOrientation.state;
|
||||
var _event$touches$3 = event.touches[0],
|
||||
clientX = _event$touches$3.clientX,
|
||||
clientY = _event$touches$3.clientY;
|
||||
var ratioX = clamp((clientX - startX) / art.width, -1, 1);
|
||||
var ratioY = clamp((clientY - startY) / art.height, -1, 1);
|
||||
|
||||
if (art.duration) {
|
||||
if (autoOrientation) {
|
||||
currentTime = clamp(art.currentTime + art.duration * ratioY, 0, art.duration);
|
||||
} else {
|
||||
currentTime = clamp(art.currentTime + art.duration * ratioX, 0, art.duration);
|
||||
}
|
||||
|
||||
notice.show = "".concat(secondToTime(currentTime), " / ").concat(secondToTime(art.duration));
|
||||
}
|
||||
}
|
||||
});
|
||||
events.proxy(document, 'touchend', function () {
|
||||
if (isDroging) {
|
||||
if (currentTime) {
|
||||
art.seek = currentTime;
|
||||
}
|
||||
|
||||
if (art.playbackRate === 3) {
|
||||
art.playbackRate = 1;
|
||||
}
|
||||
|
||||
startX = 0;
|
||||
startY = 0;
|
||||
currentTime = 0;
|
||||
isDroging = false;
|
||||
clearTimeout(pressTimer);
|
||||
pressTimer = null;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function ownKeys$g(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
||||
|
||||
function _objectSpread$g(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$g(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$g(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
||||
@@ -2933,6 +2827,9 @@
|
||||
}
|
||||
|
||||
setBar('loaded', art.loaded);
|
||||
art.on('setBar', function (type, percentage) {
|
||||
setBar(type, percentage);
|
||||
});
|
||||
art.on('video:progress', function () {
|
||||
setBar('loaded', art.loaded);
|
||||
});
|
||||
@@ -2942,47 +2839,49 @@
|
||||
art.on('video:ended', function () {
|
||||
setBar('played', 1);
|
||||
});
|
||||
proxy($control, 'mousemove', function (event) {
|
||||
setStyle($tip, 'display', 'block');
|
||||
|
||||
if (includeFromEvent(event, $highlight)) {
|
||||
showHighlight(event);
|
||||
} else {
|
||||
showTime(event);
|
||||
}
|
||||
});
|
||||
proxy($control, 'mouseout', function () {
|
||||
setStyle($tip, 'display', 'none');
|
||||
});
|
||||
proxy($control, 'click', function (event) {
|
||||
if (event.target !== $indicator) {
|
||||
var _getPosFromEvent3 = getPosFromEvent(art, event),
|
||||
second = _getPosFromEvent3.second,
|
||||
percentage = _getPosFromEvent3.percentage;
|
||||
if (!isMobile) {
|
||||
proxy($control, 'click', function (event) {
|
||||
if (event.target !== $indicator) {
|
||||
var _getPosFromEvent3 = getPosFromEvent(art, event),
|
||||
second = _getPosFromEvent3.second,
|
||||
percentage = _getPosFromEvent3.percentage;
|
||||
|
||||
setBar('played', percentage);
|
||||
art.seek = second;
|
||||
}
|
||||
});
|
||||
proxy($indicator, 'mousedown', function () {
|
||||
isDroging = true;
|
||||
});
|
||||
proxy(document, 'mousemove', function (event) {
|
||||
if (isDroging) {
|
||||
var _getPosFromEvent4 = getPosFromEvent(art, event),
|
||||
second = _getPosFromEvent4.second,
|
||||
percentage = _getPosFromEvent4.percentage;
|
||||
setBar('played', percentage);
|
||||
art.seek = second;
|
||||
}
|
||||
});
|
||||
proxy($control, 'mousemove', function (event) {
|
||||
setStyle($tip, 'display', 'block');
|
||||
|
||||
setBar('played', percentage);
|
||||
art.seek = second;
|
||||
}
|
||||
});
|
||||
proxy(document, 'mouseup', function () {
|
||||
if (isDroging) {
|
||||
isDroging = false;
|
||||
}
|
||||
});
|
||||
indicatorGestureInit(art, $indicator, setBar);
|
||||
if (includeFromEvent(event, $highlight)) {
|
||||
showHighlight(event);
|
||||
} else {
|
||||
showTime(event);
|
||||
}
|
||||
});
|
||||
proxy($control, 'mouseout', function () {
|
||||
setStyle($tip, 'display', 'none');
|
||||
});
|
||||
proxy($indicator, 'mousedown', function () {
|
||||
isDroging = true;
|
||||
});
|
||||
proxy(document, 'mousemove', function (event) {
|
||||
if (isDroging) {
|
||||
var _getPosFromEvent4 = getPosFromEvent(art, event),
|
||||
second = _getPosFromEvent4.second,
|
||||
percentage = _getPosFromEvent4.percentage;
|
||||
|
||||
setBar('played', percentage);
|
||||
art.seek = second;
|
||||
}
|
||||
});
|
||||
proxy(document, 'mouseup', function () {
|
||||
if (isDroging) {
|
||||
isDroging = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
@@ -3554,7 +3453,7 @@
|
||||
|
||||
function version(option) {
|
||||
return _objectSpread$3(_objectSpread$3({}, option), {}, {
|
||||
html: '<a href="https://artplayer.org" target="_blank">ArtPlayer 4.3.8</a>'
|
||||
html: '<a href="https://artplayer.org" target="_blank">ArtPlayer 4.3.9</a>'
|
||||
});
|
||||
}
|
||||
|
||||
@@ -3995,6 +3894,68 @@
|
||||
}
|
||||
}
|
||||
|
||||
function gestureInit(art, events) {
|
||||
if (isMobile && !art.option.isLive) {
|
||||
var notice = art.notice,
|
||||
plugins = art.plugins,
|
||||
_art$template = art.template,
|
||||
$video = _art$template.$video,
|
||||
$bottom = _art$template.$bottom,
|
||||
$controls = _art$template.$controls;
|
||||
var isDroging = false;
|
||||
var startX = 0;
|
||||
var startY = 0;
|
||||
var startTime = 0;
|
||||
|
||||
var onTouchStart = function onTouchStart(event) {
|
||||
if (event.touches.length === 1) {
|
||||
isDroging = true;
|
||||
var _event$touches$ = event.touches[0],
|
||||
clientX = _event$touches$.clientX,
|
||||
clientY = _event$touches$.clientY;
|
||||
startX = clientX;
|
||||
startY = clientY;
|
||||
startTime = art.currentTime;
|
||||
}
|
||||
};
|
||||
|
||||
var onTouchMove = function onTouchMove(event) {
|
||||
if (event.touches.length === 1 && isDroging && art.duration) {
|
||||
var autoOrientation = plugins.autoOrientation && plugins.autoOrientation.state;
|
||||
var _event$touches$2 = event.touches[0],
|
||||
clientX = _event$touches$2.clientX,
|
||||
clientY = _event$touches$2.clientY;
|
||||
var ratioX = clamp((clientX - startX) / art.width, -1, 1);
|
||||
var ratioY = clamp((clientY - startY) / art.height, -1, 1);
|
||||
var ratio = autoOrientation ? ratioY : ratioX;
|
||||
var currentTime = clamp(startTime + art.duration * ratio, 0, art.duration);
|
||||
art.seek = currentTime;
|
||||
art.emit('setBar', 'played', clamp(currentTime / art.duration, 0, 1));
|
||||
notice.show = "".concat(secondToTime(currentTime), " / ").concat(secondToTime(art.duration));
|
||||
}
|
||||
};
|
||||
|
||||
var onTouchEnd = function onTouchEnd() {
|
||||
if (isDroging) {
|
||||
startX = 0;
|
||||
startY = 0;
|
||||
startTime = 0;
|
||||
isDroging = false;
|
||||
}
|
||||
};
|
||||
|
||||
events.proxy($bottom, 'touchstart', function (event) {
|
||||
if (!includeFromEvent(event, $controls)) {
|
||||
onTouchStart(event);
|
||||
}
|
||||
});
|
||||
events.proxy($bottom, 'touchmove', onTouchMove);
|
||||
events.proxy($video, 'touchstart', onTouchStart);
|
||||
events.proxy($video, 'touchmove', onTouchMove);
|
||||
events.proxy(document, 'touchend', onTouchEnd);
|
||||
}
|
||||
}
|
||||
|
||||
function viewInit(art, events) {
|
||||
var option = art.option,
|
||||
constructor = art.constructor,
|
||||
@@ -5280,7 +5241,7 @@
|
||||
}, {
|
||||
key: "version",
|
||||
get: function get() {
|
||||
return '4.3.8';
|
||||
return '4.3.9';
|
||||
}
|
||||
}, {
|
||||
key: "env",
|
||||
@@ -5290,7 +5251,7 @@
|
||||
}, {
|
||||
key: "build",
|
||||
get: function get() {
|
||||
return '1650965408634';
|
||||
return '1651031317428';
|
||||
}
|
||||
}, {
|
||||
key: "config",
|
||||
@@ -5417,7 +5378,7 @@
|
||||
Artplayer.MOBILE_AUTO_ORIENTATION_TIME = 100;
|
||||
Artplayer.INFO_LOOP_TIME = 1000; // eslint-disable-next-line no-console
|
||||
|
||||
console.log('%c ArtPlayer %c 4.3.8 %c https://artplayer.org', 'color: #fff; background: #5f5f5f', 'color: #fff; background: #4bc729', '');
|
||||
console.log('%c ArtPlayer %c 4.3.9 %c https://artplayer.org', 'color: #fff; background: #5f5f5f', 'color: #fff; background: #4bc729', '');
|
||||
|
||||
return Artplayer;
|
||||
|
||||
|
||||
@@ -1 +1 @@
|
||||
{"version":3,"file":"artplayer.js","sources":["../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/classCallCheck.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/createClass.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/assertThisInitialized.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/setPrototypeOf.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/inherits.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/typeof.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/possibleConstructorReturn.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/getPrototypeOf.js","../../node_modules/_style-inject@0.3.0@style-inject/dist/style-inject.es.js","../../packages/artplayer/node_modules/_option-validator@2.0.6@option-validator/dist/option-validator.js","../../packages/artplayer/src/utils/emitter.js","../../packages/artplayer/src/utils/compatibility.js","../../packages/artplayer/src/utils/dom.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/isNativeFunction.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/isNativeReflectConstruct.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/construct.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/wrapNativeSuper.js","../../packages/artplayer/src/utils/error.js","../../packages/artplayer/src/utils/subtitle.js","../../packages/artplayer/src/utils/file.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/arrayLikeToArray.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/arrayWithoutHoles.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/iterableToArray.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/unsupportedIterableToArray.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/nonIterableSpread.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/toConsumableArray.js","../../packages/artplayer/src/utils/property.js","../../packages/artplayer/src/utils/time.js","../../packages/artplayer/src/utils/format.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/defineProperty.js","../../packages/artplayer/src/scheme/index.js","../../packages/artplayer/src/config/index.js","../../packages/artplayer/src/whitelist.js","../../packages/artplayer/src/template.js","../../packages/artplayer/src/i18n/index.js","../../packages/artplayer/src/player/urlMix.js","../../packages/artplayer/src/player/attrMix.js","../../packages/artplayer/src/player/playMix.js","../../packages/artplayer/src/player/pauseMix.js","../../packages/artplayer/src/player/toggleMix.js","../../packages/artplayer/src/player/seekMix.js","../../packages/artplayer/src/player/volumeMix.js","../../packages/artplayer/src/player/currentTimeMix.js","../../packages/artplayer/src/player/durationMix.js","../../packages/artplayer/src/player/switchMix.js","../../packages/artplayer/src/player/playbackRateMix.js","../../packages/artplayer/src/player/aspectRatioMix.js","../../packages/artplayer/src/player/screenshotMix.js","../../packages/artplayer/node_modules/screenfull/dist/screenfull.js","../../packages/artplayer/src/player/fullscreenMix.js","../../packages/artplayer/src/player/fullscreenWebMix.js","../../packages/artplayer/src/player/pipMix.js","../../packages/artplayer/src/player/loadedMix.js","../../packages/artplayer/src/player/playedMix.js","../../packages/artplayer/src/player/playingMix.js","../../packages/artplayer/src/player/autoSizeMix.js","../../packages/artplayer/src/player/rectMix.js","../../packages/artplayer/src/player/flipMix.js","../../packages/artplayer/src/player/miniMix.js","../../packages/artplayer/src/player/loopMix.js","../../packages/artplayer/src/player/posterMix.js","../../packages/artplayer/src/player/autoHeightMix.js","../../packages/artplayer/src/player/themeMix.js","../../packages/artplayer/src/player/titleMix.js","../../packages/artplayer/src/player/exclusiveMix.js","../../packages/artplayer/src/player/subtitleOffsetMix.js","../../packages/artplayer/src/player/optionInit.js","../../packages/artplayer/src/player/eventInit.js","../../packages/artplayer/src/player/index.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/superPropBase.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/get.js","../../packages/artplayer/src/utils/component.js","../../packages/artplayer/src/control/fullscreen.js","../../packages/artplayer/src/control/fullscreenWeb.js","../../packages/artplayer/src/control/pip.js","../../packages/artplayer/src/control/playAndPause.js","../../packages/artplayer/src/events/gestureInit.js","../../packages/artplayer/src/control/progress.js","../../packages/artplayer/src/control/subtitle.js","../../packages/artplayer/src/conLine truncated
|
||||
{"version":3,"file":"artplayer.js","sources":["../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/classCallCheck.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/createClass.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/assertThisInitialized.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/setPrototypeOf.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/inherits.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/typeof.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/possibleConstructorReturn.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/getPrototypeOf.js","../../node_modules/_style-inject@0.3.0@style-inject/dist/style-inject.es.js","../../packages/artplayer/node_modules/_option-validator@2.0.6@option-validator/dist/option-validator.js","../../packages/artplayer/src/utils/emitter.js","../../packages/artplayer/src/utils/compatibility.js","../../packages/artplayer/src/utils/dom.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/isNativeFunction.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/isNativeReflectConstruct.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/construct.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/wrapNativeSuper.js","../../packages/artplayer/src/utils/error.js","../../packages/artplayer/src/utils/subtitle.js","../../packages/artplayer/src/utils/file.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/arrayLikeToArray.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/arrayWithoutHoles.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/iterableToArray.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/unsupportedIterableToArray.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/nonIterableSpread.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/toConsumableArray.js","../../packages/artplayer/src/utils/property.js","../../packages/artplayer/src/utils/time.js","../../packages/artplayer/src/utils/format.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/defineProperty.js","../../packages/artplayer/src/scheme/index.js","../../packages/artplayer/src/config/index.js","../../packages/artplayer/src/whitelist.js","../../packages/artplayer/src/template.js","../../packages/artplayer/src/i18n/index.js","../../packages/artplayer/src/player/urlMix.js","../../packages/artplayer/src/player/attrMix.js","../../packages/artplayer/src/player/playMix.js","../../packages/artplayer/src/player/pauseMix.js","../../packages/artplayer/src/player/toggleMix.js","../../packages/artplayer/src/player/seekMix.js","../../packages/artplayer/src/player/volumeMix.js","../../packages/artplayer/src/player/currentTimeMix.js","../../packages/artplayer/src/player/durationMix.js","../../packages/artplayer/src/player/switchMix.js","../../packages/artplayer/src/player/playbackRateMix.js","../../packages/artplayer/src/player/aspectRatioMix.js","../../packages/artplayer/src/player/screenshotMix.js","../../packages/artplayer/node_modules/screenfull/dist/screenfull.js","../../packages/artplayer/src/player/fullscreenMix.js","../../packages/artplayer/src/player/fullscreenWebMix.js","../../packages/artplayer/src/player/pipMix.js","../../packages/artplayer/src/player/loadedMix.js","../../packages/artplayer/src/player/playedMix.js","../../packages/artplayer/src/player/playingMix.js","../../packages/artplayer/src/player/autoSizeMix.js","../../packages/artplayer/src/player/rectMix.js","../../packages/artplayer/src/player/flipMix.js","../../packages/artplayer/src/player/miniMix.js","../../packages/artplayer/src/player/loopMix.js","../../packages/artplayer/src/player/posterMix.js","../../packages/artplayer/src/player/autoHeightMix.js","../../packages/artplayer/src/player/themeMix.js","../../packages/artplayer/src/player/titleMix.js","../../packages/artplayer/src/player/exclusiveMix.js","../../packages/artplayer/src/player/subtitleOffsetMix.js","../../packages/artplayer/src/player/optionInit.js","../../packages/artplayer/src/player/eventInit.js","../../packages/artplayer/src/player/index.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/superPropBase.js","../../node_modules/_@babel_runtime@7.17.2@@babel/runtime/helpers/esm/get.js","../../packages/artplayer/src/utils/component.js","../../packages/artplayer/src/control/fullscreen.js","../../packages/artplayer/src/control/fullscreenWeb.js","../../packages/artplayer/src/control/pip.js","../../packages/artplayer/src/control/playAndPause.js","../../packages/artplayer/src/control/progress.js","../../packages/artplayer/src/control/subtitle.js","../../packages/artplayer/src/control/time.js","../../packages/artplayer/src/control/vLine truncated
|
||||
@@ -1,5 +1,4 @@
|
||||
import { query, clamp, append, setStyle, setStyles, secondToTime, includeFromEvent, isMobile } from '../utils';
|
||||
import { indicatorGestureInit } from '../events/gestureInit';
|
||||
|
||||
export function getPosFromEvent(art, event) {
|
||||
const { $progress } = art.template;
|
||||
@@ -114,6 +113,10 @@ export default function progress(options) {
|
||||
|
||||
setBar('loaded', art.loaded);
|
||||
|
||||
art.on('setBar', (type, percentage) => {
|
||||
setBar(type, percentage);
|
||||
});
|
||||
|
||||
art.on('video:progress', () => {
|
||||
setBar('loaded', art.loaded);
|
||||
});
|
||||
@@ -126,46 +129,46 @@ export default function progress(options) {
|
||||
setBar('played', 1);
|
||||
});
|
||||
|
||||
proxy($control, 'mousemove', (event) => {
|
||||
setStyle($tip, 'display', 'block');
|
||||
if (includeFromEvent(event, $highlight)) {
|
||||
showHighlight(event);
|
||||
} else {
|
||||
showTime(event);
|
||||
}
|
||||
});
|
||||
if (!isMobile) {
|
||||
proxy($control, 'click', (event) => {
|
||||
if (event.target !== $indicator) {
|
||||
const { second, percentage } = getPosFromEvent(art, event);
|
||||
setBar('played', percentage);
|
||||
art.seek = second;
|
||||
}
|
||||
});
|
||||
|
||||
proxy($control, 'mouseout', () => {
|
||||
setStyle($tip, 'display', 'none');
|
||||
});
|
||||
proxy($control, 'mousemove', (event) => {
|
||||
setStyle($tip, 'display', 'block');
|
||||
if (includeFromEvent(event, $highlight)) {
|
||||
showHighlight(event);
|
||||
} else {
|
||||
showTime(event);
|
||||
}
|
||||
});
|
||||
|
||||
proxy($control, 'click', (event) => {
|
||||
if (event.target !== $indicator) {
|
||||
const { second, percentage } = getPosFromEvent(art, event);
|
||||
setBar('played', percentage);
|
||||
art.seek = second;
|
||||
}
|
||||
});
|
||||
proxy($control, 'mouseout', () => {
|
||||
setStyle($tip, 'display', 'none');
|
||||
});
|
||||
|
||||
proxy($indicator, 'mousedown', () => {
|
||||
isDroging = true;
|
||||
});
|
||||
proxy($indicator, 'mousedown', () => {
|
||||
isDroging = true;
|
||||
});
|
||||
|
||||
proxy(document, 'mousemove', (event) => {
|
||||
if (isDroging) {
|
||||
const { second, percentage } = getPosFromEvent(art, event);
|
||||
setBar('played', percentage);
|
||||
art.seek = second;
|
||||
}
|
||||
});
|
||||
proxy(document, 'mousemove', (event) => {
|
||||
if (isDroging) {
|
||||
const { second, percentage } = getPosFromEvent(art, event);
|
||||
setBar('played', percentage);
|
||||
art.seek = second;
|
||||
}
|
||||
});
|
||||
|
||||
proxy(document, 'mouseup', () => {
|
||||
if (isDroging) {
|
||||
isDroging = false;
|
||||
}
|
||||
});
|
||||
|
||||
indicatorGestureInit(art, $indicator, setBar);
|
||||
proxy(document, 'mouseup', () => {
|
||||
if (isDroging) {
|
||||
isDroging = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
};
|
||||
};
|
||||
|
||||
@@ -1,116 +1,60 @@
|
||||
import { clamp, secondToTime, isMobile } from '../utils';
|
||||
|
||||
export function indicatorGestureInit(art, $indicator, setBar) {
|
||||
if (isMobile && !art.option.isLive) {
|
||||
const {
|
||||
plugins,
|
||||
template: { $progress },
|
||||
events: { proxy },
|
||||
} = art;
|
||||
|
||||
let isDroging = false;
|
||||
|
||||
proxy($indicator, 'touchstart', (event) => {
|
||||
if (event.touches.length === 1) {
|
||||
isDroging = true;
|
||||
}
|
||||
});
|
||||
|
||||
proxy(document, 'touchmove', (event) => {
|
||||
if (event.touches.length === 1 && isDroging) {
|
||||
const autoOrientation = plugins.autoOrientation && plugins.autoOrientation.state;
|
||||
|
||||
const { left, top } = $progress.getBoundingClientRect();
|
||||
const { clientX, clientY } = event.touches[0];
|
||||
|
||||
const width = clamp(clientX - left, 0, $progress.clientWidth);
|
||||
const height = clamp(clientY - top, 0, $progress.clientWidth);
|
||||
const size = autoOrientation ? height : width;
|
||||
|
||||
const secondX = (width / $progress.clientWidth) * art.duration;
|
||||
const secondY = (height / $progress.clientWidth) * art.duration;
|
||||
|
||||
const second = autoOrientation ? secondY : secondX;
|
||||
const percentage = clamp(size / $progress.clientWidth, 0, 1);
|
||||
|
||||
setBar('played', percentage);
|
||||
art.seek = second;
|
||||
}
|
||||
});
|
||||
|
||||
proxy(document, 'touchend', () => {
|
||||
if (isDroging) {
|
||||
isDroging = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
import { clamp, secondToTime, isMobile, includeFromEvent } from '../utils';
|
||||
|
||||
export default function gestureInit(art, events) {
|
||||
if (isMobile && !art.option.isLive) {
|
||||
const {
|
||||
notice,
|
||||
plugins,
|
||||
constructor,
|
||||
template: { $video },
|
||||
template: { $video, $bottom, $controls },
|
||||
} = art;
|
||||
|
||||
let isDroging = false;
|
||||
let startX = 0;
|
||||
let startY = 0;
|
||||
let currentTime = 0;
|
||||
let pressTimer = null;
|
||||
let startTime = 0;
|
||||
|
||||
events.proxy($video, 'touchstart', (event) => {
|
||||
const onTouchStart = (event) => {
|
||||
if (event.touches.length === 1) {
|
||||
isDroging = true;
|
||||
const { clientX, clientY } = event.touches[0];
|
||||
startX = clientX;
|
||||
startY = clientY;
|
||||
|
||||
clearTimeout(pressTimer);
|
||||
pressTimer = setTimeout(() => {
|
||||
art.playbackRate = constructor.MOBILE_AUTO_PLAYBACKRATE;
|
||||
}, constructor.MOBILE_AUTO_PLAYBACKRATE_TIME);
|
||||
startTime = art.currentTime;
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
events.proxy($video, 'touchmove', (event) => {
|
||||
if (event.touches.length === 1 && isDroging) {
|
||||
const onTouchMove = (event) => {
|
||||
if (event.touches.length === 1 && isDroging && art.duration) {
|
||||
const autoOrientation = plugins.autoOrientation && plugins.autoOrientation.state;
|
||||
|
||||
const { clientX, clientY } = event.touches[0];
|
||||
const ratioX = clamp((clientX - startX) / art.width, -1, 1);
|
||||
const ratioY = clamp((clientY - startY) / art.height, -1, 1);
|
||||
|
||||
if (art.duration) {
|
||||
if (autoOrientation) {
|
||||
currentTime = clamp(art.currentTime + art.duration * ratioY, 0, art.duration);
|
||||
} else {
|
||||
currentTime = clamp(art.currentTime + art.duration * ratioX, 0, art.duration);
|
||||
}
|
||||
notice.show = `${secondToTime(currentTime)} / ${secondToTime(art.duration)}`;
|
||||
}
|
||||
const ratio = autoOrientation ? ratioY : ratioX;
|
||||
const currentTime = clamp(startTime + art.duration * ratio, 0, art.duration);
|
||||
art.seek = currentTime;
|
||||
art.emit('setBar', 'played', clamp(currentTime / art.duration, 0, 1));
|
||||
notice.show = `${secondToTime(currentTime)} / ${secondToTime(art.duration)}`;
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
events.proxy(document, 'touchend', () => {
|
||||
const onTouchEnd = () => {
|
||||
if (isDroging) {
|
||||
if (currentTime) {
|
||||
art.seek = currentTime;
|
||||
}
|
||||
|
||||
if (art.playbackRate === 3) {
|
||||
art.playbackRate = 1;
|
||||
}
|
||||
|
||||
startX = 0;
|
||||
startY = 0;
|
||||
currentTime = 0;
|
||||
startTime = 0;
|
||||
isDroging = false;
|
||||
clearTimeout(pressTimer);
|
||||
pressTimer = null;
|
||||
}
|
||||
};
|
||||
|
||||
events.proxy($bottom, 'touchstart', (event) => {
|
||||
if (!includeFromEvent(event, $controls)) {
|
||||
onTouchStart(event);
|
||||
}
|
||||
});
|
||||
|
||||
events.proxy($bottom, 'touchmove', onTouchMove);
|
||||
events.proxy($video, 'touchstart', onTouchStart);
|
||||
events.proxy($video, 'touchmove', onTouchMove);
|
||||
events.proxy(document, 'touchend', onTouchEnd);
|
||||
}
|
||||
}
|
||||
@@ -18,6 +18,7 @@
|
||||
repeat-x bottom;
|
||||
|
||||
.art-progress {
|
||||
flex: 1;
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
pointer-events: auto;
|
||||
@@ -301,12 +302,14 @@
|
||||
|
||||
&.art-mobile {
|
||||
.art-bottom {
|
||||
padding-top: 45px;
|
||||
}
|
||||
|
||||
.art-progress-indicator {
|
||||
transform: scale(1, 1) !important;
|
||||
visibility: visible !important;
|
||||
padding: 50px 5px 0;
|
||||
.art-controls {
|
||||
height: 40px;
|
||||
.art-progress-indicator {
|
||||
transform: scale(1, 1) !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -31,10 +31,4 @@
|
||||
bottom: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
&.art-mobile.art-control-show {
|
||||
.art-subtitle {
|
||||
bottom: 55px;
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in new issue
Block a user