Browse Source

Merge branch 'master' of ssh+git://git.aiterp.net/rpdata/frontend

master
Gisle Aune 5 years ago
parent
commit
d92e6bfeb0
  1. 23
      marko/components/irc-caret-notation/component.js
  2. 5
      marko/components/irc-caret-notation/index.marko
  3. 4
      marko/components/menu-link/index.marko
  4. 16
      marko/page/logs-content/components/logs-content-menu/component.js
  5. 23
      marko/page/logs-content/components/logs-content-menu/index.marko
  6. 5
      marko/page/logs-content/components/page/component.js
  7. 3
      marko/page/logs-content/components/page/index.marko
  8. 45
      marko/page/logs-content/components/post/component.js
  9. 12
      marko/page/logs-content/components/post/index.marko
  10. 50
      marko/page/logs-content/components/post/style.less
  11. 8
      marko/page/story-content/components/comment/index.marko
  12. 134
      package-lock.json
  13. 1
      package.json

23
marko/components/irc-caret-notation/component.js

@ -0,0 +1,23 @@
const {parse, BOLD} = require("irc-caret-notation")
module.exports = class {
onCreate() {
this.state = {
paragraphs: [],
prev: "",
}
}
onInput(input) {
if (this.state == null) {
return
}
if (input.source != this.state.prev) {
this.state.prev = input.source
this.state.paragraphs = input.source.split("\n").filter(l => l.length > 0).map(l => parse(l, {
"*": (!(input.source.startsWith("(")) ? BOLD : null),
}))
}
}
}

5
marko/components/irc-caret-notation/index.marko

@ -0,0 +1,5 @@
<div class=["irc-caret-notation", input.class]>
<p for(p in state.paragraphs)>
<span for(chunk in p) class=chunk.cssClasses("icn-")>${chunk.text}</span>
</p>
</div>

4
marko/components/menu-link/index.marko

@ -1,6 +1,6 @@
<a on-click("onClick") href=input.href>
<div class=state.classes>
<div class="icon color-primary">${input.icon}</div>
<div class=[state.classes, input.weak ? "dark" : null]>
<div class=["icon", "color-primary"]>${input.icon}</div>
<div class=["text", input.selected ? "color-primary" : input.textClass]>
<include(input.renderBody) />
</div>

16
marko/page/logs-content/components/logs-content-menu/component.js

@ -1,5 +1,21 @@
module.exports = class {
onCreate() {
this.state = {
highlights: [],
}
}
select(value) {
this.emit("select", value)
}
toggleHighlight(id) {
if (this.state.highlights.includes(id)) {
this.state.highlights = this.state.highlights.filter(id2 => id2 !== id)
} else {
this.state.highlights = this.state.highlights.concat(id)
}
this.emit("hightlights", this.state.highlights);
}
}

23
marko/page/logs-content/components/logs-content-menu/index.marko

@ -4,10 +4,23 @@
<menu-link dark key="_create" on-click("select", "post.add", null) icon="+">Add Post</menu-link>
<menu-gap />
</if-permitted>
<menu-header>Links</menu-header>
<menu-header>Channel</menu-header>
<menu-link href=("/logs/?channels="+encodeURIComponent(input.log.channel.name)) icon="#">${input.log.channel.name}</menu-link>
<menu-link if(input.log.channel.eventName) href=("/logs/?channels="+input.log.channel.eventName) icon="E">${input.log.channel.eventName}</menu-link>
<for(character in input.log.characters)>
<menu-link href=("/logs/?characters="+character.id) icon="C">${character.name} <span class="weak">(${character.author})</span></menu-link>
</for>
<menu-gap />
<if(input.log.eventName)>
<menu-header>Event</menu-header>
<menu-link href=("/logs/?events="+input.log.eventName) icon="E">${input.log.eventName}</menu-link>
<menu-gap />
</if>
<if(input.log.characters.length > 0)>
<menu-header>Characters</menu-header>
<for(character in input.log.characters)>
<menu-link weak=(state.highlights.length > 0 && !state.highlights.includes(character.id))
icon="C"
on-click("toggleHighlight", character.id)>
${character.name} <span class="weak">(${character.author})</span>
</menu-link>
</for>
<menu-gap />
</if>
</menu>

