Added indexed lists and link edition in tunes
This commit is contained in:
marc
@@ -0,0 +1,66 @@
|
||||
<li id="tema-link-{{ link.id }}">
|
||||
<form class="flex flex-row items-start">
|
||||
{% include "fragments/tema/link_icon.html" %}
|
||||
<div class="grow my-2">
|
||||
<p class="text-sm text-beige">
|
||||
<select id="tema-link-{{ link.id }}-content-type"
|
||||
name="content_type"
|
||||
value="{{ link.content_type.value.capitalize() }}"
|
||||
class="border border-yellow-50 focus:outline-none
|
||||
rounded
|
||||
text-yellow-50 text-center
|
||||
bg-brown p-0 m-0">
|
||||
<option value="{{ link.content_type.value }}">
|
||||
{{ link.content_type.value.capitalize() }}
|
||||
</option>
|
||||
{% for ct in ContentType %}
|
||||
{% if ct != link.content_type %}
|
||||
<option value="{{ ct.value }}">
|
||||
{{ ct.value.capitalize() }}
|
||||
</option>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</select>
|
||||
</p>
|
||||
<p>
|
||||
<input name="title"
|
||||
placeholder="Títol de l'enllaç"
|
||||
value="{{ link.title }}"
|
||||
class="border border-beige focus:outline-none
|
||||
rounded w-full
|
||||
bg-brown p-1 my-1"
|
||||
/>
|
||||
</p>
|
||||
<p>
|
||||
<input name="url"
|
||||
placeholder="URL de l'enllaç"
|
||||
value="{{ link.url }}"
|
||||
class="border border-beige focus:outline-none
|
||||
rounded w-full
|
||||
bg-brown p-1 my-1"
|
||||
hx-get="/api/tema/{{ tema.id }}/link/{{ link_id }}/icon"
|
||||
hx-trigger="keyup delay:500ms changed"
|
||||
hx-target="#link-icon-{{ link.id }}"
|
||||
hx-include="[name='content_type']"
|
||||
hx-swap="outerHTML"
|
||||
/>
|
||||
</p>
|
||||
</div>
|
||||
<div class="m-2 text-sm text-beige">
|
||||
<button title="Desa els canvis"
|
||||
class="mx-1"
|
||||
hx-put="/api/tema/{{ tema.id }}/link/{{ link.id }}"
|
||||
hx-target="#tema-link-{{ link.id }}"
|
||||
hx-swap="outerHTML">
|
||||
<i class="fa fa-check" aria-hidden="true"></i>
|
||||
</button>
|
||||
<button title="Descarta els canvis"
|
||||
class="mx-1"
|
||||
hx-get="/api/tema/{{ tema.id }}/link/{{ link.id }}"
|
||||
hx-target="#tema-link-{{ link.id }}"
|
||||
hx-swap="outerHTML">
|
||||
<i class="fa fa-times" aria-hidden="true"></i>
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</li>
|
||||
@@ -1,4 +1,4 @@
|
||||
<form id="tema-lyric-{{ lyric_idx }}">
|
||||
<form id="tema-lyric-{{ lyric.id }}">
|
||||
<h5 class="text-sm text-beige text-right">
|
||||
<input name="title"
|
||||
placeholder="Nom de la lletra"
|
||||
@@ -9,15 +9,15 @@
|
||||
/>
|
||||
<button title="Desa els canvis"
|
||||
class="mx-1"
|
||||
hx-put="/api/tema/{{ tema.id }}/lyric/{{ lyric_idx }}"
|
||||
hx-target="#tema-lyric-{{ lyric_idx }}"
|
||||
hx-put="/api/tema/{{ tema.id }}/lyric/{{ lyric.id }}"
|
||||
hx-target="#tema-lyric-{{ lyric.id }}"
|
||||
hx-swap="outerHTML">
|
||||
<i class="fa fa-check" aria-hidden="true"></i>
|
||||
</button>
|
||||
<button title="Descarta els canvis"
|
||||
class="mx-1"
|
||||
hx-get="/api/tema/{{ tema.id }}/lyric/{{ lyric_idx }}"
|
||||
hx-target="#tema-lyric-{{ lyric_idx }}"
|
||||
hx-get="/api/tema/{{ tema.id }}/lyric/{{ lyric.id }}"
|
||||
hx-target="#tema-lyric-{{ lyric.id }}"
|
||||
hx-swap="outerHTML">
|
||||
<i class="fa fa-times" aria-hidden="true"></i>
|
||||
</button>
|
||||
|
||||
@@ -1,21 +1,29 @@
|
||||
<li class="flex flex-row items-start">
|
||||
<div class="p-2 m-2 text-beige border border-beige rounded-md">
|
||||
<a href="{{ link.url }}" target="_blank">
|
||||
{% if link.subtype == LinkSubtype.SPOTIFY %}
|
||||
{% include "icons/spotify.svg" %}
|
||||
{% elif link.subtype == LinkSubtype.YOUTUBE %}
|
||||
{% include "icons/youtube.svg" %}
|
||||
{% elif link.subtype == LinkSubtype.PDF %}
|
||||
{% include "icons/pdf.svg" %}
|
||||
{% elif link.type == LinkType.AUDIO %}
|
||||
{% include "icons/notes.svg" %}
|
||||
{% else %}
|
||||
{% include "icons/link.svg" %}
|
||||
{% endif %}
|
||||
</a>
|
||||
</div>
|
||||
<li id="tema-link-{{ link.id }}"
|
||||
class="flex flex-row items-start">
|
||||
{% include "fragments/tema/link_icon.html" %}
|
||||
<div class="my-2">
|
||||
<p class="text-sm text-beige">Partitura</p>
|
||||
<p>Hola</p>
|
||||
<p class="text-sm text-beige">
|
||||
{{ link.content_type.value.capitalize() }}
|
||||
</p>
|
||||
{% if link.title %}
|
||||
<p>{{ link.title }}</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% if logged_in %}
|
||||
<div class="grow"></div>
|
||||
<div class="m-2 text-sm text-beige">
|
||||
<button title="Modifica l'enllaç"
|
||||
hx-get="/api/tema/{{ tema.id }}/editor/link/{{ link.id }}"
|
||||
hx-target="#tema-link-{{ link.id }}"
|
||||
hx-swap="outerHTML">
|
||||
<i class="fa fa-pencil" aria-hidden="true"></i>
|
||||
</button>
|
||||
<button title="Esborra l'enllaç"
|
||||
hx-delete="/api/tema/{{ tema.id }}/link/{{ link.id }}"
|
||||
hx-target="#tema-link-{{ link.id }}"
|
||||
hx-swap="outerHTML">
|
||||
<i class="fa fa-times" aria-hidden="true"></i>
|
||||
</button>
|
||||
</div>
|
||||
{% endif %}
|
||||
</li>
|
||||
|
||||
16
folkugat_web/assets/templates/fragments/tema/link_icon.html
Normal file
16
folkugat_web/assets/templates/fragments/tema/link_icon.html
Normal file
@@ -0,0 +1,16 @@
|
||||
<div id="link-icon-{{ link.id }}"
|
||||
class="p-2 m-2 text-beige border border-beige rounded-md">
|
||||
<a href="{{ link.url }}" target="_blank">
|
||||
{% if link.link_type == LinkType.SPOTIFY %}
|
||||
{% include "icons/spotify.svg" %}
|
||||
{% elif link.link_type == LinkType.YOUTUBE %}
|
||||
{% include "icons/youtube.svg" %}
|
||||
{% elif link.link_type == LinkType.PDF %}
|
||||
{% include "icons/pdf.svg" %}
|
||||
{% elif link.content_type == ContentType.AUDIO %}
|
||||
{% include "icons/notes.svg" %}
|
||||
{% else %}
|
||||
{% include "icons/link.svg" %}
|
||||
{% endif %}
|
||||
</a>
|
||||
</div>
|
||||
@@ -4,13 +4,12 @@
|
||||
{% endif %}
|
||||
|
||||
{% if tema.links %}
|
||||
{% for link in tema.links %}
|
||||
<ul class="flex flex-col justify-center"
|
||||
id="new-link-target">
|
||||
{% set link_idx = loop.index0 %}
|
||||
{% include "fragments/tema/link.html" %}
|
||||
{% for link in tema.links %}
|
||||
{% include "fragments/tema/link.html" %}
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
{% if logged_in %}
|
||||
@@ -19,7 +18,7 @@
|
||||
class="text-sm text-beige text-right"
|
||||
hx-post="/api/tema/{{ tema.id }}/link"
|
||||
hx-target="#new-link-target"
|
||||
hx-swap="beforebegin">
|
||||
hx-swap="beforeend transition:true">
|
||||
<i class="fa fa-plus" aria-hidden="true"></i>
|
||||
Afegeix un enllaç
|
||||
</button>
|
||||
|
||||
@@ -1,18 +1,18 @@
|
||||
<div id="tema-lyric-{{ lyric_idx }}">
|
||||
<div id="tema-lyric-{{ lyric.id }}">
|
||||
<h5 class="text-sm text-beige text-right">
|
||||
{{ lyric.title }}
|
||||
{% if logged_in %}
|
||||
<button title="Modifica la lletra"
|
||||
class="mx-1"
|
||||
hx-get="/api/tema/{{ tema.id }}/editor/lyric/{{ lyric_idx }}"
|
||||
hx-target="#tema-lyric-{{ lyric_idx }}"
|
||||
hx-get="/api/tema/{{ tema.id }}/editor/lyric/{{ lyric.id }}"
|
||||
hx-target="#tema-lyric-{{ lyric.id }}"
|
||||
hx-swap="outerHTML">
|
||||
<i class="fa fa-pencil" aria-hidden="true"></i>
|
||||
</button>
|
||||
<button title="Esborra la lletra"
|
||||
class="mx-1"
|
||||
hx-delete="/api/tema/{{ tema.id }}/lyric/{{ lyric_idx }}"
|
||||
hx-target="#tema-lyric-{{ lyric_idx }}"
|
||||
hx-delete="/api/tema/{{ tema.id }}/lyric/{{ lyric.id }}"
|
||||
hx-target="#tema-lyric-{{ lyric.id }}"
|
||||
hx-swap="outerHTML">
|
||||
<i class="fa fa-times" aria-hidden="true"></i>
|
||||
</button>
|
||||
|
||||
@@ -4,7 +4,6 @@
|
||||
|
||||
{% if tema.lyrics %}
|
||||
{% for lyric in tema.lyrics %}
|
||||
{% set lyric_idx = loop.index0 %}
|
||||
{% include "fragments/tema/lyric.html" %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
@@ -4,18 +4,6 @@
|
||||
{% include "fragments/tema/title.html" %}
|
||||
<div class="text-left">
|
||||
|
||||
<!-- {% if tema.scores() %} -->
|
||||
<!-- temes -->
|
||||
<!-- <h4 class="text-xl text-beige">Tema</h4> -->
|
||||
<!-- <hr class="h-px mt-1 mb-3 bg-beige border-0"> -->
|
||||
<!-- {% for file in tema.files %} -->
|
||||
<!-- {% if file.type == FileType.PDF %} -->
|
||||
<!-- {% set pdf_url = file.path %} -->
|
||||
<!-- {% include "fragments/pdf_viewer.html" %} -->
|
||||
<!-- {% endif %} -->
|
||||
<!-- {% endfor %} -->
|
||||
<!-- {% endif %} -->
|
||||
|
||||
{% include "fragments/tema/lyrics.html" %}
|
||||
{% include "fragments/tema/links.html" %}
|
||||
|
||||
|
||||
@@ -13,16 +13,16 @@
|
||||
{% for link in tema.links %}
|
||||
<li class="p-2 m-2 text-beige border border-beige rounded-md">
|
||||
<a href="{{ link.url }}" target="_blank">
|
||||
{% if link.type == LinkType.AUDIO %}
|
||||
{% if link.subtype == LinkSubtype.SPOTIFY %}
|
||||
{% if link.content_type == ContentType.AUDIO %}
|
||||
{% if link.link_type == LinkType.SPOTIFY %}
|
||||
{% include "icons/spotify.svg" %}
|
||||
{% elif link.subtype == LinkSubtype.YOUTUBE %}
|
||||
{% elif link.link_type == LinkType.YOUTUBE %}
|
||||
{% include "icons/youtube.svg" %}
|
||||
{% else %}
|
||||
{% include "icons/notes.svg" %}
|
||||
{% endif %}
|
||||
{% elif link.type == LinkType.SCORE %}
|
||||
{% if link.subtype == LinkSubtype.PDF %}
|
||||
{% elif link.content_type == ContentType.PARTITURA %}
|
||||
{% if link.link_type == LinkType.PDF %}
|
||||
{% include "icons/pdf.svg" %}
|
||||
{% else %}
|
||||
{% include "icons/link.svg" %}
|
||||
|
||||
Reference in New Issue
Block a user