Archives/tobspr_shapez.io
1
0
Fork 0
mirror of https://github.com/tobspr/shapez.io.git synced 2026-02-13 11:29:20 +00:00
Code Issues Projects Releases Wiki Activity

WIP: Testing a approach for a colorblind modus

Browse Source
This commit is contained in:
Karl Fritsche 2020-06-14 21:00:20 +02:00
parent ed87dfd118
commit 331b06cc11
3 changed files with 81 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
src/js/game/colors.js
View File

@ -35,14 +35,14 @@ for (const key in enumColorToShortcode) {
/** @enum {string} */
export const enumColorsToHexCode = {
[enumColors.red]: "#ff666a",
[enumColors.green]: "#78ff66",
[enumColors.green]: "#2afc0e",
[enumColors.blue]: "#66a7ff",
// red + green
[enumColors.yellow]: "#fcf52a",
[enumColors.yellow]: "#fff509",
// red + blue
[enumColors.purple]: "#dd66ff",
[enumColors.purple]: "#c70cfa",
// blue + green
[enumColors.cyan]: "#00fcff",
@ -165,3 +165,42 @@ for (const colorA in enumColorMixingResults) {
}
}
}
// @todo: generate this from enumColorMixingResults
export const enumColorBaseColor = {
[c.red]: {
[c.red]: true,
[c.green]: false,
[c.blue]: false,
},
[c.green]: {
[c.red]: false,
[c.green]: true,
[c.blue]: false,
},
[c.blue]: {
[c.red]: false,
[c.green]: false,
[c.blue]: true,
},
[c.yellow]: {
[c.red]: true,
[c.green]: true,
[c.blue]: false,
},
[c.purple]: {
[c.red]: true,
[c.green]: false,
[c.blue]: true,
},
[c.cyan]: {
[c.red]: false,
[c.green]: true,
[c.blue]: true,
},
[c.white]: {
[c.red]: true,
[c.green]: true,
[c.blue]: true,
},
}

19
src/js/game/items/color_item.js
View File

@ -3,7 +3,7 @@ import { smoothenDpi } from "../../core/dpi_manager";
import { DrawParameters } from "../../core/draw_parameters";
import { types } from "../../savegame/serialization";
import { BaseItem } from "../base_item";
import { enumColors, enumColorsToHexCode } from "../colors";
import { enumColors, enumColorsToHexCode, enumColorBaseColor } from "../colors";
import { THEME } from "../theme";
export class ColorItem extends BaseItem {
@ -74,16 +74,25 @@ export class ColorItem extends BaseItem {
context.fillStyle = enumColorsToHexCode[this.color];
context.strokeStyle = THEME.items.outline;
context.lineWidth = 2 * THEME.items.outlineWidth;
context.lineWidth = THEME.items.outlineWidth;
// red
context.beginCircle(2, -1, 3);
context.stroke();
context.fill();
if (enumColorBaseColor[this.color][enumColors.red]) {
context.fill();
}
// green
context.beginCircle(-2, -1, 3);
context.stroke();
context.fill();
if (enumColorBaseColor[this.color][enumColors.green]) {
context.fill();
}
// blue
context.beginCircle(0, 2, 3);
context.closePath();
context.stroke();
context.fill();
if (enumColorBaseColor[this.color][enumColors.blue]) {
context.fill();
}
}
}

26
src/js/game/shape_definition.js
View File

@ -6,7 +6,7 @@ import { DrawParameters } from "../core/draw_parameters";
import { createLogger } from "../core/logging";
import { Vector } from "../core/vector";
import { BasicSerializableObject, types } from "../savegame/serialization";
import { enumColors, enumColorsToHexCode, enumColorToShortcode, enumShortcodeToColor } from "./colors";
import { enumColors, enumColorsToHexCode, enumColorToShortcode, enumShortcodeToColor, enumColorBaseColor } from "./colors";
import { THEME } from "./theme";
const rusha = require("rusha");
@ -346,6 +346,30 @@ export class ShapeDefinition extends BasicSerializableObject {
context.fill();
context.stroke();
if (color !== enumColors.uncolored) {
const radius = (quadrantSize * layerScale) / 8;
console.log(radius, centerQuadrantX, centerQuadrantY)
context.lineWidth = THEME.items.outlineWidth / 4;
context.beginCircle(- 2 * radius / 3, 0, radius );
context.stroke();
if (enumColorBaseColor[color][enumColors.green]) {
context.fillStyle = enumColorsToHexCode[enumColors.green];
context.fill();
}
context.beginCircle( 2 * radius / 3, 0, radius);
context.stroke();
if (enumColorBaseColor[color][enumColors.red]) {
context.fillStyle = enumColorsToHexCode[enumColors.red];
context.fill();
}
context.beginCircle(0, radius, radius);
context.stroke();
if (enumColorBaseColor[color][enumColors.blue]) {
context.fillStyle = enumColorsToHexCode[enumColors.blue];
context.fill();
}
}
context.rotate(-rotation);
context.translate(-centerQuadrantX, -centerQuadrantY);
}