msb-public
/
cloudreve
mirror of https://github.com/cloudreve/Cloudreve
1
0
Code Issues Projects Releases Wiki Activity

视频预览使用Dplayer

Browse Source
pull/18/head
HFO4 8 years ago
parent 9cb572f0da
commit d2ca69b945
8 changed files with 216 additions and 105 deletions
Show Stats Download Patch File Download Diff File

2
static/css/DPlayer.min.css vendored
View File

File diff suppressed because one or more lines are too long

2
static/css/share_dir.css
View File

File diff suppressed because one or more lines are too long

2
static/js/DPlayer.min.js vendored
View File

File diff suppressed because one or more lines are too long

10
static/js/angular-filemanager.min.js vendored
View File

File diff suppressed because one or more lines are too long

10
static/js/filemanager_share.js
View File

File diff suppressed because one or more lines are too long

35
static/js/home.js
Unescape View File

@ -154,7 +154,7 @@
function audioPause() { function audioPause() {
document.getElementById('audiopreview-target').pause(); document.getElementById('audiopreview-target').pause();
document.getElementById('videopreview-target').pause(); dp.pause()
} }
@ -190,6 +190,39 @@
openPhotoSwipe(t); openPhotoSwipe(t);
} }
} }
vplayderLoad = false;
var loadDPlayer = function(url){
if (!vplayderLoad) {
toastr["info"]("加载预览组件...");
includeCss("/static/css/DPlayer.min.css");
$.getScript("/static/js/DPlayer.min.js").done(function() {
toastr.clear();
vplayderLoad = 1;
playVideo(url);
});
}else{
playVideo(url);
}
}
var playVideo = function(url){
dp = new DPlayer({
container: document.getElementById("videopreview-target"),
screenshot: true,
video: {
url: url
},
});
dp.on("fullscreen", function(){
$(".modal-backdrop").hide();
$("#side").hide();
return false;
});
dp.on("fullscreen_cancel", function(){
$(".modal-backdrop").show();
$("#side").show();
return false;
})
}
function suffix($fname){ function suffix($fname){
alert($fname); alert($fname);
} }

41
static/js/share_dir.js
Unescape View File

