<?

?>
<!doctype html>
<html lang="ko">
<head>
	<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
	<title>Crossmap</title>
	<link rel="stylesheet" href="/css/m/swiper.min.css">
	<link rel="stylesheet" href="/css/m/xeicon.min.css">
	<link rel="stylesheet" href="/css/m/img_style.css">
</head>

<body id="photo" class="photos">
<a href="javascript:dd()" class="ph_back"><i class="xi-long-arrow-left"></i></a>
<!-- Swiper -->
<div class="swiper-container gallery-top">
	<div class="swiper-wrapper" id="main">

	</div>
	<!-- Add Arrows -->
	<div class="swiper-button-next swiper-button-white"></div>
	<div class="swiper-button-prev swiper-button-white"></div>
</div>
<div class="swiper-container gallery-thumbs">
	<div class="swiper-wrapper" id="sub">

	</div>
</div>
<script src="/js/m/jquery-1.11.3.min.js"></script>
<script src="/js/m/swipers.js"></script>
<script>


	function dd(){
		parent.closeIframe();
	}

	arr = parent.return_attr(<?=($_GET['data'])?>);



	txt ='';
	txt2 = '';
	for(i=0;i<arr.length;i++){
		txt += '<div class="swiper-slide" style="background-image: url('+arr[i].src+'); background-size:contain;background-repeat:no-repeat;">\n' +
			'\t\t\t<div class="sw_tit">\n' +
			'\t\t\t\t<ul>\n' +
			'\t\t\t\t\t<li onclick="parent.window.location=\''+arr[i].href+'\'" style="cursor:pointer">'+arr[i].text+'</li>\n' +
			'\t\t\t\t</ul>\n' +
			'\t\t\t\t<div class="swbtn1"><a href="#">연관</a></div>\n' +
			'\t\t\t\t<div class="swbtn2"><a href="#"><i class="xi-ellipsis-v"></i></a></div>\n' +
			'\t\t\t</div>\n' +
			'\t\t\t<div class="sw_set">\n' +
			'\t\t\t\t<ul>\n' +
			'\t\t\t\t\t<li class="upbt"><a href="#"><i class="xi-upload"></i></a></li>\n' +
			'\t\t\t\t\t<li><a href="#"><i class="xi-overscan"></i></a></li>\n' +
			'\t\t\t\t\t<li><a href="#"><i class="xi-close"></i></a></li>\n' +
			'\t\t\t\t</ul>\n' +
			'\t\t\t</div>\n' +
			'\t\t</div>\n' +
			'\t\t';

		txt2 +='<div class="swiper-slide" style="cursor:pointer;background-image: url('+arr[i].src+')"></div>\';';

	}

	$("#main").append(txt);
	$("#sub").append(txt2);





	var galleryTop = new Swiper('.gallery-top', {
		spaceBetween: 10,
		navigation: {
			nextEl: '.swiper-button-next',
			prevEl: '.swiper-button-prev',
		},
	});
	var galleryThumbs = new Swiper('.gallery-thumbs', {
		spaceBetween: 10,
		centeredSlides: true,
		slidesPerView: 'auto',
		touchRatio: 0.2,
		slideToClickedSlide: true,
	});
	galleryTop.controller.control = galleryThumbs;
	galleryThumbs.controller.control = galleryTop;

</script>
<script>
	var mySwiper ;
	$(document).ready(function(){

		$('.swbtn1').click(function(){

			$("body").toggleClass('active');
		});

		$('.swbtn2').click(function(){

			$("div#main").toggleClass('set');

		});

	});
</script>
</body>
</html>
