From 48c5eff7672d7e6fcfc3f64194e03253d8e2fd0f Mon Sep 17 00:00:00 2001
From: Anika Henke <anika@selfthinker.org>
Date: Thu, 3 Nov 2011 19:22:34 +0000
Subject: [PATCH] fix widths of panels in fullscreen mediamanager to be 100%
when resizing (FS#2351) -- please test in different screen sizes, etc
---
lib/scripts/media.js | 68 +++++++++++---------------------------------
1 file changed, 16 insertions(+), 52 deletions(-)
diff --git a/lib/scripts/media.js b/lib/scripts/media.js
index 48bfdbbe8..253720324 100644
--- a/lib/scripts/media.js
+++ b/lib/scripts/media.js
@@ -457,44 +457,6 @@ var dw_mediamanager = {
},
window_resize: function () {
- if (jQuery('#mediamanager__page').width() == dw_mediamanager.layout_width) {
- return;
- }
-
- dw_mediamanager.layout_width = jQuery('#mediamanager__page').width();
- $r = jQuery("#mediamanager__page div.panel");
-
- var w = 0, wSum = 0, mCount = 0, mArray = [];
- $r.each(function() {
- w = jQuery(this).width();
- if (w == parseFloat(jQuery(this).css("min-width"))) {
- wSum += w;
- } else {
- mArray[mCount] = jQuery(this);
- mCount++;
- }
- });
-
- if (mCount > 0) {
- var width = (0.95 * jQuery('#mediamanager__page').width() - wSum - 30);
- wSum = 0;
- for(var i = 0; i < mArray.length; i++) {
- wSum += mArray[i].width();
- }
- for(var i = 0; i < mArray.length; i++) {
- w = mArray[i].width();
- w = 100*w / wSum;
- mArray[i].width(width*w/100);
- }
- }
-
- $r.each(function() {
- w = jQuery(this).width();
- w = (100 * w / jQuery('#mediamanager__page').width());
- w += "%";
- jQuery(this).width(w);
- });
-
dw_mediamanager.resize();
dw_mediamanager.opacity_slider();
@@ -513,29 +475,31 @@ var dw_mediamanager = {
update_resizable: function () {
$resizables = dw_mediamanager.$resizables();
- $resizables.resizable({ handles: 'e' ,
+ $resizables.resizable({
+ handles: 'e',
resize: function(event, ui){
- var w = 0;
+ var widthFull = jQuery('#mediamanager__page').width();
+ var widthResizables = 0;
$resizables.each(function() {
- w += jQuery(this).width();
+ widthResizables += jQuery(this).width();
});
- wSum = w + parseFloat(jQuery('#mediamanager__page div.file').css("min-width"));
+ var $filePanel = jQuery('#mediamanager__page div.panel.file');
- // max width of resizable column
- var maxWidth = 0.95 * jQuery('#mediamanager__page').width() - wSum + jQuery(this).width() - 30;
+ // set max width of resizable column
+ var widthOtherResizable = widthResizables - jQuery(this).width();
+ var minWidthNonResizable = parseFloat($filePanel.css("min-width"));
+ var maxWidth = widthFull - (widthOtherResizable + minWidthNonResizable);
$resizables.resizable( "option", "maxWidth", maxWidth );
- // percentage width of the first two columns
- var wLeft = ( 100*(w+30) / jQuery('#mediamanager__page').width() );
-
- // width of the third column
- var wRight = 95-wLeft;
- wRight += "%";
- jQuery('#mediamanager__page div.file').width(wRight);
+ // width of file panel in % = 100% - width of resizables in %
+ // this calculates with 99.99 and not 100 to overcome rounding errors
+ var relWidthNonResizable = 99.99 - (100 * widthResizables / widthFull);
+ // set width of file panel
+ $filePanel.width(relWidthNonResizable+'%');
$resizables.each(function() {
w = jQuery(this).width();
- w = (100 * w / jQuery('#mediamanager__page').width());
+ w = (99.99 * w / widthFull);
w += "%";
jQuery(this).width(w);
});
--
GitLab