<%
  import javax.jcr.Node;
  import org.exoplatform.web.application.Parameter;

  def rcontext = _ctx.getRequestContext() ;
  def String htmlWYSIWYGFormId = "htmlData" + uicomponent.hashCode();
  def String cssFormId = "ContentCSS[" + uicomponent.hashCode() + "]";
  def String jsFormId = "ContentJS[" + uicomponent.hashCode() + "]";
  def jsManager = rcontext.getJavascriptManager();
  jsManager.addOnLoadJavascript("eXo.ecm.CKEditor.insertCSS('" + htmlWYSIWYGFormId + "', '" + cssFormId + "')");
  private String getDisplayTab(String selectedTab) {
    if ((uicomponent.getSelectedTab() == null && selectedTab.equals("mainWebcontent"))
        || selectedTab.equals(uicomponent.getSelectedTab())) {
      return "display:block";
    }
    return "display:none";
  }

  private String getSelectedTab(String selectedTab) {
    if (getDisplayTab(selectedTab).equals("display:block")) {
      return "SelectedTab";
    }
    return "NormalTab";
  }

  Node webContentNode = uicomponent.getNode();
%>
<style>
  .UIForm .HorizontalLayout .textarea {
    font-size:11px;
    height:275px;
    width:525px;
   }

   .UIForm .HorizontalLayout .FieldComponent {
     width: 750px;
   }

</style>
<div class="UITabPane">
<%uiform.begin()%>
  <div class="TabPaneContent" style="padding:0px">
    <div class="WorkingAreaWithHelp">
