<!--{template 'default/head'}-->
<script type="text/javascript">
qmeCms.guestbook = {
	id:'head-list',
	getHead:function(){
		var o = $(this.id);
		if(o == null) return false;
		var as = o.getElementsByTagName('a');
		if(as.length > 0){
			if(o.parentNode.className.indexOf('head-close') == -1){
				this.fadeMark(0, function(){
					addClassName(o.parentNode, 'head-close');
				});
			}else{
				removeClassName(o.parentNode, 'head-close');
				this.fadeMark(o.offsetHeight, function(){});
			}
		}else{
			var self = this;
			o.parentNode.style.height = 0;
			removeClassName(o.parentNode, 'head-close');
			var max = 16;
			var ele = document.createDocumentFragment();
			for(var i=0;i<=16;i++){
				var a = document.createElement('a');
				a.href = '###';
				a.setAttribute('rel', i.toString());
				if(i == 0) a.className = 'current';
				a.setAttribute('title', '使用这个头像');
				a.innerHTML = "<img width='64' height='64' src='"+config.url+"images/head/"+i.toString()+".gif' />";
				a.onclick = function(){
					return self.setHead(this);
				}
				ele.appendChild(a);
			}
			o.appendChild(ele);
			this.fadeMark(o.offsetHeight, function(){});
		}
		return false;
	},
	setHead:function(obj){
		var as = $(this.id).getElementsByTagName('a');
		Each(as, function(){
			removeClassName(this, 'current');
		});
		addClassName(obj, 'current');
		var index = parseInt(obj.getAttribute('rel'));
		$('guest_pic').value = index;
		$('guest-head').src = config.url+"images/head/"+index.toString()+".gif";
		var self = this;
		this.fadeMark(0, function(){
			addClassName($(self.id).parentNode, 'head-close');
		});
		return false;
	},
	check:function(){
		if($('guest_message').value.trim().length < 4){
			alert('留言内容不能少于4个字符');
			$('guest_message').focus();
			return false;
		}
		if($('verify_code') != null && $('verify_code').value.length  == 0){
			alert('需要填写验证码');
			$('verify_code').focus();
			return false;
		}
		$('submit-btn').disabled = true;
		return true;
	},
	fadeMark:function(h, fun){
		var obj = $(this.id).parentNode;
		var b=obj.offsetHeight,c=h-b, d=10;
		var method = (typeof method == 'string' && method) ? method : 'easeInOutCubic';
		var t=0,ttl=25;
		(function (){
			clearInterval(obj.timer);
			obj.timer=setInterval(function (){
				var m = Math.ceil(Tweener[method](t,b,c,d)) ;
				obj.style.height = m + 'px';
				if(t<d) t++;
				else{
					clearInterval(obj.timer);
					if(typeof fun == 'function') fun(obj);
				}
			},ttl)
		})()
	}
};
</script>
<style type="text/css">
form.label .f-label{width:72px}
form.label p.act{padding-left:92px}
body .head-close{height:0;line-height:0;font-size:0;padding:0}
.head-list{padding:0 0 0 12px;overflow:hidden;}
.head-list a{margin:0 6px 6px 0}
.head-list img{border:1px solid #dedede;padding:3px;}
.head-list a:hover img{background-color:#dedede}
.head-list a.current img{background-color:#ff6600}
</style>
<div class="main cbody margintop">
	<div class="pleft">
		<h3 class="b">
			<span></span>
			<div class="guest-tab">
				<ul>
					<li id="guest-tab-0"><a href="###" onclick="return false">留言本</a></li>
					<li id="guest-tab-1"><a href="#add">我要留言</a></li>
					<div class="clear"></div>
				</ul>
			</div>
		</h3>
		<div class="comment" style="border-top:0;">
			<div class="commentbox" >
				<!--{if $data}-->
				<table border="0" width="100%" cellpadding="0" cellspacing="0">
				<!--{loop $data $v}-->
					<tr>
						<td valign="top" class="head">
							<a name="guest-{$v['gid']}"></a>
							<img src="{W_P}images/head/{$v['pic']}.gif" />
						</td>
						<td valign="top" >
							<dl>
								<dt><!--{echo qbase::formatIp($v['ip'])}-->  留言于：<!--{echo qbase::formatTime('Y-m-d H点i分',$v['dateline'])}--> <span class="c"></span></dt>
								<dd>
									<div style="word-break: break-all"><!--{echo nl2br(ubb($v['message']));}--></div>
									<!--{if $v['has_reply']}-->
									<div style="padding:6px 12px;border:1px solid #dedede;margin-top:12px;font-size:12px;-moz-border-radius:5px;word-break: break-all">
										<p>管理员于<!--{echo qbase::formatTime('Y-m-d H点',$v['reply_time'])}-->回复：</p>
										<div class="quote_start">
											<span class="quote_end"><!--{echo nl2br(ubb($v['reply']));}--></span>
										</div>
									</div>
									<!--{/if}-->
								</dd>
							</dl>
						</td>
					</tr>
				<!--{/loop}-->
				</table>
				<!--{else}-->
				<p style="text-align:center;padding:15px 0 25px 0">还没有留言</p>
				<!--{/if}-->
				<!--{if $pager}-->
				<div  class="pager" style="height: 30px;">{$pager}</div><div class="clear"></div>
				<!--{/if}-->
			</div>
			<a name="add"></a>
			<div class="commentbox" style="border-top:1px solid #ddd">
				<table width="100%" border="0" cellspacing="0" cellpadding="0">
					<tr>
						<td valign="top" class="head" width="80">
							<a href="###" onclick="return qmeCms.guestbook.getHead();"><img id="guest-head" src="{W_P}images/head/0.gif" title="点击更换头像" /></a>
							<p style="text-align:center"><a href="###" onclick="return qmeCms.guestbook.getHead();">换个头像？</a></p>
						</td>
						<td>
							<div class="head-list head-close">
								<div id="head-list"></div>
							</div>
							<form name="guest_book" id="guest_book" class="label" method="post" action="index.php?ac=guestbook&op=add" onsubmit="return qmeCms.guestbook.check()">
								<p><label class="f-label" for="guest_qq">QQ：</label><input type="text" class="f-text" value="" name="guest[qq]" id="guest_qq" /></p>
								<p><label class="f-label" for="guest_email">Email：</label><input type="text" class="f-text" value="" name="guest[email]" id="guest_email" /></p>
								<p><label class="f-label" for="guest_message" style="color:red">留言内容：</label><textarea class="f-text" name="guest[message]" id="guest_message" style="width:450px;height:120px"></textarea></p>
								<!--{if $_SET['plugin_guestbook_verify']}-->
								<p>
									<label class="f-label" for="verify_code" style="color:red">验证码：</label><input type="text" name="verify_code" id="verify_code" autocomplete="off" class="f-text" type="text" maxlength="4" size="12" style="width:60px" /> 
									<img title="点击更换图片" src="code.php?height=30&bgcolor=ffffff" onclick="return changeVerifyImage()" id="verify_code_img" />
									<font color="#999">把图片上的数字输入一遍，</font><a href="###" onclick="return changeVerifyImage()">看不清楚？换一张</a>
								</p>	
								<!--{/if}-->
								<p class="act">
									<input type="hidden" name="guest[pic]" id="guest_pic" value="0" />
									<input type="hidden" name="myFormAc" value="update" />
									<input type="submit" class="f-button" value=" 提交留言 " id="submit-btn" />
								</p>
							</form>
						</td>
					</tr>
				</table>
			</div>
		</div>
	</div>
	<div class="pright">

	</div>
	<div class="clear"></div>
</div>
<!--{template 'default/foot'}-->