LayoutBase Class
File
c1.nav.js
Module
c1.nav
Base Class
DisposableObject
Derived Classes
FlowLayout, GridLayout, SplitLayout
Implements
ILayout

Defines the base class for the layout.

We can define our own layouts by implementing ILayout. We need write the codes for initializing, saving/loading layout, managing the tiles, painting and moving. It is a little complex. If extending from this class, it will be an easy thing as it helps us to consider these. We only need to override some methods to implement our own customizing parts.

Constructor

constructor

constructor(options?: any): LayoutBase

Initializes a new instance of the LayoutBase class.

Parameters
  • options: any Optional

    JavaScript object containing initialization data for the layout.

Returns
LayoutBase

Properties

activeTile

Gets the current active tile.

Type
Tile

dashboard

Gets the DashboardLayout control which the layout is applied in.

Type
DashboardLayout

definition

Gets or sets the current layout settings as a JSON string.

This property is typically used to persist the layout settings. The maximum state of the tile is temporary and it will not be persisted.

Type
any

fullTypeName

Gets the full type name of the current object.

It should be overrided for every class which extends from this class..

Type
string

isCreateGroup

Gets the isCreateGroup of the current object.

Type
boolean

items

Gets the layout item collection.

Type
LayoutItemCollection

Methods

addEventListener

addEventListener(target: EventTarget, type: string, fn: any, capture?: boolean): void

Adds an event listener to an element owned by this Control.

The control keeps a list of attached listeners and their handlers, making it easier to remove them when the control is disposed (see the dispose and removeEventListener methods).

Failing to remove event listeners may cause memory leaks.

Parameters
  • target: EventTarget

    Target element for the event.

  • type: string

    String that specifies the event.

  • fn: any

    Function to execute when the event occurs.

  • capture: boolean Optional

    Whether the listener is capturing.

Inherited From
DisposableObject
Returns
void

attachTo

attachTo(dashboard: DashboardLayout): void

Applies this layout to the specified DashboardLayout control.

Parameters
Returns
void

detach

detach(): void

Detaches this layout from the DashboardLayout control.

It is often used when applying the new layout, the old layout should be detached. When the layout is detached, the dashboard control shows nothing but a blank. If you want to use the layout in the dashboard again, you need call the attachTo method to apply it.

Returns
void

dispose

dispose(fullDispose?: boolean): void

Disposes the object.

Parameters
  • fullDispose: boolean Optional

    A boolean value decides wehter to keep the current status when disposing. If true, all the current status will be cleared. Otherwise, keep the current status.

Returns
void

draw

draw(): void

Draws the layout. The items should be drawn in this methods.

Returns
void

endMove

endMove(movedTile: Tile, endPosition: Point): void

Ends moving the tile at the specified postion.

Parameters
  • movedTile: Tile

    The tile to be moved.

  • endPosition: Point

    The position where the tile is moved to. It is the coordinate within the browser visible area.

Returns
void

initialize

initialize(options: any): void

Initializes the layout by copying the properties from a given object.

This method allows you to initialize the object using plain data objects instead of setting the value of each property in code.

Parameters
  • options: any

    Object that contains the initialization data.

Returns
void

invalidate

invalidate(fullUpdate?: boolean): void

Invalidates the dashboard causing an asynchronous refresh.

Parameters
  • fullUpdate: boolean Optional

    Whether to update the dashboard layout as well as the content.

Returns
void

move

move(movedTile: Tile, position: Point): void

Moves the tile.

Parameters
  • movedTile: Tile

    The tile to be moved.

  • position: Point

    The position of the moving mouse. It is the coordinate within the browser visible area.

Returns
void

moveTo

moveTo(tile: Tile, pt: Point): void

Moves the tile to the specified postion.

Adds the codes in this method to do the moving operation.

Parameters
  • tile: Tile

    The tile to be moved.

  • pt: Point

    The position where the tile is moved to in relation to the dashboard.

Returns
void

refresh

refresh(fullUpdate?: boolean): void

Refreshes the layout.

Parameters
  • fullUpdate: boolean Optional

    A boolean value decides whether to update the content completely. If true, the layout refreshes without keeping the current status(moving, resizing and etc.). Otherwise, the status is kept after refreshing.

Returns
void

remove

remove(removedTile: Tile): boolean

Removes the tile from the layout.

Parameters
  • removedTile: Tile

    The tile to be removed.

Returns
boolean

removeEventListener

removeEventListener(target?: EventTarget, type?: string, fn?: any, capture?: boolean): number

Removes one or more event listeners attached to elements owned by this Control.

Parameters
  • target: EventTarget Optional

    Target element for the event. If null, removes listeners attached to all targets.

  • type: string Optional

    String that specifies the event. If null, removes listeners attached to all events.

  • fn: any Optional

    Handler to remove. If null, removes all handlers.

  • capture: boolean Optional

    Whether the listener is capturing. If null, removes capturing and non-capturing listeners.

Inherited From
DisposableObject
Returns
number

resize

resize(resizedTile: Tile, toPosition?: Point): boolean

Resize the tile to the specified postion.

Parameters
  • resizedTile: Tile

    The tile to be resized.

  • toPosition: Point Optional

    The position where the tile is resized to. It is the coordinate within the browser visible area.

Returns
boolean

resizeTo

resizeTo(resizedTile: Tile, newSize: Size): boolean

Resizes the tile to the specified size.

Adds the codes to resize the tile to the specified size by pxWidth and pxHeight.

Parameters
  • resizedTile: Tile

    The tile to be resized.

  • newSize: Size

    The new size.

Returns
boolean

showAll

showAll(): void

Shows all the tiles.

Returns
void

startMove

startMove(movedTile: Tile, startPosition: Point): boolean

Starts to move the tile.

Parameters
  • movedTile: Tile

    The tile to be moved.

  • startPosition: Point

    The started position where the tile will be moved from. It is the coordinate within the browser visible area.

Returns
boolean

toggleSize

toggleSize(currentTile: Tile): void

Toggles the tile size.

Parameters
  • currentTile: Tile

    The tile to be toggled.

Returns
void