Add new icons for parking/pumps

This commit is contained in:
Pieter Fiers 2020-07-16 15:56:10 +02:00
parent 9d245bcf98
commit 67ceb04148
5 changed files with 32 additions and 39 deletions

View file

@ -3,15 +3,15 @@ import {And, Or, Tag} from "../../Logic/TagsFilter";
import {OperatorTag} from "../Questions/OperatorTag"; import {OperatorTag} from "../Questions/OperatorTag";
import * as L from "leaflet"; import * as L from "leaflet";
import FixedText from "../Questions/FixedText"; import FixedText from "../Questions/FixedText";
import { BikeParkingType } from "../Questions/bike/ParkingType"; import ParkingType from "../Questions/bike/ParkingType";
import {ImageCarouselWithUploadConstructor} from "../../UI/Image/ImageCarouselWithUpload"; import {ImageCarouselWithUploadConstructor} from "../../UI/Image/ImageCarouselWithUpload";
export class BikeParkings extends LayerDefinition {
export default class BikeParkings extends LayerDefinition {
constructor() { constructor() {
super(); super();
this.name = "bike_parking"; this.name = "bike_parking";
this.icon = "./assets/parking.svg"; this.icon = "./assets/bike/parking.svg";
this.overpassFilter = new Tag("amenity", "bicycle_parking"); this.overpassFilter = new Tag("amenity", "bicycle_parking");
this.newElementTags = [ this.newElementTags = [
new Tag("amenity", "bicycle_parking"), new Tag("amenity", "bicycle_parking"),
@ -24,43 +24,21 @@ export class BikeParkings extends LayerDefinition {
this.elementsToShow = [ this.elementsToShow = [
new ImageCarouselWithUploadConstructor(), new ImageCarouselWithUploadConstructor(),
new OperatorTag(), new OperatorTag(),
new BikeParkingType() new ParkingType()
]; ];
} }
private generateStyleFunction() { private generateStyleFunction() {
const self = this; const self = this;
return function (properties: any) { return function (properties: any) {
// let questionSeverity = 0;
// for (const qd of self.elementsToShow) {
// if (qd.IsQuestioning(properties)) {
// questionSeverity = Math.max(questionSeverity, qd.options.priority ?? 0);
// }
// }
// let colormapping = {
// 0: "#00bb00",
// 1: "#00ff00",
// 10: "#dddd00",
// 20: "#ff0000"
// };
// let colour = colormapping[questionSeverity];
// while (colour == undefined) {
// questionSeverity--;
// colour = colormapping[questionSeverity];
// }
return { return {
color: "#00bb00", color: "#00bb00",
icon: new L.icon({ icon: L.icon({
iconUrl: self.icon, iconUrl: self.icon,
iconSize: [30, 30] iconSize: [40, 40]
}) })
}; };
}; };
} }
} }

View file

@ -10,12 +10,13 @@ import BikeStationBrand from "../Questions/bike/StationBrand";
import FixedText from "../Questions/FixedText"; import FixedText from "../Questions/FixedText";
import PumpManometer from "../Questions/bike/PumpManometer"; import PumpManometer from "../Questions/bike/PumpManometer";
import {ImageCarouselWithUploadConstructor} from "../../UI/Image/ImageCarouselWithUpload"; import {ImageCarouselWithUploadConstructor} from "../../UI/Image/ImageCarouselWithUpload";
import PumpOperationalStatus from "../Questions/bike/PumpOperationalStatus"; import PumpOperational from "../Questions/bike/PumpOperational";
import PumpValves from "../Questions/bike/PumpValves"; import PumpValves from "../Questions/bike/PumpValves";
export default class BikeStations extends LayerDefinition { export default class BikeStations extends LayerDefinition {
private readonly pump: TagsFilter = new Tag("service:bicycle:pump", "yes"); private readonly pump: TagsFilter = new Tag("service:bicycle:pump", "yes");
private readonly pumpOperational: TagsFilter = new Tag("service:bicycle:pump:operational_status", "yes");
private readonly tools: TagsFilter = new Tag("service:bicycle:tools", "yes"); private readonly tools: TagsFilter = new Tag("service:bicycle:tools", "yes");
constructor() { constructor() {
@ -47,7 +48,7 @@ export default class BikeStations extends LayerDefinition {
new PumpManual().OnlyShowIf(this.pump), new PumpManual().OnlyShowIf(this.pump),
new PumpManometer().OnlyShowIf(this.pump), new PumpManometer().OnlyShowIf(this.pump),
new PumpValves().OnlyShowIf(this.pump), new PumpValves().OnlyShowIf(this.pump),
new PumpOperationalStatus().OnlyShowIf(this.pump), new PumpOperational().OnlyShowIf(this.pump),
new BikeStationOperator(), new BikeStationOperator(),
// new BikeStationBrand() DISABLED // new BikeStationBrand() DISABLED
@ -57,9 +58,24 @@ export default class BikeStations extends LayerDefinition {
private generateStyleFunction() { private generateStyleFunction() {
const self = this; const self = this;
return function (properties: any) { return function (properties: any) {
const onlyPump = self.pump.matchesProperties(properties) && const hasPump = self.pump.matchesProperties(properties)
!self.tools.matchesProperties(properties) const isOperational = self.pumpOperational.matchesProperties(properties)
const iconUrl = onlyPump ? "./assets/pump.svg" : "./assets/wrench.svg" const hasTools = self.tools.matchesProperties(properties)
let iconName = ""
if (hasPump) {
if (hasTools) {
iconName = "repair_station_pump.svg"
} else {
if (isOperational) {
iconName = "pump.svg"
} else {
iconName = "pump_broken.svg"
}
}
} else {
iconName = "repair_station.svg"
}
const iconUrl = `./assets/bike/${iconName}`
return { return {
color: "#00bb00", color: "#00bb00",
icon: L.icon({ icon: L.icon({

View file

@ -1,6 +1,6 @@
import {Layout} from "../Layout"; import {Layout} from "../Layout";
import { BikeParkings } from "../Layers/BikeParkings"; import BikeParkings from "../Layers/BikeParkings";
import BikeServices from "../Layers/BikeServices"; import BikeServices from "../Layers/BikeStations";
import {GhostBike} from "../Layers/GhostBike"; import {GhostBike} from "../Layers/GhostBike";
@ -9,7 +9,6 @@ export default class Cyclofix extends Layout {
super( super(
"pomp", "pomp",
"Cyclofix bicycle infrastructure", "Cyclofix bicycle infrastructure",
// [new BikePumps()],
[new BikeParkings(), new BikeServices()], [new BikeParkings(), new BikeServices()],
16, 16,
50.8465573, 50.8465573,

View file

@ -2,7 +2,7 @@ import {TagRenderingOptions} from "../../TagRendering";
import {Tag} from "../../../Logic/TagsFilter"; import {Tag} from "../../../Logic/TagsFilter";
export default class PumpOperationalStatus extends TagRenderingOptions{ export default class PumpOperational extends TagRenderingOptions {
constructor() { constructor() {
super({ super({
question: "Is the bicycle pump still operational?", question: "Is the bicycle pump still operational?",

View file

@ -4,7 +4,7 @@
"description": "A small website to edit OSM easily", "description": "A small website to edit OSM easily",
"main": "index.js", "main": "index.js",
"scripts": { "scripts": {
"start": "parcel index.html land.html test.html assets/test.json assets/* UI/* Logic/* vendor/*", "start": "parcel index.html land.html test.html assets/test.json assets/**/* UI/* Logic/* vendor/*",
"build": "rm -rf dist/ && parcel build --public-url ./ index.html land.html assets/*", "build": "rm -rf dist/ && parcel build --public-url ./ index.html land.html assets/*",
"test": "echo \"Error: no test specified\" && exit 1" "test": "echo \"Error: no test specified\" && exit 1"
}, },