Skip to content

Scope list/box layout per listing when multiple shortcodes share a page#2127

Open
oduppinsjr wants to merge 4 commits intowpeventmanager:masterfrom
oduppinsjr:fix/independent-listing-layout-scope
Open

Scope list/box layout per listing when multiple shortcodes share a page#2127
oduppinsjr wants to merge 4 commits intowpeventmanager:masterfrom
oduppinsjr:fix/independent-listing-layout-scope

Conversation

@oduppinsjr
Copy link
Copy Markdown

Problem

Using upcoming_events and past_events (or multiple events blocks) on one page shared one localStorage key and global jQuery selectors, so toggling list/box view in one block mirrored the other.

Solution

  • Wrap each listing output from event-listings-start.php / event-listings-end.php in .wpem-event-listing-instance with data-wpem-listing-instance.
  • Add optional shortcode attribute layout_instance (sanitized key). Defaults: events for [events], upcoming-events and past-events for the respective shortcodes so upcoming vs past stay independent. Use a custom value when two blocks of the same shortcode need separate saved layouts.
  • Persist layout per instance via localStorage keys wpem_layout_inst_, with fallback to the legacy layout key for backward compatibility.
  • Scope layout toggle JS to the clicked instance; remove duplicate fixed IDs from toggle controls.
  • Unique id for each listing view container; upcoming getUpcomingEvents AJAX targets .wpem-event-listings inside #upcoming_event_listing.

Files

Templates, shortcodes, content-event-listing.js (+ min), event-ajax-filters.js (+ min), wpml-config.xml.

- Wrap each listing block in .wpem-event-listing-instance with a stable
  layout_instance id (shortcode attribute) or sensible defaults
- Store layout preference in localStorage per instance (wpem_layout_inst_*)
  with fallback to the legacy global layout key
- Remove duplicate fixed IDs from layout toggle controls; scope JS to the
  nearest instance container
- Give each listing view container a unique id for markup validity
- Update upcoming events AJAX to target listings inside #upcoming_event_listing
- Register layout_instance in WPML config for the [events] shortcode

Made-with: Cursor
@oduppinsjr oduppinsjr marked this pull request as draft April 17, 2026 03:12
- Add listing instance stack backed by a static array via wpem_listing_instance_stack_ref()
- Move wrapper/title/listing-view markup to escaped echo helpers
- Fix title output (esc_html via wpem_echo_listing_section_title)
- content-event-listing.js: double-quoted strings, /* global */, split layout
  helpers to reduce complexity, local i18n alias for daterangepicker

Made-with: Cursor
…6 style

- Replace echo/exit in listing-instance-stack with return + return (ABSPATH)
- Add wpem_listing_instance_markup_kses_allowed for wp_kses on fragments
- Load stack include via relative include() like sibling files
- JS: remove jQuery global, window.* for localized strings, method shorthand,
  resolveLayoutKey + applyLayoutToSingleInstance to lower complexity,
  buildDateRangePickerOptions for daterangepicker config

Made-with: Cursor
…r markup

- Output listing title with esc_html() directly in the template (WordPress XSS)
- Replace echo wp_kses(...) with <?= wp_kses(...) ?> for listing wrappers
- Merge listing instance stack helpers into wp-event-manager-filters.php and
  remove separate include from wp-event-manager.php (no extra include file)

Made-with: Cursor
@oduppinsjr oduppinsjr marked this pull request as ready for review April 17, 2026 04:33
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant