<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>HTML5-lufyLegend测试</title>
<script type="text/javascript" src="js/lufylegend-1.5.1.min.js"></script>
<script type="text/javascript" src="js/Box2dWeb-2.1.a.3.min.js"></script>
<script type="text/javascript" src="js/jquery-1.10.2.js"></script>
<script type="text/javascript">
$(function(){
var backLayer = "";
var resultLayer = "";
var clickLayer = "";
var loadingLayer = "";
var enmeyBitmap = "";
var selfBitmap = "";
var imageList = {};
var showList = []; var selfTextAll="";
var selfTextWin="";
var selfTextLoss="";
var selfTextEq="";
var win = 0;
var lost = 0;
var eq = 0;
var imageData = new Array(
{ name:"title",path:"image/title.png"},
{ name:"shitou",path:"image/shitou.png"},
{ name:"jiandao",path:"image/jiandao.png"},
{ name:"bu",path:"image/bu.png"}
);
init(50,"mylegend",1500,500,main);
function main(){
backLayer = new LSprite();
addChild(backLayer);
loadingLayer = new LoadingSample3();
backLayer.addChild(loadingLayer);
LLoadManage.load(imageData,
function(data){
loadingLayer.setProgress(data);
},function(result){
imageList = result;
backLayer.removeChild(loadingLayer);
loadingLayer = null;
//游戏界面初始化
gameInit();
});
}
function gameInit(){
showList.push(new LBitmapData(imageList["shitou"]));
showList.push(new LBitmapData(imageList["jiandao"]));
showList.push(new LBitmapData(imageList["bu"]));
var titleBitmap = new LBitmap(new LBitmapData(imageList["title"]));
titleBitmap.x = 100;
titleBitmap.y = 10;
backLayer.addChild(titleBitmap);
//名称设定
var selfText = new LTextField();
selfText.text="玩家";
selfText.color="white";
selfText.weight = "bold";
selfText.x = 215;
selfText.y = 90;
backLayer.addChild(selfText);
//玩家方出拳图片
selfBitmap = new LBitmap(showList[0]);
selfBitmap.x = 170;
selfBitmap.y = 110;
backLayer.addChild(selfBitmap);
//我放出拳图片
enmeyBitmap = new LBitmap(showList[1]);
enmeyBitmap.x = 350;
enmeyBitmap.y = 110;
backLayer.addChild(enmeyBitmap);
//名称设定
var selfText = new LTextField();
selfText.text="电脑";
selfText.color="white";
selfText.x = 400;
selfText.weight = "bold";
selfText.y = 90;
backLayer.addChild(selfText);
backLayer.graphics.drawRect(1,"black",[0,0,600,700],true,"black");
backLayer.x = 300;
backLayer.y = 100;
//结果显示初始化
initialResult();
//操作层初始化
initialClick();
}
function initialResult(){
resultLayer = new LSprite();
resultLayer.graphics.drawRect(1,"black",[0,0,150,100],true,"white");
resultLayer.x = 10;
resultLayer.y = 117;
backLayer.addChild(resultLayer);
selfTextAll = new LTextField();
selfTextAll.text = "猜拳次数:0";
selfTextAll.x = 10;
selfTextAll.y = 10;
resultLayer.addChild(selfTextAll); selfTextWin = new LTextField();
selfTextWin.text = "胜利次数:0";
selfTextWin.x = 10;
selfTextWin.y = 30;
resultLayer.addChild(selfTextWin); selfTextLoss = new LTextField();
selfTextLoss.text = "失败次数:0";
selfTextLoss.x = 10;
selfTextLoss.y = 50;
resultLayer.addChild(selfTextLoss); selfTextEq = new LTextField();
selfTextEq.text = "平局次数:0";
selfTextEq.x = 10;
selfTextEq.y = 70;
resultLayer.addChild(selfTextEq);
} function initialClick(){
clickLayer = new LSprite();
clickLayer.graphics.drawRect(1,"black",[0,0,250,100],true,"white");
clickLayer.x = 200;
clickLayer.y = 280;
backLayer.addChild(clickLayer);
var text1 =new LTextField();
text1.text="请出拳";
text1.x = 10;
text1.y = 10;
clickLayer.addChild(text1);
var btn_Shitou = getButton("shitou");
var btn_Jiandao = getButton("jiandao");
var btn_Bu = getButton("bu");
btn_Shitou.x = 10;
btn_Shitou.y = 30;
btn_Jiandao.x = 90;
btn_Jiandao.y = 30;
btn_Bu.x = 170;
btn_Bu.y = 30;
btn_Shitou.addEventListener(LMouseEvent.MOUSE_UP,onclick);
btn_Jiandao.addEventListener(LMouseEvent.MOUSE_UP,onclick);
btn_Bu.addEventListener(LMouseEvent.MOUSE_UP,onclick);
clickLayer.addChild(btn_Shitou);
clickLayer.addChild(btn_Jiandao);
clickLayer.addChild(btn_Bu);
} function onclick(event,display){
var self,enmey;
if(display.name == "shitou"){
self = 0;
}else if(display.name == "jiandao"){
self = 1;
}else {
self = 2;
}
enmey = Math.floor(Math.random()*3);
selfBitmap.bitmapData = showList[self];
enmeyBitmap.bitmapData = showList[enmey];
var checkList = [[0,1,-1],[-1,0,1],[1,-1,0]];
var result = checkList[self][enmey];
if(result == -1){
lost +=1;
} else if(result == 1){
win+=1;
}else{
eq+=1;
}
selfTextAll.text = "猜拳次数:"+(lost+eq+win);
selfTextWin.text = "胜利次数:"+win;
selfTextLoss.text = "失败次数:"+lost;
selfTextEq.text = "平局次数:"+eq;
} function getButton(flag){
var btn_UP = new LBitmap(new LBitmapData(imageList[flag]));
btn_UP.scaleX= 0.5;
btn_UP.scaleY= 0.5;
var btn_Over = new LBitmap(new LBitmapData(imageList[flag]));
btn_Over.scaleX= 0.5;
btn_Over.scaleY= 0.5;
btn_Over.x = 1;
btn_Over.y = 1;
var btn = new LButton(btn_UP, btn_Over);
btn.name = flag;
return btn;
} });
</script>
</head>
<body>
<div id="mylegend">loading...</div>
</body>
</html>

HTML5(石头剪刀布游戏开发)的更多相关文章

  1. Html5 Egret游戏开发 成语大挑战(一)开篇

    最近接触了Egret白鹭引擎,感觉非常好用,提供了各种各样的开发工具让开发者和设计者更加便捷,并且基于typescript语言开发省去了很多学习成本,对于我们这种掉微软坑许久的童鞋来说,确实很有吸引力 ...

  2. Phaser是一款专门用于桌面及移动HTML5 2D游戏开发的开源免费框架

    Phaser是一款专门用于桌面及移动HTML5 2D游戏开发的开源免费框架,提供JavaScript和TypeScript双重支持,内置游戏对象的物理属性,采用Pixi.js引擎以加快Canvas和W ...

  3. HTML5 Canvas游戏开发实战 PDF扫描版

    HTML5 Canvas游戏开发实战主要讲解使用HTML5 Canvas来开发和设计各类常见游戏的思路和技巧,在介绍HTML5 Canvas相关特性的同时,还通过游戏开发实例深入剖析了其内在原理,让读 ...

  4. HTML5物理游戏开发 - 越野山地自行车(三)粉碎自行车

    自上一章公布到如今已时隔四月,实在对不住大家.让大家久等了~话说不是我不关注我的博客,而是事情一多起来写博客的时间就少了. 待到今日有空了,回头看了看自己曾经写的文章,猛得发现已经四个月不曾写文章了. ...

  5. Html5 Egret游戏开发 成语大挑战(八)一般性二级页面处理

    在游戏中,我们一般会有各种各样的二级页面,比如游戏暂停界面或者游戏结束界面,这些界面组成了对玩家交互主要手段,在游戏开发中,对于这些界面的coding组织是非常有学问的,如果倒退到十年前,游戏开发的老 ...

  6. Html5 Egret游戏开发 成语大挑战(六)游戏界面构建和设计

    本篇将主要讲解游戏界面的构建和设计,会应用到egret.eui的自定义组件,可以很直观的构建一个游戏整体,这里我们仍然只需要使用EgretWing就可以达到目的,本篇可能是篇幅最少的一个,但是涉及自定 ...

  7. HTML5 Canvas游戏开发(三)lufylegend开源库件(上)

    lufylegend可以解决HTML5开发游戏中会遇到的一些问题: 1.各种浏览器对于JavaScript和HTML的解析是不一致的. 2.手机浏览器和PC浏览器的区别. 3.JavaScript并非 ...

  8. Html5 Egret游戏开发 成语大挑战(九)设置界面和声音管理

    在上一篇中,简单的使用界面元素快速实现了一个游戏中的二级页面,这种直接在游戏页面上做UI的做法并不太好,原因是,UI会让游戏的压力变大,即使它是隐蔽的,如果同样的功能在其它的地方也是一样的,那么就要写 ...

  9. Html5 Egret游戏开发 成语大挑战(七)游戏逻辑和数据处理

    本篇在前面的基础上,将进行逻辑的编码开发让游戏能够正式的玩起来,这里没有注重太多的体验细节,而是直接实现游戏的规则逻辑,将分成两个部分说明:数据处理和游戏逻辑. 初始化游戏数据 在前面的第五篇中,我们 ...

