use artplayer
parent
d99ee1dadc
commit
95b43461e8
|
@ -187,7 +187,9 @@
|
||||||
<img src="<!--FileEncodeUrl-->" alt="<!--FileName-->" onload="if (this.offsetWidth>document.getElementById('url').offsetWidth) this.style.width='100%';if (this.offsetHeight>document.documentElement.clientHeight) this.style.height=document.documentElement.clientHeight + 'px';" />
|
<img src="<!--FileEncodeUrl-->" alt="<!--FileName-->" onload="if (this.offsetWidth>document.getElementById('url').offsetWidth) this.style.width='100%';if (this.offsetHeight>document.documentElement.clientHeight) this.style.height=document.documentElement.clientHeight + 'px';" />
|
||||||
<!--IsimgFileEnd-->
|
<!--IsimgFileEnd-->
|
||||||
<!--IsvideoFileStart-->
|
<!--IsvideoFileStart-->
|
||||||
<div id="video-a0"></div>
|
<div id="video-a0" class="artplayerdiv" style="width: 100%; height: 100%;"></div>
|
||||||
|
<!--<script src="https://artplayer.org/uncompiled/artplayer.js"></script>-->
|
||||||
|
<script src="https://cdn.jsdelivr.net/npm/artplayer@4.0.9/dist/artplayer.min.js"></script>
|
||||||
<!--IsvideoFileEnd-->
|
<!--IsvideoFileEnd-->
|
||||||
<!--IsmusicFileStart-->
|
<!--IsmusicFileStart-->
|
||||||
<audio src="<!--FileDownUrl-->" controls="controls" style="width: 100%"></audio>
|
<audio src="<!--FileDownUrl-->" controls="controls" style="width: 100%"></audio>
|
||||||
|
@ -548,70 +550,129 @@
|
||||||
}
|
}
|
||||||
<!--IstxtFileEnd-->
|
<!--IstxtFileEnd-->
|
||||||
<!--IsvideoFileStart-->
|
<!--IsvideoFileStart-->
|
||||||
function loadResources(type, src, callback) {
|
document.getElementById('video-a0').style.height = window.innerHeight + 'px';
|
||||||
let script = document.createElement(type);
|
var fileurl = "<!--FileEncodeUrl-->";
|
||||||
let loaded = false;
|
var filename1 = fileurl.substr(0, fileurl.lastIndexOf('.'));
|
||||||
if (typeof callback === 'function') {
|
var art = new Artplayer({
|
||||||
script.onload = script.onreadystatechange = () => {
|
//container: '#video-a0',
|
||||||
if (!loaded && (!script.readyState || /loaded|complete/.test(script.readyState))) {
|
container: '.artplayerdiv',
|
||||||
script.onload = script.onreadystatechange = null;
|
url: fileurl,
|
||||||
loaded = true;
|
title: fileurl,
|
||||||
callback();
|
autoplay: true,
|
||||||
}
|
pip: true,
|
||||||
}
|
autoSize: true,
|
||||||
}
|
autoMini: true,
|
||||||
if (type === 'link') {
|
//loop: true,
|
||||||
script.href = src;
|
fullscreen: true,
|
||||||
script.rel = 'stylesheet';
|
fullscreenWeb: true,
|
||||||
} else {
|
subtitleOffset: true,
|
||||||
script.src = src;
|
miniProgressBar: true,
|
||||||
}
|
//localVideo: true,
|
||||||
document.getElementsByTagName('head')[0].appendChild(script);
|
//localSubtitle: true,
|
||||||
}
|
mutex: true,
|
||||||
function addVideos(videos) {
|
//backdrop: true,
|
||||||
let host = 'https://s0.pstatp.com/cdn/expire-1-M';
|
theme: '#23ade5',
|
||||||
let unloadedResourceCount = 4;
|
lang: navigator.language.toLowerCase(),
|
||||||
let callback = (() => {
|
/*moreVideoAttr: {
|
||||||
return () => {
|
crossOrigin: 'anonymous',
|
||||||
if (!--unloadedResourceCount) {
|
},
|
||||||
createDplayers(videos);
|
settings: [
|
||||||
}
|
{
|
||||||
};
|
index: 1,
|
||||||
})(unloadedResourceCount, videos);
|
html: 'Custom setting',
|
||||||
loadResources(
|
click: function (setting) {
|
||||||
'link',
|
console.info('You clicked on the custom setting');
|
||||||
host + '/dplayer/1.25.0/DPlayer.min.css',
|
setting.show = false;
|
||||||
callback
|
},
|
||||||
);
|
},
|
||||||
loadResources(
|
],
|
||||||
'script',
|
contextmenu: [
|
||||||
host + '/dplayer/1.25.0/DPlayer.min.js',
|
{
|
||||||
callback
|
html: 'Custom menu',
|
||||||
);
|
click: function (contextmenu) {
|
||||||
loadResources(
|
console.info('You clicked on the custom menu');
|
||||||
'script',
|
contextmenu.show = false;
|
||||||
host + '/hls.js/0.12.4/hls.light.min.js',
|
},
|
||||||
callback
|
},
|
||||||
);
|
],
|
||||||
loadResources(
|
layers: [
|
||||||
'script',
|
{
|
||||||
host + '/flv.js/1.5.0/flv.min.js',
|
html: '<img style="width: 100px" src="/assets/sample/layer.png">',
|
||||||
callback
|
click: function () {
|
||||||
);
|
console.info('You clicked on the custom layer');
|
||||||
}
|
},
|
||||||
function createDplayers(videos) {
|
style: {
|
||||||
for (i = 0; i < videos.length; i++) {
|
position: 'absolute',
|
||||||
console.log(videos[i]);
|
top: '20px',
|
||||||
new DPlayer({
|
right: '20px',
|
||||||
container: document.getElementById('video-a' + i),
|
opacity: '.9',
|
||||||
screenshot: true,
|
},
|
||||||
video: {
|
},
|
||||||
url: videos[i]
|
],
|
||||||
}
|
quality: [
|
||||||
});
|
{
|
||||||
}
|
default: true,
|
||||||
}
|
html: 'SD 480P',
|
||||||
addVideos(["<!--FileEncodeUrl-->"]);
|
url: '/assets/sample/video.mp4',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
html: 'HD 720P',
|
||||||
|
url: '/assets/sample/video.mp4',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
thumbnails: {
|
||||||
|
url: '/assets/sample/thumbnails.png',
|
||||||
|
number: 100,
|
||||||
|
width: 160,
|
||||||
|
height: 90,
|
||||||
|
column: 10,
|
||||||
|
},*/
|
||||||
|
subtitle: {
|
||||||
|
url: filename1+'.srt',
|
||||||
|
type: 'srt',
|
||||||
|
style: {
|
||||||
|
color: '#03A9F4',
|
||||||
|
},
|
||||||
|
encoding: 'utf-8',
|
||||||
|
bilingual: true,
|
||||||
|
},/*
|
||||||
|
highlight: [
|
||||||
|
{
|
||||||
|
time: 60,
|
||||||
|
text: 'One more chance',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time: 120,
|
||||||
|
text: '谁でもいいはずなのに',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time: 180,
|
||||||
|
text: '夏の想い出がまわる',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time: 240,
|
||||||
|
text: 'こんなとこにあるはずもないのに',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time: 300,
|
||||||
|
text: '终わり',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
controls: [
|
||||||
|
{
|
||||||
|
position: 'right',
|
||||||
|
html: 'localsubtitle',
|
||||||
|
mounted: ($preview) => {
|
||||||
|
art.plugins.localSubtitle.attach($preview);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
icons: {
|
||||||
|
indicator: '<img width="16" heigth="16" src="/assets/img/indicator.svg">',
|
||||||
|
loading: '<img src="/assets/img/ploading.gif">',
|
||||||
|
state: '<img width="150" heigth="150" src="/assets/img/state.svg">',
|
||||||
|
},*/
|
||||||
|
});
|
||||||
<!--IsvideoFileEnd-->
|
<!--IsvideoFileEnd-->
|
||||||
<!--IspdfFileStart-->
|
<!--IspdfFileStart-->
|
||||||
pdfjsLib.GlobalWorkerOptions.workerSrc = '//cdn.bootcss.com/pdf.js/2.3.200/pdf.worker.min.js';
|
pdfjsLib.GlobalWorkerOptions.workerSrc = '//cdn.bootcss.com/pdf.js/2.3.200/pdf.worker.min.js';
|
||||||
|
|
Loading…
Reference in New Issue