<%
 import java.util.Calendar;
 import java.text.SimpleDateFormat;
 import org.exoplatform.ecm.utils.text.Text;
 private String getTimestampName() {
  Calendar now = Calendar.getInstance();
  SimpleDateFormat formatter = new SimpleDateFormat("yyyy.MM.dd '-' hh'h'mm'm'ss");
  return formatter.format(now.getTime());
 }
 String timestampName = Text.convertJcrChars(getTimestampName());
 def name = _ctx.appRes("Contact.dialog.label.Name");
 def email = _ctx.appRes("Contact.dialog.label.Email");
 def phone = _ctx.appRes("Contact.dialog.label.Phone");
 def message = _ctx.appRes("Contact.dialog.label.Message");
 def isFCCPortlet = false;
 def box_style = "";
 if(uiform.getParent().getId().equals("UIFCCPortlet")) {
 	isFCCPortlet = true;
 	box_style = "box-module";
 }

%>
<div class="uiForm FormLayout FormScrollLayout $box_style">
 <% if(isFCCPortlet) { %>
    <h3 class="module-heading">
      <%=_ctx.appRes("Contact.dialog.label.ContactForm")%>
    </h3>
 <% } %>

<% uiform.begin() %>
  <%/* start render action*/%>
  <% if (uiform.isShowActionsOnTop()) {
            uiform.processRenderAction()
          }
  %>
  <%/* end render action*/%>
    <div class="form-inline agital-contact-form $box_style">
      <div class="control-group" style="display:none;">
        <label class="control-label"><%=_ctx.appRes("FormGenerator.dialog.label.Date")%></label>
        <div class="controls">
          $timestampName
          <div style="display:none;">
            <%
             String[] fieldName = ["jcrPath=/node", "mixintype=mix:i18n", "editable=if-null", "validate=empty", timestampName] ;
             uicomponent.addTextField("name", fieldName) ;
            %>
          </div>
        </div>
      </div>
      <div class="row-fluid">

        <div class="span4">
          <div class="control-group">
             <div class="controls">
               <%
                String[] your_nameFieldName = ["jcrPath=/node/exo:userName", "defaultValues=", "validate=empty,name",""];
                uicomponent.addTextField("fullName", your_nameFieldName);
               %>
             </div>
          </div>
        </div>
        <div class="span4">
          <div class="control-group">
             <div class="controls">
               <%
                String[] your_email_addressFieldName = ["jcrPath=/node/exo:userEmail", "defaultValues=", "validate=empty,email",""];
                uicomponent.addTextField("email", your_email_addressFieldName);
               %>
             </div>
          </div>
        </div>
        <div class="span4">
          <div class="control-group">
             <div class="controls">
               <%
                String[] your_phone_numberFieldName = ["jcrPath=/node/exo:userPhone", "defaultValues=",""];
                uicomponent.addTextField("phone", your_phone_numberFieldName);
               %>
             </div>
          </div>
        </div>
      </div>
      <div class="control-group">
        <div class="controls">
          <%
             String[] your_messageFieldName = ["jcrPath=/node/exo:userMessage", "defaultValues=", "validate=empty",""];
             uicomponent.addTextAreaField("messages", your_messageFieldName);
          %>
        </div>
      </div>
    </div>

  <% if (!uiform.isShowActionsOnTop()) { %>
  <div class="contact-btn-group">
  <button type="button" href="javascript:void(0);" onclick="clearForm()" class="btn btn-primary">Clear</button>
    <%
     for(action in uicomponent.getActions()) {
      String actionLabel = _ctx.appRes(uicomponent.getName() + ".action." + action);
      String link = uicomponent.event(action);                  %>
            <button type="button" href="javascript:void(0);" onclick="$link" class="btn">$actionLabel</button>
     <% }  %>
  </div>
  <% } %>
<% uiform.end() %>
</div>

<script type="text/javascript">
  document.getElementById("fullName").setAttribute("placeholder", "$name");
  document.getElementById("email").setAttribute("placeholder", "Email");
  document.getElementById("phone").setAttribute("placeholder", "$phone");
  document.getElementById("messages").setAttribute("placeholder", "$message");
  function clearForm(){
    document.getElementById("fullName").value='';
    document.getElementById("email").value='';
    document.getElementById("phone").value='';
    document.getElementById("messages").value='';
  }
</script>
