Mobile/Projects/Third-party service integration MVP: Difference between revisions

From MozillaWiki
Jump to navigation Jump to search
(→‎JS APIs: Added filter fields to HomeProvider.jsm example)
(→‎JS APIs: added backImageUrl to view config)
Line 88: Line 88:
       views: [{
       views: [{
         type: Home.panels.View.LIST,
         type: Home.panels.View.LIST,
         dataset: DATASET_ID
         dataset: DATASET_ID,
        backImageUrl: "http://example.com/myBackIcon.png"
       }]
       }]
     };
     };

Revision as of 23:07, 18 March 2014

Weekly stand-up meeting

Tracking

Open P1 bugs

These bugs are blockers for Firefox Hub v1 (shipping in Fx30)

Bugzilla query error

Array ( [type] => error [message] => http-bad-status [params] => Array ( [0] => 403 [1] => Forbidden ) ) 1


Open P2 bugs

These bugs are blockers for Firefox Hub v2 (feature complete, targeting Fx31)

Bugzilla query error

Array ( [type] => error [message] => http-bad-status [params] => Array ( [0] => 403 [1] => Forbidden ) ) 1


All bugs

Bugzilla query error

Array ( [type] => error [message] => http-bad-status [params] => Array ( [0] => 403 [1] => Forbidden ) ) 1


Implementation

Glossary

  • Hub: The official name of this project
  • panel: user-visible section on about:home, formerly known as a "page"
  • view: user-visible section in a panel, backed by one set of data
  • dataset: ordered set of data specified by an add-on service, stored in a content provider
  • home config: used to determine what panels to show on about:home, user can change this in settings
  • panel config: used to determine what views (and their corresponding data) to show in a panel
  • dynamic panel: panel whose contents are specified by a panel config that is created from the JS API
  • layout: used to define the arrangement of views within a dynamic panel
  • list: don't use this term
  • widget: don't use this term
  • provider: don't use this term (some service provider can make an add-on, but the idea of a "provider" is out of the scope of this feature)

High-Level Architecture

(Disclaimer: not all these things have landed yet)

  • Home.jsm: APIs to register panels, used to specify layout for panel, which includes views and the dataset ids that back them
  • HomeProvider.jsm: APIs to store data from the JS side, data is stored with a dataset id - bug 942288
  • HomeProvider.java: Content provider that performs queries from the Java side, uses the SQLiteBridge - bug 961092, bug 952310

JS APIs

Updated: March 14

Home.jsm 

 Home.panels {
   // options includes id, title, layout, views
   void register(string id, function optionsCallback);
   void unregister(string id);
   void install(string id);
   void uninstall(string id);
   void update(string id);
 }

 // Example usage
 const PANEL_ID = "test.panel@mydomain.com";
 const DATASET_ID = "test.dataset@mydomain.com";
 
 function optionsCallback() {
   return {
     title: "My Panel",
     // "layout" property is optional. If omitted, it defaults to FRAME (only supported layout for v1).
     layout: Home.panels.Layout.FRAME,
     views: [{
       type: Home.panels.View.LIST,
       dataset: DATASET_ID,
       backImageUrl: "myBackIcon.png"
     }]
   };
 }
 
 Home.panels.register(PANEL_ID, optionsCallback);
 Home.panels.install(PANEL_ID);

HomeProvider.jsm 

 HomeProvider {
   HomeStorage getStorage(string datasetId);
   boolean requestSync(string datasetId, function callback);
   void addPeriodicSync(string datasetId, integer interval, function callback);
 }
 HomeStorage {
   // data is an array of JSON objects that match DB schema
   // e.g. dataset_id, url, primary_text, secondary_text
   Promise save(array data);
   Promise deleteAll();
 }

 // Example usage
 function syncData() {
   Task.spawn(function() {
     let storage = HomeProvider.getStorage(DATASET_ID);
     yield storage.deleteAll();
     yield storage.save([
       { url: "http://example.com/first",
         title: "First Example" },
       { url: "http://example.com/second",
         title: "Second Example" },
       { url: "filter://folder",
         title: "Folder" },
       { url: "http://example.com/third",
         title: "Filtered Example",
         filter: "folder" }
     ]);
   });
 }
 
 // calls syncData callback once every 3600 seconds (1 hour)
 HomeProvider.addPeriodicSync(DATASET_ID, 3600, syncData);

