diff --git a/src/js/events/image.js b/src/js/events/image.js index 2c8a7d3..6d8d771 100644 --- a/src/js/events/image.js +++ b/src/js/events/image.js @@ -16,23 +16,7 @@ class Image extends GroupableEvent { image.attribute("width", info.w) image.attribute("height", info.h) } - const wrapper = ejs("div").class("c-media__wrapper").child( - image - ) - if (this.data.content.body && this.data.content.body.startsWith("SPOILER")) { - wrapper.attribute("tabindex", 0) - wrapper.class("c-media--spoiler") - const wall = ejs("div").class("c-media__spoiler").text("Spoiler") - wrapper.child(wall) - function toggle() { - wrapper.element.classList.toggle("c-media--shown") - } - wrapper.on("click", toggle) - wrapper.on("keydown", event => { - if (event.key === "Enter") toggle() - }) - } - this.child(wrapper) + this.child(image) super.render() } diff --git a/src/js/events/membership.js b/src/js/events/membership.js index 5617d3e..0f10b04 100644 --- a/src/js/events/membership.js +++ b/src/js/events/membership.js @@ -96,24 +96,6 @@ class LeaveEvent extends MembershipEvent { } } -class BanEvent extends MembershipEvent { - static canRender(eventData) { - return super.canRender(eventData) && eventData.content.membership === "ban" - } - - render() { - let message = - ` left (banned by ${this.data.sender}` - + (this.data.content.reason ? `, reason: ${this.data.content.reason}` : "") - + ")" - this.renderInner("static/leave-event.svg", [ - this.smallAvatar, - this.senderName, - message - ]) - } -} - class UnknownMembership extends MembershipEvent { render() { this.renderInner("", [ @@ -124,4 +106,4 @@ class UnknownMembership extends MembershipEvent { } } -module.exports = [JoinedEvent, InvitedEvent, LeaveEvent, BanEvent, UnknownMembership] +module.exports = [JoinedEvent, InvitedEvent, LeaveEvent, UnknownMembership] diff --git a/src/js/events/message.js b/src/js/events/message.js index ad885ff..50cd3b5 100644 --- a/src/js/events/message.js +++ b/src/js/events/message.js @@ -85,18 +85,6 @@ function postProcessElements(element) { if (color) n.style.color = color if (bgColor) n.style.backgroundColor = bgColor }) - - element.querySelectorAll("[data-mx-spoiler]").forEach(spoiler => { - spoiler.classList.add("mx-spoiler") - spoiler.setAttribute("tabindex", 0) - function toggle() { - spoiler.classList.toggle("mx-spoiler--shown") - } - spoiler.addEventListener("click", toggle) - spoiler.addEventListener("keydown", event => { - if (event.key === "Enter") toggle() - }) - }) } diff --git a/src/js/sync/sync.js b/src/js/sync/sync.js index b445253..90c92b9 100644 --- a/src/js/sync/sync.js +++ b/src/js/sync/sync.js @@ -11,7 +11,7 @@ function sync() { room: { // pulling more from the timeline massively increases download size timeline: { - limit: 1 + limit: 5 }, // members are not currently needed state: { diff --git a/src/sass/base.sass b/src/sass/base.sass index dfb9f7a..a649cce 100644 --- a/src/sass/base.sass +++ b/src/sass/base.sass @@ -52,7 +52,7 @@ select:-moz-focusring text-shadow: 0 0 0 #ddd body.show-focus - a, select, button, input, video, div, span + a, select, button, input, video outline-color: #fff &:focus diff --git a/src/sass/components/chat-banner.sass b/src/sass/components/chat-banner.sass index f17acce..ba7a94d 100644 --- a/src/sass/components/chat-banner.sass +++ b/src/sass/components/chat-banner.sass @@ -9,12 +9,9 @@ margin-right: 12px outline-color: #000 opacity: 0 - transform: translateY(-40px) - transition: transform 0.2s ease, opacity 0.2s ease-out &--active opacity: 1 - transform: translateY(0px) &__inner display: grid diff --git a/src/sass/components/messages.sass b/src/sass/components/messages.sass index 060dec4..4b61003 100644 --- a/src/sass/components/messages.sass +++ b/src/sass/components/messages.sass @@ -58,7 +58,6 @@ // fix whitespace font-size: 0 margin-top: 8px - display: flex &--pending opacity: 0.5 @@ -150,37 +149,3 @@ padding: 12px background-color: c.$milder border-radius: 8px - -.c-media - &__wrapper - overflow: hidden - position: relative - - &--spoiler - cursor: pointer - - img - filter: blur(40px) - - &--shown img - filter: none - - &__spoiler - position: absolute - top: 0 - bottom: 0 - left: 0 - right: 0 - display: flex - align-items: center - justify-content: center - font-size: 18px - font-weight: 500 - color: #fff - text-transform: uppercase - background: rgba(0, 0, 0, 0.3) - cursor: pointer - pointer-events: none - - &--shown &__spoiler - display: none diff --git a/src/sass/components/read-marker.sass b/src/sass/components/read-marker.sass index 7e1c572..7e45910 100644 --- a/src/sass/components/read-marker.sass +++ b/src/sass/components/read-marker.sass @@ -18,9 +18,6 @@ @at-root .c-message:last-child & top: 11px - @at-root .c-message-event & - top: 7px - &__text position: absolute right: -14px diff --git a/src/sass/components/spoilers.sass b/src/sass/components/spoilers.sass deleted file mode 100644 index e8a1784..0000000 --- a/src/sass/components/spoilers.sass +++ /dev/null @@ -1,8 +0,0 @@ -.mx-spoiler - color: #331911 - background-color: #331911 - outline-color: #fff !important - cursor: pointer - - &--shown - color: inherit diff --git a/src/sass/main.sass b/src/sass/main.sass index c050148..7134edf 100644 --- a/src/sass/main.sass +++ b/src/sass/main.sass @@ -10,4 +10,3 @@ @use "./components/highlighted-code" @use "./components/read-marker" @use "./components/chat-banner" -@use "./components/spoilers"