<%/* start render action*/%>
      <% if (uiform.isShowActionsOnTop()) {
                uiform.processRenderAction()
             }
      %>

      <%/* end render action*/%>
      <div class="UIHorizontalTabs" style="margin-top:5px;">
        <div class="LeftHorizontalTabs">
          <div class="RightHorizontalTabs">
            <div class="CenterHorizontalTabs">
              <div class="TabsContainer">
                <div class="UITab NormalTabStyle">
                  <div class="<%= getSelectedTab("mainWebcontent")%>">
                    <div class="LeftTab">
                      <div class="RightTab">
                        <div class="MiddleTab" onClick="<%=uicomponent.event("ChangeTab", "mainWebcontent")%>"><%=_ctx.appRes("WebContent.dialog.label.MainContent")%></div>
                      </div>
                    </div>
                  </div>
                </div>
              </div> <!-- End of TabsContainer-->
            </div>  <!-- End of CenterHorizontalTabs -->
          </div>
        </div>
      </div> <!-- End of UIHorizontalTabs -->
      <%/*Start UITabContentContainer*/%>
        <div class="HorizontalLayout" style="border: none; margin:0px; background: none; padding: 0px; overflow:auto;">
          <div class="UITabContentContainer">
            <div class="UITabContent" style="<%=getDisplayTab("mainWebcontent")%>">
              <table class="UIFormGrid">

                <tr>
                    <td class="FieldLabel"><%=_ctx.appRes("WebContent.dialog.label.name")%></td>
                    <td class="FieldComponent">
                      <%
                        String[] webContentFieldName = ["jcrPath=/node", "nodetype=exo:announcement", "mixintype=mix:votable,mix:commentable,mix:i18n", "editable=if-null","validate=name,empty"] ;
                        uicomponent.addTextField("name", webContentFieldName) ;
                        String[] cssFolder = ["jcrPath=/node/css", "nodetype=exo:cssFolder", "defaultValues=css"] ;
                        String[] jsFolder = ["jcrPath=/node/js", "nodetype=exo:jsFolder", "defaultValues=js"] ;
                        String[] documentsFolder = ["jcrPath=/node/documents", "nodetype=nt:unstructured","mixintype=exo:documentFolder","defaultValues=documents"] ;
                        String[] mediasFolder = ["jcrPath=/node/medias", "nodetype=exo:multimediaFolder", "defaultValues=medias"] ;
                        String[] imagesFolder = ["jcrPath=/node/medias/images", "nodetype=nt:folder", "defaultValues=images"] ;
                        String[] videoFolder = ["jcrPath=/node/medias/videos", "nodetype=nt:folder", "defaultValues=videos"] ;
                        String[] audioFolder = ["jcrPath=/node/medias/videos", "nodetype=nt:folder", "defaultValues=audio"] ;
                        uicomponent.addHiddenField("cssFolder", cssFolder) ;
                        uicomponent.addHiddenField("jsFolder", jsFolder);
                        uicomponent.addHiddenField("documentsFolder", documentsFolder);
                        uicomponent.addHiddenField("mediasFolder", mediasFolder);
                        uicomponent.addHiddenField("imagesFolder", imagesFolder);
                        uicomponent.addHiddenField("videoFolder", videoFolder);
                        uicomponent.addHiddenField("audioFolder", audioFolder);
                      %>

                    </td>
                </tr>
                <tr>
                  <td class="FieldLabel"><%=_ctx.appRes("WebContent.dialog.label.Summary")%></td>
                  <td class="FieldComponent">
                    <%
                      String summaryContent = "";
                      if (webContentNode != null && webContentNode.hasProperty("exo:summary")) {
                        summaryContent = webContentNode.getProperty("exo:summary").getValue().getString();
                      }
                      String[] fieldSummary = ["jcrPath=/node/exo:summary", "editable=if-null", summaryContent] ;
                      uicomponent.addRichtextField("exo:summary", fieldSummary) ;
                    %>
                  </td>
                </tr>

              </table>
            </div>  <!-- End of UITabContent -->

            <div class="UITabContent" style="<%=getDisplayTab("contentCSSWebcontent")%>">
              <table class="UIFormGrid">
                <tr>
                  <td class="FieldLabel"><%=_ctx.appRes("WebContent.dialog.label.ContentCSS")%></td>
                  <td class="FieldComponent" style="width:520px">
                    <%
                      String[] cssHiddenField1 = ["jcrPath=/node/css/default.css", "nodetype=nt:file", "defaultValues=default.css"] ;
                      String[] cssHiddenField2 = ["jcrPath=/node/css/default.css/jcr:content", "nodetype=nt:resource", "mixintype=dc:elementSet", "visible=false"] ;
                      String[] cssHiddenField3 = ["jcrPath=/node/css/default.css/jcr:content/jcr:encoding", "visible=false", "UTF-8"] ;
                      String[] cssHiddenField4 = ["jcrPath=/node/css/default.css/jcr:content/jcr:lastModified", "visible=false"] ;
                      String[] cssHiddenField5 = ["jcrPath=/node/css/default.css/jcr:content/dc:date", "visible=false"] ;
                      String[] cssHiddenField6 = ["jcrPath=/node/css/default.css/jcr:content/jcr:mimeType", "visible=false", "text/css"] ;
                      uicomponent.addHiddenField("cssHiddenField1", cssHiddenField1) ;
                      uicomponent.addHiddenField("cssHiddenField2", cssHiddenField2) ;
                      uicomponent.addHiddenField("cssHiddenField3", cssHiddenField3) ;
                      uicomponent.addCalendarField("cssHiddenField4", cssHiddenField4) ;
                      uicomponent.addCalendarField("cssHiddenField5", cssHiddenField5) ;
                      uicomponent.addHiddenField("cssHiddenField6", cssHiddenField6) ;
                      String cssContent = "";
                      if(webContentNode != null && webContentNode.hasNode("css/default.css")) {
                        Node cssNode = webContentNode.getNode("css/default.css");
                        cssContent = cssNode.getNode("jcr:content").getProperty("jcr:data").getValue().getString();
                      }
                      String[] fieldContentCSS = ["jcrPath=/node/css/default.css/jcr:content/jcr:data", "options=noSanitization", cssContent] ;
                      uicomponent.addTextAreaField(cssFormId, fieldContentCSS) ;
                    %>
                  </td>
                  <td width="260px">
                    <div class="FormHint" style="margin-top:5px"><%=_ctx.appRes("WebContent.dialog.label.hintCSS")%></div>
                  </td>
                </tr>
              </table>
              <table class="UIFormGrid">
                <tr>
                  <td class="FieldLabel"><%=_ctx.appRes("WebContent.dialog.label.ContentJS")%></td>
                  <td class="FieldComponent" style="width:520px">
                    <%
                      String[] jsHiddenField1 = ["jcrPath=/node/js/default.js", "nodetype=nt:file", "defaultValues=default.js"];
                      String[] jsHiddenField2 = ["jcrPath=/node/js/default.js/jcr:content", "nodetype=nt:resource", "mixintype=dc:elementSet", "visible=false"];
                      String[] jsHiddenField3 = ["jcrPath=/node/js/default.js/jcr:content/jcr:encoding", "visible=false", "UTF-8"];
                      String[] jsHiddenField4 = ["jcrPath=/node/js/default.js/jcr:content/jcr:lastModified", "visible=false"];
                      String[] jsHiddenField5 = ["jcrPath=/node/js/default.js/jcr:content/dc:date", "visible=false"];
                      String[] jsHiddenField6 = ["jcrPath=/node/js/default.js/jcr:content/jcr:mimeType", "visible=false", "application/x-javascript"];
                      uicomponent.addHiddenField("jsHiddenField1", jsHiddenField1);
                      uicomponent.addHiddenField("jsHiddenField2", jsHiddenField2);
                      uicomponent.addHiddenField("jsHiddenField3", jsHiddenField3);
                      uicomponent.addCalendarField("jsHiddenField4", jsHiddenField4);
                      uicomponent.addCalendarField("jsHiddenField5", jsHiddenField5);
                      uicomponent.addHiddenField("jsHiddenField6", jsHiddenField6);
                      String jsContent = "";
                      if(webContentNode != null && webContentNode.hasNode("js/default.js")) {
                        Node jsNode = webContentNode.getNode("js/default.js");
                        jsContent = jsNode.getNode("jcr:content").getProperty("jcr:data").getValue().getString();
                      }
                      String[] fieldContentJS = ["jcrPath=/node/js/default.js/jcr:content/jcr:data", "options=noSanitization", jsContent];
                      uicomponent.addTextAreaField(jsFormId, fieldContentJS);
                    %>
                  </td>
                  <td width="260px">
                    <div class="FormHint" style="margin-top:5px"><%=_ctx.appRes("WebContent.dialog.label.hintJS")%></div>
                  </td>
                </tr>
              </table>
            </div>
          </div>   <!-- End of UITabContentContainer -->
 <% if (!uiform.isShowActionsOnTop()) {
                     uiform.processRenderAction()
              }
            %>
        </div>
    </div>   <!-- End of WorkingAreaWithHelp -->
  </div>  <!-- End of TabPaneContent -->
  <%uiform.end()%>
</div>  <!-- End of UITabPane -->