Panel

Documentation

Input Parameters

Name Type Description
className string The class name to apply to the main element.
el HTMLElement The element to render the panel to.
headerText string The header text.
isBlocking boolean True for blocking panels.
panelContent string The panel content.
panelFooter string The panel footer content.
panelHeader string The panel header content.
panelType number The panel type.
showCloseButton boolean True to show the close button.
visible boolean Flag to display it by default.

Panel Interface

Name Type/Description
get() Returns the fabric component.
getContent() Returns the panel content element.
getFooter() Returns the panel footer element.
getHeader() Returns the panel header element.
hide() Hides the panel.
isOpen() Returns true if the panel is open, false otherwise.
show(content?: string) Shows the panel.
updateContent(content?: string) Updates the panel content.
updateFooter(content?: string) Updates the panel footer.
updateHeader(content?: string) Updates the panel header.

Fabric Panel Interface

Name Type Description
_animateOverlay boolean Flag to animate the overlay.
_clickHandler EventListener The click handler.
_closeButton HTMLElement The panel close button.
_direction string The panel direction.
_panel HTMLDivElement The panel element.
panelHost IPanelHost The panel host element.
dismiss(callback?: Function)   Closes the panel.

Fabric Panel Host Interface

Name Type Description
overlay IOverlay The overlay.
panelHost HTMLDivElement The panel host element.
dismiss()   Method to hide the overlay.
update(layer: Node, callback?: Function)   Method to update the overlay.

JavaScript

var $REST = require("gd-sprest-js");

// Display a panel
var el = document.querySelector("#panel");
var panel = $REST.JS.Fabric.Panel({
    el: el,
    headerText: "My Panel",
    isBlocking: true,
    panelType: $REST.JS.Fabric.PanelTypes.Large
});

TypeScript

import { Fabric } from "gd-sprest-js";

// Display a panel
var el = document.querySelector("#panel");
var panel = abric.Panel({
    el,
    headerText: "My Panel",
    isBlocking: true,
    panelType: Fabric.PanelTypes.Large
});