Actually delete build directory
All checks were successful
continuous-integration/drone/push Build is passing

This commit is contained in:
Cadence Ember 2020-10-20 23:26:32 +13:00
parent 4855b2c6a0
commit 25c3fe17b4
Signed by: cadence
GPG key ID: BC1C2C61CF521B17
21 changed files with 0 additions and 1710 deletions

View file

@ -1,35 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<!-- var static = !{JSON.stringify([...static.entries()].reduce((a, c) => (a[c[0]] = getRelative(c[1]), a), {}))}-->
<script>var staticFiles = new Map([["/js/basic.js","static/basic.js?static=4212436742"],["/js/groups.js","static/groups.js?static=551ad1c247"],["/js/chat-input.js","static/chat-input.js?static=556a7b79a3"],["/js/room-picker.js","static/room-picker.js?static=d5e34a8051"],["/js/store/store.js","static/store/store.js?static=ce3066287b"],["/js/store/Subscribable.js","static/store/Subscribable.js?static=19b7e44aa6"],["/js/store/SubscribeValue.js","static/store/SubscribeValue.js?static=215b6a5099"],["/js/store/SubscribeMapList.js","static/store/SubscribeMapList.js?static=b2732c5460"],["/js/store/SubscribeSet.js","static/store/SubscribeSet.js?static=39a1c0a2a4"],["/js/sync/sync.js","static/sync/sync.js?static=fc5795a5b8"],["/js/lsm.js","static/lsm.js?static=aed2c7ca35"],["/js/Timeline.js","static/Timeline.js?static=1393b78916"],["/js/Anchor.js","static/Anchor.js?static=85efd1a836"],["/js/chat.js","static/chat.js?static=b01b3716ff"],["/js/functions.js","static/functions.js?static=e3784c70ce"],["/assets/fonts/whitney-500.woff","static/whitney-500.woff?static=ba33ed18fe"],["/assets/fonts/whitney-400.woff","static/whitney-400.woff?static=0f823bc4b5"],["/assets/icons/directs.svg","static/directs.svg?static=2555ccd447"],["/assets/icons/channels.svg","static/channels.svg?static=8389f20610"],["/assets/icons/join-event.svg","static/join-event.svg?static=761c23a0ef"],["/sass/main.sass","static/main.css?static=e9db1a3439"]])
</script>
<link rel="stylesheet" type="text/css" href="static/main.css?static=e9db1a3439">
<script type="module" src="static/groups.js?static=551ad1c247"></script>
<script type="module" src="static/chat-input.js?static=556a7b79a3"></script>
<script type="module" src="static/room-picker.js?static=d5e34a8051"></script>
<script type="module" src="static/sync/sync.js?static=fc5795a5b8"></script>
<script type="module" src="static/chat.js?static=b01b3716ff"></script>
<title>Carbon</title>
</head>
<body>
<main class="main">
<div class="c-groups">
<div class="c-groups__display" id="c-groups-display">
<div class="c-group-marker" id="c-group-marker"></div>
<div class="c-groups__container" id="c-groups-list"></div>
</div>
</div>
<div class="c-rooms" id="c-rooms"></div>
<div class="c-chat">
<div class="c-chat__messages" id="c-chat-messages">
<div class="c-chat__inner" id="c-chat"></div>
</div>
<div class="c-chat-input">
<textarea class="c-chat-input__textarea" placeholder="Send a message..." autocomplete="off" id="c-chat-textarea"></textarea>
</div>
</div>
</main>
</body>
</html>

View file

@ -1,15 +0,0 @@
import {ElemJS} from "../static/basic.js?static=4212436742"
class Anchor extends ElemJS {
constructor() {
super("div")
this.class("c-anchor")
}
scroll() {
// console.log("anchor scrolled")
this.element.scrollIntoView({block: "start"})
}
}
export {Anchor}

View file

