// App — router shell

function parseHash() {
  // Format: #page or #page:menuOpen=1
  const h = (window.location.hash || '').replace(/^#/, '');
  const [page, ...flags] = h.split(':');
  const opts = {};
  flags.forEach(f => {
    const [k, v] = f.split('=');
    opts[k] = v ?? '1';
  });
  return { page: page || 'home', opts };
}

function App() {
  const initial = parseHash();
  const [page, setPage] = React.useState(initial.page);
  const [opts, setOpts] = React.useState(initial.opts);

  React.useEffect(() => {
    const onHash = () => {
      const next = parseHash();
      setPage(next.page);
      setOpts(next.opts);
    };
    window.addEventListener('hashchange', onHash);
    return () => window.removeEventListener('hashchange', onHash);
  }, []);

  // Reset scroll on page change (or scroll to a specific id if opts.scroll)
  React.useEffect(() => {
    if (opts.scroll) {
      // Layout settles as images load — retry the scroll a few times until it locks in
      let tries = 0;
      const targetId = opts.scroll;
      const scrollAttempt = () => {
        const el = document.getElementById(targetId);
        if (el) {
          const top = el.getBoundingClientRect().top + window.scrollY;
          window.scrollTo({ top: Math.max(0, top), behavior: 'auto' });
        }
        tries++;
        if (tries < 12) setTimeout(scrollAttempt, 250);
      };
      requestAnimationFrame(scrollAttempt);
    } else {
      window.scrollTo(0, 0);
    }
  }, [page, opts.scroll]);

  const PageComponent = {
    home:     PageHome,
    about:    PageAbout,
    lodges:   PageLodges,
    services: PageServices,
    beginner: PageBeginner,
    faq:      PageFaq,
    contact:  PageContact,
  }[page] || PageHome;

  const transparent = page === 'home';

  return (
    <>
      <Nav page={page} setPage={setPage} transparent={transparent} forceMenuOpen={opts.menu === '1'} />
      <PageComponent setPage={setPage} initialOpts={opts} />
      <Footer setPage={setPage} />
    </>
  );
}

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