Material Tabs select method using index

Author: kevzlou7979

src/main/java/gwt/material/design/client/ui/MaterialTabs.java

@@ -41,21 +41,26 @@ interface MaterialTabsUiBinder extends UiBinder<Widget, MaterialTabs> {
 	@UiField
 	UnorderedList tabPanel;
 
-	private String name;
 
 	private String color = "";
 	private String textColor = "";
 	private String indicatorColor = "";
 	private String waves = "";
+	private int tabIndex = 1;
 
+	/**
+	 * The tabs structure consists of an unordered list of tabs that have hashes corresponding to tab ids. Then when you click on each tab, only the container with the corresponding tab id will become visible.
+	 */
 	public MaterialTabs() {
 		initWidget(uiBinder.createAndBindUi(this));
 	}
-
+	
 	@Override
 	protected void onAttach() {
+		// TODO Auto-generated method stub
 		super.onAttach();
-		name = String.valueOf(hashCode());
+		tabPanel.getElement().setId(String.valueOf(System.currentTimeMillis()));
+		String name = String.valueOf(hashCode());
 		int col = 12 / tabPanel.getWidgetCount();
 		int index = tabPanel.getWidgetCount();
 		for (Widget w : tabPanel) {
@@ -74,14 +79,25 @@ protected void onAttach() {
 			w.getElement().setAttribute("id", name + indexC);
 			indexC--;
 		}
-		initTabs();
+		initTabs(tabPanel.getElement().getId());
 		changeIndicator(indicatorColor);
+		
+		String id = contentPanel.getWidget(tabIndex).getElement().getId();
+		selectTab(id, tabPanel.getElement().getId());
 	}
 
+	/**
+	 * Line Indicator on Tab Navigation
+	 * @param color
+	 */
 	public native void changeIndicator(String color)/*-{
 		$wnd.jQuery( ".indicator" ).css( "background-color", color );
 	}-*/;
 
+	/**
+	 * Adding each tab nav , must add also the Content if you add a tab nav item
+	 * @param item
+	 */
 	@UiChild(tagname = "tab")
 	public void addTab(final Widget item) {
 		CustomAnchor a = new CustomAnchor();
@@ -90,48 +106,110 @@ public void addTab(final Widget item) {
 		tabPanel.add(li);
 	}
 
+	/**
+	 * Adding each tab content on the navigation
+	 * @param item
+	 */
 	@UiChild(tagname = "content")
 	public void addContent(final Widget item) {
 		item.addStyleName("col s12");
 		contentPanel.add(item);
 	}
 
-	public static native void initTabs()/*-{
+	/**
+	 * Initialize the Material Tab
+	 */
+	public static native void initTabs(String ulId)/*-{
 		$wnd.jQuery(document).ready(function() {
-			$wnd.jQuery('ul.tabs').tabs();
+			$wnd.jQuery('ul#' + ulId).tabs();
 		});
 	}-*/;
-
+	
+	
+	/**
+	 * Selecting the tab with id on the content 
+	 * @param id
+	 */
+	private native void selectTab(String id, String ulId)/*-{
+		 $wnd.jQuery(document).ready(function(){
+		    $wnd.jQuery('ul#' + ulId).tabs('select_tab', id);
+		 });
+	}-*/;
+	
+	/**
+	 * Get the color of the tab
+	 */
 	public String getColor() {
 		return color;
 	}
 
+	/**
+	 * Setting the color of the tab
+	 */
 	public void setColor(String color) {
 		this.color = color;
 	}
 
+	/**
+	 * Get the text color of the tab
+	 */
 	public String getTextColor() {
 		return textColor;
 	}
 
+	/**
+	 * Set the text color of the tab
+	 */
 	public void setTextColor(String textColor) {
 		this.textColor = textColor;
 	}
 
+	/**
+	 * Get the indicator underlined color
+	 * @return
+	 */
 	public String getIndicatorColor() {
 		return indicatorColor;
 	}
 
+	/**
+	 * Set the indicator underlined color
+	 * @param indicatorColor
+	 */
 	public void setIndicatorColor(String indicatorColor) {
 		this.indicatorColor = indicatorColor;
 	}
 
+	/**
+	 * Get the waves effect of the tab
+	 */
 	public String getWaves() {
 		return waves;
 	}
 
+	/**
+	 * Set the waves effect of the tab
+	 */
 	public void setWaves(String waves) {
 		this.waves = waves;
 	}
+
+
+	/**
+	 * @return the tabIndex
+	 */
+	public int getTabIndex() {
+		return tabIndex;
+	}
+
+
+	/**
+	 * @param You can automatically set the tab index by passing the desired tab index number, starts from 1.
+	 */
+	public void setTabIndex(int tabIndex) {
+		this.tabIndex = tabIndex;
+	}
+	
+	
 
 }