<%
  import org.exoplatform.wcm.webui.Utils;
  
  def rcontext = _ctx.getRequestContext();
  String portletId = Utils.getRealPortletId(rcontext);  
%>
<div class="UIForm $uicomponent.id" >
   <%
    uiform.begin()
      %>
          <div class="FormContainer">
            <fieldset class="fieldsetPreferences" >
              <legend class="StyleLegend"><%= _ctx.appRes("UISCVPreferences.label.ContentPathBlock") %></legend>
              <table class="UIFormGrid" >    
                <tr>                  
                  <td class="FieldLabel"><label for="<%=uicomponent.ITEM_PATH_FORM_INPUT_SET%>"><%=uicomponent.getLabel(uicomponent.ITEM_PATH_FORM_INPUT_SET) %></label></td>
                  <td class="FieldComponent" <% if (uicomponent.getSelectedNodePath() != null) { %> title="<%=uicomponent.getSelectedNodePath()%>" <% }%> ><% uiform.renderField(uicomponent.ITEM_PATH_FORM_INPUT_SET) %></td>
                  <td class ="tdShowHelp">
                    <div class="IconInContextHelp ShowHelpIcon" id="ContentPathHelp" 
                    onmouseover="eXo.ecm.WCMUtils.showInContextHelp('ContentPathHelp', 'true')" onmouseout="eXo.ecm.WCMUtils.showInContextHelp('ContentPathHelp', 'false')"
                    onfocus="eXo.ecm.WCMUtils.showInContextHelp('ContentPathHelp', 'true')" onblur="eXo.ecm.WCMUtils.showInContextHelp('ContentPathHelp', 'false')">
                      <div style="position: relative;">
	                        <div class="InContextHelpContent" >                    
	                          <div class="InContextHelpPopup">
	                         	 <div id="ContentPathHelpID" class="LeftInContextHelpPopup"><%= _ctx.appRes("UISCVPreferences.help.ContentPathBlock") %>
	                            </div>
	                          </div>                      
	                        </div>
	                    </div>
                    </div>
                  </td>
                </tr>
              </table>
            </fieldset>  
          </div>
          
          <div class="FormContainer">
          <fieldset class="fieldsetPreferences" >
              <legend class="StyleLegend"><%= _ctx.appRes("UISCVPreferences.label.DisplaySettingBlock") %></legend>
              <table class="UIFormGrid">
                <tr>                  
                  <td class="FieldComponent AlignRight" ><% uiform.renderField(uicomponent.SHOW_TITLE_CHECK_BOX) %></td>
                  <td><%=uicomponent.getLabel(uicomponent.SHOW_TITLE_CHECK_BOX) %></td>                  
                  
                  <td class="FieldComponent AlignRight" ><% uiform.renderField(uicomponent.SHOW_DATE_CHECK_BOX) %></td>
                  <td><%=uicomponent.getLabel(uicomponent.SHOW_DATE_CHECK_BOX) %></td>                  
                  
                  <td  class="FieldComponent AlignRight" ><% uiform.renderField(uicomponent.SHOW_OPION_BAR_CHECK_BOX) %></td>
                  <td><%=uicomponent.getLabel(uicomponent.SHOW_OPION_BAR_CHECK_BOX) %></td>
                  <td class ="tdShowHelp">
                    <div class="IconInContextHelp ShowHelpIcon" id="ShowOptionHelp" 
                    onmouseover="eXo.ecm.WCMUtils.showInContextHelp('ShowOptionHelp', 'true')" onmouseout="eXo.ecm.WCMUtils.showInContextHelp('ShowOptionHelp', 'false')"
                    onfocus="eXo.ecm.WCMUtils.showInContextHelp('ShowOptionHelp', 'true')" onblur="eXo.ecm.WCMUtils.showInContextHelp('ShowOptionHelp', 'false')">
						<div style="position: relative;">
							<div class="InContextHelpContent" >                    
							  <div class="InContextHelpPopup">
								<div id="ShowOptionHelpID" class="LeftInContextHelpPopup"><%= _ctx.appRes("UISCVPreferences.help.DisplaySettingBlock") %> 
								</div>
							  </div>                      
							</div>
						</div>
                     </div>
                  </td>
                </tr>                
              </table>
            </fieldset>             
          </div>
          
          <div class="FormContainer">
          <fieldset class="fieldsetPreferences" >
              <legend class="StyleLegend"><%= _ctx.appRes("UISCVPreferences.label.PrintSettingBlock") %></legend>
              <table class="UIFormGrid">
                <tr>                  
                  <td class="FieldLabel"><label for="<%=uicomponent.PRINT_PAGE_FORM_INPUT_SET%>"><%=uicomponent.getLabel(uicomponent.PRINT_PAGE_FORM_INPUT_SET) %></label></td>
                  <td class="FieldComponent" ><% uiform.renderField(uicomponent.PRINT_PAGE_FORM_INPUT_SET) %></td>          
                </tr>
                <tr>                  
                <td class="FieldLabel"><label for="<%=uicomponent.PRINT_PAGE_PARAMETER_INPUT%>"><%=uicomponent.getLabel(uicomponent.PRINT_PAGE_PARAMETER_INPUT) %></label></td>
                <td class="FieldComponent"><% uiform.renderField(uicomponent.PRINT_PAGE_PARAMETER_INPUT) %></td>              
              </tr>
              </table>
            </fieldset>             
          </div>
          
          <a href="#" id="UISCVShowAdvanceOption" class="AdvancePreferences" style="margin:10px" onClick="document.getElementById('UISCVShowAdvanceOption').style.display='none';document.getElementById('UISCVContextualSelectionAdvance').style.display='block';">
             <%= _ctx.appRes("UISCVPreferences.label.Advance") %></a>
             
          <div class="FormContainer" id="UISCVContextualSelectionAdvance">
          <fieldset class="fieldsetPreferences" >
            <legend class="StyleLegend">
              <a href="#" class="AdvancePreferences" onClick="document.getElementById('UISCVContextualSelectionAdvance').style.display='none';document.getElementById('UISCVShowAdvanceOption').style.display='block';"><%=_ctx.appRes("UISCVPreferences.label.Advance")%></a>
             </legend>
              <div><%=_ctx.appRes("UISCVPreferences.label.ContextCaption") %></div>
              <table class="UIFormGrid" >
                <tr>
                  <td class="FieldComponent AlignRight" ><%=uicomponent.getLabel(uicomponent.CONTEXTUAL_SELECT_RADIO_BOX) %></td>
                  <td>
                    <div onclick="contextualProcessing(this);" id="ContexttualContainer$portletId">
                      <%uiform.renderField(uicomponent.CONTEXTUAL_SELECT_RADIO_BOX) %>                      
                    </div>
                  </td>
                  <td class ="tdShowHelp">
	                  <div class="IconInContextHelp ShowHelpIcon" id="ContextualHelp" 
	                  onmouseover="eXo.ecm.WCMUtils.showInContextHelp('ContextualHelp', 'true')" onmouseout="eXo.ecm.WCMUtils.showInContextHelp('ContextualHelp', 'false')"
	                  onfocus="eXo.ecm.WCMUtils.showInContextHelp('ContextualHelp', 'true')" onblur="eXo.ecm.WCMUtils.showInContextHelp('ContextualHelp', 'false')">
						<div style="position: relative;">
	                      <div class="InContextHelpContent" >                    
	                        <div class="InContextHelpPopup">
	                          <div id="ContextualHelpID" class="LeftInContextHelpPopup"><%= _ctx.appRes("UISCVPreferences.help.ContextualHelp") %>
	                          </div>
	                        </div>                      
	                      </div>
					  </div>
                  </div>
                </td>
                </tr>
                <tr>                  
                  <td class="FieldLabel"><label for="<%=uicomponent.PARAMETER_INPUT_BOX%>"><%=uicomponent.getLabel(uicomponent.PARAMETER_INPUT_BOX) %></label></td>
                  <td class="FieldComponent" ><%uiform.renderField(uicomponent.PARAMETER_INPUT_BOX) %></td>
                  <td class ="tdShowHelp">
	                  <div class="IconInContextHelp ShowHelpIcon" id="ParameterHelp" 
	                  onmouseover="eXo.ecm.WCMUtils.showInContextHelp('ParameterHelp', 'true')" onmouseout="eXo.ecm.WCMUtils.showInContextHelp('ParameterHelp', 'false')"
	                  onfocus="eXo.ecm.WCMUtils.showInContextHelp('ParameterHelp', 'true')" onblur="eXo.ecm.WCMUtils.showInContextHelp('ParameterHelp', 'false')">
						<div style="position: relative;">
	                      <div class="InContextHelpContent" >                    
	                        <div class="InContextHelpPopup">
	                          <div id="ParameterHelpID" class="LeftInContextHelpPopup"><%= _ctx.appRes("UISCVPreferences.help.ParameterHelp") %>
	                          </div>
	                        </div>                      
	                      </div>
					  </div>
                   </div>
                </td>
                </tr>                
              </table>
              <div><%=_ctx.appRes("UISCVPreferences.label.CacheManagement") %></div>
              <table class="UIFormGrid" width="100%">
                <tr>                  
                  <td class="FieldLabel" style="text-align:left;vertical-align:middle;">
                    <%uiform.renderField(uicomponent.CACHE_ENABLE_SELECT_RADIO_BOX) %>                      
                  </td>
                </tr>
              </table>
            </fieldset>  
          </div>
          <script type="text/javascript">
            function contextualProcessing(element) {
              var rdoContexttual = eXo.core.DOMUtil.findFirstDescendantByClass(element, "input", "radio");
              var isChecked = rdoContexttual.getAttribute("checked");
              var scvPreferences = eXo.core.DOMUtil.findAncestorByClass(element, "UIForm");
              var inputSet = eXo.core.DOMUtil.findFirstDescendantByClass(scvPreferences, "div", "UIFormInputSetWithAction");
              var savedInnerHTML = inputSet.innerHTML;
              var imgStartIndex = savedInnerHTML.indexOf("<img");
              var strFirstInput  = savedInnerHTML.substr(0,imgStartIndex);
              var strLastImgInput = savedInnerHTML.substr(imgStartIndex);
              strFirstInput = strFirstInput.substr(0, strFirstInput.lastIndexOf(">") + 1);
              strFirstInput = strFirstInput.trim();
              if (rdoContexttual.checked) {
                document.getElementById('UISCVPreferences').UISCVParameterInputBox.removeAttribute('readonly');
                document.getElementById('UISCVPreferences').UISCVParameterInputBox.removeAttribute('disabled');
                inputSet.innerHTML =  strFirstInput + strLastImgInput;
              }else  {
                document.getElementById('UISCVParameterInputBox').setAttribute('readonly',true);
                document.getElementById('UISCVParameterInputBox').setAttribute('disabled',true);
                inputSet.innerHTML =  strFirstInput + "*"  + strLastImgInput;
              }
            }
            if (document.getElementById('<%=uicomponent.id%>').<%=uicomponent.CONTEXTUAL_SELECT_RADIO_BOX%>[0].checked) {
              document.getElementById('<%=uicomponent.PARAMETER_INPUT_BOX%>').removeAttribute('readonly');
              document.getElementById('<%=uicomponent.PARAMETER_INPUT_BOX%>').removeAttribute('disabled');
              document.getElementById('UISCVShowAdvanceOption').style.display='none';
            }else {
              document.getElementById('<%=uicomponent.PARAMETER_INPUT_BOX%>').setAttribute('readonly',true);
              document.getElementById('<%=uicomponent.PARAMETER_INPUT_BOX%>').setAttribute('disabled',true);
              document.getElementById('UISCVContextualSelectionAdvance').style.display='none';
            }
            contextualProcessing(document.getElementById('ContexttualContainer$portletId'));
          </script>
        <div class="UIAction"> 
				  <% for(action in uicomponent.getActions()) { 
					   String actionLabel = _ctx.appRes(uicomponent.getName() + ".action." + action) ;
					   String link = uicomponent.event(action) ;
				  %>
						  <a  onclick="$link" class="ActionButton LightBlueStyle" href="javascript:void(0);">$actionLabel</a>
				 <%}%>        
				</div>
      <%
    uiform.end()
  %>
</div>
