
<form name="input_form" id="input_form" action="/m/mypage/bookmark" method="post">
<div class="mypage_top mypage_top_fixed">
	<a href="/m/mypage/qna_add" class="pens"><img src="/img/mobile/penicon.png"></a>
	<div class="mypage_logo"><a href="/m"><img src="/img/mobile/logo_cm.jpg" alt="logo"></a>
	</div>
	<div class="mypage_title"><a href="/m/mypage/req_password">마이페이지</a>
	</div>
	<div class="mypage_menu"><a href=""><img src="/img/mobile/menu_list.gif" alt="menu"></a>
	</div>
</div>
<ul class="mypage_header mypage_header_fixed">
	<li class="header_tit">내 북마크 모음</li>
</ul>
<div class="middle_search" >
	<div class="m_t_search">
			<span class="srch_inp">
				<input  name="search_keyword" id="search_keyword" value="<?=$search_keyword?>"  placeholder="북마크 검색">
			</span>
		<button class="btn_search">검색 </button>
	</div>
	<span class="total fr">총 <span class="beachblue"><?=$total_count?></span>개</span>
</div>



<div class="mypage_cont" >

	<div class="cont_header" style="padding: 10px 20px;display:none;"  >
		<span style="margin-right:20px; display: inline-block;"><input value="" type="checkbox"  name="allcheck" id="allcheck" ></span>
		<span style="margin-right:20px; display: inline-block; vertical-align: middle;">총 <span class="beachblue"  id="bookmark_del_count">0</span>개 선택</span>
		<span style="display: inline-block; vertical-align: top;"><a href="javascript:bookmark_arr_del();"class="btn btn-default br15" >삭제</a></span>
		<span class="fr"><a href="javascript:bookmark_edit();" class="btn btn-default br15">편집완료</a></span>
	</div>
	<div class="cont_header" style="padding: 10px 20px;">
		<!--span style="margin-right:20px; display: inline-block;"><input value="" type="checkbox"></span-->
		<span style="margin-right:20px; display: inline-block; vertical-align: middle;">총 <span class="beachblue"><?=$total_count?></span>개</span>
		<!--span style="display: inline-block; vertical-align: top;"><a href="" class="btn btn-default br15">삭제</a></span-->
		<span class="fr"><a href="javascript:bookmark_edit();" class="btn btn-default br15">편집</a></span>
	</div>

	<?

	if(count($list)==0){
		echo '<div style="min-height:300px; padding:30px 0; text-align:center;" class="mypage_list_cont">등록된 북마크가 없습니다.</div>';
	} else {

	foreach ($list as $val) {

	switch ($val['content_type']) {
		case '1':	$view_url = '/m/news/news_view/'.$val['idx']; 	$share_id_name = "news_".$val['idx'];
			break;
		case '2': 	$view_url = '/m/news/column_view/'.$val['idx']; 	$share_id_name = "column_".$val['idx'];
			break;
		case '3': 	$view_url = '/m/life/life_view/'.$val['idx'];		$share_id_name = "life_".$val['idx'];
			break;
	}

	$title = $val['title'];
	$bookmark_date	= $val['bookmark_date'];
	$bookmark_date_txt = substr($bookmark_date, 0, 10);
	$bookmark_date_txt = str_replace('-', '.', $bookmark_date_txt);

	$title_txt = mb_strimwidth($title, '0', '50', '..', 'utf-8');
	$content = $val['content'];
	$content_txt = mb_strimwidth($content, '0', '200', '..', 'utf-8');

	preg_match_all("/(\<img[[:space:]])(.*?)?(src=\"?'?)([^\"?'?]*)([\"?'?]*)([^\>]*)(\>)/Uis", $content, $matches);
	$_img = $matches[0];
	$_content_len = $_img?100:110;
	$_content = mb_substr(strip_tags($val['content']), 0, $_content_len, 'utf-8');
	$_content  = str_replace('&nbsp;', '', $_content);
	$_content = $_content.'…';

	$share_title 	= str_replace("'", "\\'", $title);
	$share_title  	= str_replace('"', '\\"', $share_title);
	$share_content  = mb_strimwidth($content, '0', '250', '..', 'utf-8');
	$share_content  = htmlspecialchars($share_content);
	$share_content  = str_replace("'", "\\'", $share_content);
	$share_content  = str_replace('”', '"', $share_content);

	$main_img = $val['main_img'];


	switch($val['content_name']){

		case "라이프":

			$view1 = $val['channel_name'];
			$view2 = $val['editor_name'];
			break;
		case "뉴스":
			$view1 = $val['category_name'];
			$view2 = $val['press_name'];
			break;

		case "칼럼":
//			var_dump($val);
			$view1 = $val['column_name'];
			$view2 = '';
			break;

		default:
			$view1 = '';
			$view2 = '';
			break;
	}

	?>

	<div class="cont_box edit">
		<div class="inn bookmark_checkbox" style="display:none;"><input type="checkbox"  name="is_del[]" value="<?=$val['bookmark_idx']?>" onclick="bookmark_del_count();"></div>
		<div class="cont_img imm1"><a  href="<?=$view_url?>"><img src="<?=$main_img?>" class="art_img"></a>
		</div>
		<div class="cont_title imm2">
			<input type="hidden" name="content_<?=$share_id_name?>" id="content_<?=$share_id_name?>" value="<?=$share_content?>">
			<input type="hidden" name="title_<?=$share_id_name?>" id="title_<?=$share_id_name?>" value="<?=$share_title?>">
			<input type="hidden" name="copy_url_<?=$share_id_name?>" id="copy_url_<?=$share_id_name?>" value="<?=WWW_CROSSMAP?><?=$view_url?>">
			<input type="hidden" name="img_url_l<?=$share_id_name?>" id="img_url_<?=$share_id_name?>" value="<?=WWW_CROSSMAP?><?=$main_img?>">
			<a href="<?=WWW_CROSSMAP?><?=$view_url?>"><?=$title_txt?></a>

			<div class="cont_cate"><a href="<?=$view_url?>"><?=$val['content_name']?></a> <span style="padding:0 6px;"></span>


				<span style="padding:0 6px"></div>
			<div class="art-menu">
				<span class="btn btn-default" style="border-radius:5px 0 0 5px !important;float:left;padding: 5px 6px 0 9px;"><a onclick="share_box(this);" id="share_box_btn<?=$val['bookmark_idx']?>"  strA="<?=$share_id_name?>"><img src="/img/mobile/img_upload.gif"></a></span>
				<span class="btn btn-default" style="border-radius:0 5px 5px 0 !important; border-left:0 !important;padding: 5px 6px 0 6px"><a href="javascript:bookmark_del('<?=$val['bookmark_idx']?>')" ><img src="/img/mobile/img_x2.gif"></a></span>
				<span><a onclick="content_toggle(this);" class="btn btn-default br5 arrow_down" style="font-size:12px;">자세히</a></span>
				<span class="art-menu-date"><?=$bookmark_date_txt?></span>
			</div>
		</div>

	</div>
		<div class="cont_box_open" style="display:none;">
			<?=($_content);?>
		</div>
	<?	}

	}

	?>
	<div class="pagenumber">
		<?=$pagination?>
	</div>


