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.

287 lines
9.0 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;
}
.element_view > .element_info > .description {
display: block;
font-size: .8rem;
max-width: 100%;
max-height: 16rem;
overflow-x: scroll;
overflow-y: scroll;
white-space: pre-wrap;
unicode-bidi: embed;
}
</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='&#9654;&#65039;') -%}
{# 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 = {
"&#x1f3e0; Home"|safe: "/",
"Latest Media": "/media",
"Short Media": "/media/short",
"Long Media": "/media/long",
"Unsorted": "/media/unsorted",
"Collections": "/collection",
"All Collections": "/collection/all",
"&#x1f4cc; 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", "&#x1f504;"|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 &#9989;"|safe, fragment) }}
{% elif element.ignored %}
{{ post_form(api_uri, "ignored", "false", "Unmark &#10062;"|safe, fragment) }}
{% else %}
{{ post_form(api_uri, "watched", "true", "&#9989;"|safe, fragment) }}
{{ post_form(api_uri, "ignored", "true", "&#10062;"|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>&#9202;&#65039;</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>&#9202;&#65039;</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 %}