midgard/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

Add a histogram visualisation

Browse source
This commit is contained in:
Pieter Vander Vennet 2021-06-21 03:13:05 +02:00
parent 962e364bad
commit d4909734a1
2 changed files with 77 additions and 65 deletions
Download patch file Download diff file Expand all files Collapse all files

36
UI/Base/Table.ts
View file

@ -8,7 +8,7 @@ export default class Table extends BaseUIElement {
private readonly _contents: BaseUIElement[][];
private readonly _contentStyle: string[][];
constructor(header: (BaseUIElement | string)[],
constructor(header: (BaseUIElement | string)[],
contents: (BaseUIElement | string)[][],
contentStyle?: string[][]) {
super();
@ -17,25 +17,39 @@ export default class Table extends BaseUIElement {
this._contents = contents.map(row => row.map(Translations.W));
}
AsMarkdown(): string {
const headerMarkdownParts = this._header.map(hel => hel?.AsMarkdown() ?? " ")
const header = headerMarkdownParts.join(" | ");
const headerSep = headerMarkdownParts.map(part => '-'.repeat(part.length + 2)).join("|")
const table = this._contents.map(row => row.map(el => el.AsMarkdown() ?? " ").join("|")).join("\n")
return [header, headerSep, table, ""].join("\n")
}
protected InnerConstructElement(): HTMLElement {
const table = document.createElement("table")
const headerElems = Utils.NoNull((this._header ?? []).map(elems => elems.ConstructElement()))
if (headerElems.length > 0) {
const thead = document.createElement("thead")
const tr = document.createElement("tr");
headerElems.forEach(headerElem => {
const td = document.createElement("th")
td.appendChild(headerElem)
tr.appendChild(td)
})
table.appendChild(tr)
thead.appendChild(tr)
table.appendChild(thead)
}
for (let i = 0; i < this._contents.length; i++){
for (let i = 0; i < this._contents.length; i++) {
let row = this._contents[i];
const tr = document.createElement("tr")
for (let j = 0; j < row.length; j++){
for (let j = 0; j < row.length; j++) {
let elem = row[j];
const htmlElem = elem?.ConstructElement()
if (htmlElem === undefined) {
@ -43,10 +57,10 @@ export default class Table extends BaseUIElement {
}
let style = undefined;
if(this._contentStyle !== undefined && this._contentStyle[i] !== undefined && this._contentStyle[j]!== undefined){
if (this._contentStyle !== undefined && this._contentStyle[i] !== undefined && this._contentStyle[j] !== undefined) {
style = this._contentStyle[i][j]
}
const td = document.createElement("td")
td.style.cssText = style;
td.appendChild(htmlElem)
@ -57,15 +71,5 @@ export default class Table extends BaseUIElement {
return table;
}
AsMarkdown(): string {
const headerMarkdownParts = this._header.map(hel => hel?.AsMarkdown() ?? " ")
const header =headerMarkdownParts.join(" | ");
const headerSep = headerMarkdownParts.map(part => '-'.repeat(part.length + 2)).join("|")
const table = this._contents.map(row => row.map(el => el.AsMarkdown()?? " ").join("|")).join("\n")
return [header, headerSep, table, ""].join("\n")
}
}