wrapping for radial, hexagonal, maps

src/cartographerFlatXYZ.js

@@ -8,157 +8,7 @@ import Point from './point.js';
 
 const tilePointToHex = ({tilePoint, pixelPoint}) => ({tilePoint: new Hex(tilePoint), pixelPoint});
 
-const positive3x3 = [{
-	x: 0,
-	y: 0,
-	z: 0,
-}, {
-	x: 1,
-	y: 0,
-	z: -1,
-}, {
-	x: 2,
-	y: -1,
-	z: -1,
-}, {
-	x: 0,
-	y: -1,
-	z: 1,
-}, {
-	x: 1,
-	y: -1,
-	z: 0,
-}, {
-	x: 2,
-	y: -2,
-	z: 0,
-}, {
-	x: 0,
-	y: -2,
-	z: 2,
-}, {
-	x: 1,
-	y: -2,
-	z: 1,
-}, {
-	x: 2,
-	y: -3,
-	z: 1,
-}];
-
-const positiveEast3x3 = [{
-	x: 3,
-	y: -2,
-	z: -1,
-}, {
-	x: 4,
-	y: -2,
-	z: -2,
-}, {
-	x: 5,
-	y: -3,
-	z: -2,
-}, {
-	x: 3,
-	y: -3,
-	z: 0,
-}, {
-	x: 4,
-	y: -3,
-	z: -1,
-}, {
-	x: 5,
-	y: -4,
-	z: -1,
-}, {
-	x: 3,
-	y: -4,
-	z: 1,
-}, {
-	x: 4,
-	y: -4,
-	z: 0,
-}, {
-	x: 5,
-	y: -5,
-	z: 0,
-}];
-
-const positiveMiddleEast3x3 = [{
-	x: 6,
-	y: -4,
-	z: -2,
-}, {
-	x: 7,
-	y: -4,
-	z: -3,
-}, {
-	x: 8,
-	y: -5,
-	z: -3,
-}, {
-	x: 6,
-	y: -5,
-	z: -1,
-}, {
-	x: 7,
-	y: -5,
-	z: -2,
-}, {
-	x: 8,
-	y: -6,
-	z: -2,
-}, {
-	x: 6,
-	y: -6,
-	z: 0,
-}, {
-	x: 7,
-	y: -6,
-	z: -1,
-}, {
-	x: 8,
-	y: -7,
-	z: -1,
-}];
-
-const positiveFarEast3x3 = [{
-	x: 9,
-	y: -6,
-	z: -3,
-}, {
-	x: 10,
-	y: -6,
-	z: -4,
-}, {
-	x: 11,
-	y: -7,
-	z: -4,
-}, {
-	x: 9,
-	y: -7,
-	z: -2,
-}, {
-	x: 10,
-	y: -7,
-	z: -3,
-}, {
-	x: 11,
-	y: -8,
-	z: -3,
-}, {
-	x: 9,
-	y: -8,
-	z: -1,
-}, {
-	x: 10,
-	y: -8,
-	z: -2,
-}, {
-	x: 11,
-	y: -9,
-	z: -2,
-}];
+const zeroZeroZero = new Hex({x: 0, y: 0, z: 0});
 
 export default class CartographerFlatXYZ extends Cartographer {
 	constructor (settings) {
@@ -188,6 +38,41 @@ export default class CartographerFlatXYZ extends Cartographer {
 			'enforceBoundries',
 			'boundingBox',
 		].map(method => this[method] = this[method].bind(this));
+
+		if (this.radius) {
+			this.mirrors = [
+				new Hex({ // East
+					x: 2 * this.radius + 1,
+					y: -this.radius - 1,
+					z: -this.radius,
+				}),
+				new Hex({ // North East
+					x: this.radius + 1,
+					y: this.radius,
+					z: -2 * this.radius - 1,
+				}),
+				new Hex({ // North West
+					x: -this.radius,
+					y: 2 * this.radius + 1,
+					z: -this.radius - 1,
+				}),
+				new Hex ({ // West
+					x: -2 * this.radius - 1,
+					y: this.radius + 1,
+					z: this.radius,
+				}),
+				new Hex ({ // South West
+					x: -this.radius - 1,
+					y: -this.radius,
+					z: 2 * this.radius + 1,
+				}),
+				new Hex ({ // South East
+					x: this.radius,
+					y: -2 * this.radius - 1,
+					z: this.radius + 1,
+				}),
+			];
+		}
 	}
 
 	tileHeight () {
@@ -253,11 +138,18 @@ export default class CartographerFlatXYZ extends Cartographer {
 
 	teleport (hex) {
 		hex  = hex instanceof Hex ? hex : new Hex(hex);
-		let {col, row} = Hex.cubeToEvenQ(hex);
 
 		if (this.radius) {
+			if (hex.distance(zeroZeroZero) <= this.radius) return hex;
+
+			const distances = this.mirrors.map(mirror => hex.distance(mirror));
+			const mirror = this.mirrors[distances.indexOf(Math.min(...distances))];
+
+			return this.teleport(hex.subtractHex(mirror));
 		}
 		else {
+			let {col, row} = Hex.cubeToEvenQ(hex);
+
 			// ensure odd-width maps wrap properly
 			if (this.width % 2) {
 				const offset = Math.floor(col / this.width);

src/cartographerPointyXYZ.js

@@ -8,6 +8,8 @@ import Point from './point.js';
 
 const tilePointToHex = ({tilePoint, pixelPoint}) => ({tilePoint: new Hex(tilePoint), pixelPoint});
 
+const zeroZeroZero = new Hex({x: 0, y: 0, z: 0});
+
 export default class CartographerPointyXYZ extends Cartographer {
 	constructor (settings) {
 		super(settings);
@@ -36,6 +38,41 @@ export default class CartographerPointyXYZ extends Cartographer {
 			'enforceBoundries',
 			'boundingBox',
 		].map(method => this[method] = this[method].bind(this));
+
+		if (this.radius) {
+			this.mirrors = [
+				new Hex({ // East
+					x: 2 * this.radius + 1,
+					y: -this.radius - 1,
+					z: -this.radius,
+				}),
+				new Hex({ // North East
+					x: this.radius + 1,
+					y: this.radius,
+					z: -2 * this.radius - 1,
+				}),
+				new Hex({ // North West
+					x: -this.radius,
+					y: 2 * this.radius + 1,
+					z: -this.radius - 1,
+				}),
+				new Hex ({ // West
+					x: -2 * this.radius - 1,
+					y: this.radius + 1,
+					z: this.radius,
+				}),
+				new Hex ({ // South West
+					x: -this.radius - 1,
+					y: -this.radius,
+					z: 2 * this.radius + 1,
+				}),
+				new Hex ({ // South East
+					x: this.radius,
+					y: -2 * this.radius - 1,
+					z: this.radius + 1,
+				}),
+			];
+		}
 	}
 
 	tileHeight () {
@@ -101,11 +138,18 @@ export default class CartographerPointyXYZ extends Cartographer {
 
 	teleport (hex) {
 		hex  = hex instanceof Hex ? hex : new Hex(hex);
-		let {col, row} = Hex.cubeToEvenR(hex);
 
 		if (this.radius) {
+			if (hex.distance(zeroZeroZero) <= this.radius) return hex;
+
+			const distances = this.mirrors.map(mirror => hex.distance(mirror));
+			const mirror = this.mirrors[distances.indexOf(Math.min(...distances))];
+
+			return this.teleport(hex.subtractHex(mirror));
 		}
 		else {
+			let {col, row} = Hex.cubeToEvenR(hex);
+
 			// ensure odd-width maps wrap properly
 			if (this.height % 2) {
 				const offset = Math.floor(row / this.height);

src/hex.js

@@ -78,7 +78,7 @@ export default class Hex extends Point {
 
 		if (arguments.length === 1) {
 			const {q, r, s = -q - r} = arguments[0];
-			const {x, y, z = -x - y} = arguments[0];
+			const {x, z, y = -x - z} = arguments[0];
 
 			this.x = !isNaN(q) ? q : x;
 			this.y = !isNaN(s) ? s : y;
@@ -152,6 +152,14 @@ export default class Hex extends Point {
 		return this;
 	}
 
+	subtractHex (hex) {
+		this.x -= hex.x;
+		this.y -= hex.y;
+		this.z -= hex.z;
+
+		return this;
+	}
+
 	getAxial () {return {q: this.x, r: this.z};}
 
 	setAxial (newAxial) {
@@ -167,4 +175,8 @@ export default class Hex extends Point {
 		this.y = computeY(this.x, this.z);
 		return this;
 	}
+
+	distance (hex) {
+		return Math.max(Math.abs(this.x - hex.x), Math.abs(this.y - hex.y), Math.abs(this.z - hex.z));
+	}
 }