71 lines
3.5 KiB
HTML
71 lines
3.5 KiB
HTML
{% extends "home/base.html" %}
|
|
{% block content %}
|
|
{% load static %}
|
|
<div class="title-bar">
|
|
<h1>Recent Videos</h1>
|
|
</div>
|
|
<div class="two-col">
|
|
<div class="sort">
|
|
<div>
|
|
<p>Sort order from <span class="settings-current">{{ sortorder }}</span>
|
|
<select name="sort" id="sort" onchange="sortChange(this.value)">
|
|
<option value="" disabled selected> -- change sort order -- </option>
|
|
<option value="published">date published</option>
|
|
<option value="downloaded">date downloaded</option>
|
|
</select></p>
|
|
</div>
|
|
<div>
|
|
<p>Hide watched videos <span class="settings-current">{{ hide_watched }}</span>
|
|
<select name="watched" id="watched" onchange="hideWatched(this.value)">
|
|
<option value="" disabled selected> -- change hide watched -- </option>
|
|
<option value="0">show watched videos</option>
|
|
<option value="1">hide watched videos</option>
|
|
</select></p>
|
|
</div>
|
|
</div>
|
|
<div class="search-form">
|
|
<form action="/" method="POST" id="search-box">
|
|
{% csrf_token %}
|
|
<input name="videoSearch" list="resultBox" type="text" id="searchInput" autocomplete="off">
|
|
</form>
|
|
<div class="search-icon">
|
|
<img src="{% static 'img/icon-search.svg' %}" alt="search-icon" onclick="showSearch()">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="player" class="video-player"></div>
|
|
<div class="video-list">
|
|
{% if videos %}
|
|
{% for video in videos %}
|
|
<div class="video-item">
|
|
<a href="#player" data-src="/media/{{ video.source.media_url }}" data-thumb="/cache/videos/{{ video.source.youtube_id }}.jpg" data-title="{{ video.source.title }}" data-channel="{{ video.source.channel.channel_name }}" data-id="{{ video.source.youtube_id }}" onclick="createPlayer(this)">
|
|
<div class="video-thumb-wrap">
|
|
<div class="video-thumb">
|
|
<img src="/cache/videos/{{ video.source.youtube_id }}.jpg" alt="video-thumb">
|
|
</div>
|
|
<div class="video-play">
|
|
<img src="{% static 'img/icon-play.svg' %}" alt="play-icon">
|
|
</div>
|
|
</div>
|
|
</a>
|
|
<div class="video-desc">
|
|
<div class="video-desc-player" id="video-info-{{ video.source.youtube_id }}">
|
|
{% if video.source.player.watched %}
|
|
<img src="{% static 'img/icon-seen.svg' %}" alt="seen-icon" id="{{ video.source.youtube_id }}" class="seen-icon">
|
|
{% else %}
|
|
<img src="{% static 'img/icon-unseen.svg' %}" alt="unseen-icon" id="{{ video.source.youtube_id }}" onclick="isWatched(this.id)" class="unseen-icon" title="Mark as watched.">
|
|
{% endif %}
|
|
<span>{{ video.source.published }} | {{ video.source.player.duration_str }}</span>
|
|
</div>
|
|
<div>
|
|
<a href="{% url 'channel_id' video.source.channel.channel_id %}"><h3>{{ video.source.channel.channel_name }}</h3></a>
|
|
<a class="video-more" href="{% url 'video' video.source.youtube_id %}"><h2>{{ video.source.title }}</h2></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
{% else %}
|
|
<h2>No videos found...</h2>
|
|
{% endif %}
|
|
</div>
|
|
{% endblock content %} |