Bubble notifications/da

From mediawiki.org
This page is a translated version of the page Bubble notifications and the translation is 13% complete.
An example of a bubble notification

Bubble notifications is a JavaScript system developed as part of MediaWiki for displaying notifications on a web page.

Funktioner

  • Multiple notifications:

It can display multiple notifications at the same time. Each can be closed independently.

  • Automatisk lukning: A notification can be configured to automatically close after a short period of time. This is enabled by default, but individual features using this system may choose to disable it for specific notifications where needed.
  • Tagging:

A notification can optionally be given a name (or "tag"). When a new notification is created with the same name as an older one that is still active, the older one is replaced with the new one. This enables an improved user experience where one would otherwise cause old, incomplete, or duplicate notifications to be visible (example use cases)

API

The entry point for the bubble notifications is the mw.notify() method. Some examples:

mw.notify( 'This is a notification.' ); // Send a plaintext notification
mw.notify( mw.message( 'some-message' ) ); // Use an i18n message to send a notification
mw.notify( $( '<span>This is an <u>HTML</u> notification.</span>' ) ); // Send an HTML notification with a jQuery instance (a DOM node also works)

mw.notify( 'Test', { title: 'Title!' } ); // Give the notification a title
mw.notify( 'Test', { autoHide: false } ); // Don't automatically hide the notification
mw.notify( 'Test', { tag: 'foobar' } ); // Send a notification tagged with a tag
mw.notify( 'Test 2', { tag: 'foobar' } ); // This one will replace the previous 'foobar' notification.

The format is: mw.notify(message, options), available options are:

  • autoHideA boolean indicating whether the notification should automatically be hidden after shown or if it should persist.
  • autoHideSecondsNumber of seconds for timeout of auto-hide notifications.
  • tagAn optional string. When a notification is tagged only one message with that tag will be displayed. Trying to display a new notification with the same tag as one already being displayed will cause the other notification to be closed and this new notification to open up inside the same place as the previous notification.
  • titleAn optional title for the notification. Will be displayed above the content, usually in bold.
  • typeAn optional string for the type of the message used for styling: Examples: 'info', 'warn', 'error', 'success'.
  • visibleTimeoutA boolean indicating if the autoHide timeout should be based on time the page was visible to user or if it should use wall clock time.


See also


Code stewardship