<%
	import java.util.Map;
	import java.util.HashMap;
	import org.exoplatform.faq.service.Question;
	import org.exoplatform.faq.webui.UIAnswersPageIterator ; 
	import org.exoplatform.webui.form.UIFormInputWithActions;
	import org.exoplatform.faq.webui.FAQUtils;	
%>

<div class="FAQUIQuestionInfo $uicomponent.id">
	<% uiform.begin() 
	Map<String, String> mapPath = new HashMap<String, String>();
	%>
  <div class="UIFormTabPane">
    <div class="UITabPane">
      <div class="TabPaneContent">
					<div class="WorkingArea">
						
	          <div class="UIHorizontalTabs">
	     				<div class="LeftHorizontalTabs">
	           		<div class="RightHorizontalTabs">
	             		<div class="CenterHorizontalTabs">
	              		<div class="TabsContainer">
	                  	<%int i = 0 ; 
	                  		String classCss = "SelectedTab";
	                  		String classLastCss = "NormalTab" ;
	                  		String displayEdit = "block" ;
	                  		String displayResponse = "none" ;
	                  		if(uicomponent.getIsEdit()) {
	                  			classCss = "SelectedTab";
	                  			classLastCss = "NormalTab" ;
	                  			displayEdit = "block" ;
	                  			displayResponse = "none" ;
	                  		} else if(uicomponent.getIsResponse()) {
	                  			classCss = "NormalTab";
	                  			classLastCss = "SelectedTab" ;
	                  			displayEdit = "none" ;
	                  			displayResponse = "block" ;
	                  		}
		                  	for(tabcontent in uicomponent.getTab()){ 
	                  			String link = "" ;
		                  	%>  
			                    <div class="UITab NormalTabStyle">
			                      <div class="$classCss">
			                        <div class="LeftTab">
			                          <div class="RightTab" onclick="eXo.webui.UIHorizontalTabs.displayTabContent(this)">
		                          	<%if(i ++ == 0) {
		                          			link = uicomponent.event("ChangeTab", "0") ;
		                          	%>
		                          		<div onclick="$link">
				                            <div class="MiddleTab">
				                            	 <%=_ctx.appRes("UIQuestionsInfo.label.TabQuestionManagement")%> 
				                            </div>
			                            </div>
		                            <%} else {
		                            		link = uicomponent.event("ChangeTab", "1") ;
		                            %>
		                            	<div onclick="$link">
			                            	<div class="MiddleTab">
			                            		<%=_ctx.appRes("UIQuestionsInfo.label.TabQuestionNotYetAnswered")%>
				                            </div>
			                            </div>
		                            <%}%>
			                          </div>
			                        </div>
			                      </div>
			                    </div>
		                		<%classCss = classLastCss ;  
		                		} %>
		                  </div>
		                </div>
	              	</div>
	            	</div>
	          	</div>
						
						<div class="UIForm">
            	<div class="HorizontalLayout">
            
              	<div class="UITabContentContainer">
	              	<!-- ================================================== All questions ====================================== -->
	              	<div class="UITabContent UIIETabContent" style="display:$displayEdit;" id="UITabContent"> 
					          <div style="display:block;">

											<div class="HorizontalLayout">
													<div class="UIFormInput">
														<table class="UIGrid">
															<tr>
																<th><strong><%=_ctx.appRes("UIQuestionsInfo.label.Question")%></strong></th>
																<th><strong><%=_ctx.appRes("UIUserWatchManager.label.pathCategory");%></strong></th>
																<th style="width:100px"><strong><%=_ctx.appRes("UIQuestionsInfo.label.QuestionIsApproved")%></strong></th>
																<th style="width:100px"><strong><%=_ctx.appRes("UIQuestionsInfo.label.QuestionIsActivated")%></strong></th>
																<th style="width:60px"><strong><%=_ctx.appRes("UIQuestionsInfo.label.Action")%></strong></th>
															</tr>
															<%
															List questionList = uicomponent.getListQuestion() ;
															if(!questionList.isEmpty()) {
																String linkDelete = "" ;
																String linkEdit = "" ;
																String actionChangeStatus = "";
																for(Question question in questionList) {
																	linkDelete = uicomponent.event("DeleteQuestion", question.getPath()) ;
																	linkEdit = uicomponent.event("EditQuestion", question.getPath()) ;
																	actionChangeStatus = uicomponent.event("ChangeQuestionStatus", "approved" + "/" + question.getPath()) ;
																	if(!mapPath.containsKey(question.getCategoryId()))
																		mapPath.put(question.getCategoryId(), uicomponent.getCategoryPath(question.getPath()));
																%>
																	<tr>
																		<td class="text"><%=question.getQuestion().replaceFirst("<p>", "") ;%></td>
																		<td class="text"><%=mapPath.get(question.getCategoryId())%></td>
																		<td class="text" style="text-align:center;">
																		<%if(question.isApproved()) {%>
																				<div class="TrueIcon">
																					<div onclick="$actionChangeStatus" title="<%=_ctx.appRes("UIQuestionsInfo.title." + "UnApprove")%>" style="cursor:pointer;">
																						<%=_ctx.appRes("UIQuestionsInfo.label.IsApproved")%>
																					</div>
																				</div>
																		<%} else {%>
																				<div class="FalseIcon">
																					<div onclick="$actionChangeStatus" title="<%=_ctx.appRes("UIQuestionsInfo.title." + "Approve")%>" style="cursor:pointer;">
																						<%=_ctx.appRes("UIQuestionsInfo.label.IsNotApproved")%>
																					</dvi>
																				</div>
																		<%}%>
																		</td>
																		<td class="text" style="text-align:center;">
																		<%
																		actionChangeStatus = uicomponent.event("ChangeQuestionStatus", "activate" + "/" + question.getPath()) ;
																		if(question.isActivated()) {%>
																				<div class="TrueIcon">
																					<div onclick="$actionChangeStatus" title="<%=_ctx.appRes("UIQuestionsInfo.title." + "UnActivated")%>" style="cursor:pointer;">
																						<%=_ctx.appRes("UIQuestionsInfo.label.IsActivated")%>
																					</div>
																				</div>
																		<%} else {%>
																				<div class="FalseIcon">
																					<div onclick="$actionChangeStatus" title="<%=_ctx.appRes("UIQuestionsInfo.title." + "Activate")%>" style="cursor:pointer;">
																						<%=_ctx.appRes("UIQuestionsInfo.label.IsNotActivated")%>
																					</div>
																				</div>
																		<%}%>
																		</td>
																		<td style="text-align:center;">
																				<div onclick="$linkEdit" style="float:left; cursor:pointer;" title="<%=_ctx.appRes("UIQuestionsInfo.label.EditQuestion")%>">
																					<div class="ItemIcon Edit">
																							<div style="padding-left:20px;"><span></span></div>
																					</div>
																				</div>
																				
																				<div onclick="$linkDelete" style="float:left; cursor:pointer;" title="<%=_ctx.appRes("UIQuestionsInfo.label.DeleteQuestion")%>">
																					<div class="ItemIcon Delete">
																							<div style="padding-left:20px;"><span></span></div>
																					</div>
																				</div>
																		</td>
																	</tr>
															<%}
															} else {%>
																<tr>
																	<td colspan="4" style="text-align:center;">
																		<strong><%=_ctx.appRes("UIQuestionsInfo.label.ListQuestionIsEmpty")%></strong>
																	</td>
																</tr>
														<%}%>
														</table>
													</div>
												</div>
											
										<%
										long totalPages = uicomponent.getTotalpages("FAQUserPageIteratorTab1") ;
					          if(totalPages > 1) {
					          %>
											<div style="overflow:auto;">
												<% uicomponent.renderChild("FAQUserPageIteratorTab1") ; %>
											</div>
									<%}%>	
										</div>
	              	</div>
	              	<!-- end all question-->
	              	<!-- =================================================== Pending questions ====================================== -->
	              	<div class="UITabContent UIIETabContent" style="display:$displayResponse" id="UITabContent">
					          <div style="display:block;"  >
									
											<div class="HorizontalLayout">
													<div class="UIFormInput">
														<table class="UIGrid">
															<tr>
																<th><strong><%=_ctx.appRes("UIQuestionsInfo.label.Question")%></strong></th>
																<th><strong>Category</strong></th>
																<th>
																	<div style="padding-right:4px;">
																		<strong><%=_ctx.appRes("UIQuestionsInfo.label.Languages")%></strong>
																	</div>
																</th>
																<th style="width:60px"><strong><%=_ctx.appRes("UIQuestionsInfo.label.Action")%></strong></th>
															</tr>
															<%
															List questionNotAnswered = uicomponent.getListQuestionNotAnswered() ;
															if(!questionNotAnswered.isEmpty()) {
																String linkDelete = "" ;
																String linkEdit = "" ;
																for(Question question in questionNotAnswered) {
																	linkDelete = uicomponent.event("DeleteQuestion", question.getPath()) ;
																	linkResponse = uicomponent.event("ResponseQuestion", question.getPath()+"/"+question.getLanguage()) ;
																	if(!mapPath.containsKey(question.getCategoryId()))
																		mapPath.put(question.getCategoryId(), uicomponent.getCategoryPath(question.getPath()));
																%>
																	<tr>
																		<td class="text" style="text-align:left"><%=question.getQuestion().replaceFirst("<p>", "")%></td>
																		<td class="text"><%=mapPath.get(question.getCategoryId())%></td>
																		<td class="text" style="margin-right:4px;white-space:nowrap; text-align:left">
																		<%
																			String linkResponseByLanguage = "";
																			for(String language :question.getLanguagesNotYetAnswered().split(",")){
																				linkResponseByLanguage = uicomponent.event("ResponseQuestion", question.getPath() + "/" + language ) ;
																		%>
																			<div onclick="$linkResponseByLanguage" style="float:left; cursor:pointer" title="<%=_ctx.appRes("UIQuestionsInfo.label.ResponseQuestion")%>">
																				<div style="padding:0px 4px 4px 0px;">- &nbsp;$language</div>
																			</div>
																		<%}%>
																		</td>
																		<td style="text-align:center">
																			<div style="float:left">
																				<div onclick="$linkResponse" style="float:left; cursor:pointer" title="<%=_ctx.appRes("UIQuestionsInfo.label.ResponseQuestion")%>">
																					<div class="ItemIcon ResponseQuestion">
																						<div style="padding-left:20px;"><span></span></div>
																					</div>
																				</div>
																				
																				<div onclick="$linkDelete" style="float:left; cursor:pointer" title="<%=_ctx.appRes("UIQuestionsInfo.label.DeleteQuestion")%>">
																					<div class="ItemIcon Delete">
																							<div style="padding-left:20px;"><span></span></div>
																					</div>
																				</div>
																			</div>
																		</td>
																	</tr>
															<%}
															} else {%>
																<tr>
																	<td colspan="2" align="center">
																		<strong><%=_ctx.appRes("UIQuestionsInfo.label.ListQuestionIsEmpty")%></strong>
																	</td>
																</tr>
														<%}%>
														</table>
													</div>
												</div>
											
										<%
										totalPages = uicomponent.getTotalpages("FAQUserPageIteratorTab2") ;
					          if(totalPages > 1) {
					          %>
											<div style="overflow:auto;">
												<% uicomponent.renderChild("FAQUserPageIteratorTab2"); %>
											</div>
									<%}%>
										</div>

									</div>
									
	              	<!-- end pending question -->
								
								</div>
							
							</div>
						</div>
						
				</div>
			</div>  
    
    <!-- View list categories -->
    <div style="overflow:auto;float:right;padding-right:10px;">
    	<label for="<%=uicomponent.LIST_CATEGORIES%>"><%=_ctx.appRes("UIQuestionsInfo.label.SelectCategory")%>&nbsp;:&nbsp;</label>
			<% uicomponent.renderChild(uicomponent.LIST_CATEGORIES) ; %>
		</div>
    
    </div>  
  </div>	
	<%uiform.end()%>
</div>