Skip to content

Instantly share code, notes, and snippets.

@yoo2001818

yoo2001818/index.css

Created September 20, 2015 10:58
Show Gist options
  • Save yoo2001818/d3153f3cbeb84cc5c408 to your computer and use it in GitHub Desktop.
Save yoo2001818/d3153f3cbeb84cc5c408 to your computer and use it in GitHub Desktop.
Download ZIP
Minesweeper
Raw
index.css
.mine {
width: 24pt;
height: 24pt;
background-color: #fff;
border-radius: 2pt;
text-align: center;
font-size: 16pt;
font-weight: bold;
}
.mine.hidden{
background-color: #ccc;
}
.mine.reveal{
background-color: #eee;
}
.mine.flag{
background-color: #88f;
}
.mine.boom{
background-color: #f88;
}
#gameMap {
border: 1pt;
background-color: #666;
border-radius: 2pt;
}
Raw
index.html
<!doctype html>
<html lang="ko-KR">
<head>
<meta charset="utf-8">
<title>1</title>
<script type="text/javascript" src="index.js"></script>
<link rel="stylesheet" type="text/css" href="index.css">
</head>
<body>
<table id="gameMap">
</table>
</body>
</html>
Raw
index.js
var surrounding =
[[-1, -1], [0, -1], [1, -1],
[-1, 0], [1, 0],
[-1, 1], [0, 1], [1, 1]];
var surroundingT =
[[0, -1], [-1, 0], [0, 1], [1, 0]];
function Map(w, h, table) {
var self = this;
this.w = w;
this.h = h;
this.map = [];
this.started = false;
table.onclick = function() {
return false;
}
table.oncontextmenu = function() {
return false;
}
for(var y = 0; y < h; ++y) {
var row = document.createElement('tr');
table.appendChild(row);
this.map[y] = [];
this.map[y].table = row;
for(var x = 0; x < w; ++x) {
var column = document.createElement('td');
row.appendChild(column);
column.tx = x;
column.ty = y;
column.onclick = function() {
self.reveal(this.tx, this.ty);
self.autoReveal(this.tx, this.ty);
return false;
}
column.oncontextmenu = function() {
self.autoFlag(this.tx, this.ty);
self.toggleFlag(this.tx, this.ty);
return false;
}
/*column.onmouseover = function() {
self.autoFlag(this.tx, this.ty);
self.autoReveal(this.tx, this.ty);
}*/
this.map[y][x] = {};
this.map[y][x].table = column;
this.map[y][x].mine = false;
this.map[y][x].count = 0;
this.map[y][x].flag = false;
this.map[y][x].reveal = false;
this.updateClass(x, y);
}
}
}
Map.prototype.updateClass = function(x, y) {
var tag = this.get(x, y);
if(tag.table == null) return;
if(tag.flag) {
tag.table.className = "mine flag";
return;
}
if(!tag.reveal) {
tag.table.className = "mine hidden";
return;
}
if(tag.mine) {
tag.table.className = "mine boom";
return;
}
if(tag.count > 0) {
tag.table.innerHTML = tag.count;
}
tag.table.className = "mine reveal c"+tag.count;
}
Map.prototype.get = function(x, y) {
if(x < 0 || x >= this.w || y < 0 || y >= this.h) return {};
return this.map[y][x];
}
Map.prototype.hasMine = function(x, y) {
return this.get(x, y).mine;
}
Map.prototype.setMine = function(x, y) {
var self = this;
if(this.get(x, y).mine) return;
this.get(x, y).mine = true;
surrounding.forEach(function(value) {
self.get(x+value[0], y+value[1]).count ++;
self.updateClass(x+value[0], y+value[1]);
});
this.updateClass(x, y);
}
Map.prototype.deleteMine = function(x, y) {
var self = this;
if(!this.get(x, y).mine) return;
this.get(x, y).mine = false;
surrounding.forEach(function(value) {
self.get(x+value[0], y+value[1]).count --;
self.updateClass(x+value[0], y+value[1]);
});
this.updateClass(x, y);
}
Map.prototype.autoReveal = function(x, y) {
var self = this;
if(!this.get(x,y).reveal) return;
var countLeft = this.get(x, y).count;
surrounding.forEach(function(value) {
if(self.get(x+value[0], y+value[1]).flag) {
countLeft --;
}
});
if(countLeft == 0) {
surrounding.forEach(function(value) {
if(!self.get(x+value[0], y+value[1]).flag) {
self.reveal(x+value[0], y+value[1]);
}
});
}
}
Map.prototype.autoFlag = function(x, y) {
var self = this;
if(!this.get(x,y).reveal) return;
var countLeft = this.get(x, y).count;
surrounding.forEach(function(value) {
if(!self.get(x+value[0], y+value[1]).reveal) {
countLeft --;
}
});
if(countLeft == 0) {
surrounding.forEach(function(value) {
if(!self.get(x+value[0], y+value[1]).reveal) {
if(!self.get(x+value[0], y+value[1]).flag) {
self.toggleFlag(x+value[0], y+value[1]);
}
}
});
}
}
Map.prototype.reveal = function(x, y) {
var self = this;
if(this.get(x, y).flag) return;
if(this.get(x, y).reveal) return;
if(this.get(x, y).mine) {
if(this.started) {
for(var ty = 0; ty < this.h; ++ty) {
for(var tx = 0; tx < this.w; ++tx) {
this.get(tx, ty).flag = false;
this.get(tx, ty).reveal = true;
this.updateClass(tx, ty);
}
}
return;
} else {
this.deleteMine(x, y);
this.setMineRandom();
}
}
this.started = true;
this.get(x, y).reveal = true;
if(!self.hasMine(x, y) && self.get(x,y).count == 0) {
surrounding.forEach(function(value) {
var obj = self.get(x+value[0], y+value[1]);
self.reveal(x+value[0], y+value[1]);
});
}
this.updateClass(x, y);
}
Map.prototype.setMineRandom = function() {
while(true) {
var y = Math.random() * this.h | 0;
var x = Math.random() * this.w | 0;
if(!this.hasMine(x, y)) {
this.setMine(x, y);
return;
}
}
}
Map.prototype.toggleFlag = function(x, y) {
if(this.get(x, y).reveal) return;
this.get(x, y).flag = !this.get(x, y).flag;
this.updateClass(x, y);
}
var gameMap;
window.onload = function() {
gameMap = new Map(30, 16, document.getElementById('gameMap'));
for(var i = 0; i < 99; ++i) {
gameMap.setMineRandom();
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment