<div class="container" style="max-width:1200px;">
	<div class="row">
		<div class="col-xs-24 btn-lg"></div>
		<div class="col-sm-7 col-xs-24 pull-right" style="font: 14px 'Arial','Microsoft YaHei';line-height:25px;">
			<div class="panel">
			  <div class="panel-body">
			  	<legend>
			  		<span class="text-primary glyphicon glyphicon-thumbs-up" style="font-size:20px;"></span>
			  		<span style="font-size:15px;">他们都觉得很赞!</span>
			  	</legend>
					
					<?php foreach ($like_list as $l) { ?>
						<span><?php echo $l->whu_uname; ?>; </span>
					<?php } ?>
				<div class="clearfix"></div>
			  </div>
			</div>
			<div class="panel">
			  <div class="panel-body">
			  	<legend>
					<span class="text-danger glyphicon glyphicon-thumbs-down" style="font-size:20px;"></span>
			  		<span style="font-size:15px;">他们拍砖了!</span>
			  	</legend>
					<?php foreach ($unlike_list as $ul) { ?>
						<span><?php echo $ul->whu_uname; ?>; </span>
					<?php } ?>
				<div class="clearfix"></div>
			  </div>
			</div>

    	</div>

    	<div class="col-sm-17 col-xs-24">
			<div class="col-xs-24" style="padding-bottom:30px;background:#fff;">
				<h3 style="font-size:20px;margin-bottom:30px;"><?php echo $mail_text->whm_subject;?></h3>
				<div class="col-xs-24 nopadding"><?php echo htmlspecialchars_decode($mail_text->whm_content); ?></div>
				<div class="col-xs-24 nopadding">
					<a name="gotocomment" id="gotocomment" ></a>
					<form id="from-add-comment" method="post" action="<?php echo site_url('apps/outlook/index/add_comment');?>" style="background:#f5f5f5;padding:0px 15px 15px 15px;margin-top:50px;">
						<div class="col-xs-24 btn-lg"></div>
						<div class="col-xs-24 nopadding">
							<textarea class="form-control" rows="3" name="comment" id="comment-textarea"></textarea>
						</div>
						<div class="col-xs-24 btn-sm"></div>
						<div class="col-xs-24 nopadding">
							<input type="hidden" name="whc_whm_identify" value="<?php echo $whc_whm_identify;?>">
							<button type="button" id="btn-add-comment" class="btn btn-danger pull-right">确　定</button>
						</div>
						<div class="clearfix"></div>
					</form>
				</div>
			</div>
			<?php if (!empty($list)) { ?>
			<div class="col-xs-24" style="margin-top:20px;margin-bottom:50px;padding-bottom:20px;font: 14px 'Arial','Microsoft YaHei';line-height:23px;background:#fff;">
				<?php foreach ($list as $key => $c) { ?>
					<div class="col-xs-24" style="padding:12px 0 10px 0;">
						<p class="text-primary"><a href="<?php $usermail=explode('@', $c->whu_email);echo site_url('apps/outlook/index/space/'.$usermail[0]); ?>"><?php echo $c->whu_uname; ?></a>：</p>
						<p><?php echo $c->whc_content; ?></p>
						<p>
							<span class="text-muted"><?php echo date('Y-m-d H:i:s',$c->whc_createtime); ?></span>
							<span class="pull-right"><a href="#gotocomment" class="re_comment" data-uname="<?php echo $c->whu_uname; ?>">回复</a></span>
						</p>
					</div>
					<legend class="col-xs-24"></legend>
				<?php } ?>
			</div>
			<?php } ?>

    	</div>

	</div>
</div>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-body">
        <div class="media">
		  <div class="media-left">
		    <div>
		      <span id="msgclass" class="glyphicon glyphicon-ok text-success" aria-hidden="true" style="font-size:85px;"> </span>
		      <a class="btn btn-sm btn-danger" onclick="ajax_link($(this));" href="javascript:void(0);" data-href="<?php echo site_url('apps/outlook/index/delete_comment/'.$whc_whm_identify.'/'.$type); ?>">撤销操作</a>
		    </div>
		  </div>
		  <div class="media-body" style="font-size:32px;">
		  	<div class="col-xs-24 btn-lg"><p></p></div>
		    <span id="msgbox" class="text-success">你已经成功的狠狠<?php if($type=='like'){echo '赞';}else{echo '踩';} ?>了TA一下！</span>
		  	<p style="font-size:14px;color:#888;padding-left:5px;padding-top:18px;"><em class="text-danger" id="seconed_box">15</em> 秒钟内可以撤销刚才的操作</p>
		  </div>
		</div>
      </div>
    </div>
  </div>
</div>

<script type="text/javascript">

var type="<?php echo $type;?>";
var comment_url="<?php echo site_url('apps/outlook/index/like/'.$whc_whm_identify.'/comment');?>";
if (type=='like' || type=='unlike') {
	$('#myModal').modal('show');
	var timer=$("#seconed_box").text();
	if (timer>=0) {
		setInterval(function(){
			var newtimer=--timer;
			$("#seconed_box").text(newtimer);
		},1000);
	};
	setTimeout("$('#myModal').modal('hide')",15000);
};

$(".re_comment").click(function () {
	$("textarea").text('@'+$(this).attr('data-uname')+' ');
	$("textarea").focus();
});

$("#btn-add-comment").click(function() {
	if ($("#comment-textarea").val().replace(/(^\s*)|(\s*$)/g,'')=="") {
		$("#msgclass").removeClass('glyphicon-ok text-success');
    	$("#msgclass").addClass('glyphicon-remove text-danger');
		$("#msgbox").removeClass('text-success');
		$("#msgbox").addClass('text-danger');
    	$("#msgbox").text('评论内容不能为空！');
    	$('#myModal').modal('show');
    	setTimeout(function() {
			$('#myModal').modal('hide');
		},5000);
		return false;
	};
	var url = $("form#from-add-comment").attr('action');
	var data= $("form#from-add-comment").serialize();
	$.post(url,data,function(result){
	    if (result) {
	    	$("#msgclass").removeClass('glyphicon-remove text-danger');
	    	$("#msgclass").addClass('glyphicon-ok text-success');
	    	$("#msgbox").removeClass('text-danger');
			$("#msgbox").addClass('text-success');
	    	$("#msgbox").text('评论成功！');
	    	$('#myModal').modal('show');
			setTimeout(function() {
				$('#myModal').modal('hide');
				location.href=comment_url;
			},1500);
	    }else{
	    	$("#msgclass").removeClass('glyphicon-ok text-success');
	    	$("#msgclass").addClass('glyphicon-remove text-danger');
			$("#msgbox").removeClass('text-success');
			$("#msgbox").addClass('text-danger');
	    	$("#msgbox").text('评论发布失败！');
	    	$('#myModal').modal('show');
	    	setTimeout(function() {
				$('#myModal').modal('hide');
			},5000);
	    }
	});
});

</script>