Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Convert Tooltip from Coffeescript to Javascript #2548

Merged

Conversation

sascha-karnatz
Copy link
Contributor

What is this pull request for?

Move the tooltip also to the app/javascript folder and import the file only in the GUI init - function. It isn't used anywhere else.

Checklist

  • I have followed Pull Request guidelines
  • I have added a detailed description into each commit message
  • I have added tests to cover this change

@sascha-karnatz sascha-karnatz added this to the 7.1 milestone Aug 3, 2023
@sascha-karnatz sascha-karnatz requested a review from a team August 3, 2023 07:06
Copy link
Member

@tvdeyen tvdeyen left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This file is so small. Do you think we can get rid of jQuery as well?

app/javascript/alchemy_admin/tooltips.js Outdated Show resolved Hide resolved
@sascha-karnatz sascha-karnatz force-pushed the update_javascript/move-tooltip branch from 0fc5a29 to 0adce11 Compare August 3, 2023 10:16
@sascha-karnatz
Copy link
Contributor Author

This file is so small. Do you think we can get rid of jQuery as well?

I rewrote the file to use vanilla JS

@sascha-karnatz sascha-karnatz force-pushed the update_javascript/move-tooltip branch 3 times, most recently from 527772d to 49e15d2 Compare August 4, 2023 13:26
app/javascript/alchemy_admin/gui.js Outdated Show resolved Hide resolved
app/javascript/alchemy_admin/utils/dom_helpers.js Outdated Show resolved Hide resolved
* @param {string} text
* @returns {HTMLElement}
*/
export function createHtmlElement(text) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think createElement is a good enough name.

Copy link
Member

@tvdeyen tvdeyen left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just saw that with the custom element rewrite we lost the ability to init tooltips by data attribute (what we do a lot)

@tvdeyen
Copy link
Member

tvdeyen commented Aug 4, 2023

Just saw that with the custom element rewrite we lost the ability to init tooltips by data attribute (what we do a lot)

Ignore me, I just found that we only use the alchemy-tooltip in one place. The other component is the hint-bubble and we also have the label of the .button_with_label that is displayed as tooltip.

Very confusing. Maybe worth refactoring into one component?

@sascha-karnatz sascha-karnatz force-pushed the update_javascript/move-tooltip branch 2 times, most recently from 38566b7 to 6420efa Compare August 25, 2023 11:00
Move the tooltip also to the app/javascript folder and import the file only in the GUI init - function. It isn't used anywhere else.
Add a dom_helper.js to collect a few repetitive functions.
The tooltip component can only be used on input fields. This way the update of the form builder is way easier. The previous function to transform the jQuery scope to a HTMLElement was removed and the dom helpers - modules is now in the utils folder.
@sascha-karnatz sascha-karnatz force-pushed the update_javascript/move-tooltip branch from 6420efa to 0cfaf5b Compare August 25, 2023 11:42
@tvdeyen tvdeyen merged commit 70c0c2b into AlchemyCMS:main Aug 25, 2023
@sascha-karnatz sascha-karnatz deleted the update_javascript/move-tooltip branch September 1, 2023 08:34
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.

2 participants