mirror of
https://github.com/Studio-42/elFinder
synced 2026-06-08 12:37:09 +00:00
[cmd:quicklook] fix loss of control on fullscreen with iframe
This commit is contained in:
+12
-2
@@ -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
@@ -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();
|
||||
});
|
||||
}
|
||||
})
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user