import {parseSources,parseSourceDetails} from './map-parser.js';
import {renderStorage} from './storage-view.js';
import { avatarFor, createSphereMap } from './sphere-map.js';
import { parseIdentityProfile } from './profile-parser.js';
const $ = selector => document.querySelector(selector);
const esc = text => String(text).replaceAll('&','&amp;').replaceAll('<','&lt;').replaceAll('>','&gt;').replaceAll('"','&quot;');
const compact = number => new Intl.NumberFormat('en',{notation:'compact',maximumFractionDigits:1}).format(number);
const exact = number => number.toLocaleString('en-US');
const profiles = new Map();
const domainFor = key => key.split('.').reverse().join('.');
const label = key => profiles.get(key)?.name || domainFor(key);
// Recognition metadata is shared with every visitor in the deploy snapshot.
function loadIdentities(items=[]){
 for(const item of items){
  try{
   const profile=parseIdentityProfile(item);
   const key=profile.handle.toLowerCase().split('.').reverse().join('.');
   if(!namespaces.some(ns=>ns.key===key))continue;
   profiles.set(key,{name:profile.displayName?.trim().slice(0,100)||'',avatar:profile.avatar?.startsWith('https://')?profile.avatar:null,handle:profile.handle});
  }catch{/* An invalid cached entry leaves its default sphere intact. */}
 }
}
function decorateList(){
 $('#list').querySelectorAll('button.row').forEach(button=>{
  const key=button.dataset.namespace;const profile=profiles.get(key);
  if(button.dataset.collection==='false')button.querySelector('.row-label').textContent=label(key);
  const swatch=button.querySelector('.swatch');
  if(profile?.avatar&&!swatch.querySelector('img')){
   const img=document.createElement('img');img.src=avatarFor(profile.avatar,30*devicePixelRatio);img.alt='';img.referrerPolicy='no-referrer';img.onerror=()=>{img.remove();profile.avatar=null;};swatch.append(img);
  }
 });
}
function renderMicrocosm(){
 const key=selectedCollection||selectedNamespace;
 const panel=$('#microcosm');const shortcut=$('#map-ufos');panel.hidden=!key;shortcut.hidden=!key;if(!key){shortcut.removeAttribute('href');return;}
 const url=new URL('https://ufos.microcosm.blue/collection/');
 url.searchParams.set(selectedCollection?'nsid':'prefix',key);
 const title=selectedCollection?`${label(selectedNamespace)} · ${shortCollection(key)}`:label(key);
 shortcut.href=url.href;shortcut.setAttribute('aria-label',`Explore ${title} on UFOs (opens a new tab)`);
 panel.innerHTML=`<a href="${esc(url.href)}" target="_blank" rel="noopener noreferrer"><span aria-hidden="true">🛸</span> Take a closer look on UFOs <span aria-hidden="true">↗</span><span class="sr-only"> (opens a new tab)</span></a><p>${esc(title)} — explore its activity over time with Microcosm.</p>`;
}
function renderSelection(){
 const key=selectedNamespace;const ns=namespaces.find(n=>n.key===key);const profile=profiles.get(key);
 $('#crumb').textContent=label(key);
 $('#selection').innerHTML=`<h2>${esc(label(key))}</h2><p>Choose what you’d like to explore below.</p><details><summary class="small">Behind this sphere</summary><p>${exact(ns.count)} saved events across ${exact(ns.children.length)} record types.</p><p class="raw">${esc(key)}</p><p>${profile?`Name and avatar from the profile @${esc(profile.handle)}.`:`No profile resolved for ${esc(domainFor(key))}.` } The domain is obtained by reversing the namespace. This is a recognition hint, not proof that one app owns every record type.</p></details>`;
}
const colors=['#63d6ed','#a49bff','#6de5ba','#f5c76c','#ed92d9','#81b4ff','#f69b87','#a6da76'];
function color(key){let n=0;for(const ch of key)n=(n*31+ch.charCodeAt(0))>>>0;return colors[n%colors.length];}
let hostedSnapshot=false;let data;let namespaces=[];let selectedNamespace=null;let selectedCollection=null;let pageSize=14;
function validateOverview(value){
 if(!value||!Array.isArray(value.collections)||!Number.isSafeInteger(value.progress?.maxSeq))throw Error('Unexpected archive summary');
 if(value.namespaces){value.namespaces=parseSources(value.namespaces);if(value.namespaces.some(n=>!Number.isSafeInteger(n.count)||n.count<0))throw Error('Invalid source summary');}
 for(const row of value.collections){if(row.nsid!==String(row.nsid)||row.ns!==String(row.ns)||!Number.isSafeInteger(row.count)||row.count<0)throw Error('Invalid collection summary');}
 return value;
}
async function json(url,signal=AbortSignal.timeout(15000)){const response=await fetch(url,{signal});const result=await response.json();if(!response.ok)throw Error(result.error||'Request failed');return result;}
function initialOverview(){const embedded=document.querySelector('#map-data');return embedded?Promise.resolve(JSON.parse(embedded.textContent)):json('/api/overview');}
let collectionDownload=null,selectionRequest=0;
async function ensureCollections(){
 if(!data.collectionsUrl||data.collections.length)return;
 if(!collectionDownload)collectionDownload=json(data.collectionsUrl).then(groups=>{
  const collections=parseSourceDetails(groups).flatMap(({ns,records})=>records.map(({suffix,count})=>({ns,nsid:suffix?ns+'.'+suffix:ns,count})));
  validateOverview({...data,collections});data.collections=collections;buildNamespaces();
 }).catch(error=>{collectionDownload=null;throw error;});
 return collectionDownload;
}
function detailStatus(text){$('#detail-status').textContent=text;}
function buildNamespaces(){if(!data.collections.length&&data.namespaces){namespaces=data.namespaces.map(n=>({...n,children:[]}));return;}const groups=d3.group(data.collections,c=>c.ns);namespaces=Array.from(groups,([key,children])=>({key,children:children.map(c=>({key:c.nsid,count:c.count,segments:c.segments})),count:d3.sum(children,c=>c.count)})).sort((a,b)=>b.count-a.count);}
const sphereMap=createSphereMap($('#map'),{
 identity:key=>selectedNamespace?null:profiles.get(key),
 label:key=>selectedNamespace?shortCollection(key):label(key),
 color:key=>color(selectedNamespace||key),
 select:key=>selectedNamespace?chooseCollection(key):chooseNamespace(key),
 hover:title=>{$('#hover').textContent=title||'';$('#hover').style.display=title?'block':'none';},
});
function graph(){
 const active=namespaces.find(n=>n.key===selectedNamespace);
 sphereMap.setItems(active?active.children:namespaces,$('#scale').value==='volume');
 $('#home').disabled=!active;$('#map-all-sources').hidden=!active;$('#crumb').textContent=active?label(active.key):'';$('#crumb').title=active?label(active.key):'';$('#map-announcement').textContent=active?'Viewing '+label(active.key):'Viewing all sources';
 $('#map-note').textContent=($('#scale').value==='volume'?'Circle area shows the share of saved events. ':'Small sources are enlarged for discovery. ')+'Pinch to zoom · drag to move · tap to explore.';
}
function shortCollection(key){const parts=key.split('.');const last=parts.at(-1);const ns=parts.slice(0,2).join('.');const repeated=data.collections.filter(c=>c.ns===ns&&c.nsid.split('.').at(-1)===last).length>1;const suffix=repeated?parts.slice(2).join(' · '):last;return suffix.replace(/([a-z])([A-Z])/g,'$1 $2').replace(/(^| · )([a-z])/g,(_,prefix,letter)=>prefix+letter.toUpperCase());}
function renderList(){
 const query=$('#search').value.trim().toLowerCase();
 const active=namespaces.find(n=>n.key===selectedNamespace);
 let rows;
 if(query&&!data.collections.length){rows=namespaces.filter(n=>`${domainFor(n.key)} ${label(n.key)}`.toLowerCase().includes(query)).map(n=>({...n,isCollection:false}));}
 else if(query){rows=data.collections.filter(c=>`${c.nsid} ${domainFor(c.ns)} ${label(c.ns)}`.toLowerCase().includes(query)).map(c=>({key:c.nsid,count:c.count,isCollection:true}));}
 else rows=(active?active.children:namespaces).map(c=>({...c,isCollection:Boolean(active)}));
 $('#list').setAttribute('aria-label',query?'Search results':'Sources');
 $('#list').innerHTML=rows.slice(0,pageSize).map(row=>`<button class="row" data-key="${esc(row.key)}" data-collection="${row.isCollection}" data-namespace="${esc(row.isCollection?data.collections.find(c=>c.nsid===row.key).ns:row.key)}"><span class="swatch" style="background:${color(row.isCollection?row.key.split('.').slice(0,2).join('.'):row.key)}"></span><span class="row-name"><span class="row-label">${esc(row.isCollection?shortCollection(row.key):label(row.key))}</span>${row.isCollection?`<small>${esc(label(data.collections.find(c=>c.nsid===row.key).ns))}</small>`:''}</span><span class="row-count" aria-hidden="true">↗</span></button>`).join('') || '<p class="small">Nothing found. Try a name or website address.</p>';
 decorateList();
 $('#more').hidden=rows.length<=pageSize;
 $('#more').textContent=`Show more (${exact(rows.length)} total)`;
 $('#list').querySelectorAll('button').forEach(button=>button.addEventListener('click',async()=>{if(button.dataset.collection==='true'){const ns=button.dataset.key.split('.').slice(0,2).join('.');if(ns!==selectedNamespace)await chooseNamespace(ns);chooseCollection(button.dataset.key);}else chooseNamespace(button.dataset.key);}));
}
async function chooseNamespace(key){const request=++selectionRequest;if(!data.collections.length&&data.collectionsUrl){$('#crumb').textContent='Loading source…';detailStatus('Loading source details…');try{await ensureCollections();}catch{if(request===selectionRequest){$('#crumb').textContent='Connection is slow — tap a source to retry';detailStatus('Couldn’t load the details. Try selecting a source again.');}return;}if(request!==selectionRequest)return;detailStatus('');}if(!$('#map-dialog').open)$('#explorer').open=true;selectedNamespace=key;selectedCollection=null;pageSize=14;$('#search').value='';$('#list').hidden=false;renderSelection();graph();renderList();renderMicrocosm();if($('#map-dialog').open)setMapPanel(false);}
function chooseCollection(key){
 selectedCollection=key;sphereMap.focus(key);renderMicrocosm();$('#map-announcement').textContent='Viewing '+shortCollection(key);if($('#map-dialog').open)setMapPanel(false);
 const row=data.collections.find(c=>c.nsid===key);
 $('#explorer').open=true;
 $('#selection').innerHTML=`<h2>${esc(shortCollection(key))}</h2><p>Part of ${esc(label(row.ns))}</p><details><summary>Technical details</summary><p>${exact(row.count)} saved events.</p><p class="raw">${esc(key)}</p></details>`;
}
async function start(){for(const id of ['#search','#scale'])$(id).disabled=true;try{data=validateOverview(await initialOverview());hostedSnapshot=data.mode==='static-preview';buildNamespaces();loadIdentities(data.identityProfiles);renderStorage(data.storage);for(const id of ['#search','#scale'])$(id).disabled=false;$('#totals').innerHTML=`<strong>${compact(data.progress.events)} archived entries</strong> across <strong>${exact(namespaces.length)} namespaces</strong> and <strong>${exact(data.recordTypeCount??data.collections.length)} record types</strong>`;$('#loading').style.display='none';graph();renderList();$('#provenance').innerHTML=`<p>Counts come from <a href="${data.summarySource}/api" target="_blank" rel="noreferrer">Strata’s segment summaries</a> of <a href="${data.source}/status" target="_blank" rel="noreferrer">stream.waow.tech</a>. ${hostedSnapshot?'Static preview snapshot. Refreshed on deployment. ':''}Summary updated ${new Date(data.progress.updatedAt).toLocaleString()}; loaded ${new Date(data.fetchedAt).toLocaleString()}. ${exact(data.progress.segments)} of ${exact(data.progress.archiveSegments)} reported sealed segments summarized.</p><p>Rows are archived events, not unique people, apps, or current records. Bootstrap observation time is not original publication time. Compaction removes deleted and superseded material; this is not a complete recording of every past value. </p><p>The expanded scale uses count^0.32 to make small streams visible. Actual volume uses unmodified entry counts. Colors identify namespaces, not subject categories. Namespaces and record types come directly from the archive summary. For recognition, namespace domains are reversed and looked up in the public Bluesky AppView, following at-me. Names and avatars come from matching profiles; otherwise the domain is shown. This is a profile association, not proof of application ownership. No curated aliases or subject categories are used. Profile associations are cached in a shared snapshot refreshed separately from deployment. Visitors make no profile API requests. Available logos are loaded without a zoom threshold, four canvas images at a time; small spheres use small cached drawing surfaces. Missing profiles retain their colors.</p><p> This preview opens no live connections and makes no historical record queries. It is a visual map of saved activity, not a content reader.</p><details><summary>Instance field report at load</summary><pre>${esc(data.status)}</pre></details>`;}catch(error){$('#loading').innerHTML=`<div class="error">${esc(error.message)}<br><button id="retry">Retry loading</button></div>`;$('#totals').textContent='Couldn’t load the map';$('#retry').addEventListener('click',start);}}
$('#zoom-in').addEventListener('click',()=>{sphereMap.zoomBy(1.6);});$('#reset-map').addEventListener('click',()=>sphereMap.reset());$('#zoom-out').addEventListener('click',()=>{sphereMap.zoomBy(1/1.6);});$('#search').addEventListener('input',async()=>{selectedCollection=null;$('#list').hidden=false;pageSize=14;renderList();renderMicrocosm();if(data.collectionsUrl&&!data.collections.length){detailStatus('Searching sources now. Loading record types…');try{await ensureCollections();detailStatus('');renderList();}catch{detailStatus('Source search is ready. Type again to retry loading record types.');}}});$('#more').addEventListener('click',()=>{pageSize+=20;renderList();});$('#scale').addEventListener('change',()=>{if(data)graph();});$('#home').addEventListener('click',()=>{selectionRequest++;detailStatus('');$('#explorer').open=false;selectedNamespace=null;selectedCollection=null;$('#list').hidden=false;$('#search').value='';$('#selection').innerHTML='<h2>Find something familiar</h2><p>Search by name or website, or browse the list.</p>';graph();renderList();renderMicrocosm();if($('#map-dialog').open)setMapPanel(false);});start();

