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

Leverage live HTMLCollection for selections instead of separate array.

Browse source
This commit is contained in:
voussoir 2020-09-29 10:54:31 -07:00
parent 898be91538
commit 16dc6066df
1 changed files with 18 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -289,7 +289,7 @@ const CHANNEL_ID = "{{channel.id}}";
const STATE = "{{state if state else ""}}"; const STATE = "{{state if state else ""}}";
var video_card_first_selected = null; var video_card_first_selected = null;
var video_card_selections = []; var video_card_selections = document.getElementsByClassName("video_card_selected");
function delete_channel_form() function delete_channel_form()
{ {
@ -388,12 +388,11 @@ function toggle_embed_video(video_id)
function deselect_all() function deselect_all()
{ {
let video_card_first_selected = null; video_card_first_selected = null;
for (const video_card_selection of video_card_selections) for (const video_card of Array.from(video_card_selections))
{ {
video_card_selection.classList.remove("video_card_selected"); video_card.classList.remove("video_card_selected");
} }
video_card_selections = [];
} }
function onclick_select(event) function onclick_select(event)
@ -402,22 +401,22 @@ function onclick_select(event)
{ {
return; return;
} }
if (video_card_first_selected === null) if (video_card_first_selected === null)
{ {
video_card_first_selected = event.target; video_card_first_selected = event.target;
} }
let video_cards = Array.from(document.getElementById("video_cards").children); let video_cards = Array.from(document.getElementsByClassName("video_card"));
if (event.shiftKey === false && event.ctrlKey === false) if (event.shiftKey === false && event.ctrlKey === false)
{ {
video_card_selections = []; deselect_all();
video_card_selections.push(event.target); event.target.classList.add("video_card_selected");
video_card_first_selected = event.target; video_card_first_selected = event.target;
} }
else if (event.shiftKey === true) else if (event.shiftKey === true)
{ {
video_card_selections = [];
let start_index = video_cards.indexOf(video_card_first_selected); let start_index = video_cards.indexOf(video_card_first_selected);
let end_index = video_cards.indexOf(event.target); let end_index = video_cards.indexOf(event.target);
if (end_index < start_index) if (end_index < start_index)
@ -431,34 +430,22 @@ function onclick_select(event)
{ {
continue; continue;
} }
video_card_selections.push(video_cards[index]); video_cards[index].classList.add("video_card_selected");
} }
} }
else if (event.ctrlKey === true) else if (event.ctrlKey === true)
{ {
let existing_index = video_card_selections.indexOf(event.target) if (event.target.classList.contains("video_card_selected"))
if (existing_index == -1)
{ {
video_card_first_selected = event.target; event.target.classList.remove("video_card_selected");
video_card_selections.push(event.target);
} }
else else
{ {
video_card_selections.splice(existing_index, 1); video_card_first_selected = event.target;
event.target.classList.add("video_card_selected");
} }
} }
for (const video_card of video_cards)
{
if (video_card_selections.indexOf(video_card) > -1)
{
video_card.classList.add("video_card_selected");
}
else
{
video_card.classList.remove("video_card_selected");
}
}
document.getSelection().removeAllRanges(); document.getSelection().removeAllRanges();
return false; return false;
@ -467,14 +454,16 @@ function onclick_select(event)
function action_button_passthrough(event, action_function, action_argument) function action_button_passthrough(event, action_function, action_argument)
{ {
let elements; let elements;
let this_card = event.target.parentElement.parentElement; let this_card = event.target.closest(".video_card");
if (video_card_selections.length > 0 && video_card_selections.indexOf(this_card) > -1) if (this_card.classList.contains("video_card_selected"))
{ {
// The clicked card is indeed part of the current selected group.
elements = video_card_selections; elements = video_card_selections;
} }
else else
{ {
// Button -> button toolbox -> video card // The clicked card is actually not one of the selected, so we'll just
// action it by itself.
elements = [this_card]; elements = [this_card];
} }
let video_ids = []; let video_ids = [];