@extends('layouts.app')

@section('content')
<div class="row py-5">
    <div class="col-lg-7 mx-auto">
        <div class="card">
            <div class="card-body">
                <h5 class="card-title">
                    {{ isset($landingWebsite) ? 'Modifier une page web' : 'Créer une page web' }}
                </h5>
                @if(isset($landingWebsiteParent))
                    <h6 class="card-subtitle mb-2 text-muted">Page fille de : {{ $landingWebsiteParent->name }}</h6>
                @endif

                @include('components.alert_success')
                @include('components.alert_error')

                <form class="form-horizontal" method="POST" action="{{ isset($landingWebsite) ? route('landing_websites.update', ['landingWebsite' => $landingWebsite]) : route('landing_websites.store') }}">
                    {{ csrf_field() }}
                    {{ isset($landingWebsite) ? method_field('PUT') : '' }}

                    @if(isset($landingWebsiteParent))
                    <input type="hidden" value="{{ $landingWebsiteParent->id }}" name="parent_id"/>
                    @endif

                    <div class="mb-3 mt-4 mb-1">
                        <div class="form-check">
                            <input type="hidden" name="is_active" value="">
                            <input {{ isset($landingWebsite->parent_id) || isset($landingWebsiteParent) ? 'disabled' : '' }} id="is_active" type="checkbox" class="form-check-input" name="is_active" value="1" {{ old('is_active', ($landingWebsite->page_is_active) ?? '')  || !isset($landingWebsite) ? 'checked' : '' }}>
                            <label class="form-check-label" for="is_active">Cette page est active</label>
                            @if(isset($landingWebsite->parent_id) || isset($landingWebsiteParent))
                                <small class="form-text text-muted">
                                    Voir la <a href='{{route('landing_websites.edit', ['landingWebsite' => isset($landingWebsiteParent) ? $landingWebsiteParent->id : $landingWebsite->parent])}}' target='_blank'>page</a> parent pour la désactiver
                                </small>
                            @endif
                        </div>
                    </div>

                    <div class="mb-3 mt-4 mb-1">
                        <div class="form-check">
                            <input type="hidden" name="is_template" value="">
                            <input id="is_template" type="checkbox" class="form-check-input" name="is_template" value="1" {{ old('is_template', $landingWebsite->is_template ?? '') ? 'checked' : '' }}>
                            <label class="form-check-label" for="is_template">Cette page est un template</label>
                        </div>
                    </div>

                    <div class="mb-3">
                        <label for="name" class="col-form-label">Nom</label>
                        <input id="name" type="text" name="name" class="form-control" value="{{ old('name', $landingWebsite->name ?? '') }}" required>
                        <small class="form-text text-muted">
                        Nom de la page web (191 cararactères max)
                        </small>
                    </div>

                    <div class="mb-3">
                        <label for="title" class="col-form-label">Titre</label>
                        <input id="title" type="text" name="title" class="form-control" maxlength="250" value="{{ old('title', $landingWebsite->title ?? '') }}">
                        <small class="form-text text-muted">
                        Titre de la page web
                        </small>
                    </div>

                    @if(isset($landingWebsite))
                    <div class="mb-3">
                        <label for="slug" class="col-form-label">Slug</label>
                        <input id="slug" type="text" name="slug" class="form-control" value="{{ old('slug', $landingWebsite->slug ?? '') }}" required>
                        <small class="form-text text-muted">
                        Identifiant de l'url courte (191 cararactères max)
                        </small>
                    </div>
                    @endif

                    <div class="mb-3">
                        <label for="campaign_id" class="col-form-label">Id campagne</label>
                        <input id="campaign_id" type="text" name="campaign_id" class="form-control" value="{{ old('campaign_id', $landingWebsite->campaign_id ?? '') }}">
                        <small class="form-text text-muted">
                        Id de la campagne côté wellpack
                        </small>
                    </div>

                    <div class="mb-3">
                        <label for="og_title" class="col-form-label">Open graph titre</label>
                        <input id="og_title" type="text" name="og_title" class="form-control" maxlength="16" value="{{ old('og_title', $landingWebsite->og_title ?? '') }}">
                        <small class="form-text text-muted">
                        Titre de la preview (16 cararactères max)
                        </small>
                    </div>

                    <div class="mb-3">
                        <label for="og_description" class="col-form-label">Open graph description</label>
                        <input id="og_description" type="text" name="og_description" class="form-control" maxlength="40" value="{{ old('og_description', $landingWebsite->og_description ?? '') }}">
                        <small class="form-text text-muted">
                        Description de la preview (40 cararactères max)
                        </small>
                    </div>

                    <div class="row">
                        <div class="col-9">
                            <div class="mb-3">
                                <label for="og_image_url">Open graph image</label>
                                <input id="og_image_url" type="file" name="og_image_url" data-value="{{ old('og_image_url', $landingWebsite->og_image_url ?? '') }}">
                            </div>
                        </div>

                        <div class="col-3">
                            <div class="text-center"><img id="js-og_image_url_preview" class="w-100" src="{{ isset($landingWebsite->og_image_url) ? $landingWebsite->og_image_url : '#'}}" alt=""></div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-9">
                            <div class="mb-3">
                                <label for="favicon_url">Favicon image</label>
                                <input id="favicon_url" type="file" name="favicon_url" data-value="{{ old('favicon_url', $landingWebsite->favicon_url ?? '') }}">
                            </div>
                        </div>

                        <div class="col-3">
                            <div class="text-center"><img id="js-favicon_url_preview" class="w-100" src="{{ isset($landingWebsite->favicon_url) ? $landingWebsite->favicon_url.'/original.png' : '#'}}" alt=""></div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-12">
                            <div class="mb-3">
                                <label class="col-form-label">Variable Schema</label>
                                <div id="variable-schema-manager"
                                     data-landing-website-id="{{ $landingWebsite->id ?? '' }}"
                                     data-initial-schema-uuid="{{ $landingWebsite->variable_schema_uuid ?? '' }}">
                                </div>
                                <small class="form-text text-muted">
                                    Le schema definit les variables disponibles pour personnaliser la landing page
                                </small>
                            </div>
                        </div>
                    </div>


                    <div class="mb-3">
                        <label for="tags" class="col-form-label">Tags</label>
                        <input id="tags" type="text" name="tags" class="form-control" value="{{ isset($landingWebsite) ? $landingWebsite->tagsWithType('landing')->implode('name', ',') : '' }}" novalidate>
                    </div>

                    @if(!isset($landingWebsite))
                    <div class="mb-3">
                        <label for="template" class="col-form-label">Template de base</label>
                        <select id="template" class="form-select" name="template_id">
                            <option value="" selected>Pas de template</option>
                            @foreach($templates as $template)
                                <option value="{{ $template->id }}">{{ $template->id }} : {{ $template->name }} {{ $template->children->count() ? '+('.$template->children->count().' pages filles)' : ''}}</option>
                            @endforeach
                        </select>
                    </div>
                    @endif

                    <div class="text-center">
                        <button type="submit" class="btn btn-primary">Valider</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script>
wpAdmin = {}
wpAdmin.allTags = {!! json_encode($allTags) !!}
wpAdmin.landingWebsiteId = {{ isset($landingWebsite) ? $landingWebsite->id : 'null' }}
</script>
@vite(['resources/js/views/tags.js', 'resources/js/views/landing_create_edit.js'])
@endpush