From 660135c060b8cf3edafce66c8dc59eefb73b0676 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Abigail=20Magalh=C3=A3es?= Date: Fri, 20 Aug 2021 09:58:52 -0300 Subject: [PATCH] parse redactions --- src/main.tsx | 34 ++++++++++++++++++++++-------- style.css | 58 +++++++++++++++++++++++++++++++++++++++++++++++++++- 2 files changed, 83 insertions(+), 9 deletions(-) diff --git a/src/main.tsx b/src/main.tsx index 078af19..45c87c2 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -36,6 +36,8 @@ type IrcMessage = { content: MessageFrag[] } | { type: 'day_change' +} | { + type: 'redacted' }; const URL = /(((?:https?|gopher):\/\/|www\d{0,3}[.]|[a-z0-9.\-]+[.][a-z]{2,4}\/|spotify:track:)((?:\(?[^\s()<>]+\)?)*[^ \s`!\[\]{};:\'".,<>?\xab\xbb\u201c\u201d\u2018\u2019]))/i; @@ -61,6 +63,10 @@ function parse(s: string): IrcMessage { return { type: "day_change" }; + } else if (s === "[REDACTED]") { + return { + type: "redacted" + }; } const time = s.slice(0, 5); @@ -93,7 +99,7 @@ function parse(s: string): IrcMessage { } } return { - time: "no:ts", + time: "error", type: 'status', content: [{ type: 'error', @@ -106,7 +112,7 @@ const messages = lines.map(l => l.trim()).filter(l => l !== '.' && l !== "").map type MsgGroup = { user?: IrcUser, - type: "status" | "message" | "action" | "day_change", + type: "status" | "message" | "action" | "day_change" | "redacted", messages: IrcMessage[] } @@ -118,7 +124,7 @@ function group(messages: IrcMessage[]): MsgGroup[] { let type: "status" | "action" | "message" | undefined = undefined; for (const m of messages) { - if (m.type === "status" || m.type === "day_change") { + if (m.type === "status" || m.type === "day_change" || m.type == "redacted") { groups.push({ user: discrim, type: type ?? "message", @@ -188,12 +194,19 @@ const Message = ({ message, inclTs }: { message: IrcMessage, inclTs?: boolean }) }; - const prefix = message.type === "action" ? "* " : ""; + if (message.type === "redacted") { + return
+ [REDACTED] +
; + } + return
{ (inclTs === undefined || inclTs === true) ? {message.time} : undefined } - {prefix} {message.content.map(c => render(c))} + + { message.content.map(c => render(c)) } +
} @@ -209,7 +222,7 @@ function renderMessageGroup(m: MsgGroup): HtmlEnt {
{m.user?.name} - {m0.type === "day_change" ? "what" : m0.time} + {(m0.type === "day_change" || m0.type === "redacted") ? "what" : m0.time} @@ -223,7 +236,7 @@ function renderMessageGroup(m: MsgGroup): HtmlEnt {
} else { if (m.messages.length < 1) { - return + return
} return
@@ -234,7 +247,12 @@ function renderMessageGroup(m: MsgGroup): HtmlEnt { const rendered = groups.map(renderMessageGroup); -const elem = +const elem = + + + + + {rendered} diff --git a/style.css b/style.css index 04cf22a..15f94ca 100644 --- a/style.css +++ b/style.css @@ -10,6 +10,7 @@ html { body { font-size: var(--font-size); padding-left: 0.8em; + width: 90vw; } .mg-user { @@ -84,5 +85,60 @@ body { } .mg-no-user > .mg-status > .mg-txt { - font-size: 14pt; + font-size: var(--font-size); +} + +.mg-sep { + height: 0; + + border-top: 1px dotted #666; + box-sizing: border-box; + + display: flex; + justify-content: center; + align-items: center; + + margin-top: 1em; + margin-bottom: 1em; +} + +.mg-sep > span { + height: var(--font-size); + background-color: white; + padding-left: 0.5em; + padding-right: 0.5em; +} + +@media only screen and (max-width: 768px) { + body { + padding-left: 0; + } + + .mg-status { + font-weight: normal; + } + + .mg-status > .mg-txt { + font-style: italic; + } +} + +.mg-redacted { + height: var(--pfp-height); + width: 100%; + background-color: black; + color: red; + + display: flex; + flex-direction: column; + align-items: center; + + padding-top: 0.2em; + padding-bottom: 0.2em; + + margin-top: 0.1em; + margin-bottom: 0.1em; + + font-weight: bold; + font-size: calc(1.2 * var(--font-size)); } \ No newline at end of file