<!DOCTYPE HTML>
<html lang="en-US">
<head>	
	<title>皮肤商城</title>
	<meta charset='utf-8'>
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="description" content="WPS 会员">
	<meta name="keywords" content="">
	<meta name="robots" content="index,follow">
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=0,minimal-ui">
	<link rel="stylesheet" href="../css/main.css">
</head>
<body ms-controller="SkinCtrl" ms-css-overflow="{{riceLackWin ? 'hidden': ''}}">
	<!--debug控制台-->
	<div id="debug" style="width:100%;"></div>

	<ul id="skinListUL" class="skin_list">
		<!--默认颜色皮肤-->
		<li ms-click="useSkin(el.id)" ms-repeat-el="colorSkins" style="display:none;" ms-visible="colorSkins.length">
			<img src="../css/img/skin.png" alt="">
			<span class="img" style="background: none repeat scroll 0 0;" ms-css-background="el.img"></span>
			<iframe  class="select" src="../css/svg/tip.svg" width="32" height="23"ms-visible="currentUsed == el.id"></iframe>
			<p class="progress_bg" style="display: none;">
				<span class="progress"></span><!-- 进度条，下载百分之几就给宽度百分之几 -->
			</p>
		</li><!--在线皮肤--><li ms-repeat-el="skins" ms-click="showPreview($index, el.id)" style="display:none;" ms-visible="skins.length">
			<div class="img_all">
				<img src="../css/img/skin.png" ms-attr-id="'skin_' + el.id" alt="">
				<span class="download" style="display:none;" ms-visible="el.status === 2"></span>
			</div>
			
			<iframe  class="select" src="../css/svg/tip.svg" width="32" height="23" ms-visible="currentUsed == el.id"></iframe>
			
			<div class="price" style="display:none;" ms-visible="el.status < 3 && !ismypage">
				<span class="delece_price" style="display:none;" ms-visible="el.realPrice !== el.price" ms-text="el.price + '稻米'"></span>
				<span class="true_price" style="display:none;" ms-visible="el.realPrice !== el.price" ms-text="el.realPrice + '稻米'"></span>
				<span class="free" style="display:none;" ms-visible="el.realPrice === el.price" ms-text="+el.price ? el.price+'稻米'   : '免费'"></span>
			</div>
			<div ms-class="{{el.className}}" ms-css-display="{{el.className?'block': ''}}" ms-html="el.text"></div><!--el.className: VIP:saletxt1,限免:saletxt2,特价:saletxt-->
			<p class="progress_bg" style="display: none;" ms-visible="el.progress * 1">
				<span class="progress" ms-css-width="el.progress + '%'"></span>
			</p>
		</li>
	</ul>
	<!-- 内容加载中 开始 -->
	<div class="loadmore" ms-visible="loading">
		<div class="loading"></div>
		 <h2>内容加载中...</h2>
	</div>
	<!-- 内容加载中 结束 -->

	<!-- 确认弹出框 -->
	<div class="dialog"  ms-visible="buyConfirmWin">
		<div class="sure">
			<p>兑换该皮肤将消耗{{skins[downIndex] ? skins[downIndex].price:0}}稻米，确认要进行兑换吗？</p>
			<div class="sure_btn_all">
				<a href="javascript:void(0)" class="fl sure_btn" ms-click="hideBuyConfirm()">取消</a>
				<a href="javascript:void(0)" class="fr sure_btn" ms-click="buySkin()">确定</a>
			</div>
		</div>
		<div class="mask" ms-click="hideBuyConfirmWin()"></div>
	</div>

	<!-- 稻米不足弹出框 -->
	<div class="dialog"  ms-visible="riceLackWin">
		<div class="sure">
			<p>你的稻米数量不足，快去做任务赢稻米吧~</p>
			<div class="sure_btn_all">
				<a href="javascript:void(0)" class="fl sure_btn" ms-click="hideRiceLack()">取消</a>
				<a href="javascript:void(0)" class="fr sure_btn" ms-click="finishTask()">做任务</a>
			</div>
		</div>
		<div class="mask" ms-click="hideRiceLack()"></div>
	</div>

	<script type="text/javascript" src="../js/publish/avalon.js"></script>
	<script type="text/javascript" src="../js/publish/load.js"></script>

	<script type="text/javascript">
		//页面控制台输出
		window.pr = function(msg) {
	        $('#debug').append('<br/>' + JSON.stringify(msg));
	    };

		load('skin');

	</script>

	</body>
</html>