85 lines
2.3 KiB
JavaScript
85 lines
2.3 KiB
JavaScript
class MarketSidebar extends Shadow {
|
|
|
|
handleChecked(e) {
|
|
let checked = e.target.checked
|
|
let label = $(`label[for="${e.target.id}"]`).innerText
|
|
if(checked) {
|
|
window.setQuery(label.toLowerCase(), true)
|
|
} else {
|
|
window.setQuery(label.toLowerCase(), null)
|
|
}
|
|
}
|
|
|
|
render() {
|
|
VStack(() => {
|
|
|
|
p("Make")
|
|
|
|
HStack(() => {
|
|
input()
|
|
.attr({
|
|
"type": "checkbox",
|
|
"id": "hyperia-check"
|
|
})
|
|
.onChange(this.handleChecked)
|
|
label("Hyperia-Made")
|
|
.attr({
|
|
"for": "hyperia-check"
|
|
})
|
|
.marginLeft(0.5, em)
|
|
})
|
|
|
|
HStack(() => {
|
|
input()
|
|
.attr({
|
|
"type": "checkbox",
|
|
"id": "america-check"
|
|
})
|
|
.onChange(this.handleChecked)
|
|
label("America-Made")
|
|
.attr({
|
|
"for": "america-check"
|
|
})
|
|
.marginLeft(0.5, em)
|
|
})
|
|
|
|
p("Condition")
|
|
|
|
HStack(() => {
|
|
input()
|
|
.attr({
|
|
"type": "checkbox",
|
|
"id": "new-check"
|
|
})
|
|
.onChange(this.handleChecked)
|
|
label("New")
|
|
.attr({
|
|
"for": "new-check"
|
|
})
|
|
.marginLeft(0.5, em)
|
|
})
|
|
|
|
HStack(() => {
|
|
input()
|
|
.attr({
|
|
"type": "checkbox",
|
|
"id": "used-check"
|
|
})
|
|
.onChange(this.handleChecked)
|
|
label("Used")
|
|
.attr({
|
|
"for": "used-check"
|
|
})
|
|
.marginLeft(0.5, em)
|
|
})
|
|
})
|
|
.paddingTop(12, vh)
|
|
.paddingLeft(3, em)
|
|
.paddingRight(3, em)
|
|
.gap(1, em)
|
|
.minWidth(10, vw)
|
|
.userSelect('none')
|
|
}
|
|
}
|
|
|
|
register(MarketSidebar) |