94 lines
3.1 KiB
JavaScript
94 lines
3.1 KiB
JavaScript
class DownloadsPanel extends Shadow {
|
|
render() {
|
|
ZStack(() => {
|
|
input("", "60vw")
|
|
.backgroundColor("var(--accent3)")
|
|
.color("var(--accent)")
|
|
.border("none")
|
|
.borderTop("1px solid var(--accent)")
|
|
.borderBottom("1px solid var(--accent)")
|
|
.outline("0.5px solid black")
|
|
.borderRadius(7, px)
|
|
.transition("padding .2s")
|
|
.padding(0.5, em)
|
|
.position("absolute")
|
|
.x(50, vw).y(7, em)
|
|
.transform("translate(-50%, -50%)")
|
|
.onInput(() => {
|
|
console.log('typing')
|
|
})
|
|
.onFocus(function (focusing) {
|
|
if(focusing) {
|
|
this.style.padding = "1em"
|
|
this.style.borderColor = "var(--darkred)"
|
|
} else {
|
|
this.style.padding = "0.5em"
|
|
this.style.borderColor = "var(--accent)"
|
|
}
|
|
})
|
|
|
|
// VStack(() => {
|
|
// const json = this.getJSONData()
|
|
|
|
// p(json.length + " Entries")
|
|
// .marginBottom(2, em)
|
|
|
|
// // Split into two alternating columns
|
|
// const left = []
|
|
// const right = []
|
|
|
|
// for (let i = 0; i < 200; i++) {
|
|
// if (i % 2 === 0) {
|
|
// left.push(json[i])
|
|
// } else {
|
|
// right.push(json[i])
|
|
// }
|
|
// }
|
|
|
|
// console.log(left)
|
|
// HStack(() => {
|
|
// // LEFT COLUMN
|
|
// VStack(() => {
|
|
// for (let item of left) {
|
|
// p(item.name)
|
|
// .marginLeft(0, em)
|
|
// .marginBottom(0.1, em)
|
|
// }
|
|
// })
|
|
|
|
// // RIGHT COLUMN
|
|
// VStack(() => {
|
|
// for (let item of right) {
|
|
// p(item.name)
|
|
// .marginLeft(0, em)
|
|
// .marginBottom(0.1, em)
|
|
// }
|
|
// })
|
|
// .marginLeft(3, em) // spacing between columns
|
|
// })
|
|
// })
|
|
// .paddingLeft(5, em)
|
|
// .paddingTop(10, em)
|
|
})
|
|
}
|
|
|
|
getJSONData() {
|
|
const script = document.getElementById('jsonData');
|
|
if (!script) {
|
|
console.warn('initial-data script not found');
|
|
return null;
|
|
}
|
|
|
|
try {
|
|
// script.textContent is the raw JSON string
|
|
const data = JSON.parse(script.textContent);
|
|
console.log(data)
|
|
return data;
|
|
} catch (err) {
|
|
console.error('Failed to parse initial-data JSON:', err);
|
|
return null;
|
|
}
|
|
}
|
|
}
|
|
|
|
register(DownloadsPanel) |