Closed Bug 919284 Opened 11 years ago Closed 7 years ago

Visually indicate if remote content is being loaded in a panel

Categories

(Add-on SDK Graveyard :: General, defect, P3)

x86_64
Linux
defect

Tracking

(Not tracked)

RESOLVED INCOMPLETE

People

(Reporter: arky, Unassigned)

References

Details

Attachments

(2 files)

Show a spinner animation while loading panel content. In this addon I am loading a remote mobile webpage inside a panel.

Example: https://addons.mozilla.org/en-US/firefox/addon/xe-currency-converter/?src=api
Code: https://github.com/arky/xe-currency-convertor-addon

Use-Case:
Email from my add-on user: 

"Hello Arky, from several months I am using the XE Currency Converter extension that you developed and certainly was what I was looking from a long time but since the upgrade to Firefox 23 the dialog/popup that contains the converter page stay thus when expand any of the dropdown lists (See attached Screenshot)"
Assignee: nobody → jsantell
Arky, is this two separate issues? Is there an issue with Firefox 23+ losing focus when using a select menu, and causing the panel to disappear? (On FF27 nightly it worked fine for me) Or did the user just think something was wrong due to a long load time of the xe.com site?
Flags: needinfo?(hitmanarky)
I'd like to get UX opinion how they would want to indicate remote loading. Darrin?
Priority: -- → P3
Summary: Show spinner while loading panel content → Visually indicate if remote content is being loaded in a panel
After a brief chat with shorlander, and recognizing that the only established indicators we have are the tab spinner and the pdf.js progress bar, I think using a version of the spinning tab indicator would work best. It's familiar and will feel like part of the browser. We can either place it in the top left (as in tabs) or create a slightly larger one and center it. Is there any reason to bias towards one or the other?
Not from my perspective - I just care about cases where panels show remote content and ( especialyl in cases of bad wifi / network conditions ) there is no visual feedback that something is happening ....slowly.
Then I'd say we go with something akin to the tab loading indicator, positioned top left in the panel with similar padding as the tab indicator has.
Flags: needinfo?(hitmanarky)
Attached file GH PR 1320
Matteo,
This is a quick implementation of adding a loader to the panel. You're more familiar with styles and panels than me, so wanted to run it by you to see if there's a better way, and also a good way to test that this is actually working outside of a visual check.
Attachment #8345043 - Flags: feedback?(zer0)
Get a chance to look at this, Matteo?
Comment on attachment 8345043 [details] [review]
GH PR 1320

I added some comment in the PR. Consider also that we could also add a panel's css class in firefox's css, now that we're part of the browser, and it would be more cleaner; but we can also have this approach for the time being.

About the unit test, I would just check the logic: so that the style is properly applied when is expected to be applied, and removed when is expected to be removed; if the image is actually "present" or not, I would avoid to test – otherwise you should grab a screenshot, or trying to loading the image, and it sounds to me an overkill.
Attachment #8345043 - Flags: feedback?(zer0) → feedback+
Unassigning myself from bugs I haven't gotten around to
Assignee: jsantell → nobody
https://bugzilla.mozilla.org/show_bug.cgi?id=1399562
Status: NEW → RESOLVED
Closed: 7 years ago
Resolution: --- → INCOMPLETE
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: