在线试玩地址是
http://www.lonelystar.org/WINMINE
Code：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>project.xds</title>
<mce:style><!--
.flag {
background-image: url(http://hi.csdn.net/attachment/201006/1/0_1275380573QM11.gif) !important;
}
.bomb{
background-image: url(http://hi.csdn.net/attachment/201006/1/0_1275380578ue8R.gif) !important;
}
.errbomb{
background-image: url(http://hi.csdn.net/attachment/201006/1/0_1275380583hhzj.gif) !important;
}
--></mce:style><style mce_bogus="1"> .flag {
background-image: url(http://hi.csdn.net/attachment/201006/1/0_1275380573QM11.gif) !important;
}
.bomb{
background-image: url(http://hi.csdn.net/attachment/201006/1/0_1275380578ue8R.gif) !important;
}
.errbomb{
background-image: url(http://hi.csdn.net/attachment/201006/1/0_1275380583hhzj.gif) !important;
}
</style>
<link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.0/resources/css/ext-all.css" mce_href="http://extjs.cachefly.net/ext-3.2.0/resources/css/ext-all.css"/>
<mce:script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.0/adapter/ext/ext-base.js" mce_src="http://extjs.cachefly.net/ext-3.2.0/adapter/ext/ext-base.js"></mce:script>
<mce:script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.0/ext-all-debug.js" mce_src="http://extjs.cachefly.net/ext-3.2.0/ext-all-debug.js"></mce:script>
<mce:script type="text/javascript"><!--
MyContainerUi = Ext.extend(Ext.Container, {
autoEl: 'div',
452,
height: 357,
layout: 'auto',
tpl: '',
initComponent: function() {
this.items = [];
function handleClick(button){
alert(button.itemId + ' was clicked.');
}
MyContainerUi.superclass.initComponent.call(this);
}
});
MyContainer = Ext.extend(MyContainerUi, {
initComponent: function() {
MyContainer.superclass.initComponent.call(this);
}
});
var dataGame = new Array();
var dataGameIsOpen = new Array();
var dataFlag = new Array();
var heightGame=10, widthGame=10;
var bombCount=5;
var TimeElapsed = 500;
var loopTimeStamp = 0;
var timer = null;
var rightClickBtn = -1;
Ext.onReady(function() {
var myContainer = new MyContainer({
renderTo: Ext.getBody()
});
var i,j;
var strFlag='';
myContainer.removeAll();
myContainer.add( {
xtype: 'container',
autoEl: 'div',
layout: 'hbox',
id:'header',
items: [
{
xtype: 'button',
text: 'NewGame',
height: 20,
listeners: {click: handleNewGame}
},
{
"xtype": "progress",
"value": 0.4,
itemId:'progressGame',
140,
value:1
}
]
} );
initGame( dataGame );
for( i=0; i<heightGame; i++ )
{
myContainer.add( {
xtype: 'container',
autoEl: 'div',
layout: 'hbox',
id:'line'+i,
items: []
} );
for( j=0;j<widthGame; j++ )
{
dataGameIsOpen[i*widthGame+j] = false; // 全部设置未打开
Ext.ComponentMgr.get('line'+i).add({
xtype: 'button',
text: '',
height: 20,
20,
iconCls:strFlag,
itemId: 'bt_'+(i*widthGame+j),
listeners: {click: handleBtnClick,mouseover: handleBtnMouseOver},
btnIndex:i*widthGame+j
});
}
}
myContainer.doLayout();
myContainer.show();
});
function handleNewGame()
{
var i=0,j=0;
for( i=0; i<heightGame*widthGame; i++ )
{
dataGame[i] = 0;
dataGameIsOpen[i]=false;
}
initGame( dataGame );
for( i=0; i<heightGame; i++ )
{
for( j=0;j<widthGame; j++ )
{
Ext.ComponentMgr.get('line'+i).get('bt_'+(i*widthGame+j)).setVisible(true);
Ext.ComponentMgr.get('line'+i).get('bt_'+(i*widthGame+j)).setText('');
Ext.ComponentMgr.get('line'+i).get('bt_'+(i*widthGame+j) ).setIconClass('');
}
}
}
function initGame( dataGame )
{
var i,j;
// 生成雷
for( i=0; i<bombCount; i++ )
{
var randomnum = Math.floor(Math.random()*100) % (heightGame*widthGame);
dataGame[randomnum ] = -1;
}
for( i=0;i<heightGame;i++ )
{
for( j=0; j<widthGame; j++ )
{
dataFlag[i*widthGame+j]=0;
if( dataGame[i*widthGame+j] != -1 )
{
dataGame[i*widthGame+j] = getBombCount( j, i, dataGame );
}
}
}
TimeElapsed = 500;
Ext.ComponentMgr.get('header').get('progressGame').updateProgress(1,TimeElapsed);
if( timer )
clearInterval(timer);
timer = setInterval( loopTime, 100 );
}
function loopTime()
{
loopTimeStamp++;
if( loopTimeStamp>=10 )
{
TimeElapsed--;
if( TimeElapsed<0 )
{
GameOver();
return;
}
Ext.ComponentMgr.get('header').get('progressGame').updateProgress(TimeElapsed/500,TimeElapsed);
loopTimeStamp = 0;
}
}
function GameOver(){
var i=0;
for( i=0; i<widthGame*heightGame; i++ )
{
if( dataGame[i] == -1 )
Ext.ComponentMgr.get('line'+Math.floor(i/widthGame)).get('bt_'+i ).setIconClass('bomb');
else if( dataFlag[i] == 1 )
{
Ext.ComponentMgr.get('line'+Math.floor(i/widthGame)).get('bt_'+i ).setIconClass('errbomb');
}
}
alert("Game Over!!");
clearInterval(timer);
timer = null;
//handleNewGame();
}
function handleBtnClick( btn ){
var nY = Math.floor(btn.btnIndex/widthGame);
var nX = btn.btnIndex%widthGame;
if( dataFlag[btn.btnIndex] == 1 )
return;
if(dataGame[btn.btnIndex] == -1 )
GameOver();
else
{
// 递归翻开
Open(nX, nY);
}
if( CheckAllOpen() )
alert("Well Done!Time Used "+ (500-TimeElapsed)+' Second.');
}
function handleBtnMouseOver( btn ){
rightClickBtn = btn.btnIndex;
}
function getBombCount( nX, nY, dataGame )
{
var nCount = 0;
var i,j;
for( i=nY-1; i<=nY+1; i++ )
{
for( j=nX-1; j<=nX+1; j++ )
{
if( i>=0 && i<heightGame && j>=0 && j<widthGame && (i!=nY || j != nX) )
{
if( dataGame[i*widthGame+j]==-1 )
{
nCount++;
}
}
}
}
return nCount;
}
function Open( nX, nY )
{
var i,j;
var nIndex = nY*widthGame + nX;
if( nX<0 || nX>=widthGame || nY<0 || nY>=heightGame )
return;
if( dataGameIsOpen[nIndex] == true )
return;
if( dataFlag[nIndex] == 1 )
return;
if( dataGame[nIndex]==0 )
{
dataGameIsOpen[nIndex] = true;
Ext.ComponentMgr.get('line'+nY).get('bt_'+nIndex ).setVisible(false);
Open( nX, nY-1 );
Open( nX-1, nY );
Open( nX+1, nY );
Open( nX, nY+1 );
}
else if( dataGame[nIndex]!=-1 )
{
Ext.ComponentMgr.get('line'+nY).get('bt_'+nIndex ).setText(dataGame[nIndex]);
dataGameIsOpen[nIndex] = true;
}
}
function CheckAllOpen()
{
var i=0;
for( i=0; i<heightGame*widthGame; i++ )
if( dataGameIsOpen[i]==false && dataGame[i] != -1 )
return false;
return true;
}
document.oncontextmenu = function(){
if( rightClickBtn>= 0 && dataGameIsOpen[rightClickBtn]==false )
{
dataFlag[rightClickBtn]++;
if( dataFlag[rightClickBtn]>=3 )
dataFlag[rightClickBtn] = 0;
var nY = Math.floor(rightClickBtn/widthGame);
var nX = rightClickBtn%widthGame;
switch( dataFlag[rightClickBtn] )
{
case 0:
Ext.ComponentMgr.get('line'+nY).get('bt_'+rightClickBtn ).setIconClass('');
Ext.ComponentMgr.get('line'+nY).get('bt_'+rightClickBtn ).setText('');
break;
case 1:
Ext.ComponentMgr.get('line'+nY).get('bt_'+rightClickBtn ).setIconClass('flag');
Ext.ComponentMgr.get('line'+nY).get('bt_'+rightClickBtn ).setText('');
break;
case 2:
Ext.ComponentMgr.get('line'+nY).get('bt_'+rightClickBtn ).setIconClass('');
Ext.ComponentMgr.get('line'+nY).get('bt_'+rightClickBtn ).setText('?');
break;
}
return false;
}
return true;
}
// --></mce:script>
</head>
<body></body>
</html>