Various changes
Added help text Removed unused variables Refactored "add new mine" functionality Added funcionality for removing cleared columns (disabled for now)
This commit is contained in:
synth-ruiner
parent
6fddbbf5d2
commit
76aa1592d8
170
index.html
170
index.html
|
|
@ -66,8 +66,8 @@
|
|||
}
|
||||
|
||||
#setup h1 {
|
||||
margin-top: 8vmin;
|
||||
margin-bottom: 8vmin;
|
||||
margin-top: 6vmin;
|
||||
margin-bottom: 6vmin;
|
||||
}
|
||||
|
||||
#setup h2 {
|
||||
|
|
@ -109,7 +109,7 @@
|
|||
|
||||
position: absolute;
|
||||
left: 38vmin;
|
||||
top: 59vmin;
|
||||
top: 75vmin;
|
||||
|
||||
background: #768087;
|
||||
background: -moz-linear-gradient(top, #768087 0%, #53595e 100%);
|
||||
|
|
@ -207,17 +207,25 @@
|
|||
li.mines8 {
|
||||
color: #8c4600;
|
||||
}
|
||||
|
||||
p {
|
||||
color: #fff;
|
||||
font-size: 4.3vmin;
|
||||
padding: 0 10vmin;
|
||||
}
|
||||
|
||||
strong {
|
||||
color: #fe7ac6;
|
||||
}
|
||||
</style>
|
||||
<script src="jquery-2.1.3.min.js"></script>
|
||||
<script>
|
||||
var gameBoardWidth = 10;
|
||||
var gameBoardHeight = 9;
|
||||
var score = 0;
|
||||
var bombs = 1;
|
||||
var firstClick = true;
|
||||
var currentlyIterating = false;
|
||||
var mineChance = 0.2;
|
||||
var inputEnabled = true;
|
||||
var clickholdMs = 200;
|
||||
var timeout; //hold timer
|
||||
var mouseHeld = false;
|
||||
|
|
@ -232,15 +240,20 @@
|
|||
|
||||
$('#game ul').each(function() {
|
||||
for (var i = 0; i < gameBoardWidth; i++) {
|
||||
if (Math.random() < mineChance) {
|
||||
$(this).append('<li class="mine"></li>');
|
||||
} else {
|
||||
$(this).append("<li></li>");
|
||||
}
|
||||
$(this).append(newTile());
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function newTile() {
|
||||
if (Math.random() < mineChance) {
|
||||
return '<li class="mine"></li>';
|
||||
} else {
|
||||
return '<li></li>';
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
$.fn.checkRow = function() {
|
||||
//unclicked tiles
|
||||
if ($(this).children('li:not(.revealed):not(.flagged)').length > 0) {
|
||||
|
|
@ -260,6 +273,25 @@
|
|||
return true;
|
||||
}
|
||||
|
||||
$.fn.checkColumn = function() {
|
||||
//unclicked tiles
|
||||
if ($(this).column().filter(':not(.revealed):not(.flagged)').length > 0) {
|
||||
return false;
|
||||
}
|
||||
|
||||
//incorrectly flagged tiles
|
||||
if ($(this).column().filter('.flagged:not(.mine)').length > 0) {
|
||||
return false;
|
||||
}
|
||||
|
||||
//clicked mines
|
||||
if ($(this).column().filter('.revealed.mine').length > 0) {
|
||||
return false;
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
window.removeClearedRows = function() {
|
||||
var rowsToRemove = $('#game ul:not(.removing)').filter(function() {
|
||||
return $(this).checkRow();
|
||||
|
|
@ -273,55 +305,73 @@
|
|||
|
||||
rowsToRemove.each(function() {
|
||||
score += $(this).children('.mine').length;
|
||||
});
|
||||
|
||||
rowsToRemove.slideUp("slow", function() {
|
||||
$(this).remove();
|
||||
//add new row on bottom
|
||||
|
||||
$('#game').append('<ul></ul>');
|
||||
|
||||
for (var i = 0; i < gameBoardWidth; i++) {
|
||||
if (Math.random() < mineChance) {
|
||||
$('#game ul').last().append('<li class="mine"></li>');
|
||||
} else {
|
||||
$('#game ul').last().append('<li></li>');
|
||||
}
|
||||
$('#game ul').last().append(newTile());
|
||||
}
|
||||
});
|
||||
|
||||
inputEnabled = false;
|
||||
|
||||
rowsToRemove.slideUp("slow", function() {
|
||||
$(this).remove();
|
||||
|
||||
$('li.revealed:not(.mine)').each(function() {
|
||||
$(this).text(
|
||||
$(this).countMinesText()
|
||||
);
|
||||
|
||||
//remove "mines1" etc
|
||||
|
||||
var mine = $(this).hasClass("mine");
|
||||
|
||||
$(this).removeAttr("class");
|
||||
|
||||
if (mine) {
|
||||
$(this).addClass("mine");
|
||||
} else {
|
||||
$(this).addClass(
|
||||
"mines" + $(this).countMinesText()
|
||||
);
|
||||
}
|
||||
|
||||
$(this).addClass("revealed");
|
||||
});
|
||||
|
||||
//refresh last row to reflect new rows beneath
|
||||
$('li.revealed').last().parent().children('li.revealed').mouseup();
|
||||
refreshMineCounts();
|
||||
|
||||
//click blank tiles
|
||||
$('li.revealed:not(.mine):empty').mouseup();
|
||||
});
|
||||
}
|
||||
|
||||
inputEnabled = true;
|
||||
window.removeClearedColumns = function() {
|
||||
var columnsToRemove = $('ul:not(.removing):eq(0) li:not(.removing)').filter(function() {
|
||||
return $(this).checkColumn();
|
||||
});
|
||||
|
||||
if (columnsToRemove.length == 0) return;
|
||||
|
||||
columnsToRemove.addClass("removing");
|
||||
|
||||
columnsToRemove.each(function() {
|
||||
score += $(this).column().filter('.mine').length;
|
||||
});
|
||||
|
||||
columnsToRemove.each(function() {
|
||||
$(this).column().animate({width: 0, borderRadius: 0, padding: 0}, "slow", function() {
|
||||
$(this).parent().append(newTile());
|
||||
$(this).remove();
|
||||
|
||||
refreshMineCounts();
|
||||
|
||||
//click blank tiles
|
||||
$('li.revealed:not(.mine):empty').mouseup();
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function refreshMineCounts() {
|
||||
$('li.revealed:not(.mine)').each(function() {
|
||||
$(this).text(
|
||||
$(this).countMinesText()
|
||||
);
|
||||
|
||||
//remove "mines1" etc
|
||||
|
||||
var mine = $(this).hasClass("mine");
|
||||
|
||||
$(this).removeAttr("class");
|
||||
|
||||
if (mine) {
|
||||
$(this).addClass("mine");
|
||||
} else {
|
||||
$(this).addClass(
|
||||
"mines" + $(this).countMinesText()
|
||||
);
|
||||
}
|
||||
|
||||
$(this).addClass("revealed");
|
||||
});
|
||||
}
|
||||
|
||||
function updateScore() {
|
||||
|
|
@ -360,6 +410,18 @@
|
|||
return $(this).parent('ul').next();
|
||||
}
|
||||
|
||||
$.fn.column = function() {
|
||||
var x = $(this).getX();
|
||||
|
||||
var column = $('');
|
||||
|
||||
$('ul').each(function() {
|
||||
column = column.add($(this).children().eq(x));
|
||||
});
|
||||
|
||||
return column;
|
||||
}
|
||||
|
||||
$.fn.getX = function() {
|
||||
return $(this).index();
|
||||
}
|
||||
|
|
@ -528,10 +590,7 @@
|
|||
}
|
||||
|
||||
$.fn.rightClick = function() {
|
||||
if ($(this).hasClass("revealed")) {
|
||||
//deploy a bomb!
|
||||
//...
|
||||
} else {
|
||||
if (!$(this).hasClass("revealed")) {
|
||||
$(this).toggleClass("flagged");
|
||||
}
|
||||
|
||||
|
|
@ -549,6 +608,7 @@
|
|||
|
||||
timeout = setTimeout(function() {
|
||||
$('ul:eq(' + y + ') li:eq(' + x + ')').rightClick();
|
||||
|
||||
mouseHeld = true;
|
||||
}, clickholdMs);
|
||||
});
|
||||
|
|
@ -562,8 +622,6 @@
|
|||
|
||||
clearTimeout(timeout);
|
||||
|
||||
if (!inputEnabled) return;
|
||||
|
||||
if (mouseHeld) {
|
||||
mouseHeld = false;
|
||||
return;
|
||||
|
|
@ -585,6 +643,7 @@
|
|||
}
|
||||
|
||||
removeClearedRows();
|
||||
//removeClearedColumns();
|
||||
checkGameOver();
|
||||
|
||||
updateScore();
|
||||
|
|
@ -602,7 +661,6 @@
|
|||
<div id="game"></div>
|
||||
<div id="stats">
|
||||
<div id="score">Score: 0</div>
|
||||
<div id="bombs" style="display: none;">Bombs: 0</div>
|
||||
<div id="mines">Mines left: 0</div>
|
||||
</div>
|
||||
<div id="gameOver">
|
||||
|
|
@ -612,6 +670,12 @@
|
|||
<div id="setup">
|
||||
<h1>endless mines</h1>
|
||||
|
||||
<p>
|
||||
<strong>left click</strong> or <strong>tap</strong> to clear a tile. <br>
|
||||
<strong>right click</strong> or <strong>hold</strong> to flag a mine. <br>
|
||||
rows with <strong>exploded mines</strong> cannot be cleared.
|
||||
</p>
|
||||
|
||||
<h2>Difficulty</h2>
|
||||
|
||||
<div class="centre">
|
||||
|
|
|
|||
Loading…
Reference in New Issue