@extends('layouts.app')

@php
    $reg = new \App\Support\SubdomainRegistry();
    $en  = $reg->currentLocale() === 'en';
    $lc  = $en ? 'en' : 'de';
    $t   = fn ($de, $enT) => $en ? $enT : $de;
    $L   = fn (array $pair) => $en ? ($pair[1] ?? $pair[0]) : $pair[0];   // [de, en]
    $O   = fn (array $o) => $en ? $o[2] : $o[1];                          // [value, de, en]

    $bySection = collect($q['questions'])->groupBy('section');
    $quick = $quick ?? false;
    $secList = array_keys($q['sections']);
@endphp

@section('title', $t('Die große Problemumfrage — ProblemRadar', 'The full problem survey — ProblemRadar'))
@section('meta_description', $t('Der vollständige Fragebogen — 5 bis 8 Minuten. Anonym und freiwillig.', 'The complete questionnaire — 5 to 8 minutes. Anonymous and voluntary.'))

@section('content')
@include('umfrage._shell')

<div class="u-progress"><div class="u-progress-bar" data-progress-bar></div></div>

<section class="u-shell" style="padding:48px 0 90px;">
    <div class="u-container" style="max-width:760px;">
        <span class="u-eyebrow"><span class="u-dot"></span> {{ $quick ? $t('Kurzumfrage', 'Quick survey') : $t('Große Umfrage', 'Full survey') }}</span>
        <h1 class="u-display" style="font-size:clamp(2rem,5vw,3.4rem); margin-top:16px;">
            {{ $quick ? $t('In zwei Minuten', 'In two minutes') : $t('Die große', 'The full') }}
            <span class="u-grad-text">{{ $quick ? $t('mitgestalten', 'shape it') : $t('Problemumfrage', 'problem survey') }}</span>
        </h1>
        <p class="u-lead">{{ $quick ? $t('Nur die wichtigsten Fragen — in rund zwei Minuten.', 'Only the key questions — in about two minutes.') : $t('Etwa 5–8 Minuten. Nicht jede Frage muss beantwortet werden — persönliche Angaben sind freiwillig.', 'About 5–8 minutes. Not every question is required — personal details are voluntary.') }}</p>
        <p class="u-help" style="margin-top:14px;"><i class="fa-solid fa-shield-halved" style="color:var(--u-violet);"></i> {{ $t('Anonym · dein Name erscheint nie in Statistiken · keine E-Mail nötig.', 'Anonymous · your name never appears in statistics · no email needed.') }}</p>

        @if ($errors->any())
            <div class="u-errs" role="alert">
                <strong>{{ $t('Bitte korrigiere folgende Eingaben:', 'Please correct the following:') }}</strong>
                <ul>@foreach ($errors->all() as $e)<li>{{ $e }}</li>@endforeach</ul>
            </div>
        @endif

        <form method="POST" action="{{ route('umfrage.full.store') }}" data-progress-form style="margin-top:26px;">
            @csrf
            <input type="hidden" name="lang" value="{{ $lc }}">
            <input type="hidden" name="pr_source" value="{{ $quick ? 'quick' : 'full' }}">
            <div style="position:absolute;left:-9999px;" aria-hidden="true">
                <label>Website<input type="text" name="website" tabindex="-1" autocomplete="off"></label>
            </div>

            @foreach ($q['sections'] as $code => $sec)
                <div class="u-sec-head u-reveal" style="margin-top:36px;">
                    <span class="u-sec-num">{{ str_pad(array_search($code, $secList) + 1, 2, '0', STR_PAD_LEFT) }}</span>
                    <h2 class="u-sec-title">{{ $L($sec) }}</h2>
                </div>
                @foreach ($bySection->get($code, collect()) as $question)
                    @php $k = $question['key']; $req = $question['required'] ?? false; @endphp
                    <div class="u-q u-reveal">
                        <label class="u-label" for="f_{{ $k }}">{{ $L($question['label']) }}@if($req) <span class="u-req">*</span>@else <span class="u-opt">({{ $t('freiwillig', 'optional') }})</span>@endif</label>
                        @isset($question['help'])<p class="u-help">{{ $L($question['help']) }}</p>@endisset

                        @switch($question['type'])
                            @case('text')
                                <input class="u-input @error($k) u-invalid @enderror" id="f_{{ $k }}" type="text" name="{{ $k }}" maxlength="255" value="{{ old($k) }}">
                                @break
                            @case('textarea')
                                <textarea class="u-textarea @error($k) u-invalid @enderror" id="f_{{ $k }}" name="{{ $k }}" maxlength="4000">{{ old($k) }}</textarea>
                                @break
                            @case('single')
                                <select class="u-select @error($k) u-invalid @enderror" id="f_{{ $k }}" name="{{ $k }}" @if(collect($question['options'])->contains(fn ($o) => in_array($o[0], ['andere','other'], true))) data-other-select="{{ $k }}" @endif>
                                    <option value="">{{ $t('Bitte wählen …', 'Please choose …') }}</option>
                                    @foreach ($question['options'] as $o)
                                        <option value="{{ $o[0] }}" @selected(old($k) === $o[0])>{{ $O($o) }}</option>
                                    @endforeach
                                </select>
                                @break
                            @case('multi')
                                <div class="u-opts">
                                    @foreach ($question['options'] as $o)
                                        <label class="u-opt-box"><input type="checkbox" name="{{ $k }}[]" value="{{ $o[0] }}" @checked(is_array(old($k)) && in_array($o[0], old($k), true)) @if(in_array($o[0], ['andere','other'], true)) data-other-trigger="{{ $k }}" @endif> {{ $O($o) }}</label>
                                    @endforeach
                                </div>
                                @break
                            @case('scale')
                                <div class="u-sev">
                                    <input type="range" name="{{ $k }}" id="f_{{ $k }}" min="{{ $question['min'] }}" max="{{ $question['max'] }}" value="{{ old($k, $question['min']) }}"
                                           data-sev="v_{{ $k }}" data-sev-labels="{{ $t('kaum|spürbar|nervig|stark|sehr stark', 'minor|noticeable|annoying|strong|severe') }}">
                                    <span class="u-sev-val"><b id="v_{{ $k }}">{{ old($k, $question['min']) }}</b><span id="v_{{ $k }}_l"></span></span>
                                </div>
                                @break
                        @endswitch

                        @php
                            $opts = $question['options'] ?? [];
                            $hasOther = collect($opts)->contains(fn ($o) => in_array($o[0], ['andere','other'], true));
                            $sel = old($k);
                            $otherShown = is_array($sel)
                                ? (in_array('andere', $sel, true) || in_array('other', $sel, true))
                                : in_array($sel, ['andere','other'], true);
                        @endphp
                        @if ($hasOther)
                            <div class="u-other-wrap" data-other-wrap="{{ $k }}" style="margin-top:12px;{{ $otherShown ? '' : 'display:none;' }}">
                                <input class="u-input" type="text" name="{{ $k }}_other" maxlength="255" value="{{ old($k.'_other') }}"
                                       placeholder="{{ $t('Bitte kurz beschreiben, was „andere" bedeutet …', 'Please describe briefly what “other” means …') }}"
                                       aria-label="{{ $t('Andere — bitte beschreiben', 'Other — please describe') }}" {{ $otherShown ? '' : 'disabled' }}>
                            </div>
                        @endif
                        @error($k)<p class="u-field-err"><i class="fa-solid fa-circle-exclamation"></i> {{ $message }}</p>@enderror
                    </div>
                @endforeach
            @endforeach

            <div class="u-panel u-reveal" style="margin-top:34px; padding:24px 26px; display:flex; flex-wrap:wrap; align-items:center; gap:18px; justify-content:space-between;">
                <p class="u-help" style="margin:0; max-width:40ch;">{{ $t('Mit dem Absenden stimmst du der anonymen, statistischen Auswertung zu. Es wird keine E-Mail-Adresse abgefragt.', 'By submitting you agree to anonymous, statistical evaluation. No email address is requested.') }}</p>
                <button type="submit" class="u-btn u-btn-primary"><i class="fa-solid fa-paper-plane"></i> {{ $t('Umfrage absenden', 'Submit survey') }}</button>
            </div>
        </form>
    </div>
</section>
@endsection