move all colors to :root, add activity small image and hover text, add support for streaming indicator, #2
This commit is contained in:
parent
d91e832eab
commit
66744ddd10
5 changed files with 205 additions and 67 deletions
|
@ -31,10 +31,18 @@ async function handler(request: ExtendedRequest): Promise<Response> {
|
|||
const presence: LanyardData = data.data;
|
||||
const readme: string | Promise<string> | null = await handleReadMe(presence);
|
||||
|
||||
let status: string;
|
||||
if (presence.activities.some((activity) => activity.type === 1)) {
|
||||
status = "streaming";
|
||||
} else {
|
||||
status = presence.discord_status;
|
||||
}
|
||||
|
||||
const ejsTemplateData: EjsTemplateData = {
|
||||
title: `${presence.discord_user.username || "Unknown"}`,
|
||||
username: presence.discord_user.username,
|
||||
status: presence.discord_status,
|
||||
title: presence.discord_user.global_name || presence.discord_user.username,
|
||||
username:
|
||||
presence.discord_user.global_name || presence.discord_user.username,
|
||||
status: status,
|
||||
activities: presence.activities,
|
||||
user: presence.discord_user,
|
||||
platform: {
|
||||
|
|
|
@ -30,11 +30,18 @@ async function handler(): Promise<Response> {
|
|||
const presence: LanyardData = data.data;
|
||||
const readme: string | Promise<string> | null = await handleReadMe(presence);
|
||||
|
||||
let status: string;
|
||||
if (presence.activities.some((activity) => activity.type === 1)) {
|
||||
status = "streaming";
|
||||
} else {
|
||||
status = presence.discord_status;
|
||||
}
|
||||
|
||||
const ejsTemplateData: EjsTemplateData = {
|
||||
title: presence.discord_user.global_name || presence.discord_user.username,
|
||||
username:
|
||||
presence.discord_user.global_name || presence.discord_user.username,
|
||||
status: presence.discord_status,
|
||||
status: status,
|
||||
activities: presence.activities,
|
||||
user: presence.discord_user,
|
||||
platform: {
|
||||
|
|
|
@ -76,20 +76,32 @@
|
|||
const total = (start && end) ? end - start : null;
|
||||
const progress = (total && elapsed > 0) ? Math.min(100, Math.floor((elapsed / total) * 100)) : null;
|
||||
|
||||
const img = activity.assets?.large_image;
|
||||
let art = null;
|
||||
let smallArt = null;
|
||||
|
||||
if (img?.startsWith("mp:external/")) {
|
||||
art = `https://media.discordapp.net/external/${img.slice("mp:external/".length)}`;
|
||||
} else if (img?.includes("/https/")) {
|
||||
const clean = img.split("/https/")[1];
|
||||
if (clean) art = `https://${clean}`;
|
||||
} else if (img?.startsWith("spotify:")) {
|
||||
art = `https://i.scdn.co/image/${img.split(":")[1]}`;
|
||||
} else if (img) {
|
||||
art = `https://cdn.discordapp.com/app-assets/${activity.application_id}/${img}.png`;
|
||||
function resolveActivityImage(img, applicationId) {
|
||||
if (!img) return null;
|
||||
|
||||
if (img.startsWith("mp:external/")) {
|
||||
return `https://media.discordapp.net/external/${img.slice("mp:external/".length)}`;
|
||||
}
|
||||
|
||||
if (img.includes("/https/")) {
|
||||
const clean = img.split("/https/")[1];
|
||||
return clean ? `https://${clean}` : null;
|
||||
}
|
||||
|
||||
if (img.startsWith("spotify:")) {
|
||||
return `https://i.scdn.co/image/${img.split(":")[1]}`;
|
||||
}
|
||||
|
||||
return `https://cdn.discordapp.com/app-assets/${applicationId}/${img}.png`;
|
||||
}
|
||||
|
||||
if (activity.assets) {
|
||||
art = resolveActivityImage(activity.assets.large_image, activity.application_id);
|
||||
smallArt = resolveActivityImage(activity.assets.small_image, activity.application_id);
|
||||
}
|
||||
|
||||
const activityTypeMap = {
|
||||
0: "Playing",
|
||||
|
@ -124,7 +136,12 @@
|
|||
|
||||
<div class="activity-wrapper-inner">
|
||||
<% if (art) { %>
|
||||
<img class="activity-art" src="<%= art %>" alt="Art">
|
||||
<div class="activity-image-wrapper">
|
||||
<img class="activity-image" src="<%= art %>" alt="Art" <% activity.assets?.large_text ? `title="${activity.assets.large_text}"` : '' %>>
|
||||
<% if (smallArt) { %>
|
||||
<img class="activity-image-small" src="<%= smallArt %>" alt="Small Art" <% activity.assets?.small_text ? `title="${activity.assets.small_text}"` : '' %>>
|
||||
<% } %>
|
||||
</div>
|
||||
<% } %>
|
||||
|
||||
<div class="activity-content">
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue