<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
	<!-- left menu -->
	<link href="/css/jquery-accordion-menu.css" rel="stylesheet" type="text/css" />
	<script src="/js/jquery-accordion-menu.js" type="text/javascript"></script>
	<script type="text/javascript">
	jQuery(document).ready(function () {
		jQuery("#jquery-accordion-menu").jqueryAccordionMenu();
		$('.two_depth_li').each(function(index, item){
			if($(item).find('li').length == 0){
				$(item).find("span").remove()
			}
		})
		
		$('.three_depth_li').each(function(index, item){
			if($(item).find('li').length == 0){
				$(item).find("span").remove()
			}
		})
		if( $('.hiddenMenuNo').length > 0 ){ //상세,수정등에서 좌측 매뉴를 보이게 하기 위한 매뉴 파라미트
			$('.hiddenMenuNo').val(${menuManageVO.menuNo}) ;	
		}
	});

	$(function(){	
		$("#demo-list li").click(function(){
			$("#demo-list li.active").removeClass("active")
			$(this).addClass("active");
		})
	})	
	</script>

<div class="lmenu_tt"><h2>
	<c:if test="${ empty eng  }">
		${menuLeftResultList[0].menuNm}
	</c:if>
	<c:if test="${not empty eng }">
		${menuLeftResultList[1].menuNm}
	</c:if>
</h2></div>
<div id="jquery-accordion-menu" class="jquery-accordion-menu red">
	<ul id="demo-list">
		<c:forEach var="resultListTwo" items="${menuLeftResultList}" varStatus="status">
			<c:if test="${resultListTwo.depth eq '2' }">
					<li class="two_depth_li">
						<c:if test="${empty resultListTwo.url}">
							<a href="#" title="${resultListTwo.menuNm} 하위매뉴">${resultListTwo.menuNm}</a>	
						</c:if>
						<c:if test="${!empty resultListTwo.url}">
							<a href="${resultListTwo.url}">${resultListTwo.menuNm}</a>
						</c:if>
						<c:forEach var="resultListThree" items="${menuLeftResultList}" varStatus="status">
							<c:if test="${resultListThree.depth eq '3' && resultListTwo.menuNo  eq resultListThree.upperMenuId }">
								<ul class="submenu">
								<li class="three_depth_li">
									<c:if test="${empty resultListThree.url}">
										<a href="#">${resultListThree.menuNm}</a>	
									</c:if>
									<c:if test="${!empty resultListThree.url}">
										<a href="${resultListThree.url}">${resultListThree.menuNm}</a>
									</c:if>
										<c:forEach var="resultListFour" items="${menuLeftResultList}" varStatus="status">
											<c:if test="${resultListFour.depth eq '4' && resultListThree.menuNo  eq resultListFour.upperMenuId }">
												<ul class="submenu submenu2">
												<li>
													<li><a href="${resultListFour.url}"><i class="fa fa-angle-right" aria-hidden="true"></i>${resultListFour.menuNm}</a></li>
												</li>
												</ul>
											</c:if>
										</c:forEach>
								</li>
								</ul>
							</c:if>
						</c:forEach>
					</li>
			</c:if>			
		</c:forEach>
	</ul>
</div>
<form name="leftMenu">
	<input type="hidden" name="menuNo" id="menuNo" value="${menuManageVO.menuNo}" />
</form>