From 786ba6aa562110b611c69dea1d83fe04c175be0c Mon Sep 17 00:00:00 2001 From: mummified-corroding-granny Date: Mon, 6 Feb 2023 02:07:18 +0000 Subject: [PATCH] moved toggleelement to register_new_elements() (#111) We currently cannot see (toggle the dropdown/button) reports that are hidden behind the "show more" (comments) button. This PR fixes that. Example of what is happening without this PR: 1. open megathread. The thread is long includes hundreds of comments implying need to click "show more" (comments) button 2. without clicking any "show more" (comments) button, click the flaggers button on one of the first comments 3. flaggers are presented as expected 4. click the "show more" (comments) button at the end 5. click the flaggers button on one of the comments that was hidden behind the "show more" (comments) button 6. the button does nothing and has no event listenner associated With this PR: 1. all flaggers buttons work regardless if hidden behind "Show More" (comments) or not. Tested up to two "Show More" (comments) buttons I did the PR this way because the view_more button calls register_new_elements() and not bottom.js as a whole There are other things using data-toggleelement like the undelete button on comments and the Preview button on /submit. Both of those still work as expected Reviewed-on: https://fsdfsd.net/rDrama/rDrama/pulls/111 Co-authored-by: mummified-corroding-granny Co-committed-by: mummified-corroding-granny --- files/assets/js/bottom.js | 15 ++++++++------- 1 file changed, 8 insertions(+), 7 deletions(-) diff --git a/files/assets/js/bottom.js b/files/assets/js/bottom.js index 845a00ccc..59c887c0b 100644 --- a/files/assets/js/bottom.js +++ b/files/assets/js/bottom.js @@ -99,13 +99,6 @@ for (const element of TH) { element.addEventListener('click', () => {sort_table(element)}); } -const toggleelement = document.querySelectorAll('[data-toggleelement]'); -for (const element of toggleelement) { - element.addEventListener('click', () => { - document.getElementById(element.dataset.toggleelement).classList.toggle(element.dataset.toggleattr); - }); -} - function register_new_elements(e) { const showmores = document.getElementsByClassName('showmore') for (const element of showmores) { @@ -144,6 +137,14 @@ function register_new_elements(e) { for (const element of expandable) { element.onclick = () => {expandImage()}; } + + const toggleelement = e.querySelectorAll('[data-toggleelement]'); + for (const element of toggleelement) { + element.addEventListener('click', () => { + document.getElementById(element.dataset.toggleelement).classList.toggle(element.dataset.toggleattr); + }); + } + } register_new_elements(document);