@extends('layouts.master')

@section('content')
  <div class="cover-image"></div>
  <div class="page-description">
    @if ($step === 1)
      @lang('descriptions.monothema-music.crud')
    @elseif ($step === 2)
      @lang('descriptions.monothema-music.request-approval')
    @endif
  </div>
  <div class="page-content">
    @if ($step === 1)
      @php
        $selected_album = 0;
        if (isset($mt_music) && isset($mt_music->album)) {
            $selected_album = $mt_music->album;
        }
      @endphp
      <div class="albums">
        @foreach ($albums as $album_id => $album_name)
          @php
            if (Helper::createMode()) {
                $step2_URL = route('monothema-music.create.step-2');
            } elseif (Helper::editMode()) {
                $step2_URL = route('monothema-music.edit.step-2', $mt_music->id);
            }
          @endphp
          <a class="album album-{{ $album_id }}" style="background-image: url({{ asset('images/music_albums/AlbumCover_' . $album_id . '.png') }})"
            href="{{ $step2_URL . '?album=' . $album_id }}">
            @if ($selected_album === $album_id)
              <div class="selected_album"></div>
            @endif
          </a>
        @endforeach
      </div>
    @elseif ($step === 2)
      @if (Helper::createMode())
        @if (isset($mt_music))
          <form method="POST" action="{{ route('monothema-music.store') }}" class="monothema-music-form model" enctype="multipart/form-data"
            accept-charset="UTF-8">
          @else
            <form method="POST" action="{{ route('monothema-music.store') }}" class="monothema-music-form" enctype="multipart/form-data" accept-charset="UTF-8">
        @endif
      @elseif (Helper::editMode())
        <form method="POST" action="{{ route('monothema-music.update', $mt_music->id) }}" class="monothema-music-form" enctype="multipart/form-data"
          accept-charset="UTF-8">
      @endif
      @csrf
      <div class="form-container">
        <div class="albums">
          <div class="album" style="background-image: url({{ asset('images/music_albums/AlbumCover_' . $mt_music->album . '.png') }})"></div>
        </div>
        <div class="monothema-music-container">
          <input type="checkbox" name="approval" value="1" id="approval" class="hidden">
          <div class="approval-options">
            @include ('partials.approvers')
          </div>
        </div>
      </div>
      @include ('partials.simple_action_btns')
      </form>
    @endif
  </div>
@endsection

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