New: Added static tooltips #304

oliverfoster · 2024-04-30T20:00:57Z

fixes #303

New

Added _useStaticTooltips and item._tooltip._position for labelling pins

Testing

Use core issue/528

git clone https://github.com/adaptlearning/adapt_framework 528-static-tooltips
cd 528-static-tooltips
npm install && adapt devinstall
cd src/core
git checkout issue/528
cd ../../src/components/adapt-contrib-hotgraphic
git checkout issue/303
cd ../../..
grunt dev

Edit the hotgraphic component to add

{
    "_hasStaticTooltips": true,
    "_isNarrativeOnMobile": false,
    "_items": [
      {
       "_tooltip": {
          "_isEnabled": true,
          "title": "Name",
          "_position": "top"
          
          "_COMMENT_position": "can be any combination of top left right bottom"
        }
      }
    ]
}

Run grunt dev

It should look like this:

less/hotgraphic.less

cahirodoherty-learningpool

👀

oliverfoster · 2024-05-14T10:52:20Z

@swashbuck would you be able to do the schemas and readme and examples etc?

The core issue also needs +1 & review adaptlearning/adapt-contrib-core#529

swashbuck · 2024-05-14T20:41:31Z

@swashbuck would you be able to do the schemas and readme and examples etc?

@oliverfoster Yep, done.

oliverfoster

👍 +1

kirsty-hames

Great addition thanks. This worked as expected when testing on Mac Chrome, FF and iPhone.

When testing on Mac Safari, no tooltips were displayed when "_hasStaticTooltips": true. This worked as expected however when "_hasStaticTooltips": false.
Running Safari v17.5, macOS Sonoma v14.5

properties.schema

schema/component.schema.json

oliverfoster · 2024-06-04T14:53:57Z

When testing on Mac Safari, no tooltips were displayed when "_hasStaticTooltips": true. This worked as expected however when "_hasStaticTooltips": false. Running Safari v17.5, macOS Sonoma v14.5

Re not working on Mac Safari, I'll contact Kirsty separately.

swashbuck · 2024-06-04T14:58:29Z

When testing on Mac Safari, no tooltips were displayed when "_hasStaticTooltips": true. This worked as expected however when "_hasStaticTooltips": false. Running Safari v17.5, macOS Sonoma v14.5

Re not working on Mac Safari, I'll contact Kirsty separately.

@oliverfoster I can reproduce this, too. It looks like .tooltip__container isn't present in the DOM in Safari.

oliverfoster · 2024-06-04T15:04:49Z

TooltipView is instantiated before Adapt loads fully.
https://github.com/adaptlearning/adapt-contrib-core/blob/4b8a99ab60704bb6d6993992ceae575b86a120c7/js/tooltips.js#L3

Where it is injected into the body.
https://github.com/adaptlearning/adapt-contrib-core/blob/4b8a99ab60704bb6d6993992ceae575b86a120c7/js/views/TooltipView.js#L92

Odd that it's missing. If you turn off static tooltips is it there? Are the navigation bar tootips appearing? How did you figure out the element isn't there? Do you have any console errors?

swashbuck · 2024-06-04T15:18:46Z

Odd that it's missing. If you turn off static tooltips is it there? Are the navigation bar tootips appearing? How did you figure out the element isn't there? Do you have any console errors?

Apologies, I just don't know how to read Safari's Web Inspector. It's there but is empty.

swashbuck · 2024-06-04T15:27:11Z

@oliverfoster If I load the page, navigate away to the menu, and then navigate back to the page with the Hot Graphic, the static labels appear. They are not there initially.

I also think I saw the static labels after reloading the page, but it's difficult to reproduce. Maybe 1 out of 100 reloads.

oliverfoster · 2024-06-05T11:58:56Z

Could you remove this line and try that out please?
https://github.com/adaptlearning/adapt-contrib-core/blob/3ce4bd664535afc00c7924297359934d773777c6/js/views/TooltipView.js#L81

kirsty-hames · 2024-06-05T12:35:42Z

Could you remove this line and try that out please? https://github.com/adaptlearning/adapt-contrib-core/blob/3ce4bd664535afc00c7924297359934d773777c6/js/views/TooltipView.js#L81

I can confirm this resolves the Safari issue reported above. I've retested in FF, Chrome and iPhone too.

oliverfoster · 2024-06-05T13:02:07Z

Line removed here adaptlearning/adapt-contrib-core@e63be65

kirsty-hames

I have discovered a display issue with the initial rendering of the tooltip position. I'm not able to replicate every time but sometimes the top/bottom positioning is off. Please see screen shots below.

Tooltip labels position as expected:

Tooltip labels registering incorrect pin position:

Not sure if this is Mac specific but I'm able to replicate in Chrome, Safari and FF.

As noted above, I'm not able to replicate consistently. Sometimes the issue resolves itself either by resizing the browser or selecting a Hotgraphic pin.

Tooltip _position for the screen shot items are items 1 left, 2 right and 3 top.

oliverfoster · 2024-06-05T17:55:47Z

Will have a look. Thanks.

It's suspiciously navigation bar sized.

oliverfoster · 2024-06-10T10:27:40Z

@kirsty-hames / @swashbuck could you please try the associate pr as a resolution?

