You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
147 lines
3.3 KiB
147 lines
3.3 KiB
const {channelApi} = require("../../../../../rpdata/api/Channel")
|
|
const {logHeaderApi} = require("../../../../../rpdata/api/LogHeader")
|
|
|
|
module.exports = class {
|
|
onCreate() {
|
|
this.state = {
|
|
search: "",
|
|
filters: [],
|
|
channels: [],
|
|
eventNames: [],
|
|
}
|
|
|
|
this.first = true
|
|
}
|
|
|
|
onInput(input) {
|
|
if (input.filters) {
|
|
if (this.timeout != null) {
|
|
setTimeout(() => {
|
|
this.searchFilters()
|
|
}, 1)
|
|
}
|
|
}
|
|
|
|
console.log(input.eventNames)
|
|
}
|
|
|
|
onMount() {
|
|
this.timeout = null
|
|
|
|
if (this.state.channels.length === 0) {
|
|
channelApi.list().then(channels => {
|
|
this.state.channels = channels
|
|
this.searchFilters()
|
|
}).catch(err => {
|
|
console.warn("Failed to fetch channels:", err)
|
|
})
|
|
}
|
|
|
|
if (this.state.eventNames.length === 0) {
|
|
logHeaderApi.eventNames().then(eventNames => {
|
|
this.state.eventNames = eventNames
|
|
this.searchFilters()
|
|
}).catch(err => {
|
|
console.warn("Failed to fetch eventNames:", err)
|
|
})
|
|
}
|
|
|
|
this.getEl("search").addEventListener("keydown", ev => {
|
|
if (this.waiting) {
|
|
return
|
|
}
|
|
|
|
if (this.timeout != null) {
|
|
clearTimeout(this.timeout)
|
|
}
|
|
|
|
this.timeout = setTimeout(() => {
|
|
this.timeout = null
|
|
this.state.search = ev.target.value
|
|
|
|
this.searchFilters()
|
|
}, 200)
|
|
})
|
|
}
|
|
|
|
onUnmount() {
|
|
clearTimeout(this.timeout)
|
|
this.timeout = null
|
|
|
|
this.state.search = ""
|
|
this.state.filters = []
|
|
}
|
|
|
|
add(type, value, filter) {
|
|
this.emit("add", type, value)
|
|
|
|
this.state.filters = this.state.filters.filter(f => f != filter)
|
|
}
|
|
|
|
searchFilters() {
|
|
const filters = []
|
|
const search = this.state.search.toLowerCase()
|
|
|
|
for (const channel of this.state.channels) {
|
|
if (search == "" || channel.name.toLowerCase().includes(search)) {
|
|
if (this.input.filter.channels && this.input.filter.channels.includes(channel.name)) {
|
|
continue
|
|
}
|
|
|
|
filters.push({
|
|
colorClass: "color-tag-location",
|
|
text: channel.name,
|
|
type: "channels",
|
|
value: channel.name,
|
|
})
|
|
}
|
|
}
|
|
|
|
for (const name of this.state.eventNames) {
|
|
if (search == "" || name.toLowerCase().includes(search)) {
|
|
if (this.input.filter.events && this.input.filter.events.includes(name)) {
|
|
continue
|
|
}
|
|
|
|
filters.push({
|
|
colorClass: "color-tag-event",
|
|
text: name,
|
|
type: "events",
|
|
value: name,
|
|
})
|
|
}
|
|
}
|
|
|
|
for (const character of this.input.characters) {
|
|
if (search == "" || character.name.toLowerCase().includes(search)) {
|
|
if (this.input.filter.characters && this.input.filter.characters.includes(character.id)) {
|
|
continue
|
|
}
|
|
|
|
filters.push({
|
|
colorClass: "color-tag-character",
|
|
text: character.name,
|
|
type: "characters",
|
|
value: character.id,
|
|
})
|
|
}
|
|
}
|
|
|
|
filters.sort((a, b) => {
|
|
let aCompare = a.text
|
|
let bCompare = b.text
|
|
|
|
if (a.text.charAt(0) === "#") {
|
|
aCompare = a.text.slice(1)
|
|
}
|
|
if (b.text.charAt(0) === "#") {
|
|
bCompare = b.text.slice(1)
|
|
}
|
|
|
|
return aCompare.localeCompare(bCompare)
|
|
})
|
|
|
|
this.state.filters = filters
|
|
}
|
|
|
|
}
|