First steps for import helper

osmfj · Jan 18, 2022 · 8cb41d1 · 8cb41d1
1 parent 5c71bfa
commit 8cb41d1
Show file tree

Hide file tree

Showing 12 changed files with 210 additions and 139 deletions.
diff --git a/Models/Constants.ts b/Models/Constants.ts
@@ -40,6 +40,7 @@ export default class Constants {
         addNewPointWithUnreadMessagesUnlock: 500,
         minZoomLevelToAddNewPoints: (Constants.isRetina() ? 18 : 19),
 
+        importHelperUnlock: 5000
     };
     /**
      * Used by 'PendingChangesUploader', which waits this amount of seconds to upload changes.

diff --git a/UI/BigComponents/BackToIndex.ts b/UI/BigComponents/BackToIndex.ts
@@ -0,0 +1,20 @@
+import {SubtleButton} from "../Base/SubtleButton";
+import Combine from "../Base/Combine";
+import Svg from "../../Svg";
+import Translations from "../i18n/Translations";
+import BaseUIElement from "../BaseUIElement";
+
+export default class BackToIndex extends SubtleButton {
+
+    constructor(message? : string | BaseUIElement) {
+        super(
+            Svg.back_svg().SetStyle("height: 1.5rem;"),
+           message ?? Translations.t.general.backToMapcomplete,
+            {
+                url: "./index.html"
+            }
+        )
+    }
+
+
+}
diff --git a/UI/BigComponents/MoreScreen.ts b/UI/BigComponents/MoreScreen.ts
@@ -110,7 +110,7 @@ export default class MoreScreen extends Combine {
             ]), {url: linkText, newTab: false});
     }
 
-    private static CreateProffessionalSerivesButton() {
+    public static CreateProffessionalSerivesButton() {
         const t = Translations.t.professional.indexPage;
         return new Combine([
             new Title(t.hook, 4),

diff --git a/UI/ImportHelperGui.ts b/UI/ImportHelperGui.ts
@@ -0,0 +1,60 @@
+import {FixedUiElement} from "./Base/FixedUiElement";
+import {LoginToggle} from "./Popup/LoginButton";
+import {OsmConnection} from "../Logic/Osm/OsmConnection";
+import UserRelatedState from "../Logic/State/UserRelatedState";
+import Combine from "./Base/Combine";
+import BackToIndex from "./BigComponents/BackToIndex";
+import BaseUIElement from "./BaseUIElement";
+import TableOfContents from "./Base/TableOfContents";
+import LanguagePicker from "./LanguagePicker";
+import Translations from "./i18n/Translations";
+import Constants from "../Models/Constants";
+import Toggle from "./Input/Toggle";
+import MoreScreen from "./BigComponents/MoreScreen";
+import Title from "./Base/Title";
+
+export default class ImportHelperGui extends LoginToggle{
+
+    constructor() {
+        const t = Translations.t.importHelper;
+
+        const state = new UserRelatedState(undefined)
+
+        const leftContents: BaseUIElement[] = [
+            new BackToIndex().SetClass("block pl-4"),
+            LanguagePicker.CreateLanguagePicker(Translations.t.importHelper.title.SupportedLanguages())?.SetClass("mt-4 self-end flex-col"),
+        ].map(el => el?.SetClass("pl-4"))
+
+        const leftBar = new Combine([
+            new Combine(leftContents).SetClass("sticky top-4 m-4")
+        ]).SetClass("block w-full md:w-2/6 lg:w-1/6")
+
+
+        super(
+
+            new Toggle(
+            new Combine([
+                leftBar,
+                new Combine([
+                    new Title(t.title,1),
+                    t.description
+                ]).SetClass("flex flex-col m-8")
+            ]).SetClass("block md:flex")
+
+            ,
+                new Combine([
+                    t.lockNotice.Subs(Constants.userJourney),
+                    MoreScreen.CreateProffessionalSerivesButton()
+                ])
+
+                ,
+                state.osmConnection.userDetails.map(ud => ud.csCount >= Constants.userJourney.importHelperUnlock)),
+
+            "Login needed...",
+            state)
+    }
+
+}
+
+
+new ImportHelperGui().AttachTo("main")
diff --git a/UI/ProfessionalGui.ts b/UI/ProfessionalGui.ts
@@ -6,9 +6,8 @@ import Toggleable, {Accordeon} from "./Base/Toggleable";
 import List from "./Base/List";
 import BaseUIElement from "./BaseUIElement";
 import LanguagePicker from "./LanguagePicker";
-import {SubtleButton} from "./Base/SubtleButton";
-import Svg from "../Svg";
 import TableOfContents from "./Base/TableOfContents";
+import BackToIndex from "./BigComponents/BackToIndex";
 
 class Snippet extends Toggleable {
     constructor(translations, ...extraContent: BaseUIElement[]) {
@@ -40,7 +39,7 @@ class SnippetContent extends Combine {
     }
 }
 
-export default class ProfessionalGui {
+class ProfessionalGui {
 
 
     constructor() {
@@ -93,23 +92,16 @@ export default class ProfessionalGui {
         ]).SetClass("flex flex-col pb-12 m-3 lg:w-3/4 lg:ml-10 link-underline")
 
 
-        const backToIndex = new Combine([new SubtleButton(
-            Svg.back_svg().SetStyle("height: 1.5rem;"),
-            t.backToMapcomplete,
-            {
-                url: "./index.html"
-            }
-        )]).SetClass("block")
-
         const leftContents: BaseUIElement[] = [
-            backToIndex,
+            new BackToIndex().SetClass("block"),
             new TableOfContents(content, {
                 noTopLevel: true,
                 maxDepth: 2
             }).SetClass("subtle"),
 
             LanguagePicker.CreateLanguagePicker(Translations.t.professional.title.SupportedLanguages())?.SetClass("mt-4 self-end flex-col"),
         ].map(el => el?.SetClass("pl-4"))
+
         const leftBar = new Combine([
             new Combine(leftContents).SetClass("sticky top-4 m-4")
         ]).SetClass("block w-full md:w-2/6 lg:w-1/6")

diff --git a/automaton.html b/automaton.html
@@ -1,5 +1,4 @@
 <!DOCTYPE html>
-<!-- WARNING: index.html serves as a template. If you want to change something, change it there -->
 <html lang="en">
 <head>
     <meta charset="UTF-8">

diff --git a/index.html b/index.html
@@ -1,5 +1,4 @@
 <!DOCTYPE html>
-<!-- WARNING: index.html serves as a template. If you want to change something, change it there -->
 <html lang="en">
 <head>
     <meta charset="UTF-8">

diff --git a/langs/en.json b/langs/en.json
@@ -70,6 +70,7 @@
         "readMessages": "You have unread messages. Read these before deleting a point - someone might have feedback"
     },
     "general": {
+        "backToMapcomplete": "Back to the theme overview",
         "loading": "Loading...",
         "pdf": {
             "generatedWith": "Generated with MapComplete.osm.be",
@@ -332,8 +333,7 @@
         "surveillance": "As you are reading the privacy policy, you probably care about privacy - so do we! We even made <a href='https://mapcomplete.osm.be/surveillance'>a theme showing surveillance cameras.</a> Feel free to map them all!"
     },
     "professional": {
-        "backToMapcomplete": "Back to the theme overview",
-        "indexPage": {
+         "indexPage": {
             "hook": "Need professional support?",
             "hookMore": "We can help with setting up surveys, data imports and OpenStreetMap-consultancy",
             "button": "Discover our services"
@@ -463,5 +463,10 @@
         "layerName": "Possible {title}",
         "description": "A layer which imports entries for {title}",
         "popupTitle": "Possible {title}"
+    },
+    "importHelper": {
+        "title": "Import helper",
+        "description": "The import helper converts an external dataset to notes",
+        "lockNotice": "This page is locked. You need {importHelperUnlock} changesets before you can access here."
     }
 }