@ -1,282 +0,0 @@
import {ElemJS, ejs} from "../static/basic.js?static=4212436742"
import {Subscribable} from "../static/store/Subscribable.js?static=19b7e44aa6"
import {store} from "../static/store/store.js?static=ce3066287b"
import {Anchor} from "../static/Anchor.js?static=85efd1a836"
import * as lsm from "../static/lsm.js?static=aed2c7ca35"
import {resolveMxc} from "../static/functions.js?static=e3784c70ce"
const dateFormatter = Intl.DateTimeFormat("default", {hour: "numeric", minute: "numeric", day: "numeric", month: "short", year: "numeric"})
let sentIndex = 0
function getTxnId() {
return Date.now() + (sentIndex++)
}
function eventSearch(list, event, min = 0, max = -1) {
if (list.length === 0) return {success: false, i: 0}
if (max === -1) max = list.length - 1
let mid = Math.floor((max + min) / 2)
// success condition
if (list[mid] && list[mid].data.event_id === event.data.event_id) return {success: true, i: mid}
// failed condition
if (min >= max) {
while (mid !== -1 && (!list[mid] || list[mid].data.origin_server_ts > event.data.origin_server_ts)) mid--
return {
success: false,
i: mid + 1
}
}
// recurse (below)
if (list[mid].data.origin_server_ts > event.data.origin_server_ts) return eventSearch(list, event, min, mid-1)
// recurse (above)
else return eventSearch(list, event, mid+1, max)
}
class Event extends ElemJS {
constructor(data) {
super("div")
this.class("c-message")
this.data = null
this.group = null
this.update(data)
}
setGroup(group) {
this.group = group
}
update(data) {
this.data = data
this.render()
}
removeEvent() {
if (this.group) this.group.removeEvent(this)
else this.remove()
}
render() {
this.element.classList[this.data.pending ? "add" : "remove"]("c-message--pending")
this.text(this.data.content.body)
}
}
class Sender {
constructor(roomID, mxid) {
this.sender = store.rooms.get(roomID).value().members.get(mxid)
this.sender.subscribe("changeSelf", this.update.bind(this))
this.name = new ElemJS("div").class("c-message-group__name")
this.avatar = new ElemJS("div").class("c-message-group__avatar")
this.update()
}
update() {
if (this.sender.exists()) {
// name
this.name.text(this.sender.value().content.displayname)
// avatar
this.avatar.clearChildren()
if (this.sender.value().content.avatar_url) {
this.avatar.child(
ejs("img").class("c-message-group__icon").attribute("src", resolveMxc(this.sender.value().content.avatar_url, 96, "crop"))
)
} else {
this.avatar.child(
ejs("div").class("c-message-group__icon", "c-message-group__icon--no-icon")
)
}
}
}
}
class EventGroup extends ElemJS {
constructor(reactive, list) {
super("div")
this.class("c-message-group")
this.reactive = reactive
this.list = list
this.data = {
sender: list[0].data.sender,
origin_server_ts: list[0].data.origin_server_ts
}
this.sender = new Sender(this.reactive.id, this.data.sender)
this.child(
this.sender.avatar,
this.messages = ejs("div").class("c-message-group__messages").child(
ejs("div").class("c-message-group__intro").child(
this.sender.name,
ejs("div").class("c-message-group__date").text(dateFormatter.format(this.data.origin_server_ts))
),
...this.list
)
)
}
addEvent(event) {
const index = eventSearch(this.list, event).i
event.setGroup(this)
this.list.splice(index, 0, event)
this.messages.childAt(index + 1, event)
}
removeEvent(event) {
const search = eventSearch(this.list, event)
if (!search.success) throw new Error(`Event ${event.data.event_id} not found in this group`)
const index = search.i
// actually remove the event
this.list.splice(index, 1)
event.remove() // should get everything else
if (this.list.length === 0) this.reactive.removeGroup(this)
}
}
class ReactiveTimeline extends ElemJS {
constructor(id, list) {
super("div")
this.class("c-event-groups")
this.id = id
this.list = list
this.render()
}
addEvent(event) {
const search = eventSearch(this.list, event)
// console.log(search, this.list.map(l => l.data.sender), event.data)
if (!search.success && search.i >= 1) this.tryAddGroups(event, [search.i-1, search.i])
else this.tryAddGroups(event, [search.i])
}
tryAddGroups(event, indices) {
const success = indices.some(i => {
if (!this.list[i]) {
// if (printed++ < 100) console.log("tryadd success, created group")
const group = new EventGroup(this, [event])
this.list.splice(i, 0, group)
this.childAt(i, group)
return true
} else if (this.list[i] && this.list[i].data.sender === event.data.sender) {
// if (printed++ < 100) console.log("tryadd success, using existing group")
this.list[i].addEvent(event)
return true
}
})
if (!success) console.log("tryadd failure", indices, this.list.map(l => l.data.sender), event.data)
}
removeGroup(group) {
const index = this.list.indexOf(group)
this.list.splice(index, 1)
group.remove() // should get everything else
}
render() {
this.clearChildren()
this.list.forEach(group => this.child(group))
this.anchor = new Anchor()
this.child(this.anchor)
}
}
class Timeline extends Subscribable {
constructor(id) {
super()
Object.assign(this.events, {
beforeChange: [],
afterChange: []
})
Object.assign(this.eventDeps, {
beforeChange: [],
afterChange: []
})
this.id = id
this.list = []
this.map = new Map()
this.reactiveTimeline = new ReactiveTimeline(id, [])
this.latest = 0
this.pending = new Set()
}
updateEvents(events) {
this.broadcast("beforeChange")
for (const eventData of events) {
this.latest = Math.max(this.latest, eventData.origin_server_ts)
let id = eventData.event_id
if (eventData.sender === lsm.get("mx_user_id") && eventData.content && this.pending.has(eventData.content["chat.carbon.message.pending_id"])) {
id = eventData.content["chat.carbon.message.pending_id"]
}
if (this.map.has(id)) {
this.map.get(id).update(eventData)
} else {
const event = new Event(eventData)
this.map.set(id, event)
this.reactiveTimeline.addEvent(event)
}
}
this.broadcast("afterChange")
}
removeEvent(id) {
if (!this.map.has(id)) throw new Error(`Tried to delete event ID ${id} which does not exist`)
this.map.get(id).removeEvent()
this.map.delete(id)
}
getTimeline() {
return this.reactiveTimeline
}
send(body) {
const tx = getTxnId()
const id = `pending$${tx}`
this.pending.add(id)
const content = {
msgtype: "m.text",
body,
"chat.carbon.message.pending_id": id
}
const fakeEvent = {
origin_server_ts: Date.now(),
event_id: id,
sender: lsm.get("mx_user_id"),
content,
pending: true
}
this.updateEvents([fakeEvent])
return fetch(`${lsm.get("domain")}/_matrix/client/r0/rooms/${this.id}/send/m.room.message/${tx}?access_token=${lsm.get("access_token")}`, {
method: "PUT",
body: JSON.stringify(content),
headers: {
"Content-Type": "application/json"
}
})/*.then(() => {
const subscription = () => {
this.removeEvent(id)
this.unsubscribe("afterChange", subscription)
}
this.subscribe("afterChange", subscription)
})*/
}
/*
getGroupedEvents() {
let currentSender = Symbol("N/A")
let groups = []
let currentGroup = []
for (const event of this.list) {
if (event.sender === currentSender) {
currentGroup.push(event)
} else {
if (currentGroup.length) groups.push(currentGroup)
currentGroup = [event]
currentSender = event.sender
}
}
if (currentGroup.length) groups.push(currentGroup)
return groups
}
*/
}
export {Timeline}

