Skip to content

Commit 3262cae

Browse files
hannahbergamhannahbergam
committed
implementing Mike's changes
1 parent 934d2c7 commit 3262cae

File tree

3 files changed

+156
-0
lines changed

3 files changed

+156
-0
lines changed

‎src/neighborhood.js

Lines changed: 147 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,147 @@
1+
const { SQUARE_SIZE, SVG_NS } = require("./drawer");
2+
const Subtype = require("./subtype");
3+
4+
// World's worst React.createElement, but for SVG
5+
function s(tag, props, parent) {
6+
const el = document.createElementNS(SVG_NS, tag);
7+
Object.keys(props).map(function (key) {
8+
el.setAttribute(key, props[key])
9+
});
10+
11+
if (parent) {
12+
parent.appendChild(el);
13+
}
14+
15+
return el;
16+
}
17+
18+
// Path drawing a quarter circle
19+
// --+
20+
// / |
21+
// +---+
22+
function quarterCircle(size) {
23+
let hs = size/2;
24+
let cp = size/4;
25+
return `m${hs} ${hs}h-${hs}c0-${cp} ${cp}-${hs} ${hs}-${hs}z`;
26+
}
27+
28+
// Path of the the slice of a square remaining once a quarter circle is
29+
// removed from it
30+
// +----+
31+
// | /
32+
// +
33+
function cutout(size) {
34+
let hs = size / 2;
35+
let cp = size / 4;
36+
return `m0 0v${hs}c0-${cp} ${cp}-${hs} ${hs}-${hs}z`
37+
}
38+
39+
40+
// Path of the triangular corner
41+
// +----+
42+
// | /
43+
// | /
44+
// +
45+
function corner(size) {
46+
let hs = size / 2;
47+
return `m${hs} 0h-${hs}v${hs}z`
48+
}
49+
50+
module.exports = class Neighborhood extends Subtype {
51+
52+
resetTiles() {}
53+
54+
// TODO: There is a way to get the value of a cell reliably but I couldn't
55+
// get it to work. This is a workaround method to simplify the logic below
56+
cellColor(row, col) {
57+
if (row >= this.maze_.map.ROWS) return "none";
58+
if (col >= this.maze_.map.COLS) return "none";
59+
return this.maze_.map.currentStaticGrid[row][col].originalValue_ || "none";
60+
}
61+
62+
drawMapTiles(svg) {
63+
let qc = quarterCircle(SQUARE_SIZE);
64+
let c = cutout(SQUARE_SIZE);
65+
let co = corner(SQUARE_SIZE);
66+
67+
let tileId = 0;
68+
for (let row = 0; row < this.maze_.map.ROWS; row++) {
69+
for (let col = 0; col < this.maze_.map.COLS; col++) {
70+
// Top left, top right, bottom left, bottom right
71+
let cells = [
72+
this.cellColor(row, col),
73+
this.cellColor(row+1, col),
74+
this.cellColor(row, col+1),
75+
this.cellColor(row+1,col+1)];
76+
77+
// Create grid block group
78+
let g = s("g", {
79+
transform: `translate(${row * SQUARE_SIZE + SQUARE_SIZE/2},
80+
${col * SQUARE_SIZE + SQUARE_SIZE/2})`
81+
}, svg);
82+
83+
// Add a quarter circle to the top left corner of the block if there is
84+
// a color value there
85+
if (cells[0] !== "none") {
86+
s("path", {d: qc, fill: cells[0], transform:"rotate(180)"}, g);
87+
}
88+
89+
// Add a cutout shape if the top left corner has a color and one other
90+
// corner shares that color, filling in the top left quadrant of the block
91+
// completely
92+
if (cells[0] !== "none" &&
93+
(cells[0] == cells[1] || cells[0] == cells[2] || cells[0] == cells[3])) {
94+
s("path", {d: c, transform: "rotate(180)", fill: cells[0]}, g);
95+
96+
// Otherwise, if the two adjacent corners have the same color, add the
97+
// cutout shape with that color
98+
} else if (cells[0] == "none" && cells[1] !== "none" && cells[1] == cells[2]) {
99+
s("path", {d: c, transform: "rotate(180)", fill: cells[1]}, g);
100+
} else if (cells[0] !== "none" && cells[1] !== "none" && cells[2] !== "none" && cells[3] !== "none") {
101+
s("path", {d: c, transform: "rotate(180)", fill: cells[0]}, g);
102+
}
103+
104+
// The rest of these statements follow the same pattern for each corner
105+
// of the block
106+
if (cells[1] && cells[1] !== "none") {
107+
s("path", {d: qc, fill: cells[1], transform: "rotate(-90)"}, g);
108+
}
109+
110+
if (cells[1] !== "none" &&
111+
(cells[1] == cells[2] || cells[1] == cells[3] || cells[1] == cells[0])) {
112+
s("path", {d: c, transform: "rotate(-90)", fill: cells[1]}, g);
113+
} else if (cells[1] == "none" & cells[0] !== "none" && cells[0] == cells[3]) {
114+
s("path", {d: c, transform: "rotate(-90)", fill: cells[0]}, g);
115+
} else if (cells[1] !== "none" && cells[0] !== "none" && cells[2] !== "none" && cells[3] !== "none") {
116+
s("path", {d: c, transform: "rotate(-90)", fill: cells[1]}, g);
117+
}
118+
119+
if (cells[2] && cells[2] !== "none") {
120+
s("path", {d: qc, fill: cells[2], transform: "rotate(90)"}, g);
121+
}
122+
123+
if (cells[2] !== "none" &&
124+
(cells[2] == cells[3] || cells[2] == cells[0] || cells[2] == cells[1])) {
125+
s("path", {d: c, transform: "rotate(90)", fill: cells[2]}, g);
126+
} else if (cells[2] == "none" && cells[0] !== "none" && cells[0] == cells[3]) {
127+
s("path", {d: c, transform: "rotate(90)", fill: cells[0]}, g);
128+
} else if (cells[2] !== "none" && cells[0] !== "none" && cells[1] !== "none" && cells[3] !== "none") {
129+
s("path", {d: c, transform: "rotate(90)", fill: cells[2]}, g);
130+
}
131+
132+
if (cells[3] && cells[3] !== "none") {
133+
s("path", {d: qc, fill: cells[3]}, g);
134+
}
135+
136+
if (cells[3] !== "none" &&
137+
(cells[3] == cells[0] || cells[3] == cells[1] || cells[3] == cells[2])) {
138+
s("path", {d: c, fill: cells[3]}, g);
139+
} else if (cells[3] == "none" && cells[1] !== "none" && cells[1] == cells[2]) {
140+
s("path", {d: c, fill: cells[1]}, g);
141+
} else if (cells[3] !== "none" && cells[0] !== "none" && cells[1] !== "none" && cells[2] !== "none") {
142+
s("path", {d: c, fill: cells[3]}, g);
143+
}
144+
}
145+
}
146+
}
147+
};

