Refactor the basemap and introduce new themes (#706)

basemap/themes/achromatomaly.js

@@ -0,0 +1,13 @@
+import style from './default.js';
+import {Color, ColorBlind} from "../utils/color.js";
+
+export default Object.entries(style).reduce((acc, [key, value]) => {
+    let color = Color.fromString(value);
+    if (color == null) {
+        acc[key] = value;
+        return acc;
+    } else {
+        acc[key] = color.colorblind(ColorBlind.Achromatomaly).toString();
+        return acc;
+    }
+}, {});

basemap/themes/achromatopsia.js

@@ -0,0 +1,13 @@
+import style from './default.js';
+import {Color, ColorBlind} from "../utils/color.js";
+
+export default Object.entries(style).reduce((acc, [key, value]) => {
+    let color = Color.fromString(value);
+    if (color == null) {
+        acc[key] = value;
+        return acc;
+    } else {
+        acc[key] = color.colorblind(ColorBlind.Achromatopsia).toString();
+        return acc;
+    }
+}, {});

basemap/themes/contrast.js

@@ -0,0 +1,13 @@
+import style from './default.js';
+import {Color} from "../utils/color.js";
+
+export default Object.entries(style).reduce((acc, [key, value]) => {
+    let color = Color.fromString(value);
+    if (color == null) {
+        acc[key] = value;
+        return acc;
+    } else {
+        acc[key] = color.contrast(0.1).toString();
+        return acc;
+    }
+}, {});

basemap/themes/dark.js

@@ -0,0 +1,13 @@
+import style from './light.js';
+import {Color} from "../utils/color.js";
+
+export default Object.entries(style).reduce((acc, [key, value]) => {
+    let color = Color.fromString(value);
+    if (color == null) {
+        acc[key] = value;
+        return acc;
+    } else {
+        acc[key] = color.grayscale().invert().toString();
+        return acc;
+    }
+}, {});

basemap/themes/default.js

@@ -1,5 +1,4 @@
 export default {
-
     aerialwayStyleLinePaintLineColor: 'rgb(177, 177, 175)',
     aerowayLineRunwayLineColor: 'rgba(187, 187, 204, 1.0)',
     aerowayLineTaxiwayLineColor: 'rgba(187, 187, 204, 1.0)',
@@ -607,6 +606,4 @@ export default {
     waterwayLineWaterwayLineColor: 'rgb(170, 211, 223)',
     waterwayTunnelCasingLineColor: 'rgb(170, 211, 223)',
     waterwayTunnelLineLineColor: 'rgb(243, 247, 247)'
-
-
 };

basemap/themes/deuteranomaly.js

@@ -0,0 +1,13 @@
+import style from './default.js';
+import {Color, ColorBlind} from "../utils/color.js";
+
+export default Object.entries(style).reduce((acc, [key, value]) => {
+    let color = Color.fromString(value);
+    if (color == null) {
+        acc[key] = value;
+        return acc;
+    } else {
+        acc[key] = color.colorblind(ColorBlind.Deuteranomaly).toString();
+        return acc;
+    }
+}, {});

basemap/themes/deuteranopia.js

@@ -0,0 +1,13 @@
+import style from './default.js';
+import {Color, ColorBlind} from "../utils/color.js";
+
+export default Object.entries(style).reduce((acc, [key, value]) => {
+    let color = Color.fromString(value);
+    if (color == null) {
+        acc[key] = value;
+        return acc;
+    } else {
+        acc[key] = color.colorblind(ColorBlind.Deuteranopia).toString();
+        return acc;
+    }
+}, {});

basemap/themes/grayscale.js

@@ -0,0 +1,13 @@
+import style from './default.js';
+import {Color} from "../utils/color.js";
+
+export default Object.entries(style).reduce((acc, [key, value]) => {
+    let color = Color.fromString(value);
+    if (color == null) {
+        acc[key] = value;
+        return acc;
+    } else {
+        acc[key] = color.grayscale().toString();
+        return acc;
+    }
+}, {});

basemap/themes/light.js

@@ -1,49 +1,13 @@
-import * as importedTools from "./tools.js";
-import positronScheme from "./positron.js";
-
-const CLARITYFACTOR = 4.7;
-
-
-function lightScheme(string) {
-    const table = importedTools.cutRgbString(string);
-    if (table[1] != null) {
-        let newColor = importedTools.max - importedTools.clamp(table[0] / CLARITYFACTOR);
-        return importedTools.giveNewColorString(table, newColor, newColor, newColor);
+import style from './grayscale.js';
+import {Color} from "../utils/color.js";
+
+export default Object.entries(style).reduce((acc, [key, value]) => {
+    let color = Color.fromString(value);
+    if (color == null) {
+        acc[key] = value;
+        return acc;
+    } else {
+        acc[key] = color.grayscale().lighten(0.1).toString();
+        return acc;
     }
-    return null;
-}
-
-export default Object.entries(positronScheme).reduce((acc, [key, value]) => {
-    acc[key] = lightScheme(value);
-    return {
-        ...acc,
-        attractionStyleWaterSlideLineColor: 'rgb(175,175,175)',
-        landuseBackgroundBasinFillColor: 'rgb(175,175,175)',
-        leisureBackgroundSwimmingPoolFillColor: 'rgb(175,175,175)',
-        leisureOverlaySwimmingPoolFillOutlineColor: 'rgb(175,175,175)',
-        naturalBackgroundWaterFillColor: 'rgb(175,175,175)',
-        naturalOverlayLakeFillColor: 'rgb(175,175,175)',
-        naturalWaterFillColor: 'rgb(175,175,175)',
-        oceanWaterFillColor: 'rgb(175,175,175)',
-        pointCountryLabelCountryTextColor: 'rgb(90, 56, 90)',
-        pointCountryLabelPaintTextHaloColor: 'rgba(255, 255, 255, 0.8)',
-        pointIconWaterfallIconColor: 'rgb(175,175,175)',
-        pointIconWaterfallTextColor: 'rgb(175,175,175)',
-        pointLabelCityFilterOneLabelColor: 'rgb(100, 100, 100)',
-        pointLabelCityFilterTwoLabelColor: 'rgb(50, 50, 50)',
-        pointLabelCityLabelColor: 'rgb(25, 25, 25)',
-        pointLabelLocalityLabelColor: 'rgb(100, 100, 100)',
-        pointLabelPaintTextHaloColor: 'rgba(255, 255, 255, 0.8)',
-        pointLabelPlaceTextColor: 'rgba(100, 100, 100, 1)',
-        pointLabelTownFilterOneLabelColor: 'rgb(100, 100, 100)',
-        pointLabelTownFilterTwoLabelColor: 'rgb(75, 75, 75)',
-        pointLabelVillageLabelColor: 'rgb(100, 100, 100)',
-        waterwayLabelTextColor: 'rgb(175,175,175)',
-        waterwayLabelTextHaloColor: 'rgb(175,175,175)',
-        waterwayLineWaterwayLineColor: 'rgb(175,175,175)',
-        waterwayTunnelCasingLineColor: 'rgb(175,175,175)',
-        waterwayTunnelLineLineColor: 'rgb(175,175,175)',
-    };
-
-
 }, {});

basemap/themes/protanomaly.js

@@ -0,0 +1,13 @@
+import style from './default.js';
+import {Color, ColorBlind} from "../utils/color.js";
+
+export default Object.entries(style).reduce((acc, [key, value]) => {
+    let color = Color.fromString(value);
+    if (color == null) {
+        acc[key] = value;
+        return acc;
+    } else {
+        acc[key] = color.colorblind(ColorBlind.Protanomaly).toString();
+        return acc;
+    }
+}, {});

basemap/themes/protanopia.js

@@ -0,0 +1,13 @@
+import style from './default.js';
+import {Color, ColorBlind} from "../utils/color.js";
+
+export default Object.entries(style).reduce((acc, [key, value]) => {
+    let color = Color.fromString(value);
+    if (color == null) {
+        acc[key] = value;
+        return acc;
+    } else {
+        acc[key] = color.colorblind(ColorBlind.Protanopia).toString();
+        return acc;
+    }
+}, {});

basemap/themes/transportation.js

@@ -0,0 +1,20 @@
+import style from './default.js';
+import {Color} from "../utils/color.js";
+
+export default Object.entries(style).reduce((acc, [key, value]) => {
+    let color = Color.fromString(value);
+    if (color == null) {
+        acc[key] = value;
+        return acc;
+    } else if (key.toLowerCase().includes("highway")
+        || key.toLowerCase().includes("tunnel")
+        || key.toLowerCase().includes("bridge")
+        || key.toLowerCase().includes("rail")
+        || key.toLowerCase().includes("ferry")) {
+        acc[key] = color.darken(0.2).toString();
+        return acc;
+    } else {
+        acc[key] = color.grayscale().lighten(0.1).toString();
+        return acc;
+    }
+}, {});

basemap/themes/tritanomaly.js

@@ -0,0 +1,13 @@
+import style from './default.js';
+import {Color, ColorBlind} from "../utils/color.js";
+
+export default Object.entries(style).reduce((acc, [key, value]) => {
+    let color = Color.fromString(value);
+    if (color == null) {
+        acc[key] = value;
+        return acc;
+    } else {
+        acc[key] = color.colorblind(ColorBlind.Tritanomaly).toString();
+        return acc;
+    }
+}, {});

basemap/themes/tritanopia.js

@@ -0,0 +1,13 @@
+import style from './default.js';
+import {Color, ColorBlind} from "../utils/color.js";
+
+export default Object.entries(style).reduce((acc, [key, value]) => {
+    let color = Color.fromString(value);
+    if (color == null) {
+        acc[key] = value;
+        return acc;
+    } else {
+        acc[key] = color.colorblind(ColorBlind.Tritanopia).toString();
+        return acc;
+    }
+}, {});