Virtual Tour: Render one line labels on view

Description

Implement basic support for “one-line” labels, with support for the four different positions:
https://preview.uxpin.com/ee283b5f079a340070f36f93c77f0ed86ecbe762#/pages/121847785/simulate/no-panels?mode=i#TextElement3214901cea914be68d692d1cb220d2a3

This is does not cover the following:

  • Label for scene

  • Expanding/collapsing the labels.

  • Overlapping labels.

Acceptance Criteria

None

Activity

Show:
Simon Date
December 8, 2020, 1:39 PM

I’ve just added a commit to use position: absolute which makes only the selection border appear around the border.

I’ve also reduced the font-size to 0.9em on static scene so that it looks the same on single line as it does in the UX prototype. On three-sixty this value is set to 1.8em.

Finally, I’ve set the left and right align to have a min-width of 6em and max-width of 9em. Meaning that smaller labels don’t look too large. Top and bottom align always have 9em.

Hanna Eide Solstad
December 10, 2020, 9:43 AM

Looks much better now!

Here are my comments:

  • Since creating a new NavigationButtonLabel there should move the css that is related to it as well

  • I get these errors when in the process of creating one. Should probably be a check if label is defined before getting label.labelText

  • For the positioning of the button labels you should use:

We try to avoid using “magic numbers” because it is more difficult to understand and it is a problem if the button width is changed now.

  • I see there is still some commented out functions in NavigationButtonLabel that can be removed if

Hanna Eide Solstad
December 15, 2020, 12:47 PM

Great work Simon! I only find one issue now and that is for the top and bottom aligned labels is not positioned correctly as shown below.

Simon Date
December 15, 2020, 4:50 PM

I’ve just fixed the height and also changed the text-align to prevent it jumping around on open/close.

Can you remind me the proposed functionality of label top? Is it meant to expand upwards or downwards by default? I know this will also need to be implemented eventually for when we add the side detection.

Hanna Eide Solstad
December 15, 2020, 7:00 PM

Looks great now!

As shown here the label top is supposed to expand upwards if it doesn’t overflow, but that will be handled in this issue

Done

Assignee

Simon Date

Reporter

Pål Jørgensen

Labels

None

Funding

None

Code reviewer

Hanna Eide Solstad

Released

None

Time tracking

0m

Time remaining

0m

Sprint

None

Priority

Medium