mirror of
https://github.com/DorkSquadRR/DorkNet.git
synced 2026-10-25 23:18:44 -07:00
Import december-2020-12-18 from private repo (scrubbed 2026-05-27)
Targets Rec Room 2020.12.18 client.
Re-import after adding:
- DorkNet.ClientMod/dorknet-clientmod.json.template — config schema
the launcher's manifest-driven patcher renders into UserData/.
- tools/build-patcher-zip.ps1 — produces the dorknet-clientpatch-{key}.zip
Release asset the launcher fetches.
- .github/workflows/release.yml — auto-publishes both Release assets
on v1-december-* tag push.
Scrubbed via maintainer-side scrub-for-public.ps1: same drop rules as
the prior import, plus build-patcher-zip.ps1 added to the tools/
allow-list so it survives the scrub.
This commit is contained in:
Alexa
@@ -0,0 +1,244 @@
|
||||
// DorkNet feed — public photo gallery. Reads from same-origin
|
||||
// /api/photos/v1/* (PhotosController is dual-hosted on api.rec.net and
|
||||
// feed.rec.net so no CORS dance). Hash routing keeps it a single page:
|
||||
// #/ → feed grid
|
||||
// #/p/123 → photo detail
|
||||
// #/u/456 → uploader profile
|
||||
|
||||
const API = '/api/photos/v1';
|
||||
|
||||
const $ = (id) => document.getElementById(id);
|
||||
const el = (tag, attrs, ...children) => {
|
||||
const e = document.createElement(tag);
|
||||
for (const k in attrs) {
|
||||
if (k === 'class') e.className = attrs[k];
|
||||
else if (k === 'on') for (const ev in attrs.on) e.addEventListener(ev, attrs.on[ev]);
|
||||
else if (k === 'html') e.innerHTML = attrs[k];
|
||||
else if (k === 'hidden' && attrs[k]) e.hidden = true;
|
||||
else e[k] = attrs[k];
|
||||
}
|
||||
for (const c of children.flat()) if (c != null) e.append(c?.nodeType ? c : document.createTextNode(String(c)));
|
||||
return e;
|
||||
};
|
||||
|
||||
async function api(path) {
|
||||
const res = await fetch(API + path);
|
||||
if (!res.ok) throw new Error(`${res.status} ${res.statusText}`);
|
||||
return res.json();
|
||||
}
|
||||
|
||||
function toast(msg, kind = '') {
|
||||
const t = $('toast');
|
||||
t.textContent = msg;
|
||||
t.className = 'toast ' + kind;
|
||||
t.hidden = false;
|
||||
clearTimeout(toast._h);
|
||||
toast._h = setTimeout(() => t.hidden = true, 3000);
|
||||
}
|
||||
|
||||
function fmtDate(iso) {
|
||||
if (!iso) return '';
|
||||
const d = new Date(iso);
|
||||
if (isNaN(d)) return '';
|
||||
const now = new Date();
|
||||
const diff = (now - d) / 1000;
|
||||
if (diff < 60) return 'just now';
|
||||
if (diff < 3600) return `${Math.floor(diff / 60)}m ago`;
|
||||
if (diff < 86400) return `${Math.floor(diff / 3600)}h ago`;
|
||||
if (diff < 604800) return `${Math.floor(diff / 86400)}d ago`;
|
||||
return d.toLocaleDateString();
|
||||
}
|
||||
|
||||
function initials(name) {
|
||||
if (!name) return '?';
|
||||
const parts = name.split(/[\s_]/).filter(Boolean);
|
||||
return (parts[0]?.[0] || '') + (parts[1]?.[0] || '');
|
||||
}
|
||||
|
||||
function showView(name) {
|
||||
document.querySelectorAll('.view').forEach(v => v.hidden = v.id !== `${name}-view`);
|
||||
document.querySelectorAll('.nav-link').forEach(l => l.classList.toggle('active', l.dataset.route === 'feed' && name === 'feed'));
|
||||
window.scrollTo(0, 0);
|
||||
}
|
||||
|
||||
// ── Router ───────────────────────────────────────────────────────────
|
||||
|
||||
window.addEventListener('hashchange', route);
|
||||
window.addEventListener('DOMContentLoaded', route);
|
||||
|
||||
function goFeed() { location.hash = '#/'; }
|
||||
|
||||
function route() {
|
||||
const h = location.hash.slice(1) || '/';
|
||||
const photoMatch = h.match(/^\/p\/(\d+)$/);
|
||||
const userMatch = h.match(/^\/u\/(\d+)$/);
|
||||
if (photoMatch) renderPhoto(parseInt(photoMatch[1], 10));
|
||||
else if (userMatch) renderProfile(parseInt(userMatch[1], 10));
|
||||
else renderFeed();
|
||||
}
|
||||
|
||||
// ── Feed view ────────────────────────────────────────────────────────
|
||||
|
||||
let feedSkip = 0;
|
||||
const PAGE = 24;
|
||||
|
||||
async function renderFeed() {
|
||||
showView('feed');
|
||||
feedSkip = 0;
|
||||
$('grid').replaceChildren(...skeletonCards(6));
|
||||
$('empty').hidden = true;
|
||||
$('loadMore').hidden = true;
|
||||
try {
|
||||
const photos = await api(`/feed?take=${PAGE}&skip=0`);
|
||||
$('grid').replaceChildren();
|
||||
if (photos.length === 0) {
|
||||
$('empty').hidden = false;
|
||||
return;
|
||||
}
|
||||
for (const p of photos) $('grid').append(photoCard(p));
|
||||
feedSkip = photos.length;
|
||||
if (photos.length === PAGE) $('loadMore').hidden = false;
|
||||
} catch (err) {
|
||||
$('grid').replaceChildren();
|
||||
toast(err.message, 'error');
|
||||
}
|
||||
}
|
||||
|
||||
$('loadMoreBtn').addEventListener('click', async () => {
|
||||
try {
|
||||
const photos = await api(`/feed?take=${PAGE}&skip=${feedSkip}`);
|
||||
for (const p of photos) $('grid').append(photoCard(p));
|
||||
feedSkip += photos.length;
|
||||
if (photos.length < PAGE) $('loadMore').hidden = true;
|
||||
} catch (err) { toast(err.message, 'error'); }
|
||||
});
|
||||
|
||||
function skeletonCards(n) {
|
||||
return Array.from({ length: n }, () => {
|
||||
const card = el('div', { class: 'photo-card' });
|
||||
const h = 180 + Math.floor(Math.random() * 220);
|
||||
card.append(el('div', { class: 'skeleton', style: `height: ${h}px;` }));
|
||||
card.append(el('div', { class: 'photo-meta' },
|
||||
el('div', { class: 'skeleton', style: 'height: 14px; width: 60%; margin-bottom: 8px;' }),
|
||||
el('div', { class: 'skeleton', style: 'height: 12px; width: 90%;' }),
|
||||
));
|
||||
return card;
|
||||
});
|
||||
}
|
||||
|
||||
function photoCard(p) {
|
||||
const card = el('a', {
|
||||
class: 'photo-card',
|
||||
href: `#/p/${p.Id}`,
|
||||
});
|
||||
const img = el('img', {
|
||||
class: 'photo-img',
|
||||
src: p.ImageUrl,
|
||||
alt: p.Caption || `Photo by ${p.UploaderDisplayName}`,
|
||||
loading: 'lazy',
|
||||
});
|
||||
img.addEventListener('error', () => {
|
||||
img.style.display = 'none';
|
||||
});
|
||||
card.append(img);
|
||||
card.append(el('div', { class: 'photo-meta' },
|
||||
el('div', { class: 'uploader' },
|
||||
el('div', { class: 'uploader-avatar' }, initials(p.UploaderDisplayName)),
|
||||
el('span', {}, p.UploaderDisplayName),
|
||||
),
|
||||
p.Caption ? el('div', { class: 'caption' }, p.Caption) : null,
|
||||
el('div', { class: 'photo-foot' },
|
||||
el('span', { class: 'cheers' }, `♥ ${p.CheerCount.toLocaleString()}`),
|
||||
p.RoomName ? el('span', { class: 'room' }, `^${p.RoomName}`) : el('span', { class: 'time' }, fmtDate(p.CreatedAt)),
|
||||
),
|
||||
));
|
||||
return card;
|
||||
}
|
||||
|
||||
// ── Photo detail view ────────────────────────────────────────────────
|
||||
|
||||
async function renderPhoto(id) {
|
||||
showView('photo');
|
||||
$('photoDetail').replaceChildren(el('div', { class: 'skeleton', style: 'height: 480px;' }));
|
||||
try {
|
||||
const p = await api(`/${id}`);
|
||||
const tagged = (p.TaggedPlayerIds || []).slice(0, 8);
|
||||
$('photoDetail').replaceChildren(el('div', { class: 'photo-detail' },
|
||||
el('div', { class: 'image-wrap' },
|
||||
el('img', { src: p.ImageUrl, alt: p.Caption || `Photo #${p.Id}` })),
|
||||
el('div', { class: 'info' },
|
||||
el('h2', {}, `Photo #${p.Id}`),
|
||||
el('div', { class: 'caption-full' }, p.Caption || ''),
|
||||
el('div', { class: 'meta-row' },
|
||||
el('span', { class: 'k' }, 'By'),
|
||||
el('a', { class: 'uploader-link', href: `#/u/${p.UploaderPlayerId}` },
|
||||
el('div', { class: 'uploader-avatar' }, initials(p.UploaderDisplayName)),
|
||||
el('span', {}, p.UploaderDisplayName),
|
||||
),
|
||||
),
|
||||
p.RoomName
|
||||
? el('div', { class: 'meta-row' },
|
||||
el('span', { class: 'k' }, 'In'),
|
||||
el('span', { class: 'room-pill' }, `^${p.RoomName}`))
|
||||
: null,
|
||||
el('div', { class: 'meta-row' },
|
||||
el('span', { class: 'k' }, 'Posted'),
|
||||
el('span', {}, fmtDate(p.CreatedAt) + ' (' + new Date(p.CreatedAt).toLocaleString() + ')'),
|
||||
),
|
||||
tagged.length
|
||||
? el('div', { class: 'meta-row' },
|
||||
el('span', { class: 'k' }, 'Tagged'),
|
||||
el('span', {}, tagged.length + ' player' + (tagged.length === 1 ? '' : 's')))
|
||||
: null,
|
||||
el('div', { class: 'stats' },
|
||||
el('div', { class: 'stat-pill cheers' },
|
||||
el('div', { class: 'v' }, p.CheerCount.toLocaleString()),
|
||||
el('div', { class: 'l' }, 'cheers')),
|
||||
el('div', { class: 'stat-pill' },
|
||||
el('div', { class: 'v' }, p.ViewCount.toLocaleString()),
|
||||
el('div', { class: 'l' }, 'views')),
|
||||
),
|
||||
),
|
||||
));
|
||||
} catch (err) {
|
||||
$('photoDetail').replaceChildren(el('div', { class: 'empty' },
|
||||
el('p', {}, 'Photo not found.')));
|
||||
}
|
||||
}
|
||||
|
||||
$('backBtn').addEventListener('click', goFeed);
|
||||
|
||||
// ── Profile view ─────────────────────────────────────────────────────
|
||||
|
||||
async function renderProfile(playerId) {
|
||||
showView('profile');
|
||||
$('profileDetail').replaceChildren(el('div', { class: 'skeleton', style: 'height: 100px;' }));
|
||||
try {
|
||||
const photos = await api(`/by/${playerId}?take=60`);
|
||||
const uploaderName = photos[0]?.UploaderDisplayName || `Player ${playerId}`;
|
||||
const uploaderUsername = photos[0]?.UploaderUsername || '';
|
||||
$('profileDetail').replaceChildren(
|
||||
el('div', { class: 'profile-header' },
|
||||
el('div', { class: 'avatar' }, initials(uploaderName)),
|
||||
el('div', {},
|
||||
el('h2', {}, uploaderName),
|
||||
el('div', { class: 'username' },
|
||||
uploaderUsername ? `@${uploaderUsername} · ` : '',
|
||||
`${photos.length} photo${photos.length === 1 ? '' : 's'}`),
|
||||
),
|
||||
),
|
||||
(() => {
|
||||
const grid = el('div', { class: 'grid' });
|
||||
if (photos.length === 0)
|
||||
grid.append(el('div', { class: 'empty' },
|
||||
el('p', {}, 'No photos posted yet.')));
|
||||
else
|
||||
for (const p of photos) grid.append(photoCard(p));
|
||||
return grid;
|
||||
})(),
|
||||
);
|
||||
} catch (err) {
|
||||
$('profileDetail').replaceChildren(el('div', { class: 'empty' },
|
||||
el('p', {}, 'Profile not found.')));
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user