1import{u as j,r as y,f as N,j as e,m as i,l as v,$ as k,X as I,a2 as P,a3 as C,s as w,b as L,L as V,Y as q,t as D,a4 as M,a5 as S}from"./index-hXw6ftrS.js";import{P as z}from"./PageHeader-CzEXAzzt.js";import{Z as F}from"./zoom-in-DPD55mqx.js";import{I as H}from"./images--YEsJ6xp.js";import{I as E}from"./image-gPMVwkW6.js";import{P as f}from"./play-BMJWp6Ld.js";const b=["large","tall","large","normal","large","tall"],G=()=>{const{t:s}=j(),[t,l]=y.useState(null),[o,d]=y.useState(0),{data:c,isLoading:r}=N({queryKey:["gallery-public"],queryFn:async()=>{const{data:a,error:m}=await w.from("gallery_albums").select("id, caption, category, gallery_photos(id, image_url, sort_order)").order("sort_order",{ascending:!1}).limit(9);if(m)throw m;return a.map(u=>({...u,gallery_photos:[...u.gallery_photos].sort((h,_)=>h.sort_order-_.sort_order)}))}}),n=a=>{l(a),d(0)},p=()=>l(null),g=t==null?void 0:t.gallery_photos[o],x=((t==null?void 0:t.gallery_photos.length)??0)>1;return e.jsxs("section",{className:"py-20 md:py-32 bg-secondary/30",children:[e.jsxs("div",{className:"container mx-auto px-4",children:[e.jsxs(i.div,{initial:{opacity:0,y:20},whileInView:{opacity:1,y:0},viewport:{once:!0},transition:{duration:.6},className:"text-center mb-12",children:[e.jsx("span",{className:"inline-block text-accent font-medium text-sm uppercase tracking-wider mb-4",children:s("gallery.section_label")}),e.jsxs("h2",{className:"font-serif text-4xl md:text-5xl font-bold text-foreground mb-4",children:[s("gallery.title")," ",e.jsx("span",{className:"text-gradient-emerald",children:s("gallery.title_highlight")})]}),e.jsx("p",{className:"text-muted-foreground max-w-2xl mx-auto",children:s("gallery.subtitle")})]}),r?e.jsx("div",{className:"text-center py-12",children:e.jsx(v,{className:"w-8 h-8 animate-spin mx-auto text-primary"})}):c&&c.length>0?e.jsx("div",{className:"columns-1 md:columns-2 lg:columns-3 gap-4 space-y-4",children:c.map((a,m)=>{const u=b[m%b.length],h=a.gallery_photos[0];return h?e.jsx(i.div,{initial:{opacity:0,y:30},whileInView:{opacity:1,y:0},viewport:{once:!0},transition:{duration:.5,delay:m*.1},className:"break-inside-avoid",children:e.jsxs(i.div,{whileHover:{y:-5},className:"group rounded-2xl overflow-hidden shadow-soft hover:shadow-medium transition-all duration-300 cursor-pointer bg-card",onClick:()=>n(a),children:[e.jsxs("div",{className:"relative overflow-hidden",children:[e.jsx("img",{src:h.image_url,alt:a.caption||"Galeri PDPI",className:`w-full object-cover ${u==="tall"?"h-80 md:h-96":u==="large"?"h-56 md:h-64":"h-48 md:h-56"}`}),e.jsx("div",{className:"absolute inset-0 bg-primary/0 group-hover:bg-primary/30 transition-colors duration-300 flex items-center justify-center",children:e.jsx(i.div,{initial:{scale:0},whileHover:{scale:1.1},className:"w-12 h-12 rounded-full bg-card/20 backdrop-blur-sm flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity duration-300",children:e.jsx(F,{className:"w-6 h-6 text-primary-foreground"})})}),a.category&&e.jsx("span",{className:"absolute top-4 left-4 px-2 py-1 bg-accent text-accent-foreground text-xs font-semibold rounded-full",children:a.category}),a.gallery_photos.length>1&&e.jsxs("span",{className:"absolute top-4 right-4 flex items-center gap-1 px-2 py-1 bg-primary/80 text-primary-foreground text-xs font-semibold rounded-full",children:[e.jsx(H,{className:"w-3 h-3"})," ",a.gallery_photos.length]})]}),a.caption&&e.jsx("div",{className:"p-4",children:e.jsx("h4",{className:"font-serif text-base font-bold text-foreground leading-snug",children:a.caption})})]})},a.id):null})}):e.jsxs("div",{className:"text-center py-12 border border-dashed border-border rounded-2xl",children:[e.jsx(E,{className:"w-10 h-10 mx-auto mb-3 text-muted-foreground opacity-50"}),e.jsx("p",{className:"text-muted-foreground",children:s("gallery.empty")})]})]}),e.jsx(k,{children:t&&g&&e.jsx(i.div,{initial:{opacity:0}
1,animate:{opacity:1},exit:{opacity:0},className:"fixed inset-0 z-50 flex items-center justify-center bg-primary/95 backdrop-blur-sm p-4",onClick:p,children:e.jsxs(i.div,{initial:{scale:.8,opacity:0},animate:{scale:1,opacity:1},exit:{scale:.8,opacity:0},className:"relative max-w-4xl w-full",onClick:a=>a.stopPropagation(),children:[e.jsx("button",{onClick:p,className:"absolute -top-12 right-0 w-10 h-10 rounded-full bg-card/20 backdrop-blur-sm flex items-center justify-center text-primary-foreground hover:bg-card/30 transition-colors",children:e.jsx(I,{className:"w-5 h-5"})}),x&&e.jsx("button",{onClick:()=>d(a=>(a-1+t.gallery_photos.length)%t.gallery_photos.length),className:"absolute left-2 top-1/2 -translate-y-1/2 w-10 h-10 rounded-full bg-card/20 backdrop-blur-sm flex items-center justify-center text-primary-foreground hover:bg-card/30 transition-colors",children:e.jsx(P,{className:"w-5 h-5"})}),x&&e.jsx("button",{onClick:()=>d(a=>(a+1)%t.gallery_photos.length),className:"absolute right-2 top-1/2 -translate-y-1/2 w-10 h-10 rounded-full bg-card/20 backdrop-blur-sm flex items-center justify-center text-primary-foreground hover:bg-card/30 transition-colors",children:e.jsx(C,{className:"w-5 h-5"})}),e.jsx("img",{src:g.image_url,alt:t.caption||"Galeri PDPI",className:"w-full h-auto rounded-2xl shadow-lg"}),(t.category||t.caption||x)&&e.jsxs("div",{className:"mt-4 text-center",children:[t.category&&e.jsx("span",{className:"inline-block px-3 py-1 bg-accent text-accent-foreground text-sm font-semibold rounded-full mb-2",children:t.category}),t.caption&&e.jsx("h3",{className:"font-serif text-2xl font-bold text-primary-foreground",children:t.caption}),x&&e.jsxs("p",{className:"text-primary-foreground/70 text-sm mt-1",children:[o+1," / ",t.gallery_photos.length]})]})]})})})]})},K=(s,t)=>{const l=Math.floor((Date.now()-new Date(s).getTime())/864e5);return l<1?t("media.today"):l<30?t("media.days_ago",{n:l}):l<365?t("media.months_ago",{n:Math.floor(l/30)}):t("media.years_ago",{n:Math.floor(l/365)})},B=()=>{const{t:s}=j();L({title:"Media & Video",description:"Kumpulan video dan galeri kegiatan Perhimpunan Dokter Paru Indonesia (PDPI).",canonicalPath:"/media"});const{data:t,isLoading:l}=N({queryKey:["videos-public"],queryFn:async()=>{const{data:r,error:n}=await w.from("videos").select("id, title, youtube_url, thumbnail_url, duration, is_featured, created_at").eq("is_published",!0).order("created_at",{ascending:!1});if(n)throw n;return r}}),o=(t==null?void 0:t.find(r=>r.is_featured))||(t==null?void 0:t[0]),d=(t||[]).filter(r=>r.id!==(o==null?void 0:o.id)).slice(0,8),c=r=>{if(r.thumbnail_url)return r.thumbnail_url;const n=S(r.youtube_url);return n?`https://img.youtube.com/vi/${n}/hqdefault.jpg`:null};return e.jsxs(V,{children:[e.jsx(z,{title:s("media.page_title"),subtitle:s("media.page_subtitle"),breadcrumb:s("media.breadcrumb")}),e.jsx("section",{className:"py-20 bg-background",children:e.jsxs("div",{className:"container mx-auto px-4",children:[e.jsxs(i.div,{initial:{opacity:0,y:20},whileInView:{opacity:1,y:0},viewport:{once:!0},className:"text-center mb-12",children:[e.jsx("h2",{className:"font-serif text-3xl md:text-4xl font-bold text-foreground mb-4",children:s("media.video_title")}),e.jsx("p",{className:"text-muted-foreground max-w-2xl mx-auto",children:s("media.video_subtitle")})]}),l?e.jsx("div",{className:"text-center py-12",children:e.jsx(v,{className:"w-8 h-8 animate-spin mx-auto text-primary"})}):o?e.jsxs(e.Fragment,{children:[e.jsx(i.div,{initial:{opacity:0,y:30},whileInView:{opacity:1,y:0},viewport:{once:!0},className:"mb-12",children:e.jsx("a",{href:o.youtube_url,target:"_blank",rel:"noopener noreferrer",children:e.jsxs("div",{className:"relative aspect-video bg-secondary rounded-2xl overflow-hidden group cursor-pointer",children:[c(o)&&e.jsx("img",{src:c(o),alt:o.title,className:"absolute inset-0 w-full h-full object-cover"}),e.jsx("div",{className:"absolute inset-0 bg-gradient-to-t from-black/60 to-transparent"}),e.jsx("div",{className:"absolute inset-0 flex items-center justify-center",children:e.jsx(i.div,{whileHover:{scale:1.1},className:"w-20 h-20 bg-accent rounded-full flex items-center justify-center shadow-glow",children:e.jsx(f,{className:"w-8 h-8 text-accent-foreground ml-1",fill:"currentColor"})})}),e.jsxs("div",{className:"absolute bottom-0 left-0 right-0 p-6",children:[e.jsx("span",{className:"px-3 py-1 bg-accent text-accent-foreground text-xs font-medium rounded-full",children:s("media.featured_label")}),e.jsx("h3",{className:"font-serif text-2xl font-bold text-white mt-3",children:o.title})]})]})})}),d.length>0&&e.jsx("div",{className:"grid md:grid-cols-2 lg:grid-cols-4 gap-6",children:d.map((r,n)=>e.jsxs(i.a,{href:r.youtube_url,target:"_blank",rel:"noopener noreferrer",initial:{opacity:0,y:20},whileInView:{opacity:1,y:0},viewport:{once:!0},transition:{delay:n*.1},className:"bg-card border border-border rounded-xl overflow-hidden hover:shadow-medium hover:border-primary/30 transition-all group cursor-pointer",children:[e.jsxs("div",{className:"relative aspect-video bg-secondary",children:[c(r)&&e.jsx("img",{src:c(r),alt:r.title,className:"absolute inset-0 w-full h-full object-cover"}),e.jsx("div",{className:"absolute inset-0 bg-black/20 group-hover:bg-black/40 transition-colors"}),e.jsx("div",{className:"absolute inset-0 flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity",children:e.jsx("div",{className:"w-12 h-12 bg-accent rounded-full flex items-center justify-center",children:e.jsx(f,{className:"w-5 h-5 text-accent-foreground ml-0.5",fill:"currentColor"})})}),r.duration&&e.jsx("span",{className:"absolute bottom-2 right-2 px-2 py-0.5 bg-black/70 text-white text-xs rounded",children:r.duration})]}),e.jsxs("div",{className:"p-4",children:[e.jsx("h3",{className:"font-medium text-foreground line-clamp-2 group-hover:text-primary transition-colors",children:r.title}),e.jsx("div",{className:"flex items-center gap-2 text-xs text-muted-foreground mt-2",children:e.jsx("span",{children:K(r.created_at,
1s)})})]})]},r.id))})]}):e.jsxs("div",{className:"text-center py-12 border border-dashed border-border rounded-2xl mb-4",children:[e.jsx(q,{className:"w-10 h-10 mx-auto mb-3 text-muted-foreground opacity-50"}),e.jsx("p",{className:"text-muted-foreground",children:s("media.video_empty")})]}),e.jsx("div",{className:"text-center mt-10",children:e.jsx(D,{variant:"outline",size:"lg",asChild:!0,children:e.jsxs("a",{href:"https://youtube.com/@humaspdpi",target:"_blank",rel:"noopener noreferrer",children:[e.jsx(M,{className:"w-5 h-5 mr-2"}),s("media.youtube_btn")]})})})]})}),e.jsx(G,{})]})};export{B as default};
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.