Add hover cards

[matthew-white]

See the story in the release criteria.

[dbemke]

Is the geometry (property) in the correct format (numbers...numbers)?

[srujner]

Some form names are cut off in the Firefox browser

[matthew-white]

Thank you, those both look like issues. 👍 I've also noticed that in some cases, there is too much padding below the list of properties in the hover card for an entity list. For example, if you hover over the "basic" entity list here: https://test.getodk.cloud/#/projects/414/entity-lists

[matthew-white]

I didn't have a chance to make these changes today, but I'll do so soon.

[srujner]

Hey, shouldn't the Infocard be visible also on that page after hovering the mouse over any of the links?

[matthew-white]

Yes, good catch! It should. I'll make that change tomorrow.

The issue has been closed because we finished code review. That means that you can now view it on staging in addition to the QA server. However, I still need to make the changes for the issues described above. Let me know if you see any other issues involving hover cards.

[matthew-white]

shouldn't the Infocard be visible also on that page after hovering the mouse over any of the links?

This should now be fixed.

[matthew-white]

@sadiqkhoja mentioned to me yesterday that he was seeing an issue with hover cards:

Forms with lengthy names show the card outside of the screen

In other words, if there wasn't enough space for the hover card on either the right or the left of the link, it was being shown partly offscreen. Instead, we want to show the hover card above or below the link if there isn't space for it on the right or left.

getodk/central-frontend#1097 was merged to address this issue, and the issue should now be fixed. Let me know if you ever notice a hover card being shown offscreen.

[matthew-white]

We're also tracking another issue with hover cards. It definitely affects hover cards for forms and may affect other hover cards as well. The issue is: In a hover card for a form, if the text in the second column is shorter than the text in the first column (i.e., if the form version is short), then the hover card will widen to fit the full width of the form name. The problem is that hover cards are not supposed to become arbitrarily wide. The form name is supposed to truncate if it's too long. I'm planning to fix this issue tomorrow.

[matthew-white]

hover cards are not supposed to become arbitrarily wide. The form name is supposed to truncate if it's too long.

This should now be fixed.

Is the geometry (property) in the correct format (numbers...numbers)?

Some form names are cut off in the Firefox browser

I think these are the last two things that need to be fixed.

[dbemke]

Is the long property name already fixed- should it be "bbbbb..."?

[matthew-white]

Is the long property name already fixed- should it be "bbbbb..."?

That one is actually by design. If the list of properties doesn't fit, it will be visible up until the very edge of the hover card. In the release criteria, there's a screenshot along those lines that you can see.

Is the geometry (property) in the correct format (numbers...numbers)?

This should now be fixed. I haven't updated the QA server yet, but you can see the fix on staging. I'll update the QA server soon as well.

Some form names are cut off in the Firefox browser

I actually wasn't able to reproduce this issue on my machine, perhaps due to differences in fonts. However, I made some changes that I'm hoping has addressed this. That change can be seen on staging.

I've also noticed that in some cases, there is too much padding below the list of properties in the hover card for an entity list.

This should now be fixed on staging. The issue was due to property names that contained a hyphen.

[dbemke]

I'm not sure about this case- it feels ok but on the other hand there are 2 different values. When the user is on the page with entity lists and a new entity is created (while being on the page), the hover card shows the newest number of entities (10) while the page (which wasn't refreshed) shows the number of entities without the newly created entity (9). Should I file an issue or it's ok?

[dbemke]

After editing an entity with a long name, the hover card in submission detail page is broken (wrong width of property name, entered values are show beyond the hover card.
https://staging.getodk.cloud/#/projects/97/forms/trees_registration/submissions/uuid%3A2d68092f-0d00-4123-b98a-b87f8c19f9f8

Steps to reproduce:

1. Go to the Entities "Data” tab.
   https://staging.getodk.cloud/#/projects/97/entity-lists/trees/entities
2. Click "More”.
3. In the detail page click "Edit”.
4. In e.g. circumference_cm field enter a long name/number and update the entity.
5. In the "Activity” part click the hyperlink to the submission.
6. Hover over the "Created entity” hyperlink.

[matthew-white]

I'm not sure about this case- it feels ok but on the other hand there are 2 different values. When the user is on the page with entity lists and a new entity is created (while being on the page), the hover card shows the newest number of entities (10) while the page (which wasn't refreshed) shows the number of entities without the newly created entity (9). Should I file an issue or it's ok?

I personally think it's OK. Maybe it's even a good thing, as it's a signal that the page is out-of-date. This question also came up during code review, and I wrote some comments about it here.

After editing an entity with a long name, the hover card in submission detail page is broken (wrong width of property name, entered values are show beyond the hover card.

I was able to reproduce this, and we should have a fix ready soon. Since we put out the release yesterday, I filed a new issue to track this bug: #854.

[dbemke]

Tested with success!