Add guest Live Show opt-in toggle

resources/js/guest/i18n/messages.ts

@@ -522,6 +522,13 @@ export const messages: Record<LocaleCode, NestedMessages> = {
         keep: 'Foto verwenden',
         readyAnnouncement: 'Foto aufgenommen. Bitte Vorschau prüfen.',
       },
+      liveShow: {
+        title: 'Live-Show',
+        description: 'Zeige dieses Foto direkt auf der Live-Show.',
+        toggle: 'Live-Show aktivieren',
+        immediate: 'Erscheint sofort auf der Leinwand.',
+        reviewed: 'Wird nach Freigabe für die Live-Show angezeigt.',
+      },
       status: {
         saving: 'Speichere Foto...',
         processing: 'Verarbeite Foto...',
@@ -1220,6 +1227,13 @@ export const messages: Record<LocaleCode, NestedMessages> = {
         keep: 'Use this photo',
         readyAnnouncement: 'Photo captured. Please review the preview.',
       },
+      liveShow: {
+        title: 'Live Show',
+        description: 'Show this photo on the live screen.',
+        toggle: 'Enable Live Show',
+        immediate: 'Shows immediately on the big screen.',
+        reviewed: 'Shown after approval for the Live Show.',
+      },
       status: {
         saving: 'Saving photo...',
         processing: 'Processing photo...',

resources/js/guest/pages/UploadPage.tsx

@@ -4,6 +4,7 @@ import { useNavigate, useParams, useSearchParams } from 'react-router-dom';
 import { Button } from '@/components/ui/button';
 import { Badge } from '@/components/ui/badge';
 import { Alert, AlertDescription } from '@/components/ui/alert';
+import { Switch } from '@/components/ui/switch';
 import { motion } from 'framer-motion';
 import {
   Dialog,
@@ -149,6 +150,7 @@ export default function UploadPage() {
   const uploadsRequireApproval =
     (event?.guest_upload_visibility as 'immediate' | 'review' | undefined) !== 'immediate';
   const demoReadOnly = Boolean(event?.demo_read_only);
+  const liveShowModeration = event?.live_show?.moderation_mode ?? 'manual';
   const motionEnabled = !prefersReducedMotion();
   const overlayMotion = motionEnabled ? { initial: 'hidden', animate: 'show', variants: FADE_SCALE } : {};
   const fadeUpMotion = motionEnabled ? { initial: 'hidden', animate: 'show', variants: FADE_UP } : {};
@@ -187,6 +189,7 @@ const navSentinelRef = useRef<HTMLDivElement | null>(null);
 
 const [eventPackage, setEventPackage] = useState<EventPackage | null>(null);
 const [canUpload, setCanUpload] = useState(true);
+const [submitToLive, setSubmitToLive] = useState(true);
 
   const limitCards = useMemo<LimitSummaryCard[]>(
     () => buildLimitSummaries(eventPackage?.limits ?? null, t),
@@ -227,6 +230,11 @@ const [canUpload, setCanUpload] = useState(true);
     };
   }, []);
 
+  useEffect(() => {
+    if (!event) return;
+    setSubmitToLive(true);
+  }, [event?.slug]);
+
   const updateNavVisibility = useCallback(() => {
     if (typeof document === 'undefined') {
       return;
@@ -776,6 +784,7 @@ const [canUpload, setCanUpload] = useState(true);
       const photoId = await uploadPhoto(eventKey, fileForUpload, task?.id, emotionSlug || undefined, {
         maxRetries: 2,
         guestName: identity.name || undefined,
+        liveShowOptIn: submitToLive,
         onProgress: (percent) => {
           setUploadProgress(Math.max(15, Math.min(98, percent)));
           setStatusMessage(t('upload.status.uploading'));
@@ -840,7 +849,7 @@ const [canUpload, setCanUpload] = useState(true);
     } finally {
       setStatusMessage('');
     }
-  }, [emotionSlug, markCompleted, navigateAfterUpload, reviewPhoto, eventKey, stopStream, task, canUpload, t, identity.name, triggerConfetti]);
+  }, [emotionSlug, markCompleted, navigateAfterUpload, reviewPhoto, eventKey, stopStream, task, canUpload, t, identity.name, triggerConfetti, submitToLive]);
 
   const handleGalleryPick = useCallback(async (event: React.ChangeEvent<HTMLInputElement>) => {
     if (!canUpload) return;
@@ -1446,6 +1455,26 @@ const renderWithDialog = (content: ReactNode, wrapperClassName = 'space-y-6 pb-[
                       <p className="text-xs">{t('upload.review.noticeBody', 'Dein Foto erscheint, sobald es freigegeben wurde.')}</p>
                     </div>
                   ) : null}
+                  <div className="rounded-xl border border-white/20 bg-white/10 p-3 text-white shadow-sm backdrop-blur">
+                    <div className="flex items-start justify-between gap-3">
+                      <div>
+                        <p className="text-sm font-semibold">{t('upload.liveShow.title', 'Live-Show')}</p>
+                        <p className="text-xs text-white/70">
+                          {t('upload.liveShow.description', 'Zeige dieses Foto direkt auf der Live-Show.')}
+                        </p>
+                      </div>
+                      <Switch
+                        checked={submitToLive}
+                        onCheckedChange={(checked) => setSubmitToLive(checked)}
+                        aria-label={t('upload.liveShow.toggle', 'Live-Show aktivieren')}
+                      />
+                    </div>
+                    <p className="mt-2 text-[11px] text-white/70">
+                      {liveShowModeration === 'off'
+                        ? t('upload.liveShow.immediate', 'Erscheint sofort auf der Leinwand.')
+                        : t('upload.liveShow.reviewed', 'Wird nach Freigabe für die Live-Show angezeigt.')}
+                    </p>
+                  </div>
                   <div className="flex flex-col gap-3 sm:flex-row">
                     <Button variant="secondary" className="flex-1" onClick={handleRetake}>
                       {t('upload.review.retake')}

resources/js/guest/queue/queue.ts

@@ -12,6 +12,7 @@ export type QueueItem = {
   blob: Blob;
   emotion_id?: number | null;
   task_id?: number | null;
+  live_show_opt_in?: boolean | null;
   status: 'pending' | 'uploading' | 'done' | 'error';
   retries: number;
   nextAttemptAt?: number | null;

resources/js/guest/queue/xhr.ts

@@ -14,6 +14,9 @@ export async function createUpload(
     form.append('photo', it.blob, it.fileName);
     if (it.emotion_id) form.append('emotion_id', String(it.emotion_id));
     if (it.task_id) form.append('task_id', String(it.task_id));
+    if (typeof it.live_show_opt_in === 'boolean') {
+      form.append('live_show_opt_in', it.live_show_opt_in ? '1' : '0');
+    }
     xhr.upload.onprogress = (ev) => {
       if (onProgress && ev.lengthComputable) {
         const pct = Math.min(100, Math.round((ev.loaded / ev.total) * 100));

resources/js/guest/services/eventApi.ts

@@ -67,6 +67,9 @@ export interface EventData {
   };
   branding?: EventBrandingPayload | null;
   guest_upload_visibility?: 'immediate' | 'review';
+  live_show?: {
+    moderation_mode?: 'off' | 'manual' | 'trusted_only';
+  };
 }
 
 export interface PackageData {
@@ -262,6 +265,7 @@ export async function fetchEvent(eventKey: string): Promise<EventData> {
 
     const json = await res.json();
 
+    const moderationMode = json?.live_show?.moderation_mode;
     const normalized: EventData = {
       ...json,
       name: coerceLocalized(json?.name, 'Fotospiel Event'),
@@ -271,6 +275,11 @@ export async function fetchEvent(eventKey: string): Promise<EventData> {
       engagement_mode: (json?.engagement_mode as 'tasks' | 'photo_only' | undefined) ?? 'tasks',
       guest_upload_visibility:
         json?.guest_upload_visibility === 'immediate' ? 'immediate' : 'review',
+      live_show: {
+        moderation_mode: moderationMode === 'off' || moderationMode === 'manual' || moderationMode === 'trusted_only'
+          ? moderationMode
+          : 'manual',
+      },
       demo_read_only: Boolean(json?.demo_read_only),
     };
 

resources/js/guest/services/photosApi.ts

@@ -100,6 +100,7 @@ type UploadOptions = {
   signal?: AbortSignal;
   maxRetries?: number;
   onRetry?: (attempt: number) => void;
+  liveShowOptIn?: boolean;
 };
 
 export async function uploadPhoto(
@@ -114,6 +115,9 @@ export async function uploadPhoto(
   if (taskId) formData.append('task_id', taskId.toString());
   if (emotionSlug) formData.append('emotion_slug', emotionSlug);
   if (options.guestName) formData.append('guest_name', options.guestName);
+  if (typeof options.liveShowOptIn === 'boolean') {
+    formData.append('live_show_opt_in', options.liveShowOptIn ? '1' : '0');
+  }
   formData.append('device_id', getDeviceId());
 
   const maxRetries = options.maxRetries ?? 2;