the last few things.
This commit is contained in:
@@ -1,96 +1,10 @@
|
||||
const {logHeaderApi} = require("../../../../../rpdata/api/LogHeader")
|
||||
|
||||
module.exports = class {
|
||||
onCreate(input) {
|
||||
this.state = {
|
||||
id: input.log.id,
|
||||
channelName: input.log.channelName,
|
||||
eventName: input.log.eventName,
|
||||
nexts: [],
|
||||
prevs: [],
|
||||
loaded: false,
|
||||
error: null,
|
||||
}
|
||||
}
|
||||
|
||||
onMount() {
|
||||
this.timeout = setTimeout(() => {
|
||||
logHeaderApi.list().then(logs => {
|
||||
const index = logs.findIndex(l => l.id === this.state.id);
|
||||
if (index === -1) {
|
||||
return Promise.reject("This log not found in list.")
|
||||
}
|
||||
const log = logs[index]
|
||||
const characterIds = log.characters.map(c => c.id);
|
||||
const nexts = []
|
||||
const prevs = []
|
||||
let foundGroups = {}
|
||||
let foundChannel = false
|
||||
|
||||
for (let i = index - 1; i >= 0; --i) {
|
||||
const log2 = logs[i]
|
||||
const hasEvent = (log.eventName ? log.eventName === log2.eventName : false)
|
||||
const hasChannel = (log.channelName === log2.channelName)
|
||||
|
||||
const characters = log2.findCharacters(...characterIds)
|
||||
const characterIdsKey = characters.map(c => c.id).sort().join(",")
|
||||
|
||||
const suggestion = {log: log2, characters, hasEvent, hasChannel}
|
||||
|
||||
if (hasChannel && !foundChannel) {
|
||||
foundChannel = true
|
||||
foundGroups[characterIdsKey] = true
|
||||
|
||||
nexts.push(suggestion)
|
||||
} else if (hasEvent) {
|
||||
foundGroups[characterIdsKey] = true
|
||||
|
||||
nexts.push(suggestion)
|
||||
} else if (nexts.length < 8 && !hasEvent && characters.length > 1 && !foundGroups[characterIdsKey]) {
|
||||
foundGroups[characterIdsKey] = true
|
||||
nexts.push(suggestion)
|
||||
}
|
||||
}
|
||||
|
||||
foundGroups = {}
|
||||
foundChannel = false
|
||||
|
||||
for (let i = index + 1; i < logs.length; ++i) {
|
||||
const log2 = logs[i]
|
||||
const hasEvent = (log.eventName ? log.eventName === log2.eventName : false)
|
||||
const hasChannel = (log.channelName === log2.channelName)
|
||||
|
||||
const characters = log2.findCharacters(...characterIds)
|
||||
const characterIdsKey = characters.map(c => c.id).sort().join(",")
|
||||
|
||||
const suggestion = {log: log2, characters, hasEvent, hasChannel}
|
||||
|
||||
if (hasChannel && !foundChannel) {
|
||||
foundChannel = true
|
||||
foundGroups[characterIdsKey] = true
|
||||
|
||||
prevs.push(suggestion)
|
||||
} else if (hasEvent) {
|
||||
foundGroups[characterIdsKey] = true
|
||||
|
||||
prevs.push(suggestion)
|
||||
} else if (prevs.length < 8 && !hasEvent && characters.length > 1 && !foundGroups[characterIdsKey]) {
|
||||
foundGroups[characterIdsKey] = true
|
||||
prevs.push(suggestion)
|
||||
}
|
||||
}
|
||||
|
||||
this.state.nexts = nexts;
|
||||
this.state.prevs = prevs;
|
||||
this.state.loaded = true;
|
||||
}).catch(err => {
|
||||
console.warn("Suggestions load error:", err)
|
||||
this.suggestionsError = "Failed to load suggestions: " + err.toString()
|
||||
})
|
||||
}, 1000)
|
||||
}
|
||||
|
||||
onUnmount() {
|
||||
clearTimeout(this.timeout)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,41 +1,33 @@
|
||||
import moment from "moment"
|
||||
|
||||
<div class="log-suggestions">
|
||||
<if (state.loaded && state.error == null)>
|
||||
<if (state.nexts.length > 0 || state.prevs.length > 0)>
|
||||
<if (state.nexts.length > 0)>
|
||||
<h2 class="color-primary">Next Logs</h2>
|
||||
<div for(s in state.nexts) class="suggestion color-primary">
|
||||
<div class="suggestion-header color-primary"><a href=`/logs/${s.log.id}`>${s.log.name || `${s.log.channelName} - ${moment(s.log.date).format("MMMM D, YYYY")}`}</a></div>
|
||||
<div for(paragraph in (s.log.description||"").split("\n").filter(p => p)) class="suggestion-description color-text">${paragraph}</div>
|
||||
<div class="suggestion-tags">
|
||||
<div if(s.hasEvent) class="suggestion-tag color-tag-event">${s.log.eventName}</div>
|
||||
<div if(s.hasChannel) class="suggestion-tag color-tag-location">${s.log.channelName}</div>
|
||||
<div for(c in s.characters) class="suggestion-tag color-tag-character">${c.name}</div>
|
||||
</div>
|
||||
<div class="log-suggestions">
|
||||
<if (input.log.nextLogs.length > 0 || input.log.prevLogs.length > 0)>
|
||||
<if (input.log.nextLogs.length > 0)>
|
||||
<h2 class="color-primary">Next Logs</h2>
|
||||
<div for(s in input.log.nextLogs) class="suggestion color-primary">
|
||||
<div class="suggestion-header color-primary"><a href=`/logs/${s.log.id}`>${s.log.title || `${s.log.channelName} - ${moment(s.log.date).format("MMMM D, YYYY")}`}</a></div>
|
||||
<div for(paragraph in (s.log.description||"").split("\n").filter(p => p)) class="suggestion-description color-text">${paragraph}</div>
|
||||
<div class="suggestion-tags">
|
||||
<div if(s.hasEvent) class="suggestion-tag color-tag-event">${input.log.eventName}</div>
|
||||
<div if(s.hasChannel) class="suggestion-tag color-tag-location">${s.log.channelName}</div>
|
||||
<div for(c in s.characters) class="suggestion-tag color-tag-character">${c.name}</div>
|
||||
</div>
|
||||
</if>
|
||||
<if (state.prevs.length > 0)>
|
||||
<h2 class="color-primary">Previous Logs</h2>
|
||||
<div for(s in state.prevs) class="suggestion color-primary">
|
||||
<div class="suggestion-header color-primary"><a href=`/logs/${s.log.id}`>${s.log.name || `${s.log.channelName} - ${moment(s.log.date).format("MMMM D, YYYY")}`}</a></div>
|
||||
<div for(paragraph in (s.log.description||"").split("\n").filter(p => p)) class="suggestion-description color-text">${paragraph}</div>
|
||||
<div class="suggestion-tags">
|
||||
<div if(s.hasEvent) class="suggestion-tag color-tag-event">${s.log.eventName}</div>
|
||||
<div if(s.hasChannel) class="suggestion-tag color-tag-location">${s.log.channelName}</div>
|
||||
<div for(c in s.characters) class="suggestion-tag color-tag-character">${c.name}</div>
|
||||
</div>
|
||||
</div>
|
||||
</if>
|
||||
<if (input.log.prevLogs.length > 0)>
|
||||
<h2 class="color-primary">Previous Logs</h2>
|
||||
<div for(s in input.log.prevLogs) class="suggestion color-primary">
|
||||
<div class="suggestion-header color-primary"><a href=`/logs/${s.log.id}`>${s.log.title || `${s.log.channelName} - ${moment(s.log.date).format("MMMM D, YYYY")}`}</a></div>
|
||||
<div for(paragraph in (s.log.description||"").split("\n").filter(p => p)) class="suggestion-description color-text">${paragraph}</div>
|
||||
<div class="suggestion-tags">
|
||||
<div if(s.hasEvent) class="suggestion-tag color-tag-event">${input.log.eventName}</div>
|
||||
<div if(s.hasChannel) class="suggestion-tag color-tag-location">${s.log.channelName}</div>
|
||||
<div for(c in s.characters) class="suggestion-tag color-tag-character">${c.name}</div>
|
||||
</div>
|
||||
</if>
|
||||
</div>
|
||||
</if>
|
||||
<else>
|
||||
<div class="empty color-menu">(No suggestions)</div>
|
||||
</else>
|
||||
</if>
|
||||
<else-if(state.error != null)>
|
||||
<div class="error color-danger">{state.error}</div>
|
||||
</else-if>
|
||||
<else>
|
||||
<div class="loading color-menu">Loading suggestions...</div>
|
||||
<div class="empty color-menu">(No suggestions)</div>
|
||||
</else>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user