midgard/mapcomplete
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Merge branch 'feature/svelte' of github.com:pietervdvn/MapComplete into feature/svelte

Browse source
This commit is contained in:
Pieter Vander Vennet 2023-03-08 18:40:29 +01:00
commit a67cca1e83
5 changed files with 70 additions and 53 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

54
UI/AllTagsPanel.svelte Normal file
View file

@ -0,0 +1,54 @@
<script lang="ts">
import ToSvelte from "./Base/ToSvelte.svelte"
import Table from "./Base/Table"
import { UIEventSource } from "../Logic/UIEventSource"
//Svelte props
export let tags: UIEventSource<any>
export let state: any
const calculatedTags = [].concat(
// SimpleMetaTagger.lazyTags,
...(state?.layoutToUse?.layers?.map((l) => l.calculatedTags?.map((c) => c[0]) ?? []) ?? [])
)
const allTags = tags.map((tags) => {
const parts = []
for (const key in tags) {
if (!tags.hasOwnProperty(key)) {
continue
}
let v = tags[key]
if (v === "") {
v = "<b>empty string</b>"
}
parts.push([key, v ?? "<b>undefined</b>"])
}
for (const key of calculatedTags) {
const value = tags[key]
if (value === undefined) {
continue
}
let type = ""
if (typeof value !== "string") {
type = " <i>" + typeof value + "</i>"
}
parts.push(["<i>" + key + "</i>", value])
}
return parts
})
const tagsTable = new Table(["Key", "Value"], $allTags).SetClass("zebra-table")
</script>
<section>
<ToSvelte construct={tagsTable} />
</section>
<style lang="scss">
section {
@apply border border-solid border-black rounded-2xl p-4 block;
}
</style>

47
UI/AllTagsPanel.ts
View file

@ -1,47 +0,0 @@
import { VariableUiElement } from "./Base/VariableUIElement"
import { UIEventSource } from "../Logic/UIEventSource"
import Table from "./Base/Table"
export class AllTagsPanel extends VariableUiElement {
constructor(tags: UIEventSource<any>, state?) {
const calculatedTags = [].concat(
// SimpleMetaTagger.lazyTags,
...(state?.layoutToUse?.layers?.map((l) => l.calculatedTags?.map((c) => c[0]) ?? []) ??
[])
)
super(
tags.map((tags) => {
const parts = []
for (const key in tags) {
if (!tags.hasOwnProperty(key)) {
continue
}
let v = tags[key]
if (v === "") {
v = "<b>empty string</b>"
}
parts.push([key, v ?? "<b>undefined</b>"])
}
for (const key of calculatedTags) {
const value = tags[key]
if (value === undefined) {
continue
}
let type = ""
if (typeof value !== "string") {
type = " <i>" + typeof value + "</i>"
}
parts.push(["<i>" + key + "</i>", value])
}
return new Table(["key", "value"], parts)
.SetStyle(
"border: 1px solid black; border-radius: 1em;padding:1em;display:block;"
)
.SetClass("zebra-table")
})
)
}
}

7
UI/BigComponents/HiddenThemeList.svelte
View file

@ -4,15 +4,18 @@
import type Loc from "../../Models/Loc"
import * as themeOverview from "../../assets/generated/theme_overview.json"
import { Utils } from "../../Utils"
import ThemesList, { type Theme } from "./ThemesList.svelte"
import ThemesList from "./ThemesList.svelte"
import Translations from "../i18n/Translations"
import { LayoutInformation } from "../../Models/ThemeConfig/LayoutConfig"
export let search: UIEventSource<string>
export let state: { osmConnection: OsmConnection; locationControl?: UIEventSource<Loc> }
export let onMainScreen: boolean = true
const prefix = "mapcomplete-hidden-theme-"
const hiddenThemes: Theme[] = themeOverview["default"].filter((layout) => layout.hideFromOverview)
const hiddenThemes: LayoutInformation[] = themeOverview["default"].filter(
(layout) => layout.hideFromOverview
)
const userPreferences = state.osmConnection.preferencesHandler.preferences
const t = Translations.t.general.morescreen

9
UI/ImportFlow/MapPreview.ts
View file

@ -23,17 +23,22 @@ import { FlowStep } from "./FlowStep"
import ScrollableFullScreen from "../Base/ScrollableFullScreen"
import Title from "../Base/Title"
import CheckBoxes from "../Input/Checkboxes"
import { AllTagsPanel } from "../AllTagsPanel"
import AllTagsPanel from "../AllTagsPanel.svelte"
import BackgroundMapSwitch from "../BigComponents/BackgroundMapSwitch"
import { Feature, Point } from "geojson"
import DivContainer from "../Base/DivContainer"
import ShowDataLayer from "../ShowDataLayer/ShowDataLayer"
import SvelteUIElement from "../Base/SvelteUIElement"
class PreviewPanel extends ScrollableFullScreen {
constructor(tags: UIEventSource<any>) {
super(
(_) => new FixedUiElement("Element to import"),
(_) => new Combine(["The tags are:", new AllTagsPanel(tags)]).SetClass("flex flex-col"),
(_) =>
new Combine([
"The tags are:",
new SvelteUIElement(AllTagsPanel, { tags }),
]).SetClass("flex flex-col"),
"element"
)
}

6
UI/SpecialVisualizations.ts
View file

@ -20,7 +20,7 @@ import { CloseNoteButton } from "./Popup/CloseNoteButton"
import { NearbyImageVis } from "./Popup/NearbyImageVis"
import { MapillaryLinkVis } from "./Popup/MapillaryLinkVis"
import { Stores, UIEventSource } from "../Logic/UIEventSource"
import { AllTagsPanel } from "./AllTagsPanel"
import AllTagsPanel from "./AllTagsPanel.svelte"
import AllImageProviders from "../Logic/ImageProviders/AllImageProviders"
import { ImageCarousel } from "./Image/ImageCarousel"
import { ImageUploadFlow } from "./Image/ImageUploadFlow"
@ -53,6 +53,7 @@ import StatisticsPanel from "./BigComponents/StatisticsPanel"
import AutoApplyButton from "./Popup/AutoApplyButton"
import { LanguageElement } from "./Popup/LanguageElement"
import FeatureReviews from "../Logic/Web/MangroveReviews"
import SvelteUIElement from "./Base/SvelteUIElement"
export default class SpecialVisualizations {
public static specialVisualizations: SpecialVisualization[] = SpecialVisualizations.initList()
@ -81,7 +82,8 @@ export default class SpecialVisualizations {
funcName: "all_tags",
docs: "Prints all key-value pairs of the object - used for debugging",
args: [],
constr: (state, tags: UIEventSource<any>) => new AllTagsPanel(tags, state),
constr: (state, tags: UIEventSource<any>) =>
new SvelteUIElement(AllTagsPanel, { tags, state }),
},
{
funcName: "image_carousel",