You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
277 lines
8.7 KiB
HTML
277 lines
8.7 KiB
HTML
{% macro shared_style() %}
|
|
<link href="/static/stylesheets/reset.css" rel="stylesheet" />
|
|
<style>
|
|
body {
|
|
font-family: sans-serif;
|
|
font-size: 1rem;
|
|
background-color: #222222;
|
|
color: whitesmoke;
|
|
margin: .8rem;
|
|
margin-top: 0;
|
|
line-height: 1.24;
|
|
}
|
|
table tr th, table tr td {
|
|
margin: 0;
|
|
padding: .2em;
|
|
border: solid white 1px;
|
|
}
|
|
table tr:nth-child(even) {
|
|
background-color: #333333;
|
|
}
|
|
a:any-link {
|
|
text-decoration: none;
|
|
color: lightcyan;
|
|
}
|
|
h1, h2 {
|
|
margin: 1rem 0 .5rem;
|
|
}
|
|
ul {
|
|
margin: .5rem 0;
|
|
}
|
|
form.form-single-button {
|
|
display: inline-block;
|
|
}
|
|
button,
|
|
.button {
|
|
font-size: .92em;
|
|
margin: .2rem;
|
|
padding: .16rem .2rem;
|
|
background-color: rgb(153, 50, 204);
|
|
color: whitesmoke;
|
|
border-radius: .3rem;
|
|
border: none;
|
|
cursor: pointer;
|
|
word-break: keep-all;
|
|
white-space: nowrap;
|
|
}
|
|
button:disabled {
|
|
background-color: rgb(98, 67, 113);
|
|
color: gray;
|
|
cursor: default;
|
|
}
|
|
.button-list {
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: center;
|
|
align-items: center;
|
|
align-content: center;
|
|
}
|
|
@media screen and (max-width: 700px) {
|
|
.button-list {
|
|
flex-direction: column;
|
|
}
|
|
}
|
|
/* navigation */
|
|
.navigation {
|
|
position: sticky;
|
|
z-index: 1000;
|
|
top: 0;
|
|
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
align-content: center;
|
|
justify-content: center;
|
|
gap: .8rem;
|
|
--height: 2.4em;
|
|
width: max-content;
|
|
height: var(--height);
|
|
border-radius: 0 0 var(--height) var(--height);
|
|
margin: 0 auto;
|
|
padding: 1.2em 1.6em;
|
|
|
|
background-color: #333333;
|
|
box-shadow: 0 0 .2rem .4rem #444444;
|
|
|
|
font-size: 1.2rem;
|
|
}
|
|
/* media element */
|
|
.element_view {
|
|
display: flex;
|
|
flex-wrap: wrap-reverse;
|
|
justify-content: space-between;
|
|
align-items: flex-end;
|
|
}
|
|
.element_view > .element_info {
|
|
display: block;
|
|
}
|
|
</style>
|
|
{% endmacro %}
|
|
|
|
{% macro hidden_redirect_back(fragment="") %}
|
|
<input type="hidden" name="redirect" value="{{ this_url() }}{{ ('#' + fragment) if fragment else '' }}"/>
|
|
{% endmacro %}
|
|
|
|
{% macro no_input_post_form(uri, text, fragment="") -%}
|
|
<form class="form-single-button" method="POST" action="{{ uri }}">
|
|
{{ hidden_redirect_back(fragment=fragment) }}
|
|
<button>{{ text }}</button>
|
|
</form>
|
|
{%- endmacro %}
|
|
|
|
{% macro post_form(uri, key, val, text, fragment="") %}
|
|
<form class="form-single-button" method="POST" action="{{ uri }}">
|
|
{{ hidden_redirect_back(fragment=fragment) }}
|
|
{% if caller is defined %}
|
|
{{ caller() }}
|
|
{% endif %}
|
|
<button name="{{ key }}" value="{{ val }}">{{ text }}</button>
|
|
</form>
|
|
{% endmacro %}
|
|
|
|
{% macro as_play_link(element, symbol='▶️') -%}
|
|
{# TODO do not hardcode certain extractors here #}
|
|
{% if element.extractor_name in ["ytdl", "youtube"] %}
|
|
{%- set opts = {
|
|
"video_uri": element.uri,
|
|
"start": element.progress,
|
|
} -%}
|
|
<a class="button play_button" href="entertainment-decider:///player/play?{{ opts | encode_options }}">{{ symbol | safe }}</a>
|
|
{% endif %}
|
|
{%- endmacro -%}
|
|
|
|
{% macro _navigation() %}
|
|
{% set links = {
|
|
"🏠 Home"|safe: "/",
|
|
"Latest Media": "/media",
|
|
"Short Media": "/media/short",
|
|
"Long Media": "/media/long",
|
|
"Unsorted": "/media/unsorted",
|
|
"Collections": "/collection",
|
|
"All Collections": "/collection/all",
|
|
"📌 Collections"|safe: "/collection/pinned",
|
|
"Collections To Watch": "/collection/to_watch",
|
|
"Statistics": "/stats",
|
|
"Tags": "/tag",
|
|
"Add Media": "/media/extract",
|
|
"Add Collection": "/collection/extract",
|
|
} %}
|
|
<div class="navigation">
|
|
{% for name, uri in links.items() %}
|
|
<a class="button" href="{{ uri }}">{{ name }}</a>
|
|
{% endfor %}
|
|
{{ no_input_post_form("/api/refresh/collections", "🔄"|safe) }}
|
|
</div>
|
|
{%- endmacro %}
|
|
|
|
{% macro body_header() %}
|
|
{{ _navigation() }}
|
|
{%- endmacro %}
|
|
|
|
{% macro media_element_buttons(element, show_fragment=True) %}
|
|
{% set api_uri = "/api/media/" + element.id|string %}
|
|
{% set fragment = ("media_element_" + element.id|string) if show_fragment else None %}
|
|
{{ as_play_link(element) }}
|
|
{% if element.watched %}
|
|
{{ post_form(api_uri, "watched", "false", "Unmark ✅"|safe, fragment) }}
|
|
{% elif element.ignored %}
|
|
{{ post_form(api_uri, "ignored", "false", "Unmark ❎"|safe, fragment) }}
|
|
{% else %}
|
|
{{ post_form(api_uri, "watched", "true", "✅"|safe, fragment) }}
|
|
{{ post_form(api_uri, "ignored", "true", "❎"|safe, fragment) }}
|
|
{% endif %}
|
|
{% endmacro %}
|
|
|
|
{% macro link_position_marker(link, prefix=false) -%}
|
|
{{- prefix and (link.season != 0 or link.episode != 0) | tenary(", ", "") -}}
|
|
{%- if link.season != 0 -%}
|
|
Season {{ link.season }}
|
|
{{- (link.episode != 0) | tenary(", ", "") -}}
|
|
{%- endif -%}
|
|
{%- if link.episode != 0 -%}
|
|
Episode {{ link.episode }}
|
|
{%- endif -%}
|
|
{%- endmacro %}
|
|
|
|
{% macro media_entry_content(element, show_fragment=True) %}
|
|
{{ media_element_buttons(element, show_fragment=show_fragment) }}
|
|
{{ element.release_date.strftime("%d.%m.%Y") }}
|
|
{{ element.length | timedelta }}
|
|
<a href="{{ element.info_link }}">{{ element.title }}</a>
|
|
{%- endmacro %}
|
|
|
|
{% macro link_entry_content(link, show_fragment=True) %}
|
|
{{ media_entry_content(link.element, show_fragment=show_fragment) -}}
|
|
{{- link_position_marker(link, prefix=true) -}}
|
|
{%- endmacro %}
|
|
|
|
{% macro collection_entry_content(collection) %}
|
|
<a href="{{ collection.info_link }}">{{ collection.title }}</a>
|
|
{%- endmacro %}
|
|
|
|
{% macro media_entry(element, show_fragment=True) %}
|
|
<li id="media_element_{{ element.id }}">
|
|
{{ media_entry_content(element, show_fragment=show_fragment) }}
|
|
</li>
|
|
{%- endmacro %}
|
|
|
|
{% macro link_entry(link, show_fragment=True) %}
|
|
<li id="media_element_{{ link.element.id }}">
|
|
{{ link_entry_content(link, show_fragment=show_fragment) }}
|
|
</li>
|
|
{%- endmacro %}
|
|
|
|
{% macro collection_entry(collection) %}
|
|
<li id="media_collection_{{ collection.id }}">
|
|
{{ collection_entry_content(collection, show_fragment=show_fragment) }}
|
|
</li>
|
|
{%- endmacro %}
|
|
|
|
{% macro media_table(media_list) %}
|
|
<table>
|
|
<tr>
|
|
<th>Date</th>
|
|
<th>⏲️</th>
|
|
<th></th>
|
|
<th>Title</th>
|
|
</tr>
|
|
{% for media in media_list %}
|
|
<tr>
|
|
<td>
|
|
{{- media.release_date.strftime("%d.%m.%Y") -}}
|
|
</td>
|
|
<td>
|
|
{{- media.left_length | timedelta -}}
|
|
</td>
|
|
<td class="button-list">
|
|
{{- media_element_buttons(media) -}}
|
|
</td>
|
|
<td><a href="{{ media.info_link }}">{{ media.title }}</a></td>
|
|
</tr>
|
|
{% endfor %}
|
|
</table>
|
|
{%- endmacro %}
|
|
|
|
{% macro link_differ_table(link_list) %}
|
|
<table>
|
|
<tr>
|
|
<th>Date</th>
|
|
<th>⏲️</th>
|
|
<th></th>
|
|
<th>Title</th>
|
|
<th>From Collection</th>
|
|
</tr>
|
|
{% for link in link_list %}
|
|
<tr>
|
|
<td>
|
|
{{- link.element.release_date.strftime("%d.%m.%Y") -}}
|
|
</td>
|
|
<td>
|
|
{{- link.element.left_length | timedelta -}}
|
|
</td>
|
|
<td class="button-list">
|
|
{{- media_element_buttons(link.element) -}}
|
|
</td>
|
|
<td>
|
|
<a href="{{ link.element.info_link }}">{{ link.element.title }}</a>
|
|
</td>
|
|
<td>
|
|
<a href="{{ link.collection.info_link }}">{{ link.collection.id }}</a>
|
|
{{- link_position_marker(link, prefix=true) -}}
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</table>
|
|
{%- endmacro %}
|