</div>


</form>

<?
$title = '';$content='';$main_img='';
require_once(APPPATH."views/web/comm/share_box_inc.php"); ?>



<script src="//code.jquery.com/jquery-1.12.4.min.js"></script>
<script>
	// 스크롤 고정 함수.
	function scroll_fix3(news_nav) {

		$( document ).ready( function() {

			var jbOffset = $( '.'+news_nav ).offset(); // 고정하고자 하는 클래스의 offset.

			$( window ).scroll( function() {
				/*스크롤탑(현재스크롤위치) > news_nav : 상단 아래로 내렸을때 상단 고정*/
				if ( $( document ).scrollTop() > jbOffset.top ) {
					$( '.'+news_nav ).addClass( 'jbFixed4' );
					//$( '.'+news_nav ).css('position','fixed');
					$(".mypage_top").hide();
					$(".mypage_top_fixed").hide();
					$(".total ").css('top','33px');
				}
				/*스크롤탑(현재스크롤위치) <= news_nav : 원래*/
				else {
					$( '.'+news_nav ).removeClass( 'jbFixed4' );
					//$( '.'+news_nav ).css('position','relative');
					$(".mypage_top").show();
					$(".mypage_top_fixed").show();
					$(".total ").css('top','15px');
				}

				console.log($( document ).scrollTop());
			});

		} );
	}
	//

	scroll_fix3('middle_search'); // 상단 고정하고 싶은 클래스 설정.
	//scroll_fix3('mypage_header_fixed'); // 상단 고정하고 싶은 클래스 설정.



	function content_toggle(elm){
		if($(elm).hasClass("arrow_down")){
			$(elm).removeClass("arrow_down");
			$(elm).addClass("arrow_up");
			$(elm).text("접기");
		}
		else{
			$(elm).addClass("arrow_down");
			$(elm).removeClass("arrow_up");
			$(elm).text("자세히");
		}

		$(elm).parent().parent().parent().parent().next().toggle();
	}







	var share_key = '';
	function share_box(e){
		var id = e.id;
		$("#share_box").toggle();
		var key = $("#"+id).attr('strA');

		$("#share_content").val($("#content_"+key).val());
		$("#share_title").val($("#title_"+key).val());
		$("#share_copy_url").val($("#copy_url_"+key).val());
		$("#share_img_url").val($("#img_url_"+key).val());
		$("#copy_url").val($("#copy_url_"+key).val());

		var popH = $("#"+id).offset().top;
		var popL = $("#"+id).offset().left;

		$('.popup_share').css('left',(popL-100)+'px');
		$('.popup_share').css('top',popH+'px');

		share_key = key;
	}


	// 공유하기 - 북마크
	function bookmark(){
		alert("이미 북마크되었습니다.");
		return false;
	}



	// 스크롤
	<? if($total_count <= $limit) {?>
	var more_yn = 'N';
	<?} else {?>
	var more_yn = 'Y';
	<?}?>
	$(document).ready(function () {
		$(document).scroll(function() {
			var maxHeight = $(document).height();
			var currentScroll = $(window).scrollTop() + $(window).height();
			if (maxHeight <= currentScroll + 100) {
				if(more_yn=='Y') {
					bookmark_list_more();
				}
			}
		})
	});

	var bookmark_list_page = 2;
	function bookmark_list_more(){
		var form_data = {
			"page"              : bookmark_list_page,
			"search_keyword"    : "<?=$search_keyword?>"
		};
		$.ajax({
			url: '/web/mypage/bookmark_list_more',
			async: false,
			type: 'POST',
			dataType: 'HTML',
			data: form_data,
			success: function (rtnHtml) {
				var arrHtml = rtnHtml.split("|||||");
				if(arrHtml[0].trim()=='0000') {
					more_yn = arrHtml[2];
					if (arrHtml[1] != "") {
						$("#bookmark_list").append(arrHtml[1]);
						bookmark_list_page++;
					}
				}
			},
			error: function (rtnHtml) {
				alert('데이터 로드에 실패했습니다.');
				return false;
			}
		});
	}


	// 검색
	function list_search(e){
		if (e.keyCode == 13) {
			list_search_proc();
		}
	}
	function list_search_proc(){
		$("#input_form").submit();
	}

	// 북마크
	function bookmark_add(){
		if($("#bookmark_url").val()==''){
			alert("url을 입력해주세요.");
			return false;
		}

		var form_data = {
			"bookmark_url"			: $("#bookmark_url").val()
		};
		$.ajax({
			url: '/web/comm/bookmark_url_add_proc',
			async: false,
			type: 'POST',
			dataType: 'JSON',
			data: form_data,
			success: function (rtnJson) {
				if (rtnJson.code == "0000") {
					location.href='/m/mypage/bookmark';
				} else {
					alert(rtnJson.msg);
					return false;
				}
			},
			error: function (rtnJson) {
				alert('북마크에 실패했습니다.');
				return false;
			}
		});
	}

	// 북마크 삭제
	function bookmark_del(idx){
		if(confirm("북마크가 삭제됩니다. 삭제하시겠습니까?") == true) {    //확인
			var form_data = {
				"idx"			: idx
			};
			$.ajax({
				url: '/web/comm/bookmark_del_proc',
				async: false,
				type: 'POST',
				dataType: 'JSON',
				data: form_data,
				success: function (rtnJson) {
					if (rtnJson.code == "0000") {
						location.href='/m/mypage/bookmark';
					} else {
						alert(rtnJson.msg);
						return false;
					}
				},
				error: function (rtnJson) {
					alert('북마크 삭제에 실패했습니다.');
					return false;
				}
			});
		} else {   //취소
			return;
		}
	}

	// 복수 삭제
	function bookmark_arr_del() {
		if($("input:checkbox[name='is_del[]']").is(":checked") == false) {
			alert("삭제할 내용이 없습니다.");
			return false;
		}
		if(confirm("북마크가 삭제됩니다. 삭제하시겠습니까?") == true) {    //확인
			$("#input_form").attr("action", "/web/comm/bookmark_arr_del_proc");
			$("#input_form").submit();
		} else {   //취소
			return;
		}
	}

	// 편집 - 클릭시
	function bookmark_edit(){
		$(".cont_header").toggle();
		$("#bookmark_edit_btn").toggleClass('arrow_down');
		$("#bookmark_edit_btn").toggleClass('arrow_up');
		$(".bookmark_checkbox").toggle();

		var class_name = $("#bookmark_edit_btn").attr("class");
		if(class_name == 'btn btn-default br5 fr arrow_down') {
			$(".mypage_list_cont").css('padding-left', '20px');
		} else {
			$(".mypage_list_cont").css('padding-left', '0px');
		}
	}

	// 내용 펼치기
	function content_more(key){
		$("#content_"+key).toggle();
		$("#arrow_img_"+key).toggleClass('arrow_down');
		$("#arrow_img_"+key).toggleClass('arrow_up');

		var class_name = $("#arrow_img_"+key).attr("class");
		if(class_name == 'btn btn-default br5 fr arrow_down') {
			$("#arrow_img_"+key).html('자세히');
		} else {
			$("#arrow_img_"+key).html('접기');
		}
	}

	// checkbox click
	function bookmark_del_count(){
		var cnt = $("input[name='is_del[]']:checkbox:checked").length;
		$("#bookmark_del_count").html(cnt);
	}

	// checkbox all checked/unchecked
	$(function(){
		$("#allcheck").click(function(){
			if($("#allcheck").prop("checked")) {
				$("input:checkbox[name='is_del[]']").prop('checked', true); // 전체선택하기
			} else {
				$("input:checkbox[name='is_del[]']").prop("checked", false);
			}
			bookmark_del_count();

		})
	})

</script>
