@@ -0,0 +1,115 @@
|
||||
const moment = require("moment")
|
||||
|
||||
module.exports = class {
|
||||
onCreate() {
|
||||
this.state = {
|
||||
operation: "",
|
||||
links: [],
|
||||
parentLink: null,
|
||||
}
|
||||
}
|
||||
|
||||
onInput(input) {
|
||||
if (input.data) {
|
||||
this.refresh(input.data)
|
||||
}
|
||||
}
|
||||
|
||||
refresh(data) {
|
||||
this.state.links = []
|
||||
this.state.operation = opText[data.op]
|
||||
this.state.parentLink = null
|
||||
|
||||
switch (data.model) {
|
||||
case "Channel": {
|
||||
const key = data.keys.find(k => k.id !== "*")
|
||||
|
||||
this.state.operation += " channel"
|
||||
this.state.links = [{
|
||||
text: key.id,
|
||||
href: `/data/channels/`,
|
||||
}]
|
||||
|
||||
break
|
||||
}
|
||||
|
||||
case "Character": {
|
||||
const character = data.objects.find(o => o.type === "Character")
|
||||
|
||||
this.state.operation += " character"
|
||||
this.state.links = [{
|
||||
text: `${character.name} (${character.id})`,
|
||||
href: `/data/characters/`,
|
||||
}]
|
||||
|
||||
break
|
||||
}
|
||||
|
||||
case "Story": {
|
||||
const key = data.keys.find(k => k.model === "Story" && k.id !== "*")
|
||||
const story = data.objects.find(o => o.type === "Story")
|
||||
|
||||
this.state.operation += " story"
|
||||
this.state.links = [{
|
||||
text: story.name,
|
||||
href: `/story/${key.id}`,
|
||||
}]
|
||||
|
||||
break
|
||||
}
|
||||
|
||||
case "Chapter": {
|
||||
const storyKey = data.keys.find(k => k.model === "Story")
|
||||
const chapterKey = data.keys.find(k => k.model === "Chapter")
|
||||
const chapter = data.objects.find(o => o.type === "Chapter")
|
||||
|
||||
this.state.operation += " chapter"
|
||||
this.state.links = [{
|
||||
text: chapter.title,
|
||||
href: `/story/${storyKey.id}#${chapterKey.id}`,
|
||||
}]
|
||||
|
||||
break
|
||||
}
|
||||
|
||||
case "Log": {
|
||||
const key = data.keys.find(k => k.id !== "*")
|
||||
|
||||
this.state.operation += " log"
|
||||
this.state.links = [{
|
||||
text: key.id,
|
||||
href: `/logs/${key.id}`,
|
||||
}]
|
||||
|
||||
break
|
||||
}
|
||||
|
||||
case "Post": {
|
||||
const logKey = data.keys.find(k => k.model === "Log")
|
||||
const postKeys = data.keys.filter(k => k.model === "Post")
|
||||
const postObjs = data.objects.filter(o => o.type === "Post")
|
||||
|
||||
this.state.operation += (postKeys.length > 1) ? " posts" : " post"
|
||||
this.state.links = postObjs.map(po => ({
|
||||
text: `[${moment(po.time).format("HH:mm")}] ${po.nick}`,
|
||||
href: `/logs/${logKey.id}#${po.id}`,
|
||||
}))
|
||||
this.state.parentLink = {
|
||||
prefix: "in log",
|
||||
text: `${logKey.id}`,
|
||||
href: `/logs/${logKey.id}`,
|
||||
}
|
||||
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const opText = {
|
||||
add: "added",
|
||||
remove: "removed",
|
||||
move: "moved",
|
||||
edit: "edited",
|
||||
import: "imported",
|
||||
}
|
||||
@@ -0,0 +1,15 @@
|
||||
import moment from "moment";
|
||||
|
||||
<div class="change">
|
||||
<span class="change-id color-menu">[${moment(input.data.date).format("MMM D HH:mm:SS")}] * </span>
|
||||
<span class="author color-text">${input.data.author} </span>
|
||||
<span class="text color-text">${state.operation} </span>
|
||||
<span for(link in state.links | status-var=loop) key=link.href class="link">
|
||||
<a class="color-primary" href=link.href>${link.text}</a>
|
||||
<span if(loop.getIndex() < state.links.length - 1) class="comma">, </span>
|
||||
</span>
|
||||
<if (state.parentLink != null)>
|
||||
<span class="text"> ${state.parentLink.prefix} </span>
|
||||
<a class="color-primary" href=state.parentLink.href>${state.parentLink.text}</a>
|
||||
</if>
|
||||
</div>
|
||||
@@ -0,0 +1,8 @@
|
||||
div.change {
|
||||
text-indent: -2ch;
|
||||
margin-left: 2ch;
|
||||
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user