Lightbox

From MozillaWiki
Jump to navigation Jump to search
The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.
Please use "Edit with form" above to edit this page.

Status

Native Lightbox Gallery
Stage Feature Inbox
Status `
Release target `
Health OK
Status note `

{{#set:Feature name=Native Lightbox Gallery

|Feature stage=Feature Inbox |Feature status=` |Feature version=` |Feature health=OK |Feature status note=` }}

Team

Product manager `
Directly Responsible Individual `
Lead engineer `
Security lead `
Privacy lead `
Localization lead `
Accessibility lead `
QA lead `
UX lead `
Product marketing lead `
Operations lead `
Additional members `

{{#set:Feature product manager=`

|Feature feature manager=` |Feature lead engineer=` |Feature security lead=` |Feature privacy lead=` |Feature localization lead=` |Feature accessibility lead=` |Feature qa lead=` |Feature ux lead=` |Feature product marketing lead=` |Feature operations lead=` |Feature additional members=` }}

Open issues/risks

`

Stage 1: Definition

1. Feature overview

Now when the user selects "view image" on any image from any site, Firefox displays pictures at the center of the screen with a dark background. It would be useful if web developers could add a data-* attribute to some images so that Firefox could show the image that has been left-clicked on in the same fashion as the "view image" option. Maybe not exactly as the "view image" option but like a Lightbox effect with arrows for navigating through the images that have the data-* attribute. If the developer wants to display only thumbnails in the site and the full version of the images in the lightbox gallery then he would add tow data-* attributes: one the data-* attribute in every thumbnail so it is included in the gallery, and another data-* to add the url to the full version of the image. It would be convinient to offer a javascript API for this so that the developer could check for compatibility of this feature in the browser and use a custom lightbox if the feature is not available.

2. Users & use cases

A web developer wants to create a lightbox effect without a hassle and avoiding to add another js and css file to his site. So he adds the attribute data-* to all the thumbnails he wants to showcase and the effect is being taking care of natively by the browser.

3. Dependencies

`

4. Requirements

`

Non-goals

`

Stage 2: Design

5. Functional specification

`

6. User experience design

`

Stage 3: Planning

7. Implementation plan

`

8. Reviews

Security review

`

Privacy review

`

Localization review

`

Accessibility

`

Quality Assurance review

`

Operations review

`

Stage 4: Development

9. Implementation

`

Stage 5: Release

10. Landing criteria

` {{#set:Feature open issues and risks=` |Feature overview=Now when the user selects "view image" on any image from any site, Firefox displays pictures at the center of the screen with a dark background. It would be useful if web developers could add a data-* attribute to some images so that Firefox could show the image that has been left-clicked on in the same fashion as the "view image" option. Maybe not exactly as the "view image" option but like a Lightbox effect with arrows for navigating through the images that have the data-* attribute. If the developer wants to display only thumbnails in the site and the full version of the images in the lightbox gallery then he would add tow data-* attributes: one the data-* attribute in every thumbnail so it is included in the gallery, and another data-* to add the url to the full version of the image. It would be convinient to offer a javascript API for this so that the developer could check for compatibility of this feature in the browser and use a custom lightbox if the feature is not available. |Feature users and use cases=A web developer wants to create a lightbox effect without a hassle and avoiding to add another js and css file to his site. So he adds the attribute data-* to all the thumbnails he wants to showcase and the effect is being taking care of natively by the browser. |Feature dependencies=` |Feature requirements=` |Feature non-goals=` |Feature functional spec=` |Feature ux design=` |Feature implementation plan=` |Feature security review=` |Feature privacy review=` |Feature localization review=` |Feature accessibility review=` |Feature qa review=` |Feature operations review=` |Feature implementation notes=` |Feature landing criteria=` }}

Feature details

Priority Unprioritized
Rank 999
Theme / Goal `
Roadmap `
Secondary roadmap `
Feature list `
Project `
Engineering team `

{{#set:Feature priority=Unprioritized

|Feature rank=999 |Feature theme=` |Feature roadmap=` |Feature secondary roadmap=` |Feature list=` |Feature project=` |Feature engineering team=` }}

Team status notes

  status notes
Products ` `
Engineering ` `
Security ` `
Privacy ` `
Localization ` `
Accessibility ` `
Quality assurance ` `
User experience ` `
Product marketing ` `
Operations ` `

{{#set:Feature products status=`

|Feature products notes=` |Feature engineering status=` |Feature engineering notes=` |Feature security status=` |Feature security health=` |Feature security notes=` |Feature privacy status=` |Feature privacy notes=` |Feature localization status=` |Feature localization notes=` |Feature accessibility status=` |Feature accessibility notes=` |Feature qa status=` |Feature qa notes=` |Feature ux status=` |Feature ux notes=` |Feature product marketing status=` |Feature product marketing notes=` |Feature operations status=` |Feature operations notes=` }}