diff options
| author | Arjun Satarkar <me@arjunsatarkar.net> | 2024-07-27 15:34:28 +0000 |
|---|---|---|
| committer | Arjun Satarkar <me@arjunsatarkar.net> | 2024-07-27 15:34:28 +0000 |
| commit | 407862a4e0e10ce2a035e4e5e76e26dde849aac1 (patch) | |
| tree | db8fe1c95672d31621c6bd5fe545cab5497f18df /priv/discord_activity.html.eex | |
| parent | cd794243a5bba358d995e26ba024268e7d5d3f85 (diff) | |
| download | mediasync-407862a4e0e10ce2a035e4e5e76e26dde849aac1.tar mediasync-407862a4e0e10ce2a035e4e5e76e26dde849aac1.tar.gz mediasync-407862a4e0e10ce2a035e4e5e76e26dde849aac1.zip | |
Finish Discord activity implementation
Diffstat (limited to 'priv/discord_activity.html.eex')
| -rw-r--r-- | priv/discord_activity.html.eex | 44 |
1 files changed, 39 insertions, 5 deletions
diff --git a/priv/discord_activity.html.eex b/priv/discord_activity.html.eex index 83bda0d..5278400 100644 --- a/priv/discord_activity.html.eex +++ b/priv/discord_activity.html.eex @@ -1,3 +1,4 @@ +<% home_url = "/.proxy/?#{Mediasync.Constants.query_param_discord_activity_inner()}" %> <!DOCTYPE html> <html lang="en"> <head> @@ -6,25 +7,58 @@ <meta name="robots" content="noindex, nofollow"> <title>discord activity | mediasync</title> <style> + :root { + --instance-room-info-height: 20svh; + --instance-room-info-remainder: calc(100svh - var(--instance-room-info-height)); + } + body { overflow: hidden; + background-color: black; + color: white; + font-family: monospace; } iframe { border: none; } html, body, iframe { margin: 0; - width: 100%; - height: 100%; + width: 100svw; + height: 100svh; + } + + iframe.at-home { + height: var(--instance-room-info-remainder); + } + + div#instance-room-info { + display: none; + overflow: auto; + } + + body:has(> iframe.at-home) > div#instance-room-info { + display: block; + height: var(--instance-room-info-height); + border-bottom: 1px solid white; } </style> </head> -<body> - <iframe src="/.proxy/?<%= Mediasync.Constants.query_param_discord_activity_inner() %>"></iframe> +<body data-csrf-token="<%= Plug.CSRFProtection.get_csrf_token() %>"> + <div id="instance-room-info"> + <span style="font-weight: bold;">currently hosting:</span> + <div id="instance-room-info-content"></div> + </div> + </div> + <iframe src="<%= home_url %>" style="display: none;" class="at-home" name="activity-inner-iframe"></iframe> <script> const DISCORD_CLIENT_ID = "<%= Application.fetch_env!(:mediasync, :discord_client_id) %>"; + const ACCESS_TOKEN_URL = "/.proxy/discord_activity/access_token?<%= Mediasync.Constants.query_param_discord_activity_inner() %>"; + const HOME_URL = "<%= home_url %>"; + const roomUrl = (roomId) => { + return `/.proxy/room/${roomId}?<%= Mediasync.Constants.query_param_discord_activity_inner() %>`; + }; </script> <script src="/static/discord-embedded-app-sdk/Discord.js" type="module"></script> - <script src="/static/discord_activity.js" type="module"></script> + <script src="/static/discordActivity.js" type="module"></script> </body> </html> |