com.github.fluorumlabs.disconnect.vaadin.Notification Maven / Gradle / Ivy

Go to download
Show more of this group Show more artifacts with this name
Show all versions of disconnect-vaadin Show documentation
Vaadin components bindings for Disconnect Zero
The newest version!
package com.github.fluorumlabs.disconnect.vaadin;

import com.github.fluorumlabs.disconnect.core.annotations.WebComponent;
import com.github.fluorumlabs.disconnect.polymer.types.BooleanPropertyChangeEvent;
import com.github.fluorumlabs.disconnect.vaadin.constants.NotificationPosition;
import com.github.fluorumlabs.disconnect.vaadin.elements.NotificationElement;
import com.github.fluorumlabs.disconnect.vaadin.mixins.HasThemePropertyMixin;
import com.github.fluorumlabs.disconnect.vaadin.renderers.NotificationRenderer;
import com.github.fluorumlabs.disconnect.zero.component.*;
import com.github.fluorumlabs.disconnect.zero.observable.ObservableEvent;

import javax.annotation.Nullable;

/**
 * <vaadin-notification> is a Web Component providing accessible and customizable notifications
 * (toasts).
 * The content of the notification can be populated in two ways: imperatively by using renderer callback function
 * and declaratively by using Polymer's Templates.
 *
 * Rendering
 * By default, the notification uses the content provided by using the renderer callback function.
 * 
 * The renderer function provides root, notification arguments.
 * Generate DOM content, append it to the root element and control the state
 * of the host element by accessing notification. Before generating new content,
 * users are able to check if there is already content in root for reusing it.
 *
 * 
<vaadin-notification id="notification"></vaadin-notification>
 * 
 * const notification = document.querySelector('#notification');
 * notification.renderer = function(root) {
 *   root.textContent = "Your work has been saved";
 * };
 * 
 * Renderer is called on the opening of the notification.
 * DOM generated during the renderer call can be reused
 * in the next renderer call and will be provided with the root argument.
 * On first call it will be empty.
 *
 * Polymer Templates
 * Alternatively, the content can be provided with Polymer's Template.
 * Notification finds the first child template and uses that in case renderer callback function
 * is not provided. You can also set a custom template using the template property.
 *
 * <vaadin-notification>
 *   <template>
 *     Your work has been saved
 *   </template>
 * </vaadin-notification>
 * 
 * Styling
 * <vaadin-notification> uses <vaadin-notification-card> internal
 * themable component as the actual visible notification cards. See
 * the stylable parts the
 * <vaadin-notification-card> API.
 * 
 * Note: the theme attribute value set on <vaadin-notification> is
 * propagated to the internal <vaadin-notification-card>.
 */
@WebComponent
public class Notification extends AbstractComponent
		implements HasThemePropertyMixin,
		HasSlots,
		HasStyle, HasComponents> {
	public Notification() {
		super(NotificationElement.TAGNAME());
	}

	/**
	 * The duration in milliseconds to show the notification.
	 * Set to 0 or a negative number to disable the notification auto-closing.
	 */
	public double duration() {
		return getNode().getDuration();
	}

	/**
	 * The duration in milliseconds to show the notification.
	 * Set to 0 or a negative number to disable the notification auto-closing.
	 */
	public Notification duration(double duration) {
		getNode().setDuration(duration);
		return this;
	}

	/**
	 * True if the notification is currently displayed.
	 */
	public boolean opened() {
		return getNode().isOpened();
	}

	/**
	 * True if the notification is currently displayed.
	 */
	public Notification opened(boolean opened) {
		getNode().setOpened(opened);
		return this;
	}

	/**
	 * Alignment of the notification in the viewport
	 * Valid values are top-stretch|top-start|top-center|top-end|middle|bottom-start|bottom-center|bottom-end
	 * |bottom-stretch
	 */
	@Nullable
	public NotificationPosition position() {
		return getNode().getPosition();
	}

	/**
	 * Alignment of the notification in the viewport
	 * Valid values are top-stretch|top-start|top-center|top-end|middle|bottom-start|bottom-center|bottom-end
	 * |bottom-stretch
	 */
	public Notification position(NotificationPosition position) {
		getNode().setPosition(position);
		return this;
	}

	/**
	 * Custom function for rendering the content of the notification.
	 * Receives two arguments:
	 *
	 * 

	 * root The <vaadin-notification-card> DOM element. Append
	 * your content to it.
	 * notification The reference to the <vaadin-notification> element.
	 * 
	 */
	@Nullable
	public NotificationRenderer renderer() {
		return getNode().getRenderer();
	}

	/**
	 * Custom function for rendering the content of the notification.
	 * Receives two arguments:
	 *
	 * 
	 * root The <vaadin-notification-card> DOM element. Append
	 * your content to it.
	 * notification The reference to the <vaadin-notification> element.
	 * 
	 */
	public Notification renderer(NotificationRenderer renderer) {
		getNode().setRenderer(renderer);
		return this;
	}

	/**
	 * Manually invoke existing renderer.
	 */
	public void render() {
		getNode().render();
	}

	/**
	 * Opens the notification.
	 */
	public void open() {
		getNode().open();
	}

	/**
	 * Closes the notification.
	 */
	public void close() {
		getNode().close();
	}

	/**
	 * Fired when the opened property changes.
	 */
	public ObservableEvent openedChangedEvent() {
		return createEvent("opened-changed");
	}

	public HasSlots.Container topStretchSlot() {
		return slotted("top-stretch");
	}

	public HasSlots.Container topStartSlot() {
		return slotted("top-start");
	}

	public HasSlots.Container topCenterSlot() {
		return slotted("top-center");
	}

	public HasSlots.Container topEndSlot() {
		return slotted("top-end");
	}

	public HasSlots.Container middleSlot() {
		return slotted("middle");
	}

	public HasSlots.Container bottomStartSlot() {
		return slotted("bottom-start");
	}

	public HasSlots.Container bottomCenterSlot() {
		return slotted("bottom-center");
	}

	public HasSlots.Container bottomEndSlot() {
		return slotted("bottom-end");
	}

	public HasSlots.Container bottomStretchSlot() {
		return slotted("bottom-stretch");
	}
}