Shellfish

Class: NotificationArea

ui.NotificationArea

new ui.NotificationArea ()

NotificationArea.shui:38

Element for displaying popup notifications.

This box is transparent to pointer events and may be placed above your application contents. The notification popups are as wide as this notification area.

Example

require "shellfish/ui";
require "/icons/ui-icons.css";

Document {

    onInitialization: () =>
    {
        notificationArea.createNotification("Welcome", "ui-info", "Welcome to Shellfish!");
    }

    NotificationArea {
        id: notificationArea

        position: "free"
        origin: "top-right"
        width: theme.itemWidthLarge * 2
        height: thisDocument.windowHeight
    }

}

Notifications have a number of properties you can set to control their appearance. See Notification for details.

Properties:
Name Type Description
count number

[readonly] The current amount of notifications.
verticalAlignment string

(default: "top") The vertical alignment of the notifications. One of top|bottom

Extends

Classes

Notification

Methods

createCustomNotification (sourceTemplate)html.Box

NotificationArea.shui:106

Creates and returns a new custom notification. If sourceTemplate is specified, the template is loaded into the notification window.

Name Type Description
sourceTemplate function optional

A Shui template.
Returns:
Type Description
html.Box The notification.

createNotification (title, icon, message, timeout)html.Box

NotificationArea.shui:117

Creates and returns a standard notification with title, icon, and message text. The notification disappears after a set time.

Name Type Description
title string

The title text.
icon string

The icon to show. Pass "" for no icon.
message string

The message text.
timeout number optional

The timeout value in ms after which the notification disappears. Defaults to 3000 ms.
Returns:
Type Description
html.Box The notification.

Events

drawAttention

NotificationArea.shui:131

Is triggered when the notification area wants to draw attention, e.g. when a new notification appears. By default, nothing special happens on this event.