Issue #210 Improvement: Auto-switch for TTabPanel

2 files changed, 27 insertions, 3 deletions

diff --git a/framework/Web/Javascripts/source/prado/controls/tabpanel.js b/framework/Web/Javascripts/source/prado/controls/tabpanel.js
index 900dfcb3..157664e3 100644
--- a/framework/Web/Javascripts/source/prado/controls/tabpanel.js
+++ b/framework/Web/Javascripts/source/prado/controls/tabpanel.js
@@ -12,10 +12,13 @@ Prado.WebUI.TTabPanel = Class.create(Prado.WebUI.Control,
 		{

 			var item = options.Views[i];

 			var element = $(item+'_0');

-			if (element)

-			 if (options.ViewsVis[i])

+			if (element && options.ViewsVis[i])

+			{

 				this.observe(element, "click", this.elementClicked.bindEvent(this,item));

-			

+				if (options.AutoSwitch)

+					this.observe(element, "mouseenter", this.elementClicked.bindEvent(this,item));

+			}

+	

 			if(element)

 			{

 				var view = $(options.Views[i]);

diff --git a/framework/Web/UI/WebControls/TTabPanel.php b/framework/Web/UI/WebControls/TTabPanel.php
index 7f0c2d36..fd20b949 100644
--- a/framework/Web/UI/WebControls/TTabPanel.php
+++ b/framework/Web/UI/WebControls/TTabPanel.php
@@ -17,6 +17,9 @@
  * TTabPanel displays a tabbed panel. Users can click on the tab bar to switching among

  * different tab views. Each tab view is an independent panel that can contain arbitrary content.

  *

+ * If the {@link setAutoSwitch AutoSwitch} property is enabled, the user will be able to switch the active view

+ * to another one just hovering its corresponding tab caption.

+ *

  * A TTabPanel control consists of one or several {@link TTabView} controls representing the possible

  * tab views. At any time, only one tab view is visible (active), which is specified by any of

  * the following properties:

@@ -172,6 +175,23 @@ class TTabPanel extends TWebControl implements IPostBackDataHandler
 	}

 

     /**

+     * @return bool status of automatic tab switch on hover

+     */

+    public function getAutoSwitch()

+    {

+        return TPropertyValue::ensureBoolean($this->getViewState('AutoSwitch'));

+    }

+

+    /**

+     * @param bool whether to enable automatic tab switch on hover

+     */

+    public function setAutoSwitch($value)

+    {

+        $this->setViewState('AutoSwitch',TPropertyValue::ensureBoolean($value));

+    }

+

+

+    /**

      * @return string URL for the CSS file including all relevant CSS class definitions. Defaults to ''.

      */

     public function getCssUrl()

@@ -448,6 +468,7 @@ class TTabPanel extends TWebControl implements IPostBackDataHandler
 		}

 		$options['Views'] = $viewIDs;

 		$options['ViewsVis'] = $viewVis;

+		$options['AutoSwitch'] = $this->getAutoSwitch();

 

 		return $options;

 	}