[英]javascript minesweeper expand messing up counter
I made a minesweeper game in javascript, which was finally running pretty smoothly, until i added the "expand()" function (see below). 我在javascript中制作了一个扫雷游戏,最后运行起来非常顺利,直到我添加了“expand()”功能(见下文)。 I have 3 issues:
我有3个问题:
The relevant code and a link is below these 2 images 相关代码和链接低于这两个图像
var flippedCount = 0;
var alreadySetAsZero = [];
var columnAmount = 10;
function processClick(clicked) { //i use a "(this)" to pass as "(clicked)"
nextToBombCheck( parseInt(clicked.id) );
checkWin();
}
nextToBombCheck( boxNum ) {
flippedCount++;
document.getElementById("flipped").innerHTML = flippedCount;
//long function setting "bombCount" to # bombs around clicked square goes here
if ( bombCount !== 0 ) {
//blah blah blah
} else {
alreadySetAsZero[ boxNum ] = "yes";
expand(boxNum);
}
}
function expand( emptyBoxId ) {
checkRightOfEmpty( emptyBoxId + 1 );
checkLeftOfEmpty( emptyBoxId - 1 );
checkAboveEmpty( emptyBoxId - columnAmount );
checkBelowEmpty( emptyBoxId + columnAmount );
}
function checkRightOfEmpty( boxToTheRightId ) {
//check if already marked as zero
if ( alreadySetAsZero[ boxToTheRightId ] === "yes" )
return;
//if box is at the edge
if ( boxToTheRightId % columnAmount === ( 0 ) ) {
//do nothing
} else {
nextToBombCheck( boxToTheRightId );
}
}
//and the rest are 3 similar functions
I was not able to find a pattern with the lack of expansion or numbers added to flipped count. 我无法找到缺少扩展的模式或添加到翻转计数的数字。
ps sorry about the title i dont know what else to call it ps抱歉标题我不知道还有什么叫它
You are getting an incorrect count because your algorithm doesn't take into account squares that have already been flipped - resulting is squares getting counted twice. 您得到的计数不正确,因为您的算法没有考虑已翻转的正方形 - 导致正方形计数两次。
The simplest way to keep an accurate count of the is to make use of that fact that 'getElementsByClassName' returns a live node list. 保持准确计数的最简单方法是利用'getElementsByClassName'返回实时节点列表的事实。
Note: getElementsByClassName has pretty good browser support , but if your browser requirements are different, you will need to adjust this a bit. 注意:getElementsByClassName具有非常好的浏览器支持 ,但如果您的浏览器要求不同,则需要稍微调整一下。
On entry, initialize the list (variable name just to differentiate from previous name): 在输入时,初始化列表(变量名称只是为了区别于以前的名称):
var newFlippedCount = document.getElementsByClassName('flipped');
Each time you update a square with a bomb count class use this instead (adds the flipped class as well): 每次使用炸弹计数类更新正方形时,请使用此替换(也添加翻转的类):
document.getElementById(boxNum).className = classList[bombCount] + ' flipped';
When you update the UI with the new flipped count use: 使用新的翻转计数更新UI时,请使用:
document.getElementById("flipped").innerHTML = newFlippedCount.length;
Your count is now magically correct :) 你的数量现在神奇地正确:)
Note: you could also solve this by checking to see if the box has already been flipped before incrementing flippedCount
. 注意:你也可以通过在递增
flippedCount
之前检查框是否已被翻转来解决这个flippedCount
。
You were also periodically getting an error in the console: 您还在控制台中定期收到错误:
Uncaught TypeError: Cannot set property 'className' of null
at this line (around line: 298): 在这一行(约线:298):
document.getElementById(boxNum).className = classList[bombCount]; document.getElementById(boxNum).className = classList [bombCount];
You should protect that either by checking the bounds or just by checking the return value before using it: 您应该通过检查边界或仅在使用之前检查返回值来保护它:
var ele = document.getElementById(boxNum);
if(!ele) return;
ele.className = classList[bombCount] + ' flipped';
Edit: If you are interested, here is a high level overview of the Minesweeper Cascade Algorithm 编辑:如果您有兴趣,这里是扫雷级联算法的高级概述
Update - cascade bug found 更新 - 找到级联错误
One of the reasons the cascade wasn't working correctly on successive replays is that the variable used to track cells that had already been set to zero wasn't getting reset in a new game. 级联在连续重放时无法正常工作的原因之一是用于跟踪已设置为零的单元格的变量未在新游戏中重置。 For a fix:
要修复:
function start() {
…
// Reset to empty array
alreadySetAsZero = [];
...
}
Updated fiddle with additional debug statements to help find the problem: 更新了其他调试语句以帮助查找问题:
Although you use "alreadySetAsZero" to stop squares being counted multiple times, this doesn't take into account squares with a bomb count. 虽然您使用“alreadySetAsZero”来停止多次计算正方形,但这并未考虑具有炸弹计数的正方形。 These will be counted multiple times in your expand method.
这些将在您的展开方法中多次计算。
i found the problem that was bothering me (the counter) it counted the squares "-1" and "100" 我发现困扰我的问题(柜台)它计算了方块“-1”和“100”
i then added || boxToTheRightId > ( cellAmount - 1 )
然后我加了
|| boxToTheRightId > ( cellAmount - 1 )
|| boxToTheRightId > ( cellAmount - 1 )
to checkRightOfEmpty
and || boxToTheRightId < 0
|| boxToTheRightId > ( cellAmount - 1 )
checkRightOfEmpty
和|| boxToTheRightId < 0
|| boxToTheRightId < 0
to checkLeftOfEmpty
(in their if
statements) and it works just fine, thanks anyway guys. || boxToTheRightId < 0
to checkLeftOfEmpty
(在他们的if
语句中)并且它工作得很好,谢谢你们。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.