canvas 实现低配版剪刀石头布游戏

<script src="lufylegend.js-lufylegend-1.10.1/lufylegend-1.10.1.js" type="text/javascript" charset="utf-8"></script>
<div id="mylegend">
	
</div>
<script type="text/javascript">
	init(50,"mylegend",800,400,main);
	var backLayer,
		loadingLayer,
		resultLayer,
		winText,
		lossText,
		drawText,
		allText,
		win = 0 ,
		loss = 0,
		draw = 0,
		clickLayer;
	var imgList;
	var imgData = new Array(
		{name:"shitou",path:"img/shitou.png"},
		{name:"jiandao",path:"img/jiandao.jpg"},
		{name:"bu",path:"img/bu.jpg"},
	)
	function main(){
		backLayer = new LSprite();
		addChild(backLayer);
		loadingLayer = new LoadingSample3();
		LLoadManage.load(imgData,
			function(progress){
				loadingLayer.setProgress(progress);
			},
			function(result){
				imgList = result;
				backLayer.removeChild(loadingLayer);
				loadingLayer = null;
				gameInit();
			}
		);
	}
	function gameInit(){
		backLayer.graphics.drawRect(10,"#000",[0,0,LGlobal.width,LGlobal.height],true,"#fff");
		initResultLayer();
		initClickLayer();
		//绘制文字标题
		var title  = new LTextField();
		title.x = LGlobal.width/2-75;
		title.y = 10;
		title.text = "石头剪子布";
		title.size = 30;
		title.color = "#000";
		title.weight = "bolder";
		backLayer.addChild(title);
		//添加玩家出拳图片
		selfBitmap = new LBitmap(new LBitmapData(imgList["shitou"]));
		selfBitmap.x = 400-selfBitmap.width;
		selfBitmap.y = 150;
		selfBitmap.scaleX = 0.7;
		selfBitmap.scaleY = 0.7;
		backLayer.addChild(selfBitmap);
		//添加电脑出拳图片
		enemyBitmap = new LBitmap(new LBitmapData(imgList["shitou"]));
		enemyBitmap.x = 400+50;
		enemyBitmap.y = 150;
		enemyBitmap.scaleX = 0.7;
		enemyBitmap.scaleY = 0.7;
		backLayer.addChild(enemyBitmap);
		//绘制玩家名字
		var name  = new LTextField();
		name.x = selfBitmap.x+name.getWidth()+20;
		name.y = 105;
		name.text = "玩家";
		name.size = 30;
		name.color = "#ef2c2c";
		name.weight = "bolder";
		backLayer.addChild(name);
		//绘制电脑名字
		var name  = new LTextField();
		name.x = enemyBitmap.x+name.getWidth()+20;
		name.y = 105;
		name.text = "电脑";
		name.size = 30;
		name.color = "#ef2c2c";
		name.weight = "bolder";
		backLayer.addChild(name);
	}
	function initResultLayer(){
		resultLayer  = new LSprite();
		resultLayer.graphics.drawRect(4,"#ff8800",[0,0,150,110],true,"#fff");
		resultLayer.x = 10;
		resultLayer.y = 100;
		backLayer.addChild(resultLayer);
		//绘制胜利
		winText  = new LTextField();
		winText.x = 10;
		winText.y = 40;
		winText.text = "胜利次数 : 0";
		winText.color = "#ef2c2c";
		winText.weight = "bolder";
		resultLayer.addChild(winText);
		//绘制总次数
		allText  = new LTextField();
		allText.x = 10;
		allText.y = 20;
		allText.text = "猜拳次数 : 0";
		allText.color = "#ef2c2c";
		allText.weight = "bolder";
		resultLayer.addChild(allText);
		//绘制失败
		lossText  = new LTextField();
		lossText.x = 10;
		lossText.y = 60;
		lossText.text = "失败次数 : 0";
		lossText.color = "#ef2c2c";
		lossText.weight = "bolder";
		resultLayer.addChild(lossText);
		//绘制平局
		drawText  = new LTextField();
		drawText.x = 10;
		drawText.y = 80;
		drawText.text = "平局次数 : 0";
		drawText.color = "#ef2c2c";
		drawText.weight = "bolder";
		resultLayer.addChild(drawText);
	}
	function initClickLayer(){
		clickLayer  = new LSprite();
		clickLayer.graphics.drawRect(4,"#ff8800",[0,0,300,110],true,"#fff");
		clickLayer.x = 250;
		clickLayer.y = 275;
		backLayer.addChild(clickLayer);
		msgText = new LTextField();
		msgText.text = "请出拳 : ";
		msgText.weight = "bolder";
		msgText.x = 10;
		msgText.y = 10;
		clickLayer.addChild(msgText);
		var btnST = getButton("shitou");
		btnST.x = 30;
		btnST.y = 35;
		clickLayer.addChild(btnST);
		var btnJD = getButton("jiandao");
		btnJD.x = 115;
		btnJD.y = 35;
		clickLayer.addChild(btnJD);
		var btnB = getButton("bu");
		btnB.x = 200;
		btnB.y = 35;
		clickLayer.addChild(btnB);
	}
	function getButton(name){
		var btnUp = new LBitmap(new LBitmapData(imgList[name]));
		btnUp.scaleX = 0.5;
		btnUp.scaleY = 0.5;
		var btnOver = new LBitmap(new LBitmapData(imgList[name]));
		btnOver.scaleX = 0.5;
		btnOver.scaleY = 0.5;
		btnOver.x = 2;
		btnOver.y = 2;
		var btn = new LButton(btnUp,btnOver);
		btn.addEventListener(LMouseEvent.MOUSE_UP,onclick);
		btn.name = name;
		return btn;
	}
	function onclick(event,display){
		var selfValue,enemyValue,self,enemy;
		if(display.name == "shitou"){
			selfValue = "shitou";
			self = 0;
		}else if(display.name == "jiandao"){
			selfValue = "jiandao";
			self = 1;
		}else if(display.name == "bu"){
			selfValue = "bu";
			self = 2;
		}
		enemyValue = Math.floor(Math.random()*3);
		if(enemyValue == 0){
			enemyValue = "shitou";
			enemy = 0;
		}else if(enemyValue == 1){
			enemyValue = "jiandao";
			enemy = 1;
		}else if(enemyValue == 2){
			enemyValue = "bu";
			enemy = 2;
		}
		console.log(selfValue+"--"+enemyValue);
		selfBitmap.bitmapData = new LBitmapData(imgList[selfValue]);
		enemyBitmap.bitmapData = new LBitmapData(imgList[enemyValue]);
		var checkList = [[0,1,-1],[-1,0,1,],[1,-1,0]];
		var res = checkList[self][enemy];
		if(res == -1){
			loss += 1;
		}else if(res == 1){
			win += 1;
		}else{
			draw += 1;
		}
		winText.text = "胜利次数 : " + win;
		lossText.text = "失败次数 : " + loss;
		drawText.text = "平局次数 : " + draw;
		allText.text = "猜拳次数 : " + (win+loss+draw);
	}
</script>