117 lines
4.4 KiB
HTML
117 lines
4.4 KiB
HTML
{% extends "template.html" %}
|
|
{% block content %}
|
|
|
|
<div class="mt-3">
|
|
<form method="GET" action="{{ url_for('pages.spotify_search') }}">
|
|
<div class="mb-3">
|
|
<label for="search-query" class="form-label">Search</label>
|
|
<input type="text" name="q" id="search-query" class="form-control" placeholder="Artists, songs, or podcasts"
|
|
required value="{{ query }}">
|
|
</div>
|
|
<div class="mb-3">
|
|
<div class="row">
|
|
<div class="col">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" name="type" value="track" id="search-type-track" {{'checked'
|
|
if 'track' in types else '' }}>
|
|
<label class="form-check-label" for="search-type-track">
|
|
Tracks
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="col">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" name="type" value="album" id="search-type-album" {{'checked'
|
|
if 'album' in types else '' }}>
|
|
<label class="form-check-label" for="search-type-album">
|
|
Albums
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="col">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" name="type" value="artist" id="search-type-artist"
|
|
{{'checked' if 'artist' in types else '' }}>
|
|
<label class="form-check-label" for="search-type-artist">
|
|
Artists
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="col">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" name="type" value="playlist" id="search-type-playlist"
|
|
{{'checked' if 'playlist' in types else '' }}>
|
|
<label class="form-check-label" for="search-type-playlist">
|
|
Playlists
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="col">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" name="type" value="show" id="search-type-show" {{'checked'
|
|
if 'show' in types else '' }}>
|
|
<label class="form-check-label" for="search-type-show">
|
|
Shows
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="col">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" name="type" value="episode" id="search-type-episode"
|
|
{{'checked' if 'episode' in types else '' }}>
|
|
<label class="form-check-label" for="search-type-episode">
|
|
Episodes
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<button type="submit" class="btn btn-primary">Search</button>
|
|
</form>
|
|
</div>
|
|
|
|
{% if results: %}
|
|
<div class="alert alert-warning mt-3">
|
|
Writing to card will stop the daemon. You need to restart daemon afterwards!
|
|
</div>
|
|
<div class="spotify-search-results">
|
|
<div class="container">
|
|
<div class="row">
|
|
{% for type in types %}
|
|
{% if results[type + 's']: %}
|
|
{% with result = results[type + 's'] %}
|
|
<div
|
|
class="d-flex flex-column col col-xs-12 col-md-6 col-lg-6 {{ 'col-xl-4' if results|length > 2 else 'col-xl-6' }} mt-3">
|
|
<h3>{{ type | capitalize}}s</h3>
|
|
|
|
<ul class="list-group mb-3 flex-fill">
|
|
{% for item in result['items'] %}
|
|
<li href="#" class="list-group-item flex-fill">
|
|
<div class="d-flex w-100">
|
|
{% include "spotify/items/" + type + ".html" %}
|
|
</div>
|
|
|
|
{% include "spotify/items/menu.html" %}
|
|
</li>
|
|
{% endfor %}
|
|
</ul>
|
|
|
|
<div class="d-flex w-100 justify-content-between mt-auto">
|
|
<a href="{{ url_for('pages.spotify_search',q=query, type=type, limit=result['limit'], offset=result['offset']-result['limit']) }}"
|
|
class="btn btn-primary {{ 'disabled' if result['offset']==0 else '' }} " {{ 'disabled' if
|
|
result['offset']==0 else '' }}>«</a>
|
|
|
|
<a href="{{ url_for('pages.spotify_search',q=query, type=type, limit=result['limit'], offset=result['offset']+result['limit']) }}"
|
|
{{ 'disabled' if result['offset']>= result['total'] else ''}}
|
|
class="btn btn-primary {{ 'disabled' if result['offset']>= result['total'] else ''}}">»</a>
|
|
</div>
|
|
</div>
|
|
{% endwith %}
|
|
{% endif %}
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% endblock %} |