From 1372027daca3c3b153f09a7c08ec4c42220326c3 Mon Sep 17 00:00:00 2001
From: Pieter Vander Vennet
Date: Sun, 26 Jul 2020 02:01:34 +0200
Subject: [PATCH] Add icons, add validation, add phone and email types, add css
fixes
---
Customizations/AllKnownLayouts.ts | 1 -
Customizations/LayerDefinition.ts | 15 +-
Customizations/Layers/BikeParkings.ts | 5 +-
Customizations/Layers/BikeShops.ts | 5 +-
Customizations/Layers/BikeStations.ts | 7 +-
Customizations/Layers/Birdhide.ts | 8 +-
Customizations/Layers/Bookcases.ts | 13 +-
Customizations/Layers/DrinkingWater.ts | 4 +-
Customizations/Layers/GrbToFix.ts | 6 +-
Customizations/Layers/InformationBoard.ts | 12 +-
Customizations/Layers/Map.ts | 11 +-
Customizations/Layers/NatureReserves.ts | 4 +-
Customizations/Layers/Viewpoint.ts | 5 +-
Customizations/Layout.ts | 5 +-
Customizations/Layouts/Bookcases.ts | 27 +-
Customizations/Layouts/Cyclofix.ts | 6 +-
Customizations/Layouts/Groen.ts | 5 +-
Customizations/Layouts/MetaMap.ts | 1 +
Customizations/Layouts/Natuurpunt.ts | 1 +
Customizations/Layouts/Statues.ts | 2 +-
Customizations/Layouts/StreetWidth.ts | 8 +-
Customizations/Questions/NameInline.ts | 13 +-
Customizations/TagRendering.ts | 18 +-
Helpers.ts | 15 +
Logic/Basemap.ts | 3 +-
Logic/FilteredLayer.ts | 46 +-
Logic/GeoLocationHandler.ts | 9 +-
Logic/LocalStorageSource.ts | 8 +-
UI/Image/ImgurImage.ts | 2 +-
UI/Image/SimpleImageElement.ts | 2 +-
UI/Image/WikimediaImage.ts | 2 +-
UI/Input/InputElementWrapper.ts | 4 -
UI/SlideShow.ts | 2 +-
UI/UIElement.ts | 8 +-
UI/i18n/Translation.ts | 2 -
UI/i18n/Translations.ts | 84 +-
assets/add.svg | 289 ++
assets/bike/broken_pump_2.svg | 219 ++
assets/bike/logo.svg | 165 ++
assets/logo.svg | 297 ++
assets/logos/logo.svg | 3300 ---------------------
assets/logos/logo192.png | Bin 40976 -> 0 bytes
assets/logos/logo512.png | Bin 162707 -> 0 bytes
clean.sh | 13 +
createLayouts.ts | 203 +-
deploy.sh | 4 +-
index.css | 7 +
index.html | 21 +-
index.ts | 10 +-
manifest.webmanifest => manifest.manifest | 8 +-
package-lock.json | 710 ++++-
package.json | 13 +-
vendor/images/layers-2x.png | Bin 0 -> 1259 bytes
vendor/images/layers.png | Bin 0 -> 696 bytes
vendor/images/marker-icon.png | Bin 0 -> 1466 bytes
vendor/leaflet.css | 640 ++++
56 files changed, 2794 insertions(+), 3474 deletions(-)
create mode 100644 assets/add.svg
create mode 100644 assets/bike/broken_pump_2.svg
create mode 100644 assets/bike/logo.svg
create mode 100644 assets/logo.svg
delete mode 100644 assets/logos/logo.svg
delete mode 100644 assets/logos/logo192.png
delete mode 100644 assets/logos/logo512.png
rename manifest.webmanifest => manifest.manifest (75%)
create mode 100644 vendor/images/layers-2x.png
create mode 100644 vendor/images/layers.png
create mode 100644 vendor/images/marker-icon.png
create mode 100644 vendor/leaflet.css
diff --git a/Customizations/AllKnownLayouts.ts b/Customizations/AllKnownLayouts.ts
index ba69d30..12e8bc0 100644
--- a/Customizations/AllKnownLayouts.ts
+++ b/Customizations/AllKnownLayouts.ts
@@ -40,7 +40,6 @@ export class AllKnownLayouts {
if (knownKeys.indexOf(key) >= 0) {
continue;
}
- console.log(key)
knownKeys.push(key);
all.layers.push(layer);
}
diff --git a/Customizations/LayerDefinition.ts b/Customizations/LayerDefinition.ts
index bdf480f..e1dbc86 100644
--- a/Customizations/LayerDefinition.ts
+++ b/Customizations/LayerDefinition.ts
@@ -70,7 +70,10 @@ export class LayerDefinition {
*/
style: (tags: any) => {
color: string,
- icon: any,
+ icon: {
+ iconUrl: string,
+ iconSize: number[],
+ },
};
/**
@@ -119,16 +122,6 @@ export class LayerDefinition {
this.wayHandling = options.wayHandling ?? LayerDefinition.WAYHANDLING_DEFAULT;
}
- asLayer(basemap: Basemap, allElements: ElementStorage, changes: Changes, userDetails: UIEventSource,
- selectedElement: UIEventSource<{feature: any}>,
- showOnPopup: (tags: UIEventSource, feature: any) => UIElement):
- FilteredLayer {
- return new FilteredLayer(
- this,
- basemap, allElements, changes,
- selectedElement,
- showOnPopup);
- }
}
\ No newline at end of file
diff --git a/Customizations/Layers/BikeParkings.ts b/Customizations/Layers/BikeParkings.ts
index 67b0b89..765a954 100644
--- a/Customizations/Layers/BikeParkings.ts
+++ b/Customizations/Layers/BikeParkings.ts
@@ -1,7 +1,6 @@
import {LayerDefinition} from "../LayerDefinition";
import {And, Or, Tag} from "../../Logic/TagsFilter";
import {OperatorTag} from "../Questions/OperatorTag";
-import * as L from "leaflet";
import FixedText from "../Questions/FixedText";
import ParkingType from "../Questions/bike/ParkingType";
import {ImageCarouselWithUploadConstructor} from "../../UI/Image/ImageCarouselWithUpload";
@@ -47,11 +46,11 @@ export default class BikeParkings extends LayerDefinition {
return function (properties: any) {
return {
color: "#00bb00",
- icon: L.icon({
+ icon: {
iconUrl: self.icon,
iconSize: [50, 50],
iconAnchor: [25,50]
- })
+ }
};
};
}
diff --git a/Customizations/Layers/BikeShops.ts b/Customizations/Layers/BikeShops.ts
index 6fa764b..e07b981 100644
--- a/Customizations/Layers/BikeShops.ts
+++ b/Customizations/Layers/BikeShops.ts
@@ -3,7 +3,6 @@ import Translations from "../../UI/i18n/Translations";
import {And, Tag} from "../../Logic/TagsFilter";
import FixedText from "../Questions/FixedText";
import { ImageCarouselWithUploadConstructor } from "../../UI/Image/ImageCarouselWithUpload";
-import * as L from "leaflet";
import ShopRetail from "../Questions/bike/ShopRetail";
import ShopPump from "../Questions/bike/ShopPump";
import ShopRental from "../Questions/bike/ShopRental";
@@ -71,11 +70,11 @@ export default class BikeShops extends LayerDefinition {
return {
color: "#00bb00",
- icon: L.icon({
+ icon: {
iconUrl: icon,
iconSize: [50, 50],
iconAnchor: [25, 50]
- })
+ }
}
}
}
diff --git a/Customizations/Layers/BikeStations.ts b/Customizations/Layers/BikeStations.ts
index ff2987b..cac60ae 100644
--- a/Customizations/Layers/BikeStations.ts
+++ b/Customizations/Layers/BikeStations.ts
@@ -1,6 +1,5 @@
import {LayerDefinition} from "../LayerDefinition";
import {And, Tag, TagsFilter, Or} from "../../Logic/TagsFilter";
-import * as L from "leaflet";
import BikeStationChain from "../Questions/bike/StationChain";
import BikeStationPumpTools from "../Questions/bike/StationPumpTools";
import BikeStationStand from "../Questions/bike/StationStand";
@@ -72,18 +71,18 @@ export default class BikeStations extends LayerDefinition {
if (isOperational) {
iconName = "pump.svg"
} else {
- iconName = "broken_pump.svg"
+ iconName = "broken_pump_2.svg"
}
}
const iconUrl = `./assets/bike/${iconName}`
return {
color: "#00bb00",
- icon: L.icon({
+ icon: {
iconUrl: iconUrl,
iconSize: [50, 50],
iconAnchor: [25, 50]
- })
+ }
};
};
}
diff --git a/Customizations/Layers/Birdhide.ts b/Customizations/Layers/Birdhide.ts
index a917e79..ea9e642 100644
--- a/Customizations/Layers/Birdhide.ts
+++ b/Customizations/Layers/Birdhide.ts
@@ -3,7 +3,6 @@ import {And, Or, Tag} from "../../Logic/TagsFilter";
import {TagRenderingOptions} from "../TagRendering";
import FixedText from "../Questions/FixedText";
import {ImageCarouselWithUploadConstructor} from "../../UI/Image/ImageCarouselWithUpload";
-import L from "leaflet";
export class Birdhide extends LayerDefinition {
@@ -13,8 +12,9 @@ export class Birdhide extends LayerDefinition {
constructor() {
super({
name: "vogelkijkplaats",
+ description: "Een plaats om vogels te kijken, zoals een vogelkijkhut of kijkwand",
overpassFilter: Birdhide.birdhide,
- elementsToShow: [new FixedText("hi")],
+ elementsToShow: [],
icon: "assets/nature/birdhide.svg",
minzoom: 12,
wayHandling: LayerDefinition.WAYHANDLING_CENTER_AND_WAY,
@@ -90,11 +90,11 @@ export class Birdhide extends LayerDefinition {
return {
color: "#0000bb",
- icon: L.icon({
+ icon: {
iconUrl: icon,
iconSize: [40,40],
iconAnchor: [20,20]
- })
+ }
}
}
diff --git a/Customizations/Layers/Bookcases.ts b/Customizations/Layers/Bookcases.ts
index 1f67cbd..6092291 100644
--- a/Customizations/Layers/Bookcases.ts
+++ b/Customizations/Layers/Bookcases.ts
@@ -1,9 +1,9 @@
import {LayerDefinition} from "../LayerDefinition";
-import L from "leaflet";
import {And, Or, Tag} from "../../Logic/TagsFilter";
import {TagRenderingOptions} from "../TagRendering";
import {NameInline} from "../Questions/NameInline";
import {ImageCarouselWithUploadConstructor} from "../../UI/Image/ImageCarouselWithUpload";
+import Translations from "../../UI/i18n/Translations";
export class Bookcases extends LayerDefinition {
@@ -16,7 +16,7 @@ export class Bookcases extends LayerDefinition {
this.overpassFilter = new Tag("amenity", "public_bookcase");
this.minzoom = 11;
- this.title = new NameInline("ruilboekenkastje");
+ this.title = new NameInline(Translations.t.bookcases.bookcase);
this.elementsToShow = [
new ImageCarouselWithUploadConstructor(),
new TagRenderingOptions({
@@ -38,7 +38,7 @@ export class Bookcases extends LayerDefinition {
question: "Hoeveel boeken passen in dit boekenruilkastje?",
freeform: {
renderTemplate: "Er passen {capacity} boeken in dit boekenruilkastje",
- template: "Er passen $$$ boeken in dit boekenruilkastje",
+ template: "Er passen $nat$ boeken in dit boekenruilkastje",
key: "capacity",
placeholder: "aantal"
},
@@ -159,10 +159,11 @@ export class Bookcases extends LayerDefinition {
this.style = function (tags) {
return {
- icon: new L.icon({
+ icon: {
iconUrl: "assets/bookcase.svg",
- iconSize: [40, 40]
- }),
+ iconSize: [40, 40],
+ iconAnchor: [20,20]
+ },
color: "#0000ff"
};
}
diff --git a/Customizations/Layers/DrinkingWater.ts b/Customizations/Layers/DrinkingWater.ts
index bfefdf8..579eed4 100644
--- a/Customizations/Layers/DrinkingWater.ts
+++ b/Customizations/Layers/DrinkingWater.ts
@@ -52,11 +52,11 @@ export class DrinkingWater extends LayerDefinition {
return {
color: "#00bb00",
- icon: new L.icon({
+ icon: {
iconUrl: self.icon,
iconSize: [50, 50],
iconAnchor: [25,50]
- })
+ }
};
};
}
diff --git a/Customizations/Layers/GrbToFix.ts b/Customizations/Layers/GrbToFix.ts
index 5c7fcf9..d92f8b3 100644
--- a/Customizations/Layers/GrbToFix.ts
+++ b/Customizations/Layers/GrbToFix.ts
@@ -1,5 +1,4 @@
import {LayerDefinition} from "../LayerDefinition";
-import L from "leaflet"
import {And, Regex, Tag} from "../../Logic/TagsFilter";
import {TagRenderingOptions} from "../TagRendering";
@@ -18,11 +17,10 @@ export class GrbToFix extends LayerDefinition {
this.style = function (tags) {
return {
- icon: new L.icon({
+ icon: {
iconUrl: "assets/star.svg",
iconSize: [40, 40],
- text: "hi"
- }),
+ },
color: "#ff0000"
};
diff --git a/Customizations/Layers/InformationBoard.ts b/Customizations/Layers/InformationBoard.ts
index 240e9e1..7b696db 100644
--- a/Customizations/Layers/InformationBoard.ts
+++ b/Customizations/Layers/InformationBoard.ts
@@ -3,12 +3,12 @@ import FixedText from "../Questions/FixedText";
import {ImageCarouselWithUploadConstructor} from "../../UI/Image/ImageCarouselWithUpload";
import {TagRenderingOptions} from "../TagRendering";
import {And, Tag} from "../../Logic/TagsFilter";
-import L from "leaflet";
export class InformationBoard extends LayerDefinition {
constructor() {
super({
name: "Informatiebord",
+ description: "Een informatiebord of kaart",
minzoom: 12,
overpassFilter: new Tag("tourism", "information"),
newElementTags: [new Tag("tourism", "information")],
@@ -44,12 +44,10 @@ export class InformationBoard extends LayerDefinition {
return {
color: "#000000",
- icon: L.icon(
- {
- iconUrl: icon,
- iconSize: [50, 50]
- }
- )
+ icon: {
+ iconUrl: icon,
+ iconSize: [50, 50]
+ }
};
}
diff --git a/Customizations/Layers/Map.ts b/Customizations/Layers/Map.ts
index aeadf29..183db79 100644
--- a/Customizations/Layers/Map.ts
+++ b/Customizations/Layers/Map.ts
@@ -3,7 +3,6 @@ import FixedText from "../Questions/FixedText";
import {ImageCarouselWithUploadConstructor} from "../../UI/Image/ImageCarouselWithUpload";
import {TagRenderingOptions} from "../TagRendering";
import {And, Tag} from "../../Logic/TagsFilter";
-import L from "leaflet";
export class Map extends LayerDefinition {
constructor() {
@@ -36,12 +35,10 @@ export class Map extends LayerDefinition {
return {
color: "#000000",
- icon: L.icon(
- {
- iconUrl: icon,
- iconSize: [50, 50]
- }
- )
+ icon: {
+ iconUrl: icon,
+ iconSize: [50, 50]
+ }
};
}
diff --git a/Customizations/Layers/NatureReserves.ts b/Customizations/Layers/NatureReserves.ts
index 3481042..d3f13c6 100644
--- a/Customizations/Layers/NatureReserves.ts
+++ b/Customizations/Layers/NatureReserves.ts
@@ -72,7 +72,7 @@ export class NatureReserves extends LayerDefinition {
freeform: {
renderTemplate: "Bij problemen of vragen, de conservator kan bereikt worden via " +
"{email}",
- template: "$$$",
+ template: "$email$",
key: "email"
}
}),
@@ -83,7 +83,7 @@ export class NatureReserves extends LayerDefinition {
freeform: {
renderTemplate: "Bij problemen of vragen, de {conservator} kan bereikt worden via " +
"{phone}",
- template: "$$$",
+ template: "$phone$",
key: "phone"
}
diff --git a/Customizations/Layers/Viewpoint.ts b/Customizations/Layers/Viewpoint.ts
index 5012e79..442d94e 100644
--- a/Customizations/Layers/Viewpoint.ts
+++ b/Customizations/Layers/Viewpoint.ts
@@ -1,5 +1,4 @@
import {LayerDefinition} from "../LayerDefinition";
-import L from "leaflet"
import {FixedUiElement} from "../../UI/Base/FixedUiElement";
import FixedText from "../Questions/FixedText";
import {Tag} from "../../Logic/TagsFilter";
@@ -17,10 +16,10 @@ export class Viewpoint extends LayerDefinition {
wayHandling: LayerDefinition.WAYHANDLING_CENTER_ONLY,
style: tags => {
return {
- color: undefined, icon: new L.icon({
+ color: undefined, icon:{
iconUrl: "assets/viewpoint.svg",
iconSize: [20, 20]
- })
+ }
}
},
maxAllowedOverlapPercentage: 0,
diff --git a/Customizations/Layout.ts b/Customizations/Layout.ts
index 077fbe5..5d11f29 100644
--- a/Customizations/Layout.ts
+++ b/Customizations/Layout.ts
@@ -14,8 +14,11 @@ import {UIEventSource} from "../UI/UIEventSource";
export class Layout {
public name: string;
- public icon: string = "./assets/add.svg";
+ public icon: string = "./assets/logo.svg";
public title: UIElement;
+ public description: string | UIElement = Translations.t.general.about;
+ public socialImage: string = ""
+
public layers: LayerDefinition[];
public welcomeMessage: UIElement;
public gettingStartedPlzLogin: UIElement;
diff --git a/Customizations/Layouts/Bookcases.ts b/Customizations/Layouts/Bookcases.ts
index d833d6e..0a4f1aa 100644
--- a/Customizations/Layouts/Bookcases.ts
+++ b/Customizations/Layouts/Bookcases.ts
@@ -1,29 +1,20 @@
import {Layout} from "../Layout";
import * as Layer from "../Layers/Bookcases";
+import Translations from "../../UI/i18n/Translations";
+import Combine from "../../UI/Base/Combine";
-export class Bookcases extends Layout{
+export class Bookcases extends Layout {
constructor() {
- super( "bookcases",
- ["nl"],
- "Open Bookcase Map",
+ super("bookcases",
+ ["nl", "en"],
+ Translations.t.bookcases.title,
[new Layer.Bookcases()],
14,
51.2,
3.2,
-
- "
Open BoekenkastjesKaart
\n" +
- "\n" +
- "
" +
- "Help mee met het creëeren van een volledige kaart met alle boekenruilkastjes!" +
- "Een boekenruilkastje is een vaste plaats in publieke ruimte waar iedereen een boek in kan zetten of uit kan meenemen." +
- "Meestal een klein kastje of doosje dat op straat staat, maar ook een oude telefooncellen of een schap in een station valt hieronder."+
- "
",
- "Klik op een boekenruilkastje om vragen te beantwoorden");
- this.locationContains= ["Bookcases.html", "Bookcase.html","bookcase"]
+ new Combine(["
",Translations.t.bookcases.title,"
", Translations.t.bookcases.description])
+ );
+ this.icon = "assets/bookcase.svg"
}
}
\ No newline at end of file
diff --git a/Customizations/Layouts/Cyclofix.ts b/Customizations/Layouts/Cyclofix.ts
index 2cadb07..398e211 100644
--- a/Customizations/Layouts/Cyclofix.ts
+++ b/Customizations/Layouts/Cyclofix.ts
@@ -10,7 +10,7 @@ import Combine from "../../UI/Base/Combine";
export default class Cyclofix extends Layout {
constructor() {
super(
- "pomp",
+ "cyclofix",
["en", "nl", "fr"],
Translations.t.cyclofix.title,
[new BikeServices(), new BikeShops(), new DrinkingWater(), new BikeParkings()],
@@ -25,6 +25,8 @@ export default class Cyclofix extends Layout {
"
"
])
);
- this.icon = "./assets/bike/pump.svg"
+ this.icon = "./assets/bike/logo.svg"
+ this.description = "Easily search and contribute bicycle data nearby";
+ this.socialImage = "./assets/bike/cyclofix.jpeg"
}
}
diff --git a/Customizations/Layouts/Groen.ts b/Customizations/Layouts/Groen.ts
index 6faef2c..3ca7fe0 100644
--- a/Customizations/Layouts/Groen.ts
+++ b/Customizations/Layouts/Groen.ts
@@ -9,7 +9,7 @@ export class Groen extends Layout {
constructor() {
super("buurtnatuur",
["nl"],
- "Buurtnatuur",
+ "Buurtnatuur.be",
[new NatureReserves(), new Park(), new Bos(), new Viewpoint()],
10,
50.8435,
@@ -52,6 +52,9 @@ export class Groen extends Layout {
""
);
+ this.icon = "assets/groen.svg"
this.locationContains = ["buurtnatuur.be"]
+ this.socialImage = "assets/BuurtnatuurFront.jpg"
+ this.description = "Met deze tool kan je natuur in je buurt in kaart brengen en meer informatie geven over je favoriete plekje"
}
}
\ No newline at end of file
diff --git a/Customizations/Layouts/MetaMap.ts b/Customizations/Layouts/MetaMap.ts
index c174bc6..6486e9b 100644
--- a/Customizations/Layouts/MetaMap.ts
+++ b/Customizations/Layouts/MetaMap.ts
@@ -15,5 +15,6 @@ export class MetaMap extends Layout{
"
Open Map Map
\n" +
"This map is a map of physical maps, as known by OpenStreetMap.");
+ this.icon = "assets/osm-logo-buggy-attr.svg"
}
}
\ No newline at end of file
diff --git a/Customizations/Layouts/Natuurpunt.ts b/Customizations/Layouts/Natuurpunt.ts
index a03d4b9..26566e4 100644
--- a/Customizations/Layouts/Natuurpunt.ts
+++ b/Customizations/Layouts/Natuurpunt.ts
@@ -18,5 +18,6 @@ export class Natuurpunt extends Layout{
"",
""
);
+ this.icon = "./assets/nature/birdhide.svg"
}
}
\ No newline at end of file
diff --git a/Customizations/Layouts/Statues.ts b/Customizations/Layouts/Statues.ts
index d355fa4..90740bb 100644
--- a/Customizations/Layouts/Statues.ts
+++ b/Customizations/Layouts/Statues.ts
@@ -4,8 +4,8 @@ import {Artwork} from "../Layers/Artwork";
export class Statues extends Layout{
constructor() {
super( "statues",
- "Open Artwork Map",
["en"],
+ "Open Artwork Map",
[new Artwork()],
10,
50.8435,
diff --git a/Customizations/Layouts/StreetWidth.ts b/Customizations/Layouts/StreetWidth.ts
index faaea76..7ad592c 100644
--- a/Customizations/Layouts/StreetWidth.ts
+++ b/Customizations/Layouts/StreetWidth.ts
@@ -84,9 +84,9 @@ export class StreetWidth extends Layout{
"
Het aantal woonerven uitbreiden
" +
"
Grotere auto's meer belasten - ze nemen immers meer parkeerruimte in.
" +
"
Laat toeristen verplicht parkeren onder het zand; een (fiets)taxi kan hen naar hun hotel brengen
" +
- "
Voorzie in elke straat enkele parkeerplaatsen voor kortparkeren. Zo kunnen leveringen, iemand afzetten,... gebeuren zonder dat er een fietspad of een straat geblokkeerd wordt
"+
- "",
- "",
- "");
+ "
Voorzie in elke straat enkele parkeerplaatsen voor kortparkeren. Zo kunnen leveringen, iemand afzetten,... gebeuren zonder dat er een fietspad of een straat geblokkeerd wordt