// fs-app.jsx — path router + layout for Short's Resort Field Station (SRFS)

// legacy hash links (#/journal/...) redirect to real paths
if(location.hash && location.hash.indexOf('#/')===0){
  history.replaceState(null,'','/'+location.hash.slice(2).replace(/^\/+/,''));
}

function parsePath(){
  let p = (location.pathname||'/').replace(/\/+$/,'').replace(/^\/+/,'').trim();
  if(!p || p==='index.html' || p==='app.html') return { route:'home', arg:null };
  const parts = p.split('/');
  return { route:parts[0], arg:decodeURIComponent(parts[1]||'')||null };
}

function App(){
  const [loc, setLoc] = React.useState(parsePath());

  React.useEffect(()=>{
    const on = ()=>{ setLoc(parsePath()); };
    const onNav = ()=>{ setLoc(parsePath()); window.scrollTo({top:0,behavior:'auto'}); };
    window.addEventListener('popstate', on);
    window.addEventListener('srfs:navigate', onNav);
    return ()=>{ window.removeEventListener('popstate', on); window.removeEventListener('srfs:navigate', onNav); };
  },[]);

  const go = (to)=>{
    history.pushState(null,'','/'+(to==='home'?'':to));
    window.dispatchEvent(new Event('srfs:navigate'));
  };

  const { route, arg } = loc;
  let view;
  switch(route){
    case 'home':    view = <Frontispiece go={go}/>; break;
    case 'journal': view = arg ? <JournalEntry slug={arg} go={go}/> : <JournalView go={go}/>; break;
    case 'land':    view = <LandView/>; break;
    case 'ii':      view = <InstrumentsView go={go}/>; break;
    case 'library': view = <LibraryView go={go}/>; break;
    case 'species': view = <SpeciesPage slug={arg} go={go}/>; break;
    case 'about':   view = <AboutView go={go}/>; break;
    case 'departments': view = <DepartmentsView go={go}/>; break;
    case 'corrections': view = <RemovedNote slug={arg} go={go}/>; break;
    case 'support': view = <SupportView go={go}/>; break;
    // legacy routes → new homes
    case 'station': case 'instrument': case 'source': view = <InstrumentsView go={go}/>; break;
    default:        view = <NotFound go={go}/>;
  }

  return (
    <React.Fragment>
      <Masthead route={route} go={go}/>
      <main>{view}</main>
      <Footer go={go}/>
    </React.Fragment>
  );
}

ReactDOM.createRoot(document.getElementById('root')).render(<App/>);