View file

@ -1,160 +0,0 @@
/**
* Shortcut for querySelector.
* @template {HTMLElement} T
* @returns {T}
*/
const q = s => document.querySelector(s);
/**
* Shortcut for querySelectorAll.
* @template {HTMLElement} T
* @returns {T[]}
*/
const qa = s => document.querySelectorAll(s);
/**
* An easier, chainable, object-oriented way to create and update elements
* and children according to related data. Subclass ElemJS to create useful,
* advanced data managers, or just use it inline to quickly make a custom element.
* Created by Cadence Ember in 2018.
*/
class ElemJS {
constructor(type) {
if (type instanceof HTMLElement) {
// If passed an existing element, bind to it
this.bind(type);
} else {
// Otherwise, create a new detached element to bind to
this.bind(document.createElement(type));
}
this.children = [];
}
/** Bind this construct to an existing element on the page. */
bind(element) {
this.element = element;
this.element.js = this;
return this;
}
/** Add a class. */
class() {
for (let name of arguments) if (name) this.element.classList.add(name);
return this;
}
/** Remove a class. */
removeClass() {
for (let name of arguments) if (name) this.element.classList.remove(name);
return this;
}
/** Set a JS property on the element. */
direct(name, value) {
if (name) this.element[name] = value;
return this;
}
/** Set an attribute on the element. */
attribute(name, value) {
if (name) this.element.setAttribute(name, value != undefined ? value : "");
return this;
}
/** Set a style on the element. */
style(name, value) {
if (name) this.element.style[name] = value;
return this;
}
/** Set the element's ID. */
id(name) {
if (name) this.element.id = name;
return this;
}
/** Attach a callback function to an event on the element. */
on(name, callback) {
this.element.addEventListener(name, callback);
return this;
}
/** Set the element's text. */
text(name) {
this.element.innerText = name;
return this;
}
/** Create a text node and add it to the element. */
addText(name) {
const node = document.createTextNode(name);
this.element.appendChild(node);
return this;
}
/** Set the element's HTML content. */
html(name) {
this.element.innerHTML = name;
return this;
}
/**
* Add children to the element.
* Children can either be an instance of ElemJS, in
* which case the element will be appended as a child,
* or a string, in which case the string will be added as a text node.
* Each child should be a parameter to this method.
*/
child(...children) {
for (const toAdd of children) {
if (typeof toAdd === "object" && toAdd !== null) {
// Should be an instance of ElemJS, so append as child
toAdd.parent = this;
this.element.appendChild(toAdd.element);
this.children.push(toAdd);
} else if (typeof toAdd === "string") {
// Is a string, so add as text node
this.addText(toAdd);
}
}
return this;
}
childAt(index, toAdd) {
if (typeof toAdd === "object" && toAdd !== null) {
toAdd.parent = this;
this.children.splice(index, 0, toAdd);
if (index >= this.element.childNodes.length) {
this.element.appendChild(toAdd.element)
} else {
this.element.childNodes[index].insertAdjacentElement("beforebegin", toAdd.element)
}
}
}
/**
* Remove all children from the element.
*/
clearChildren() {
this.children.length = 0;
while (this.element.lastChild) this.element.removeChild(this.element.lastChild);
}
/**
* Remove this element.
*/
remove() {
let index;
if (this.parent && (index = this.parent.children.indexOf(this)) !== -1) {
this.parent.children.splice(index, 1);
}
this.parent = null;
this.element.remove();
}
}
/** Shortcut for `new ElemJS`. */
function ejs(tag) {
return new ElemJS(tag);
}
export {q, qa, ElemJS, ejs}

View file

@ -1,83 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="48.000004"
height="48.000004"
viewBox="0 0 12.700001 12.700001"
version="1.1"
id="svg27"
inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)"
sodipodi:docname="channels.svg">
<defs
id="defs21" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="1"
inkscape:cx="25.083567"
inkscape:cy="22.080215"
inkscape:document-units="px"
inkscape:current-layer="layer1"
showgrid="true"
units="px"
inkscape:window-width="1440"
inkscape:window-height="879"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
showborder="false">
<inkscape:grid
type="xygrid"
id="grid824" />
</sodipodi:namedview>
<metadata
id="metadata24">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(36.739286,-225.97828)">
<path
style="opacity:1;fill-opacity:1;fill-rule:nonzero;stroke:#e2e2e2;stroke-width:1.05833333;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill"
d="m -31.976786,228.62411 v 7.40833"
id="path864"
inkscape:connector-curvature="0" />
<path
inkscape:connector-curvature="0"
id="path866"
d="m -28.801786,228.62412 v 7.40833"
style="opacity:1;fill-opacity:1;fill-rule:nonzero;stroke:#e2e2e2;stroke-width:1.05833333;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill" />
<path
inkscape:connector-curvature="0"
id="path905"
d="m -26.685116,230.74078 h -7.40833"
style="opacity:1;fill-opacity:1;fill-rule:nonzero;stroke:#e2e2e2;stroke-width:1.05833328;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill" />
<path
style="opacity:1;fill-opacity:1;fill-rule:nonzero;stroke:#e2e2e2;stroke-width:1.05833328;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill"
d="m -26.685126,233.91578 h -7.40833"
id="path907"
inkscape:connector-curvature="0" />
</g>
</svg>

