voussoir/ycdl
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Rename spinner.js -> spinners.js.

Browse source
This commit is contained in:
voussoir 2022-03-15 13:52:29 -07:00
parent 1479f79667
commit bad5ed0355
No known key found for this signature in database
GPG key ID: 5F7554F8C26DACCB
3 changed files with 39 additions and 39 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

68
frontends/ycdl_flask/static/js/spinner.js → frontends/ycdl_flask/static/js/spinners.js
View file

@ -1,24 +1,23 @@
const spinner = {}; const spinners = {};
/* /*
In general, spinners are used for functions that launch a callback, and the In general, spinners are used for functions that launch a callback, and the
callback will close the spinner after it runs. But, if your initial function callback will close the spinner after it runs. But, if your initial function
decides not to launch the callback (insufficient parameters, failed clientside decides not to launch the callback (insufficient parameters, failed clientside
checks, etc.), you can have it return spinner.BAIL and the spinners will close checks, etc.), you can have it return spinners.BAIL and the spinners will close
immediately. Of course, you're always welcome to use immediately. Of course, you're always welcome to use
window[button.dataset.spinnerCloser](), but this return value means you don't window[button.dataset.spinnerCloser](), but this return value means you don't
need to pull the button into a variable, as long as you weren't using the need to pull the button into a variable, as long as you weren't using the
return value anyway. return value anyway.
*/ */
spinner.BAIL = "spinner.BAIL"; spinners.BAIL = "spinners.BAIL";
spinner.Spinner = spinners.Spinner =
function Spinner(element) function Spinner(element)
{ {
this.show = function(delay) this.show = function(delay)
{ {
clearTimeout(this.delayed_showing_timeout); clearTimeout(this.delayed_showing_timeout);
this.delayed_showing_timeout = null;
if (delay) if (delay)
{ {
@ -26,6 +25,7 @@ function Spinner(element)
} }
else else
{ {
this.delayed_showing_timeout = null;
this.element.classList.remove("hidden"); this.element.classList.remove("hidden");
} }
} }
@ -42,50 +42,50 @@ function Spinner(element)
this.element = element; this.element = element;
} }
spinner.spinner_button_index = 0; spinners.spinner_button_index = 0;
spinner.button_spinner_groups = {}; spinners.button_spinner_groups = {};
/* /*
When a group member is closing, it will call the closer on all other members When a group member is closing, it will call the closer on all other members
in the group. Of course, this would recurse forever without some kind of in the group. Of course, this would recurse forever without some kind of
flagging, so this dict will hold group_id:true if a close is in progress, flagging, so this dict will hold group_id:true if a close is in progress,
and be empty otherwise. and be empty otherwise.
*/ */
spinner.spinner_group_closing = {}; spinners.spinner_group_closing = {};
spinner.add_to_spinner_group = spinners.add_to_spinner_group =
function add_to_spinner_group(group_id, button) function add_to_spinner_group(group_id, button)
{ {
if (!(group_id in spinner.button_spinner_groups)) if (!(group_id in spinners.button_spinner_groups))
{ {
spinner.button_spinner_groups[group_id] = []; spinners.button_spinner_groups[group_id] = [];
} }
spinner.button_spinner_groups[group_id].push(button); spinners.button_spinner_groups[group_id].push(button);
} }
spinner.close_grouped_spinners = spinners.close_grouped_spinners =
function close_grouped_spinners(group_id) function close_grouped_spinners(group_id)
{ {
if (group_id && !(spinner.spinner_group_closing[group_id])) if (group_id && !(spinners.spinner_group_closing[group_id]))
{ {
spinner.spinner_group_closing[group_id] = true; spinners.spinner_group_closing[group_id] = true;
for (const button of spinner.button_spinner_groups[group_id]) for (const button of spinners.button_spinner_groups[group_id])
{ {
window[button.dataset.spinnerCloser](); window[button.dataset.spinnerCloser]();
} }
delete spinner.spinner_group_closing[group_id]; delete spinners.spinner_group_closing[group_id];
} }
} }
spinner.open_grouped_spinners = spinners.open_grouped_spinners =
function open_grouped_spinners(group_id) function open_grouped_spinners(group_id)
{ {
for (const button of spinner.button_spinner_groups[group_id]) for (const button of spinners.button_spinner_groups[group_id])
{ {
window[button.dataset.spinnerOpener](); window[button.dataset.spinnerOpener]();
} }
} }
spinner.init_button_with_spinner = spinners.init_button_with_spinner =
function init_button_with_spinner() function init_button_with_spinner()
{ {
/* /*
@ -126,7 +126,7 @@ function init_button_with_spinner()
if (button.dataset.spinnerGroup) if (button.dataset.spinnerGroup)
{ {
spinner.add_to_spinner_group(button.dataset.spinnerGroup, button); spinners.add_to_spinner_group(button.dataset.spinnerGroup, button);
} }
let spinner_element; let spinner_element;
@ -138,15 +138,15 @@ function init_button_with_spinner()
else else
{ {
spinner_element = document.createElement("span"); spinner_element = document.createElement("span");
spinner_element.innerText = "Working..."; spinner_element.innerText = button.dataset.spinnerText || "Working...";
spinner_element.classList.add("hidden"); spinner_element.classList.add("hidden");
holder.appendChild(spinner_element); holder.appendChild(spinner_element);
} }
const spin = new spinner.Spinner(spinner_element); const spin = new spinners.Spinner(spinner_element);
const spin_delay = parseFloat(button.dataset.spinnerDelay) || 0; const spin_delay = parseFloat(button.dataset.spinnerDelay) || 0;
button.dataset.spinnerOpener = "spinner_opener_" + spinner.spinner_button_index; button.dataset.spinnerOpener = "spinner_opener_" + spinners.spinner_button_index;
window[button.dataset.spinnerOpener] = function spinner_opener() window[button.dataset.spinnerOpener] = function spinner_opener()
{ {
spin.show(spin_delay); spin.show(spin_delay);
@ -155,41 +155,41 @@ function init_button_with_spinner()
// It is expected that the function referenced by onclick will call // It is expected that the function referenced by onclick will call
// window[button.dataset.spinnerCloser]() when appropriate, since from // window[button.dataset.spinnerCloser]() when appropriate, since from
// our perspective we cannot be sure when to close the spinner. // our perspective we cannot be sure when to close the spinner.
button.dataset.spinnerCloser = "spinner_closer_" + spinner.spinner_button_index; button.dataset.spinnerCloser = "spinner_closer_" + spinners.spinner_button_index;
window[button.dataset.spinnerCloser] = function spinner_closer() window[button.dataset.spinnerCloser] = function spinner_closer()
{ {
spinner.close_grouped_spinners(button.dataset.spinnerGroup); spinners.close_grouped_spinners(button.dataset.spinnerGroup);
spin.hide(); spin.hide();
button.disabled = false; button.disabled = false;
} }
const wrapped_onclick = button.onclick; const wrapped_onclick = button.onclick;
button.removeAttribute('onclick'); button.removeAttribute('onclick');
button.onclick = function() button.onclick = function(event)
{ {
if (button.dataset.spinnerGroup) if (button.dataset.spinnerGroup)
{ {
spinner.open_grouped_spinners(button.dataset.spinnerGroup); spinners.open_grouped_spinners(button.dataset.spinnerGroup);
} }
else else
{ {
window[button.dataset.spinnerOpener](); window[button.dataset.spinnerOpener]();
} }
const ret = wrapped_onclick(); const ret = wrapped_onclick(event);
if (ret === spinner.BAIL) if (ret === spinners.BAIL)
{ {
window[button.dataset.spinnerCloser](); window[button.dataset.spinnerCloser]();
} }
return ret; return ret;
} }
spinner.spinner_button_index += 1; spinners.spinner_button_index += 1;
} }
} }
spinner.on_pageload = spinners.on_pageload =
function on_pageload() function on_pageload()
{ {
spinner.init_button_with_spinner(); spinners.init_button_with_spinner();
} }
document.addEventListener("DOMContentLoaded", spinner.on_pageload); document.addEventListener("DOMContentLoaded", spinners.on_pageload);

6
frontends/ycdl_flask/templates/channel.html
View file

@ -10,7 +10,7 @@
<script src="/static/js/common.js"></script> <script src="/static/js/common.js"></script>
<script src="/static/js/api.js"></script> <script src="/static/js/api.js"></script>
<script src="/static/js/hotkeys.js"></script> <script src="/static/js/hotkeys.js"></script>
<script src="/static/js/spinner.js"></script> <script src="/static/js/spinners.js"></script>
<style> <style>
.tabbed_container .tab .tabbed_container .tab
@ -757,10 +757,10 @@ if (CHANNEL_ID)
common.bind_box_to_button(set_download_directory_input, set_download_directory_button); common.bind_box_to_button(set_download_directory_input, set_download_directory_button);
var set_automark_spinner = document.getElementById("set_automark_spinner"); var set_automark_spinner = document.getElementById("set_automark_spinner");
set_automark_spinner = new spinner.Spinner(set_automark_spinner); set_automark_spinner = new spinners.Spinner(set_automark_spinner);
var set_autorefresh_spinner = document.getElementById("set_autorefresh_spinner"); var set_autorefresh_spinner = document.getElementById("set_autorefresh_spinner");
set_autorefresh_spinner = new spinner.Spinner(set_autorefresh_spinner); set_autorefresh_spinner = new spinners.Spinner(set_autorefresh_spinner);
} }
//////////////////////////////////////////////////////////////////////////////////////////////////// ////////////////////////////////////////////////////////////////////////////////////////////////////

4
frontends/ycdl_flask/templates/channels.html
View file

@ -9,7 +9,7 @@
<link rel="stylesheet" href="/static/css/ycdl.css"> <link rel="stylesheet" href="/static/css/ycdl.css">
<script src="/static/js/common.js"></script> <script src="/static/js/common.js"></script>
<script src="/static/js/api.js"></script> <script src="/static/js/api.js"></script>
<script src="/static/js/spinner.js"></script> <script src="/static/js/spinners.js"></script>
<style> <style>
#new_channel_textbox, #new_channel_textbox,
@ -85,7 +85,7 @@ function add_channel_form()
{ {
if (box.value === "") if (box.value === "")
{ {
return spinner.BAIL; return spinners.BAIL;
} }
api.channels.add_channel(box.value, add_channel_callback); api.channels.add_channel(box.value, add_channel_callback);
} }