{extend name="layout/layout" /}
{block name="title"}最近阅读{/block}
{block name="css"}
<!-- 这里引入css -->
<link href="{:client_asset('/css/frontend/common.css')}" rel="stylesheet" type="text/css">
<link href="{:client_asset('/css/frontend/recently.css')}" rel="stylesheet" type="text/css">
<link href="{:client_asset('/css/frontend/classify.css')}" rel="stylesheet" type="text/css">
<style type="text/css">
	.content_null_top_border{
		border-top: 0;
	}
</style>
{/block}
{block name="zepto"}
<!-- 这是zepto插件 -->
<script type="text/javascript" src="{:client_asset('/libs/zepto/zepto.picLazyLoad.min.js')}"></script>
{/block}
{block name="menu_title"}最近阅读{/block}
{block name="main"}
<!-- 这是正文 body_sytle_girl -->
<!--  提示置顶  -->
<div class="set_top_box" style="display:none;">点击右上角[在聊天中置顶或者浮窗]阅读有惊喜↑</div>

<div class="body_sytle">
	<!--i_nav_box 顶部导航-->
	{notempty name="rencently"}
	<div class="r_img_list_box">
		<div class="r_img_edit_box">
			<div class="r_book_num">
				<strong totalnum="{$totalNum}">共{$totalNum}本</strong>
				<em>选中0本</em>
			</div>
			<div class="r_img_edit_but_box">
				<a href="javascript:;" class="r_img_edit_open">管理</a>
				<a href="javascript:;" class="r_img_edit_close">取消</a>
				<a href="javascript:;" class="r_img_edit_remove">删除</a>
			</div>
		</div>

		<ul class="r_img_ul" id="recent_ul">
			{foreach name="$rencently" item="data" }
			<li supdatet="{$data.updatetime}" sbid = "{$data.book_id}" recentid = "{$data.id}">
				{if condition="$data.state eq '0'"}
				<a href="javascript:;" class="r_img_book_null">
				{else /}
				<a href="{:url('clientweb/book/chapter',['book_id'=>$data.book_id,'chapter_id'=>$data.chapter_id],true)}" class="client-read" data-chapter-id="{$data.chapter_id}" data-book-info='{$data.book_json}'>
				{/if}
					<div class="r_img">
						<img src="{$data.image}" />
						{if condition="$data.state eq '0'"}<span></span>{/if}
					</div>
					<div class="r_img_text">
						<h3>{$data.book_name}</h3>
						<div class="r_img_chaptername">上次读到：{$data.chapter_name}</div>
						<div class="r_img_end">更新至：{$data.last_chapter_name}</div>
					</div>
				</a>
			</li>
			{/foreach}
		</ul>
		<!--r_img_ul 最近阅读列表 r_img_remove_select-->
		<div class="loading_box"><span>已显示全部图书</span></div>
	</div>
	{/notempty}
	<!--r_img_list 编辑最近阅读列表 r_img_list_edit_remove r_img_list_edit -->

	<div class="content_null_box content_null_top_border" {if condition="count($rencently) eq 0 "} style="display:block;" {else /} style="display:none;"{/if}>
		<img src="{:client_asset('/img/frontend/icon/icon_5.png')}" style="width: 1.05rem;" />
		<span>你还没有<i>阅读</i>记录</span>
	</div>

	<div class="r_img_list_other" {if condition="count($rencently) elt 3 "} style="display:block;" {else /} style="display:none;"{/if}>
		<div class="r_img_list_other_tit">
			<h2>为你推荐</h2>
		</div>
		<ul class="r_img_ul">
			{volist name="$ranklist['idx']" id="data" offset="0" length='10'}
			<li>
				<a href="{:url('clientweb/book/info',['book_id'=>$data.id,],true)}">
					<div class="r_img">
						<img src="{$data.image}" />
						<span></span>
					</div>
					<div class="r_img_text">
						<h3>{$data.name}</h3>
						<p>{$data.description}</p>
						<div class="i_images_txt_other">
							<strong>
								{if condition="$data.is_finish eq 1"}
								<i>已完结</i>
								{else/}
								<i style="color: #7fdae9;">连载中</i>
								{/if}
								<b>{$data.author}</b>
							</strong>
							<em>{$data.read_num}人在追</em>
						</div>
					</div>
				</a>
			</li>
			{/volist}
		</ul>
	</div>
</div>

<!--活动弹框-->
<div {empty name="activityRes"}style="display: none;" {else /}data-type="1"{/empty} class="christmas_popup_box">
<div class="christmas_body">
	<div class="christmas_main">
		<a href="javascript:;" class="christmas_close_2"></a>
		{notempty name="$activityRes"}
		<a href="/s/0?rid={$activityRes.id}&aid={$activityRes.aid}" class="christmas_main_but"><img src="{$activityRes.popimage}" /></a>
		{/notempty}
	</div>
