# Web Notifications (Toastr)

(part of package '[Web Notifications](https://docs.servoy.com/reference/servoyextensions/packages/browser-plugin-packages/web-notifications)')

You can access it in code via: **plugins.webnotificationsToastr**

## Properties

## API

### clear()

Removes current toasts using animation

***

### clearToastr(toastrId)

Removes the toast with the given ID

**Parameters:**

> * {[Object](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/object)} toastrId The unique identifier of the toast notification to be removed.

***

### createToastrOptions()

Returns new, empty toastrOptions

**Returns:** [CustomType\<webnotificationsToastr.toastrOptions>](#toastroptions) A new, empty toastrOptions object for configuring toast notifications.

***

### error(message,title,options,toastrId,onClick)

Shows an error toastr with the given message, optional title and options

**Example:**

```js
plugins.webnotificationsToastr.error('Oh no. Something went wrong. It will be OK', 'Error', null, 'sampleID', onClickDialog);

function onClick(toastrId) {
	application.output('toastrId');
}
```

**Parameters:**

> * {[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)} message The message to show
> * {[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)} \[title] The optional title shown above the message
> * {[CustomType\<webnotificationsToastr.toastrOptions>](#toastroptions)} \[options] The toastrOptions object with additional options
> * {[Object](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/object)} \[toastrId] The optional id that can be used to clear this specific toastr via clearToastr
> * {[Function](https://docs.servoy.com/servoy-developer/component_and_service_property_types#function)} \[onClick] The optional callback function when the toastr is clicked

***

### info(message,title,options,toastrId,onClick)

Shows an info toastr with the given message, optional title and options

**Example:**

```js
plugins.webnotificationsToastr.info('Hey, Servoy World is coming up in May!', 'Servoy World', null, 'sampleID', onClickDialog);

function onClick(toastrId) {
	application.output('toastrId');
}
```

**Parameters:**

> * {[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)} message The message to show
> * {[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)} \[title] The optional title shown above the message
> * {[CustomType\<webnotificationsToastr.toastrOptions>](#toastroptions)} \[options] ToastrOptions object with additional options
> * {[Object](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/object)} \[toastrId] Optional id that can be used to clear this specific toastr via clearToastr
> * {[Function](https://docs.servoy.com/servoy-developer/component_and_service_property_types#function)} \[onClick] Optional callback function when the toastr is clicked

***

### setGlobalOptions(options)

Sets the given options globally

**Parameters:**

> * {[CustomType\<webnotificationsToastr.toastrOptions>](#toastroptions)} options ToastrOptions

***

### success(message,title,options,toastrId,onClick)

Shows a success toastr with the given message, optional title and options

**Example:**

```js
plugins.webnotificationsToastr.success('Hey, Servoy World is coming up in May!', 'Servoy World', null, 'sampleID', onClickDialog);

function onClick(toastrId) {
	application.output('toastrId');
}
```

**Parameters:**

> * {[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)} message The message to show
> * {[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)} \[title] The optional title shown above the message
> * {[CustomType\<webnotificationsToastr.toastrOptions>](#toastroptions)} \[options] ToastrOptions object with additional options
> * {[Object](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/object)} \[toastrId] The optional id that can be used to clear this specific toastr via clearToastr
> * {[Function](https://docs.servoy.com/servoy-developer/component_and_service_property_types#function)} \[onClick] The optional callback function when the toastr is clicked

***

### warning(message,title,options,toastrId,onClick)

Shows a warning toastr with the given message, optional title and options

**Example:**

```js
plugins.webnotificationsToastr.warning('Hey, Servoy World is coming up in May!', 'Servoy World', null, 'sampleID', onClickDialog);

function onClick(toastrId) {
	application.output('toastrId');
}
```

**Parameters:**

> * {[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)} message The message to show
> * {[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)} \[title] The optional title shown above the message
> * {[CustomType\<webnotificationsToastr.toastrOptions>](#toastroptions)} \[options] The toastrOptions object with additional options
> * {[Object](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/object)} \[toastrId] The optional id that can be used to clear this specific toastr via clearToastr
> * {[Function](https://docs.servoy.com/servoy-developer/component_and_service_property_types#function)} \[onClick] The optional callback function when the toastr is clicked

***

## Types

## toastrOptions

Options to configure the appearance and behavior of toastr notifications. scripting type: CustomType\<webnotificationsToastr.toastrOptions>

* actionButton
  * If true will show a custom toastr with an additional action
  * **Type**: [boolean](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/boolean)
  * **Default Value**: "false"
* actionButtonText
  * When the actionButton is true, set the text to show for the action section; can be an html string
  * **Type**: [string](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)
* closeButton
  * If true, a close button is displayed on the toast.
  * **Type**: [boolean](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/boolean)
* closeHtml
  * The HTML for the close button.
  * **Type**: [string](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)
* disableTimeOut
  * If true, disables the auto-hide timeout.
  * **Type**: [boolean](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/boolean)
* enableHtml
  * If true, allows HTML content in the toast message.
  * **Type**: [boolean](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/boolean)
* extendedTimeOut
  * The time in milliseconds for extended timeout on hover.
  * **Type**: [int](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/number)
* hideDuration
  * The duration in milliseconds for the hide animation.
  * **Type**: [int](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/number)
* hideEasing
  * The easing function to use when hiding the toast.
  * **Type**: [string](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)
* hideMethod
  * The method used to hide the toast (deprecated for old jQuery implementations).
  * **Type**: [string](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)
* messageClass
  * CSS class applied to the toast message.
  * **Type**: [string](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)
* newestOnTop
  * If true, newer toasts appear on top of older ones.
  * **Type**: [boolean](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/boolean)
* onActivateTick
  * If true, activates a tick animation when the toast is activated.
  * **Type**: [boolean](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/boolean)
* positionClass
  * CSS class that determines the position of the toast notification.
  * **Type**: [string](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)
* progressAnimation
  * The type of animation used for the progress bar.
  * **Type**: [string](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)
* progressBar
  * If true, displays a progress bar within the toast.
  * **Type**: [boolean](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/boolean)
* showDuration
  * The duration in milliseconds for the show animation.
  * **Type**: [int](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/number)
* showEasing
  * The easing function to use when showing the toast.
  * **Type**: [string](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)
* showMethod
  * The method used to show the toast (deprecated for old jQuery implementations).
  * **Type**: [string](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)
* tapToDismiss
  * If true, clicking on the toast will dismiss it.
  * **Type**: [boolean](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/boolean)
* timeOut
  * The time in milliseconds before the toast auto-hides.
  * **Type**: [int](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/number)
* titleClass
  * CSS class applied to the toast title.
  * **Type**: [string](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)
* toastClass
  * CSS class applied to the toast container.
  * **Type**: [string](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

***