[cmd:quicklook] fix loss of control on fullscreen with iframe

This commit is contained in:
nao-pon
2016-04-19 17:36:19 +09:00
parent 18e4d2d47e
commit fbdefa7aca
3 changed files with 96 additions and 25 deletions
+12 -2
View File
@@ -35,8 +35,16 @@
/* hide preview border in fullscreen mode */
.elfinder-quicklook-fullscreen .elfinder-quicklook-preview { border:0 solid ;}
.elfinder-quicklook-fullscreen iframe {
height: 99%;
/*.elfinder-quicklook-fullscreen iframe {
height: 100%;
}*/
.elfinder-quicklook-cover {
width: 100%;
height: 100%;
top: 0;
left: 0;
position: absolute;
}
/* quicklook titlebar */
@@ -150,6 +158,8 @@
padding:5px;
border:1px solid #eee;
background:#000;
opacity: 0.4;
filter: Alpha(Opacity=40);
}
/* show close icon in fullscreen mode */
+53 -19
View File
@@ -129,9 +129,12 @@ elFinder.prototype.commands.quicklook = function() {
* @type jQuery
**/
cwd,
navdrag = false,
coverEv = 'mousemove touchstart ' + ('onwheel' in document? 'wheel' : 'onmousewheel' in document? 'mousewheel' : 'DOMMouseScroll'),
title = $('<div class="elfinder-quicklook-title"/>'),
icon = $('<div/>'),
info = $('<div class="elfinder-quicklook-info"/>'),//.hide(),
cover = $('<div class="elfinder-quicklook-cover"/>'),
fsicon = $('<div class="'+navicon+' '+navicon+'-fullscreen"/>')
.mousedown(function(e) {
var win = self.window,
@@ -142,9 +145,11 @@ elFinder.prototype.commands.quicklook = function() {
e.stopPropagation();
if (full) {
win.css(win.data('position')).off('mousemove touchstart');
win.css(win.data('position'));
$window.off(scroll).trigger(self.resize).off(self.resize);
navbar.off('mouseenter touchstart').off('mousemove');
navbar.off('mouseenter');
cover.data('tm') && clearTimeout(cover.data('tm'));
cover.hide().off(coverEv);
} else {
win.data('position', {
left : win.css('left'),
@@ -168,20 +173,37 @@ elFinder.prototype.commands.quicklook = function() {
})
.trigger(scroll)
.trigger(self.resize);
cover.on(coverEv, function(e) {
if (! navdrag) {
e.stopPropagation();
if (e.type === 'mousemove' || e.type === 'touchstart') {
navbar.stop(true, true).show().delay(3000).fadeOut('slow');
}
if (cover.is(':visible')) {
cover.hide();
cover.data('tm', setTimeout(function() {
cover.show();
}, 3000));
}
}
}).show().trigger('mousemove');
win.on('mousemove touchstart', function(e) {
navbar.stop(true, true).show().delay(3000).fadeOut('slow');
})
.mousemove();
navbar.on('mouseenter touchstart', function() {
navbar.on('mouseenter', function() {
navbar.stop(true, true).show();
})
.mousemove(function(e) {
e.stopPropagation();
});
}
navbar.attr('style', '').draggable(full ? 'destroy' : {});
if (! fm.UA.Mobile) {
navbar.attr('style', '').draggable(full ? 'destroy' : {
start: function() {
cover.show();
navdrag = true;
},
stop: function() {
navdrag = false;
}
});
}
win.toggleClass(fullscreen);
$(this).toggleClass(navicon+'-fullscreen-off');
var collection = win;
@@ -189,6 +211,8 @@ elFinder.prototype.commands.quicklook = function() {
collection = collection.add(parent);
};
$.fn.resizable && !fm.UA.Touch && collection.resizable(full ? 'enable' : 'disable').removeClass('ui-state-disabled');
win.trigger('viewchange');
}),
navbar = $('<div class="elfinder-quicklook-navbar"/>')
@@ -210,7 +234,6 @@ elFinder.prototype.commands.quicklook = function() {
self.info.attr('style', '').hide();
icon.removeAttr('class').attr('style', '');
info.html('');
})
// update info/icon
.on('update', function(e) {
@@ -245,6 +268,11 @@ elFinder.prototype.commands.quicklook = function() {
.attr('src', (tmb = fm.tmb(file.hash)));
}
self.info.delay(100).fadeIn(10);
setTimeout(function() {
if (fm.UA.Mobile || navbar.parent().find('.elfinder-quicklook-navbar:hover').length < 1) {
cover.trigger('mousemove');
}
}, 100);
} else {
e.stopImmediatePropagation();
}
@@ -257,14 +285,17 @@ elFinder.prototype.commands.quicklook = function() {
.click(function(e) { e.stopPropagation(); })
.append(
$('<div class="elfinder-quicklook-titlebar"/>')
.append(title)
.append($('<span class="ui-icon ui-icon-circle-close"/>').mousedown(function(e) {
.append(
title,
$('<span class="ui-icon ui-icon-circle-close"/>').mousedown(function(e) {
e.stopPropagation();
self.window.trigger('close');
}))
)
.append(this.preview.add(navbar))
.append(self.info.hide())
})),
this.preview,
self.info.hide(),
cover.hide(),
navbar
)
.draggable({handle : 'div.elfinder-quicklook-titlebar'})
.on('open', function(e) {
var win = self.window,
@@ -275,11 +306,14 @@ elFinder.prototype.commands.quicklook = function() {
navbar.attr('style', '');
state = animated;
node.trigger('scrolltoview');
cover.data('tm') && clearTimeout(cover.data('tm'));
cover.hide();
win.css(closedCss(node))
.show()
.animate(openedCss(), 550, function() {
state = opened;
self.update(1, self.value);
navbar.stop(true, true).show();
});
}
})
+31 -4
View File
@@ -212,7 +212,8 @@ elFinder.prototype.commands.quicklook.plugins = [
if (file.mime == mime) {
e.stopImmediatePropagation();
ql.hideinfo();
preview.append((node = $('<embed class="elfinder-quicklook-preview-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" src="'+fm.url(file.hash)+'" quality="high" type="application/x-shockwave-flash" />')));
node = $('<embed class="elfinder-quicklook-preview-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" src="'+fm.url(file.hash)+'" quality="high" type="application/x-shockwave-flash" wmode="transparent" />')
.appendTo(preview);
}
});
},
@@ -239,7 +240,9 @@ elFinder.prototype.commands.quicklook.plugins = [
'audio/x-mp4' : 'm4a',
'audio/ogg' : 'ogg'
},
node;
node,
win = ql.window,
navi = win.find('.elfinder-quicklook-navbar');
preview.on('update', function(e) {
var file = e.file,
@@ -251,9 +254,16 @@ elFinder.prototype.commands.quicklook.plugins = [
node = $('<audio class="elfinder-quicklook-preview-audio" controls preload="auto" autobuffer><source src="'+ql.fm.openUrl(file.hash)+'" /></audio>')
.appendTo(preview);
autoplay && node[0].play();
win.on('viewchange.audio', function() {
navi.css('bottom', win.hasClass('elfinder-quicklook-fullscreen')? '50px' : '');
});
navi.css('bottom', win.hasClass('elfinder-quicklook-fullscreen')? '50px' : '');
}
}).on('change', function() {
if (node && node.parent().length) {
win.off('viewchange.audio');
navi.css('bottom', '');
node[0].pause();
node.remove();
node= null;
@@ -277,7 +287,9 @@ elFinder.prototype.commands.quicklook.plugins = [
'application/ogg' : 'ogg',
'video/webm' : 'webm'
},
node;
node,
win = ql.window,
navi = win.find('.elfinder-quicklook-navbar');
preview.on('update', function(e) {
var file = e.file,
@@ -290,9 +302,15 @@ elFinder.prototype.commands.quicklook.plugins = [
node = $('<video class="elfinder-quicklook-preview-video" controls preload="auto" autobuffer><source src="'+ql.fm.openUrl(file.hash)+'" /></video>').appendTo(preview);
autoplay && node[0].play();
win.on('viewchange.video', function() {
navi.css('bottom', win.hasClass('elfinder-quicklook-fullscreen')? '50px' : '');
});
navi.css('bottom', win.hasClass('elfinder-quicklook-fullscreen')? '50px' : '');
}
}).on('change', function() {
if (node && node.parent().length) {
win.off('viewchange.video');
navi.css('bottom', '');
node[0].pause();
node.remove();
node= null;
@@ -308,7 +326,9 @@ elFinder.prototype.commands.quicklook.plugins = [
function(ql) {
var preview = ql.preview,
mimes = [],
node;
node,
win = ql.window,
navi = win.find('.elfinder-quicklook-navbar');
$.each(navigator.plugins, function(i, plugins) {
$.each(plugins, function(i, plugin) {
@@ -326,9 +346,16 @@ elFinder.prototype.commands.quicklook.plugins = [
(video = mime.indexOf('video/') === 0) && ql.hideinfo();
node = $('<embed src="'+ql.fm.openUrl(file.hash)+'" type="'+mime+'" class="elfinder-quicklook-preview-'+(video ? 'video' : 'audio')+'"/>')
.appendTo(preview);
win.on('viewchange.embed', function() {
navi.css('bottom', win.hasClass('elfinder-quicklook-fullscreen')? '50px' : '');
});
navi.css('bottom', win.hasClass('elfinder-quicklook-fullscreen')? '50px' : '');
}
}).on('change', function() {
if (node && node.parent().length) {
win.off('viewchange.embed');
navi.css('bottom', '');
node.remove();
node= null;
}