const mapDialog=$('#map-dialog');
const workspace=$('.workspace');
let ownsFullscreen=false;
let explorerWasOpen=false;
const mapPanel=$('#map-panel');
const movable=['.toolbar','.camera-controls','#map-note','#microcosm','#explorer'].map(selector=>{const element=$(selector);const marker=document.createComment(selector);element.before(marker);return {element,marker};});
const closeHome=document.createComment('Close button');$('#close-map').before(closeHome);
function setMapPanel(open){if(open)$('#explorer').open=true;mapPanel.hidden=!open;$('#map-menu').setAttribute('aria-expanded',String(open));$('#map-menu').textContent=open?'Done':'Controls';if(!open&&mapPanel.contains(document.activeElement))$('#map-menu').focus({preventScroll:true});}
$('#map-menu').addEventListener('click',()=>setMapPanel(mapPanel.hidden));
const workspaceHome=document.createComment('Map position');
workspace.before(workspaceHome);
function restoreMap(){
 if(ownsFullscreen&&document.fullscreenElement)document.exitFullscreen().catch(()=>{});
 ownsFullscreen=false;
 for(const {element,marker} of movable)marker.after(element);
 closeHome.after($('#close-map'));setMapPanel(false);
 workspaceHome.after(workspace);document.body.classList.remove('map-open');
 $('#expand-map').hidden=false;$('#close-map').hidden=true;$('#explorer').open=explorerWasOpen;
 $('#expand-map').focus({preventScroll:true});
}
$('#expand-map').addEventListener('click',()=>{
 explorerWasOpen=$('#explorer').open;mapDialog.append(workspace);for(const {element} of movable)mapPanel.append(element);mapDialog.append($('#close-map'));setMapPanel(false);$('#expand-map').hidden=true;$('#close-map').hidden=false;
 $('#explorer').open=true;document.body.classList.add('map-open');
 const open=()=>{mapDialog.showModal();mapDialog.focus({preventScroll:true});};
 if(!document.fullscreenElement&&document.documentElement.requestFullscreen){
  document.documentElement.requestFullscreen().then(()=>{ownsFullscreen=true;open();}).catch(open);
 }else open();
});
$('#close-map').addEventListener('click',()=>mapDialog.close());
mapDialog.addEventListener('close',restoreMap);
mapDialog.addEventListener('cancel',event=>{if(!mapPanel.hidden){event.preventDefault();setMapPanel(false);$('#map-menu').focus();}});

document.addEventListener('fullscreenchange',()=>{if(ownsFullscreen&&!document.fullscreenElement&&mapDialog.open)mapDialog.close();});

// Keep the overlay below wrapping navigation, including enlarged text.
const navigationObserver=new ResizeObserver(()=>{
 const controls=$('#map-menu').getBoundingClientRect();
 const back=$('#close-map').getBoundingClientRect();
 if(mapDialog.open)mapDialog.style.setProperty('--navigation-bottom',Math.max(controls.bottom,back.bottom)+12+'px');
});navigationObserver.observe($('#map-menu'));navigationObserver.observe($('#close-map'));

$('#map-all-sources').addEventListener('click',()=>{$('#home').click();$('#map-menu').focus({preventScroll:true});});