<% 
  import  org.exoplatform.webui.core.UIBreadcumbs; 
  import  org.exoplatform.webui.core.UITree; 
%>
<div class="UIGroupMembershipSelector" id="$uicomponent.id">
  <div class="Container">
		<div class="SelectedGroupPath"><% uicomponent.renderChild(UIBreadcumbs.class); %></div>
		<div class="GroupSelector">
			<div class="ContentContainer">
			  <div class="MembershipTitle"><%=_ctx.appRes(uicomponent.id+".label.selectGroup")%></div>
			  <%uicomponent.renderChild(UITree.class);%>
			</div>
		</div>
	  <div class="MembershipSelector">
	  	<div class="ContentContainer">
		    <div class="MembershipTitle"><%=_ctx.appRes(uicomponent.id+".label.selectUser")%></div>
	      <div class="OverflowContainer">
		      <%                
		      boolean even = true ;
		      if(uicomponent.getCurrentGroup() != null) {
			      for(user in uicomponent.getUsers()){
			        String rowCssClass = "OddRow" ;
			        if(even) rowCssClass = "EvenRow" ;  
			        even = !even ;
		      %>
				      <div class="$rowCssClass">
				        <a class="ItemIcon" href="<%=uicomponent.event('SelectMembership', user.getUserName())%>"><%=user.getUserName()%></a>	
				      </div>
		      <%}
		      }%>
	      </div>
	    </div>
	  </div>
		<div style="clear: left"><span></span></div>
	</div>
</div> 		
