Fix #691

UI/BigComponents/ExtraLinkButton.ts

@@ -2,46 +2,48 @@ import {UIElement} from "../UIElement";
 import BaseUIElement from "../BaseUIElement";
 import {UIEventSource} from "../../Logic/UIEventSource";
 import ExtraLinkConfig from "../../Models/ThemeConfig/ExtraLinkConfig";
-import MapControlButton from "../MapControlButton";
-import Link from "../Base/Link";
 import Img from "../Base/Img";
 import {SubtleButton} from "../Base/SubtleButton";
 import Toggle from "../Input/Toggle";
 import Loc from "../../Models/Loc";
 import Locale from "../i18n/Locale";
 import {Utils} from "../../Utils";
+import Svg from "../../Svg";
+import Translations from "../i18n/Translations";
+import {Translation} from "../i18n/Translation";
 
-export default class ExtraLinkButton extends UIElement{
+export default class ExtraLinkButton extends UIElement {
     private readonly _config: ExtraLinkConfig;
     private readonly state: {
-        layoutToUse: {id: string};
+        layoutToUse: { id: string, title: Translation };
-        featureSwitchWelcomeMessage: UIEventSource<boolean>, locationControl: UIEventSource<Loc>};
+        featureSwitchWelcomeMessage: UIEventSource<boolean>, locationControl: UIEventSource<Loc>
+    };
 
-    constructor(state:  {featureSwitchWelcomeMessage: UIEventSource<boolean>, locationControl: UIEventSource<Loc>, layoutToUse: {id: string}}, 
+    constructor(state: { featureSwitchWelcomeMessage: UIEventSource<boolean>, locationControl: UIEventSource<Loc>, layoutToUse: { id: string, title: Translations } },
                 config: ExtraLinkConfig) {
         super();
         this.state = state;
         this._config = config;
     }
 
-    protected InnerRender():  BaseUIElement {
+    protected InnerRender(): BaseUIElement {
-        if(this._config === undefined){
+        if (this._config === undefined) {
             return undefined;
         }
-        
+
         const c = this._config;
 
         const isIframe = window !== window.top
 
-        if(c.requirements.has("iframe") && !isIframe){
+        if (c.requirements.has("iframe") && !isIframe) {
             return undefined
         }
 
-        if(c.requirements.has("no-iframe") && isIframe){
+        if (c.requirements.has("no-iframe") && isIframe) {
             return undefined
         }
 
-        let link : BaseUIElement
+        let link: BaseUIElement
         const theme = this.state.layoutToUse?.id ?? ""
         const href = this.state.locationControl.map(loc => {
             const subs = {
@@ -51,31 +53,35 @@ export default class ExtraLinkButton extends UIElement{
             }
             return Utils.SubstituteKeys(c.href, subs)
         })
-        
+
-        if(c.text === undefined){
+
-            link = new MapControlButton(
+        let img: BaseUIElement = Svg.pop_out_ui()
-                new Link(new Img(c.icon), href, c.newTab).SetClass("block w-full h-full p-1.5")
+        if (c.icon !== undefined) {
-            )
+            img = new Img(c.icon).SetClass("h-6")
-        }else {
-            let img : BaseUIElement = undefined
-            if(c.icon !== undefined){
-                img = new Img(c.icon).SetClass("h-6")
-            }
-            
-            link = new SubtleButton(img,c.text, {url:
-                href,
-                newTab: c.newTab})
         }
-        
+
-        if(c.requirements.has("no-welcome-message")){
+        let text: Translation
+        if (c.text === undefined) {
+            text = Translations.t.general.screenToSmall.Fuse(this.state.layoutToUse.title, "{theme}")
+        } else {
+            text = c.text.Clone()
+        }
+
+        link = new SubtleButton(img, text, {
+            url:
+            href,
+            newTab: c.newTab
+        })
+
+        if (c.requirements.has("no-welcome-message")) {
             link = new Toggle(undefined, link, this.state.featureSwitchWelcomeMessage)
         }
 
-        if(c.requirements.has("welcome-message")){
+        if (c.requirements.has("welcome-message")) {
-            link = new Toggle(link, undefined,  this.state.featureSwitchWelcomeMessage)
+            link = new Toggle(link, undefined, this.state.featureSwitchWelcomeMessage)
         }
-        
+
         return link;
     }
-    
+
 }

UI/DefaultGUI.ts

@@ -25,6 +25,7 @@ import Combine from "./Base/Combine";
 import AddNewMarker from "./BigComponents/AddNewMarker";
 import FilteredLayer from "../Models/FilteredLayer";
 import ExtraLinkButton from "./BigComponents/ExtraLinkButton";
+import {SubtleButton} from "./Base/SubtleButton";
 
 
 /**
@@ -163,11 +164,22 @@ export default class DefaultGUI {
                 () => new UserBadge(state)
             ),
             Toggle.If(state.featureSwitchExtraLinkEnabled,
-                () => new ExtraLinkButton(state, state.layoutToUse.extraLink)
+                () => {
+                    if (state.layoutToUse.extraLink.text === undefined) {
+                        return Translations.t.general.screenToSmall
+                    }
+                    return new ExtraLinkButton(state, state.layoutToUse.extraLink);
+                }
             )
         ]).SetClass("flex flex-col")
             .AttachTo("userbadge")
 
+        const el = state.layoutToUse.extraLink
+        new Combine([
+            new ExtraLinkButton(state, {...state.layoutToUse.extraLink, newTab: true})
+        ]).SetClass("flex items-center justify-center normal-background h-full")
+            .AttachTo("on-small-screen")
+
         Toggle.If(state.featureSwitchSearch,
             () => new SearchAndGo(state))
             .AttachTo("searchbox");

css/index-tailwind-output.css

@@ -1103,10 +1103,6 @@ video {
   max-height: 2rem;
 }
 
-.max-h-6 {
-  max-height: 1.5rem;
-}
-
 .w-full {
   width: 100%;
 }
@@ -1504,10 +1500,6 @@ video {
   padding: 0px;
 }
 
-.p-1\.5 {
-  padding: 0.375rem;
-}
-
 .p-0\.5 {
   padding: 0.125rem;
 }

css/mobile.css

@@ -9,6 +9,29 @@ Contains tweaks for small screens
     }
 }
 
+
+@media only screen and (min-height: 300px) and (min-width: 225px) {
+    .very-small-screen {
+        display: none !important;
+    }
+
+
+    .hidden-on-very-small-screen {
+    }
+
+}
+
+
+@media not screen and (min-height: 300px) and (min-width: 225px) {
+    .very-small-screen {
+    }
+
+    .hidden-on-very-small-screen {
+        display: none !important;
+    }
+
+}
+
 @media only screen and (max-width: 768px), only screen and (max-height: 768px) {
 
 

langs/en.json

@@ -189,6 +189,7 @@
         "removeLocationHistory": "Delete the location history",
         "returnToTheMap": "Return to the map",
         "save": "Save",
+        "screenToSmall": "Open {theme} in a new window",
         "search": {
             "error": "Something went wrong…",
             "nothing": "Nothing found…",

langs/id.json

@@ -8,12 +8,12 @@
     "delete": {
         "cancel": "Batal",
         "cannotBeDeleted": "Fitur ini tidak dapat dihapus",
+        "delete": "Hapus",
         "explanations": {
             "selectReason": "Silahkan pilih mengapa fitur ini harus dihapus"
         },
-        "isntAPoint": "Hanya titik yang dapat dihapus, fitur yang dipilih adalah jalan, area, atau relasi.",
+        "isDeleted": "Fitur ini telah dihapus",
-        "delete": "Hapus",
+        "isntAPoint": "Hanya titik yang dapat dihapus, fitur yang dipilih adalah jalan, area, atau relasi."
-        "isDeleted": "Fitur ini telah dihapus"
     },
     "favourite": {
         "reload": "Muat ulang data"
@@ -115,4 +115,4 @@
     "split": {
         "cancel": "Batal"
     }
-}
+}

langs/layers/id.json

@@ -11,17 +11,8 @@
                     "0": {
                         "then": "Bangunan ini tidak memiliki nomor rumah"
                     }
-                },
+                }
-                "question": "Berapa nomor rumah ini?",
-                "render": "Nomor rumah ini <b>{addr:housenumber}</b>"
-            },
-            "street": {
-                "question": "Alamat ini di jalan apa?",
-                "render": "Alamat ini ada di jalan <b>{addr:street}</b>"
             }
-        },
-        "title": {
-            "render": "Alamat yang diketahui"
         }
     },
     "artwork": {
@@ -386,14 +377,5 @@
     },
     "watermill": {
         "name": "Kincir Air"
-    },
-    "ambulancestation": {
-        "name": "Peta stasiun ambulans",
-        "presets": {
-            "0": {
-                "description": "Tambahkan stasiun ambulans ke peta",
-                "title": "Stasiun ambulans"
-            }
-        }
     }
-}
+}

langs/nl.json

@@ -54,7 +54,7 @@
                 "importTags": "Het element zal deze tags krijgen: {tags}",
                 "officialThemesOnly": "In onofficiële thema's is de importeerknop uitgeschakeld om ongelukjes te vermijden",
                 "wrongType": "Dit object is geen punt of lijn, en kan daarom niet geïmporteerd worden",
-                "zoomInMore": "Zoom verder in om dit kaart-object te kunnen importeren"
+                "zoomInMore": "Zoom verder in om dit object af te handelen"
             },
             "importTags": "Het object zal deze tags krijgen: {tags}",
             "intro": "Kies hieronder welk punt je wilt toevoegen<br/>",

langs/shared-questions/id.json

@@ -13,12 +13,8 @@
                 },
                 "2": {
                     "then": "Anjing diperbolehkan, tetapi mereka harus diikat"
-                },
-                "3": {
-                    "then": "Anjing diperbolehkan dan dapat berkeliaran dengan bebas"
                 }
-            },
+            }
-            "question": "Apakah anjing diperbolehkan dalam bisnis ini?"
         },
         "email": {
             "question": "Apa alamat surel dari {title()}?"
@@ -27,18 +23,6 @@
             "mappings": {
                 "3": {
                     "then": "Berlokasi di lantai pertama"
-                },
-                "1": {
-                    "then": "Terletak di lantai dasar"
-                },
-                "0": {
-                    "then": "Terletak di bawah tanah"
-                },
-                "2": {
-                    "then": "Terletak di lantai dasar"
-                },
-                "4": {
-                    "then": "Terletak di lantai basement pertama"
                 }
             },
             "question": "Pada tingkat apa fitur ini diletakkan?"
@@ -61,4 +45,4 @@
             "question": "Apa situs web dari {title()}?"
         }
     }
-}
+}

langs/themes/en.json

@@ -879,6 +879,17 @@
                         "question": "What kind of building is this?"
                     }
                 }
+            },
+            "6": {
+                "tagRenderings": {
+                    "Import-button": {
+                        "mappings": {
+                            "0": {
+                                "then": "Did not yet calculate the metatags... Reopen this popup"
+                            }
+                        }
+                    }
+                }
             }
         }
     },

langs/themes/id.json

@@ -8,8 +8,7 @@
         "title": "Buka Peta Karya Seni"
     },
     "benches": {
-        "title": "Bangku",
+        "title": "Bangku"
-        "shortDescription": "Peta bangku"
     },
     "cafes_and_pubs": {
         "title": "Kafe dan pub"
@@ -283,12 +282,5 @@
     },
     "waste_basket": {
         "title": "Keranjang Sampah"
-    },
-    "bicyclelib": {
-        "title": "Perpustakaan sepeda"
-    },
-    "bicycle_rental": {
-        "title": "Sewa sepeda",
-        "shortDescription": "Peta dengan stasiun persewaan sepeda dan toko penyewaan sepeda"
     }
-}
+}

theme.html

@@ -47,8 +47,9 @@
     <!-- DECORATION 0 END -->
 </div>
 
-<div class="hidden md:hidden fixed inset-0 block z-above-controls" id="fullscreen"></div>
+<div class="very-small-screen fixed inset-0 block z-above-controls" id="on-small-screen"></div>
-<div class="z-index-above-map pointer-events-none" id="topleft-tools">
+<div class="hidden md:hidden fixed inset-0 block z-above-controls hidden-on-very-small-screen" id="fullscreen"></div>
+<div class="z-index-above-map pointer-events-none" id="topleft-tools">'
     <div class="p-3 flex flex-col items-end sm:items-start sm:flex-row sm:flex-wrap w-full sm:justify-between">
         <div class="shadow rounded-full h-min w-full overflow-hidden sm:max-w-sm pointer-events-auto"
              id="searchbox"></div>
@@ -83,7 +84,6 @@
 <div id="leafletDiv"></div>
 
 
-
 <script src="./index.ts"></script>
 <script async data-goatcounter="https://pietervdvn.goatcounter.com/count" src="//gc.zgo.at/count.js"></script>