diff --git a/marko/page/logs-content/components/log-suggestions/component.js b/marko/page/logs-content/components/log-suggestions/component.js new file mode 100644 index 0000000..771440e --- /dev/null +++ b/marko/page/logs-content/components/log-suggestions/component.js @@ -0,0 +1,93 @@ +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 = [] + const 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) + } + } + + 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) + } +} diff --git a/marko/page/logs-content/components/log-suggestions/index.marko b/marko/page/logs-content/components/log-suggestions/index.marko new file mode 100644 index 0000000..5cbafb4 --- /dev/null +++ b/marko/page/logs-content/components/log-suggestions/index.marko @@ -0,0 +1,41 @@ +import moment from "moment" + +
+ + 0 || state.prevs.length > 0)> + 0)> +

Next Logs

+
+
${s.log.name || `${s.log.channelName} - ${moment(s.log.date).format("MMMM D, YYYY")}`}
+
p)) class="suggestion-description color-text">${paragraph}
+
+
${s.log.eventName}
+
${s.log.channelName}
+
${c.name}
+
+
+ + 0)> +

Previous Logs

+
+
${s.log.name || `${s.log.channelName} - ${moment(s.log.date).format("MMMM D, YYYY")}`}
+
p)) class="suggestion-description color-text">${paragraph}
+
+
${s.log.eventName}
+
${s.log.channelName}
+
${c.name}
+
+
+ + + +
(No suggestions)
+ + + +
{state.error}
+ + +
Loading suggestions...
+ +
diff --git a/marko/page/logs-content/components/log-suggestions/style.less b/marko/page/logs-content/components/log-suggestions/style.less new file mode 100644 index 0000000..f1b60bc --- /dev/null +++ b/marko/page/logs-content/components/log-suggestions/style.less @@ -0,0 +1,46 @@ +div.log-suggestions { + padding: 0 0.5ch; + margin-top: 1em; + margin-bottom: 2em; + + h2 { + text-align: center; + margin: 0; + margin-bottom: 0.25em; + } + + div.empty, div.loading { + text-align: center; + } + + div.suggestion { + margin-bottom: 0.5em; + padding: 0.5em; + + div.suggestion-header { + margin: 0.125em 0.5ch; + + a { + color: inherit; + } + a:hover { + color: white; + } + } + + div.suggestion-description { + margin: 0.125em 0.5ch; + } + + div.suggestion-tags { + margin-top: 0.25em; + + div.suggestion-tag { + display: inline-block; + padding: 0 0.5ch; + margin: 0.125em 0.5ch; + border: 0.25px solid; + } + } + } +} \ No newline at end of file diff --git a/marko/page/logs-content/components/page/index.marko b/marko/page/logs-content/components/page/index.marko index 5dadbe9..0829d3b 100644 --- a/marko/page/logs-content/components/page/index.marko +++ b/marko/page/logs-content/components/page/index.marko @@ -3,6 +3,7 @@

${component.title}

+

p)) class="color-text">${paragraph}

Edit @@ -28,6 +29,7 @@ highlights=state.highlights last=(post.position === state.log.posts.length) /> +
diff --git a/marko/page/logs-content/components/page/style.less b/marko/page/logs-content/components/page/style.less index 8ee3144..cd77d0b 100644 --- a/marko/page/logs-content/components/page/style.less +++ b/marko/page/logs-content/components/page/style.less @@ -15,6 +15,10 @@ div.logs-content { margin-bottom: 0; } + p { + margin: 0.25em 0 0 0; + } + a { vertical-align: middle; display: inline-block; diff --git a/rpdata/api/LogHeader.js b/rpdata/api/LogHeader.js index 1ee9a97..c9843f3 100644 --- a/rpdata/api/LogHeader.js +++ b/rpdata/api/LogHeader.js @@ -27,6 +27,15 @@ class LogHeader { this.open = open this.characters = characters.map(ch => new LogHeaderCharacter(ch.id, ch.name, ch.shortName, ch.author)) } + + /** + * Return all characters in that log. + * + * @param {...string} ids Character IDs + */ + findCharacters(...ids) { + return this.characters.filter(c => ids.includes(c.id)) + } } class LogHeaderCharacter {