Drift/delete-your-element
1
1
Fork 0
Code Issues 1 Pull Requests Releases Activity

Upload web code

Browse Source
This commit is contained in:
Cadence Ember
2024-09-22 15:42:15 +12:00
parent 1d2daf2504
commit b6c23c30fb
22 changed files with 765 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/web/pug/guild.pug
+159
View File
@@ -0,0 +1,159 @@
extends includes/template.pug
mixin badge-readonly
.s-badge.s-badge__xs.s-badge__icon.s-badge__muted
!= icons.Icons.IconEyeSm
| Read-only
mixin badge-private
.s-badge.s-badge__xs.s-badge__icon.s-badge__warning
!= icons.Icons.IconLockSm
| Private
mixin discord(channel, radio=false)
- let permissions = dUtils.getPermissions([], discord.guilds.get(channel.guild_id).roles, "", channel.permission_overwrites)
.s-user-card.s-user-card__small
if !dUtils.hasPermission(permissions, DiscordTypes.PermissionFlagsBits.ViewChannel)
!= icons.Icons.IconLock
else if channel.type === 5
!= icons.Icons.IconBullhorn
else if channel.type === 2
!= icons.Icons.IconPhone
else if channel.type === 11 || channel.type === 12
!= icons.Icons.IconCollection
else
include includes/hash.svg
.s-user-card--info.ws-nowrap
if radio
= channel.name
else
.s-user-card--link.fs-body1
a(href=`https://discord.com/channels/${channel.guild_id}/${channel.id}`)= channel.name
if channel.parent_id
.s-user-card--location= discord.channels.get(channel.parent_id).name
if !dUtils.hasPermission(permissions, DiscordTypes.PermissionFlagsBits.ViewChannel)
+badge-private
else if !dUtils.hasPermission(permissions, DiscordTypes.PermissionFlagsBits.SendMessages)
+badge-readonly
mixin matrix(row, radio=false, badge="")
.s-user-card.s-user-card__small
!= icons.Icons.IconMessage
.s-user-card--info.ws-nowrap
if radio
= row.nick || row.name
else
.s-user-card--link.fs-body1
a(href=`https://matrix.to/#/${row.room_id}`)= row.nick || row.name
block body
if !guild_id && session.data.managedGuilds
.s-empty-state.wmx4.p48
!= icons.Spots.SpotEmptyXL
p Select a server from the top right corner to continue.
p If the server you're looking for isn't there, try #[a(href="/oauth?action=add") logging in again.]
else if !session.data.managedGuilds
.s-empty-state.wmx4.p48
!= icons.Spots.SpotEmptyXL
p You need to log in to manage your servers.
a.s-btn.s-btn__icon.s-btn__filled(href="/oauth")
!= icons.Icons.IconDiscord
= ` Log in with Discord`
else if !discord.guilds.has(guild_id) || !session.data.managedGuilds || !session.data.managedGuilds.includes(guild_id)
.s-empty-state.wmx4.p48
!= icons.Spots.SpotAlertXL
p Either the selected server doesn't exist, or you don't have the Manage Server permission on Discord.
p If you've checked your permissions, try #[a(href="/oauth") logging in again.]
else
- let guild = discord.guilds.get(guild_id)
.s-page-title.mb24
h1.s-page-title--header= guild.name
.d-flex.g16
.fl-grow1
h2.fs-headline1 Invite a Matrix user
form.d-grid.g-af-column.gy4.gx8.jc-start(method="post" action="/api/invite" style="grid-template-rows: repeat(2, auto)")
label.s-label(for="mxid") Matrix ID
input.fl-grow1.s-input.wmx3#mxid(name="mxid" required placeholder="@user:example.org")
label.s-label(for="permissions") Permissions
.s-select
select#permissions(name="permissions")
option(value="default") Default
option(value="moderator") Moderator
input(type="hidden" name="guild_id" value=guild_id)
.grid--row-start2
button.s-btn.s-btn__filled.htmx-indicator Invite
div
-
let size = 105
let src = new URL(`https://api.qrserver.com/v1/create-qr-code/?qzone=1&format=svg&size=${size}x${size}`)
src.searchParams.set("data", `https://bridge.cadence.moe/invite?nonce=${nonce}`)
img(width=size height=size src=src.toString())
h2.mt48.fs-headline1 Linked channels
-
function getPosition(channel) {
let position = 0
let looking = channel
while (looking.parent_id) {
looking = discord.channels.get(looking.parent_id)
position = looking.position * 1000
}
if (channel.position) position += channel.position
return position
}
let channelIDs = discord.guildChannelMap.get(guild_id)
let linkedChannels = select("channel_room", ["channel_id", "room_id", "name", "nick"], {channel_id: channelIDs}).all()
let linkedChannelsWithDetails = linkedChannels.map(c => ({channel: discord.channels.get(c.channel_id), ...c})).filter(c => c.channel)
let linkedChannelIDs = linkedChannelsWithDetails.map(c => c.channel_id)
linkedChannelsWithDetails.sort((a, b) => getPosition(a.channel) - getPosition(b.channel))
let unlinkedChannelIDs = channelIDs.filter(c => !linkedChannelIDs.includes(c))
let unlinkedChannels = unlinkedChannelIDs.map(c => discord.channels.get(c)).filter(c => [0, 5].includes(c.type))
unlinkedChannels.sort((a, b) => getPosition(a) - getPosition(b))
.s-card.bs-sm.p0
.s-table-container
table.s-table.s-table__bx-simple
each row in linkedChannelsWithDetails
tr
td.w40: +discord(row.channel)
td.p2: button.s-btn.s-btn__muted.s-btn__xs!= icons.Icons.IconLinkSm
td: +matrix(row)
else
tr
td(colspan="3")
.s-empty-state No channels linked between Discord and Matrix yet...
h3.mt32.fs-category Auto-create
.s-card
form.d-flex.ai-center.g8
label.s-label.fl-grow1(for="autocreate")
| Create new Matrix rooms automatically
p.s-description If you want, OOYE can automatically create new Matrix rooms and link them when a new Discord channel is spoken in.
- let value = select("guild_space", "autocreate", {guild_id}).pluck().get()
input(type="hidden" name="guild_id" value=guild_id)
input.s-toggle-switch.order-last#autocreate(name="autocreate" type="checkbox" hx-post="/api/autocreate" hx-indicator="#autocreate-loading" hx-disabled-elt="this" checked=value)
.is-loading#autocreate-loading
h3.mt32.fs-category Manually link channels
form.d-flex.g16.ai-start(method="post" action="/api/link")
.fl-grow2.s-btn-group.fd-column.w40
each channel in unlinkedChannels
input.s-btn--radio(type="radio" name="discord" id=channel.id value=channel.id)
label.s-btn.s-btn__muted.ta-left.truncate(for=channel.id)
+discord(channel, true, "Announcement")
else
.s-empty-state.p8 All Discord channels are linked.
.fl-grow1.s-btn-group.fd-column.w30
.s-empty-state.p8 I don't know how to get the Matrix room list yet...
div
button.s-btn.s-btn__icon.s-btn__filled
!= icons.Icons.IconLink
= ` Connect`
src/web/pug/home.pug
+24
View File
@@ -0,0 +1,24 @@
extends includes/template.pug
block body
.s-page-title.mb24
h1.s-page-title--header Bridge a Discord server
.d-grid.grid__2.g24
.s-card.bs-md.d-flex.fd-column
h2 Easy mode
p Add the bot to your Discord server.
p It will automatically create new Matrix rooms for you.
.fl-grow1
a.s-btn.s-btn__filled.s-btn__icon(href="/oauth?action=add")
!= icons.Icons.IconPlus
= ` Add to server`
.s-card.bs-md.d-flex.fd-column
h2 Self-service
p OOYE will link an existing Discord server and Matrix space together.
p Choose this option if you already have a community set up on Matrix.
p Or, choose this if you're migrating from a different bridge.
.fl-grow1
a.s-btn.s-btn__outlined.s-btn__icon(href="/oauth?action=add-self-service")
!= icons.Icons.IconUnorderedList
= ` Set up self-service`
src/web/pug/includes/hash.svg
+46
View File
@@ -0,0 +1,46 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
aria-hidden="true"
class="svg-icon iconItalic"
width="18"
height="18"
viewBox="0 0 18 18"
version="1.1"
id="svg1"
sodipodi:docname="hash.svg"
inkscape:version="1.3.2 (091e20ef0f, 2023-11-25)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs1" />
<path
style="opacity:1;stroke-width:24.2222;stroke-linecap:square;paint-order:stroke fill markers"
d="m 13.949463,2.0417087 c 0,0 0.664304,0.00704 0.854464,0.00134 0.19016,-0.0057 0.924873,0.2384962 0.57664,0.9863413 -0.288846,0.6203095 -5.045042,11.035358 -5.4783833,11.984378 -0.4333415,0.949021 -0.7881247,0.945761 -1.3553087,0.945761 -0.567184,0 -0.3175392,0 -0.734375,0 -0.4168358,0 -0.7985231,-0.467356 -0.5770328,-0.951217 C 7.4569576,14.524452 12.479729,3.5512928 12.725807,3.0070042 13.022379,2.3510304 13.336114,2.0361844 13.949463,2.0417087 Z"
id="path4"
sodipodi:nodetypes="czszzzzsc" />
<rect
style="opacity:1;stroke-width:27.7591;stroke-linecap:square;paint-order:stroke fill markers"
id="rect4"
width="11.987322"
height="2"
x="2.002677"
y="11.007812"
rx="1"
ry="1" />
<rect
style="opacity:1;stroke-width:27.7591;stroke-linecap:square;paint-order:stroke fill markers"
id="rect5"
width="11.987322"
height="2"
x="4.0100012"
y="5.007813"
rx="1"
ry="1" />
<path
style="opacity:1;stroke-width:24.2222;stroke-linecap:square;paint-order:stroke fill markers"
d="m 9.1764922,2.0417087 c 0,0 0.664304,0.00704 0.8544638,0.00134 0.19016,-0.0057 0.924873,0.2384962 0.57664,0.9863413 -0.288846,0.6203095 -5.0450418,11.035358 -5.4783831,11.984378 -0.4333415,0.949021 -0.7881247,0.945761 -1.3553087,0.945761 -0.567184,0 -0.3175392,0 -0.734375,0 -0.4168358,0 -0.7985231,-0.467356 -0.5770328,-0.951217 C 2.6839868,14.524452 7.7067582,3.5512928 7.9528362,3.0070042 8.2494082,2.3510304 8.5631432,2.0361844 9.1764922,2.0417087 Z"
id="path1"
sodipodi:nodetypes="czszzzzsc" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.2 KiB

