From cb73f12d555e156af307ec06d6ce4de888c2c0f5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?L=C3=B3na=20Lore?= <lonalore@freemail.hu>
Date: Sat, 21 Jan 2017 11:27:36 +0100
Subject: [PATCH] Use fadeIn and fadeOut for tab visibility...

---
 e107_admin/cpage.php             | 21 ++++++++++----------
 e107_web/js/core/admin.jquery.js | 33 ++++++++++++++++++++++++++++++++
 2 files changed, 44 insertions(+), 10 deletions(-)

diff --git a/e107_admin/cpage.php b/e107_admin/cpage.php
index c8c53147d..38b8e2f59 100644
--- a/e107_admin/cpage.php
+++ b/e107_admin/cpage.php
@@ -796,26 +796,27 @@ class page_admin_ui extends e_admin_ui
 				$tabId = 'additional';
 
 				$data = array(
-						'tabs'	=>  $this->getTabs(),
-						'legend' => '',
-						'fields' => $this->getFields(),
+					'tabs'   => $this->getTabs(),
+					'legend' => '',
+					'fields' => $this->getFields(),
 				);
 
 				$text = $this->getUI()->renderCreateFieldset($elid, $data, $model, $tabId);
-				$displayMode = 'inline-block';
+
+				$ajax = e107::getAjax();
+				$commands = array();
 
 				if(empty($text))
 				{
 					$text = ""; // There are no additional fields for the selected chapter.
-					$displayMode = 'none';
+					$commands[] = $ajax->commandInvoke('a[href="#tab' . $tabId . '"]', 'fadeOut');
+				}
+				else
+				{
+					$commands[] = $ajax->commandInvoke('a[href="#tab' . $tabId . '"]', 'fadeInAdminTab');
 				}
 
-				$ajax = e107::getAjax();
-
-				$commands = array();
 				$commands[] = $ajax->commandInvoke('#tab' . $tabId, 'html', array($text));
-				// Show/hide tab.
-				$commands[] = $ajax->commandInvoke('a[href="#tab' . $tabId . '"]', 'css', array('display', $displayMode));
 
 				$ajax->response($commands);
 				exit;
diff --git a/e107_web/js/core/admin.jquery.js b/e107_web/js/core/admin.jquery.js
index d3a617a83..d9f8b2b21 100644
--- a/e107_web/js/core/admin.jquery.js
+++ b/e107_web/js/core/admin.jquery.js
@@ -53,6 +53,39 @@ var e107 = e107 || {'settings': {}, 'behaviors': {}};
 
 })(jQuery);
 
+(function (jQuery)
+{
+
+	/**
+	 * jQuery extension to make admin tab 'fadeIn' with 'display: inline-block'.
+	 *
+	 * @param displayMode
+	 *  A string determining display mode for element after the animation.
+	 *  Default: 'inline-block'.
+	 * @param duration
+	 *  A string or number determining how long the animation will run.
+	 *  Default: 400.
+	 */
+	jQuery.fn.fadeInAdminTab = function (displayMode, duration)
+	{
+		var $this = $(this);
+
+		if($this.css('display') !== 'none')
+		{
+			return;
+		}
+
+		displayMode = displayMode || 'inline-block';
+		duration = duration || 400;
+
+		$this.fadeIn(duration, function ()
+		{
+			$this.css('display', displayMode);
+		});
+	};
+
+})(jQuery);
+
 
 $(document).ready(function()
 {