/* Shared components — loud look, tidy structure */
const PixelFace = ({ cap='red', size=52 }) => (
);
const NavV3 = ({ current }) => {
const [menuOpen, setMenuOpen] = React.useState(false);
React.useEffect(()=>{
const selector = [
'section h1',
'section h2',
'section p',
'section li',
'section label',
'section .sticker',
'section .stamp',
'section .btn',
'section article',
'section form',
'section iframe',
'section .speech',
'section .memo'
].join(',');
const setup = () => {
const items = [...document.querySelectorAll(selector)]
.filter(el => !el.closest('nav') && !el.classList.contains('reveal-on-scroll'));
items.forEach((el, i)=>{
el.classList.add('reveal-on-scroll');
el.style.setProperty('--reveal-delay', `${Math.min(i % 5, 4) * 45}ms`);
});
const obs = new IntersectionObserver((entries)=>{
entries.forEach(entry=>{
if(entry.isIntersecting){
entry.target.classList.add('is-visible');
obs.unobserve(entry.target);
}
});
}, {threshold:.12, rootMargin:'0px 0px -7% 0px'});
items.forEach(el=>obs.observe(el));
return obs;
};
let obs;
const timer = window.setTimeout(()=>{ obs = setup(); }, 80);
return()=>{
window.clearTimeout(timer);
if(obs) obs.disconnect();
};
},[]);
const pages = [
{id:'top',label:'HOME',href:'index.html'},
{id:'music',label:'DISCOGRAPHY',href:'music.html'},
{id:'podcast',label:'PODCAST',href:'podcast.html'},
{id:'profile',label:'STAFF',href:'profile.html'},
{id:'concept',label:'CONCEPT',href:'concept.html'},
{id:'contact',label:'CONTACT',href:'contact.html'},
];
return (
<>
{menuOpen&&(
)}
);
};
const FooterV3 = () => {
const sns = [
{label:'X', icon:'x.png', href:'https://x.com/Tetsugaku_Talk'},
{label:'Instagram', icon:'instagram.png', href:'https://www.instagram.com/tetsugaku_talk?utm_source=qr'},
{label:'TuneCore', icon:'tunecore.png', href:'https://www.tunecore.co.jp/artists?id=1058659'},
{label:'YouTube', icon:'youtube.png', href:'https://www.youtube.com/@Tetsugaku_Talk/featured'},
{label:'niconico', icon:'niconico.png', href:'https://www.nicovideo.jp/user/138797455'},
{label:'Spotify podcast', icon:'spotify.png', href:'https://open.spotify.com/show/2yyyY54PQwp8RLOE1RxOVf'},
];
return (
<>
{[0,1,2,3].map(i=>(
))}
);
};
const useFadeIn = (threshold=.15) => {
const ref=React.useRef(null);
const [visible,setVisible]=React.useState(false);
React.useEffect(()=>{
const obs=new IntersectionObserver(([e])=>{if(e.isIntersecting)setVisible(true)},{threshold});
if(ref.current)obs.observe(ref.current);
return()=>obs.disconnect();
},[]);
return{ref,visible};
};
Object.assign(window,{NavV3,FooterV3,useFadeIn,PixelFace});