</div>
<div class="christmas_jgb"></div>
</div>

{/block}
{block name="footer"}
{include file='public/footer'}

{/block}
{block name="js"}
<!-- 这里引入js -->
<script type="text/javascript" src="{:client_asset('/js/frontend/recently.js')}"></script>
<script>
var pagenum=2,
	sBookstop=true,
	sBookstopTime=null,
	pagesize=10,
	block_id = $("#block_id").val(),
	user_id=$.fn.cookie('user_id');


$(function(){
				
	$('img').picLazyLoad({
		effect : "fadeIn"
	});
	
	
	if(user_id && $('#recent_ul li').length >= pagesize){
		console.log(user_id);
		$(window).scroll(function(){
			var nWinH =  document.documentElement.clientHeight;
			var nScrollTop = (document.body.scrollTop || document.documentElement.scrollTop) + nWinH;
			var nBodyScrollH = document.body.scrollHeight;
			if(sBookstop && nBodyScrollH - nScrollTop < 600){
				bookstoptime();
				loadingList();
			}
		});
		
	}
});

function loadingList(){
	var sUpadateTime = '';
	if($('#recent_ul li').length > 0){
		var sUpadateTime = $('#recent_ul li').last().attr('supdatet');
	}
	$('.loading_box').html('<span>正在加載中，请稍候......</span>').show();
	$.ajax({
		type: 'post',
		url: '/clientwebapi/user/getReadRecently',
		timeout: 10000,
		cache: false,
		dataType: 'json',
		data: {
			'pageSize':pagesize,
			'updatetime':sUpadateTime
		},
		success: function (data) {
			clearTimeout(sBookstopTime);
			if (typeof data == 'string') {
				data = JSON.parse(data);
			}
			data = data.data;
			var sLi = '';
			for(var i=0; i<data.length; i++){
                if(data[i]['state'] == 1 || data[i]['state'] == '-1'){
					sLi += '<li supdatet="' + data[i].updatetime + '" sbid = "' + data[i].book_id + '"'+ 'recentid = "'+ data[i].id+'">\
						<a href="/clientweb/book/chapter?book_id='+ data[i]['book_id']+'&chapter_id='+ data[i]['chapter_id']+'" class="client-read" data-chapter-id="'+data[i]['chapter_id']+'" data-book-info=\''+data[i]['book_json']+'\'>\
							<div class="r_img">\
								<img src="{:asset('/img/frontend/images/default_img.png')}" data-original="'+ data[i]['image'] +'" />\
								<span></span>\
							</div>\
							<div class="r_img_text">\
								<h3>'+ data[i]['book_name'] +'</h3>\
								<div class="r_img_chaptername">上次读到：'+ data[i]['chapter_name'] +'</div>\
								<div class="r_img_end">更新至：'+ data[i]['last_chapter_name'] +'</div>\
							</div>\
						</a>\
					</li>';
				}else{
					sLi += '<li supdatet="' + data[i].updatetime + '" sbid = "' + data[i].book_id + '"'+ 'recentid = "'+ data[i].id+'">\
						<a href="javascript:;" class="r_img_book_null">\
							<div class="r_img">\
								<img src="{:asset('/img/frontend/images/default_img.png')}" data-original="'+ data[i]['image'] +'" />\
								<span></span>\
							</div>\
							<div class="r_img_text">\
								<h3>'+ data[i]['book_name'] +'</h3>\
								<div class="r_img_chaptername">上次读到：'+ data[i]['chapter_name'] +'</div>\
								<div class="r_img_end">更新至：'+ data[i]['last_chapter_name'] +'</div>\
							</div>\
						</a>\
					</li>';
				}
				
			}
			$('#recent_ul').append(sLi);
			pagenum ++;
			if(data.length < pagesize){
				$('.loading_box').html('<span>已显示全部</span>').show();
				sBookstop = false;
			}else{
				$('.loading_box').html('<span>下拉加载更多</span>').show();
				sBookstop = true;
			}			
			$('img').picLazyLoad({
				effect : "fadeIn"
			});

		},
		error: function (XMLHttpRequest, textStatus, errorThrown) {
		}
	});
}



//防止重复请求数据
function bookstoptime() {
	clearTimeout(sBookstopTime);
	sBookstop = false;
	sBookstopTime = setTimeout(function () {
		sBookstop = true;
	}, 10000);
}	
	
	
	
	
	
	
</script>
{/block}