ff_plugins/anime_downloader
1
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

feat: Enhance loading indicator UI with custom spinners and improve download cancellation logic for custom downloaders.

Browse Source
This commit is contained in:
projectdx
2025-12-29 20:42:59 +09:00
parent 6b9432ca4d
commit 8ecb8f33ce
7 changed files with 257 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
templates/anime_downloader_anilife_queue.html
View File

@@ -259,4 +259,43 @@
}
</script>
<style>
/* 로딩 인디케이터 오버라이드 */
#loading {
background: rgba(15, 23, 42, 0.85) !important;
backdrop-filter: blur(8px) !important;
}
#loading img {
display: none !important;
}
#loading::after {
content: '';
width: 50px;
height: 50px;
border: 4px solid rgba(96, 165, 250, 0.2);
border-top-color: #60a5fa;
border-radius: 50%;
animation: spin 0.8s linear infinite;
}
@keyframes spin {
to { transform: rotate(360deg); }
}
#modal_loading img {
display: none !important;
}
#modal_loading::after {
content: '';
width: 40px;
height: 40px;
border: 3px solid rgba(96, 165, 250, 0.2);
border-top-color: #60a5fa;
border-radius: 50%;
animation: spin 0.8s linear infinite;
}
</style>
{% endblock %}

38
templates/anime_downloader_anilife_request.html
View File

@@ -933,5 +933,43 @@
transform: rotate(360deg);
}
}
/* 로딩 인디케이터 오버라이드 */
#loading {
background: rgba(15, 23, 42, 0.85) !important;
backdrop-filter: blur(8px) !important;
}
#loading img {
display: none !important;
}
#loading::after {
content: '';
width: 50px;
height: 50px;
border: 4px solid rgba(96, 165, 250, 0.2);
border-top-color: #60a5fa;
border-radius: 50%;
animation: loader-spin 0.8s linear infinite;
}
@keyframes loader-spin {
to { transform: rotate(360deg); }
}
#modal_loading img {
display: none !important;
}
#modal_loading::after {
content: '';
width: 40px;
height: 40px;
border: 3px solid rgba(96, 165, 250, 0.2);
border-top-color: #60a5fa;
border-radius: 50%;
animation: loader-spin 0.8s linear infinite;
}
</style>
{% endblock %}

39
templates/anime_downloader_linkkf_queue.html
View File

@@ -307,4 +307,43 @@ function status_html(data) {
}
</script>
<style>
/* 로딩 인디케이터 오버라이드 */
#loading {
background: rgba(15, 23, 42, 0.85) !important;
backdrop-filter: blur(8px) !important;
}
#loading img {
display: none !important;
}
#loading::after {
content: '';
width: 50px;
height: 50px;
border: 4px solid rgba(96, 165, 250, 0.2);
border-top-color: #60a5fa;
border-radius: 50%;
animation: spin 0.8s linear infinite;
}
@keyframes spin {
to { transform: rotate(360deg); }
}
#modal_loading img {
display: none !important;
}
#modal_loading::after {
content: '';
width: 40px;
height: 40px;
border: 3px solid rgba(96, 165, 250, 0.2);
border-top-color: #60a5fa;
border-radius: 50%;
animation: spin 0.8s linear infinite;
}
</style>
{% endblock %}

38
templates/anime_downloader_linkkf_request.html
View File

@@ -934,5 +934,43 @@
z-index: 99999;
opacity: 0.5;
}
/* 로딩 인디케이터 오버라이드 */
#loading {
background: rgba(15, 23, 42, 0.85) !important;
backdrop-filter: blur(8px) !important;
}
#loading img {
display: none !important;
}
#loading::after {
content: '';
width: 50px;
height: 50px;
border: 4px solid rgba(96, 165, 250, 0.2);
border-top-color: #60a5fa;
border-radius: 50%;
animation: loader-spin 0.8s linear infinite;
}
@keyframes loader-spin {
to { transform: rotate(360deg); }
}
#modal_loading img {
display: none !important;
}
#modal_loading::after {
content: '';
width: 40px;
height: 40px;
border: 3px solid rgba(96, 165, 250, 0.2);
border-top-color: #60a5fa;
border-radius: 50%;
animation: loader-spin 0.8s linear infinite;
}
</style>
{% endblock %}

39
templates/anime_downloader_ohli24_queue.html
View File

@@ -361,6 +361,45 @@
font-size: 15px;
}
}
/* 로딩 인디케이터 오버라이드 */
#loading {
background: rgba(15, 23, 42, 0.85) !important;
backdrop-filter: blur(8px) !important;
}
#loading img {
display: none !important;
}
#loading::after {
content: '';
width: 50px;
height: 50px;
border: 4px solid rgba(96, 165, 250, 0.2);
border-top-color: #60a5fa;
border-radius: 50%;
animation: spin 0.8s linear infinite;
}
@keyframes spin {
to { transform: rotate(360deg); }
}
/* 모달 로딩 인디케이터 오버라이드 */
#modal_loading img {
display: none !important;
}
#modal_loading::after {
content: '';
width: 40px;
height: 40px;
border: 3px solid rgba(96, 165, 250, 0.2);
border-top-color: #60a5fa;
border-radius: 50%;
animation: spin 0.8s linear infinite;
}
</style>
<script src="{{ url_for('.static', filename='js/sjva_ui14.js') }}"></script>

39
templates/anime_downloader_ohli24_request.html
View File

@@ -1023,5 +1023,44 @@
background-color: #0dcaf0 !important;
border-color: #0dcaf0 !important;
}
/* 로딩 인디케이터 오버라이드 */
#loading {
background: rgba(15, 23, 42, 0.85) !important;
backdrop-filter: blur(8px) !important;
}
#loading img {
display: none !important;
}
#loading::after {
content: '';
width: 50px;
height: 50px;
border: 4px solid rgba(96, 165, 250, 0.2);
border-top-color: #60a5fa;
border-radius: 50%;
animation: loader-spin 0.8s linear infinite;
}
@keyframes loader-spin {
to { transform: rotate(360deg); }
}
/* 모달 로딩 인디케이터 오버라이드 */
#modal_loading img {
display: none !important;
}
#modal_loading::after {
content: '';
width: 40px;
height: 40px;
border: 3px solid rgba(96, 165, 250, 0.2);
border-top-color: #60a5fa;
border-radius: 50%;
animation: loader-spin 0.8s linear infinite;
}
</style>
{% endblock %}