@extends('superadmin.layouts.app')

@if (isset($content) && $content->exists)
@section('title', 'Contenuto Pubblico #' . $content->id)
@else
@section('title', 'Nuovo Contenuto Pubblico')
@endif

@section('content')
@component('components.superadmin.form')
@if (isset($content) && $content->exists)
{{ Form::model($content, ['route' => ['superadmin.public-contents.update', $content->id], 'method' => 'PATCH', 'files' => true, 'id' => 'public-content-form']) }}
@else
{{ Form::model($content, ['route' => 'superadmin.public-contents.store', 'files' => true, 'id' => 'public-content-form']) }}
@endif

<fieldset class="form-group public-content-page" data-public-url-base="{{ url('/content') }}" data-existing-slug="{{ isset($content) && $content->exists ? $content->slug : '' }}">
  <legend class="col-form-label col-12">
    @if (isset($content) && $content->exists)
    Modifica contenuto pubblico
    @else
    Crea contenuto pubblico
    @endif
  </legend>

  <div class="form-row">
    <div class="form-group col-md-6">
      {{ Form::label('title', 'Titolo*') }}
      {{ Form::text('title', null, ['class' => 'form-control js-public-content-title', 'autocomplete' => 'off']) }}
    </div>

    <div class="form-group col-md-6">
      <label class="d-block">URL pubblica</label>
      <div class="input-group">
        <input type="text" class="form-control js-public-url-preview" value="{{ isset($content) && $content->exists ? $content->public_url : '' }}" readonly>
        <div class="input-group-append">
          <a href="{{ isset($content) && $content->exists ? $content->public_url : '#' }}" target="_blank" class="btn btn-outline-secondary js-public-url-link {{ isset($content) && $content->exists ? '' : 'disabled' }}">Apri</a>
        </div>
      </div>
      <small class="form-text text-muted">Lo slug viene generato automaticamente dal titolo.</small>
    </div>
  </div>

  <div class="form-row">
    <div class="form-group col-12">
      <label for="cover_image" class="d-block">Immagine di copertina</label>
      @if (isset($content) && $content->exists && $content->cover_image_url)
      <div class="mb-3">
        <img src="{{ $content->cover_image_url }}" alt="{{ $content->title }}" class="img-thumbnail" style="max-width: 220px;">
      </div>
      @endif
      {{ Form::file('cover_image', ['class' => 'form-control-file']) }}
      <small class="form-text text-muted">Opzionale. Utile soprattutto per i PDF.</small>
    </div>
  </div>

  <div class="form-row">
    <div class="form-group col-12">
      {{ Form::label('description', 'Descrizione') }}
      {{ Form::textarea('description', null, ['class' => 'form-control', 'rows' => 4]) }}
    </div>
  </div>

  <div class="form-row">
    <div class="form-group col-md-12">
        {{ Form::label('type', 'Tipo contenuto*') }}
        {{ Form::select('type', $types, isset($content) ? $content->type : null, ['class' => 'form-control js-public-content-type', 'placeholder' => 'Seleziona tipo contenuto']) }}
    </div>
  </div>



  <div class="form-row js-file-field" data-types="pdf,video_upload">
    <div class="form-group col-12">
      <label for="file" class="d-block js-file-label">File*</label>
      @if (isset($content) && $content->exists && $content->file_url)
      <p class="mb-2">
        <a href="{{ $content->file_url }}" target="_blank">Apri file attuale</a>
      </p>
      @endif
      {{ Form::file('file', ['class' => 'form-control-file']) }}
      <small class="form-text text-muted js-file-help">
        Carica un PDF oppure un file MP4 in base al tipo selezionato. Limite upload server: {{ ini_get('upload_max_filesize') }}.
      </small>
    </div>
  </div>

  <div class="form-row js-external-url-field" data-types="video_external">
    <div class="form-group col-12">
      {{ Form::label('external_url', 'URL video esterno*') }}
      {{ Form::url('external_url', null, ['class' => 'form-control', 'placeholder' => 'https://www.youtube.com/watch?v=...']) }}
      <small class="form-text text-muted">Supportati: YouTube e Vimeo.</small>
    </div>
  </div>


</fieldset>

{{ Form::button('<i class="fa fa-save mr-2"></i> Salva contenuto', ['type' => 'submit', 'class' => 'btn btn-block btn-optovista p-3']) }}
{{ Form::close() }}
@endcomponent
@endsection

@push('scripts')
<script type="text/javascript">
  $(document).ready(function() {
    var container = $('.public-content-page');
    var titleInput = container.find('.js-public-content-title');
    var typeInput = container.find('.js-public-content-type');
    var previewInput = container.find('.js-public-url-preview');
    var previewLink = container.find('.js-public-url-link');
    var baseUrl = container.data('public-url-base');
    var existingSlug = container.data('existing-slug');

    function slugify(value) {
      return (value || '')
        .toString()
        .toLowerCase()
        .trim()
        .replace(/[^a-z0-9]+/g, '-')
        .replace(/^-+|-+$/g, '') || 'contenuto';
    }

    function updatePreviewUrl() {
      var slug = existingSlug && !titleInput.val() ? existingSlug : slugify(titleInput.val());
      var url = baseUrl + '/' + slug;

      previewInput.val(url);
      previewLink.attr('href', url);
      previewLink.toggleClass('disabled', !slug);
    }

    function updateTypeFields() {
      var selectedType = typeInput.val();
      container.find('[data-types]').each(function() {
        var types = ($(this).data('types') || '').split(',');
        $(this).toggle(types.indexOf(selectedType) !== -1);
      });

      var fileLabel = container.find('.js-file-label');
      var fileHelp = container.find('.js-file-help');

      if (selectedType === 'pdf') {
        fileLabel.text('File PDF*');
        fileHelp.text('Carica un file PDF. Limite upload server: {{ ini_get('upload_max_filesize') }}.');
      } else if (selectedType === 'video_upload') {
        fileLabel.text('Video MP4*');
        fileHelp.text('Carica un file video MP4. Limite upload server: {{ ini_get('upload_max_filesize') }}.');
      } else {
        fileLabel.text('File');
        fileHelp.text('Il file non e richiesto per questo tipo. Limite upload server: {{ ini_get('upload_max_filesize') }}.');
      }
    }

    titleInput.on('input', updatePreviewUrl);
    typeInput.on('change', updateTypeFields);

    updatePreviewUrl();
    updateTypeFields();
  });
</script>
@endpush