forked from MapComplete/MapComplete
Refactoring: remove more parts of the old framework
This commit is contained in:
parent
7d7cee3624
commit
2ddf0c36be
3 changed files with 4 additions and 83 deletions
|
|
@ -1,73 +0,0 @@
|
||||||
import BaseUIElement from "../BaseUIElement"
|
|
||||||
import { FixedUiElement } from "./FixedUiElement"
|
|
||||||
import { Utils } from "../../Utils"
|
|
||||||
|
|
||||||
export default class Title extends BaseUIElement {
|
|
||||||
private static readonly defaultClassesPerLevel = [
|
|
||||||
"",
|
|
||||||
"text-3xl font-bold",
|
|
||||||
"text-2xl font-bold",
|
|
||||||
"text-xl font-bold",
|
|
||||||
"text-lg font-bold",
|
|
||||||
]
|
|
||||||
public readonly title: BaseUIElement
|
|
||||||
public readonly level: number
|
|
||||||
public readonly id: string
|
|
||||||
|
|
||||||
constructor(embedded: string | BaseUIElement, level: number = 3) {
|
|
||||||
super()
|
|
||||||
if (embedded === undefined) {
|
|
||||||
console.warn("A title should have some content. Undefined is not allowed")
|
|
||||||
embedded = ""
|
|
||||||
}
|
|
||||||
if (typeof embedded === "string") {
|
|
||||||
this.title = new FixedUiElement(embedded)
|
|
||||||
} else {
|
|
||||||
this.title = embedded
|
|
||||||
}
|
|
||||||
this.level = level
|
|
||||||
|
|
||||||
let text: string = undefined
|
|
||||||
if (typeof embedded === "string") {
|
|
||||||
text = embedded
|
|
||||||
} else if (embedded instanceof FixedUiElement) {
|
|
||||||
text = embedded.content
|
|
||||||
} else {
|
|
||||||
if (!Utils.runningFromConsole) {
|
|
||||||
text = embedded.ConstructElement()?.textContent
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
this.id =
|
|
||||||
text
|
|
||||||
?.replace(/ /g, "-")
|
|
||||||
?.replace(/[?#.;:/]/, "")
|
|
||||||
?.toLowerCase() ?? ""
|
|
||||||
this.SetClass(Title.defaultClassesPerLevel[level] ?? "")
|
|
||||||
}
|
|
||||||
|
|
||||||
AsMarkdown(): string {
|
|
||||||
const embedded = " " + this.title.AsMarkdown() + " "
|
|
||||||
|
|
||||||
if (this.level == 1) {
|
|
||||||
return "\n\n" + embedded + "\n" + "=".repeat(embedded.length) + "\n\n"
|
|
||||||
}
|
|
||||||
|
|
||||||
if (this.level == 2) {
|
|
||||||
return "\n\n" + embedded + "\n" + "-".repeat(embedded.length) + "\n\n"
|
|
||||||
}
|
|
||||||
|
|
||||||
return "\n\n" + "#".repeat(this.level) + embedded + "\n\n"
|
|
||||||
}
|
|
||||||
|
|
||||||
protected InnerConstructElement(): HTMLElement {
|
|
||||||
const el = this.title.ConstructElement()
|
|
||||||
if (el === undefined) {
|
|
||||||
return undefined
|
|
||||||
}
|
|
||||||
const h = document.createElement("h" + this.level)
|
|
||||||
h.appendChild(el)
|
|
||||||
el.id = this.id
|
|
||||||
return h
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -5,7 +5,6 @@ import Combine from "../Base/Combine"
|
||||||
import { TagUtils } from "../../Logic/Tags/TagUtils"
|
import { TagUtils } from "../../Logic/Tags/TagUtils"
|
||||||
import { Utils } from "../../Utils"
|
import { Utils } from "../../Utils"
|
||||||
import { OsmFeature } from "../../Models/OsmFeature"
|
import { OsmFeature } from "../../Models/OsmFeature"
|
||||||
import Title from "../Base/Title"
|
|
||||||
|
|
||||||
export interface TagRenderingChartOptions {
|
export interface TagRenderingChartOptions {
|
||||||
groupToOtherCutoff?: 3 | number
|
groupToOtherCutoff?: 3 | number
|
||||||
|
|
@ -195,7 +194,6 @@ export default class TagRenderingChart extends Combine {
|
||||||
options?: TagRenderingChartOptions & {
|
options?: TagRenderingChartOptions & {
|
||||||
chartclasses?: string
|
chartclasses?: string
|
||||||
chartstyle?: string
|
chartstyle?: string
|
||||||
includeTitle?: boolean
|
|
||||||
chartType?: "pie" | "bar" | "doughnut"
|
chartType?: "pie" | "bar" | "doughnut"
|
||||||
}
|
}
|
||||||
) {
|
) {
|
||||||
|
|
@ -275,12 +273,8 @@ export default class TagRenderingChart extends Combine {
|
||||||
chart.SetStyle(options.chartstyle)
|
chart.SetStyle(options.chartstyle)
|
||||||
}
|
}
|
||||||
|
|
||||||
super([
|
super([chart])
|
||||||
new Title(options?.includeTitle ? tagRendering.question ?? tagRendering.id : undefined),
|
this.SetClass("flex flex-col justify-center h-full")
|
||||||
new Combine([chart]).SetClass("flex flex-col justify-center h-full"),
|
|
||||||
])
|
|
||||||
|
|
||||||
this.SetClass("block")
|
|
||||||
}
|
}
|
||||||
|
|
||||||
public static extractDataAndLabels<T extends { properties: Record<string, string> }>(
|
public static extractDataAndLabels<T extends { properties: Record<string, string> }>(
|
||||||
|
|
|
||||||
|
|
@ -43,11 +43,11 @@
|
||||||
{:else}
|
{:else}
|
||||||
<div class="flex w-full flex-wrap gap-x-4 gap-y-4">
|
<div class="flex w-full flex-wrap gap-x-4 gap-y-4">
|
||||||
{#each trs as tr}
|
{#each trs as tr}
|
||||||
|
<h3> {#if tr.question}<Tr t={tr.question}/>{:else} {tr.id}{/if}</h3>
|
||||||
<ToSvelte
|
<ToSvelte
|
||||||
construct={() =>
|
construct={() =>
|
||||||
new TagRenderingChart($elements, tr, {
|
new TagRenderingChart($elements, tr, {
|
||||||
chartclasses: "w-full self-center",
|
chartclasses: "w-full self-center"
|
||||||
includeTitle: true,
|
|
||||||
}).SetClass(tr.multiAnswer ? "w-128" : "w-96")}
|
}).SetClass(tr.multiAnswer ? "w-128" : "w-96")}
|
||||||
/>
|
/>
|
||||||
{/each}
|
{/each}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue