@fqqb/timeline

class DefaultSidebar extends Sidebar

Default sidebar implementation.

Properties
background, clippedWidth, data, dividerColor, fontFamily, foregroundColor, hoverOverlayColor, opened, overlayColor, textSize, timeline, width
Methods
constructor, addMutationListener, beforeDraw, close, createAnimatableProperty, disconnectedCallback, drawContent, drawOverlay, drawUnderlay, open, removeMutationListener, reportMutation, toggle

Properties

background
getset

Background style of the entire sidebar.

Type:
FillStyle
clippedWidth
get

While a sidebar animation is underway (transitioning from open to closed, or vice versa), this represents the current width instead of the target width.

Type:
number
data
getset

Arbitrary data. For example an identifier of a backend system.

Type:
any
dividerColor
getset

Color of the right border that separates the sidebar from the timeline content.

Type:
string
Default value:
'#e3e3e3'
fontFamily
getset
Type:
string
Default value:
'Verdana, Geneva, sans-serif'
foregroundColor
getset
Type:
string
Default value:
'#333333'
hoverOverlayColor
getset

Color overlayed on top of the hovered label.

Type:
string
Default value:
'rgba(170, 170, 170, 0.3)'
opened
get

Returns whether the sidebar is currently opened.

Type:
boolean
overlayColor
getset

Color used to cover the background. This covers also the borders so generally you want to add some level of transparency.

Type:
string
Default value:
'transparent'
textSize
getset
Type:
number
Default value:
10
timeline
get

Timeline instance that this instance is bound to.

Type:
Timeline
width
getset

Pixel width of this sidebar.

Type:
number

Methods

constructor(timeline)
Parameters:
  • Timeline timeline

    Timeline instance that this instance is bound to.

addMutationListener(mutationListener)

Adds a listener that is notified whenever one of the properties changes.

This method is used by the Timeline instance to detect when to redraw the Canvas.

Parameters:
  • () => void mutationListener
Return type:
void
beforeDraw(g)

Gets called before any of the draw methods.

Parameters:
Return type:
void
close()

Close the sidebar.

Return type:
void
createAnimatableProperty(value)

Creates an animatable property.

Animatable properties apply easing over time between numeric value changes.

Parameters:
  • number value –
Return type:
AnimatableProperty
disconnectedCallback()

Called when this drawable is removed from its Timeline

Return type:
void
drawContent(g)

Draw regular content.

Parameters:
Return type:
void
drawOverlay(g)

Gets called after regular content is drawn. Override this if you need a top layer.

Parameters:
Return type:
void
drawUnderlay(g)

Gets called before regular content is drawn. Override this if you need a bottom layer.

Parameters:
Return type:
void
open()

Open the sidebar.

Return type:
void
removeMutationListener(mutationListener)

Remove a previously added mutation listener.

Parameters:
  • () => void mutationListener
Return type:
void
reportMutation()

Mark this Drawable as dirty. This method is intended for use in subclasses and should be called in the implementation of set accessors.

Return type:
void
toggle()

Close the sidebar if it is currently opened, else open it.

Return type:
void

Drawables