From: Alexander Ebert <ebert@woltlab.com>
Date: Fri, 25 Nov 2011 19:33:57 +0000 (+0100)
Subject: Dialogs are now properly resized
X-Git-Tag: 2.0.0_Beta_1~1544^2~3
X-Git-Url: https://git.stricted.de/?a=commitdiff_plain;h=1e7d6513d0f16b616c2684e75d60ae4935082685;p=GitHub%2FWoltLab%2FWCF.git

Dialogs are now properly resized
---

diff --git a/wcfsetup/install/files/acp/style/style.css b/wcfsetup/install/files/acp/style/style.css
index 5bc639681e..259c3e0c85 100644
--- a/wcfsetup/install/files/acp/style/style.css
+++ b/wcfsetup/install/files/acp/style/style.css
@@ -2948,7 +2948,7 @@ a.wcfDialogCloseButton span {
 .wcfDialogContainer > .wcfDialogContent {
 	border-radius: 7px;
 	padding: 0;
-	width: auto !important;
+	/*width: auto !important;*/
 }
 
 .ui-dialog-titlebar ~ .ui-dialog-content,
diff --git a/wcfsetup/install/files/js/WCF.js b/wcfsetup/install/files/js/WCF.js
index 25e5b85e06..ebbc4e0456 100644
--- a/wcfsetup/install/files/js/WCF.js
+++ b/wcfsetup/install/files/js/WCF.js
@@ -3207,6 +3207,12 @@ $.widget('ui.wcfDialog', {
 	 */
 	_content: null,
 
+	/**
+	 * dialog content dimensions
+	 * @var	object
+	 */
+	_contentDimensions: null,
+
 	/**
 	 * modal overlay
 	 * @var	jQuery
@@ -3344,6 +3350,9 @@ $.widget('ui.wcfDialog', {
 	 * @param	jQuery		jqXHR
 	 */
 	_success: function(data, textStatus, jqXHR) {
+		// initialize dialog content
+		this._initDialog(data);
+
 		// remove loading overlay
 		this._content.removeClass('overlayLoading');
 		
@@ -3352,6 +3361,39 @@ $.widget('ui.wcfDialog', {
 		}
 	},
 
+	/**
+	 * Initializes dialog content if applicable.
+	 * 
+	 * @param	object		data
+	 */
+	_initDialog: function(data) {
+		// insert template
+		data.ignoreTemplate = true;
+		var $template = this._getResponseValue(data, 'template');
+		if ($template !== null) {
+			this._content.children().html($template);
+			this.render();
+		}
+	},
+
+	/**
+	 * Returns a response value, taking care of different object
+	 * structure returned by AJAXProxy.
+	 * 
+	 * @param	object		data
+	 * @param	string		key
+	 */
+	_getResponseValue: function(data, key) {
+		if (data.returnValues && data.returnValues[key]) {
+			return data.returnValues[key];
+		}
+		else if (data[key]) {
+			return data[key];
+		}
+
+		return null;
+	},
+
 	/**
 	 * Opens this dialog.
 	 */
@@ -3360,6 +3402,10 @@ $.widget('ui.wcfDialog', {
 			return;
 		}
 
+		if (this._overlay !== null) {
+			this._overlay.show();
+		}
+
 		this.render();
 		this._isOpen = true;
 	},
@@ -3397,12 +3443,19 @@ $.widget('ui.wcfDialog', {
 			// temporarily display container
 			this._container.show();
 		}
+		else {
+			// remove fixed content dimensions for calculation
+			this._content.css({
+				height: 'auto',
+				width: 'auto'
+			});
+		}
 
 		// force content to be visible
 		this._content.children().each(function() {
 			$(this).show();
 		});
-		
+
 		// calculate dimensions
 		var $windowDimensions = $(window).getDimensions();
 		var $containerDimensions = this._container.getDimensions('outer');
@@ -3438,14 +3491,58 @@ $.widget('ui.wcfDialog', {
 				top: $topOffset + 'px'
 			});
 
+			// set height to maximum height if exceeded
+			if ($contentDimensions.height > $maximumHeight) {
+				$contentDimensions.height = $maximumHeight;
+			}
+
+			// save current dimensions
+			this._contentDimensions = $contentDimensions;
+
+			// force dimensions
+			this._content.css({
+				height: this._contentDimensions.height + 'px',
+				width: this._contentDimensions.width + 'px'
+			});
+
 			// fade in container
 			this._container.wcfFadeIn();
 		}
 		else {
+			// save reference (used in callback)
+			var $content = this._content;
+			console.debug(this._contentDimensions);
+			// force previous dimensions
+			$content.css({
+				height: this._contentDimensions.height + 'px',
+				width: this._contentDimensions.width + 'px'
+			});
+
+			// set height to maximum height if exceeded
+			if ($contentDimensions.height > $maximumHeight) {
+				$contentDimensions.height = $maximumHeight;
+			}
+			
+			// apply new dimensions
+			$content.animate({
+				height: ($contentDimensions.height - 30) + 'px',
+				width: ($contentDimensions.width - 40) + 'px'
+			}, 600, function() {
+				// remove static dimensions
+				$content.css({
+					height: 'auto',
+					width: 'auto'
+				});
+			});
+			
+			// store new dimensions
+			this._contentDimensions = $contentDimensions;
+
+			// move container
 			this._container.animate({
 				left: $leftOffset + 'px',
 				top: $topOffset + 'px'
-			}, 200);
+			}, 600);
 		}
 	}
 });