Source docs
Classes¶
- Background
This module sets up all functionality and event handlers in the background context of the extension. Currently, this module sets up extension context menu. Instantiate background to activate this functionality.
- Dragging
Makes child nodes of some DOM element draggable, using native HTML drag and drop.
- Menu
Menu panel is a DOM elements that shows a list of links. This menu panel is drawn dynamically by creating all menu elements programmatically on
render()
. The parent instantiating the menu will call render. Parent must then add the returned menu to DOM tree to display it to user.- Popup
This is the main class for the popup window that shows when user clicks extension icon. This class is responsible for:
- saving/restoring persistent data and
- rendering the menu panel.
This popup view can easily be extended to display other content, but currently it renders the menu panel only.
Background¶
This module sets up all functionality and event handlers in the background context of the extension. Currently, this module sets up extension context menu. Instantiate background to activate this functionality.
new Background()¶
Initialize background scripts.
Example
Initialize background | |
---|---|
Dragging¶
Makes child nodes of some DOM element draggable, using native HTML drag and drop.
new Dragging(idAttribute, container, onElementRender, onDragEndCallback)¶
Create a new draggable.
Param | Type | Description |
---|---|---|
idAttribute | string |
For each draggable element, this attribute will provide its id, for example id when element is expected to have such attribute e.g. <span id='label-1'>example</span> . |
container | Element |
The first parent of all draggable elements -> provide a DOM element reference. |
onElementRender | function |
After drag events have been attached, other remaining action handlers still need to be attached. This callback function will allow initiator to bind additional events to draggable elements. |
onDragEndCallback | function |
After drag is done, this callback function notifies initiator that the item order within the draggable area has changed. |
Example
Creating a new draggable | |
---|---|
Menu¶
Menu panel is a DOM elements that shows a list of links. This menu panel
is drawn dynamically by creating all menu elements programmatically on render()
.
The parent instantiating the menu will call render. Parent must then add the returned
menu to DOM tree to display it to user.
Kind: global class
- Menu
- new Menu(getLinks, onPinToggle, onPinOrderChange, getRecent)
- .name ⇒
string
- .idAttr ⇒
string
- .render() ⇒
Element
new Menu(getLinks, onPinToggle, onPinOrderChange, getRecent)¶
Create a menu of navigation links.
Returns: Object
- Menu panel reference.
Param | Type | Description |
---|---|---|
getLinks | function |
Function that returns all links. |
onPinToggle | function |
Callback function for when link is pinned/unpinned. |
onPinOrderChange | function |
Callback function for when links are re-ordered. |
getRecent | function |
Function that returns list of recent links. |
Example
Create menu of links | |
---|---|
Menu.name ⇒ string
¶
Name of this menu view.
Kind: static property of Menu
Menu.idAttr ⇒ string
¶
DOM attribute for getting the unique id of a link.
Kind: static property of Menu
Menu.render() ⇒ Element
¶
Programmatically draws the menu panel and its links.
Kind: static method of Menu
Returns: Element
- DOM element representing the menu.
Access: public
Example
Popup¶
This is the main class for the popup window that shows when user clicks extension icon. This class is responsible for:
- saving/restoring persistent data and
- rendering the menu panel.
This popup view can easily be extended to display other content, but currently it renders the menu panel only.
new Popup()¶
Create a popup
Example
Create popup | |
---|---|
.ContextMenu¶
This module adds custom options to Chrome browser action context menu
Kind: static class
See: chrome.contextMenus API
Info
This feature requires contextMenus
permission in extension manifest.
ContextMenu.initialize()¶
Initialize extension context menu
Kind: static method of ContextMenu
Example
ContextMenu.generateOption(key, value)¶
Make context menu option.
Kind: static method of ContextMenu
Param | Type | Description |
---|---|---|
key | string |
Option key/id. |
value | Object |
|
value.title | string |
Option title. |
value.id | string | number |
Option id. |
value.parentId | string | number |
Option parent id. |
ContextMenu.generateUrl(option)¶
Generates an absolute url for a menu option.
Kind: static method of ContextMenu
Param | Type | Description |
---|---|---|
option | Object |
|
option.url | string |
URL of context menu link. |
ContextMenu.contextMenuOnClick(info)¶
Handles context menu option click.
Kind: static method of ContextMenu
See
Param | Type | Description |
---|---|---|
info | Object |
|
info.menuItemId | string | number |
The ID of the menu item that was clicked. |
.Helpers¶
This module contains various, static menu panel helper methods.
Kind: static class
- .Helpers
- .unpinnedItemIcon ⇒
string
- .pinnedItemIcon ⇒
string
- .generateIcon(icon, className) ⇒
string
- .localizedSort(linkList) ⇒
Array.<Array.<String>>
- .translateLabel(name) ⇒
string
- .appendDivider(panel)
- .unpinnedItemIcon ⇒
Helpers.unpinnedItemIcon ⇒ string
¶
Generate SVG icon for unpinned link.
Kind: static property of Helpers
Returns: string
- Icon element as HTML.
Helpers.pinnedItemIcon ⇒ string
¶
Generate SVG icon for pinned link.
Kind: static property of Helpers
Returns: string
- Icon element as HTML.
Helpers.generateIcon(icon, className) ⇒ string
¶
Given an icon name, this function returns SVG element.
Kind: static method of Helpers
Returns: string
- Icon element as HTML string.
Param | Type | Description |
---|---|---|
icon | SVGIcons |
One of |
className | string |
Element class. |
Helpers.localizedSort(linkList) ⇒ Array.<Array.<String>>
¶
Sort a list of links by their localized label.
Kind: static method of Helpers
Returns: Array.<Array.<String>>
- Sorted list of tuples, where
- first element is localized label
- second element is the original link
Param | Type | Description |
---|---|---|
linkList | Array.<string> |
List of links. |
Helpers.translateLabel(name) ⇒ string
¶
Get the translated dictionary value for some link.
Kind: static method of Helpers
Returns: string
- Translated label.
Param | Type | Description |
---|---|---|
name | string |
Link name (dictionary key). |
Helpers.appendDivider(panel)¶
Create a horizontal menu divider element and append it to the end of the provided panel element (in place). This method returns nothing. After calling this method panel will have a divider as its last DOM child.
Kind: static method of Helpers
Param | Type | Description |
---|---|---|
panel | Element |
DOM element where to append the divider. |
.RecentLinks¶
Recent links is a list of URL that were used recently (based on config). They become stale after some time and then get removed from the recent list.
Kind: static class
RecentLinks.isStillRecent(timestamp) ⇒ boolean
¶
Determine if some timestamp still qualifies as "recent".
Kind: static method of RecentLinks
Returns: boolean
- True if link is still valid relative to current time.
Param | Type | Description |
---|---|---|
timestamp | number |
Milliseconds since epoch when link was last accessed. |
Example
Check if recent | |
---|---|
RecentLinks.addRecent(url, callback)¶
Mark some URL as recently used. Will either add or update the link, depending on if it already exists as a recently used link.
Kind: static method of RecentLinks
Param | Type | Description |
---|---|---|
url | string |
Link URL. |
callback | function |
Handler for when function is done. |
RecentLinks.getRecent(callback)¶
Get all recent items; note that this methods returns everything that is "not-stale". It doesn't check if link is pinned or not. That should be done at display time.
Kind: static method of RecentLinks
Param | Type | Description |
---|---|---|
callback | function |
Result handler |
.Storage¶
Application storage for persisting data. Persisted data includes:
- pinned links (user preference)
- recently used links (based on user behavior).
This storage is stored in chrome sync storage, which is specific to current user, and will sync between devices if user is signed in and sync is enabled.
Kind: static class
See: Chrome storage
Info
This feature requires storage
permission in extension manifest.
Storage.keys ⇒ Object
¶
List of storage keys. Only these keys can be stored in this storage.
Kind: static enum of Storage
Storage.get(keys, callback)¶
Get some property from storage.
Kind: static method of Storage
Param | Type | Description |
---|---|---|
keys | string | Array.<string> | Object |
Must be one of: A single key to get, list of keys to get, or a dictionary specifying default values (see description of the object). An empty list or object will return an empty result object. Pass in null to get the entire contents of storage. |
callback | function |
Function to call with result. |
Example
Get values from storage | |
---|---|
Storage.save(key, value, callback)¶
Save some property in storage.
Kind: static method of Storage
Param | Type | Description |
---|---|---|
key | string |
One of keys. |
value | * |
Value to save. |
callback | function |
Called after save operation has completed. |
Example
Save value to storage | |
---|---|
.Config : Object
¶
Application configurations.
Kind: static constant
Read only: true
- .Config :
Object
- .SVGIcons :
enum
- .ContextMenuOptions :
enum
- .recentIntervalMillis :
number
- .SVGIcons :
Config.SVGIcons : enum
¶
App icons svg paths.
Kind: static enum of Config
Config.ContextMenuOptions : enum
¶
List of options to display in the context menu. Links will open in new tab when width/height (ww/wh) are not specified. Otherwise, links will open in a window of specified size.
Kind: static enum of Config
Config.recentIntervalMillis : number
¶
When a link clicked within last X milliseconds, it is considered "recently used".
Kind: static constant of Config