interactive intro to open social
at-me.zzstoatzz.io
show discover CTA every visit for bsky-only users, make ghost apps clickable
- remove localStorage persistence for discover callout — it shows
every time for users with only bluesky, dismissable per session
- ghost app circles are now links that navigate to the app
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
+7
-4
+6
src/view/layout.css
+6
src/view/layout.css
+1
-4
src/view/visualization.js
+1
-4
src/view/visualization.js
···
139
139
div.style.top = `${y}px`;
140
140
141
141
div.innerHTML = `
142
-
<div class="app-circle" data-namespace="${suggestion.namespace}" style="width: ${circleSize}px; height: ${circleSize}px; font-size: ${circleSize * 0.4}px;">${suggestion.letter}</div>
142
+
<a href="${suggestion.url}" target="_blank" rel="noopener noreferrer" class="app-circle ghost-app-link" data-namespace="${suggestion.namespace}" style="width: ${circleSize}px; height: ${circleSize}px; font-size: ${circleSize * 0.4}px;">${suggestion.letter}</a>
143
143
<a href="${suggestion.url}" target="_blank" rel="noopener noreferrer" class="app-name">${suggestion.name} ↗</a>
144
144
<span class="ghost-app-description">${suggestion.description}</span>
145
145
`;
···
320
320
const DISCOVER_KEY = 'atme_discover_dismissed';
321
321
322
322
function showDiscoverCallout(field) {
323
-
if (localStorage.getItem(DISCOVER_KEY)) return;
324
-
325
323
const callout = document.createElement('div');
326
324
callout.className = 'discover-callout';
327
325
callout.innerHTML = `
···
345
343
document.getElementById('discoverDismiss').addEventListener('click', () => {
346
344
callout.classList.remove('visible');
347
345
setTimeout(() => callout.remove(), 300);
348
-
localStorage.setItem(DISCOVER_KEY, 'true');
349
346
});
350
347
}
351
348