<script src="/static/minjs/hlcms.Lottery.js" type="text/javascript"></script>

<button id="freshBtn">开始刮奖</button><label>已刮开 <span id="drawPercent">0%</span> 区域。</label>
<div id="lotteryContainer" class="d-flex justify-content-center d-block position-relative" style="height: 120px;"><p class="text-danger">你有2次刮奖机会</p></div>

<script>

	$(function() {

		var lottery = new Lottery('lotteryContainer', '#CCC', 'color', 300, 100, drawPercent);
		//lottery.init('毛巾一条', 'text');

		document.getElementById('freshBtn').onclick = function() {
			drawPercentNode.innerHTML = '0%';
			lottery.init(getRandomStr(10), 'text');
		}

		var drawPercentNode = document.getElementById('drawPercent');

		function drawPercent(percent) {
			drawPercentNode.innerHTML = percent + '%';
		}

	});

	function getRandomStr(len) {
		var text = "";
		var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
		for(var i = 0; i < len; i++)
			text += possible.charAt(Math.floor(Math.random() * possible.length));
		return text;
	}
</script>