Fix splitters

This commit is contained in:
Tobias Springer 2020-05-09 19:14:11 +02:00
parent 01d9a03264
commit 61bda596b6
5 changed files with 198 additions and 16 deletions

View File

@ -311,7 +311,7 @@ export class HubGoals extends BasicSerializableObject {
case enumItemProcessorTypes.hub: case enumItemProcessorTypes.hub:
return 1e30; return 1e30;
case enumItemProcessorTypes.splitter: case enumItemProcessorTypes.splitter:
return (2 / globalConfig.beltSpeedItemsPerSecond) * this.upgradeImprovements.splitter; return (2 / globalConfig.beltSpeedItemsPerSecond) * this.upgradeImprovements.processors;
case enumItemProcessorTypes.cutter: case enumItemProcessorTypes.cutter:
case enumItemProcessorTypes.rotater: case enumItemProcessorTypes.rotater:
case enumItemProcessorTypes.stacker: case enumItemProcessorTypes.stacker:

View File

@ -1,5 +1,4 @@
import { enumSubShape, ShapeDefinition, createSimpleShape } from "./shape_definition"; import { ShapeDefinition } from "./shape_definition";
import { enumColors } from "./colors";
/** /**
* @enum {string} * @enum {string}
@ -116,13 +115,13 @@ export const tutorialGoals = [
}, },
{ {
shape: "CgCgRgRg", shape: "RgCwRgCw:CpCpCpCp",
required: 6000, required: 6000,
reward: enumHubGoalRewards.no_reward, reward: enumHubGoalRewards.no_reward,
}, },
{ {
shape: "CwSwCwSw", shape: "CwSwCwSw:CpCrCpCr",
required: 6000, required: 6000,
reward: enumHubGoalRewards.no_reward, reward: enumHubGoalRewards.no_reward,
}, },
@ -140,13 +139,13 @@ export const tutorialGoals = [
}, },
{ {
shape: "WyRgWyCg:CbCpCbCp:CwCwCwCw", shape: "WyRgWyRg:CbCpCbCp:CpCgCpCg",
required: 9000, required: 9000,
reward: enumHubGoalRewards.no_reward, reward: enumHubGoalRewards.no_reward,
}, },
{ {
shape: "CwRrWbSp:WcWrCpCw", shape: "CwRrCbRy:ScSrSpSb:CwCwCwCw:RgRgRgRg",
required: 15000, required: 15000,
reward: enumHubGoalRewards.no_reward, reward: enumHubGoalRewards.no_reward,
}, },

View File

@ -1,7 +1,5 @@
import { createSimpleShape, enumSubShape, ShapeDefinition } from "./shape_definition";
import { enumColors } from "./colors";
import { findNiceIntegerValue } from "../core/utils"; import { findNiceIntegerValue } from "../core/utils";
import { globalConfig } from "../core/config"; import { ShapeDefinition } from "./shape_definition";
export const TIER_LABELS = [ export const TIER_LABELS = [
"I", "I",

View File

@ -22,19 +22,23 @@
justify-content: center; justify-content: center;
} }
#result { #resultWrapper {
border: 1px solid #ccc; border: 1px solid #ccc;
margin-top: 10px; margin-top: 10px;
background: #fff; background: #fff;
padding: 40px;
}
#resultWrapper #result {
} }
#code { #code {
width: 600px; width: 600px;
font-family: monospace; font-family: monospace;
padding: 10px; padding: 30px;
border: 1px solid #ccc; border: 1px solid #ccc;
background: #fff; background: #fff;
font-size: 15px; font-size: 17px;
} }
#code:focus { #code:focus {
@ -57,7 +61,9 @@
</style> </style>
</head> </head>
<body> <body>
<h2>Shape generator</h2>
<input <input
value="CuCuCuCu"
id="code" id="code"
placeholder="shape code" placeholder="shape code"
onkeypress="debounce(generate)" onkeypress="debounce(generate)"
@ -67,6 +73,9 @@
/> />
<div id="error">Error</div> <div id="error">Error</div>
<br /> <br />
<canvas id="result" width="512" height="512"></canvas>
<div id="resultWrapper">
<canvas id="result" width="256" height="256"></canvas>
</div>
</body> </body>
</html> </html>

View File

@ -1,4 +1,7 @@
// From shape_definition.js /*
* Lots of code here is copied 1:1 from actual game files
*
*/
/** @enum {string} */ /** @enum {string} */
const enumSubShape = { const enumSubShape = {
@ -22,6 +25,13 @@ for (const key in enumSubShapeToShortcode) {
enumShortcodeToSubShape[enumSubShapeToShortcode[key]] = key; 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 // From colors.js
/** @enum {string} */ /** @enum {string} */
const enumColors = { const enumColors = {
@ -51,14 +61,49 @@ const enumColorToShortcode = {
[enumColors.uncolored]: "u", [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} */ /** @enum {enumColors} */
const enumShortcodeToColor = {}; const enumShortcodeToColor = {};
for (const key in enumColorToShortcode) { for (const key in enumColorToShortcode) {
enumShortcodeToColor[enumColorToShortcode[key]] = key; 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 * Generates the definition from the given short key
*/ */
@ -94,6 +139,130 @@ function fromShortKey(key) {
return layers; 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) { function showError(msg) {
@ -106,8 +275,10 @@ function showError(msg) {
} }
} }
// @ts-ignore
window.generate = () => { window.generate = () => {
showError(null); showError(null);
// @ts-ignore
const code = document.getElementById("code").value.trim(); const code = document.getElementById("code").value.trim();
let parsed = null; let parsed = null;
@ -115,11 +286,16 @@ window.generate = () => {
parsed = fromShortKey(code); parsed = fromShortKey(code);
} catch (ex) { } catch (ex) {
showError(ex); showError(ex);
return;
} }
renderShape(parsed);
}; };
// @ts-ignore
window.debounce = fn => { window.debounce = fn => {
setTimeout(fn, 0); setTimeout(fn, 0);
}; };
window.addEventListener("load", generate); // @ts-ignore
window.addEventListener("load", window.generate);