API Docs for:
Show:

Tree Class

Defined in: ../src/tree.js:5

To create interactive trees (useful for folders or hierarchies).
Options are:
+ allow_multiselection: allow to select multiple elements using the shift key
+ allow_rename: double click to rename items in the tree
+ allow_drag: drag elements around
+ height
Item data should be in the next format:
{
id: unique_identifier,
content: what to show in the HTML (if omited id will be shown)
children: [] array with another object with the same structure
className: class
precontent: HTML inserted before the content
visible: boolean, to hide it
dataset: dataset for the element
onDragData: callback in case the user drags this item somewhere else
}
To catch events use tree.root.addEventListener(...)
item_selected : receive { item: node, data: node.data }
item_dblclicked
item_renamed
item_moved

Constructor

Tree

()

Defined in ../src/tree.js:5

Methods

addItemToSelection

(
  • id
)

Defined in ../src/tree.js:869

adds item to selection (multiple selection)

Parameters:

  • id String

clear

(
  • keep_root
)

Defined in ../src/tree.js:1166

clears all the items

Parameters:

  • keep_root Bool

    if you want to keep the root item

collapseItem

(
  • id
)

Defined in ../src/tree.js:771

in case an item is expanded, it collapses it to hide children

Parameters:

  • id String

expandItem

(
  • id
)

Defined in ../src/tree.js:754

in case an item is collapsed, it expands it to show children

Parameters:

  • id String

filterByName

(
  • name
)

Defined in ../src/tree.js:638

remove from the tree the items that do not have a name that matches the string

Parameters:

  • name String

filterByName

(
  • name
)

Defined in ../src/tree.js:677

remove from the tree the items that do not have a name that matches the string

Parameters:

  • name String

getAncestors

(
  • id
)
Array

Defined in ../src/tree.js:982

returns an array with all the ancestors

Parameters:

  • id String

Returns:

Array:

getAncestors

(
  • id
)
Array

Defined in ../src/tree.js:964

returns an array with all the ancestors

Parameters:

  • id String

Returns:

Array:

getChildren

(
  • id
  • [only_direct=false]
)
Array

Defined in ../src/tree.js:936

returns the children of an item

Parameters:

  • id String

    could be string or node directly

  • [only_direct=false] Bool optional

    to get only direct children

Returns:

Array:

getItem

(
  • id
)
Object

Defined in ../src/tree.js:717

get the item with that id, returns the HTML element

Parameters:

  • id String

Returns:

Object:

getParent

(
  • id
)
HTML

Defined in ../src/tree.js:950

returns the parent of a item

Parameters:

  • id String

Returns:

HTML:

getSelectedItem

() HTML

Defined in ../src/tree.js:902

returns the first selected item (its HTML element)

Returns:

HTML:

getSelectedItems

() HTML

Defined in ../src/tree.js:912

returns an array with the selected items (its HTML elements)

Returns:

HTML:

insertItem

(
  • data
  • parent_id
  • position
  • options
)
DIVElement

Defined in ../src/tree.js:113

update tree with new data (old data will be thrown away)

Parameters:

  • data Object
  • parent_id String
  • position Number

    index in case you want to add it before the last position

  • options Object

Returns:

DIVElement:

isInsideArea

(
  • id
)

Defined in ../src/tree.js:789

Tells you if the item its out of the view due to the scrolling

Parameters:

  • id String

isItemSelected

(
  • id
)
Bool

Defined in ../src/tree.js:922

returns if an item is selected

Parameters:

  • id String

Returns:

Bool:

moveItem

(
  • id
  • parent_id
)
Bool

Defined in ../src/tree.js:1002

move item with id to be child of parent_id

Parameters:

  • id String
  • parent_id String

Returns:

Bool:

removeItem

(
  • id
)
Bool

Defined in ../src/tree.js:1078

remove item with given id

Parameters:

  • id String

Returns:

Bool:

removeItemFromSelection

(
  • id
)

Defined in ../src/tree.js:887

remove item from selection (multiple selection)

Parameters:

  • id String

scrollToItem

(
  • id
)

Defined in ../src/tree.js:812

Scrolls to center this item

Parameters:

  • id String

setSelectedItem

(
  • id
)

Defined in ../src/tree.js:837

mark item as selected

Parameters:

  • id String

updateItem

(
  • id
  • data
)

Defined in ../src/tree.js:1116

update a given item with new data

Parameters:

  • id String
  • data Object

updateItemId

(
  • old_id
  • new_id
)

Defined in ../src/tree.js:1141

update a given item id and the link with its children

Parameters:

  • old_id String
  • new_id String

updateTree

(
  • data
)

Defined in ../src/tree.js:94

update tree with new data (old data will be thrown away)

Parameters:

  • data Object