diff --git a/app/admin/page.tsx b/app/admin/page.tsx index 025ac58..90e711d 100644 --- a/app/admin/page.tsx +++ b/app/admin/page.tsx @@ -149,15 +149,6 @@ export default function AdminDashboard() { })); }; - const toggleAutoFullscreen = (index: number) => { - setIsEditing(prev => ({ - ...prev, - extraMedia: (prev?.extraMedia || []).map((m, i) => - i === index ? { ...m, autoFullscreen: !m.autoFullscreen } : m - ), - })); - }; - const handleSaveCard = async () => { if (!isEditing) return; const generateSafeId = () => 'card-' + Date.now().toString(36) + Math.random().toString(36).substring(2); @@ -422,6 +413,20 @@ export default function AdminDashboard() { Short Description setIsEditing({...isEditing, shortDescription: e.target.value})} className={`${inputClasses} h-24 resize-none`} placeholder="Brief summary..." /> + + + setIsEditing({ ...isEditing, autoFullscreen: e.target.checked })} + className="w-5 h-5 text-blue-600 rounded mt-0.5" + /> + + Auto fullscreen + Open the gallery in fullscreen immediately when the user clicks this card. + + + {/* Cover Image */} @@ -487,28 +492,17 @@ export default function AdminDashboard() { {video ? 'Video' : 'Image'} - - {video && ( - - toggleAutoplay(i)} - className="w-4 h-4 text-blue-600 rounded" - /> - Autoplay (muted) - - )} - + {video && ( + toggleAutoFullscreen(i)} + checked={!!item.autoplay} + onChange={() => toggleAutoplay(i)} className="w-4 h-4 text-blue-600 rounded" /> - Auto fullscreen + Autoplay (muted) - + )} removeExtraMedia(i)} diff --git a/components/PublicGrid.tsx b/components/PublicGrid.tsx index 2866655..8e30dbc 100644 --- a/components/PublicGrid.tsx +++ b/components/PublicGrid.tsx @@ -342,9 +342,7 @@ export default function PublicGrid({ cards, maxCols = 5 }: { cards: Card[], maxC key={card.id} onClick={() => { setActiveCard(card); - // If any media item is flagged auto-fullscreen, open the viewer from the start. - const triggers = (card.extraMedia || []).some(m => m.autoFullscreen); - if (triggers) setFullscreenIndex(0); + if (card.autoFullscreen) setFullscreenIndex(0); }} className="group relative cursor-pointer overflow-hidden rounded-xl shadow-md aspect-square bg-gray-200 transition-all duration-300 hover:shadow-xl hover:-translate-y-1" > @@ -407,7 +405,10 @@ export default function PublicGrid({ cards, maxCols = 5 }: { cards: Card[], maxC setFullscreenIndex(null)} + onClose={() => { + setFullscreenIndex(null); + setActiveCard(null); + }} /> )} > diff --git a/types/index.ts b/types/index.ts index 7d69d5b..60632c4 100644 --- a/types/index.ts +++ b/types/index.ts @@ -2,8 +2,7 @@ export type CardType = 'INFO_PAGE' | 'EXTERNAL_LINK' | 'IMAGE_GALLERY' | 'SERVIC export type MediaItem = { url: string; - autoplay?: boolean; // videos only — autoplay muted when shown - autoFullscreen?: boolean; // any media — open the fullscreen viewer at this slide on card open + autoplay?: boolean; // videos only — autoplay muted when shown }; export interface Card { @@ -17,6 +16,7 @@ export interface Card { cardType: CardType; actionUrl?: string; displayOrder: number; + autoFullscreen?: boolean; // open the fullscreen viewer immediately when this card is clicked } export interface Portal {