diff --git a/AllTranslationAssets.ts b/AllTranslationAssets.ts
index 462d788..53a20cd 100644
--- a/AllTranslationAssets.ts
+++ b/AllTranslationAssets.ts
@@ -66,6 +66,9 @@ export default class AllTranslationAssets {
emailIs: new Translation( {"en":"The email address of this {category} is {email}","ca":"L'adreça de correu de {category} és {email}","es":"La dirección de correo de {category} es {email}","nl":"Het email-adres van {category} is {email}","fr":"L'adresse email de {category} est {email}","gl":"O enderezo de correo electrónico de {category} é {email}","de":"Die E-Mail-Adresse dieser {category} lautet {email}"} ),
},
openStreetMapIntro: new Translation( {"en":"
An Open Map
Wouldn't it be cool if there was a single map, which everyone could freely use and edit? A single place to store all geo-information? Then, all those websites with different, small and incompatible maps (which are always outdated) wouldn't be needed anymore.
OpenStreetMap is this map. The map data can be used for free (with attribution and publication of changes to that data). On top of that, everyone can freely add new data and fix errors. This website uses OpenStreetMap as well. All the data is from there, and your answers and corrections are added there as well.
A ton of people and application already use OpenStreetMap: Maps.me, OsmAnd, but also the maps at Facebook, Instagram, Apple-maps and Bing-maps are (partly) powered by OpenStreetMap.If you change something here, it'll be reflected in those applications too - after their next update!
","es":"
Un mapa abierto
¿No sería genial si hubiera un solo mapa, que todos pudieran usar y editar libremente?¿Un solo lugar para almacenar toda la información geográfica? Entonces, todos esos sitios web con mapas diferentes, pequeños e incompatibles (que siempre están desactualizados) ya no serían necesarios.
OpenStreetMap es ese mapa. Los datos del mapa se pueden utilizar de forma gratuita (con atribución y publicación de cambios en esos datos).Además de eso, todos pueden agregar libremente nuevos datos y corregir errores. Este sitio web también usa OpenStreetMap. Todos los datos provienen de allí, y tus respuestas y correcciones también se añadirán allí.
Muchas personas y aplicaciones ya usan OpenStreetMap: Maps.me, OsmAnd, pero también los mapas de Facebook, Instagram, Apple y Bing son (en parte) impulsados por OpenStreetMap .Si cambias algo aquí, también se reflejará en esas aplicaciones, en su próxima actualización
","ca":"
Un mapa obert
No seria genial si hagués un únic mapa, que tothom pogués utilitzar i editar lliurement?Un sol lloc on emmagatzemar tota la informació geogràfica? Llavors tots aquests llocs web amb mapes diferents petits i incompatibles (que sempre estaran desactulitzats) ja no serien necessaris.
OpenStreetMap és aquest mapa. Les dades del mapa es poden utilitzar de franc (amb atribució i publicació de canvis en aquestes dades).A més a més, tothom pot agregar lliurement noves dades i corregir errors. De fet, aquest lloc web també fa servir OpenStreetMap. Totes les dades provenen d'allà i les teves respostes i correccions també s'afegiran allà.
Moltes persones i aplicacions ja utilitzen OpenStreetMap: Maps.me, OsmAnd, però també els mapes de Facebook, Instagram, Apple i Bing són (en part) impulsats per OpenStreetMap.Si canvies alguna cosa aquí també es reflectirà en aquestes aplicacions en la seva propera actualització.
","nl":"
Een open kaart
Zou het niet fantastisch zijn als er een open kaart zou zijn die door iedereen aangepast én gebruikt kan worden? Een kaart waar iedereen zijn interesses aan zou kunnen toevoegen? Dan zouden er geen duizend-en-één verschillende kleine kaartjes, websites, ... meer nodig zijn
OpenStreetMap is deze open kaart. Je mag de kaartdata gratis gebruiken (mits bronvermelding en herpublicatie van aanpassingen). Daarenboven mag je de kaart ook gratis aanpassen als je een account maakt. Ook deze website is gebaseerd op OpenStreetMap. Als je hier een vraag beantwoord, gaat het antwoord daar ook naartoe
Tenslotte zijn er reeds vele gebruikers van OpenStreetMap. Denk maar Maps.me, OsmAnd, verschillende gespecialiseerde routeplanners, de achtergrondkaarten op Facebook, Instagram,... Zelfs Apple Maps en Bing-Maps gebruiken OpenStreetMap in hun kaarten!
Kortom, als je hier een punt toevoegd of een vraag beantwoord, zal dat na een tijdje ook in al dié applicaties te zien zijn.
","fr":"
Une carte ouverte
Ne serait-il pas génial d'avoir sur une carte que tout le monde pourrait éditer ouvertement? Une seule et unique plateforme regroupant toutes les informations geographiques? Ainsi nous n'aurons plus besoin de toutes ces cartes petites et incompatibles cartes (souvent non mises à jour).
OpenStreetMap est la carte qu'il vous faut!. Toutes les données de cette carte peuvent être utilisé gratuitement (avec d'attribution et de publication des changements de données). De plus tout le monde est libre d'ajouter de nouvelles données et de corriger les erreurs. Ce site internet utilise également OpenStreetMap. Toutes les données en proviennent et tous les ajouts et modifications y seront également ajoutés.
De nombreux individus et d'applications utilisent déjà OpenStreetMap: Maps.me, OsmAnd, mais aussi les cartes de Facebook, Instagram, Apple-maps et Bing-maps sont (en partie) supporté par OpenStreetMap. Si vous modifié quelque chose ici, ces changements seront incorporer dans ces applications dès leurs mises à jour!
","gl":"
Un mapa aberto
Non sería xenial se houbera un só mapa, que todos puideran empregar e editar de xeito libre?Un só lugar para almacenar toda a información xeográfica? Entón, todos eses sitios web con mapas diferentes, pequenos e incompatíbeis (que sempre están desactualizados) xa non serían necesarios.
OpenStreetMap é ese mapa. Os datos do mapa pódense empregar de balde (con atribución e publicación de modificacións neses datos).Ademais diso, todos poden engadir de xeito ceibe novos datos e corrixir erros. Este sitio web tamén emprega o OpenStreetMap. Todos os datos proveñen de alí, e as túas respostas e correccións tamén serán engadidas alí.
Moitas persoas e aplicacións xa empregan o OpenStreetMap: Maps.me, OsmAnd, pero tamén os mapas do Facebook, Instagram, Apple e Bing son (en parte) impulsados polo OpenStreetMap.Se mudas algo aquí, tamén será reflexado nesas aplicacións, na súa seguinte actualización!
","de":"
Eine offene Karte
Wäre es nicht toll, wenn es eine offene Karte gäbe, die von jedem angepasst und benutzt werden könnte? Eine Karte, zu der jeder seine Interessen hinzufügen kann? Dann bräuchte man all diese Websites mit unterschiedlichen, kleinen und inkompatiblen Karten (die immer veraltet sind) nicht mehr.
OpenStreetMap ist diese offene Karte. Die Kartendaten können kostenlos verwendet werden (mit Attribution und Veröffentlichung von Änderungen an diesen Daten). Darüber hinaus können Sie die Karte kostenlos ändern und Fehler beheben, wenn Sie ein Konto erstellen. Diese Website basiert ebenfalls auf OpenStreetMap. Wenn Sie eine Frage hier beantworten, geht die Antwort auch dorthin.
Viele Menschen und Anwendungen nutzen OpenStreetMap bereits: Maps.me, OsmAnd, verschiedene spezialisierte Routenplaner, die Hintergrundkarten auf Facebook, Instagram,... Sogar Apple Maps und Bing Maps verwenden OpenStreetMap in ihren Karten!
Wenn Sie hier einen Punkt hinzufügen oder eine Frage beantworten, wird er nach einer Weile in all diesen Anwendungen sichtbar sein.
"} ),
+ attribution: { attributionTitle: new Translation( {"en":"Attribution notice","nl":"Met dank aan"} ),
+ attributionContent: new Translation( {"en":"All data is provided by OpenStreetMap, freely reusable under the Open DataBase License"} ),
+},
sharescreen: { intro: new Translation( {"en":"
Share this map
Share this map by copying the link below and sending it to friends and family:","ca":"
Comparteix aquest mapa
Comparteix aquest mapa copiant l'enllaç de sota i enviant-lo a amics i família:","es":"
Comparte este mapa
Comparte este mapa copiando el enlace de debajo y enviándolo a amigos y familia:","fr":"
Partager cette carte
Partagez cette carte en copiant le lien suivant et envoyez-le à vos amis:","nl":"
Deel deze kaart
Kopieer onderstaande link om deze kaart naar vrienden en familie door te sturen:","gl":"
Comparte este mapa
Comparte este mapa copiando a ligazón de embaixo e enviándoa ás amizades e familia:","de":"
Diese Karte teilen
Sie können diese Karte teilen, indem Sie den untenstehenden Link kopieren und an Freunde und Familie schick"} ),
addToHomeScreen: new Translation( {"en":"
Add to your home screen
You can easily add this website to your smartphone home screen for a native feel. Click the 'add to home screen button' in the URL bar to do this.","ca":"
Afegir-lo a la pantalla d'inici
Pots afegir aquesta web a la pantalla d'inici del teu smartphone per a que es vegi més nadiu. Apreta al botó 'afegir a l'inici' a la barra d'adreces URL per fer-ho.","es":"
Añadir a la pantalla de inicio
Puedes añadir esta web en la pantalla de inicio de tu smartphone para que se vea más nativo. Aprieta el botón 'añadir a inicio' en la barra de direcciones URL para hacerlo.","fr":"
Ajouter à votre page d'accueil
Vous pouvez facilement ajouter la carte à votre écran d'accueil de téléphone. Cliquer sur le boutton 'ajouter à l'ecran d'accueil' dans la barre d'adresse pour éffectuer cette tâche.","gl":"
Engadir á pantalla de inicio
Podes engadir esta web na pantalla de inicio do teu smartphone para que se vexa máis nativo. Preme o botón 'engadir ó inicio' na barra de enderezos URL para facelo.","nl":"
Voeg toe aan je thuis-scherm
Je kan deze website aan je thuisscherm van je smartphone toevoegen voor een native feel","de":"
Zum Startbildschirm hinzufügen
Sie können diese Website einfach zum Startbildschirm Ihres Smartphones hinzufügen, um ein natives Gefühl zu erhalten. Klicken Sie dazu in der URL-Leiste auf die Schaltfläche 'Zum Startbildschirm hinzufügen'."} ),
embedIntro: new Translation( {"en":"
Embed on your website
Please, embed this map into your website. We encourage you to do it - you don't even have to ask permission. It is free, and always will be. The more people using this, the more valuable it becomes.","ca":"
Inclou-ho a la teva pàgina web
Inclou aquest mapa dins de la teva pàgina web. T'animem a que ho facis, no cal que demanis permís. És de franc, i sempre ho serà. A més gent que ho faci servir més valuós serà.","es":"
Inclúyelo en tu página web
Incluye este mapa en tu página web. Te animamos a que lo hagas, no hace falta que pidas permiso. Es gratis, y siempre lo será. A más gente que lo use más valioso será.","fr":"
Incorporer à votre website
AJouter la carte à votre website. Nous vous y encourageons - pas besoin de permission. C'est gratuit et pour toujours. Au plus de personnes l'utilisent, au mieux.","gl":"
Inclúeo na túa páxina web
Inclúe este mapa na túa páxina web. Animámoche a que o fagas, non fai falla que pidas permiso. É de balde, e sempre será. Canta máis xente que o empregue máis valioso será.","nl":"
Plaats dit op je website
Voeg dit kaartje toe op je eigen website. We moedigen dit zelfs aan - je hoeft geen toestemming te vragen. Het is gratis en zal dat altijd blijven. Hoe meer het gebruikt wordt, hoe waardevoller","de":"
Auf Ihrer Website einbetten
Bitte, betten Sie diese Karte in Ihre Website ein. Wir ermutigen Sie, es zu tun - Sie müssen nicht einmal um Erlaubnis fragen. Es ist kostenlos und wird es immer sein. Je mehr Leute sie benutzen, desto wertvoller wird sie."} ),
diff --git a/InitUiElements.ts b/InitUiElements.ts
index 6ced925..4be6179 100644
--- a/InitUiElements.ts
+++ b/InitUiElements.ts
@@ -34,6 +34,9 @@ import FeaturePipeline from "./Logic/FeatureSource/FeaturePipeline";
import SelectedFeatureHandler from "./Logic/Actors/SelectedFeatureHandler";
import ScrollableFullScreen from "./UI/Base/ScrollableFullScreen";
import Translations from "./UI/i18n/Translations";
+import MapControlButton from "./UI/MapControlButton";
+import {Map} from "leaflet";
+import Combine from "./UI/Base/Combine";
export class InitUiElements {
@@ -122,8 +125,11 @@ export class InitUiElements {
if ((window != window.top && !State.state.featureSwitchWelcomeMessage.data) || State.state.featureSwitchIframe.data) {
const currentLocation = State.state.locationControl;
- const url = `${window.location.origin}${window.location.pathname}?z=${currentLocation.data.zoom}&lat=${currentLocation.data.lat}&lon=${currentLocation.data.lon}`;
- new Link(Svg.pop_out_ui().SetClass("iframe-escape"), url, true)
+ const url = `${window.location.origin}${window.location.pathname}?z=${currentLocation.data.zoom ?? 0}&lat=${currentLocation.data.lat ?? 0}&lon=${currentLocation.data.lon ?? 0}`;
+ new MapControlButton(
+ new Link(Svg.pop_out_img, url, true)
+ .SetClass("block w-full h-full p-1.5")
+ )
.AttachTo("messagesbox");
}
@@ -142,27 +148,44 @@ export class InitUiElements {
marker.addTo(State.state.leafletMap.data)
});
- new FeatureSwitched(
- new GeoLocationHandler(
- State.state.currentGPSLocation,
- State.state.leafletMap
- )
- .SetStyle(`position:relative;display:block;border: solid 2px #0005;cursor: pointer; z-index: 999; /*Just below leaflets zoom*/background-color: white;border-radius: 5px;width: 43px;height: 43px;`)
- , State.state.featureSwitchGeolocation)
- .AttachTo("geolocate-button");
+ const geolocationButton = new FeatureSwitched(
+ new MapControlButton(
+ new GeoLocationHandler(
+ State.state.currentGPSLocation,
+ State.state.leafletMap
+ )),
+ State.state.featureSwitchGeolocation);
+
+ const plus = new MapControlButton(
+ Svg.plus_ui()
+ ).onClick(() => {
+ State.state.locationControl.data.zoom++;
+ State.state.locationControl.ping();
+ })
+
+ const min = new MapControlButton(
+ Svg.min_ui()
+ ).onClick(() => {
+ State.state.locationControl.data.zoom--;
+ State.state.locationControl.ping();
+ })
+
+ new Combine([plus, min, geolocationButton].map(el => el.SetClass("m-1")))
+ .SetClass("flex flex-col")
+ .AttachTo("bottom-right");
if (layoutToUse.id === personal.id) {
updateFavs();
}
InitUiElements.setupAllLayerElements();
-
+
if (layoutToUse.id === personal.id) {
State.state.favouriteLayers.addCallback(updateFavs);
State.state.installedThemes.addCallback(updateFavs);
- }else{
+ } else {
State.state.locationControl.ping();
}
-
+
// Reset the loading message once things are loaded
new CenterMessageBox().AttachTo("centermessage");
@@ -247,15 +270,39 @@ export class InitUiElements {
.SetClass("block p-1 rounded-full");
const checkbox = new CheckBox(
layerControlPanel,
- Svg.layers_svg().SetClass("layer-selection-toggle"),
+ new MapControlButton(Svg.layers_svg()),
State.state.layerControlIsOpened
- ).AttachTo("layer-selection");
+ )
+ const copyrightState = new UIEventSource(false);
+ const copyrightNotice =
+ new ScrollableFullScreen(
+ Translations.t.general.attribution.attributionTitle,
+ new Combine([
+ Translations.t.general.attribution.attributionContent,
+ " ",
+ new Attribution(undefined, undefined, State.state.layoutToUse, undefined)
+ ]),
+ () => {
+ copyrightState.setData(false)
+ }
+ )
+
+ ;
+ const copyrightButton = new CheckBox(
+ copyrightNotice,
+ new MapControlButton(Svg.osm_copyright_svg()),
+ copyrightState
+ ).SetClass("p-0.5 md:hidden")
+
+ new Combine([copyrightButton, checkbox])
+ .AttachTo("layer-selection");
State.state.locationControl
.addCallback(() => {
// Close the layer selection when the map is moved
checkbox.isEnabled.setData(false);
+ copyrightButton.isEnabled.setData(false);
});
State.state.selectedElement.addCallbackAndRun(feature => {
@@ -304,7 +351,7 @@ export class InitUiElements {
const state = State.state;
- state.filteredLayers =
+ state.filteredLayers =
state.layoutToUse.map(layoutToUse => {
const flayers = [];
diff --git a/Logic/Actors/GeoLocationHandler.ts b/Logic/Actors/GeoLocationHandler.ts
index 688c14a..37de1c0 100644
--- a/Logic/Actors/GeoLocationHandler.ts
+++ b/Logic/Actors/GeoLocationHandler.ts
@@ -20,6 +20,7 @@ export default class GeoLocationHandler extends UIElement {
this._currentGPSLocation = currentGPSLocation;
this._leafletMap = leafletMap;
this._hasLocation = currentGPSLocation.map((location) => location !== undefined);
+ this.dumbMode = false;
const self = this;
import("../../vendor/Leaflet.AccuratePosition.js").then(() => {
self.init();
@@ -117,6 +118,7 @@ export default class GeoLocationHandler extends UIElement {
private StartGeolocating(zoomlevel = 19) {
const self = this;
+ console.log("Starting geolocation")
const map: any = this._leafletMap.data;
if (self._permission.data === "denied") {
return "";
diff --git a/Logic/Actors/SelectedFeatureHandler.ts b/Logic/Actors/SelectedFeatureHandler.ts
index ce36242..f0de42f 100644
--- a/Logic/Actors/SelectedFeatureHandler.ts
+++ b/Logic/Actors/SelectedFeatureHandler.ts
@@ -18,7 +18,9 @@ export default class SelectedFeatureHandler {
this._featureSource = featureSource;
const self = this;
hash.addCallback(h => {
+ console.log("Hash is now ", h)
if (h === undefined || h === "") {
+ console.log("Deselecting feature...")
selectedFeature.setData(undefined);
}else{
self.selectFeature();
diff --git a/Models/Constants.ts b/Models/Constants.ts
index 4930283..d2808bf 100644
--- a/Models/Constants.ts
+++ b/Models/Constants.ts
@@ -2,7 +2,7 @@ import { Utils } from "../Utils";
export default class Constants {
- public static vNumber = "0.5.0b";
+ public static vNumber = "0.5.1";
// The user journey states thresholds when a new feature gets unlocked
public static userJourney = {
diff --git a/Svg.ts b/Svg.ts
index 8207e7e..306a7cd 100644
--- a/Svg.ts
+++ b/Svg.ts
@@ -204,6 +204,11 @@ export default class Svg {
public static mapillary_svg() { return new FixedUiElement(Svg.mapillary);}
public static mapillary_ui() { return new FixedUiElement(Svg.mapillary_img);}
+ public static min = " "
+ public static min_img = Img.AsImageElement(Svg.min)
+ public static min_svg() { return new FixedUiElement(Svg.min);}
+ public static min_ui() { return new FixedUiElement(Svg.min_img);}
+
public static no_checkmark = ""
public static no_checkmark_img = Img.AsImageElement(Svg.no_checkmark)
public static no_checkmark_svg() { return new FixedUiElement(Svg.no_checkmark);}
@@ -214,6 +219,11 @@ export default class Svg {
public static or_svg() { return new FixedUiElement(Svg.or);}
public static or_ui() { return new FixedUiElement(Svg.or_img);}
+ public static osm_copyright = " "
+ public static osm_copyright_img = Img.AsImageElement(Svg.osm_copyright)
+ public static osm_copyright_svg() { return new FixedUiElement(Svg.osm_copyright);}
+ public static osm_copyright_ui() { return new FixedUiElement(Svg.osm_copyright_img);}
+
public static osm_logo_us = ""
public static osm_logo_us_img = Img.AsImageElement(Svg.osm_logo_us)
public static osm_logo_us_svg() { return new FixedUiElement(Svg.osm_logo_us);}
@@ -239,6 +249,11 @@ export default class Svg {
public static pin_svg() { return new FixedUiElement(Svg.pin);}
public static pin_ui() { return new FixedUiElement(Svg.pin_img);}
+ public static plus = " "
+ public static plus_img = Img.AsImageElement(Svg.plus)
+ public static plus_svg() { return new FixedUiElement(Svg.plus);}
+ public static plus_ui() { return new FixedUiElement(Svg.plus_img);}
+
public static pop_out = " "
public static pop_out_img = Img.AsImageElement(Svg.pop_out)
public static pop_out_svg() { return new FixedUiElement(Svg.pop_out);}
@@ -324,4 +339,4 @@ export default class Svg {
public static wikipedia_svg() { return new FixedUiElement(Svg.wikipedia);}
public static wikipedia_ui() { return new FixedUiElement(Svg.wikipedia_img);}
-public static All = {"Ornament-Horiz-0.svg": Svg.Ornament_Horiz_0,"Ornament-Horiz-1.svg": Svg.Ornament_Horiz_1,"Ornament-Horiz-2.svg": Svg.Ornament_Horiz_2,"Ornament-Horiz-3.svg": Svg.Ornament_Horiz_3,"Ornament-Horiz-4.svg": Svg.Ornament_Horiz_4,"Ornament-Horiz-5.svg": Svg.Ornament_Horiz_5,"Ornament-Horiz-6.svg": Svg.Ornament_Horiz_6,"add.svg": Svg.add,"addSmall.svg": Svg.addSmall,"ampersand.svg": Svg.ampersand,"arrow-left-smooth.svg": Svg.arrow_left_smooth,"arrow-right-smooth.svg": Svg.arrow_right_smooth,"back.svg": Svg.back,"bug.svg": Svg.bug,"camera-plus.svg": Svg.camera_plus,"checkmark.svg": Svg.checkmark,"circle.svg": Svg.circle,"clock.svg": Svg.clock,"close.svg": Svg.close,"compass.svg": Svg.compass,"cross_bottom_right.svg": Svg.cross_bottom_right,"crosshair-blue-center.svg": Svg.crosshair_blue_center,"crosshair-blue.svg": Svg.crosshair_blue,"crosshair.svg": Svg.crosshair,"delete_icon.svg": Svg.delete_icon,"direction.svg": Svg.direction,"direction_gradient.svg": Svg.direction_gradient,"down.svg": Svg.down,"envelope.svg": Svg.envelope,"floppy.svg": Svg.floppy,"gear.svg": Svg.gear,"help.svg": Svg.help,"home.svg": Svg.home,"home_white_bg.svg": Svg.home_white_bg,"josm_logo.svg": Svg.josm_logo,"layers.svg": Svg.layers,"layersAdd.svg": Svg.layersAdd,"logo.svg": Svg.logo,"logout.svg": Svg.logout,"mapillary.svg": Svg.mapillary,"no_checkmark.svg": Svg.no_checkmark,"or.svg": Svg.or,"osm-logo-us.svg": Svg.osm_logo_us,"osm-logo.svg": Svg.osm_logo,"pencil.svg": Svg.pencil,"phone.svg": Svg.phone,"pin.svg": Svg.pin,"pop-out.svg": Svg.pop_out,"reload.svg": Svg.reload,"ring.svg": Svg.ring,"search.svg": Svg.search,"send_email.svg": Svg.send_email,"share.svg": Svg.share,"square.svg": Svg.square,"star.svg": Svg.star,"star_half.svg": Svg.star_half,"star_outline.svg": Svg.star_outline,"star_outline_half.svg": Svg.star_outline_half,"statistics.svg": Svg.statistics,"translate.svg": Svg.translate,"up.svg": Svg.up,"wikidata.svg": Svg.wikidata,"wikimedia-commons-white.svg": Svg.wikimedia_commons_white,"wikipedia.svg": Svg.wikipedia};}
+public static All = {"Ornament-Horiz-0.svg": Svg.Ornament_Horiz_0,"Ornament-Horiz-1.svg": Svg.Ornament_Horiz_1,"Ornament-Horiz-2.svg": Svg.Ornament_Horiz_2,"Ornament-Horiz-3.svg": Svg.Ornament_Horiz_3,"Ornament-Horiz-4.svg": Svg.Ornament_Horiz_4,"Ornament-Horiz-5.svg": Svg.Ornament_Horiz_5,"Ornament-Horiz-6.svg": Svg.Ornament_Horiz_6,"add.svg": Svg.add,"addSmall.svg": Svg.addSmall,"ampersand.svg": Svg.ampersand,"arrow-left-smooth.svg": Svg.arrow_left_smooth,"arrow-right-smooth.svg": Svg.arrow_right_smooth,"back.svg": Svg.back,"bug.svg": Svg.bug,"camera-plus.svg": Svg.camera_plus,"checkmark.svg": Svg.checkmark,"circle.svg": Svg.circle,"clock.svg": Svg.clock,"close.svg": Svg.close,"compass.svg": Svg.compass,"cross_bottom_right.svg": Svg.cross_bottom_right,"crosshair-blue-center.svg": Svg.crosshair_blue_center,"crosshair-blue.svg": Svg.crosshair_blue,"crosshair.svg": Svg.crosshair,"delete_icon.svg": Svg.delete_icon,"direction.svg": Svg.direction,"direction_gradient.svg": Svg.direction_gradient,"down.svg": Svg.down,"envelope.svg": Svg.envelope,"floppy.svg": Svg.floppy,"gear.svg": Svg.gear,"help.svg": Svg.help,"home.svg": Svg.home,"home_white_bg.svg": Svg.home_white_bg,"josm_logo.svg": Svg.josm_logo,"layers.svg": Svg.layers,"layersAdd.svg": Svg.layersAdd,"logo.svg": Svg.logo,"logout.svg": Svg.logout,"mapillary.svg": Svg.mapillary,"min.svg": Svg.min,"no_checkmark.svg": Svg.no_checkmark,"or.svg": Svg.or,"osm-copyright.svg": Svg.osm_copyright,"osm-logo-us.svg": Svg.osm_logo_us,"osm-logo.svg": Svg.osm_logo,"pencil.svg": Svg.pencil,"phone.svg": Svg.phone,"pin.svg": Svg.pin,"plus.svg": Svg.plus,"pop-out.svg": Svg.pop_out,"reload.svg": Svg.reload,"ring.svg": Svg.ring,"search.svg": Svg.search,"send_email.svg": Svg.send_email,"share.svg": Svg.share,"square.svg": Svg.square,"star.svg": Svg.star,"star_half.svg": Svg.star_half,"star_outline.svg": Svg.star_outline,"star_outline_half.svg": Svg.star_outline_half,"statistics.svg": Svg.statistics,"translate.svg": Svg.translate,"up.svg": Svg.up,"wikidata.svg": Svg.wikidata,"wikimedia-commons-white.svg": Svg.wikimedia_commons_white,"wikipedia.svg": Svg.wikipedia};}
diff --git a/UI/BigComponents/Attribution.ts b/UI/BigComponents/Attribution.ts
index 6c98d17..46934b4 100644
--- a/UI/BigComponents/Attribution.ts
+++ b/UI/BigComponents/Attribution.ts
@@ -32,13 +32,13 @@ export default class Attribution extends UIElement {
}
InnerRender(): string {
- const location : Loc = this._location.data;
- const userDetails = this._userDetails.data;
+ const location : Loc = this._location?.data;
+ const userDetails = this._userDetails?.data;
const mapComplete = new Link(`Mapcomplete ${Constants.vNumber}`, 'https://github.com/pietervdvn/MapComplete', true);
const reportBug = new Link(Svg.bug_img, "https://github.com/pietervdvn/MapComplete/issues", true);
- const layoutId = this._layoutToUse.data.id;
+ const layoutId = this._layoutToUse?.data?.id;
const osmChaLink = `https://osmcha.org/?filters=%7B%22comment%22%3A%5B%7B%22label%22%3A%22%23${layoutId}%22%2C%22value%22%3A%22%23${layoutId}%22%7D%5D%2C%22date__gte%22%3A%5B%7B%22label%22%3A%222020-07-05%22%2C%22value%22%3A%222020-07-05%22%7D%5D%2C%22editor%22%3A%5B%7B%22label%22%3A%22MapComplete%22%2C%22value%22%3A%22MapComplete%22%7D%5D%7D`
const stats = new Link(Svg.statistics_img, osmChaLink, true)
let editHere: (UIElement | string) = "";
@@ -48,7 +48,7 @@ export default class Attribution extends UIElement {
}
let editWithJosm: (UIElement | string) = ""
if (location !== undefined &&
- this._leafletMap.data !== undefined &&
+ this._leafletMap?.data !== undefined &&
userDetails.csCount >= Constants.userJourney.tagsVisibleAndWikiLinked) {
const bounds : any= this._leafletMap.data.getBounds();
const top = bounds.getNorth();
@@ -59,7 +59,7 @@ export default class Attribution extends UIElement {
const josmLink = `http://127.0.0.1:8111/load_and_zoom?left=${left}&right=${right}&top=${top}&bottom=${bottom}`
editWithJosm = new Link(Svg.josm_logo_img, josmLink, true);
}
- return new Combine([mapComplete, reportBug, " | ", stats, " | ", editHere, editWithJosm]).Render();
+ return new Combine([mapComplete, reportBug, stats, editHere, editWithJosm]).Render();
}
diff --git a/UI/BigComponents/Basemap.ts b/UI/BigComponents/Basemap.ts
index 73047a5..38e2f32 100644
--- a/UI/BigComponents/Basemap.ts
+++ b/UI/BigComponents/Basemap.ts
@@ -36,7 +36,6 @@ export class Basemap {
this.map.attributionControl.setPrefix(
extraAttribution.Render() + " | OpenStreetMap");
- this.map.zoomControl.setPosition("bottomright");
const self = this;
let previousLayer = currentLayer.data;
@@ -59,6 +58,13 @@ export class Basemap {
location.ping();
});
+ location.map(loc => loc.zoom)
+ .addCallback(zoom => {
+ if (Math.abs(self.map.getZoom() - zoom) > 0.1) {
+ self.map.setZoom(zoom, {});
+ }
+ })
+
this.map.on("click", function (e) {
// @ts-ignore
lastClickLocation.setData({lat: e.latlng.lat, lon: e.latlng.lng})
diff --git a/UI/MapControlButton.ts b/UI/MapControlButton.ts
new file mode 100644
index 0000000..b5e4b2a
--- /dev/null
+++ b/UI/MapControlButton.ts
@@ -0,0 +1,20 @@
+import {UIElement} from "./UIElement";
+
+/**
+ * A button floating above the map, in a uniform style
+ */
+export default class MapControlButton extends UIElement {
+ private _contents: UIElement;
+
+ constructor(contents: UIElement) {
+ super();
+ this._contents = contents;
+ this.SetClass("relative block rounded-full w-10 h-10 p-1 pointer-events-auto z-above-map subtle-background")
+ this.SetStyle("box-shadow: 0 0 10px var(--shadow-color);");
+ }
+
+ InnerRender(): string {
+ return this._contents.Render();
+ }
+
+}
\ No newline at end of file
diff --git a/assets/translations.json b/assets/translations.json
index fe07e1b..d04a081 100644
--- a/assets/translations.json
+++ b/assets/translations.json
@@ -513,6 +513,16 @@
"gl": "
Un mapa aberto
Non sería xenial se houbera un só mapa, que todos puideran empregar e editar de xeito libre?Un só lugar para almacenar toda a información xeográfica? Entón, todos eses sitios web con mapas diferentes, pequenos e incompatíbeis (que sempre están desactualizados) xa non serían necesarios.
OpenStreetMap é ese mapa. Os datos do mapa pódense empregar de balde (con atribución e publicación de modificacións neses datos).Ademais diso, todos poden engadir de xeito ceibe novos datos e corrixir erros. Este sitio web tamén emprega o OpenStreetMap. Todos os datos proveñen de alí, e as túas respostas e correccións tamén serán engadidas alí.
Moitas persoas e aplicacións xa empregan o OpenStreetMap: Maps.me, OsmAnd, pero tamén os mapas do Facebook, Instagram, Apple e Bing son (en parte) impulsados polo OpenStreetMap.Se mudas algo aquí, tamén será reflexado nesas aplicacións, na súa seguinte actualización!
",
"de": "
Eine offene Karte
Wäre es nicht toll, wenn es eine offene Karte gäbe, die von jedem angepasst und benutzt werden könnte? Eine Karte, zu der jeder seine Interessen hinzufügen kann? Dann bräuchte man all diese Websites mit unterschiedlichen, kleinen und inkompatiblen Karten (die immer veraltet sind) nicht mehr.
OpenStreetMap ist diese offene Karte. Die Kartendaten können kostenlos verwendet werden (mit Attribution und Veröffentlichung von Änderungen an diesen Daten). Darüber hinaus können Sie die Karte kostenlos ändern und Fehler beheben, wenn Sie ein Konto erstellen. Diese Website basiert ebenfalls auf OpenStreetMap. Wenn Sie eine Frage hier beantworten, geht die Antwort auch dorthin.
Viele Menschen und Anwendungen nutzen OpenStreetMap bereits: Maps.me, OsmAnd, verschiedene spezialisierte Routenplaner, die Hintergrundkarten auf Facebook, Instagram,... Sogar Apple Maps und Bing Maps verwenden OpenStreetMap in ihren Karten!
Wenn Sie hier einen Punkt hinzufügen oder eine Frage beantworten, wird er nach einer Weile in all diesen Anwendungen sichtbar sein.