Panorama:TabGroupsAPI: Difference between revisions

From MozillaWiki
Jump to navigation Jump to search
No edit summary
Line 45: Line 45:
<pre>let allGroups = TabGroups.getGroups();   
<pre>let allGroups = TabGroups.getGroups();   
</pre>  
</pre>  
'''Provided objects and methods'''
'''Provided objects, methods and events'''  
<pre>TabGroups
<pre>TabGroups
   [Methods]
   [Methods]
Line 60: Line 60:
TabGroup
TabGroup
   [Properties]
   [Properties]
     id&nbsp;: string
     id: string
     title&nbsp;: string
     title: string
     tabs&nbsp;: xulTab[]
     tabs: xulTab[]
     storage&nbsp;: object
     storage: object


   [Methods]
   [Methods]
Line 75: Line 75:
     tab-removed
     tab-removed
     close
     close
Tab
  [Properties]
    storage: object
</pre>
</pre>

Revision as of 09:20, 14 November 2011

The purpose of this TabGroups API is to provide a simple storage for Panorama and its tab groups. Other add-ons which would like to access tab groups' data can use this API to do that.

Schema

Compatibility

Example

{windows: [{
  tabs: [
    {entries: [{url: "about:mozilla"}]},
    {entries: [{url: "http://example.com/#1"}],
     extData: {"tabgroups": "{\"group\": \"group1-id\", \"title\": \"first tab title\", 
                              \"url\": \"first tab url"}"}},
    {entries: [{url: "http://example.com/#2"}],
     extData: {"tabgroups": "{\"group\": \"group2-id\", \"title\": \"second tab title\", 
                              \"url\": \"second tab url"}, \"active\":\"last active tab in group it belongs\"}"}
  ],
  extData: {
    "tabgroups": "{\"group1-id\": {\"id\": \"group1-id\", \"title\": \"first title\", 
                                   \"bounds\": {\"left\": 35, \"top\": 45, \"width\": 330, \"height\": 310},
                                   \"userSize\": {\"x\": 330, \"y\": 310}}, 
                   \"group2-id\": {\"id\": \"group2-id\", \"title\": \"second title\",
                                   \"bounds": {\"left\": 450, \"top\": 45, \"width\": 330, \"height\": 310},
                                   \"userSize\": {\"x\": 330, \"y\": 310}}, 
                   \"additions\": {\"activeGroup\":\"group2-id\", \"showOnStartup\":true, 
                                   \"pageBounds\" :{\"left\":0, \"top\": 0, \"width\": 1000, \"height\": 750}}}"
  }
}]}

Applications

Panorama

Vertical Tabs

Tree Style Tabs

API Description

To use the TabGroups API, you first need to import the code module into your JavaScript scope:

Components.utils.import("resource:///modules/TabGroups.jsm");

Then you can obtain reference to it by simply accessing them from the TabGroups object exported by the code module. For example:

let allGroups = TabGroups.getGroups();  

Provided objects, methods and events

TabGroups
  [Methods]
    createGroup(DOMWindow aWindow)
    getGroups()
    getGroupsByWindow(DOMWindow aWindow)
    getWindowStorage(DOMWindow aWindow)

  [Events]
    tabgroup-added
    tabgroup-removed
    window-closing

TabGroup
  [Properties]
    id: string
    title: string
    tabs: xulTab[]
    storage: object

  [Methods]
    addTab(xulTab aTab)
    removeTab(xulTab aTab)
    close()

  [Events]
    rename
    tab-added
    tab-removed
    close

Tab
  [Properties]
    storage: object