@extends('layouts.master')

@section('content')
  <div class="cover-image"></div>
  <div class="page-description">
    @if ($step === 1)
      @lang('descriptions.surf-tips.crud')
    @elseif ($step === 2)
      @lang('descriptions.surf-tips.request-approval')
    @endif
  </div>
  <div class="page-content">
    @if (Helper::createMode())
      @if (isset($surf_tip))
        <form method="POST" action="{{ route('surf-tips.store') }}" class="surf-tips-form model" enctype="multipart/form-data" accept-charset="UTF-8">
        @else
          <form method="POST" action="{{ route('surf-tips.store') }}" class="surf-tips-form" enctype="multipart/form-data" accept-charset="UTF-8">
      @endif
    @elseif (Helper::editMode())
      <form method="POST" action="{{ route('surf-tips.update', $surf_tip->id) }}" class="surf-tips-form" enctype="multipart/form-data" accept-charset="UTF-8">
    @endif
    @csrf
    @php
      $image_URL = '';
      if (isset($surf_tip)) {
          $image_URL = asset('images/surf_tips/' . $surf_tip->image);
      } elseif (old('image')) {
          $image_URL = asset('images/surf_tips/' . old('image'));
      }
    @endphp
    <div class="form-container">
      <div class="surf-tips-container">
        @if ($step === 1)
          <input type="hidden" name="step" value="1">
          <input type="checkbox" name="go-to-preview" value="1" id="go-to-preview" class="hidden">
          <input type="hidden" name="image" class="surf-tip-image">
          <div class="form-group @if ($errors->has('title')) has-error @endif">
            <div class="form-control-title">
              <span>Tragen Sie hier die Überschrift ein:</span>
            </div>
            <input type="text" name="title" class="surf-tip-title form-control" placeholder="..." maxlength="35" value="{{ !empty($surf_tip->title) ? $surf_tip->title : old('title') }}">
          </div>
          <div class="form-group @if ($errors->has('description')) has-error @endif">
            <div class="form-control-title">
              <span>Tragen Sie hier die Beschreibung ein:</span>
            </div>
            <textarea name="description" class="surf-tip-description" placeholder="..." maxlength="185"></textarea>
          </div>
          <div class="form-group @if ($errors->has('url')) has-error @endif">
            <div class="form-control-title">
              <span>Wie lautet die Internetadresse für die Verlinkung?</span>
            </div>
            <div class="form-control-hint">Geben Sie die Verlinkung bitte inkl. „http://“ an, wie z.B. http://www.haspa.de</div>
            <input type="text" name="url" class="surf-tip-url form-control" placeholder="..." value="{{ !empty($surf_tip->url) ? $surf_tip->url : old('url') }}">
          </div>
          <div class="form-group image-placeholder-area">
            <div class="form-control-title">
              <span>Wählen Sie ein Symbol aus:</span>
            </div>
            <div class="form-group image-placeholder @if ($errors->has('image')) has-error @endif" style="background-image: url({{ $image_URL }})">
              <div class="grey-button select-new-image select-surf-tip-image">Symbol auswählen</div>
            </div>
          </div>
        @elseif ($step === 2)
          <input type="hidden" name="step" value="2">
          <input type="checkbox" name="approval" value="1" id="approval" class="hidden">
          <div class="surf-tip-preview">
            <div class="headline">
              <div class="title">{{ $surf_tip->title }}</div>
            </div>
            <div class="link-content">
              <div class="link-image"
                style="background: transparent url(https://cms.haspa-signage.de/images/surf_tips/{{ $surf_tip->image }}) center/ cover;"></div>
              <div class="description">{{ $surf_tip->description }}</div>
            </div>
            <div class="link_more_info"></div>
          </div>
          <div class="approval-options">
            @include ('partials.approvers')
          </div>
        @endif
      </div>
    </div>
    @include ('partials.action_btns')
    </form>
  </div>
@endsection

@section('back_button')
  @if ($step === 1)
    <a href="{{ route('surf-tips.index') }}" class="grey-button">Zurück</a>
  @elseif ($step === 2)
    @if (Helper::createMode())
      <a href="{{ route('surf-tips.create.step-1') }}" class="grey-button">Zurück</a>
    @elseif (Helper::editMode())
      <a href="{{ route('surf-tips.edit.step-1', $surf_tip->id) }}" class="grey-button">Zurück</a>
    @endif
  @endif
@endsection