Make calling "selectTabHeader" to implicitly show the content view

"selectTabHeader" now triggers a "select:tabHeader" event, which the
TabView handles by showing the appropriate content view. Thus, the click
events on tab headers can be directly handled with "selectTabHeader" and
"selectTab" no longer needs to explicitly show the content view.

Showing the appropriate content view when a tab header is selected
through "selectTabHeader" is a preparatory step to make possible to
remove tabs.

Signed-off-by: Daniel Calviño Sánchez <danxuliu@gmail.com>

1 files changed, 13 insertions, 7 deletions

diff --git a/js/views/tabview.js b/js/views/tabview.js
index c3b4597bf..4efeb31ad 100644
--- a/js/views/tabview.js
+++ b/js/views/tabview.js
@@ -76,9 +76,8 @@
 		// nothing to be rendered with a template.
 		template: _.noop,
 
-		childViewTriggers: {
-			// Propagate the event to the parent view.
-			'click:tabHeader': 'click:tabHeader'
+		childViewEvents: {
+			'click:tabHeader': 'selectTabHeader'
 		},
 
 		addTabHeader: function(tabId, tabHeaderOptions) {
@@ -157,6 +156,8 @@
 			this._currentTabId = tabId;
 
 			this.getChildView(this._currentTabId).setSelected(true);
+
+			this.triggerMethod('select:tabHeader', tabId);
 		}
 
 	});
@@ -231,10 +232,6 @@
 			}
 		},
 
-		onChildviewClickTabHeader: function(tabId) {
-			this.selectTab(tabId);
-		},
-
 		/**
 		 * Select the tab associated to the given tabId.
 		 *
@@ -246,7 +243,16 @@
 			}
 
 			this._tabHeadersView.selectTabHeader(tabId);
+		},
 
+		/**
+		 * Shows the content view associated to the selected tab header.
+		 *
+		 * Only for internal use as an event handler.
+		 *
+		 * @param string tabId the ID of the selected tab.
+		 */
+		onChildviewSelectTabHeader: function(tabId) {
 			// With Marionette 3.1 "this.detachChildView('tabContent')" would be
 			// used instead of the "preventDestroy" option.
 			this.showChildView('tabContent', this._tabContentViews[tabId], { preventDestroy: true } );