# Widget

Widget for controls

## Constructor

#### new Widget(container)

Source:
  - widget/Widget.js, line 10

##### Parameters:

Name | Type | Description
--- | --- | ---
`container` | HTMLElement | A domElement where default control widget will be attached to

### Methods

#### addControlBar()

Source:
  - widget/Widget.js, line 51

Add control bar

#### addControlButton(name)

Source:
  - widget/Widget.js, line 215

Add buttons on top of control bar

##### Parameters:

Name | Type | Description
--- | --- | ---
`name` | string | The control button name to be created

#### createCustomItem() → {HTMLSpanElement}

Source:
  - widget/Widget.js, line 1171

Create custom item element

##### Returns:

- The dom element icon

Type
  HTMLSpanElement

#### createDefaultMenu()

Source:
  - widget/Widget.js, line 151

Create default menu

#### createFullscreenButton() → {HTMLSpanElement}

Source:
  - widget/Widget.js, line 380

Create Fullscreen button

##### Fires:

- Widget#event:panolens-viewer-handler

##### Returns:

- The dom element icon for fullscreen

Type
  HTMLSpanElement

#### createMainMenu(menus) → {HTMLElement}

Source:
  - widget/Widget.js, line 897

Create main menu

##### Parameters:

Name | Type | Description
--- | --- | ---
`menus` | array | Menu array list

##### Returns:

- A span element

Type
  HTMLElement

#### createMask()

Source:
  - widget/Widget.js, line 263

Create modal mask

#### createMenu() → {HTMLElement}

Source:
  - widget/Widget.js, line 1023

Create general menu

##### Returns:

- A span element

Type
  HTMLElement

#### createMenuItem(title) → {HTMLElement}

Source:
  - widget/Widget.js, line 766

Create menu item

##### Parameters:

Name | Type | Description
--- | --- | ---
`title` | string | Title to display

##### Returns:

- An anchor tag element

Type
  HTMLElement

#### createMenuItemHeader(title) → {HTMLElement}

Source:
  - widget/Widget.js, line 879

Create menu item header

##### Parameters:

Name | Type | Description
--- | --- | ---
`title` | string | Title to display

##### Returns:

- An anchor tag element

Type
  HTMLElement

#### createSettingButton()

Source:
  - widget/Widget.js, line 295

Create Setting button to toggle menu

#### createSubMenu(title, items) → {HTMLElement}

Source:
  - widget/Widget.js, line 962

Create sub menu

##### Parameters:

Name | Type | Description
--- | --- | ---
`title` | string | Sub menu title
`items` | array | Item array list

##### Returns:

- A span element

Type
  HTMLElement

#### createVideoControl() → {HTMLSpanElement}

Source:
  - widget/Widget.js, line 488

Create video control container

##### Returns:

- The dom element icon for video control

Type
  HTMLSpanElement

#### createVideoControlButton() → {HTMLSpanElement}

Source:
  - widget/Widget.js, line 539

Create video control button

##### Fires:

- Widget#event:panolens-viewer-handler

##### Returns:

- The dom element icon for video control

Type
  HTMLSpanElement

#### createVideoControlSeekbar() → {HTMLSpanElement}

Source:
  - widget/Widget.js, line 598

Create video seekbar

##### Fires:

- Widget#event:panolens-viewer-handler

##### Returns:

- The dom element icon for video seekbar

Type
  HTMLSpanElement

#### dispose()

Source:
  - widget/Widget.js, line 1249

Dispose widgets by detaching dom elements from container

#### mergeStyleOptions(element, options) → {HTMLElement}

Source:
  - widget/Widget.js, line 1228

Merge item css style

##### Parameters:

Name | Type | Description
--- | --- | ---
`element` | HTMLElement | The element to be merged with style
`options` | object | The style options

##### Returns:

- The same element with merged styles

Type
  HTMLElement

### Events

#### panolens-viewer-handler

Source:
  - widget/Widget.js, line 548

##### Properties:

Name | Type | Description
--- | --- | ---
`method` | string | 'toggleVideoPlay' function call on Viewer

Viewer handler event

##### Type:

- object

#### panolens-viewer-handler

Source:
  - widget/Widget.js, line 646

##### Properties:

Name | Type | Description
--- | --- | ---
`method` | string | 'setVideoCurrentTime' function call on Viewer
`data` | number | Percentage of current video. Range from 0.0 to 1.0

Viewer handler event

##### Type:

- object

#### panolens-viewer-handler

Source:
  - widget/Widget.js, line 441

##### Properties:

Name | Type | Description
--- | --- | ---
`method` | string | 'onWindowResize' function call on Viewer

Viewer handler event

##### Type:

- object