madebydanny.uk written in html, css, and a lot of JavaScript I don't understand
madeydanny.uk
html
css
javascript
1document.addEventListener('DOMContentLoaded', () => {
2 const BLUESKY_DID = 'did:plc:4qjpcixqrc3b2qmbce76sm7k';
3 const MUSIC_DID = 'did:plc:l37td5yhxl2irrzrgvei4qay';
4
5 async function fetchMusicStatus() {
6 const url = `https://rose.madebydanny.uk/xrpc/com.atproto.repo.getRecord?repo=${MUSIC_DID}&collection=fm.teal.alpha.actor.status&rkey=self`;
7 try {
8 const response = await fetch(url);
9 if (!response.ok) {
10 console.error('Music API error:', response.status, response.statusText);
11 throw new Error('Network response was not ok');
12 }
13 const data = await response.json();
14 console.log('Music data:', data);
15
16 if (data && data.value && data.value.item) {
17 const item = data.value.item;
18 const artists = item.artists.map(a => a.artistName).join(', ');
19 const trackUrl = item.originUrl || '#';
20
21 document.getElementById('music-link-icon').innerHTML = `<a href="${trackUrl}" target="_blank">↗</a>`;
22 document.getElementById('music-ui-content').innerHTML = `
23 <a href="${trackUrl}" target="_blank" class="bsky-trackname">${item.trackName}</a>
24 <div class="bsky-artist">by ${artists}</div>
25 `;
26 document.getElementById('music-status-card').style.display = 'block';
27 } else {
28 console.warn('No music data found');
29 }
30 } catch (error) {
31 console.error('Error fetching music:', error);
32 // Show card anyway with error message
33 document.getElementById('music-ui-content').innerHTML = '<span class="error-msg">No recent music activity</span>';
34 document.getElementById('music-status-card').style.display = 'block';
35 }
36 }
37
38 async function fetchLatestPost() {
39 const url = `https://public.api.bsky.app/xrpc/app.bsky.feed.getAuthorFeed?actor=${BLUESKY_DID}&limit=1`;
40 try {
41 console.log('Fetching post from:', url);
42 const response = await fetch(url);
43
44 if (!response.ok) {
45 console.error('Post API error:', response.status, response.statusText);
46 const errorText = await response.text();
47 console.error('Error response:', errorText);
48 throw new Error(`HTTP ${response.status}`);
49 }
50
51 const data = await response.json();
52 console.log('Post data:', data);
53
54 if (data.feed && data.feed.length > 0) {
55 const latest = data.feed[0].post;
56 const record = latest.record;
57 const rkey = latest.uri.split('/').pop();
58 const postUrl = `https://bsky.app/profile/madebydanny.uk/post/${rkey}`;
59
60 // Set Text and Date
61 document.getElementById('post-content').innerText = record.text || "";
62 document.getElementById('post-date').innerText = new Date(record.createdAt).toLocaleString();
63 document.getElementById('post-link-icon').innerHTML = `<a href="${postUrl}" target="_blank">↗</a>`;
64
65 // Handle Images (Embeds)
66 const mediaContainer = document.getElementById('post-media');
67 mediaContainer.innerHTML = ''; // Clear previous
68
69 if (record.embed && record.embed.$type === 'app.bsky.embed.images') {
70 record.embed.images.forEach(img => {
71 const imgRef = img.image.ref.$link;
72 const imgSrc = `https://cdn.bsky.app/img/feed_fullsize/plain/${BLUESKY_DID}/${imgRef}@jpeg`;
73
74 const imgElement = document.createElement('img');
75 imgElement.src = imgSrc;
76 imgElement.alt = img.alt || "Bluesky post image";
77 imgElement.className = 'post-image';
78 mediaContainer.appendChild(imgElement);
79 });
80 }
81
82 document.getElementById('latest-post-card').style.display = 'block';
83 } else {
84 console.warn('No posts found in feed');
85 document.getElementById('post-content').innerHTML = '<span class="error-msg">No posts found</span>';
86 document.getElementById('latest-post-card').style.display = 'block';
87 }
88 } catch (error) {
89 console.error('Error fetching post:', error);
90 document.getElementById('post-content').innerHTML = `<span class="error-msg">Error loading post: ${error.message}</span>`;
91 document.getElementById('latest-post-card').style.display = 'block';
92 }
93 }
94
95 fetchMusicStatus();
96 fetchLatestPost();
97});