<% 
	import org.exoplatform.faq.webui.FAQUtils;
	import org.exoplatform.web.application.JavascriptManager;
	def rcontext = _ctx.getRequestContext() ;
	JavascriptManager jsmanager = rcontext.getJavascriptManager();
	jsmanager.addJavascript('eXo.faq.UIAnswersPortlet.setSelectboxOnchange("'+ uicomponent.id +'");');
%>
<div class="UIResponse $uicomponent.id">
	<% uiform.begin() %>
		<div class="HorizontalLayout" style="*width:93%;">
			<div class="UIFormInput">
				<table class="UIFormGrid" style="width:100%">
					<tbody>
						<tr>
							<td class="FieldLabel" style="white-space:nowrap; width:15%">
								<%=_ctx.appRes("UIResponseForm.label.QuestionTitle")%> :
							</td>
							<td class="FieldComponent" style="width:85%; white-space:normal;"><%=uicomponent.render(uicomponent.questionContent)%></td>
						</tr>
						
						<tr>
							<td class="FieldLabel" style="white-space:nowrap; width:15%">
								<%=_ctx.appRes("UIResponseForm.label.QuestionContent")%> :
							</td>
							<td class="FieldComponent" style="width:85%; white-space:normal;"><%=uicomponent.render(uicomponent.questionDetail)%></td>
						</tr>
					<% 
					for(field in uiform.getChildren()) { 
						if(field.isRendered()) {
					%>
						<tr>
							<%fieldName = uicomponent.getLabel(field.getName());
								if(!fieldName.equals(uicomponent.getId())) { %>												
								<td class="FieldLabel" style="white-space:nowrap; width:15%">
									<label for="<%=field.getId()%>"><%=uicomponent.getLabel(field.getName()) %> :</label>
								</td>
								<td class="FieldComponent" style="width:85%">
									<%if(field.getName().equals("QuestionRelation")){ 
											String link = uicomponent.event("AddRelation") ;
									%>
											<div style="float:left" style="border:1px solid red;">
												<% uiform.renderField(field) %>
											</div>
											<div onclick="$link" style="float:left; cursor:pointer; border:1px solid red;"><div class="Icon AddRelation"><span></span></div></div>
									<%}else if(field.getName().equals("QuestionContent") || field.getName().equals("QuestionTitle")){
											String questionDetail = uicomponent.getValue(field.getName()) ;
											questionDetail = uicomponent.render(questionDetail);
										%>
											<div style="float:left; width:100%">
												<div class="ViewQuestionNotApproved" style="white-space:normal; float:left;">
													<span>$questionDetail</span>
												</div>
											</div>
									<%} else {%>
											<% uiform.renderField(field) %><br/>
									<%}%>
								</td>
							<%} else {%>
								<td class="FieldComponent" colspan="2"><% uiform.renderField(field) %></td>
							<%}%>
						</tr>
					<%}
					}
					if(uicomponent.isModerator) {
					%>
						<tr>
							<td style="text-align:right"><%=_ctx.appRes("UIResponseForm.label.Relation")%>  :&nbsp;</td>
							<td>
								<div class="ItemIcon AddIcon" onclick="<%=uicomponent.event("AddRelation")%>" style="margin-left:10px;" title="<%=_ctx.appRes("UIResponseForm.action.AddRelation")%>"><span></span></div><br/>
								<div style="width:100%; margin-top:10px;">
									<%
									int i = 0 ;
									String viewString = "" ;
									for(String questionContent in uicomponent.getListRelationQuestion()) {
										String action = uicomponent.event("RemoveRelation",uicomponent.getListIdQuesRela().get(i ++)) ;
										viewString = questionContent.replaceAll("<p>","").replaceAll("</p>","").replaceAll("<br/>","") ;
										if(viewString.length() > 85) {
						          viewString = FAQUtils.getSubString(viewString, 85) ;
						        }
									%>
										<div style="margin:0px 0px 3px 2px;">
											<div class="ItemIcon DustBinIcon" onclick="$action" style="margin-left:5px; float:left; cursor:pointer;" title="<%=_ctx.appRes("UIResponseForm.label.Remove")%>"><span></span></div>
											&nbsp;$viewString  &nbsp;&nbsp;&nbsp;&nbsp;
										</div>
								<%}%>
								</div>
							</td>
						</tr>
					<%} %>
					</tbody>
				</table>
			</div>
			
			<div class="UIAction">
      <% for(action in uicomponent.getActions()) { 
		        	 String actionLabel = _ctx.appRes("UIResponseForm.action." + action); 
		           String link = uicomponent.event(action) ;
		        %>
      <a href="javascript:void(0);" onclick="$link" class="ActionButton LightBlueStyle">$actionLabel</a>
      <%}%>
    </div>
		</div>
	<%uiform.end()%>
</div>


