From 61bda596b64d863a2a62ccfebfecd65f613b2bad Mon Sep 17 00:00:00 2001 From: Tobias Springer Date: Sat, 9 May 2020 19:14:11 +0200 Subject: [PATCH] Fix splitters --- src/js/game/hub_goals.js | 2 +- src/js/game/tutorial_goals.js | 11 +- src/js/game/upgrades.js | 4 +- tools/shape_generator/index.html | 17 ++- tools/shape_generator/index.js | 180 ++++++++++++++++++++++++++++++- 5 files changed, 198 insertions(+), 16 deletions(-) diff --git a/src/js/game/hub_goals.js b/src/js/game/hub_goals.js index a39e0a47..89aad926 100644 --- a/src/js/game/hub_goals.js +++ b/src/js/game/hub_goals.js @@ -311,7 +311,7 @@ export class HubGoals extends BasicSerializableObject { case enumItemProcessorTypes.hub: return 1e30; case enumItemProcessorTypes.splitter: - return (2 / globalConfig.beltSpeedItemsPerSecond) * this.upgradeImprovements.splitter; + return (2 / globalConfig.beltSpeedItemsPerSecond) * this.upgradeImprovements.processors; case enumItemProcessorTypes.cutter: case enumItemProcessorTypes.rotater: case enumItemProcessorTypes.stacker: diff --git a/src/js/game/tutorial_goals.js b/src/js/game/tutorial_goals.js index 7532e090..8a57484b 100644 --- a/src/js/game/tutorial_goals.js +++ b/src/js/game/tutorial_goals.js @@ -1,5 +1,4 @@ -import { enumSubShape, ShapeDefinition, createSimpleShape } from "./shape_definition"; -import { enumColors } from "./colors"; +import { ShapeDefinition } from "./shape_definition"; /** * @enum {string} @@ -116,13 +115,13 @@ export const tutorialGoals = [ }, { - shape: "CgCgRgRg", + shape: "RgCwRgCw:CpCpCpCp", required: 6000, reward: enumHubGoalRewards.no_reward, }, { - shape: "CwSwCwSw", + shape: "CwSwCwSw:CpCrCpCr", required: 6000, reward: enumHubGoalRewards.no_reward, }, @@ -140,13 +139,13 @@ export const tutorialGoals = [ }, { - shape: "WyRgWyCg:CbCpCbCp:CwCwCwCw", + shape: "WyRgWyRg:CbCpCbCp:CpCgCpCg", required: 9000, reward: enumHubGoalRewards.no_reward, }, { - shape: "CwRrWbSp:WcWrCpCw", + shape: "CwRrCbRy:ScSrSpSb:CwCwCwCw:RgRgRgRg", required: 15000, reward: enumHubGoalRewards.no_reward, }, diff --git a/src/js/game/upgrades.js b/src/js/game/upgrades.js index 7dd9e8df..3a261904 100644 --- a/src/js/game/upgrades.js +++ b/src/js/game/upgrades.js @@ -1,7 +1,5 @@ -import { createSimpleShape, enumSubShape, ShapeDefinition } from "./shape_definition"; -import { enumColors } from "./colors"; import { findNiceIntegerValue } from "../core/utils"; -import { globalConfig } from "../core/config"; +import { ShapeDefinition } from "./shape_definition"; export const TIER_LABELS = [ "I", diff --git a/tools/shape_generator/index.html b/tools/shape_generator/index.html index 22a388d6..e72d8bc3 100644 --- a/tools/shape_generator/index.html +++ b/tools/shape_generator/index.html @@ -22,19 +22,23 @@ justify-content: center; } - #result { + #resultWrapper { border: 1px solid #ccc; margin-top: 10px; background: #fff; + padding: 40px; + } + + #resultWrapper #result { } #code { width: 600px; font-family: monospace; - padding: 10px; + padding: 30px; border: 1px solid #ccc; background: #fff; - font-size: 15px; + font-size: 17px; } #code:focus { @@ -57,7 +61,9 @@ +

Shape generator

Error

- + +
+ +
diff --git a/tools/shape_generator/index.js b/tools/shape_generator/index.js index d248e678..947040ea 100644 --- a/tools/shape_generator/index.js +++ b/tools/shape_generator/index.js @@ -1,4 +1,7 @@ -// From shape_definition.js +/* + * Lots of code here is copied 1:1 from actual game files + * + */ /** @enum {string} */ const enumSubShape = { @@ -22,6 +25,13 @@ for (const key in enumSubShapeToShortcode) { enumShortcodeToSubShape[enumSubShapeToShortcode[key]] = key; } +const arrayQuadrantIndexToOffset = [ + { x: 1, y: -1 }, // tr + { x: 1, y: 1 }, // br + { x: -1, y: 1 }, // bl + { x: -1, y: -1 }, // tl +]; + // From colors.js /** @enum {string} */ const enumColors = { @@ -51,14 +61,49 @@ const enumColorToShortcode = { [enumColors.uncolored]: "u", }; +/** @enum {string} */ +const enumColorsToHexCode = { + [enumColors.red]: "#ff666a", + [enumColors.green]: "#78ff66", + [enumColors.blue]: "#66a7ff", + + // red + green + [enumColors.yellow]: "#fcf52a", + + // red + blue + [enumColors.purple]: "#dd66ff", + + // blue + green + [enumColors.cyan]: "#87fff5", + + // blue + green + red + [enumColors.white]: "#ffffff", + + [enumColors.uncolored]: "#aaaaaa", +}; + /** @enum {enumColors} */ const enumShortcodeToColor = {}; for (const key in enumColorToShortcode) { enumShortcodeToColor[enumColorToShortcode[key]] = key; } +CanvasRenderingContext2D.prototype.beginCircle = function (x, y, r) { + if (r < 0.05) { + this.beginPath(); + this.rect(x, y, 1, 1); + return; + } + this.beginPath(); + this.arc(x, y, r, 0, 2.0 * Math.PI); +}; + ///////////////////////////////////////////////////// +function radians(degrees) { + return (degrees * Math.PI) / 180.0; +} + /** * Generates the definition from the given short key */ @@ -94,6 +139,130 @@ function fromShortKey(key) { return layers; } +function renderShape(layers) { + const canvas = /** @type {HTMLCanvasElement} */ (document.getElementById("result")); + const context = canvas.getContext("2d"); + + context.save(); + context.fillStyle = "#fff"; + context.fillRect(0, 0, 1000, 1000); + + const w = 256; + const h = 256; + const dpi = 1; + + context.translate((w * dpi) / 2, (h * dpi) / 2); + context.scale((dpi * w) / 23, (dpi * h) / 23); + + context.fillStyle = "#e9ecf7"; + + const quadrantSize = 10; + const quadrantHalfSize = quadrantSize / 2; + + context.fillStyle = "rgba(40, 50, 65, 0.1)"; + context.beginCircle(0, 0, quadrantSize * 1.15); + context.fill(); + + for (let layerIndex = 0; layerIndex < layers.length; ++layerIndex) { + const quadrants = layers[layerIndex]; + + const layerScale = Math.max(0.1, 0.9 - layerIndex * 0.22); + + for (let quadrantIndex = 0; quadrantIndex < 4; ++quadrantIndex) { + if (!quadrants[quadrantIndex]) { + continue; + } + const { subShape, color } = quadrants[quadrantIndex]; + + const quadrantPos = arrayQuadrantIndexToOffset[quadrantIndex]; + const centerQuadrantX = quadrantPos.x * quadrantHalfSize; + const centerQuadrantY = quadrantPos.y * quadrantHalfSize; + + const rotation = radians(quadrantIndex * 90); + + context.translate(centerQuadrantX, centerQuadrantY); + context.rotate(rotation); + + context.fillStyle = enumColorsToHexCode[color]; + context.strokeStyle = "#555"; + context.lineWidth = 1; + + const insetPadding = 0.0; + + switch (subShape) { + case enumSubShape.rect: { + context.beginPath(); + const dims = quadrantSize * layerScale; + context.rect( + insetPadding + -quadrantHalfSize, + -insetPadding + quadrantHalfSize - dims, + dims, + dims + ); + + break; + } + case enumSubShape.star: { + context.beginPath(); + const dims = quadrantSize * layerScale; + + let originX = insetPadding - quadrantHalfSize; + let originY = -insetPadding + quadrantHalfSize - dims; + + const moveInwards = dims * 0.4; + context.moveTo(originX, originY + moveInwards); + context.lineTo(originX + dims, originY); + context.lineTo(originX + dims - moveInwards, originY + dims); + context.lineTo(originX, originY + dims); + context.closePath(); + break; + } + + case enumSubShape.windmill: { + context.beginPath(); + const dims = quadrantSize * layerScale; + + let originX = insetPadding - quadrantHalfSize; + let originY = -insetPadding + quadrantHalfSize - dims; + const moveInwards = dims * 0.4; + context.moveTo(originX, originY + moveInwards); + context.lineTo(originX + dims, originY); + context.lineTo(originX + dims, originY + dims); + context.lineTo(originX, originY + dims); + context.closePath(); + break; + } + + case enumSubShape.circle: { + context.beginPath(); + context.moveTo(insetPadding + -quadrantHalfSize, -insetPadding + quadrantHalfSize); + context.arc( + insetPadding + -quadrantHalfSize, + -insetPadding + quadrantHalfSize, + quadrantSize * layerScale, + -Math.PI * 0.5, + 0 + ); + context.closePath(); + break; + } + + default: { + assertAlways(false, "Unkown sub shape: " + subShape); + } + } + + context.fill(); + context.stroke(); + + context.rotate(-rotation); + context.translate(-centerQuadrantX, -centerQuadrantY); + } + } + + context.restore(); +} + ///////////////////////////////////////////////////// function showError(msg) { @@ -106,8 +275,10 @@ function showError(msg) { } } +// @ts-ignore window.generate = () => { showError(null); + // @ts-ignore const code = document.getElementById("code").value.trim(); let parsed = null; @@ -115,11 +286,16 @@ window.generate = () => { parsed = fromShortKey(code); } catch (ex) { showError(ex); + return; } + + renderShape(parsed); }; +// @ts-ignore window.debounce = fn => { setTimeout(fn, 0); }; -window.addEventListener("load", generate); +// @ts-ignore +window.addEventListener("load", window.generate);