tubearchivist/tubearchivist-frontend
1
0
Fork 0
mirror of https://github.com/tubearchivist/tubearchivist-frontend.git synced 2024-11-22 11:50:14 +00:00
Code Issues Projects Releases Wiki Activity

style and toggle hide overwrite form

Browse Source
This commit is contained in:
simon 2022-03-24 15:43:15 +07:00
parent 8d1d09e698
commit d5cd90eb34
No known key found for this signature in database
GPG Key ID: 2C15AA5E89985DD4
3 changed files with 67 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
tubearchivist/home/templates/home/channel_id.html
View File

@ -54,35 +54,43 @@
<p>Watched: <button title="Mark all videos from {{ channel_info.channel_name }} as watched" type="button" id="watched-button" data-id="{{ channel_info.channel_id }}" onclick="isWatchedButton(this)">Mark as watched</button></p> <p>Watched: <button title="Mark all videos from {{ channel_info.channel_name }} as watched" type="button" id="watched-button" data-id="{{ channel_info.channel_id }}" onclick="isWatchedButton(this)">Mark as watched</button></p>
{% endif %} {% endif %}
<a href="/playlist/?search={{ channel_info.channel_id }}" title="Show all playlists belonging to {{ channel_info.channel_name }}"><button>Show Playlists</button></a> <a href="/playlist/?search={{ channel_info.channel_id }}" title="Show all playlists belonging to {{ channel_info.channel_name }}"><button>Show Playlists</button></a>
<button {% if channel_info.channel_overwrites %} class="danger-button"{% endif %} onclick="showOverwrite()">Overwrites Settings</button>
</div> </div>
</div> </div>
</div> </div>
<div class="info-box"> <div id="overwrite-form" class="info-box{% if not channel_info.channel_overwrites %} hidden-overwrite{% endif %}">
<div class="info-box-item"> <div class="info-box-item">
<form action="/channel/{{ channel_info.channel_id }}/" method="POST"> <form class="overwrite-form" action="/channel/{{ channel_info.channel_id }}/" method="POST">
{% csrf_token %} {% csrf_token %}
<p>Download format: <span class="settings-current"> <div class="overwrite-form-item">
{% if channel_info.channel_overwrites.download_format %} <p>Download format: <span class="settings-current">
{{ channel_info.channel_overwrites.download_format }} {% if channel_info.channel_overwrites.download_format %}
{% else %} {{ channel_info.channel_overwrites.download_format }}
False {% else %}
{% endif %}</span></p> False
{{ channel_overwrite_form.download_format }}<br> {% endif %}</span></p>
<p>Auto delete videos after x days: <span class="settings-current"> {{ channel_overwrite_form.download_format }}<br>
{% if channel_info.channel_overwrites.autodelete_days %} </div>
{{ channel_info.channel_overwrites.autodelete_days }} <div class="overwrite-form-item">
{% else %} <p>Auto delete videos after x days: <span class="settings-current">
False {% if channel_info.channel_overwrites.autodelete_days %}
{% endif %}</span></p> {{ channel_info.channel_overwrites.autodelete_days }}
{{ channel_overwrite_form.autodelete_days }}<br> {% else %}
<p>Index playlists: <span class="settings-current"> False
{% if channel_info.channel_overwrites.index_playlists %} {% endif %}</span></p>
{{ channel_info.channel_overwrites.index_playlists }} {{ channel_overwrite_form.autodelete_days }}<br>
{% else %} </div>
False <div class="overwrite-form-item">
{% endif %}</span></p> <p>Index playlists: <span class="settings-current">
{{ channel_overwrite_form.index_playlists }}<br> {% if channel_info.channel_overwrites.index_playlists %}
<button type="submit">Save</button> {{ channel_info.channel_overwrites.index_playlists }}
{% else %}
False
{% endif %}</span></p>
{{ channel_overwrite_form.index_playlists }}<br>
</div>
<div class="overwrite-form-item"></div>
<button type="submit">Save Channel Overwrites</button>
</form> </form>
</div> </div>
</div> </div>

31
tubearchivist/static/css/style.css
View File

@ -566,6 +566,28 @@ button:hover {
margin-bottom: 10px; margin-bottom: 10px;
} }
.overwrite-form {
display: grid;
grid-template-columns: 1fr 1fr;
width: 100%;
}
.overwrite-form button {
width: 200px;
}
.overwrite-form-item {
margin-bottom: 1rem;
}
.overwrite-form-item input {
width: 90%;
}
.hidden-overwrite {
display: none;
}
/* login */ /* login */
.login-page { .login-page {
display: flex; display: flex;
@ -1062,7 +1084,10 @@ button:hover {
.channel-list.grid, .channel-list.grid,
.video-item.list, .video-item.list,
.playlist-list.list, .playlist-list.list,
.playlist-list.grid { .playlist-list.grid,
.info-box-2,
.info-box-3,
.overwrite-form {
grid-template-columns: 1fr; grid-template-columns: 1fr;
} }
.playlist-item.list { .playlist-item.list {
@ -1101,10 +1126,6 @@ button:hover {
.sort select { .sort select {
margin: unset; margin: unset;
} }
.info-box-2,
.info-box-3 {
grid-template-columns: 1fr;
}
.description-box { .description-box {
display: block; display: block;
} }

9
tubearchivist/static/script.js
View File

@ -883,6 +883,15 @@ function showForm() {
animate('animate-icon', 'pulse-img'); animate('animate-icon', 'pulse-img');
} }
function showOverwrite() {
var overwriteDiv = document.getElementById("overwrite-form");
if (overwriteDiv.classList.contains("hidden-overwrite")) {
overwriteDiv.classList.remove("hidden-overwrite");
} else {
overwriteDiv.classList.add("hidden-overwrite")
}
}
function animate(elementId, animationClass) { function animate(elementId, animationClass) {
var toAnimate = document.getElementById(elementId); var toAnimate = document.getElementById(elementId);
if (toAnimate.className !== animationClass) { if (toAnimate.className !== animationClass) {