MDN Documentation Notes

  • Create tutorial style documentation using an addon (RSS?).

Best practices

  • Don't create anonymous functions when passing callbacks into syncing functions (and elsewhere?) due to the potential memory implications

Add-on reviewer checks

  • Unique ids for panels and datasets
  • Remove panels and delete HomeProvider data on uninstall
  • Saving data with sync callback (warnings should appear in logcat if this isn't the case)

Demo add-ons

Goals

Ship the first cupcake-sized iteration of third-party integration functionality, focused on one or two initial service providers, in Fx30.

This initial iteration focuses on:

  • Signing in or signing up to one or more integrated third-party services
  • Managing the services in a new Settings page
  • Viewing and interacting with the integrated & signed-in services by way of added "my list" home screens

Use cases

Must have

  1. Service A Integration (API, sign-in / sign-up flow hand-off, viewing their files)
  2. Sign in to Service A via a flow initiated from the new swipe-able home screen
  3. Sign up to Service A via a flow initiated from the new swipe-able home screen
  4. Sign in to Service A via a flow initiated from the menu -> settings page
  5. Sign up to Service A via a flow initiated from the menu -> settings page
  6. Direct users to the menu -> settings page OR new home screen from the about:home snippets banner
  7. Add a menu -> settings page to manage the home screens (inc 3rd party providers)
    1. Add
    2. Remove
  8. Ability for a user to view – in ONE view – their files from their Service A account in their Service A home screen
    1. Must include: gifs, pngs, jpegs, PDFs... (anything that can be viewed within our browser)
    2. Question: can anything be done to view docs or xls? -> look for an app and punt it out?
    3. Must incorporate an error or some other message to the user if we cannot open a file type
    4. Ability to add URLs and display said URLs in this list (including video / audio files)
    5. Ability to save PDFs to this list
  9. Quickshare integration
    1. Ability to have Service A be in the default (visible) position for new and current users (NOTE: for current users, this can only happen if we display 2 icons upon release: the user’s most used intent + the addition. THEN the algorithm should kick in to replace these icons with the top two most shared.)
    2. Ensure Quickshare icons are set via the algorithm based on usage
    3. If Service A is not yet set up, pressing the icon should send the user to the sign in / sign-up flow (and be able to cancel out of that operation and send you back to the original spot)
  10. If only Service A, can we add RSS / website feed subscribing as an alternative/second service?

Nice to have

  1. Service B integration (API, sign-in / sign-up flow hand-off, viewing their files)
  2. Sign in to Service A (or Service B) via a flow initiated from the about:home snippets banner
  3. Sign up to Service A (or Service B) via a flow initiated from the about:home snippets banner
  4. Ability to add Offline Reader List Articles and display said articles in this list (how would this display in a Service A user's account from a non-Firefox interface)
  5. Flow to automatically use Service A as a repository for all downloads from the browser
  6. Integrating (adding) RSS feeds or websites
  7. Iterating on the menu -> settings page to manage the home screens (inc 3rd party providers)
    1. Rearrange
    2. Suggest
    3. Automatic downloads to a selected provider
  8. WebActivities

UX design

Justification

The Firefox Hub experience is one of the primary new features we have slated for 2014, and supports the majority of our goals, including:

  • User value & user delight = marketshare & organic growth - we believe that the Firefox Hub will help unify users' web experiences across sites, services, and apps. This initial MVP is only the beginning, but there is huge potential in this feature to bring the browser back into the centre of a user's web habits. This is in support of our marketshare & pre-install goals.
  • Habit-share/usage - increasing how often and how much a user uses their browser, the better. Greater usage leads to greater mindshare leads to greater organic growth and marketshare, as well as helping promote our browser to third-party services & potential partners.
  • Rev-share and co-marketing - working with third-party services is a key factor in our plans for 2014.
  • Webapp/ecosystem support - while not directly part of this initial MVP, we have plans to do webapp integration as part of this in the future, as well as using Firefox Accounts to help support these features for users across devices. Could also eventually integrate Marketplace as a part of the core Firefox Hub experience, when we have a better idea of how we want to promote Marketplace within the browser.

References and other info

Quality criteria

  • No user-perceptible performance degradation
  • All goals are met
  • All "must have" user stories/use cases are implemented & tested
Retrieved from "https://wiki.allizom.org/index.php?title=Mobile/Projects/Third-party_service_integration_MVP&oldid=952745"