<%
	import org.exoplatform.web.application.JavascriptManager;
	
	def rcontext = _ctx.getRequestContext();
	JavascriptManager jsmanager = rcontext.getJavascriptManager();
	jsmanager.require("SHARED/webui-ext", "webuiExt").require("SHARED/bts_dropdown")
				.addScripts("webuiExt.UIDropDownControl.init('$uicomponent.id');");
	def options = uicomponent.getOptions();
%>
<div class="btn-group uiDropdownWithIcon" id="$uicomponent.id">

	<div class="btn dropdown-toggle" data-toggle="dropdown">
		<% 
			if (options.size() > 0) { 
			String label = _ctx.appRes(uicomponent.getId() + ".item." + uicomponent.getLabel());
			if(label.length() > 25) {
		%>
			<span title="<%=label%>"><%=label.substring(0,22)%>...</span>
		<% }else {%>
			<span><%=label%></span>
		<% }}else {%>
			<span><%=_ctx.appRes(uicomponent.getId() + ".title.Empty")%></span>
		<% } %>
		 <span class="spiter"></span> <i class="uiIconMiniArrowDown uiIconLightGray"></i>
	</div>

	<ul class="dropdown-menu" role="menu">
		
		<%
			int selectedIndex = 0;
			for(option in options) {
		 %>
			<li>
				<% 
					String label = _ctx.appRes(uicomponent.getId() + ".item." + option.label);
					if(label.length() > 30) {
				%>
				<a class="OptionItem" href="javascript:void(0);" onclick="<%=uicomponent.event(selectedIndex)%>" title="<%=label%>"> <%=label.substring(0,25)%>...</a>
				<% } else { %>
				<a class="OptionItem" href="javascript:void(0);" onclick="<%=uicomponent.event(selectedIndex)%>"><%=label%></a>
				<% } %>
			</li>
		<% selectedIndex++;}%>
		
	</ul>
</div>
