Problem/Motivation

Currently, the javascript selects the modal footer and modal background as hardcoded close triggers.
However, there are several cases where users want to add custom triggers or add other elements (such as links) to the footer. While the links will work, the modal will close, too.

Steps to reproduce

Proposed resolution

Use a data-attribute (data-ouibounce-close with querySelectorAll() to get all close triggers.

Remaining tasks

User interface changes

API changes

Data model changes

CommentFileSizeAuthor
ouibounce_modal_footer.png15.3 KBthomas.frobieter

Issue fork ouibounce_exit_modal-3385648

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

About issue forks

Comments

thomas.frobieter created an issue. See original summary.

anybody’s picture

anybody
Primary language German
Location Porta Westfalica
commented

Is this something that should instead be solved in the library upstream?

thomas.frobieter’s picture

thomas.frobieter
Primary language German
Location EU
commented

I don't know, the close triggers where defined in the module js before ... its 4 lines of code (while the JS is reduced 1/3 by this change).
So creating a issue in the library, waiting for implementation ..... meh.

thomas.frobieter’s picture

thomas.frobieter
Primary language German
Location EU
commented

Done! Already tested, please review (:

https://git.drupalcode.org/issue/ouibounce_exit_modal-3385648/-/commit/7...

Anybody opened merge request !9

anybody’s picture

anybody
Primary language German
Location Porta Westfalica
commented
Assigned: thomas.frobieter » grevil
Status: Active » Needs review

Please do not forget to open a MR from the issue fork and set the status to "Needs Review".

thomas.frobieter’s picture

thomas.frobieter
Primary language German
Location EU
commented

Done! Review again pls.

anybody’s picture

anybody
Primary language German
Location Porta Westfalica
commented

Alternative: #3437774: Replace ouibounce by vanilla JS + Drupal dialog modal [5.0]

But we could still finish this.

grevil made their first commit to this issue’s fork.

grevil’s picture

grevil commented
Version: 4.0.0-rc1 » 4.x-dev
Assigned: grevil » Unassigned

All done and tested! Please review!

I hope the ESLint formatting is not too unrelated.

anybody’s picture

anybody
Primary language German
Location Porta Westfalica
commented
Assigned: Unassigned » grevil
Status: Needs review » Needs work

VERY nice improvements @thomas.frobieter and @grevil! I left one final comment.

If this was well tested, I think it's ready for RTBC, I just did a code-review.

grevil’s picture

grevil commented
Assigned: grevil » Unassigned
Status: Needs work » Needs review

All done! Accidentally added the .gitlab-ci, composer.json and generic test here.

anybody’s picture

anybody
Primary language German
Location Porta Westfalica
commented
Assigned: Unassigned » grevil
Status: Needs review » Needs work
grevil’s picture

grevil commented
Assigned: grevil » Unassigned
Status: Needs work » Needs review
grevil’s picture

grevil commented
Title: Use data-attributes to define close triggers » Use classes to define close triggers and add generic test, gilab-ci and composer.json

  • grevil committed 6182aabf on 4.x authored by anybody 
    Issue #3385648: Use data-attributes to define close triggers
grevil’s picture

grevil commented
Status: Needs review » Fixed

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.