src/web/pug/includes/template.pug
+66
View File
@@ -0,0 +1,66 @@
mixin guild(guild)
span.s-avatar.s-avatar__32.s-user-card--avatar
if guild.icon
img.s-avatar--image(src=`https://cdn.discordapp.com/icons/${guild.id}/${guild.icon}.png?size=32`)
else
.s-avatar--letter.bg-silver-400.bar-md(aria-hidden="true")= guild.name[0]
.s-user-card--info.ai-start
strong= guild.name
ul.s-user-card--awards
li #{discord.guildChannelMap.get(guild.id).filter(c => [0, 5, 15, 16].includes(discord.channels.get(c).type)).length} channels
doctype html
html(lang="en")
head
title Out Of Your Element
link(rel="stylesheet" type="text/css" href="/static/stacks.min.css")
<link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 80%22><text y=%22.83em%22 font-size=%2283%22>💬</text></svg>">
meta(name="htmx-config" content='{"indicatorClass":"is-loading"}')
style.
.themed {
--theme-base-primary-color-h: 266;
--theme-base-primary-color-s: 53%;
--theme-base-primary-color-l: 63%;
--theme-dark-primary-color-h: 266;
--theme-dark-primary-color-s: 53%;
--theme-dark-primary-color-l: 63%;
}
body.themed.theme-system
header.s-topbar
.s-topbar--skip-link(href="#content") Skip to main content
.s-topbar--container.wmx9
a.s-topbar--logo(href="/")
img.s-avatar.s-avatar__32(src="/icon.png")
nav.s-topbar--navigation
ul.s-topbar--content
li.ps-relative
if !session.data.managedGuilds || session.data.managedGuilds.length === 0
a.s-btn.s-btn__icon.as-center(href="/oauth")
!= icons.Icons.IconDiscord
= ` Log in`
else if guild_id && session.data.managedGuilds.includes(guild_id) && discord.guilds.has(guild_id)
button.s-topbar--item.s-btn.s-btn__muted.s-user-card(popovertarget="guilds")
+guild(discord.guilds.get(guild_id))
else if session.data.managedGuilds
button.s-topbar--item.s-btn.s-btn__muted.s-btn__dropdown.pr24.s-user-card.s-label(popovertarget="guilds")
| Your servers
#guilds(popover data-popper-placement="bottom" style="display: revert; width: revert;").s-popover.overflow-visible
.s-popover--arrow.s-popover--arrow__tc
.s-popover--content.overflow-y-auto.overflow-x-hidden
ul.s-menu(role="menu")
each guild in (session.data.managedGuilds || []).map(id => discord.guilds.get(id)).filter(g => g)
li(role="menuitem")
a.s-topbar--item.s-user-card.d-flex.p4(href=`/guild?guild_id=${guild.id}`)
+guild(guild)
.mx-auto.w100.wmx9.py24#content
block body
script.
document.querySelectorAll("[popovertarget]").forEach(e => {
e.addEventListener("click", () => {
const rect = e.getBoundingClientRect()
const t = `:popover-open { position: absolute; top: ${Math.floor(rect.bottom)}px; left: ${Math.floor(rect.left + rect.width / 2)}px; width: ${Math.floor(rect.width)}px; transform: translateX(-50%); box-sizing: content-box; margin: 0 }`
// console.log(t)
document.styleSheets[0].insertRule(t)
})
})
script(src="/static/htmx.min.js")
src/web/pug/invite.pug
+32
View File
@@ -0,0 +1,32 @@
extends includes/template.pug
block body
if !isValid
.s-empty-state.wmx4.p48
!= icons.Spots.SpotAlertXL
p This QR code has expired.
p Refresh the guild management page to generate a new one.
else
- let guild = discord.guilds.get(guild_id)
.s-page-title.mb24
h1.s-page-title--header= guild.name
.d-flex.g16
.fl-grow1
h2.fs-headline1 Invite a Matrix user
form.d-flex.gy16.fd-column(method="post" action="/api/invite" style="grid-template-rows: repeat(2, auto)")
.d-flex.gy4.fd-column
label.s-label(for="mxid") Matrix ID
input.fl-grow1.s-input.wmx3#mxid(name="mxid" required placeholder="@user:example.org")
.d-flex.gy4.fd-column
label.s-label(for="permissions") Permissions
.s-select
select#permissions(name="permissions")
option(value="default") Default
option(value="moderator") Moderator
input(type="hidden" name="nonce" value=nonce)
div
button.s-btn.s-btn__filled.htmx-indicator Invite
src/web/pug/ok.pug
+6
View File
@@ -0,0 +1,6 @@
extends includes/template.pug
block body
.ta-center.wmx5.p48.mx-auto
!= icons.Spots.SpotApproveXL
p.mt24.fs-body2= msg