@extends('layouts.app')
@section('title', $playlist->name)

@section('content')

    <h2>Playlist "<i>{{$playlist->name}}</i>"</h2>
    <ul>
    @foreach($playlist->songs as $song)
        <li><a href='{{ route('song.show', ['song' => $song, 'playlist' => $playlist]) }}'>{{$song->title}}</a>
    @endforeach
    </ul>

    <form method="POST" action="/new/song">
        <h3>Add song to playlist</h3>
        @csrf
        <input name='title' placeholder='title' type='text'/>
        <input name='author' placeholder='author' type='text'/>
        <input name='key' placeholder='Key (e.g. Am)' type='text' />
        <input name='playlist' value='{{ $playlist->id }}' hidden/>
        <br/>
        <textarea name='text' placeholder='song lyrics/chords' style='width: 100%; height: 200px; font-family: monospace;' ></textarea>
        <button type='submit'>Add song!</button>
    </form>
@endsection