mapcomplete/UI/Base/Title.ts

67 lines
No EOL
2.2 KiB
TypeScript

import BaseUIElement from "../BaseUIElement";
import {FixedUiElement} from "./FixedUiElement";
import {Utils} from "../../Utils";
export default class Title extends BaseUIElement {
public readonly title: BaseUIElement;
public readonly level: number;
public readonly id : string
private static readonly defaultClassesPerLevel = ["", "text-3xl font-bold","text-2xl font-bold","text-xl font-bold", "text-lg font-bold"]
constructor(embedded: string | BaseUIElement, level: number = 3) {
super()
if(embedded === undefined){
throw "A title should have some content. Undefined is not allowed"
}
if (typeof embedded === "string") {
this.title = new FixedUiElement(embedded)
} else {
this.title = embedded
}
this.level = level;
let innerText : string = undefined;
if(typeof embedded === "string" ) {
innerText = embedded
}else if(embedded instanceof FixedUiElement){
innerText = embedded.content
}else{
if(Utils.runningFromConsole){
console.log("Not constructing an anchor for title with embedded content of "+embedded)
}else{
innerText = embedded.ConstructElement()?.innerText
}
}
this.id = innerText?.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;
}
}