Before

Width:  |  Height:  |  Size: 3.2 KiB

View file

@ -1,37 +0,0 @@
import {q} from "../static/basic.js?static=4212436742"
import {store} from "../static/store/store.js?static=ce3066287b"
import * as lsm from "../static/lsm.js?static=aed2c7ca35"
import {chat} from "../static/chat.js?static=b01b3716ff"
const input = q("#c-chat-textarea")
store.activeRoom.subscribe("changeSelf", () => {
if (store.activeRoom.exists()) {
input.focus()
}
})
input.addEventListener("keydown", event => {
if (event.key === "Enter" && !event.shiftKey && !event.ctrlKey) {
event.preventDefault()
const body = input.value
send(input.value)
input.value = ""
fixHeight()
}
})
input.addEventListener("input", () => {
fixHeight()
})
function fixHeight() {
input.style.height = "0px"
// console.log(input.clientHeight, input.scrollHeight)
input.style.height = (input.scrollHeight + 1) + "px"
}
function send(body) {
if (!store.activeRoom.exists()) return
return store.activeRoom.value().timeline.send(body)
}

View file

@ -1,65 +0,0 @@
import {ElemJS, q, ejs} from "../static/basic.js?static=4212436742"
import {store} from "../static/store/store.js?static=ce3066287b"
const chatMessages = q("#c-chat-messages")
class Chat extends ElemJS {
constructor() {
super(q("#c-chat"))
this.removableSubscriptions = []
store.activeRoom.subscribe("changeSelf", this.changeRoom.bind(this))
this.render()
}
unsubscribe() {
this.removableSubscriptions.forEach(({name, target, subscription}) => {
target.unsubscribe(name, subscription)
})
this.removableSubscriptions.length = 0
}
changeRoom() {
// disconnect from the previous room
this.unsubscribe()
// connect to the new room's timeline updater
if (store.activeRoom.exists()) {
const timeline = store.activeRoom.value().timeline
const subscription = () => {
// scroll anchor does not work if the timeline is scrolled to the top.
// at the start, when there are not enough messages for a full screen, this is the case.
// once there are enough messages that scrolling is necessary, we initiate a scroll down to activate the scroll anchor.
let oldDifference = chatMessages.scrollHeight - chatMessages.clientHeight
setTimeout(() => {
let newDifference = chatMessages.scrollHeight - chatMessages.clientHeight
// console.log("height difference", oldDifference, newDifference)
if (oldDifference < 24) { // this is jank
this.element.parentElement.scrollBy(0, 1000)
}
}, 0)
}
const name = "beforeChange"
this.removableSubscriptions.push({name, target: timeline, subscription})
timeline.subscribe(name, subscription)
}
this.render()
}
render() {
this.clearChildren()
if (store.activeRoom.exists()) {
const reactiveTimeline = store.activeRoom.value().timeline.getTimeline()
this.child(reactiveTimeline)
setTimeout(() => {
this.element.parentElement.scrollBy(0, 1)
reactiveTimeline.anchor.scroll()
}, 0)
}
}
}
const chat = new Chat()
export {chat}

View file

@ -1,72 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="48.000004"
height="48.000004"
viewBox="0 0 12.700001 12.700001"
version="1.1"
id="svg27"
inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)"
sodipodi:docname="directs.svg">
<defs
id="defs21" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="22.627417"
inkscape:cx="27.665561"
inkscape:cy="33.324951"
inkscape:document-units="px"
inkscape:current-layer="layer1"
showgrid="true"
units="px"
inkscape:window-width="1440"
inkscape:window-height="879"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
showborder="true"
inkscape:snap-bbox="true"
inkscape:bbox-nodes="true"
inkscape:snap-grids="true">
<inkscape:grid
type="xygrid"
id="grid824" />
</sodipodi:namedview>
<metadata
id="metadata24">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(36.739286,-225.97828)">
<path
style="opacity:1;fill:#e2e2e2;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:0.52916664;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill"
d="m -33.035119,228.8887 h 5.067509 c 0.868277,0 1.567287,0.69901 1.567287,1.56728 v 2.66473 c 0,0.86828 -0.69901,1.56729 -1.567287,1.56729 h -2.157093 l -1.322916,1.86351 -1.322917,-1.86351 h -0.264583 c -0.868277,0 -1.567287,-0.69901 -1.567287,-1.56729 v -2.66473 c 0,-0.86827 0.69901,-1.56728 1.567287,-1.56728 z"
id="rect820"
inkscape:connector-curvature="0"
sodipodi:nodetypes="ssssscccssss" />
</g>
</svg>

Before

Width:  |  Height:  |  Size: 2.5 KiB

View file

@ -1,14 +0,0 @@
import {q} from "../static/basic.js?static=4212436742"
let state = "CLOSED"
const groups = q("#c-groups-display")
const rooms = q("#c-rooms")
groups.addEventListener("click", () => {
groups.classList.add("c-groups__display--closed")
})
rooms.addEventListener("mouseout", () => {
groups.classList.remove("c-groups__display--closed")
})

