From 703667e3fae81fd947d7cffcb0e9cfc380c2f3b2 Mon Sep 17 00:00:00 2001 From: Lukas Winkler Date: Sat, 30 Sep 2023 22:05:22 +0200 Subject: [PATCH] add future nonbinary crossing --- assets/nonbinaryflag.svg | 6 ++ assets/prideflag-hallein.svg | 8 -- data/Wien.json | 40 ++++++++++ data/schema.json | 3 +- interfaces.ts | 2 +- package-lock.json | 148 ++++++----------------------------- package.json | 2 +- src/features.ts | 4 +- src/map.ts | 15 +++- src/simpledraw.ts | 9 ++- src/zebraUtils.ts | 5 +- 11 files changed, 101 insertions(+), 141 deletions(-) create mode 100644 assets/nonbinaryflag.svg delete mode 100644 assets/prideflag-hallein.svg diff --git a/assets/nonbinaryflag.svg b/assets/nonbinaryflag.svg new file mode 100644 index 0000000..1a51f36 --- /dev/null +++ b/assets/nonbinaryflag.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/assets/prideflag-hallein.svg b/assets/prideflag-hallein.svg deleted file mode 100644 index ddc724f..0000000 --- a/assets/prideflag-hallein.svg +++ /dev/null @@ -1,8 +0,0 @@ - - - - - - - - diff --git a/data/Wien.json b/data/Wien.json index fd38750..f46480b 100644 --- a/data/Wien.json +++ b/data/Wien.json @@ -1841,5 +1841,45 @@ ], "length": 21.03 } + }, + { + "id": 1166723159, + "name": "Am Heumarkt", + "type": "nonbinaryFlag", + "bezirk": 3, + "comment": "existiert noch nicht", + "sources": [ + { + "type": "proposal", + "url": "https://www.ggg.at/2023/09/29/exklusiv-wien-bekommt-seinen-ersten-nonbinary-zebrastreifen/", + "date": "2023-09-29" + } + ], + "geosource": { + "type": "RawCoords", + "coords": [ + [ + 16.3801164, + 48.2016298 + ], + [ + 16.3802898, + 48.2017652 + ] + ] + }, + "geo": { + "coords": [ + [ + 16.3801164, + 48.2016298 + ], + [ + 16.3802898, + 48.2017652 + ] + ], + "length": 19.79 + } } ] diff --git a/data/schema.json b/data/schema.json index 61c0e3d..e02c6db 100644 --- a/data/schema.json +++ b/data/schema.json @@ -138,7 +138,8 @@ "type": "string", "enum": [ "prideFlag", - "transFlag" + "transFlag", + "nonbinaryFlag" ] }, "geo": { diff --git a/interfaces.ts b/interfaces.ts index 25e8844..69327af 100644 --- a/interfaces.ts +++ b/interfaces.ts @@ -1,4 +1,4 @@ -export type FlagType = "prideFlag" | "transFlag" +export type FlagType = "prideFlag" | "transFlag" | "nonbinaryFlag" export type Coord = number[] export type Coords = Coord[] diff --git a/package-lock.json b/package-lock.json index 07529bf..97b12f8 100644 --- a/package-lock.json +++ b/package-lock.json @@ -17,7 +17,7 @@ "micromodal": "^0.4.10", "navigo": "^8.11.1", "node-fetch": "^3.2.10", - "ol": "^7.0.0", + "ol": "^8.0.0", "ts-node": "^10.9.1" }, "devDependencies": { @@ -413,49 +413,10 @@ "@jridgewell/sourcemap-codec": "^1.4.10" } }, - "node_modules/@mapbox/jsonlint-lines-primitives": { - "version": "2.0.2", - "resolved": "https://registry.npmjs.org/@mapbox/jsonlint-lines-primitives/-/jsonlint-lines-primitives-2.0.2.tgz", - "integrity": "sha512-rY0o9A5ECsTQRVhv7tL/OyDpGAoUB4tTvLiW1DSzQGq4bvTPhNw1VpSNjDJc5GFZ2XuyOtSWSVN05qOtcD71qQ==", - "engines": { - "node": ">= 0.6" - } - }, - "node_modules/@mapbox/mapbox-gl-style-spec": { - "version": "13.28.0", - "resolved": "https://registry.npmjs.org/@mapbox/mapbox-gl-style-spec/-/mapbox-gl-style-spec-13.28.0.tgz", - "integrity": "sha512-B8xM7Fp1nh5kejfIl4SWeY0gtIeewbuRencqO3cJDrCHZpaPg7uY+V8abuR+esMeuOjRl5cLhVTP40v+1ywxbg==", - "dependencies": { - "@mapbox/jsonlint-lines-primitives": "~2.0.2", - "@mapbox/point-geometry": "^0.1.0", - "@mapbox/unitbezier": "^0.0.0", - "csscolorparser": "~1.0.2", - "json-stringify-pretty-compact": "^2.0.0", - "minimist": "^1.2.6", - "rw": "^1.3.3", - "sort-object": "^0.3.2" - }, - "bin": { - "gl-style-composite": "bin/gl-style-composite.js", - "gl-style-format": "bin/gl-style-format.js", - "gl-style-migrate": "bin/gl-style-migrate.js", - "gl-style-validate": "bin/gl-style-validate.js" - } - }, - "node_modules/@mapbox/point-geometry": { - "version": "0.1.0", - "resolved": "https://registry.npmjs.org/@mapbox/point-geometry/-/point-geometry-0.1.0.tgz", - "integrity": "sha512-6j56HdLTwWGO0fJPlrZtdU/B13q8Uwmo18Ck2GnGgN9PCFyKTZ3UbXeEdRFh18i9XQ92eH2VdtpJHpBD3aripQ==" - }, - "node_modules/@mapbox/unitbezier": { - "version": "0.0.0", - "resolved": "https://registry.npmjs.org/@mapbox/unitbezier/-/unitbezier-0.0.0.tgz", - "integrity": "sha512-HPnRdYO0WjFjRTSwO3frz1wKaU649OBFPX3Zo/2WZvuRi6zMiRGui8SnPQiQABgqCf8YikDe5t3HViTVw1WUzA==" - }, "node_modules/@petamoriken/float16": { - "version": "3.8.3", - "resolved": "https://registry.npmjs.org/@petamoriken/float16/-/float16-3.8.3.tgz", - "integrity": "sha512-an2OZ7/6er9Jja8EDUvU/tmtGIutdlb6LwXOwgjzoCjDRAsUd8sRZMBjoPEy78Xa9iOp+Kglk2CHgVwZuZbWbw==" + "version": "3.8.4", + "resolved": "https://registry.npmjs.org/@petamoriken/float16/-/float16-3.8.4.tgz", + "integrity": "sha512-kB+NJ5Br56ZhElKsf0pM7/PQfrDdDVMRz8f0JM6eVOGE+L89z9hwcst9QvWBBnazzuqGTGtPsJNZoQ1JdNiGSQ==" }, "node_modules/@tsconfig/node10": { "version": "1.0.9", @@ -484,9 +445,9 @@ "dev": true }, "node_modules/@types/node": { - "version": "20.5.7", - "resolved": "https://registry.npmjs.org/@types/node/-/node-20.5.7.tgz", - "integrity": "sha512-dP7f3LdZIysZnmvP3ANJYTSwg+wLLl8p7RqniVlV7j+oXSXAbt9h0WIBFmJy5inWZoX9wZN6eXx+YXd9Rh3RBA==" + "version": "20.8.0", + "resolved": "https://registry.npmjs.org/@types/node/-/node-20.8.0.tgz", + "integrity": "sha512-LzcWltT83s1bthcvjBmiBvGJiiUe84NWRHkw+ZV6Fr41z2FbIzvc815dk2nQ3RAKMuN2fkenM/z3Xv2QzEpYxQ==" }, "node_modules/acorn": { "version": "8.10.0", @@ -579,9 +540,9 @@ "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==" }, "node_modules/axios": { - "version": "1.5.0", - "resolved": "https://registry.npmjs.org/axios/-/axios-1.5.0.tgz", - "integrity": "sha512-D4DdjDo5CY50Qms0qGQTTw6Q44jl7zRwY7bthds06pUGfChBCTcQs+N743eFWGEd6pRTMd6A+I87aWyFV5wiZQ==", + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/axios/-/axios-1.5.1.tgz", + "integrity": "sha512-Q28iYCWzNHjAm+yEAot5QaAMxhMghWLFVf7rRdwhUI+c2jix2DUXjAHXVi+s1ibs3mjPO/cCgbA++3BjD0vP/A==", "dependencies": { "follow-redirects": "^1.15.0", "form-data": "^4.0.0", @@ -679,11 +640,6 @@ "resolved": "https://registry.npmjs.org/create-require/-/create-require-1.1.1.tgz", "integrity": "sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ==" }, - "node_modules/csscolorparser": { - "version": "1.0.3", - "resolved": "https://registry.npmjs.org/csscolorparser/-/csscolorparser-1.0.3.tgz", - "integrity": "sha512-umPSgYwZkdFoUrH5hIq5kf0wPSXiro51nPw0j2K/c83KflkPSTBGMz6NJvMB+07VlL0y7VPo6QJcDjcgKTTm3w==" - }, "node_modules/data-uri-to-buffer": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/data-uri-to-buffer/-/data-uri-to-buffer-4.0.1.tgz", @@ -818,9 +774,9 @@ } }, "node_modules/follow-redirects": { - "version": "1.15.2", - "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.2.tgz", - "integrity": "sha512-VQLG33o04KaQ8uYi2tVNbdrWp1QWxNNea+nmIB4EVM28v0hmP17z7aG1+wAkNzVq4KeXTq3221ye5qTJP91JwA==", + "version": "1.15.3", + "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.3.tgz", + "integrity": "sha512-1VzOtuEM8pC9SFU1E+8KfTjZyMztRsgEfwQl44z8A25uy13jSzTj6dyK2Df52iV0vgHCfBwLhDWevLn95w5v6Q==", "funding": [ { "type": "individual", @@ -1038,11 +994,6 @@ "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz", "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==" }, - "node_modules/json-stringify-pretty-compact": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/json-stringify-pretty-compact/-/json-stringify-pretty-compact-2.0.0.tgz", - "integrity": "sha512-WRitRfs6BGq4q8gTgOy4ek7iPFXjbra0H3PmDLKm2xnZ+Gh1HUhiKGgCZkSPNULlP7mvfu6FV/mOLhCarspADQ==" - }, "node_modules/json5": { "version": "2.2.3", "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.3.tgz", @@ -1064,11 +1015,6 @@ "resolved": "https://registry.npmjs.org/make-error/-/make-error-1.3.6.tgz", "integrity": "sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw==" }, - "node_modules/mapbox-to-css-font": { - "version": "2.4.2", - "resolved": "https://registry.npmjs.org/mapbox-to-css-font/-/mapbox-to-css-font-2.4.2.tgz", - "integrity": "sha512-f+NBjJJY4T3dHtlEz1wCG7YFlkODEjFIYlxDdLIDMNpkSksqTt+l/d4rjuwItxuzkuMFvPyrjzV2lxRM4ePcIA==" - }, "node_modules/matomo-lite-tracker": { "version": "1.0.0", "resolved": "git+ssh://git@github.com/Findus23/MatomoLiteTracker.git#0a2a2cb305305ea7c178fb54c67bef54cbe6e688", @@ -1188,13 +1134,12 @@ } }, "node_modules/ol": { - "version": "7.5.1", - "resolved": "https://registry.npmjs.org/ol/-/ol-7.5.1.tgz", - "integrity": "sha512-CFXDhO8YdQt7I+zwrGYSONo/ZM2oLr7vUvxqpLEUyy+USaQjUeE8L6FBOWIPboopGVhnSVYd5hdEirn9ifKBZQ==", + "version": "8.1.0", + "resolved": "https://registry.npmjs.org/ol/-/ol-8.1.0.tgz", + "integrity": "sha512-cx3SH2plpFS9fM8pp1nCypgQXGJD7Mcb1E3mEySmy5XEw1DUEo+kkNzgtAZz5qupekqi7aU9iBJEjCoMfqvO2Q==", "dependencies": { "earcut": "^2.2.3", "geotiff": "^2.0.7", - "ol-mapbox-style": "^10.1.0", "pbf": "3.2.1", "rbush": "^3.0.1" }, @@ -1203,16 +1148,6 @@ "url": "https://opencollective.com/openlayers" } }, - "node_modules/ol-mapbox-style": { - "version": "10.7.0", - "resolved": "https://registry.npmjs.org/ol-mapbox-style/-/ol-mapbox-style-10.7.0.tgz", - "integrity": "sha512-S/UdYBuOjrotcR95Iq9AejGYbifKeZE85D9VtH11ryJLQPTZXZSW1J5bIXcr4AlAH6tyjPPHTK34AdkwB32Myw==", - "dependencies": { - "@mapbox/mapbox-gl-style-spec": "^13.23.1", - "mapbox-to-css-font": "^2.4.1", - "ol": "^7.3.0" - } - }, "node_modules/once": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz", @@ -1270,9 +1205,9 @@ } }, "node_modules/postcss": { - "version": "8.4.28", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.28.tgz", - "integrity": "sha512-Z7V5j0cq8oEKyejIKfpD8b4eBy9cwW2JWPk0+fB1HOAMsfHbnAXLLS+PfVWlzMSLQaWttKDt607I0XHmpE67Vw==", + "version": "8.4.31", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.31.tgz", + "integrity": "sha512-PS08Iboia9mts/2ygV3eLpY5ghnUcfLV/EXTOW1E2qYxJKGGBUtNjN76FYHnMs36RmARn41bC0AZmn+rR0OVpQ==", "dev": true, "funding": [ { @@ -1368,9 +1303,9 @@ } }, "node_modules/rollup": { - "version": "3.28.1", - "resolved": "https://registry.npmjs.org/rollup/-/rollup-3.28.1.tgz", - "integrity": "sha512-R9OMQmIHJm9znrU3m3cpE8uhN0fGdXiawME7aZIpQqvpS/85+Vt1Hq1/yVIcYfOmaQiHjvXkQAoJukvLpau6Yw==", + "version": "3.29.4", + "resolved": "https://registry.npmjs.org/rollup/-/rollup-3.29.4.tgz", + "integrity": "sha512-oWzmBZwvYrU0iJHtDmhsm662rC15FRXmcjCk1xD771dFDx5jJ02ufAQQTn0etB2emNk4J9EZg/yWKpsn9BWGRw==", "dev": true, "bin": { "rollup": "dist/bin/rollup" @@ -1383,15 +1318,10 @@ "fsevents": "~2.3.2" } }, - "node_modules/rw": { - "version": "1.3.3", - "resolved": "https://registry.npmjs.org/rw/-/rw-1.3.3.tgz", - "integrity": "sha512-PdhdWy89SiZogBLaw42zdeqtRJ//zFd2PgQavcICDUgJT5oW10QCRKbJ6bg4r0/UY2M6BWd5tkxuGFRvCkgfHQ==" - }, "node_modules/sass": { - "version": "1.66.1", - "resolved": "https://registry.npmjs.org/sass/-/sass-1.66.1.tgz", - "integrity": "sha512-50c+zTsZOJVgFfTgwwEzkjA3/QACgdNsKueWPyAR0mRINIvLAStVQBbPg14iuqEQ74NPDbXzJARJ/O4SI1zftA==", + "version": "1.68.0", + "resolved": "https://registry.npmjs.org/sass/-/sass-1.68.0.tgz", + "integrity": "sha512-Lmj9lM/fef0nQswm1J2HJcEsBUba4wgNx2fea6yJHODREoMFnwRpZydBnX/RjyXw2REIwdkbqE4hrTo4qfDBUA==", "dev": true, "dependencies": { "chokidar": ">=3.0.0 <4.0.0", @@ -1405,34 +1335,6 @@ "node": ">=14.0.0" } }, - "node_modules/sort-asc": { - "version": "0.1.0", - "resolved": "https://registry.npmjs.org/sort-asc/-/sort-asc-0.1.0.tgz", - "integrity": "sha512-jBgdDd+rQ+HkZF2/OHCmace5dvpos/aWQpcxuyRs9QUbPRnkEJmYVo81PIGpjIdpOcsnJ4rGjStfDHsbn+UVyw==", - "engines": { - "node": ">=0.10.0" - } - }, - "node_modules/sort-desc": { - "version": "0.1.1", - "resolved": "https://registry.npmjs.org/sort-desc/-/sort-desc-0.1.1.tgz", - "integrity": "sha512-jfZacW5SKOP97BF5rX5kQfJmRVZP5/adDUTY8fCSPvNcXDVpUEe2pr/iKGlcyZzchRJZrswnp68fgk3qBXgkJw==", - "engines": { - "node": ">=0.10.0" - } - }, - "node_modules/sort-object": { - "version": "0.3.2", - "resolved": "https://registry.npmjs.org/sort-object/-/sort-object-0.3.2.tgz", - "integrity": "sha512-aAQiEdqFTTdsvUFxXm3umdo04J7MRljoVGbBlkH7BgNsMvVNAJyGj7C/wV1A8wHWAJj/YikeZbfuCKqhggNWGA==", - "dependencies": { - "sort-asc": "^0.1.0", - "sort-desc": "^0.1.1" - }, - "engines": { - "node": ">=0.10.0" - } - }, "node_modules/source-map-js": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz", diff --git a/package.json b/package.json index bf29c3b..8603364 100644 --- a/package.json +++ b/package.json @@ -27,7 +27,7 @@ "micromodal": "^0.4.10", "navigo": "^8.11.1", "node-fetch": "^3.2.10", - "ol": "^7.0.0", + "ol": "^8.0.0", "ts-node": "^10.9.1" }, "author": "", diff --git a/src/features.ts b/src/features.ts index 366f263..71c5c3c 100644 --- a/src/features.ts +++ b/src/features.ts @@ -19,10 +19,10 @@ export function loadData(data: Crossing[], vectorSource: VectorSource): void { put trans flag on top (so they are not covered, but apart from that keep the drawing order random */ - if (a.type == "transFlag") { + if (a.type == "transFlag" || a.type == "nonbinaryFlag") { return 1 } - if (b.type == "transFlag") { + if (b.type == "transFlag" || b.type == "nonbinaryFlag") { return -1 } return Math.random() - 0.5; diff --git a/src/map.ts b/src/map.ts index 748cb7b..91013ee 100644 --- a/src/map.ts +++ b/src/map.ts @@ -9,6 +9,7 @@ import {Line, Vector2d} from "./vectorUtils"; import {drawZebraCrossing, zebraPatterns} from "./zebraUtils"; import prideFlag from "../assets/prideflag.svg" import transFlag from "../assets/transflag.svg" +import nonbinaryFlag from "../assets/nonbinaryflag.svg" import {FeatureProperties} from "./features"; import {areas, viewFromArea, Wien} from "./areaData"; import {Crossing} from "../interfaces"; @@ -99,6 +100,12 @@ const transFlagStyle = new Style({ scale: 0.05 }) }) +const nonbinaryFlagStyle = new Style({ + image: new Icon({ + src: nonbinaryFlag, + scale: 0.05*800/300 + }) +}) const vectorLineLayer = new VectorLayer({ source: vectorSource, @@ -121,9 +128,11 @@ const vectorLineLayer = new VectorLayer({ } switch (crossing.type) { case "prideFlag": - return prideFlagStyle; + return prideFlagStyle case "transFlag": - return transFlagStyle; + return transFlagStyle + case "nonbinaryFlag": + return nonbinaryFlagStyle } } }); @@ -156,6 +165,6 @@ import("./popups").then(popups => { popups.initPopups(map, vectorSource); }) -map.on('click', function(evt){ +map.on('click', function (evt) { console.log(transform(evt.coordinate, 'EPSG:3857', 'EPSG:4326')); }); diff --git a/src/simpledraw.ts b/src/simpledraw.ts index 3d998aa..23fb350 100644 --- a/src/simpledraw.ts +++ b/src/simpledraw.ts @@ -1,6 +1,12 @@ import "./style.scss" import {Line, Vector2d} from "./vectorUtils"; -import {drawZebraCrossing, prideZebraPattern, transZebraPattern, zebraPattern} from "./zebraUtils"; +import { + drawZebraCrossing, + nonbinaryZebraPattern, + prideZebraPattern, + transZebraPattern, + zebraPattern +} from "./zebraUtils"; function main() { @@ -14,6 +20,7 @@ function main() { drawZebraCrossing(ctx, new Line(start, new Vector2d(50, 50)),30, zebraPattern) drawZebraCrossing(ctx, line,30, prideZebraPattern) drawZebraCrossing(ctx, new Line(end, new Vector2d(160, 80)),30, transZebraPattern) + drawZebraCrossing(ctx, new Line(new Vector2d(160, 80), new Vector2d(120, 150)),30, nonbinaryZebraPattern) // line.draw(ctx) // const line = new Line(start, end) // diff --git a/src/zebraUtils.ts b/src/zebraUtils.ts index 05da2c9..5adb024 100644 --- a/src/zebraUtils.ts +++ b/src/zebraUtils.ts @@ -3,6 +3,7 @@ import {FlagType} from "../interfaces"; export const prideFlagColors = ["#e40303", "#ff8c00", "#ffed00", "#008026", "#004dff", "#750787"] export const transFlagColors = ["#5BCEFA", "#F5A9B8"] +export const nonbinaryFlagColors = ["#FFF433", "#9B59D0", "#2D2D2D"] // I assume they will skip the white stripe export type PatternFunction = (i: number) => string export function zebraPattern(i: number): string { @@ -22,10 +23,12 @@ export function generateFlagZebraPattern(colors: string[]): PatternFunction { export const prideZebraPattern = generateFlagZebraPattern(prideFlagColors) export const transZebraPattern = generateFlagZebraPattern(transFlagColors) +export const nonbinaryZebraPattern = generateFlagZebraPattern(nonbinaryFlagColors) export const zebraPatterns: { [d in FlagType]: PatternFunction } = { "prideFlag": prideZebraPattern, - "transFlag": transZebraPattern + "transFlag": transZebraPattern, + "nonbinaryFlag": nonbinaryZebraPattern }