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

123
static/js/home.js
Unescape View File

@ -62,27 +62,27 @@
cache: true cache: true
}); });
openUpload = function() { openUpload = function() {
$("#pickfiles").css("z-index", "9999"); $("#pickfiles").css("z-index", "9999");
$('#upload_modal').modal(); $('#upload_modal').modal();
if (!upload_load) { if (!upload_load) {
$("#up_text").html("正在加载上传组件..."); $("#up_text").html("正在加载上传组件...");
$.getScript("/static/js/moxie.js").done(function() { $.getScript("/static/js/moxie.js").done(function() {
$.getScript("/static/js/plupload.dev.js").done(function() { $.getScript("/static/js/plupload.dev.js").done(function() {
$.getScript("/static/js/i18n/zh_CN.js").done(function() { $.getScript("/static/js/i18n/zh_CN.js").done(function() {
$.getScript("/static/js/ui.js").done(function() { $.getScript("/static/js/ui.js").done(function() {
$.getScript("/static/js/qiniu.js").done(function() { $.getScript("/static/js/qiniu.js").done(function() {
$.getScript("/static/js/main.js"); $.getScript("/static/js/main.js");
$("#up_text").html("选择文件"); $("#up_text").html("选择文件");
toastr.clear(); toastr.clear();
upload_load = 1; upload_load = 1;
}); });
}); });
}); });
}); });
}); });
} else { } else {
$("[class='moxie-shim moxie-shim-html5']").show(); $("[class='moxie-shim moxie-shim-html5']").show();
} }
} }
function closeUpload() { function closeUpload() {
$('#upload_modal').modal('hide'); $('#upload_modal').modal('hide');
@ -95,12 +95,12 @@
}) })
}); });
function includeCss(filename) { function includeCss(filename) {
var head = document.getElementsByTagName('head')[0]; var head = document.getElementsByTagName('head')[0];
var link = document.createElement('link'); var link = document.createElement('link');
link.href = filename; link.href = filename;
link.rel = 'stylesheet'; link.rel = 'stylesheet';
link.type = 'text/css'; link.type = 'text/css';
head.appendChild(link) head.appendChild(link)
} }
function loadMdEditor(result){ function loadMdEditor(result){
if (mdLoad == 0) { if (mdLoad == 0) {
@ -114,17 +114,17 @@
$.getScript("/static/js/mdeditor/squire-raw.js").done(function() { $.getScript("/static/js/mdeditor/squire-raw.js").done(function() {
$.when( $.when(
$.ajax({ $.ajax({
async: false, async: false,
url: "/static/js/mdeditor/tui-editor-Editor-all.min.js", url: "/static/js/mdeditor/tui-editor-Editor-all.min.js",
dataType: "script" dataType: "script"
})).done(function(){ })).done(function(){
editor = new tui.Editor({ editor = new tui.Editor({
el: document.querySelector('#md'), el: document.querySelector('#md'),
initialEditType: 'markdown', initialEditType: 'markdown',
previewStyle: 'vertical', previewStyle: 'vertical',
height: 'auto', height: 'auto',
initialValue: result, initialValue: result,
language:"zh", language:"zh",
}); });
toastr.clear(); toastr.clear();
@ -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);
} }
@ -198,15 +231,15 @@
$('a[ng-click|="selectOrUnselect(item, $event)"]').click(function(event){ $('a[ng-click|="selectOrUnselect(item, $event)"]').click(function(event){
var menu = $("#context-menu"); var menu = $("#context-menu");
if (event.pageX >= window.innerWidth - menu.width()) { if (event.pageX >= window.innerWidth - menu.width()) {
event.pageX -= menu.width(); event.pageX -= menu.width();
} }
if (event.pageY >= window.innerHeight - menu.height()) { if (event.pageY >= window.innerHeight - menu.height()) {
event.pageY -= menu.height(); event.pageY -= menu.height();
} }
$("#context-menu").css({ $("#context-menu").css({
"left": event.pageX, "left": event.pageX,
"top": event.pageY "top": event.pageY
}); });
$(this).contextmenu(); $(this).contextmenu();
return false; return false;
}) })

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){

131
static/js/share_single.js
Unescape View File

@ -14,8 +14,8 @@
}); });
jQuery.ajaxSetup({ jQuery.ajaxSetup({
cache: true cache: true
}); });
function getSize(size) { function getSize(size) {
var filetype = ['Bytes', 'KB', 'MB', 'GB', 'TB']; var filetype = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
@ -27,12 +27,12 @@
} }
Date.prototype.format = function(fmt) { Date.prototype.format = function(fmt) {
var o = { var o = {
"M+": this.getMonth() + 1, "M+": this.getMonth() + 1,
"d+": this.getDate(), "d+": this.getDate(),
"h+": this.getHours(), "h+": this.getHours(),
"m+": this.getMinutes(), "m+": this.getMinutes(),
"s+": this.getSeconds(), "s+": this.getSeconds(),
"q+": Math.floor((this.getMonth() + 3) / 3), "q+": Math.floor((this.getMonth() + 3) / 3),
"S": this.getMilliseconds() "S": this.getMilliseconds()
}; };
if (/(y+)/.test(fmt)) { if (/(y+)/.test(fmt)) {
@ -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,16 +66,55 @@
} }
}); });
}); });
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,
showAnimationDuration: 5, showAnimationDuration: 5,
@ -86,57 +127,57 @@
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"]("请先登录")
} }
}) })
}) })
}) })
}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