UNPKG

@ux-aspects/ux-aspects

Version:

Open source user interface framework for building modern, responsive, mobile big data applications

280 lines (279 loc) 10.5 kB
import { OnDestroy } from '@angular/core'; import { BehaviorSubject, Observable, Subject } from 'rxjs'; import { DragScrollEvent } from '../../directives/drag/index'; import { DashboardOptions } from './dashboard.component'; import { DashboardWidgetComponent } from './widget/dashboard-widget.component'; import * as i0 from "@angular/core"; export declare class DashboardService implements OnDestroy { private _widgetOrigin; private _actionWidget; private _rowHeight; private _cache; private _event; initialized$: BehaviorSubject<boolean>; widgets$: BehaviorSubject<DashboardWidgetComponent[]>; options$: BehaviorSubject<DashboardOptions>; dimensions$: BehaviorSubject<DashboardDimensions>; height$: Observable<number>; placeholder$: BehaviorSubject<DashboardPlaceholder>; layout$: BehaviorSubject<DashboardLayoutData[]>; stacked$: BehaviorSubject<boolean>; isDragging$: BehaviorSubject<DashboardWidgetComponent>; isGrabbing$: BehaviorSubject<DashboardWidgetComponent>; userLayoutChange$: Subject<DashboardLayoutData[]>; get options(): DashboardOptions; get widgets(): DashboardWidgetComponent[]; get stacked(): boolean; get dimensions(): DashboardDimensions; get columnWidth(): number; /** Unsubscribe from all observables on destroy */ private readonly _onDestroy; constructor(); ngOnDestroy(): void; /** * Add a widget to the dashboard * @param widget The widget component to add to the dashboard */ addWidget(widget: DashboardWidgetComponent): void; /** * Remove a widget from the dashboard * @param widget The widget to remove */ removeWidget(widget: DashboardWidgetComponent): void; /** * Indicate that the dashboard element has been resized * @param width The width of the dashboard element in px * @param height The height of the dashboard element in px */ setDimensions(width?: number, height?: number): void; /** * Produce an object containing all the required layout data. * This can be useful for exporting/saving a layout */ getLayoutData(): DashboardLayoutData[]; /** * Position widgets programatically */ setLayoutData(widgets: DashboardLayoutData[]): void; /** * Update the positions and sizes of the widgets */ renderDashboard(): void; /** * Determine where widgets should be positioned based on their positions, width and the size of the container */ setDashboardLayout(): void; updateWhenStacked(): void; /** Get widgets in the order they visually appear as the widgets array order does not reflect this */ getWidgetsByOrder(): DashboardWidgetComponent[]; /** * Find a position that a widget can fit in the dashboard * @param widget The widget to try and position */ setWidgetPosition(widget: DashboardWidgetComponent): void; /** * Check if a position in the dashboard is vacant or not */ getPositionAvailable(column: number, row: number, columnSpan: number, rowSpan: number, ignoreWidget?: DashboardWidgetComponent): boolean; getOccupiedSpaces(): DashboardSpace[]; /** * Begin resizing a widget * @param action The the widget to resize */ onResizeStart(action: DashboardAction): void; onResizeDrag(action: DashboardAction): void; onResizeEnd(): void; onDragStart(action: DashboardAction): void; onDragEnd(): void; onDrag(action: DashboardAction): void; onDragScroll(widget: DashboardWidgetComponent, event: DragScrollEvent): void; getRowHeight(): number; cacheWidgets(): DashboardCache[]; restoreWidgets(ignoreActionWidget?: boolean, cache?: DashboardCache[], restoreSize?: boolean): void; /** * Return the set of widgets which overlap the given dashboard region. */ getOverlappingWidgets(region: DashboardRegion, actionWidget: DashboardWidgetComponent): DashboardWidgetComponent[]; /** * Resolve any overlapping widgets after a widget changes rowSpan/colSpan. */ resizeWidget(widget: DashboardWidgetComponent): void; /** * Move any widgets which intersect with the given dashboard region. */ shiftWidgetsFromRegion(region: DashboardRegion, actionWidget: DashboardWidgetComponent, validatePosition?: (shiftDirection: ActionDirection) => void): void; /** * When dragging any widgets that need to be moved should be moved to an appropriate position */ shiftWidgets(): void; /** * After shifts have taken place we should verify the place holder position is still valid * @param shiftDirection - the position widgets were shifted */ validatePlaceholderPosition(shiftDirection: ActionDirection): void; /** * Determine if a widget can be moved left - or if it can move the widgets to the right to make space for the widget */ canWidgetMoveLeft(widget: DashboardWidgetComponent, performMove?: boolean, shift?: number): boolean; /** * Determine if a widget can be moved right - or if it can move the widgets to the right to make space for the widget */ canWidgetMoveRight(widget: DashboardWidgetComponent, performMove?: boolean, shift?: number): boolean; /** * Store the initial position of the widget being dragged */ setWidgetOrigin(): void; /** * Calculate all the required positions is a widget was to be positioned at a particular point */ getRequiredSpacesFromPoint(widget: DashboardWidgetComponent, column: number, row: number): DashboardSpace[]; /** * Position widgets based on the position of the placeholder - this is temporary until confirmed */ updateWidgetPositions(widget: DashboardWidgetComponent): void; /** * Determine if a widget is occupying a specific row and column * @param column The columns to check if occupied * @param row The row to check if occupied * @param ignoreResizing Whether or not to ignore the widget currently being resized */ getWidgetsAtPosition(column: number, row: number, ignoreResizing?: boolean): DashboardWidgetComponent[]; /** * Update the placeholder visibility, position and size */ setPlaceholderBounds(visible: boolean, x: number, y: number, width: number, height: number): void; /** * Get the placeholder column position */ getPlaceholderColumn(x: number, width: number): number; /** * Get the column span of the placeholder */ getPlaceholderColumnSpan(width: number): number; /** * Get the row position of the placeholder */ getPlaceholderRow(y: number, height: number): number; /** * Get the row span of the placeholder */ getPlaceholderRowSpan(height: number): number; getColumnFromPx(x: number, rounding?: Rounding): number; getRowFromPx(y: number, rounding?: Rounding): number; commitWidgetChanges(): void; /** * Get the current column width */ getColumnWidth(): number; /** * Calculate the number of rows populated with widgets */ getRowCount(): number; /** * Set the height of the dashboard container element */ setDashboardHeight(): void; /** * Orders the z-index of all widgets to move the active one to the front * @param widget The widget that should be brought to the front */ bringToFront(widget: DashboardWidgetComponent): void; /** * Move a widget down - if widgets are in the position below, then move them down further * @param widget The widget to move downwards */ moveWidgetDown(widget: DashboardWidgetComponent, distance?: number): void; /** * Widgets should not be allowed to have a vacant space above them - if there is one they should move upwards to fill it */ shiftWidgetsUp(): boolean; /** * Iterate over each space a widget occupied * @param widget The widget to determine spaces * @param callback The function to be called for each space, should expect a column and row argument witht he context being the widget */ forEachBlock(widget: DashboardWidgetComponent, callback: (column: number, row: number) => void): void; getWidgetBelow(widget: DashboardWidgetComponent): DashboardWidgetComponent | null; /** * Returns the number of columns available */ getColumnCount(): number; onShiftStart(widget: DashboardWidgetComponent): void; /** Programmatically move a widget in a given direction */ onShift(widget: DashboardWidgetComponent, direction: ActionDirection): void; onShiftEnd(): void; /** Programmatically resize a widget in a given direction */ onResize(widget: DashboardWidgetComponent, direction: ActionDirection): void; getSurroundingWidgets(widget: DashboardWidgetComponent, direction: ActionDirection): DashboardWidgetComponent[]; private moveWidget; static ɵfac: i0.ɵɵFactoryDeclaration<DashboardService, never>; static ɵprov: i0.ɵɵInjectableDeclaration<DashboardService>; } export declare const defaultOptions: DashboardOptions; export interface DashboardDimensions { width?: number; height?: number; } export interface DashboardWidgetDimensions { x: number; y: number; width: number; height: number; } export interface DashboardAction { widget: DashboardWidgetComponent; direction: ActionDirection; event?: MouseEvent; handle?: HTMLElement; } export interface DashboardSpace { widget: DashboardWidgetComponent; column: number; row: number; } export interface DashboardRegion { column?: number; row?: number; columnSpan?: number; rowSpan?: number; } export interface DashboardPlaceholder extends DashboardRegion { visible: boolean; x: number; y: number; width: number; height: number; } export interface DashboardCache { id: string; column: number; row: number; columnSpan: number; rowSpan: number; } export interface DashboardLayoutData { id: string; col: number; row: number; colSpan: number; rowSpan: number; minColSpan?: number; minRowSpan?: number; } export declare enum ActionDirection { Top = 0, TopRight = 1, Right = 2, BottomRight = 3, Bottom = 4, BottomLeft = 5, Left = 6, TopLeft = 7, Move = 8 } export declare enum Rounding { RoundDown = 0, RoundDownBelowHalf = 1, RoundUp = 2, RoundUpOverHalf = 3 }