<%
	/**
	 * Created by The eXo Platform SAS
	 * Author : eXoPlatform
	 *          chuong.phan@exoplatform.com, phan.le.thanh.chuong@gmail.com
	 * Jun 23, 2009  
	 */
  def jsManager = _ctx.getRequestContext().getJavascriptManager();
  jsManager.importJavascript('eXo.webui.UIHorizontalTabs') ;
  jsManager.importJavascript('eXo.wcm.backoffice.private.UIFormGeneratorPortlet', '/eXoWCMResources/javascript/') ;
%>

<div class="UIFormGenerator">
	<div class="UITabPane">
		<div class="UIHorizontalTabs">
			<div class="TabsContainer ClearFix">
				<%
    				String selTabId = uicomponent.getSelectedTabId() ;
      				for(inputSet in uicomponent.getChildren()) {
        				if(!inputSet.isRendered()) continue ;
        				String className="NormalTab" ;
        				if(inputSet.getId().equals(selTabId)) className="SelectedTab" ;
						%>
          					<div class="UITab GrayTabStyle">
            					<div class="$className">
              						<div class="LeftTab">
                						<div class="RightTab">
	                  						<div class="MiddleTab" onclick="eXo.webui.UIHorizontalTabs.changeTabForUIFormTabpane(this, '$uiform.id', '$inputSet.id');"><%= uicomponent.getLabel(inputSet.getName()) %></div>
	                					</div>
              						</div>
            					</div>
          					</div>
						<%
    				}
    			%>
			  
		    </div>
	    </div>
	    <% uiform.begin() %>
				<div><input type="hidden" id="<%=uicomponent.RENDER_TAB%>" name="<%=uicomponent.RENDER_TAB%>" value="$uicomponent.selectedTabId"/></div>
		    <div class="UITabContentContainer GrayTabStyleContainer">
		    	<%
    				for(formInput in uicomponent.getChildren()) {
      				if(!formInput.isRendered()) continue ;
      				String display = "none" ;
      				if(formInput.getId().equals(selTabId)) display="block" ;
  					%>
  						<div class="UITabContent" style="display: $display;">
  							<% uicomponent.renderUIComponent(formInput) ; %>
  					</div>
  					<%
  				}
  			%>
			</div>
			<div class="UIAction">
  				<a onclick="eXo.ecm.UIFormGeneratorPortlet.submitForm();<%= uicomponent.event('Save'); %>" class="ActionButton LightBlueStyle"><%= _ctx.appRes(uicomponent.getName() + ".action.Save"); %></a>
  				<a href="javascript:void(0);" onclick="<%= uicomponent.event('Reset') %>" class="ActionButton LightBlueStyle"><%= _ctx.appRes(uicomponent.getName() + ".action.Reset"); %></a>
 	        </div>
		<% uiform.end() %>
	</div>
</div>