View file

@ -1,80 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="20"
height="20"
viewBox="0 0 5.2916665 5.2916668"
version="1.1"
id="svg27"
inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)"
sodipodi:docname="join-event.svg">
<defs
id="defs21" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="1"
inkscape:cx="15.649008"
inkscape:cy="8.3751893"
inkscape:document-units="px"
inkscape:current-layer="layer1"
showgrid="true"
units="px"
inkscape:window-width="1440"
inkscape:window-height="879"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1">
<inkscape:grid
type="xygrid"
id="grid26" />
</sodipodi:namedview>
<metadata
id="metadata24">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(0,-291.70832)">
<path
style="opacity:1;fill:#e2e2e2;fill-opacity:1;fill-rule:nonzero;stroke:#73d216;stroke-width:0.52916666;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill"
d="M 0.79374997,294.35416 H 4.4979167"
id="path28"
inkscape:connector-curvature="0"
sodipodi:nodetypes="cc" />
<path
inkscape:connector-curvature="0"
id="path30"
d="m 3.175,293.03124 1.3229167,1.32292"
style="opacity:1;fill:#e2e2e2;fill-opacity:1;fill-rule:nonzero;stroke:#73d216;stroke-width:0.52916666;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill"
sodipodi:nodetypes="cc" />
<path
sodipodi:nodetypes="cc"
style="opacity:1;fill:#e2e2e2;fill-opacity:1;fill-rule:nonzero;stroke:#73d216;stroke-width:0.52916666;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill"
d="M 4.4979167,294.35416 3.175,295.67707"
id="path32"
inkscape:connector-curvature="0" />
</g>
</svg>

Before

Width:  |  Height:  |  Size: 2.9 KiB

View file

@ -1,11 +0,0 @@
function get(name) {
return localStorage.getItem(name)
}
function set(name, value) {
return localStorage.setItem(name, value)
}
window.lsm = {get, set}
export {get, set}

View file

