Skip to content

Instantly share code, notes, and snippets.

@oxUnd
Last active August 13, 2017 14:42
Show Gist options
  • Save oxUnd/7f7d3f193ef72e87efb8f81a4153411c to your computer and use it in GitHub Desktop.
Save oxUnd/7f7d3f193ef72e87efb8f81a4153411c to your computer and use it in GitHub Desktop.
LLK
/**
* @author xiangshouding
*/
class Box {
constructor(x, y, icon) {
this.x = x;
this.y = y;
this.icon = icon;
}
}
class Board {
constructor(w, h) {
this.w = w;
this.h = h;
this.p = [];
}
fill() {
var x, y;
var icon = this.getIcon();
for (y = 0; y < this.h; y++) {
for (x = 0; x < this.w; x++) {
if (!this.p[x]) {
this.p[x] = [];
}
this.p[x][y] = new Box(x, y, icon());
}
}
}
isBlocked(x, y) {
try {
var current = this.p[x][y];
return current.icon;
} catch (err) {
//console.error(err);
}
return false;
}
/**
* check horizon
*/
vertical(p0, p1) {
if (p0.x == p1.x && p0.y == p1.y) {
return false;
}
if (p0.x != p1.x) {
return false;
}
var start = Math.min(p0.y, p1.y), end = Math.max(p0.y, p1.y);
if (end - start == 1) {
return true;
}
for (var y = start + 1; y < end; y++) {
if (this.isBlocked(p0.x, y)) {
return false;
}
}
return true;
}
horizon(p0, p1) {
if (p0.x == p1.x && p0.y == p1.y) {
return false;
}
if (p0.y != p1.y) {
return false;
}
var start = Math.min(p0.x, p1.x), end = Math.max(p0.x, p1.x);
if (end - start == 1) {
return true;
}
for (var x = start + 1; x < end; x++) {
if (this.isBlocked(x, p0.y)) {
return false;
}
}
return true;
}
turnOnce(p0, p1) {
if (p0.x == p1.x && p0.y == p1.y) {
return false;
}
var ret = false;
if (!this.isBlocked(p0.x, p1.y)) {
ret = this.horizon(p0, {x: p0.x, y: p1.y}) && this.vertical({x: p0.x, y: p1.y}, p1);
}
if (!this.isBlocked(p1.x, p0.y)) {
ret = this.horizon(p0, {x: p1.x, y: p0.y}) && this.vertical({x: p1.x, y: p0.y}, p1);
}
return ret;
}
turnTwice(p0, p1) {
if (p0.x == p1.x && p0.y == p1.y) {
return false;
}
for (var x = 0; x <= this.w; x++) {
for (var y = 0; y <= this.h; y++) {
if (x != p0.x && x != p1.x && y != p1.y && y != p1.y) {
continue;
}
if ((x == p0.x && y == p0.y) || (x == p1.x && y == p1.y)) {
continue;
}
if (this.isBlocked(x, y)) {
continue;
}
if (this.turnOnce(p0, {x: x, y: y}) && (this.horizon({x: x, y: y}, p1) || this.vertical({x: x, y: y}, p1))) {
return true;
}
if (this.turnOnce({x: x, y: y}, p1) && (this.horizon(p0, {x: x, y: y}) || this.vertical(p0, {x: x, y: y}))) {
return true;
}
}
}
return false;
}
clear(x0, y0, x1, y1) {
var p0 = {x: x0, y: y0}, p1 = {x: x1, y: y1};
if (this.p[x0][y0].icon != this.p[x1][y1].icon) {
return false;
}
if (this.horizon(p0, p1)) {
return true;
}
if (this.vertical(p0, p1)) {
return true;
}
if (this.turnOnce(p0, p1)) {
return true;
}
if (this.turnTwice(p0, p1)) {
return true;
}
return false;
}
remove(x0, y0, x1, y1) {
if (this.clear(x0, y0, x1, y1)) {
this.p[x0][y0] = null;
this.p[x1][y1] = null;
return true;
}
return false;
}
render() {
this.fill();
var x, y;
var app = document.getElementById('app');
for (y = 0; y < this.h; y++) {
for (x = 0; x < this.w; x++) {
var node = document.createElement('div');
node.setAttribute('class', 'box');
node.setAttribute('x', x);
node.setAttribute('y', y);
node.setAttribute('ref', 'box');
node.innerText = this.p[x][y].icon;
app.appendChild(node);
}
var br = document.createElement('br');
app.appendChild(br);
}
}
shuffle(array) {
var currentIndex = array.length
, temporaryValue
, randomIndex;
while (0 !== currentIndex) {
randomIndex = Math.floor(Math.random() * currentIndex);
currentIndex -= 1;
temporaryValue = array[currentIndex];
array[currentIndex] = array[randomIndex];
array[randomIndex] = temporaryValue;
}
return array;
}
getIcon() {
var icons = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K',
'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V',
'W', 'X', 'Y', 'Z', '@', '#', '$', '%', '&', '!', '*'];
var m = icons.length, cls = Math.floor(m / 2 + Math.random() * m);
var times = Math.floor(this.w * this.h / cls);
if (times % 2 != 0) {
times -= 1;
}
if (times === 0) {
times = 2;
}
var array = [];
for (var i = 0; i < this.w * this.h; i += times) {
for (var j = 0; j < times; j++) {
array.push(icons[i % m]);
}
}
array = this.shuffle(array);
var index = 0;
return function (x, y) {
return array[index++];
};
}
}
function main() {
var board = new Board(4, 4);
board.render();
return board;
}
function getPosFromDom(elm, axial) {
return parseInt(elm.getAttribute(axial));
}
function mount() {
var board = main();
var queue = [];
window.addEventListener('click', function (e) {
if (e.target.getAttribute('ref') != 'box') {
return;
}
if (queue.length != 2) {
queue.push(e.target);
if (queue.length == 2) {
try {
var isClear = board.remove(
getPosFromDom(queue[0], 'x'),
getPosFromDom(queue[0], 'y'),
getPosFromDom(queue[1], 'x'),
getPosFromDom(queue[1], 'y')
);
if (isClear) {
queue[0].setAttribute('class', 'box done');
queue[0].innerHTML = '&nbsp;';
queue[1].setAttribute('class', 'box done');
queue[1].innerHTML = '&nbsp;';
} else {
alert('Error, Please choice two same icon box.')
}
} catch (err) {
console.error(err);
}
queue = []; // clear stack
}
} else {
queue = [];
}
})
}
function clear() {
}
window.onload = mount;
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>lk</title>
<script type="text/javascript" src="app.js"></script>
<style type="text/css">
#app {
margin: 30px;
}
.box {
display: inline-block;
width: 50px;
height: 50px;
background-color: #FC0FDD;
border: 2px solid #FFFFFF;
font-size: 2em;
text-align: center;
}
.box:hover {
background-color: #FCFFCC;
}
.done {
background-color: #EEEEEE;
}
</style>
</head>
<body>
<div id="app"></div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment