<%
/**
 * <pre>
 * @Class Name : selectNCultureLocationInfo.jsp
 * 
 * @Description : 찾아오시는길 조회 
 * 
 * 
 * @프로젝트명: 지방문화원 통합자료관리시스템 구축사업 (2021)
 *
 * </pre>
 *
 * @ ------------    --------    ---------------------------
 * @ 수정일                           수정자                 수정내용
 * @ ------------    --------    ---------------------------
 * @ 2021. 7. 27.    KNKIM       최초 생성
 *
 * 
 * @author 이씨플라자 * DIGITALSHIP KNKIM
 * @since 2021. 7. 27.
 * @version 1.0
 *
 */
 %>
<%@ page language="java" contentType="text/html; charset=UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="ui" uri="http://egovframework.gov/ctl/ui" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %><%@taglib prefix="spring" uri="http://www.springframework.org/tags"%>

<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ taglib prefix="validator" uri="http://www.springmodules.org/tags/commons-validator" %>


    <!-- 찾아오시는길 섹션 -->
    <div class="location map">
        <h2 class="blind">찾아오시는길 섹션영역</h2>
        <div class="inner">
            <div class="row-top">
                <div class="location-box">
                    <ul class="loc">
                        <li>HOME</li>
                        <li>자료관안내</li>
                        <li class="on">찾아오시는길</li>
                    </ul>
                    <ul class="tit">
                        <li><span>찾아오시는</span>길</li>
                    </ul>
                </div>
                <div class="arr"><img src="/images/icon/icon-join-arr2.png" alt="화살표 아이콘"></div>
            </div>
            <div class="contents row-bottom">
                <div class="map-box">
                    <h2><span>${mngOrgNm }</span> 오시는 길</h2>
                    <div class="info">
                        <div class="mapimg">
				            <!-- 지도 : 시작 -->            
				            <section class="list-box">
				                <div id="map" style="width:100%;height:440px;"></div>
				            </section><!-- //위치정보 -->
				            <script src="https://openapi.map.naver.com/openapi/v3/maps.js?ncpClientId=532wx3i985"></script>
				            <script> 
				                function initMap() {
				                    var lon = "${longitude}";
				                    var lat = "${latitude}";
				                    var map = new naver.maps.Map(
				                            document.getElementById('map'),
				                            {
				                                useStyleMap: true, // 신규 맵 타일(StyleMap)으로 전환 (2019.12.20)
				                                mapDataControl:false,
				                                draggable: true,
				                                mapTypeControl: false,
				                                mapTypeControlOptions: {
				                                    style: naver.maps.MapTypeControlStyle.BUTTON,
				                                    position: naver.maps.Position.TOP_LEFT
				                                },
				                                mapTypeId: naver.maps.MapTypeId.NORMAL,
				                                zoomControl: false,
				                                zoomControlOptions: {
				                                    style: naver.maps.ZoomControlStyle.SMALL,
				                                    position: naver.maps.Position.TOP_LEFT
				                                },
				                                zoom: 15,
				                                minZoom: 5,
				                                maxZoom: 20,
				                                scaleControl: true,
				                                scaleControlOptions: {
				                                    position: naver.maps.Position.LEFT_BOTTOM
				                                },
				                                logoControl: false,
				                                logoControlOptions: {
				                                    position: naver.maps.Position.TOP_LEFT
				                                },
				                                mapDataControl: false,
				                                mapDataControlOptions: {
				                                    position: naver.maps.Position.BOTTOM_LEFT
				                                },
				                                keyboardShortcuts : false,
				                            }
				                        );
				                    var marker = new naver.maps.Marker({
				                            position: new naver.maps.Point(lon, lat),
				                            map: map
				                        });
				                    map.setCenter(new naver.maps.Point(lon,lat));
				                } 
				                initMap();
				            </script>                        
                            <!-- 지도 : 종료 -->
                        </div>
                        <div class="addr">
                            <p><img src="/images/icon/icon-location-01.png" alt="지도 아이콘"></p>
                            <p>주소</p>
                            <p>(${zipCode }) ${address } ${addressDetail }</p>
                        </div>
                        <div class="time">
                            <p><img src="/images/icon/icon-location-02.png" alt="달력 아이콘"></p>
                            <p>운영시간</p>
                            <p>월요일~금요일 / 오전 ${openTime } ~ 오후 ${closeTime }</p>
                            <p>매주 토요일, 일요일 휴관<br>${closingInfo }</p>
                        </div>
                        <div class="tel">
                            <p><img src="/images/icon/icon-location-03.png" alt="전화 아이콘"></p>
                            <p>전화</p>
                            <p>${phoneNo }</p>
                        </div>
                        <div class="fax">
                            <p><img src="/images/icon/icon-location-04.png" alt="팩스 아이콘"></p>
                            <p>팩스</p>
                            <p>${faxNo }</p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="info-box">
                ${informContent }
            </div>
        </div>
    </div>
  