5
marko/page/logs-content/components/page/component.js

@ -9,6 +9,7 @@ module.exports = class {
log: input.log,
modal: null,
removed: false,
highlights: [],
}
}
@ -166,6 +167,10 @@ module.exports = class {
this.state.removed = true
}
highlightsChanged(highlights) {
this.state.highlights = highlights.slice();
}
get title() {
if (this.state.log.title) {
return this.state.log.title

3
marko/page/logs-content/components/page/index.marko

@ -1,4 +1,4 @@
<logs-content-menu user=input.user log=state.log on-select("open") />
<logs-content-menu on-hightlights("highlightsChanged") user=input.user log=state.log on-select("open") />
<main>
<div class="logs-content">
<div class="header">
@ -25,6 +25,7 @@
prev=(state.log.posts[loop.getIndex() - 1] || {})
post=post
characters=state.log.characters
highlights=state.highlights
last=(post.position === state.log.posts.length)
/>
</div>

45
marko/page/logs-content/components/post/component.js

@ -14,6 +14,7 @@ module.exports = class {
multipart: false,
anchored: false,
prevWasText: false,
dark: false,
}
this.mounted = false;
@ -80,39 +81,13 @@ module.exports = class {
this.state.shortName = input.post.nick.split("_").shift()
this.state.name = input.post.nick
this.state.nameSuffix = ""
this.state.text = input.post.text.replace(/\x02/g, "**").replace(/\x1D/g, "*").replace(/\`/g, "\\`").trim();
// Fix Ctrl-Bs
let left = false
this.state.text = this.state.text.replace(/\s*\*\*\s*/g, str => {
left = !left
if (left) {
return " **"
} else if (!left) {
return "** "
}
return str
})
if (this.state.text.startsWith("|")) {
this.state.name = ""
this.state.text = this.state.text.slice(1).trim();
}
if (input.post.kind === "text" && !this.state.text.includes("\"") && !this.state.text.includes("\''") && !this.state.text.includes("|")) {
const colonIndex = this.state.text.indexOf(": ");
if (colonIndex != -1 && colonIndex < this.state.text.indexOf(" ")) {
this.state.text = this.state.text.replace(": ", ": \"") + "\"";
} else {
this.state.text = '"' + this.state.text + '"'
}
}
this.state.text = input.post.text
if (this.state.text.charAt(0) == this.state.text.charAt(0).toUpperCase()) {
this.state.name = ""
if (input.highlights.length > 0 && (input.post.kind === "action" || input.post.kind === "text")) {
this.state.dark = true
} else {
this.state.dark = false
}
if (!input.post.nick.startsWith("=")) {
@ -120,13 +95,19 @@ module.exports = class {
for (const character of input.characters) {
for (const nick of character.nicks) {
if (nick === postNick) {
this.state.name = character.name
this.state.name = character.name + character.id
this.state.shortName = character.shortName
if (input.post.nick.endsWith("'s") || input.post.nick.endsWith("'")) {
this.state.nameSuffix = (character.shortName.endsWith("s") || character.shortName.endsWith("z")) ? "'" : "'s"
}
if (input.highlights.length > 0) {
this.state.dark = !(input.highlights.includes(character.id))
} else {
this.state.dark = false
}
return
}
}

12
marko/page/logs-content/components/post/index.marko

@ -1,4 +1,4 @@
<div if(!state.removed) class=["post", component.kindClass("pk-"), state.multipart ? "multipart" : null, state.anchored ? "anchored" : null]>
<div if(!state.removed) class=["post", component.kindClass("pk-"), state.multipart ? "multipart" : null, state.anchored ? "anchored" : null, state.dark ? "dark" : null]>
<a class="anchor" id=input.post.id />
<div class="post-meta-row">
<div class="options color-menu">
@ -19,18 +19,18 @@
</div>
<div if(input.post.kind.startsWith("annotation.")) class="post-body" >
<annotation level=(input.post.kind.substring(11))>
<markdown class="post-content" source=state.text />
<irc-caret-notation class="post-content" source=state.text />
</annotation>
</div>
<div if(input.post.kind === "scene") class="post-body color-text">
<markdown class="post-content post-scene" source=state.text />
<irc-caret-notation class="post-content post-scene" source=state.text />
</div>
<div if(input.post.kind === "action") class="post-body color-text">
$ const prefix = ((!state.multipart || state.prevWasText) ? state.shortName + state.nameSuffix + " " : "");
<markdown class="post-content post-action" source=(prefix + state.text) />
<irc-caret-notation class="post-content post-action" source=(prefix + state.text) />
</div>
<div if(input.post.kind === "text") class="post-body color-text">
<markdown class="post-content post-text" source=state.text />
<div if(input.post.kind === "text") class="post-body color-text">
<irc-caret-notation class="post-content post-text" source=state.text />
</div>
<remove-post-modal enabled=(state.modal === "remove") post=input.post on-close("close") on-remove("remove") />
<edit-post-modal enabled=(state.modal === "edit") post=input.post on-close("close") on-edited("edited") />

50
marko/page/logs-content/components/post/style.less

@ -1,6 +1,6 @@
div.post {
margin-top: 1em;
margin-bottom: 1ch;
margin-bottom: 1.25em;
margin-left: -12px;
padding-left: 12px;
padding-right: 0.5ch;
@ -65,12 +65,54 @@ div.post {
margin-top: 0.33em;
}
p {
line-height: 1.33em;
margin-bottom: -0.25em;
span.icn-bold { font-weight: 800; }
span.icn-underline { text-decoration: underline; }
span.icn-italic { font-style: italic; }
span.icn-fg-0 { color: #fff; }
span.icn-fg-1 { color: #111; }
span.icn-fg-2 { color: #13d; }
span.icn-fg-3 { color: #173; }
span.icn-fg-4 { color: #d21; }
span.icn-fg-5 { color: #721; }
span.icn-fg-6 { color: #727; }
span.icn-fg-7 { color: #d71; }
span.icn-fg-8 { color: #aa1; }
span.icn-fg-9 { color: #1d3; }
span.icn-fg-10 { color: #177; }
span.icn-fg-11 { color: #1DD; }
span.icn-fg-12 { color: #127; }
span.icn-fg-13 { color: #c1a; }
span.icn-fg-14 { color: #444; }
span.icn-fg-15 { color: #aaa; }
span.icn-bg-0 { background-color: #fff; }
span.icn-bg-1 { background-color: #111; }
span.icn-bg-2 { background-color: #13d; }
span.icn-bg-3 { background-color: #173; }
span.icn-bg-4 { background-color: #d21; }
span.icn-bg-5 { background-color: #721; }
span.icn-bg-6 { background-color: #727; }
span.icn-bg-7 { background-color: #d71; }
span.icn-bg-8 { background-color: #aa1; }
span.icn-bg-9 { background-color: #1d3; }
span.icn-bg-10 { background-color: #177; }
span.icn-bg-11 { background-color: #1DD; }
span.icn-bg-12 { background-color: #127; }
span.icn-bg-13 { background-color: #c1a; }
span.icn-bg-14 { background-color: #444; }
span.icn-bg-15 { background-color: #aaa; }
}
p:first-of-type {
margin-top: 0;
padding-top: 0;
}
p:last-of-type {
padding-bottom: 0.1em;
margin-bottom: 0em;
}
}
}
@ -91,11 +133,15 @@ div.post.pk-text.anchored {
}
div.post.multipart {
margin-top: -0.9em;
margin-top: -1.5em;
div.post-meta {
span {
display: none;
}
}
}
div.post.dark {
opacity: 0.25;
}

8
marko/page/story-content/components/comment/index.marko

@ -47,7 +47,9 @@ import moment from "moment"
</tr>
<tr if(input.comment.fictionalDate != null)>
<th>Date:</th>
<td>${moment(input.comment.fictionalDate).format("MMM D, YYYY")}</td>
<td>
<date utc value=input.comment.fictionalDate></date>
</td>
</tr>
</tbody>
</table>
@ -69,7 +71,7 @@ import moment from "moment"
<markdown class="body" source=paragraph>
<if (input.comment.fictionalDate)>
<span class="decoration color-menu">[</span>
<date class="color-menu" value=input.comment.fictionalDate></date>
<date utc class="color-menu" value=input.comment.fictionalDate></date>
<span class="decoration color-menu">]&nbsp;</span>
</if>
<span class="decoration color-menu">&lt;</span>
@ -108,7 +110,7 @@ import moment from "moment"
</div>
<chapter-meta kind="title" value=input.comment.subject />
<chapter-meta kind="name" value=input.comment.characterName character=(input.comment.character) ukAuthor=input.comment.author />
<chapter-meta kind="date" value=input.comment.fictionalDate />
<chapter-meta utc kind="date" value=input.comment.fictionalDate />
<chapter-meta weak kind="date" value=input.comment.createdDate />
<chapter-meta weak kind="author" value=input.comment.author />
</div>

134
package-lock.json

@ -2308,13 +2308,13 @@
"integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
},
"fsevents": {
"version": "1.2.4",
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.4.tgz",
"integrity": "sha512-z8H8/diyk76B7q5wg+Ud0+CqzcAF3mBBI/bA5ne5zrRUUIvNkJY//D3BqyH571KuAC4Nr7Rw7CjWX4r0y9DvNg==",
"version": "1.2.8",
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.8.tgz",
"integrity": "sha512-tPvHgPGB7m40CZ68xqFGkKuzN+RnpGmSV+hgeKxhRpbxdqKXUFJGC3yonBOLzQBcJyGpdZFDfCsdOC2KFsXzeA==",
"optional": true,
"requires": {
"nan": "^2.9.2",
"node-pre-gyp": "^0.10.0"
"nan": "^2.12.1",
"node-pre-gyp": "^0.12.0"
},
"dependencies": {
"abbrev": {
@ -2324,7 +2324,8 @@
},
"ansi-regex": {
"version": "2.1.1",
"bundled": true
"bundled": true,
"optional": true
},
"aproba": {
"version": "1.2.0",
@ -2332,7 +2333,7 @@
"optional": true
},
"are-we-there-yet": {
"version": "1.1.4",
"version": "1.1.5",
"bundled": true,
"optional": true,
"requires": {
@ -2342,32 +2343,37 @@
},
"balanced-match": {
"version": "1.0.0",
"bundled": true
"bundled": true,
"optional": true
},
"brace-expansion": {
"version": "1.1.11",
"bundled": true,
"optional": true,
"requires": {
"balanced-match": "^1.0.0",
"concat-map": "0.0.1"
}
},
"chownr": {
"version": "1.0.1",
"version": "1.1.1",
"bundled": true,
"optional": true
},
"code-point-at": {
"version": "1.1.0",
"bundled": true
"bundled": true,
"optional": true
},
"concat-map": {
"version": "0.0.1",
"bundled": true
"bundled": true,
"optional": true
},
"console-control-strings": {
"version": "1.1.0",
"bundled": true
"bundled": true,
"optional": true
},
"core-util-is": {
"version": "1.0.2",
@ -2375,15 +2381,15 @@
"optional": true
},
"debug": {
"version": "2.6.9",
"version": "4.1.1",
"bundled": true,
"optional": true,
"requires": {
"ms": "2.0.0"
"ms": "^2.1.1"
}
},
"deep-extend": {
"version": "0.5.1",
"version": "0.6.0",
"bundled": true,
"optional": true
},
@ -2426,7 +2432,7 @@
}
},
"glob": {
"version": "7.1.2",
"version": "7.1.3",
"bundled": true,
"optional": true,
"requires": {
@ -2444,11 +2450,11 @@
"optional": true
},
"iconv-lite": {
"version": "0.4.21",
"version": "0.4.24",
"bundled": true,
"optional": true,
"requires": {
"safer-buffer": "^2.1.0"
"safer-buffer": ">= 2.1.2 < 3"
}
},
"ignore-walk": {
@ -2470,7 +2476,8 @@
},
"inherits": {
"version": "2.0.3",
"bundled": true
"bundled": true,
"optional": true
},
"ini": {
"version": "1.3.5",
@ -2480,6 +2487,7 @@
"is-fullwidth-code-point": {
"version": "1.0.0",
"bundled": true,
"optional": true,
"requires": {
"number-is-nan": "^1.0.0"
}
@ -2492,24 +2500,27 @@
"minimatch": {
"version": "3.0.4",
"bundled": true,
"optional": true,
"requires": {
"brace-expansion": "^1.1.7"
}
},
"minimist": {
"version": "0.0.8",
"bundled": true
"bundled": true,
"optional": true
},
"minipass": {
"version": "2.2.4",
"version": "2.3.5",
"bundled": true,
"optional": true,
"requires": {
"safe-buffer": "^5.1.1",
"safe-buffer": "^5.1.2",
"yallist": "^3.0.0"
}
},
"minizlib": {
"version": "1.1.0",
"version": "1.2.1",
"bundled": true,
"optional": true,
"requires": {
@ -2519,37 +2530,38 @@
"mkdirp": {
"version": "0.5.1",
"bundled": true,
"optional": true,
"requires": {
"minimist": "0.0.8"
}
},
"ms": {
"version": "2.0.0",
"version": "2.1.1",
"bundled": true,
"optional": true
},
"needle": {
"version": "2.2.0",
"version": "2.3.0",
"bundled": true,
"optional": true,
"requires": {
"debug": "^2.1.2",
"debug": "^4.1.0",
"iconv-lite": "^0.4.4",
"sax": "^1.2.4"
}
},
"node-pre-gyp": {
"version": "0.10.0",
"version": "0.12.0",
"bundled": true,
"optional": true,
"requires": {
"detect-libc": "^1.0.2",
"mkdirp": "^0.5.1",
"needle": "^2.2.0",
"needle": "^2.2.1",
"nopt": "^4.0.1",
"npm-packlist": "^1.1.6",
"npmlog": "^4.0.2",
"rc": "^1.1.7",
"rc": "^1.2.7",
"rimraf": "^2.6.1",
"semver": "^5.3.0",
"tar": "^4"
@ -2565,12 +2577,12 @@
}
},
"npm-bundled": {
"version": "1.0.3",
"version": "1.0.6",
"bundled": true,
"optional": true
},
"npm-packlist": {
"version": "1.1.10",
"version": "1.4.1",
"bundled": true,
"optional": true,
"requires": {
@ -2591,7 +2603,8 @@
},
"number-is-nan": {
"version": "1.0.1",
"bundled": true
"bundled": true,
"optional": true
},
"object-assign": {
"version": "4.1.1",
@ -2601,6 +2614,7 @@
"once": {
"version": "1.4.0",
"bundled": true,
"optional": true,
"requires": {
"wrappy": "1"
}
@ -2635,11 +2649,11 @@
"optional": true
},
"rc": {
"version": "1.2.7",
"version": "1.2.8",
"bundled": true,
"optional": true,
"requires": {
"deep-extend": "^0.5.1",
"deep-extend": "^0.6.0",
"ini": "~1.3.0",
"minimist": "^1.2.0",
"strip-json-comments": "~2.0.1"
@ -2667,16 +2681,17 @@
}
},
"rimraf": {
"version": "2.6.2",
"version": "2.6.3",
"bundled": true,
"optional": true,
"requires": {
"glob": "^7.0.5"
"glob": "^7.1.3"
}
},
"safe-buffer": {
"version": "5.1.1",
"bundled": true
"version": "5.1.2",
"bundled": true,
"optional": true
},
"safer-buffer": {
"version": "2.1.2",
@ -2689,7 +2704,7 @@
"optional": true
},
"semver": {
"version": "5.5.0",
"version": "5.7.0",
"bundled": true,
"optional": true
},
@ -2706,6 +2721,7 @@
"string-width": {
"version": "1.0.2",
"bundled": true,
"optional": true,
"requires": {
"code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0",
@ -2723,6 +2739,7 @@
"strip-ansi": {
"version": "3.0.1",
"bundled": true,
"optional": true,
"requires": {
"ansi-regex": "^2.0.0"
}
@ -2733,16 +2750,16 @@
"optional": true
},
"tar": {
"version": "4.4.1",
"version": "4.4.8",
"bundled": true,
"optional": true,
"requires": {
"chownr": "^1.0.1",
"chownr": "^1.1.1",
"fs-minipass": "^1.2.5",
"minipass": "^2.2.4",
"minizlib": "^1.1.0",
"minipass": "^2.3.4",
"minizlib": "^1.1.1",
"mkdirp": "^0.5.0",
"safe-buffer": "^5.1.1",
"safe-buffer": "^5.1.2",
"yallist": "^3.0.2"
}
},
@ -2752,20 +2769,22 @@
"optional": true
},
"wide-align": {
"version": "1.1.2",
"version": "1.1.3",
"bundled": true,
"optional": true,
"requires": {
"string-width": "^1.0.2"
"string-width": "^1.0.2 || 2"
}
},
"wrappy": {
"version": "1.0.2",
"bundled": true
"bundled": true,
"optional": true
},
"yallist": {
"version": "3.0.2",
"bundled": true
"version": "3.0.3",
"bundled": true,
"optional": true
}
}
},
@ -3415,6 +3434,11 @@
"resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.8.0.tgz",
"integrity": "sha1-6qM9bd16zo9/b+DJygRA5wZzix4="
},
"irc-caret-notation": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/irc-caret-notation/-/irc-caret-notation-1.0.0.tgz",
"integrity": "sha512-V/Dhqb/wentrfxH5U2pUTK1ye53mIEmpWCpT81Qa+/YfEDY7XuFjpCD/J0WRzjDqaecwn4mj0Mz+6T6bAz/BSA=="
},
"is-absolute": {
"version": "0.2.6",
"resolved": "https://registry.npmjs.org/is-absolute/-/is-absolute-0.2.6.tgz",
@ -3977,9 +4001,9 @@
"integrity": "sha1-OWCLQ1wJAfpVECF8FFJyjWvBm18="
},
"lodash": {
"version": "4.17.10",
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.10.tgz",
"integrity": "sha512-UejweD1pDoXu+AD825lWwp4ZGtSwgnpZxb3JDViD7StjQz+Nb/6l093lx4OQ0foGWNRoc19mWy7BzL+UAK2iVg=="
"version": "4.17.11",
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.11.tgz",
"integrity": "sha512-cQKh8igo5QUhZ7lg38DYWAxMvjSAKG0A8wGSVimP07SIUEK2UO+arSRKbRZWtelMtN5V0Hkwh5ryOto/SshYIg=="
},
"lodash.includes": {
"version": "4.3.0",
@ -4289,9 +4313,9 @@
"integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
},
"nan": {
"version": "2.10.0",
"resolved": "https://registry.npmjs.org/nan/-/nan-2.10.0.tgz",
"integrity": "sha512-bAdJv7fBLhWC+/Bls0Oza+mvTaNQtP+1RyhhhvD95pgUJz6XM5IzgmxOkItJ9tkoCiplvAnXI1tNmmUD/eScyA==",
"version": "2.13.2",
"resolved": "https://registry.npmjs.org/nan/-/nan-2.13.2.tgz",
"integrity": "sha512-TghvYc72wlMGMVMluVo9WRJc0mB8KxxF/gZ4YYFy7V2ZQX9l7rgbPg7vjS9mt6U5HXODVFVI2bOduCzwOMv/lw==",
"optional": true
},
"nanomatch": {

1
package.json

@ -27,6 +27,7 @@
"graphql-query-compress": "^1.1.0",
"http-proxy-middleware": "^0.19.1",
"ip": "^1.1.5",
"irc-caret-notation": "^1.0.0",
"isomorphic-fetch": "^2.2.1",
"jsonwebtoken": "^8.3.0",
"lasso": "^3.2.6",

Loading…
Cancel
Save