@ -21,6 +21,14 @@
}), }),
}); });
}]); }]);
function includeCss(filename) {
var head = document.getElementsByTagName('head')[0];
var link = document.createElement('link');
link.href = filename;
link.rel = 'stylesheet';
link.type = 'text/css';
head.appendChild(link)
}
previewLoad = 0; previewLoad = 0;
var openPhotoSwipe = function(items) { var openPhotoSwipe = function(items) {
var pswpElement = document.querySelectorAll('.pswp')[0]; var pswpElement = document.querySelectorAll('.pswp')[0];
@ -56,6 +64,39 @@
openPhotoSwipe(t); openPhotoSwipe(t);
} }
} }
vplayderLoad = false;
var loadDPlayer = function(url){
if (!vplayderLoad) {
toastr["info"]("加载预览组件...");
includeCss("/static/css/DPlayer.min.css");
$.getScript("/static/js/DPlayer.min.js").done(function() {
toastr.clear();
vplayderLoad = 1;
playVideo(url);
});
}else{
playVideo(url);
}
}
var playVideo = function(url){
dp = new DPlayer({
container: document.getElementById("videopreview-target"),
screenshot: true,
video: {
url: url
},
});
dp.on("fullscreen", function(){
$(".modal-backdrop").hide();
$("#side").hide();
return false;
});
dp.on("fullscreen_cancel", function(){
$(".modal-backdrop").show();
$("#side").show();
return false;
})
}
function mobileBind(){ function mobileBind(){
if($(window).width()<768){ if($(window).width()<768){
$('a[ng-click|="selectOrUnselect(item, $event)"]').click(function(event){ $('a[ng-click|="selectOrUnselect(item, $event)"]').click(function(event){

99
static/js/share_single.js
Unescape View File

@ -45,8 +45,10 @@
} }
return fmt; return fmt;
} }
function audioPause() { function audioPause() {
document.getElementById('preview-target').pause(); document.getElementById('preview-target').pause();
dp.pause();
} }
$("#size").html(getSize(shareInfo.fileSize)); $("#size").html(getSize(shareInfo.fileSize));
$("#down_num").html(shareInfo.downloadNum); $("#down_num").html(shareInfo.downloadNum);
@ -64,15 +66,54 @@
} }
}); });
}); });
var openPhotoSwipe = function(pic,ww,hh) { vplayderLoad = false;
function includeCss(filename) {
var head = document.getElementsByTagName('head')[0];
var link = document.createElement('link');
link.href = filename;
link.rel = 'stylesheet';
link.type = 'text/css';
head.appendChild(link)
}
var loadDPlayer = function(url){
if (!vplayderLoad) {
toastr["info"]("加载预览组件...");
includeCss("/static/css/DPlayer.min.css");
$.getScript("/static/js/DPlayer.min.js").done(function() {
toastr.clear();
vplayderLoad = 1;
playVideo(url);
});
}else{
playVideo(url);
}
}
var playVideo = function(url){
dp = new DPlayer({
container: document.getElementById("preview-target"),
screenshot: true,
video: {
url: url
},
});
dp.on("fullscreen", function(){
$(".modal-backdrop").hide();
$("#side").hide();
return false;
});
dp.on("fullscreen_cancel", function(){
$(".modal-backdrop").show();
$("#side").show();
return false;
})
}
var openPhotoSwipe = function(pic, ww, hh) {
var pswpElement = document.querySelectorAll('.pswp')[0]; var pswpElement = document.querySelectorAll('.pswp')[0];
items= [ items = [{
{
src: pic, src: pic,
w: ww, w: ww,
h: hh h: hh
} }];
];
var options = { var options = {
history: false, history: false,
focus: false, focus: false,
@ -86,15 +127,16 @@
var gallery = new PhotoSwipe(pswpElement, PhotoSwipeUI_Default, items, options); var gallery = new PhotoSwipe(pswpElement, PhotoSwipeUI_Default, items, options);
gallery.init(); gallery.init();
}; };
if(/\.(gif|jpg|jpeg|png|svg|SVG|GIF|JPG|PNG)$/.test(shareInfo.fileName)){
if (/\.(gif|jpg|jpeg|png|svg|SVG|GIF|JPG|PNG)$/.test(shareInfo.fileName)) {
$.getScript("/static/js/photoswipe.min.js").done(function() { $.getScript("/static/js/photoswipe.min.js").done(function() {
$.getScript("/static/js/photoswipe-ui-default.js").done(function() { $.getScript("/static/js/photoswipe-ui-default.js").done(function() {
$("#previewButton").click(function(){ $("#previewButton").click(function() {
if(shareInfo.allowPreview){ if (shareInfo.allowPreview) {
x = shareInfo.picSize.split(",")[0]; x = shareInfo.picSize.split(",")[0];
y = shareInfo.picSize.split(",")[1]; y = shareInfo.picSize.split(",")[1];
openPhotoSwipe("/Share/Preview/"+shareInfo.shareId,x,y); openPhotoSwipe("/Share/Preview/" + shareInfo.shareId, x, y);
}else{ } else {
toastr["error"]("请先登录") toastr["error"]("请先登录")
} }
}) })
@ -102,41 +144,40 @@
}) })
}) })
}else if(/\.(mp4|flv|avi|tff|MP4|FLV|AVI|TFF)$/.test(shareInfo.fileName)){ } else if (/\.(mp4|flv|avi|tff|MP4|FLV|AVI|TFF)$/.test(shareInfo.fileName)) {
$(".file-sign").html('<i class="fa fa-file-movie-o" aria-hidden="true"></i>') $(".file-sign").html('<i class="fa fa-file-movie-o" aria-hidden="true"></i>')
$("#previewButton").click(function(){ $("#previewButton").click(function() {
if(shareInfo.allowPreview){ if (shareInfo.allowPreview) {
$(".previewContent").html('<video id="preview-target" style="width: 100%;object-fit: fill" controls="controls" class="preview" src="/Share/Preview/'+shareInfo.shareId+'" ></video>'); $(".previewContent").html('<div id="preview-target" style="width: 100%;object-fit: fill" class="preview"></div>');
$('#previewModal').modal(); $('#previewModal').modal();
}else{ loadDPlayer('/Share/Preview/' + shareInfo.shareId);
} else {
toastr["error"]("请先登录") toastr["error"]("请先登录")
} }
}) })
} } else if (/\.(MP3|mp3|wav|WAV|ogg|OGG)$/.test(shareInfo.fileName)) {
else if(/\.(MP3|mp3|wav|WAV|ogg|OGG)$/.test(shareInfo.fileName)){
$(".file-sign").html('<i class="fa fa-file-audio-o" aria-hidden="true"></i>'); $(".file-sign").html('<i class="fa fa-file-audio-o" aria-hidden="true"></i>');
$("#previewButton").click(function(){ $("#previewButton").click(function() {
if(shareInfo.allowPreview){ if (shareInfo.allowPreview) {
$(".previewContent").html('<audio id="preview-target" style="width: 100%;object-fit: fill" controls="controls" class="preview" src="/Share/Preview/'+shareInfo.shareId+'" ></audio>'); $(".previewContent").html('<audio id="preview-target" style="width: 100%;object-fit: fill" controls="controls" class="preview" src="/Share/Preview/' + shareInfo.shareId + '" ></audio>');
$('#previewModal').modal(); $('#previewModal').modal();
}else{ } else {
toastr["error"]("请先登录") toastr["error"]("请先登录")
} }
}) })
}else{ } else {
$("#previewButton").click(function(){ $("#previewButton").click(function() {
toastr["warning"]("当前文件暂不支持预览") toastr["warning"]("当前文件暂不支持预览")
}); });
if(/\.(doc|DOC|docx|DOCX|ogg)$/.test(shareInfo.fileName)){ if (/\.(doc|DOC|docx|DOCX|ogg)$/.test(shareInfo.fileName)) {
$(".file-sign").html('<i class="fa fa-file-word-o" aria-hidden="true"></i>'); $(".file-sign").html('<i class="fa fa-file-word-o" aria-hidden="true"></i>');
}else if(/\.(ppt|PPT|pptx|PPTX)$/.test(shareInfo.fileName)){ } else if (/\.(ppt|PPT|pptx|PPTX)$/.test(shareInfo.fileName)) {
$(".file-sign").html('<i class="fa fa-file-powerpoint-o" aria-hidden="true"></i>'); $(".file-sign").html('<i class="fa fa-file-powerpoint-o" aria-hidden="true"></i>');
}else if(/\.(pdf|PDF)$/.test(shareInfo.fileName)){ } else if (/\.(pdf|PDF)$/.test(shareInfo.fileName)) {
$(".file-sign").html('<i class="fa fa-file-pdf-o" aria-hidden="true"></i>'); $(".file-sign").html('<i class="fa fa-file-pdf-o" aria-hidden="true"></i>');
} } else if (/\.(zip|ZIP|RAR|rar|7z|7Z)$/.test(shareInfo.fileName)) {
else if(/\.(zip|ZIP|RAR|rar|7z|7Z)$/.test(shareInfo.fileName)){
$(".file-sign").html('<i class="fa fa-file-archive-o" aria-hidden="true"></i>'); $(".file-sign").html('<i class="fa fa-file-archive-o" aria-hidden="true"></i>');
}else{ } else {
$(".file-sign").html('<i class="fa fa-file-text" aria-hidden="true"></i>'); $(".file-sign").html('<i class="fa fa-file-text" aria-hidden="true"></i>');
} }
} }
Write Preview
Loading…
Cancel
Save