
<%
  import org.exoplatform.webui.form.UIFormInput;
%>
<%
  public void writeAction(String label, String action, String param) {
				if(param != null)
				  println " <a href=\"javascript:void(0);\" onclick=\"" + uicomponent.event(action, param) + "\" class=\"ActionButton LightBlueStyle\">" ;
				else
		  		  println " <a href=\"javascript:void(0);\" onclick=\"" + uicomponent.event(action) + "\" class=\"ActionButton LightBlueStyle\">" ;
    println """
				 $label
				</a>
		""" ;
  }
%>

<div class="UITask UIFormWithTitle">

  <% 
    uiform.begin() 
    def resWorkflow = uicomponent.getWorkflowBundle() ;
  %>
  <div class="TitleBar"><%=resWorkflow.getString("title")%></div>
  <div class="HorizontalLayout">
  	<div class="Show">
	  	<div class="DefaultShow">
		    <table class="UIFormGrid">
					<%for(inputInfo in uicomponent.getInputInfo())  {%>
							<tr>
							  <td class="FieldLabel"><label for="<%=inputInfo.getId()%>"><%=inputInfo.getLabel()%></label></td>
							  <%
							    UIFormInput uiInput =  inputInfo.getInput();
							  %>
							  <td class="FieldComponent"><% uicomponent.renderField(uiInput); %>
							  <%
							    if (uiInput.getName().equals("delegator")) {
							   %>
							   <img onclick="<%=uicomponent.event("SelectUser")%>" title = "<%= _ctx.appRes("UITask.title.Delegate")%>" src="/eXoResources/skin/sharedImages/Blank.gif" alt="<%= _ctx.appRes("UITask.title.Delegate")%>" class="SelectUserIcon" />
							   <%
							    }
							  %>
							  </td>
							</tr>
					<%}%>
				</table>
			  <div class="UIAction"> 
							  <%
							  def buttons = uicomponent.getSubmitButtons() ;
					      if(buttons.isEmpty()) {
					        try {
					         label = resWorkflow.getString("submit");
					        } catch(Exception e) {
					          label = "submit";
					        } 
						      if(uicomponent.isStart()) writeAction(label, "StartProcess", null) ;
					        else writeAction(label, "EndOfState", null) ;
					      } else {
						      for(button in buttons) {
						        name = button.get("name") ;
						        submit = ".submit" ;
						        label = name + submit ;
						        try {
						          label = resWorkflow.getString(label) ;
						        } catch(Exception e) {
						          label= name;
						        }  
						        writeAction(label, "Transition", name) ;
						      }
						    }
						    try {
						          cancel = resWorkflow.getString("cancel");
						        } catch(Exception e) {
						          cancel = "cancel";
						        } 
						    cancel = resWorkflow.getString("cancel");
						    writeAction(cancel, "Cancel", null);
						    %>
			  </div>
		  </div>
		  <%
		  	def hideProcess = _ctx.appRes("UITask.label.hide-process-link");
		  	def showProcess = _ctx.appRes("UITask.label.show-process-link");
		  %>
		  <div onclick="(function(ele) {
		  										var parent = ele.parentNode;
			  								 	if(parent.className == 'Show') {
			  								 		parent.className = 'Hide';
			  								 		ele.innerHTML = '$hideProcess';
			  								 	} else {
			  								 		parent.className = 'Show'; 
			  								 		ele.innerHTML = '$showProcess';								 	
			  								 	}
		  							})(this);" style="cursor: pointer; text-align: center; height: 23px; margin: 3px;font-weight:bold;text-decoration:underline;" >
		  	$showProcess
		  </div>			
		    <div class="DefaultHide ActionContainer">
		    <%if(uicomponent.getStateImageURL() != "") {%>					  		
			  	<img src="$uicomponent.stateImageURL" alt="<%=_ctx.appRes("UITask.title.state-image")%>" />
			  <%} else { %>
			    <div style="text-align:center; font-style:italic">
            <%=_ctx.appRes("UITask.label.process-diagram-not-available")%> 
          </div>
			  <%}%>
				</div>			
		</div>
  </div>
  <%uiform.end()%>
</div>
<style type="text/css">
	.HorizontalLayout .DefaultHide, .DefaultShow {
		display: none;
	}
	.Hide .DefaultHide {
		display: block;
	}
	.Show .DefaultShow {
		display: block;
	}
</style>
