KAD-4209 Init progress bars on query loop filter #675
Conversation
oakesjosh
requested review from
mark-c-woodard,
gilbert-hernandez and
Copilot
There was a problem hiding this comment.
PR Overview
This PR ensures that progress bars are initialized solely within query loop cards when filtering in QL to avoid reinitializing progress bars elsewhere on the page.
- Added a new onlyInQueryLoop parameter to the progress bar initialization methods.
- Updated query selector logic in initSingleBar to filter progress bars within query loop cards.
- Introduced an event listener for kb-query-loaded to initialize progress bars only within the query loop.
Reviewed Changes
| File | Description |
|---|---|
| src/assets/js/kb-progress-bars.js | Added the onlyInQueryLoop parameter to limit progress bar initialization scope and included an event listener for kb-query-loaded |
Copilot reviewed 3 out of 3 changed files in this pull request and generated no comments.
Comments suppressed due to low confidence (1)
src/assets/js/kb-progress-bars.js:155
- Ensure that item.unique_id is correctly formatted (including a delimiter if needed) so that the query selector properly matches the intended elements inside query cards.
'.wp-block-kadence-query-card .kb-progress-bar-container' + item.unique_id
|
🎉 Zip build complete |
There was a problem hiding this comment.
This is working, but the onlyInQueryLoop approach isn't very extendable.
In the future, we may also be asked to make the progress bar initialize in the quickview modal or other areas that get loaded async.
What I've done in other situations like this is adding a marker class to the block when an init functions runs over it. Then make the init functions check for that class before they run. So you can always loop over all progress bars on the page.
Then you can just add another event listener when it needs to re-init on something new.
…ps://github.com/stellarwp/kadence-blocks into bugfix/KAD-4209_progress_bar_init_in_ql" This reverts commit 6046015, reversing changes made to 20ca785.
This reverts commit 4dc5d49.
|
@mark-c-woodard Good callout, I've made this change |
When filtering in QL, the progress bars within the query loop aren't initialized.
On the
kb-query-loadedevent we only initialize progress bars inside the query loop card class, otherwise progress bars elsewhere on the page will re-init and animate again.