traviso.js - v0.2.0
    Preparing search index...

    Class EngineView

    Main PIXI.Container class to hold all views within the engine and all map related logic.

    EngineView

    Hierarchy

    • Container
      • EngineView
    Index

    Constructors

    Properties

    Accessors

    Methods

    Constructors

    Properties

    _bg: Graphics

    Solid colored background

    Internal property holding the engine configuration.

    _currentControllable: ObjectView

    Current controllable map-object that will be the default object to move in user interactions

    _currentFocusLocation: TColumnRowPair
    _currentScale: number

    Current scale of the map's display object

    _currentZoom: number

    Current zoom amount of the map

    _dragging: boolean = false

    false

    _dragInitStartingX: number
    _dragInitStartingY: number
    _dragPrevStartingX: number
    _dragPrevStartingY: number
    _externalCenter: TPositionPair

    Active external center point for the engine.

    _groundContainer: Container

    Display object for the ground/terrain visuals

    _mapContainer: Container

    Display object for the map visuals

    _mapMask: Graphics

    Mask graphics for the mask

    _mapSizeC: number

    Number of columns in the isometric map

    _mapSizeR: number

    Number of rows in the isometric map

    _mapVertices: number[][]

    Vertices of the map

    _mapVisualHeightReal: number

    Total height of all ground tiles

    _mapVisualWidthReal: number

    Total width of all ground tiles

    _mapVisualWidthScaled: number
    _objArray: ObjectView[][][]

    Array to hold map-objects

    _objContainer: Container

    Display object for the map-object visuals

    _pathFinding: PathFinding

    PathFinding instance to handle all path finding logic

    _posFrame: TPositionFrame = ...

    Active position frame for the engine.

    _tileArray: TileView[][]

    Array to hold map-tiles

    mapData: TMapData

    Variable holding the parsed and processed map data

    moveEngine: MoveEngine

    MoveEngine instance to handle all animations and tweens

    onMouseDown_binded: (event: FederatedPointerEvent) => void
    onMouseMove_binded: (event: FederatedPointerEvent) => void
    onMouseUp_binded: (event: FederatedPointerEvent) => void
    tileHalfHeight: number

    Half-height of a single isometric tile

    37
    
    tileHalfWidth: number

    Half-width of a single isometric tile

    64
    
    DEFAULT_ISO_ANGLE: number = 30

    The default angle (in degrees) between the top-left edge and the horizontal diagonal of a isometric quad

    30
    
    DEFAULT_TILE_H: number = 74

    The default height of a single isometric tile

    74
    

    Accessors

    • get changeTransparencies(): boolean

      make objects transparent when the controllable is behind them

      Returns boolean

      true
      
    • set changeTransparencies(value: boolean): void

      Parameters

      • value: boolean

      Returns void

    • get checkPathOnEachTile(): boolean

      Engine looks for a path every time an object moves to a new tile on the path (set to false if you don't have moving objects other then your controllable on your map)

      Returns boolean

      true
      
    • set checkPathOnEachTile(value: boolean): void

      Parameters

      • value: boolean

      Returns void

    • get dontAutoMoveToTile(): boolean

      When a tile selected don't move the controllable immediately but still call 'tileSelectCallback'

      Returns boolean

      false
      
    • set dontAutoMoveToTile(value: boolean): void

      Parameters

      • value: boolean

      Returns void

    • get engineInstanceReadyCallback(): (engineInstance: EngineView) => unknown

      callback function that will be called once everything is loaded and engine instance is ready

      Returns (engineInstance: EngineView) => unknown

      null
      
    • set engineInstanceReadyCallback(
          value: (engineInstance: EngineView) => unknown,
      ): void

      Parameters

      Returns void

    • get followCharacter(): boolean

      defines if the camera will follow the current controllable or not

      Returns boolean

      true
      
    • set followCharacter(value: boolean): void

      Parameters

      • value: boolean

      Returns void

    • get highlightPath(): boolean

      highlight the path when the current controllable moves on the map

      Returns boolean

      true
      
    • set highlightPath(value: boolean): void

      Parameters

      • value: boolean

      Returns void

    • get highlightTargetTile(): boolean

      Highlight the target tile when the current controllable moves on the map

      Returns boolean

      true
      
    • set highlightTargetTile(value: boolean): void

      Parameters

      • value: boolean

      Returns void

    • get instantCameraRelocation(): boolean

      specifies whether the camera moves instantly or with a tween animation to the target location

      Returns boolean

      false
      
    • set instantCameraRelocation(value: boolean): void

      Parameters

      • value: boolean

      Returns void

    • get instantCameraZoom(): boolean

      specifies whether to zoom instantly or with a tween animation

      Returns boolean

      false
      
    • set instantCameraZoom(value: boolean): void

      Parameters

      • value: boolean

      Returns void

    • get instantObjectRelocation(): boolean

      specifies whether the map-objects will be moved to target location instantly or with an animation

      Returns boolean

      false
      
    • set instantObjectRelocation(value: boolean): void

      Parameters

      • value: boolean

      Returns void

    • get mapDraggable(): boolean

      enable dragging the map with touch-and-touchmove or mousedown-and-mousemove on the map

      Returns boolean

      true
      
    • set mapDraggable(value: boolean): void

      Parameters

      • value: boolean

      Returns void

    • get objectReachedDestinationCallback(): (objectView: ObjectView) => unknown

      callback function that will be called when any moving object reaches its destination. Call param will be the moving object itself.

      Returns (objectView: ObjectView) => unknown

      null
      
    • set objectReachedDestinationCallback(
          value: (objectView: ObjectView) => unknown,
      ): void

      Parameters

      Returns void

    • get objectSelectCallback(): (objectView: ObjectView) => unknown

      callback function that will be called when a tile with an interactive map-object on it is selected. Call param will be the object selected.

      Returns (objectView: ObjectView) => unknown

      null
      
    • set objectSelectCallback(value: (objectView: ObjectView) => unknown): void

      Parameters

      Returns void

    • get otherObjectsOnTheNextTileCallback(): (
          objectView: ObjectView,
          otherObjectViews: ObjectView[],
      ) => unknown

      callback function that will be called when any moving object is in move and there are other objects on the next tile. Call params will be the moving object and an array of objects on the next tile.

      Returns (objectView: ObjectView, otherObjectViews: ObjectView[]) => unknown

      null
      
    • set otherObjectsOnTheNextTileCallback(
          value: (
              objectView: ObjectView,
              otherObjectViews: ObjectView[],
          ) => unknown,
      ): void

      Parameters

      Returns void

    • get tileHighlightAnimated(): boolean

      animate the tile highlights

      Returns boolean

      true
      
    • set tileHighlightAnimated(value: boolean): void

      Parameters

      • value: boolean

      Returns void

    • get tileHighlightFillAlpha(): number

      alpha value for the tile highlight fill (this will be overridden if a highlight-image is defined)

      Returns number

      1.0
      
    • set tileHighlightFillAlpha(value: number): void

      Parameters

      • value: number

      Returns void

    • get tileHighlightFillColor(): number

      color code for the tile highlight fill (this will be overridden if a highlight-image is defined)

      Returns number

      0x80d7ff
      
    • set tileHighlightFillColor(value: number): void

      Parameters

      • value: number

      Returns void

    • get tileHighlightStrokeAlpha(): number

      alpha value for the tile highlight stroke (this will be overridden if a highlight-image is defined)

      Returns number

      1.0
      
    • set tileHighlightStrokeAlpha(value: number): void

      Parameters

      • value: number

      Returns void

    • get tileHighlightStrokeColor(): number

      color code for the tile highlight stroke (this will be overridden if a highlight-image is defined)

      Returns number

      0xFFFFFF
      
    • set tileHighlightStrokeColor(value: number): void

      Parameters

      • value: number

      Returns void

    • get tileSelectCallback(): (r: number, c: number) => unknown

      callback function that will be called when a tile is selected. Params will be the row and column indexes of the tile selected.

      Returns (r: number, c: number) => unknown

      null
      
    • set tileSelectCallback(value: (r: number, c: number) => unknown): void

      Parameters

      • value: (r: number, c: number) => unknown

      Returns void

    Methods

    • Function

      Enables adding external custom display objects to the specified location. This method should be used for the objects that are not already defined in json file and don't have a type-id. The resulting object will be independent of engine mechanics apart from depth controls.

      Parameters

      • displayObject: ObjectView

        {PIXI.DisplayObject} object to be added to location

      • pos: TColumnRowPair

        {TColumnRowPair} position object including row and column coordinates

      Returns DisplayObject

      the newly added object

    • Private Function Internal

      Adds a reference of the given map-object to the given location in the object array. This should be called when an object moved or transferred to the corresponding location. Uses objects size property to add its reference to all relevant cells.

      Parameters

      • obj: ObjectView

        {ObjectView} object to be bind to location

      • pos: TColumnRowPair

        {TColumnRowPair} position object including row and column coordinates

      Returns void

    • Private Function Internal

      Adds a reference of the given map-object to the given location in the object array. Updates the cell as movable or not according to the object being movable onto or not.

      Parameters

      • obj: ObjectView

        {ObjectView} object to be bind to location

      • pos: TColumnRowPair

        {TColumnRowPair} position object including row and column coordinates

      Returns void

    • Private Function Internal

      Arranges depths (z-index) of the map-objects starting from the given location.

      Parameters

      • pos: TColumnRowPair

        {TColumnRowPair} position object including row and column coordinates

      Returns void

    • Private Function Internal

      Sets a map-object's location and logically moves it to the new location.

      Parameters

      • obj: ObjectView

        {ObjectView} map-object to be moved

      • pos: TColumnRowPair

        {TColumnRowPair} position object including row and column coordinates

      Returns void

    • Private Function Internal

      Sets occlusion transparencies according to given map-object's location. This method only works for user-controllable object.

      Parameters

      • obj: ObjectView

        {ObjectView} current controllable map-object

      • prevPos: TColumnRowPair

        {TColumnRowPair} previous location of the map-object in terms of row and column coordinates

      • pos: TColumnRowPair

        {TColumnRowPair} new location of the map-object in terms of row and column coordinates

      Returns void

    • Private Function Internal

      Clears the highlight for the old path and highlights the new path on map.

      Parameters

      • currentPath: GridNode[]

        {Array(GridNode)} the old path to clear the highlight from

      • newPath: GridNode[]

        {Array(GridNode)} the new path to highlight

      Returns void

    • Private Function Internal

      Handles loading of map data for the given engine instance.

      Parameters

      • rawMapData: TMapData

        {TMapData} loaded map data

      Returns void

    • Function

      External center is the central point of the frame defined by the user to be used as the visual size of the engine. This method centralizes the EngineView instance with respect to this external center-point.

      Parameters

      • instantRelocate: boolean

        {boolean} specifies if the camera move will be animated or instant

      Returns void

    • Centralizes the EngineView instance to the current location of the attention/focus.

      Parameters

      • OptionalinstantRelocate: boolean

        {boolean} specifies if the camera move will be animated or instant

      Returns void

      centralizeToCurrentFocusLocation

    • Centralizes the EngineView instance to the map location specified by row and column index.

      Parameters

      • c: number

        {number} the column index of the map location

      • r: number

        {number} the row index of the map location

      • OptionalinstantRelocate: boolean

        {boolean} specifies if the camera move will be animated or instant

      Returns void

      centralizeToLocation

    • Centralizes the EngineView instance to the object specified.

      Parameters

      • obj: ObjectView

        {ObjectView} the object that map will be centralized with respect to

      Returns void

      centralizeToObject

    • Function

      Centralizes the EngineView instance to the points specified.

      Parameters

      • px: number

        {number} the x coordinate of the center point with respect to EngineView frame

      • py: number

        {number} the y coordinate of the center point with respect to EngineView frame

      • instantRelocate: boolean

        {boolean} specifies if the relocation will be animated or instant

      Returns void

    • Sets alphas of the map-objects referenced to the given location.

      Parameters

      • value: number

        {number} alpha value, should be between 0 and 1

      • pos: TColumnRowPair

        {TColumnRowPair} position object including row and column coordinates

      Returns void

      changeObjAlphasInLocation

    • Function

      Checks for a path and moves the map-object on map if there is an available path

      Parameters

      • obj: ObjectView

        {ObjectView} map-object that is being moved

      • pos: TColumnRowPair

        {TColumnRowPair} object including row and column coordinates for the target location

      • speed: number = null

        {number} speed of the map-object to be used during movement, if not defined it uses previous speed or the MoveEngine's default speed, default null

      Returns boolean

      if there is an available path to move to the target tile

    • Function

      Checks for a path and moves the map-object on map if there is an available path

      Parameters

      • obj: ObjectView

        {ObjectView} map-object that is being moved

      • tile: TileView

        {TileView} target map-tile or any custom object that has 'mapPos' and 'isMovableTo' defined

      • speed: number = null

        {number} speed of the map-object to be used during movement, if not defined it uses previous speed or the MoveEngine's default speed, default null

      Returns boolean

      if there is an available path to move to the target tile

    • Function Internal

      Checks and follows a character

      Parameters

      • obj: IMovable

        {IMovable} map-object to check if it is being followed

      Returns void

    • Function Internal

      Checks if a map-object changes the tile it is on.

      Parameters

      • obj: IMovable

        {IMovable} map-object to be checked

      Returns void

    • Private Function Internal

      Checks if an interaction occurs using the global pointer position coming from PIXI. If there is any interaction starts necessary movements or performs necessary callbacks.

      Parameters

      • globalPos: TPositionPair

        {TPositionPair} pointer position in global coordinates

      Returns void

    • Function

      Creates and adds a predefined (in json file) map-object to the map using the specified object type-id.

      Parameters

      • type: string

        {number} type-id of the object as defined in the json file

      • pos: TColumnRowPair

        {TColumnRowPair} position object including row and column coordinates

      Returns ObjectView

      the newly created map-object

    • Private Function Internal

      Creates the map and setups necessary parameters for future map calculations.

      Returns void

    • Function

      Clears all references and stops all animations inside the engine. Call this method when you want to get rid of an engine instance.

      Returns void

    • Function

      Disables mouse/touch interactions.

      Returns void

    • Function

      Enables mouse/touch interactions.

      Returns void

    • Centralizes and zooms the EngineView instance to the map location specified by row and column index.

      Parameters

      • c: number

        {number} the column index of the map location

      • r: number

        {number} the row index of the map location

      • zoomAmount: number

        {number} targeted zoom level for focusing

      Returns void

      focusMapToLocation

    • Centralizes and zooms the EngineView instance to the object specified.

      Parameters

      • obj: ObjectView

        {ObjectView} the object that map will be focused with respect to

      Returns void

      focusMapToObject

    • Function

      Returns all the ObjectView instances referenced to the given location with the specified row and column indices.

      Parameters

      • r: number

        {number} the row index of the map location

      • c: number

        {number} the column index of the map location

      Returns ObjectView[]

      an array of map-objects referenced to the given location

    • Function

      Searches and returns a path between two locations if there is one.

      Parameters

      • from: TColumnRowPair

        {TColumnRowPair} object including row and column coordinates of the source location

      • to: TColumnRowPair

        {TColumnRowPair} object including row and column coordinates of the target location

      Returns GridNode[]

      an array of path items defining the path

    • Function

      Returns the TileView instance that sits in the location given by row and column indices.

      Parameters

      • r: number

        {number} row index of the tile

      • c: number

        {number} column index of the tile

      Returns TileView

      the tile in the location given

    • Function

      Calculates 2D X position of a tile, given its column and row indices.

      Parameters

      • r: number

        {number} row index of the tile

      • c: number

        {number} column index of the tile

      Returns number

      2D X position of a tile

    • Function

      Calculates 2D Y position of a tile, given its column and row indices.

      Parameters

      • r: number

        {number} row index of the tile

      • c: number

        {number} column index of the tile

      Returns number

      2D Y position of a tile

    • Private Function Internal

      Checks if the given point is inside the masked area if there is a mask defined.

      Parameters

      Returns boolean

      if the point is inside the masked area

    • Private Function Internal

      Handles loading of necessary assets and map data for the given engine instance.

      Returns Promise<void>

    • Function

      Moves the current controllable map-object to a location if available.

      Parameters

      • pos: TColumnRowPair

        {TColumnRowPair} object including row and column coordinates for the target location

      • speed: number = null

        {number} speed of the map-object to be used during movement, if not defined it uses previous speed or the MoveEngine's default speed, default null

      Returns boolean

      if there is an available path to move to the target tile

    • Function

      Moves the current controllable map-object to one of the adjacent available tiles of the map-object specified.

      Parameters

      • obj: ObjectView

        {ObjectView} target map-object

      • speed: number = null

        {number} speed of the map-object to be used during movement, if not defined it uses previous speed or the MoveEngine's default speed, default null

      Returns boolean

      if there is an available path to move to the target map-object

    • Private Function Internal

      Moves the specified map-object through a path.

      Parameters

      • obj: IMovable

        {IMovable} map-object to be moved on path

      • path: GridNode[]

        {Array(GridNode)} path to move object on

      • speed: number = null

        {number} speed of the map-object to be used during movement, if not defined it uses previous speed or the MoveEngine's default speed, default null

      Returns void

    • Private Function Internal

      This method is being called whenever all the assets are loaded and engine is ready to initialize.

      Returns void

    • Private Function Internal

      Handler function for mouse-down event.

      Parameters

      • event: FederatedPointerEvent

        {FederatedPointerEvent} interaction event object

      Returns void

    • Private Function Internal

      Handler function for mouse-move event.

      Parameters

      • event: FederatedPointerEvent

        {FederatedPointerEvent} interaction event object

      Returns void

    • Private Function Internal

      Handler function for mouse-up event.

      Parameters

      • event: FederatedPointerEvent

        {FederatedPointerEvent} interaction event object

      Returns void

    • Private Function Internal

      Sets up the engine at the beginning of each tile change move for the specified object

      Parameters

      • obj: IMovable

        {IMovable} map-object that is being moved

      • pos: TColumnRowPair

        {TColumnRowPair} position object including row and column coordinates

      Returns boolean

      if the target tile was available and map-object has moved

    • Function Internal

      Sets up the engine at the end of each tile change move for the specified object

      Parameters

      • obj: IMovable

        {IMovable} map-object that is being moved

      Returns void

    • Function

      Removes the object and its references from the map.

      Parameters

      • obj: ObjectView

        {ObjectView} Either an external display object or a map-object (ObjectView)

      • pos: TColumnRowPair

        {TColumnRowPair} position object including row and column coordinates. If not defined, the engine will use obj.mapPos to remove the map-object

      Returns void

    • Private Function Internal

      Removes references of the given map-object from the given location in the object array. This should be called when an object moved or transferred from the corresponding location. Uses objects size property to remove its references from all relevant cells.

      Parameters

      • obj: ObjectView

        {ObjectView} object to be bind to location

      • pos: TColumnRowPair

        {TColumnRowPair} position object including row and column coordinates

      Returns void

    • Private Function Internal

      Removes a reference of the given map-object from the given location in the object array. Updates the cell as movable or not according to the other object references in the same cell.

      Parameters

      • obj: ObjectView

        {ObjectView} object to be bind to location

      • pos: TColumnRowPair

        {TColumnRowPair} position object including row and column coordinates

      Returns void

    • Function

      Repositions the content according to user settings. Call this method whenever you want to change the size or position of the engine.

      Parameters

      • posFrame: TPositionFrame = null

        {TPositionFrame} frame to position the engine, default is the previously set posFrame and if not set, it is { x : 0, y : 0, w : 800, h : 600 }

      Returns void

    • Sets a map-object as the current controllable. This object will be moving in further relevant user interactions.

      Parameters

      • obj: ObjectView

        {ObjectView} object to be set as current controllable

      Returns void

      setCurrentControllable

    • Private Function Internal

      Sets map's scale.

      Parameters

      • s: number

        {number} Scale amount for both x and y coordinates

      • instantZoom: boolean

        {boolean} Specifies if the scaling will be animated or instant

      Returns void

    • Function

      Sets all the parameters related to zooming in and out.

      Parameters

      • minScale: number = 0.5

        {number} minimum scale that the PIXI.Container for the map can get, default 0.5

      • maxScale: number = 1.5

        {number} maximum scale that the PIXI.Container for the map can get, default 1.5

      • numberOfZoomLevels: number = 5

        {number} used to calculate zoom increment, defined by user, default 5

      • initialZoomLevel: number = 0

        {number} initial zoom level of the map, default 0

      • instantCameraZoom: boolean = false

        {boolean} specifies whether to zoom instantly or with a tween animation, default false

      Returns void

    • Function

      Shows or hides the display object that includes the ground/terrain layer

      Parameters

      • show: boolean = false

        {boolean} show the ground layer, default false

      Returns void

    • Function

      Shows or hides the display object that includes the objects-layer

      Parameters

      • show: boolean = false

        {boolean} show the object layer, default false

      Returns void

    • Private Function Internal

      Stops a moving object.

      Parameters

      • obj: IMovable

        {IMovable} map-object to be moved on path

      Returns void

    • Zooms the camera one level in.

      Parameters

      • OptionalinstantZoom: boolean

        {boolean} specifies whether to zoom instantly or with a tween animation

      Returns void

      zoomIn

    • Function

      Zooms the camera one level out.

      Parameters

      • instantZoom: boolean

        {boolean} Specifies whether to zoom instantly or with a tween animation

      Returns void

    • Function

      Zooms camera by to the amount given.

      Parameters

      • zoomAmount: number

        {number} specifies zoom amount (between -1 and 1). Use -1, -0.5, 0, 0,5, 1 for better results.

      • instantZoom: boolean

        {boolean} specifies whether to zoom instantly or with a tween animation

      Returns void