Webcolumns NPM

webcolumns

A smallish API for managing columns and their contents.

example

var WebColumns = require('webcolumns');

var wc = WebColumns({ container : document.getElementById('the-container'), dragdrop : true });
var c1 = wc.add("Column 1");
var c2 = wc.add("Column 2");

var n1 = c1.add("test");
var n2 = c1.add("test2");
var n3 = c1.add("test3");

n1.move("Column 2");

For a more detailed example see test.html in the repo.

api

WebColumns = require('webcolumns');

columns = WebColumns(opts);

Returns a WebColumn instance

opts: optional options object to toggle the features of WebColumns container: optional:HTMLElement HTML Element of which the WebColumns instance should become a child. (default: document.body) dragdrop: optional:Boolean Whether or not drag and drop functionality and events should be loaded. (default: false)

column = columns.add(opts/title , id);

Creates a new Column object and adds it to the WebColumns instance

Must specify at least opts or title.

Returns a Column instance

opts: options object for the column title: required:String/HTMLElement/Function The title of the column When title is a String, the string is added to the title div When title is an HTMLElement, the HTMLElement is added to the title div When title is a Function, the function is called, passing it the new column instance. The function should return an HTMLElement to be added to the title div * id: optional:String The id of the column. Useful for if you need to refer to the column using something other than the title. (default: same as title)

columns = columns.addColumn(Column)

Column

Add a Column instance to the WebColumns instance

Returns the WebColumns instance

column = columns.getColumnByTitle(title);

column = columns.getColumnById(id);

column = columns.getColumnByIndex(index);

node = column.add(opts/content);

Creates a new Node object and adds it to the Columns instance

Returns a Node instance

opts: options object for the node content: required:String/HTMLElement/Function The content of the node When title is a String, the string is added to the content of the node When title is an HTMLElement, the HTMLElement is added to the content of the node When title is a Function, the function is called, passing it the new node instance. The function should return an HTMLElement to be added to the content of the node