@ -1,261 +0,0 @@
@font-face {
font-family: Whitney;
font-weight: 400;
src: url(/static/whitney-400.woff?static=0f823bc4b5) format("woff2");
}
@font-face {
font-family: Whitney;
font-weight: 500;
src: url(/static/whitney-500.woff?static=ba33ed18fe) format("woff2");
}
body {
font-family: sans-serif;
background-color: #36393e;
color: #ddd;
font-size: 16px;
font-family: Whitney;
line-height: 1.45;
margin: 0;
height: 100vh;
font-weight: 400;
}
.main {
height: 100vh;
display: flex;
}
.c-rooms {
background-color: #2f3135;
padding: 8px;
width: 240px;
font-size: 18px;
font-weight: 500;
overflow-y: auto;
scrollbar-width: thin;
scrollbar-color: #202224 #2f3135;
flex-shrink: 0;
}
.c-room {
display: flex;
align-items: center;
padding: 6px 8px;
margin: 2px 0;
cursor: pointer;
border-radius: 8px;
}
.c-room:not(.c-room--active):hover {
background-color: #393c42;
}
.c-room--active {
background-color: #42454a;
}
.c-room__icon {
width: 32px;
height: 32px;
margin-right: 8px;
border-radius: 50%;
flex-shrink: 0;
}
.c-room__icon--no-icon {
background-color: #bbb;
}
.c-room__name {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.c-groups {
position: relative;
width: 80px;
flex-shrink: 0;
font-size: 22px;
font-weight: 500;
}
.c-groups__display {
background-color: #202224;
overflow: hidden;
width: 80px;
position: absolute;
left: 0;
top: 0;
bottom: 0;
right: 0;
transition: width ease-out 0.12s;
scrollbar-width: thin;
scrollbar-color: #42454a #202224;
}
.c-groups__display:not(.c-groups__display--closed):hover {
width: 320px;
overflow-y: auto;
}
.c-groups__container {
width: 320px;
padding: 8px;
}
.c-group {
display: flex;
align-items: center;
padding: 4px 8px;
cursor: pointer;
border-radius: 8px;
}
.c-group:hover {
background-color: #2f3135;
}
.c-group__icon {
width: 48px;
height: 48px;
background-color: #393c42;
border-radius: 50%;
margin-right: 16px;
flex-shrink: 0;
transition: border-radius ease-out 0.12s;
}
.c-group--active .c-group__icon {
border-radius: 28%;
}
.c-group__name {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.c-group-marker {
position: absolute;
top: 5px;
opacity: 0;
transform: translateY(8px);
transition: transform ease 0.12s, opacity ease-out 0.12s;
height: 46px;
width: 6px;
background-color: #ccc;
border-radius: 0px 6px 6px 0px;
}
.c-event-groups * {
overflow-anchor: none;
}
.c-message-group, .c-message-event {
margin-top: 12px;
padding-top: 12px;
border-top: 1px solid #4b4e54;
}
.c-message-group {
display: flex;
}
.c-message-group__avatar {
flex-shrink: 0;
margin-right: 16px;
cursor: pointer;
}
.c-message-group__icon {
width: 40px;
height: 40px;
border-radius: 50%;
}
.c-message-group__icon--no-icon {
background-color: #48d;
}
.c-message-group__intro {
display: flex;
align-items: baseline;
}
.c-message-group__name {
color: #5bf;
margin: -2px 0px -3px;
font-size: 19px;
font-weight: 500;
cursor: pointer;
}
.c-message-group__name:hover {
text-decoration: underline;
}
.c-message-group__date {
font-size: 14px;
margin-left: 9px;
color: #999;
}
.c-message {
margin-top: 4px;
opacity: 1;
transition: opacity 0.2s ease-out;
}
.c-message--pending {
opacity: 0.5;
}
.c-message-event {
padding-top: 10px;
padding-left: 6px;
}
.c-message-event__inner {
display: flex;
align-items: center;
}
.c-message-event__icon {
margin-right: 8px;
position: relative;
top: 1px;
}
.c-message-notice {
padding: 12px;
}
.c-message-notice__inner {
text-align: center;
padding: 12px;
background-color: #42454a;
border-radius: 8px;
}
.c-chat {
display: grid;
grid-template-rows: 1fr 82px;
align-items: end;
flex: 1;
}
.c-chat__messages {
height: 100%;
overflow-y: scroll;
scrollbar-color: #202224 #2f3135;
display: grid;
align-items: end;
}
.c-chat__inner {
padding: 20px 20px 20px;
}
.c-chat-input {
width: 100%;
border-top: 2px solid #4b4e54;
background-color: #36393e;
}
.c-chat-input__textarea {
width: calc(100% - 40px);
height: 39.2px;
box-sizing: border-box;
margin: 20px;
padding: 8px;
font-family: inherit;
font-size: inherit;
background-color: #42454a;
color: #fff;
appearance: none;
-moz-appearance: none;
-webkit-appearance: none;
border: none;
border-radius: 8px;
resize: none;
}
.c-anchor {
overflow-anchor: auto;
height: 1px;
}

View file

@ -1,230 +0,0 @@
import {q, ElemJS, ejs} from "../static/basic.js?static=4212436742"
import {store} from "../static/store/store.js?static=ce3066287b"
import {SubscribeMapList} from "../static/store/SubscribeMapList.js?static=b2732c5460"
import {SubscribeValue} from "../static/store/SubscribeValue.js?static=215b6a5099"
import {Timeline} from "../static/Timeline.js?static=1393b78916"
import * as lsm from "../static/lsm.js?static=aed2c7ca35"
import {resolveMxc} from "../static/functions.js?static=e3784c70ce"
class ActiveGroupMarker extends ElemJS {
constructor() {
super(q("#c-group-marker"))
store.activeGroup.subscribe("changeSelf", this.render.bind(this))
}
render() {
if (store.activeGroup.exists()) {
const group = store.activeGroup.value()
this.style("opacity", 1)
this.style("transform", `translateY(${group.element.offsetTop}px)`)
} else {
this.style("opacity", 0)
}
}
}
const activeGroupMarker = new ActiveGroupMarker()
class Group extends ElemJS {
constructor(key, data) {
super("div")
this.data = data
this.order = this.data.order
this.class("c-group")
this.child(
(this.data.icon
? ejs("img").class("c-group__icon").attribute("src", this.data.icon)
: ejs("div").class("c-group__icon")
),
ejs("div").class("c-group__name").text(this.data.name)
)
this.on("click", this.onClick.bind(this))
store.activeGroup.subscribe("changeSelf", this.render.bind(this))
}
render() {
const active = store.activeGroup.value() === this
this.element.classList[active ? "add" : "remove"]("c-group--active")
}
onClick() {
store.activeGroup.set(this)
}
}
class Room extends ElemJS {
constructor(id, data) {
super("div")
this.id = id
this.data = data
this.timeline = new Timeline(this.id)
this.group = null
this.members = new SubscribeMapList(SubscribeValue)
this.class("c-room")
this.on("click", this.onClick.bind(this))
store.activeRoom.subscribe("changeSelf", this.render.bind(this))
this.render()
}
get order() {
if (this.group) {
let chars = 36
let total = 0
const name = this.getName()
for (let i = 0; i < name.length; i++) {
const c = name[i]
let d = 0
if (c >= "A" && c <= "Z") d = c.charCodeAt(0) - 65 + 10
else if (c >= "a" && c <= "z") d = c.charCodeAt(0) - 97 + 10
else if (c >= "0" && c <= "9") d = +c
total += d * chars ** (-i)
}
return total
} else {
return -this.timeline.latest
}
}
getName() {
let name = this.data.state.events.find(e => e.type === "m.room.name")
if (name) {
name = name.content.name
} else {
const users = this.data.summary["m.heroes"]
const usernames = users.map(u => (u.match(/^@([^:]+):/) || [])[1] || u)
name = usernames.join(", ")
}
return name
}
getIcon() {
const avatar = this.data.state.events.find(e => e.type === "m.room.avatar")
if (avatar) {
return resolveMxc(avatar.content.url || avatar.content.avatar_url, 32, "crop")
} else {
return null
}
}
isDirect() {
return store.directs.has(this.id)
}
setGroup(id) {
this.group = id
}
getGroup() {
if (this.group) {
return store.groups.get(this.group).value()
} else {
return this.isDirect() ? store.groups.get("directs").value() : store.groups.get("channels").value()
}
}
onClick() {
store.activeRoom.set(this)
}
render() {
this.clearChildren()
// data
const icon = this.getIcon()
if (icon) {
this.child(ejs("img").class("c-room__icon").attribute("src", icon))
} else {
this.child(ejs("div").class("c-room__icon", "c-room__icon--no-icon"))
}
this.child(ejs("div").class("c-room__name").text(this.getName()))
// active
const active = store.activeRoom.value() === this
this.element.classList[active ? "add" : "remove"]("c-room--active")
}
}
class Rooms extends ElemJS {
constructor() {
super(q("#c-rooms"))
this.roomData = []
this.rooms = []
store.rooms.subscribe("askAdd", this.askAdd.bind(this))
store.rooms.subscribe("addItem", this.addItem.bind(this))
// store.rooms.subscribe("changeItem", this.render.bind(this))
store.activeGroup.subscribe("changeSelf", this.render.bind(this))
store.directs.subscribe("changeItem", this.render.bind(this))
store.newEvents.subscribe("changeSelf", this.sort.bind(this))
this.render()
}
sort() {
store.rooms.sort()
this.render()
}
askAdd(event, {key, data}) {
const room = new Room(key, data)
store.rooms.addEnd(key, room)
}
addItem(event, key) {
const room = store.rooms.get(key).value()
if (room.getGroup() === store.activeGroup.value()) {
this.child(room)
}
}
render() {
this.clearChildren()
let first = null
// set room list
store.rooms.forEach((id, room) => {
if (room.value().getGroup() === store.activeGroup.value()) {
if (!first) first = room.value()
this.child(room.value())
}
})
// if needed, change the active room to be an item in the room list
if (!store.activeRoom.exists() || store.activeRoom.value().getGroup() !== store.activeGroup.value()) {
if (first) {
store.activeRoom.set(first)
} else {
store.activeRoom.delete()
}
}
}
}
const rooms = new Rooms()
class Groups extends ElemJS {
constructor() {
super(q("#c-groups-list"))
store.groups.subscribe("askAdd", this.askAdd.bind(this))
store.groups.subscribe("changeItem", this.render.bind(this))
}
askAdd(event, {key, data}) {
const group = new Group(key, data)
store.groups.addEnd(key, group)
store.groups.sort()
}
render() {
this.clearChildren()
store.groups.forEach((key, item) => {
this.child(item.value())
})
}
}
const groups = new Groups()

View file

@ -1,38 +0,0 @@
class Subscribable {
constructor() {
this.events = {
addSelf: [],
editSelf: [],
removeSelf: [],
changeSelf: []
}
this.eventDeps = {
addSelf: ["changeSelf"],
editSelf: ["changeSelf"],
removeSelf: ["changeSelf"],
changeSelf: []
}
}
subscribe(event, callback) {
if (this.events[event]) {
this.events[event].push(callback)
} else {
throw new Error(`Cannot subscribe to non-existent event ${event}, available events are: ${Object.keys(this.events).join(", ")}`)
}
}
unsubscribe(event, callback) {
const index = this.events[event].indexOf(callback)
if (index === -1) throw new Error(`Tried to remove a nonexisting subscription from event ${event}`)
this.events[event].splice(index, 1)
}
broadcast(event, data) {
this.eventDeps[event].concat(event).forEach(eventName => {
this.events[eventName].forEach(f => f(event, data))
})
}
}
export {Subscribable}

View file

@ -1,86 +0,0 @@
import {Subscribable} from "../../static/store/Subscribable.js?static=19b7e44aa6"
import {SubscribeValue} from "../../static/store/SubscribeValue.js?static=215b6a5099"
class SubscribeMapList extends Subscribable {
constructor(inner) {
super()
this.inner = inner
Object.assign(this.events, {
addItem: [],
deleteItem: [],
editItem: [],
changeItem: [],
askAdd: []
})
Object.assign(this.eventDeps, {
addItem: ["changeItem"],
deleteItem: ["changeItem"],
editItem: ["changeItem"],
changeItem: [],
askAdd: []
})
this.map = new Map()
this.list = []
}
has(key) {
return this.map.has(key) && this.map.get(key).exists()
}
get(key) {
if (this.map.has(key)) {
return this.map.get(key)
} else {
const item = new this.inner()
this.map.set(key, item)
return item
}
}
forEach(f) {
this.list.forEach(key => f(key, this.get(key)))
}
askAdd(key, data) {
this.broadcast("askAdd", {key, data})
}
addStart(key, value) {
this._add(key, value, true)
}
addEnd(key, value) {
this._add(key, value, false)
}
sort() {
this.list.sort((a, b) => {
const orderA = this.map.get(a).value().order
const orderB = this.map.get(b).value().order
return orderA - orderB
})
this.broadcast("changeItem")
}
_add(key, value, start) {
let s
if (this.map.has(key)) {
const exists = this.map.get(key).exists()
s = this.map.get(key).set(value)
if (exists) {
this.broadcast("editItem", key)
} else {
this.broadcast("addItem", key)
}
} else {
s = new this.inner().set(value)
this.map.set(key, s)
if (start) this.list.unshift(key)
else this.list.push(key)
this.broadcast("addItem", key)
}
return s
}
}
export {SubscribeMapList}

View file

@ -1,50 +0,0 @@
import {Subscribable} from "../../static/store/Subscribable.js?static=19b7e44aa6"
class SubscribeSet extends Subscribable {
constructor() {
super()
Object.assign(this.events, {
addItem: [],
deleteItem: [],
changeItem: [],
askAdd: []
})
Object.assign(this.eventDeps, {
addItem: ["changeItem"],
deleteItem: ["changeItem"],
changeItem: [],
askAdd: []
})
this.set = new Set()
}
has(key) {
return this.set.has(key)
}
forEach(f) {
for (const key of this.set.keys()) {
f(key)
}
}
askAdd(key) {
this.broadcast("askAdd", key)
}
add(key) {
if (!this.set.has(key)) {
this.set.add(key)
this.broadcast("addItem", key)
}
}
delete(key) {
if (this.set.has(key)) {
this.set.delete(key)
this.broadcast("deleteItem", key)
}
}
}
export {SubscribeSet}

View file

@ -1,47 +0,0 @@
import {Subscribable} from "../../static/store/Subscribable.js?static=19b7e44aa6"
class SubscribeValue extends Subscribable {
constructor() {
super()
this.hasData = false
this.data = null
}
exists() {
return this.hasData
}
value() {
if (this.hasData) return this.data
else return null
}
set(data) {
const exists = this.exists()
this.data = data
this.hasData = true
if (exists) {
this.broadcast("editSelf", this.data)
} else {
this.broadcast("addSelf", this.data)
}
return this
}
edit(f) {
if (this.exists()) {
f(this.data)
this.set(this.data)
} else {
throw new Error("Tried to edit a SubscribeValue that had no value")
}
}
delete() {
this.hasData = false
this.broadcast("removeSelf")
return this
}
}
export {SubscribeValue}

View file

@ -1,17 +0,0 @@
import {Subscribable} from "../../static/store/Subscribable.js?static=19b7e44aa6"
import {SubscribeMapList} from "../../static/store/SubscribeMapList.js?static=b2732c5460"
import {SubscribeSet} from "../../static/store/SubscribeSet.js?static=39a1c0a2a4"
import {SubscribeValue} from "../../static/store/SubscribeValue.js?static=215b6a5099"
const store = {
groups: new SubscribeMapList(SubscribeValue),
rooms: new SubscribeMapList(SubscribeValue),
directs: new SubscribeSet(),
activeGroup: new SubscribeValue(),
activeRoom: new SubscribeValue(),
newEvents: new Subscribable()
}
window.store = store
export {store}

View file

@ -1,127 +0,0 @@
import {store} from "../../static/store/store.js?static=ce3066287b"
import * as lsm from "../../static/lsm.js?static=aed2c7ca35"
import {resolveMxc} from "../../static/functions.js?static=e3784c70ce"
let lastBatch = null
function sync() {
const url = new URL(`${lsm.get("domain")}/_matrix/client/r0/sync`)
url.searchParams.append("access_token", lsm.get("access_token"))
const filter = {
room: {
// pulling more from the timeline massively increases download size
timeline: {
limit: 5
},
// members are not currently needed
state: {
lazy_load_members: true
}
},
presence: {
// presence is not implemented, ignore it
types: []
}
}
url.searchParams.append("filter", JSON.stringify(filter))
url.searchParams.append("timeout", 20000)
if (lastBatch) {
url.searchParams.append("since", lastBatch)
}
return fetch(url.toString()).then(res => res.json()).then(root => {
lastBatch = root.next_batch
return root
})
}
function manageSync(root) {
try {
let newEvents = false
// set up directs
const directs = root.account_data.events.find(e => e.type === "m.direct")
if (directs) {
Object.values(directs.content).forEach(ids => {
ids.forEach(id => store.directs.add(id))
})
}
// set up rooms
Object.entries(root.rooms.join).forEach(([id, room]) => {
if (!store.rooms.has(id)) {
store.rooms.askAdd(id, room)
}
const storeRoom = store.rooms.get(id).value()
room.state.events.forEach(event => {
if (event.type === "m.room.member") {
storeRoom.members.get(event.state_key).set(event)
}
})
const timeline = storeRoom.timeline
if (room.timeline.events.length) newEvents = true
timeline.updateEvents(room.timeline.events)
})
// set up groups
Promise.all(
Object.keys(root.groups.join).map(id => {
if (!store.groups.has(id)) {
return Promise.all(["profile", "rooms"].map(path => {
const url = new URL(`${lsm.get("domain")}/_matrix/client/r0/groups/${id}/${path}`)
url.searchParams.append("access_token", lsm.get("access_token"))
return fetch(url.toString()).then(res => res.json())
})).then(([profile, rooms]) => {
rooms = rooms.chunk
let order = 999
let orderEvent = root.account_data.events.find(e => e.type === "im.vector.web.tag_ordering")
if (orderEvent) {
if (orderEvent.content.tags.includes(id)) {
order = orderEvent.content.tags.indexOf(id)
}
}
const data = {
name: profile.name,
icon: resolveMxc(profile.avatar_url, 96, "crop"),
order
}
store.groups.askAdd(id, data)
rooms.forEach(groupRoom => {
if (store.rooms.has(groupRoom.room_id)) {
store.rooms.get(groupRoom.room_id).value().setGroup(id)
}
})
})
}
})
).then(() => {
store.rooms.sort()
})
if (newEvents) store.newEvents.broadcast("changeSelf")
} catch (e) {
console.error(root)
throw e
}
}
function syncLoop() {
return sync().then(manageSync).then(syncLoop)
}
;[
{
id: "directs",
name: "Directs",
icon: staticFiles.get("/assets/icons/directs.svg"),
order: -2
},
{
id: "channels",
name: "Channels",
icon: staticFiles.get("/assets/icons/channels.svg"),
order: -1
}
].forEach(data => store.groups.askAdd(data.id, data))
store.activeGroup.set(store.groups.get("directs").value())
syncLoop()

Binary file not shown.

Binary file not shown.