Timeline
Pluin Core Class
Static Member Summary
Static Public Members | ||
public static get |
|
|
public static get |
|
Static Method Summary
Static Private Methods | ||
private static |
_jQueryInterface(config: string | Object, args: ...string | ...Function): * Interface for jQuery |
Member Summary
Private Members | ||
private |
|
|
private |
|
|
private |
|
|
private |
|
|
private |
|
|
private |
|
|
private |
|
|
private |
|
|
private |
|
Method Summary
Public Methods | ||
public |
Add new events to the rendered timeline object |
|
public |
Move the display position of the timeline container to the specified position |
|
public |
applyThemeStyle(): void Apply custom theme styles |
since v2.1.0 |
public |
compareValues(property: string, order: string): number Sort an array by value of specific property (Note: destructive method) |
|
public |
Move shift or expand the range of timeline container as to past direction (to left) |
|
public |
Move shift or expand the range of timeline container as to futrue direction (to right) |
|
public |
Convert the date-time to custom formatting strings, as like ruby |
|
public |
destroy() Destroy the object to which the plugin is applied |
|
public |
diffDate(date1: number | object, date2: number | object, scale: string, absval: boolean): object | boolean Acquire the difference between two dates with the specified scale value |
|
public |
Find scale matched the specified condition |
|
public |
generateUniqueID(digit: number): string Generate the pluggable unique id |
|
public |
getCorrectDatetime(datetime_str: string): Object Get the correct datetime with remapping to that if the year is 0 - 99 |
|
public |
getFirstDayOfWeek(week_number: number, year: number): object | boolean Retrieve a first day of the week from week number (Note: added support for daylight savings time but needs improvement as performance has dropped) |
|
public |
getHigherScale(scale: string): string Retrieve one higher scale |
|
public |
Retrieve the date string of specified locale |
|
public |
getLowerScale(scale: string): string Retrieve one lower scale |
|
public |
this method was deprecated. This method has been deprecated since version 2.0.0
|
|
public |
getUserArg(userdata: object): object Getter argument as user data |
since v2.1.0 |
public |
Method to get week number as extension of Date object |
|
public |
Convert hex of color code to rgba |
|
public |
hide() Hide shown timeline |
|
public |
Hide the loader |
|
public |
initialized(callback: Function, userdata: number | string | Object) This method is able to call only once after completed an initializing of the plugin |
|
public |
Determine whether variable is an Object |
|
public |
Determine empty that like PHP |
|
public |
is_iterable(obj: Object): boolean Determine whether the object is iterable |
|
public |
Merge two objects deeply as polyfill for instead "$.extend(true,target,source)" |
|
public |
Get the datetime shifted from the specified datetime by any fluctuation value |
|
public |
Round a number with specific digit |
|
public |
The method that fires when an event on the timeline is clicked Note: You can hook the custom processing with the callback specified in the event parameter |
|
public |
Reload the timeline with overridable any options |
|
public |
removeEvent(callback: Function, userdata: number | string | Object) Remove events from the currently timeline object |
|
public |
render() this method was deprecated. This method has been deprecated since version 2.0.0
|
|
public |
show() Show hidden timeline |
|
public |
Show the loader |
|
public |
Await until next process at specific millisec |
|
public |
Get the rendering width of the given string |
|
public |
supplement(default_value: number | string | Object | boolean, opt_arg: number | string | Object | boolean, opt_callback: number | string | Object | boolean): number | string | Object | boolean Supplemental method for validating arguments in local scope |
|
public |
toIterableObject(obj: Object): Object Add an @@iterator method to non-iterable object |
|
public |
updateEvent(callback: Function, userdata: number | string | Object) Update events on the currently timeline object |
|
public |
validateArray(def: number | string | Object | boolean, val: number | string | Object | boolean): number | string | Object | boolean Validator for array |
|
public |
validateBoolean(def: number | string | Object | boolean, val: number | string | Object | boolean): number | string | Object | boolean Validator for boolean |
|
public |
validateNumeric(def: number | string | Object | boolean, val: number | string | Object | boolean): number | string | Object | boolean Validator for numeric |
|
public |
validateObject(def: number | string | Object | boolean, val: number | string | Object | boolean): number | string | Object | boolean Validator for object |
|
public |
validateString(def: number | string | Object | boolean, val: number | string | Object | boolean): number | string | Object | boolean Validator for string |
|
public |
Verify whether is allowed scale in the plugin. |
|
public |
Be zoomed in scale of the timeline that fires when any scales on the ruler is double clicked |
Private Methods | ||
private |
_activeEvent(event: Object) Event when focus or blur |
|
private |
Calculate each properties of the timeline instance |
|
private |
Create the event container of the timeline |
|
private |
_createEventNode(params: Object): Object Create an event element on the timeline |
|
private |
Create the footer of the timeline |
|
private |
Create the headline of the timeline |
|
private |
_createRuler(position: string): Object Create the ruler of the timeline |
|
private |
_createRulerContent(_line_grids: Object, line_scale: string, ruler: RulerOptions): Object Create the content of ruler of the timeline |
|
private |
_createSideIndex(margin: Object): Object Create the side indexes of the timeline |
|
private |
Echo the log of plugin for debugging |
|
private |
Acquire the difference between two dates with the specified scale value |
|
private |
_drawRelationLine(events: Object) Draw the relational lines |
|
private |
Logger of errors when the method execution |
|
private |
_filterScaleKeyName(key: string): string Filter the scale key name for LimitScaleGrids |
|
private |
_filterVariableScale(target_scale: string): Object Filter to aggregate the grid width of the variable length scale |
|
private |
_getConfig(config: Object): Object Define the default options of this plugin |
|
private |
_getCoordinateX(date: string): number Get the coordinate X on the timeline of any date |
|
private |
_getGridsPerScale(target_scale: string): Object Get the grid number per scale (for fixed length scale) |
|
private |
_getPluggableDatetime(key: string, round_type: string): number Retrieve the pluggable datetime as milliseconds from specified keyword |
|
private |
_getPluggableParams(str_like_params: string): Object Retrieve the pluggable parameter as an object |
|
private |
Retrieve the pluggable rows of the timeline |
|
private |
_getPointerSize(key: number | string, margin: number): number Retrieve the diameter size (pixel) of pointer |
|
private |
_hoverPointer(event: Object) Event when hover on the pointer type event |
|
private |
_init() Initialize the plugin |
|
private |
Load all enabled events markupped on target element to the timeline object |
|
private |
Load the cached event data from the web storage |
|
private |
_mapPlacedEvents(): number[] Retrieve the mapping data that placed current events |
|
private |
Controller method to place event data on timeline @private: |
|
private |
_registerEventData(event_element: Object, params: Object): Object Register one event data as object |
|
private |
Remove the cache data on the web storage |
|
private |
Render the view of timeline container |
|
private |
_saveToCache(data: Object): boolean Cache the event data to the web storage |
|
private |
Verify the display period of the timeline does not exceed the maximum renderable range |
|
private |
_verifyScale(scale: string): number | boolean Verify the allowed scale, then retrieve that scale's millisecond if allowed |
Static Public Members
Static Private Methods
Private Members
Public Methods
public addEvent(callback: Function, userdata: number | string | Object) source
Add new events to the rendered timeline object
public alignment(position: string, duration: number | string) source
Move the display position of the timeline container to the specified position
Params:
Name | Type | Attribute | Description |
position | string |
|
The preset string of position on timeline you want to align. Allowed values are "left", "begin", "center", "right", "end", "latest", "current", "currently" or number of event id |
duration | number | string |
|
The duration of alignment animation. Allowed values are "fast", "normal", "slow" or number of milliseconds |
public compareValues(property: string, order: string): number source
Sort an array by value of specific property (Note: destructive method)
Example:
Object.sort( this.compareValues( property, order ) )
public dateback(options: Object, callback: Function, userdata: number | string | Object) source
Move shift or expand the range of timeline container as to past direction (to left)
public dateforth(options: Object, callback: Function, userdata: number | string | Object) source
Move shift or expand the range of timeline container as to futrue direction (to right)
public datetimeFormat(baseDate: number | object, format: string, locales: string): string source
Convert the date-time to custom formatting strings, as like ruby
public diffDate(date1: number | object, date2: number | object, scale: string, absval: boolean): object | boolean source
Acquire the difference between two dates with the specified scale value
Params:
Name | Type | Attribute | Description |
date1 | number | object |
|
integer as milliseconds or object instanceof Date) |
date2 | number | object |
|
integer as milliseconds or object instanceof Date) |
scale | string |
|
defaults to 'millisecond' |
absval | boolean |
|
defaults to false |
public findScale(base_scale: string, condition: string): string | object source
Find scale matched the specified condition
public generateUniqueID(digit: number): string source
Generate the pluggable unique id
Params:
Name | Type | Attribute | Description |
digit | number |
|
public getCorrectDatetime(datetime_str: string): Object source
Get the correct datetime with remapping to that if the year is 0 - 99
Params:
Name | Type | Attribute | Description |
datetime_str | string |
|
public getFirstDayOfWeek(week_number: number, year: number): object | boolean source
Retrieve a first day of the week from week number (Note: added support for daylight savings time but needs improvement as performance has dropped)
public getHigherScale(scale: string): string source
Retrieve one higher scale
Params:
Name | Type | Attribute | Description |
scale | string |
|
public getLocaleString(date_seed: string, scale: string, locales: string, options: Object): string source
Retrieve the date string of specified locale
public getLowerScale(scale: string): string source
Retrieve one lower scale
Params:
Name | Type | Attribute | Description |
scale | string |
|
public getOptions() source
public getUserArg(userdata: object): object since v2.1.0 source
Getter argument as user data
Params:
Name | Type | Attribute | Description |
userdata | object |
|
public getWeek(date_str: string): number source
Method to get week number as extension of Date object
Params:
Name | Type | Attribute | Description |
date_str | string |
|
public initialized(callback: Function, userdata: number | string | Object) source
This method is able to call only once after completed an initializing of the plugin
public is_Object(item: number | string | Object | boolean): boolean source
Determine whether variable is an Object
public is_empty(value: number | string | Object | number[] | boolean): boolean source
Determine empty that like PHP
public is_iterable(obj: Object): boolean source
Determine whether the object is iterable
Params:
Name | Type | Attribute | Description |
obj | Object |
|
public mergeDeep(target: Object, source: Object): Object source
Merge two objects deeply as polyfill for instead "$.extend(true,target,source)"
public modifyDate(datetime: object, fluctuation: number, scale: string): object | boolean source
Get the datetime shifted from the specified datetime by any fluctuation value
public numRound(number: number, digit: number, round_type: string): number source
Round a number with specific digit
public openEvent(event: Object) source
The method that fires when an event on the timeline is clicked Note: You can hook the custom processing with the callback specified in the event parameter
Params:
Name | Type | Attribute | Description |
event | Object |
public reload(callback: Function, userdata: number | string | Object) source
Reload the timeline with overridable any options
public removeEvent(callback: Function, userdata: number | string | Object) source
Remove events from the currently timeline object
public render() source
public sleep(msec: number): * source
Await until next process at specific millisec
Params:
Name | Type | Attribute | Description |
msec | number |
|
Millisecond |
Return:
* |
public strWidth(str: string): number source
Get the rendering width of the given string
Params:
Name | Type | Attribute | Description |
str | string |
|
public supplement(default_value: number | string | Object | boolean, opt_arg: number | string | Object | boolean, opt_callback: number | string | Object | boolean): number | string | Object | boolean source
Supplemental method for validating arguments in local scope
public toIterableObject(obj: Object): Object source
Add an @@iterator method to non-iterable object
Params:
Name | Type | Attribute | Description |
obj | Object |
|
public updateEvent(callback: Function, userdata: number | string | Object) source
Update events on the currently timeline object
public validateArray(def: number | string | Object | boolean, val: number | string | Object | boolean): number | string | Object | boolean source
Validator for array
public validateBoolean(def: number | string | Object | boolean, val: number | string | Object | boolean): number | string | Object | boolean source
Validator for boolean
public validateNumeric(def: number | string | Object | boolean, val: number | string | Object | boolean): number | string | Object | boolean source
Validator for numeric
public validateObject(def: number | string | Object | boolean, val: number | string | Object | boolean): number | string | Object | boolean source
Validator for object
public validateString(def: number | string | Object | boolean, val: number | string | Object | boolean): number | string | Object | boolean source
Validator for string
public verifyScale(scale: string, begin: number, end: number, isVLS: boolean): object | boolean source
Verify whether is allowed scale in the plugin. Then retrieves that values of intervals on the scale if the scale is available and given arguments of date range. And return the base millisecond of scale if it is not the variable length scale (isVLS to false)
Params:
Name | Type | Attribute | Description |
scale | string |
|
|
begin | number |
|
begin of range as unit millisecs that got by |
end | number |
|
end of range as unit millisecs that got by |
isVLS | boolean |
|
whether is variable length scale, defaults to false |
public zoomScale(event: Object) source
Be zoomed in scale of the timeline that fires when any scales on the ruler is double clicked
Params:
Name | Type | Attribute | Description |
event | Object |
Private Methods
private _activeEvent(event: Object) source
Event when focus or blur
Params:
Name | Type | Attribute | Description |
event | Object |
private _createEventNode(params: Object): Object source
Create an event element on the timeline
Params:
Name | Type | Attribute | Description |
params | Object |
private _createRuler(position: string): Object source
Create the ruler of the timeline
Params:
Name | Type | Attribute | Description |
position | string | Either "top" or "bottom" as the position of the ruler |
private _createRulerContent(_line_grids: Object, line_scale: string, ruler: RulerOptions): Object source
Create the content of ruler of the timeline
Params:
Name | Type | Attribute | Description |
_line_grids | Object | ||
line_scale | string | ||
ruler | RulerOptions |
private _diffDate(date1: number, date2: number, scale: string, absval: boolean): number | boolean source
Acquire the difference between two dates with the specified scale value
private _drawRelationLine(events: Object) source
Draw the relational lines
Params:
Name | Type | Attribute | Description |
events | Object |
private _filterScaleKeyName(key: string): string source
Filter the scale key name for LimitScaleGrids
Params:
Name | Type | Attribute | Description |
key | string |
private _filterVariableScale(target_scale: string): Object source
Filter to aggregate the grid width of the variable length scale
Params:
Name | Type | Attribute | Description |
target_scale | string |
private _getConfig(config: Object): Object source
Define the default options of this plugin
Params:
Name | Type | Attribute | Description |
config | Object | Initial options |
private _getCoordinateX(date: string): number source
Get the coordinate X on the timeline of any date
Params:
Name | Type | Attribute | Description |
date | string |
private _getGridsPerScale(target_scale: string): Object source
Get the grid number per scale (for fixed length scale)
Params:
Name | Type | Attribute | Description |
target_scale | string |
private _getPluggableDatetime(key: string, round_type: string): number source
Retrieve the pluggable datetime as milliseconds from specified keyword
private _getPluggableParams(str_like_params: string): Object source
Retrieve the pluggable parameter as an object
Params:
Name | Type | Attribute | Description |
str_like_params | string | Strings that can be parsed as javascript objects |
private _getPointerSize(key: number | string, margin: number): number source
Retrieve the diameter size (pixel) of pointer
private _hoverPointer(event: Object) source
Event when hover on the pointer type event
Params:
Name | Type | Attribute | Description |
event | Object |
private _loadEvent() source
Load all enabled events markupped on target element to the timeline object
private _registerEventData(event_element: Object, params: Object): Object source
Register one event data as object
private _saveToCache(data: Object): boolean source
Cache the event data to the web storage
Params:
Name | Type | Attribute | Description |
data | Object |