@extends('layouts.admin')

@section('title', 'Homepage — '.config('app.name'))
@section('page_title', 'Homepage')

@section('breadcrumbs')
    <li class="breadcrumb-item"><a href="{{ route('admin.cms.pages.index') }}">CMS</a></li>
    <li class="breadcrumb-item active">Homepage</li>
@endsection

@section('content')
    <div class="alert alert-info">
        <strong>This is the public home page text.</strong>
        Change a field, click Save at the bottom, then open the website home page to check it.
        Product names come from <a href="{{ route('admin.products.index') }}">Products</a>.
        Release names and dates come from <a href="{{ route('admin.cms.releases.index') }}">Product releases</a>.
        Links stay the same so the site does not break.
    </div>

    <form method="POST" action="{{ route('admin.cms.homepage.update') }}">
        @csrf
        @method('PUT')

        <div class="card mb-3">
            <div class="card-header"><h5 class="mb-0">Browser tab</h5></div>
            <div class="card-body">
                <div class="row g-3">
                    <div class="col-md-5">
                        <label class="form-label" for="browser_title">Page title</label>
                        <input class="form-control" id="browser_title" name="browser_title" value="{{ old('browser_title', $copy['browser_title']) }}" required>
                    </div>
                    <div class="col-md-7">
                        <label class="form-label" for="meta_description">Short description (search engines)</label>
                        <input class="form-control" id="meta_description" name="meta_description" value="{{ old('meta_description', $copy['meta_description']) }}" required>
                    </div>
                </div>
            </div>
        </div>

        <div class="card mb-3">
            <div class="card-header"><h5 class="mb-0">Blue banner at the top</h5></div>
            <div class="card-body">
                <p class="text-muted">The three checked lines under the SYSTRONICS name.</p>
                @foreach (old('hero_lines', $copy['hero_lines']) as $i => $line)
                    <div class="mb-2">
                        <label class="form-label" for="hero_line_{{ $i }}">Line {{ $i + 1 }}</label>
                        <input class="form-control" id="hero_line_{{ $i }}" name="hero_lines[]" value="{{ $line }}">
                    </div>
                @endforeach
            </div>
        </div>

        <div class="card mb-3">
            <div class="card-header"><h5 class="mb-0">Industry spotlight (top right card)</h5></div>
            <div class="card-body">
                <div class="row g-3">
                    <div class="col-md-4">
                        <label class="form-label" for="spotlight_heading">Heading</label>
                        <input class="form-control" id="spotlight_heading" name="spotlight[heading]" value="{{ old('spotlight.heading', $copy['spotlight']['heading']) }}" required>
                    </div>
                    <div class="col-md-8">
                        <label class="form-label" for="spotlight_title">Title</label>
                        <input class="form-control" id="spotlight_title" name="spotlight[title]" value="{{ old('spotlight.title', $copy['spotlight']['title']) }}" required>
                    </div>
                    <div class="col-12">
                        <label class="form-label" for="spotlight_body">Text</label>
                        <textarea class="form-control" id="spotlight_body" name="spotlight[body]" rows="3" required>{{ old('spotlight.body', $copy['spotlight']['body']) }}</textarea>
                    </div>
                </div>
            </div>
        </div>

        <div class="card mb-3">
            <div class="card-header"><h5 class="mb-0">Section headings</h5></div>
            <div class="card-body">
                <div class="row g-3">
                    <div class="col-md-6">
                        <label class="form-label" for="products_eyebrow">Products small label</label>
                        <input class="form-control" id="products_eyebrow" name="products[eyebrow]" value="{{ old('products.eyebrow', $copy['products']['eyebrow']) }}" required>
                    </div>
                    <div class="col-md-6">
                        <label class="form-label" for="products_title">Products heading</label>
                        <input class="form-control" id="products_title" name="products[title]" value="{{ old('products.title', $copy['products']['title']) }}" required>
                    </div>
                    <div class="col-md-6">
                        <label class="form-label" for="releases_eyebrow">Releases small label</label>
                        <input class="form-control" id="releases_eyebrow" name="releases[eyebrow]" value="{{ old('releases.eyebrow', $copy['releases']['eyebrow']) }}" required>
                    </div>
                    <div class="col-md-6">
                        <label class="form-label" for="releases_title">Releases heading</label>
                        <input class="form-control" id="releases_title" name="releases[title]" value="{{ old('releases.title', $copy['releases']['title']) }}" required>
                        <div class="form-text">Use <code>{year}</code> where the year should appear (from Product releases).</div>
                    </div>
                </div>
            </div>
        </div>

        <div class="card mb-3">
            <div class="card-header"><h5 class="mb-0">Industry solutions (four cards)</h5></div>
            <div class="card-body">
                <div class="row g-3 mb-3">
                    <div class="col-md-4">
                        <label class="form-label" for="solutions_eyebrow">Small label</label>
                        <input class="form-control" id="solutions_eyebrow" name="solutions[eyebrow]" value="{{ old('solutions.eyebrow', $copy['solutions']['eyebrow']) }}" required>
                    </div>
                    <div class="col-md-8">
                        <label class="form-label" for="solutions_title">Heading</label>
                        <input class="form-control" id="solutions_title" name="solutions[title]" value="{{ old('solutions.title', $copy['solutions']['title']) }}" required>
                    </div>
                </div>
                @foreach (old('solutions.items', $copy['solutions']['items']) as $i => $item)
                    <div class="border rounded p-3 mb-3">
                        <div class="fw-semibold mb-2">Card {{ $i + 1 }}</div>
                        <div class="row g-3">
                            <div class="col-md-4">
                                <label class="form-label">Small label</label>
                                <input class="form-control" name="solutions[items][{{ $i }}][eyebrow]" value="{{ $item['eyebrow'] }}" required>
                            </div>
                            <div class="col-md-8">
                                <label class="form-label">Title</label>
                                <input class="form-control" name="solutions[items][{{ $i }}][title]" value="{{ $item['title'] }}" required>
                            </div>
                            <div class="col-12">
                                <label class="form-label">Text</label>
                                <textarea class="form-control" name="solutions[items][{{ $i }}][body]" rows="3" required>{{ $item['body'] }}</textarea>
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>
        </div>

        <div class="card mb-3">
            <div class="card-header"><h5 class="mb-0">Services (four tiles)</h5></div>
            <div class="card-body">
                <div class="row g-3 mb-3">
                    <div class="col-md-4">
                        <label class="form-label" for="services_eyebrow">Small label</label>
                        <input class="form-control" id="services_eyebrow" name="services[eyebrow]" value="{{ old('services.eyebrow', $copy['services']['eyebrow']) }}" required>
                    </div>
                    <div class="col-md-8">
                        <label class="form-label" for="services_title">Heading</label>
                        <input class="form-control" id="services_title" name="services[title]" value="{{ old('services.title', $copy['services']['title']) }}" required>
                    </div>
                </div>
                @foreach (old('services.items', $copy['services']['items']) as $i => $item)
                    <div class="border rounded p-3 mb-3">
                        <div class="fw-semibold mb-2">Tile {{ $i + 1 }}</div>
                        <div class="row g-3">
                            <div class="col-md-4">
                                <label class="form-label">Title</label>
                                <input class="form-control" name="services[items][{{ $i }}][title]" value="{{ $item['title'] }}" required>
                            </div>
                            <div class="col-md-8">
                                <label class="form-label">Short description</label>
                                <input class="form-control" name="services[items][{{ $i }}][desc]" value="{{ $item['desc'] }}" required>
                            </div>
                            <div class="col-12">
                                <label class="form-label">Link</label>
                                <input class="form-control" name="services[items][{{ $i }}][url]" value="{{ $item['url'] ?? '' }}" required placeholder="/services/customization-services">
                                <div class="form-text">Site path such as <code>/services/customization-services</code>, or a full https:// address.</div>
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>
        </div>

        <div class="card mb-3">
            <div class="card-header"><h5 class="mb-0">How to order (four rows)</h5></div>
            <div class="card-body">
                <div class="row g-3 mb-3">
                    <div class="col-md-4">
                        <label class="form-label" for="ordering_eyebrow">Small label</label>
                        <input class="form-control" id="ordering_eyebrow" name="ordering[eyebrow]" value="{{ old('ordering.eyebrow', $copy['ordering']['eyebrow']) }}" required>
                    </div>
                    <div class="col-md-8">
                        <label class="form-label" for="ordering_title">Heading</label>
                        <input class="form-control" id="ordering_title" name="ordering[title]" value="{{ old('ordering.title', $copy['ordering']['title']) }}" required>
                    </div>
                </div>
                @foreach (old('ordering.items', $copy['ordering']['items']) as $i => $item)
                    <div class="row g-3 mb-3">
                        <div class="col-md-4">
                            <label class="form-label">Title</label>
                            <input class="form-control" name="ordering[items][{{ $i }}][title]" value="{{ $item['title'] }}" required>
                        </div>
                        <div class="col-md-8">
                            <label class="form-label">Short description</label>
                            <input class="form-control" name="ordering[items][{{ $i }}][desc]" value="{{ $item['desc'] }}" required>
                        </div>
                    </div>
                @endforeach
            </div>
        </div>

        <div class="card mb-3">
            <div class="card-header"><h5 class="mb-0">Partner downloads card</h5></div>
            <div class="card-body">
                <div class="row g-3">
                    <div class="col-md-4">
                        <label class="form-label" for="partner_eyebrow">Small label</label>
                        <input class="form-control" id="partner_eyebrow" name="partner[eyebrow]" value="{{ old('partner.eyebrow', $copy['partner']['eyebrow']) }}" required>
                    </div>
                    <div class="col-md-8">
                        <label class="form-label" for="partner_title">Title</label>
                        <input class="form-control" id="partner_title" name="partner[title]" value="{{ old('partner.title', $copy['partner']['title']) }}" required>
                    </div>
                    <div class="col-12">
                        <label class="form-label" for="partner_body">Text</label>
                        <textarea class="form-control" id="partner_body" name="partner[body]" rows="3" required>{{ old('partner.body', $copy['partner']['body']) }}</textarea>
                    </div>
                </div>
            </div>
        </div>

        <div class="card mb-3">
            <div class="card-header"><h5 class="mb-0">Bottom call to action (dark blue bar)</h5></div>
            <div class="card-body">
                <div class="mb-3">
                    <label class="form-label" for="cta_title">Heading</label>
                    <input class="form-control" id="cta_title" name="cta[title]" value="{{ old('cta.title', $copy['cta']['title']) }}" required>
                </div>
                <div>
                    <label class="form-label" for="cta_body">Text</label>
                    <textarea class="form-control" id="cta_body" name="cta[body]" rows="3" required>{{ old('cta.body', $copy['cta']['body']) }}</textarea>
                </div>
            </div>
        </div>

        <button class="btn btn-primary" type="submit">Save homepage</button>
        <a class="btn btn-outline-secondary" href="{{ route('public.home') }}" target="_blank" rel="noopener">View home page</a>
    </form>
@endsection