I could replicate and the pr seems to fix. adaptlearning/adapt-contrib-core#552

kirsty-hames

Safari issue resolved thanks @oliverfoster 👍

joe-allen-89

👍

# [6.13.0](v6.12.1...v6.13.0) (2024-06-11) ### New * Added static tooltips (fixes #304) ([7831ee3](7831ee3)), closes [#304](#304)

New: Added static tooltips

d7b376a

oliverfoster self-assigned this Apr 30, 2024

Update

0e79970

oliverfoster commented Apr 30, 2024

View reviewed changes

less/hotgraphic.less Outdated Show resolved Hide resolved

swashbuck added the enhancement label May 1, 2024

cahirodoherty-learningpool approved these changes May 2, 2024

View reviewed changes

swashbuck added 2 commits May 7, 2024 15:25

Move pin tooltip styles to pin section in Less

d8f0b50

Use @black Less variable

4c9ad7c

swashbuck added 3 commits May 14, 2024 14:21

Update readme

867b842

Schemas

ae142cf

Update schemas

ec4fa45

oliverfoster commented May 15, 2024

View reviewed changes

kirsty-hames reviewed May 30, 2024

View reviewed changes

properties.schema Outdated Show resolved Hide resolved

schema/component.schema.json Outdated Show resolved Hide resolved

kirsty-hames mentioned this pull request May 30, 2024

Update: Allow static tooltips, improved render and styling adaptlearning/adapt-contrib-core#529

Merged

Remove hover reference in _tooltip.text descriptions

d570ea6

oliverfoster requested review from kirsty-hames and swashbuck June 5, 2024 13:02

kirsty-hames reviewed Jun 5, 2024

View reviewed changes

oliverfoster mentioned this pull request Jun 10, 2024

Fix: Show static tooltips at end of event loop always adaptlearning/adapt-contrib-core#552

Merged

oliverfoster requested a review from kirsty-hames June 10, 2024 11:07

kirsty-hames approved these changes Jun 10, 2024

View reviewed changes

joe-allen-89 approved these changes Jun 11, 2024

View reviewed changes

joe-allen-89 merged commit 7831ee3 into master Jun 11, 2024

joe-allen-89 deleted the issue/303 branch June 11, 2024 09:01

github-actions bot pushed a commit that referenced this pull request Jun 11, 2024

Chore(release): 6.13.0 [skip ci]

c7d5bdc

# [6.13.0](v6.12.1...v6.13.0) (2024-06-11) ### New * Added static tooltips (fixes #304) ([7831ee3](7831ee3)), closes [#304](#304)

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

New: Added static tooltips #304

New: Added static tooltips #304

oliverfoster commented Apr 30, 2024 •

edited

Loading

cahirodoherty-learningpool left a comment

oliverfoster commented May 14, 2024 •

edited

Loading

swashbuck commented May 14, 2024

oliverfoster left a comment •

edited

Loading

kirsty-hames left a comment

oliverfoster commented Jun 4, 2024

swashbuck commented Jun 4, 2024

oliverfoster commented Jun 4, 2024

swashbuck commented Jun 4, 2024 •

edited

Loading

swashbuck commented Jun 4, 2024 •

edited

Loading

oliverfoster commented Jun 5, 2024

kirsty-hames commented Jun 5, 2024

oliverfoster commented Jun 5, 2024

kirsty-hames left a comment

oliverfoster commented Jun 5, 2024 •

edited

Loading

oliverfoster commented Jun 10, 2024 •

edited

Loading

kirsty-hames left a comment

joe-allen-89 left a comment

New: Added static tooltips #304

New: Added static tooltips #304

Conversation

oliverfoster commented Apr 30, 2024 • edited Loading

New

Testing

cahirodoherty-learningpool left a comment

Choose a reason for hiding this comment

oliverfoster commented May 14, 2024 • edited Loading

swashbuck commented May 14, 2024

oliverfoster left a comment • edited Loading

Choose a reason for hiding this comment

kirsty-hames left a comment

Choose a reason for hiding this comment

oliverfoster commented Jun 4, 2024

swashbuck commented Jun 4, 2024

oliverfoster commented Jun 4, 2024

swashbuck commented Jun 4, 2024 • edited Loading

swashbuck commented Jun 4, 2024 • edited Loading

oliverfoster commented Jun 5, 2024

kirsty-hames commented Jun 5, 2024

oliverfoster commented Jun 5, 2024

kirsty-hames left a comment

Choose a reason for hiding this comment

oliverfoster commented Jun 5, 2024 • edited Loading

oliverfoster commented Jun 10, 2024 • edited Loading

kirsty-hames left a comment

Choose a reason for hiding this comment

joe-allen-89 left a comment

Choose a reason for hiding this comment

oliverfoster commented Apr 30, 2024 •

edited

Loading

oliverfoster commented May 14, 2024 •

edited

Loading

oliverfoster left a comment •

edited

Loading

swashbuck commented Jun 4, 2024 •

edited

Loading

swashbuck commented Jun 4, 2024 •

edited

Loading

oliverfoster commented Jun 5, 2024 •

edited

Loading

oliverfoster commented Jun 10, 2024 •

edited

Loading