‎src/subtypes.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ const Collector = require('./collector');
77
const Wordsearch = require('./wordsearch');
88
const Harvester = require('./harvester');
99
const Planter = require('./planter');
10+
const Neighborhood = require('./neighborhood');
1011

1112
module.exports = {
1213
Farmer,
@@ -15,5 +16,6 @@ module.exports = {
1516
Wordsearch,
1617
Harvester,
1718
Planter,
19+
Neighborhood
1820
}
1921

‎src/utils.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -94,6 +94,10 @@ module.exports.isWordSearchSkin = function isWordSearchSkin(skinId) {
9494
return skinId === 'letters';
9595
}
9696

97+
module.exports.isNeighborhoodSkin = function isNeighborhoodSkin(skinId) {
98+
return skinId === 'neighborhood';
99+
}
100+
97101
module.exports.getSubtypeForSkin = function getSubtypeForSkin(skinId) {
98102
if (module.exports.isFarmerSkin(skinId)) {
99103
return require('./farmer');
@@ -116,6 +120,9 @@ module.exports.getSubtypeForSkin = function getSubtypeForSkin(skinId) {
116120
if (module.exports.isPlanterSkin(skinId)) {
117121
return require('./planter');
118122
}
123+
if (module.exports.isNeighborhoodSkin(skinId)) {
124+
return require('./neighborhood');
125+
}
119126

120127
return require('./subtype');
121128
}

0 commit comments

Comments
 (0)