simplify media manager panel height
The height of the panel was calculated in JavaScript, trying to use the remaining space. With larger headers that lead to a relatively small area. In addition the height calculation behaved weirdly on certain resolutions (in some templates) resulting in a decreasing height on each image interaction. This patch simply sets the panel height 60% of the browser window using the vh unit (which was not available when the media manager was written). To keep backward compatibility and not accidentally break a bunch of templates, the height is still set from JavaScript but only once instead of updating it on every resize operation. A proper refactoring of the whole media manager code is still something we need to tackle in the future, but this change should make it slightly better.
This commit is contained in:
parent
66966f8dc7
commit
d0eb8bfe20
|
@ -105,6 +105,7 @@ var dw_mediamanager = {
|
|||
// less/more recent buttons in media revisions form
|
||||
.on('submit', '.btn_newer, .btn_older', dw_mediamanager.details);
|
||||
|
||||
dw_mediamanager.resize();
|
||||
dw_mediamanager.update_resizable();
|
||||
dw_mediamanager.layout_width = $page.width();
|
||||
jQuery(window).on('resize', dw_mediamanager.window_resize);
|
||||
|
@ -373,9 +374,6 @@ var dw_mediamanager = {
|
|||
.toggleClass('rows', new_type === 'rows')
|
||||
.toggleClass('thumbs', new_type === 'thumbs');
|
||||
}], new_type);
|
||||
|
||||
// FIXME: Move to onchange handler (opt[2])?
|
||||
dw_mediamanager.resize();
|
||||
},
|
||||
|
||||
set_fileview_sort: function (new_sort) {
|
||||
|
@ -478,8 +476,6 @@ var dw_mediamanager = {
|
|||
},
|
||||
|
||||
window_resize: function () {
|
||||
dw_mediamanager.resize();
|
||||
|
||||
dw_mediamanager.opacity_slider();
|
||||
dw_mediamanager.portions_slider();
|
||||
},
|
||||
|
@ -519,33 +515,14 @@ var dw_mediamanager = {
|
|||
// set width of file panel
|
||||
$filePanel.width(relWidthNonResizable + '%');
|
||||
|
||||
dw_mediamanager.resize();
|
||||
|
||||
dw_mediamanager.opacity_slider();
|
||||
dw_mediamanager.portions_slider();
|
||||
}
|
||||
});
|
||||
|
||||
dw_mediamanager.resize();
|
||||
},
|
||||
|
||||
resize: function () {
|
||||
var $contents = jQuery('#mediamanager__page').find('div.panelContent'),
|
||||
height = jQuery(window).height() - jQuery(document.body).height() +
|
||||
Math.max.apply(null, jQuery.map($contents, function (v) {
|
||||
return jQuery(v).height();
|
||||
}));
|
||||
|
||||
// If the screen is too small, don’t try to resize
|
||||
if (height < dw_mediamanager.minHeights[dw_mediamanager.view_opts.list]) {
|
||||
$contents.add(dw_mediamanager.$resizables()).height('auto');
|
||||
} else {
|
||||
$contents.height(height);
|
||||
dw_mediamanager.$resizables().each(function () {
|
||||
var $this = jQuery(this);
|
||||
$this.height(height + $this.find('div.panelContent').offset().top - $this.offset().top);
|
||||
});
|
||||
}
|
||||
jQuery('#mediamanager__page').find('div.panelContent').css('height', '60vh');
|
||||
},
|
||||
|
||||
/**
|
||||
|
|
Loading…
Reference in New Issue