随机推荐

  1. 2016北京集训测试赛(十)Problem A: azelso

    Solution 我们把遇到一个旗子或者是遇到一个敌人称为一个事件. 这一题思路的巧妙之处在于我们要用\(f[i]\)表示从\(i\)这个事件一直走到终点这段路程中, \(i\)到\(i + 1\)这 ...

  2. codeigniter 使用

    CodeIgniter系列 记录count和分页 对于某个表的不带条件的count,可以简单的用 $total = $this->db->count_all($table_name) 来获 ...

  3. django中引入json

    try: from django.utils import simplejson as jsonexcept: import simplejson as json

  4. EasyMvc入门教程-入门

    1.EasyMvc简介 EasyMvc主要是为了丰富asp.net core mvc控件而出现的: 它提倡简单,面向对象式开发,希望能快速开发的同时,仍然保持一定的灵活性. 2.EasyMvc初相识 ...

  5. Windows网络编程 2 【转】

    Windows网络编程使用winsock.Winsock是一个基于Socket模型的API,在Windows系统中广泛使用.使用Winsock进行网络编程需要包含头文件Winsock2.h,需要使用库 ...

  6. 使用Python来编写一个简单的感知机

    来表示.第二个元素是表示期望输出的值. 这个数组定义例如以下: training_data = [  (array([0,0,1]), 0),  (array([0,1,1]), 1),  (arra ...

  7. ElasticSearch查询max_result_window问题处理

    需要出一份印地语文章的表,导出规则为: 1.所有印地语(包含各种颜色,各种状态)的文章 2.阅读数大于300 3.按照阅读推荐比进行排序,取前3000篇文章 说明: 1.文章信息,和阅读推荐数量在两个 ...

  8. Usage of API documented as @since1.6+

    Usage of API documented as @since1.6+ File ->Project Structure->Project Settings -> Modules ...

  9. Cookie常用方法封装Utils

    1.查询某个指定的cookie package com.sun.etalk.cookie; import javax.servlet.http.Cookie; public class CookieU ...

  10. 【重点突破】——SVG技术动态随机绘制圆形

    一.引言 在学习Canvas绘图技术时,做的是随机验证码的例子,在学习SVG绘图技术时,同样也有一个随机绘制的例子——动态随机绘制圆形.这个练习,即综合了多种SVG技术的知识点,又很具有艺术感,随机生 ...