#:{0}#
#:{0}#
\",\n defaultButtons: [ \"delete\", \"edit\" ]\n });\n\n var TaskBoardEditPane = TaskBoardPane.extend({\n init: function(taskboard, options, dataItem) {\n var that = this;\n\n options = extend({}, options.editable, {\n dataTitleField: options.dataTitleField,\n dataDescriptionField: options.dataDescriptionField,\n messages: options.messages,\n states: options.states\n });\n\n that.formSettings = extend(that.formSettings, {\n items: [\n { field: options.dataTitleField, label: options.messages[options.dataTitleField] },\n { field: options.dataDescriptionField, label: options.messages[options.dataDescriptionField] }\n ]\n }, options.form);\n\n TaskBoardPane.fn.init.call(that, taskboard, options, dataItem);\n\n that.element.addClass(TaskBoardPane.styles.edit);\n },\n defaultButtons: [ \"cancel\", \"saveChanges\" ],\n formSettings: {\n buttonsTemplate: \"\"\n },\n _buildHeaderTemplate: function() {\n var that = this;\n return kendo.format(that.headerTemplate, that.options.messages.edit + \" #:\" + that.options.dataTitleField + \"#\");\n },\n _renderContent: function() {\n var that = this,\n options = that.options,\n styles = TaskBoardPane.styles,\n formSettings = options.form || that.formSettings,\n formLabelId = kendo.guid(),\n element = $(\"\")\n .attr(\"role\", \"form\")\n .attr(\"aria-labelledby\", formLabelId);\n\n that.header.find(DOT + styles.headerText).attr(\"id\", formLabelId);\n\n that.content.append(element);\n\n that.form = new Form(element, extend({}, formSettings, {\n formData: that._dataItem\n }));\n\n that.form.element.find(\"input\").trigger(\"focus\");\n }\n });\n\n var TaskBoardCreatePane = TaskBoardEditPane.extend({\n init: function(taskboard, options, dataItem, resources, column) {\n var that = this,\n columnStatusField = options.columnSettings.dataStatusField,\n firstColumn = taskboard.columnsDataSource.view().at(0),\n status = column ? column[columnStatusField] : firstColumn[columnStatusField],\n clone = extend({}, dataItem);\n\n dataItem = taskboard.dataSource.add();\n dataItem.set(options.dataStatusField, status);\n\n for (var key in clone) {\n dataItem.set(key, clone[key]);\n }\n\n TaskBoardEditPane.fn.init.call(that, taskboard, options, dataItem, resources);\n },\n _buildHeaderTemplate: function() {\n var that = this;\n return kendo.format(that.headerTemplate, that.options.messages.createNewCard);\n },\n defaultButtons: [ \"cancel\", \"create\" ]\n });\n\n extend(kendo.ui.taskboard, {\n Pane: TaskBoardPane,\n panes: {\n Preview: TaskBoardPreviewPane,\n Edit: TaskBoardEditPane,\n Create: TaskBoardCreatePane\n }\n });\n\n extend(true, kendo.ui.taskboard.Pane, { styles: TaskBoardPaneStyles });\n\n })(window.kendo.jQuery);\n\n (function($, undefined$1) {\n var kendo = window.kendo,\n Observable = kendo.Observable,\n\n extend = $.extend,\n\n DOT = \".\",\n NS = DOT + \"kendoKeboardManager\",\n KEYDOWN = \"keydown\",\n ACTION = \"action\";\n\n\n var Keyboard = Observable.extend({\n init: function(element) {\n var that = this;\n\n that.register = {};\n that.element = element;\n\n that._attachEvents();\n\n Observable.fn.init.call(that);\n },\n\n registerShortcut: function(selector, shortcut, options) {\n var that = this;\n\n if (!that.register[selector]) {\n that.register[selector] = [];\n }\n\n if (shortcut.keyCode && isNaN(shortcut.keyCode) && shortcut.keyCode.toUpperCase) {\n shortcut.keyCode = shortcut.keyCode.toUpperCase().charCodeAt(0);\n }\n\n that.register[selector].push({\n shortcut: extend({\n keyCode: null,\n ctrlKey: false,\n shiftKey: false,\n altKey: false\n }, shortcut),\n options: options\n });\n\n },\n\n _attachEvents: function() {\n var that = this,\n handler = that._handler.bind(that);\n\n that.element.on(KEYDOWN + NS, handler);\n },\n\n _handler: function(ev) {\n var that = this,\n target = $(ev.target),\n shortcuts, action;\n\n for (var selector in that.register) {\n if (target.is(selector)) {\n shortcuts = that.register[selector];\n action = that._getAction(shortcuts, ev);\n\n if (action) {\n that._trigger(action, ev);\n break;\n }\n }\n }\n },\n\n _trigger: function(action, ev) {\n var that = this,\n target = $(ev.target);\n\n if (action.command) {\n that.trigger(ACTION, extend({}, ev, {\n command: action.command,\n options: extend({}, {\n target: target\n }, action.options)\n }));\n }\n\n if (action.handler) {\n action.handler(ev);\n }\n },\n\n _getAction: function(shortcuts, ev) {\n var that = this;\n\n for (var i = 0; i < shortcuts.length; i++) {\n if (that._compareShortcut(shortcuts[i].shortcut, ev)) {\n return shortcuts[i].options;\n }\n }\n },\n\n _compareShortcut: function(shortcut, ev) {\n var that = this;\n\n for (var key in shortcut) {\n var result = false;\n\n switch (key) {\n case \"ctrlKey\":\n result = shortcut[key] !== that._getShortcutModifier(ev);\n break;\n default:\n result = shortcut[key] !== ev[key];\n break;\n }\n\n if (result) {\n return false;\n }\n }\n\n return true;\n },\n\n _getShortcutModifier: function(ev) {\n var mac = navigator.platform.toUpperCase().indexOf('MAC') >= 0;\n return mac ? ev.metaKey : ev.ctrlKey;\n },\n\n destroy: function() {\n var that = this;\n\n that.element.off(NS);\n }\n });\n\n extend(kendo.ui.taskboard, {\n KeyboardManager: Keyboard\n });\n\n })(window.kendo.jQuery);\n\n var __meta__ = {\n id: \"taskboard\",\n name: \"TaskBoard\",\n category: \"web\",\n description: \"The TaskBoard widget displays cards.\",\n depends: [\"data\", \"sortable\", \"dialog\", \"form\", \"menu\", \"toolbar\"]\n };\n\n var TaskBoardStyles = {\n wrapper: \"k-taskboard\",\n header: \"k-taskboard-header\",\n content: \"k-taskboard-content\",\n toolbar: \"k-taskboard-toolbar k-toolbar-flat\",\n columnsContainer: \"k-taskboard-columns-container\",\n card: \"k-taskboard-card\",\n column: \"k-taskboard-column\",\n selected: \"k-selected\",\n disabled: \"k-disabled\",\n ignoreDrag: \"k-taskboard-drag-ignore\"\n };\n\n var preventDefault = function(ev) { ev.preventDefault(); };\n\n (function($, undefined$1) {\n var kendo = window.kendo,\n Widget = kendo.ui.Widget,\n DataSource = kendo.data.DataSource,\n extend = $.extend,\n ui = kendo.ui,\n isArray = Array.isArray,\n isPlainObject = $.isPlainObject,\n\n GENERIC = \"_generic\",\n\n DOT = \".\",\n\n MOVE = \"move\",\n MOVE_START = \"moveStart\",\n MOVE_END = \"moveEnd\",\n SELECT = \"select\",\n EXECUTE = \"execute\",\n ACTION = \"action\",\n CHANGE = \"change\",\n ERROR = \"change\",\n DATABINDING = \"dataBinding\",\n DATABOUND = \"dataBound\",\n EDIT_CARD = \"editCard\",\n SAVE_CARD = \"saveCard\",\n DELETE_CARD = \"deleteCard\",\n EDIT_COLUMN = \"editColumn\",\n SAVE_COLUMN = \"saveColumn\",\n DELETE_COLUMN = \"deleteColumn\",\n\n COLUMNSDATABINDING = \"columnsDataBinding\",\n COLUMNSDATABOUND = \"columnsDataBound\";\n\n var TaskBoard = Widget.extend({\n init: function(element, options) {\n var that = this;\n\n Widget.fn.init.call(that, element, options);\n\n element = that.wrapper = that.element;\n\n that._sortableIdentifier = that.element.attr(\"id\") || kendo.guid();\n\n that._wrapper();\n that._columnsDataSource();\n that._initResources();\n that._dataSource();\n that._initToolbar();\n that._initCardMenu();\n that._initKeyboard();\n\n if (that.options.autoBind) {\n that.load();\n }\n\n kendo.notify(that);\n },\n\n events: [\n MOVE,\n MOVE_START,\n MOVE_END,\n CHANGE,\n EXECUTE,\n SELECT,\n DATABINDING,\n DATABOUND,\n COLUMNSDATABINDING,\n COLUMNSDATABOUND,\n EDIT_CARD,\n SAVE_CARD,\n DELETE_CARD,\n EDIT_COLUMN,\n SAVE_COLUMN,\n DELETE_COLUMN\n ],\n\n options: {\n name: \"TaskBoard\",\n autoBind: true,\n height: 600,\n width: \"100%\",\n toolbar: true,\n dataStatusField: \"status\",\n dataTitleField: \"title\",\n dataDescriptionField: \"description\",\n dataCategoryField: \"category\",\n dataOrderField: null,\n cardMenu: true,\n editable: true,\n selectable: true,\n reorderable: true,\n previewPane: true,\n search: {\n operator: \"contains\"\n },\n dataSource: [],\n columns: [],\n columnSettings: {\n dataStatusField: \"status\",\n dataTextField: \"text\",\n dataOrderField: null\n },\n resources: [],\n messages: {\n edit: \"Edit\",\n createNewCard: \"Create new card\",\n create: \"Create\",\n search: \"Search\",\n previewCard: \"Preview card\",\n addCard: \"Add card\",\n editCard: \"Edit card\",\n deleteCard: \"Delete Card\",\n addColumn: \"Add column\",\n editColumn: \"Edit column\",\n deleteColumn: \"Delete column\",\n close: \"Close\",\n cancel: \"Cancel\",\n \"delete\": \"Delete\",\n saveChanges: \"Save changes\",\n title: \"Title:\",\n description: \"Description:\",\n newColumn: \"New column\",\n deleteColumnConfirm: \"Are you sure you want to delete this column?\",\n deleteCardConfirm: \"Are you sure you want to delete this card?\"\n }\n },\n\n items: function() {\n var that = this,\n result = $([]);\n\n for (var key in that._columns) {\n $.merge(result, that._columns[key].cards());\n }\n\n return result;\n },\n\n itemsByStatus: function(status) {\n var that = this,\n result = that._getColumn(status).cards();\n\n return result;\n },\n\n itemsByColumn: function(columnElm) {\n var that = this,\n column = that._getColumnByElement(columnElm);\n\n if (column) {\n return column.cards();\n }\n },\n\n load: function() {\n var that = this,\n fetchPromises = [];\n\n that._progress(true);\n\n fetchPromises.push(that.columnsDataSource.fetch());\n\n for (var key in that.resources) {\n fetchPromises.push(that.resources[key].dataSource.fetch());\n }\n\n $.when.apply(null, fetchPromises)\n .then(that.dataSource.read.bind(that.dataSource));\n },\n\n dataItem: function(cardElm) {\n var that = this,\n dataSource = that.dataSource,\n uid;\n\n cardElm = $(cardElm);\n uid = cardElm.attr(kendo.attr(\"uid\"));\n\n return dataSource.getByUid(uid);\n },\n\n columnDataItem: function(columnElm) {\n var that = this,\n columnsDataSource = that.columnsDataSource,\n uid;\n\n columnElm = $(columnElm);\n uid = columnElm.attr(kendo.attr(\"uid\"));\n\n return columnsDataSource.getByUid(uid);\n },\n\n columns: function() {\n var that = this,\n result = $([]);\n\n for (var key in that._columns) {\n $.merge(result, that._columns[key].element);\n }\n\n return result;\n },\n\n columnByStatus: function(status) {\n return this._getColumn(status).element;\n },\n\n select: function(card, toggle) {\n var that = this;\n\n if (!card) {\n return that.element\n .find(DOT + TaskBoard.styles.card + DOT + TaskBoard.styles.selected).eq(0);\n }\n\n card = $(card);\n toggle = toggle !== false;\n\n if (toggle) {\n that.element\n .find(DOT + TaskBoard.styles.card + DOT + TaskBoard.styles.selected)\n .removeClass(TaskBoard.styles.selected);\n }\n\n card.toggleClass(TaskBoard.styles.selected, toggle);\n },\n\n previewCard: function(cardElement) {\n var that = this,\n options = that.options,\n args = that._extendExecArgs({ target: cardElement });\n\n if (options.previewPane) {\n that._openPane(extend({\n pane: \"Preview\"\n }, args));\n }\n },\n\n editCard: function(cardElement) {\n var that = this,\n options = that.options,\n args;\n\n cardElement = $(cardElement);\n args = that._extendExecArgs({ target: cardElement });\n\n if (options.editable) {\n that._openPane(extend({\n pane: \"Edit\"\n }, args));\n }\n },\n\n saveCard: function() {\n var that = this;\n\n that.dataSource.sync();\n },\n\n deleteCard: function(cardElement) {\n var that = this,\n card = that.dataItem(cardElement);\n\n that.dataSource.remove(card);\n that.dataSource.sync();\n },\n\n addCard: function(dataItem) {\n var that = this,\n options = that.options,\n args = { card: dataItem };\n\n if (options.editable) {\n that._openPane(extend({\n pane: \"Create\"\n }, args));\n }\n },\n\n addColumn: function(index, data) {\n var that = this,\n columnSettings = extend(true, {}, that.options.columnSettings, {\n messages: that.options.messages,\n states: that._buildStates(),\n sortableIdentifier: that._sortableIdentifier\n }),\n newColumn, model, column;\n\n if (isNaN(index) && !data) {\n data = index;\n index = null;\n }\n\n model = that.columnsDataSource._createNewModel(data);\n index = isNaN(index) || index === null ? that.columnsDataSource.data().length : index;\n column = that.columns().eq(index);\n that.columnsDataSource.insert(index, model);\n\n newColumn = new ui.taskboard.NewColumn(columnSettings, model);\n\n if (isNaN(index) || !column.length) {\n that.columnsContainer.append(newColumn.element);\n } else {\n column.before(newColumn.element);\n }\n\n newColumn.bind(ACTION, that.executeCommand.bind(that));\n },\n\n editColumn: function(columnElement) {\n var that = this;\n\n columnElement = $(columnElement);\n\n that._getColumnByElement(columnElement).edit();\n },\n\n saveColumn: function() {\n var that = this;\n\n that.columnsDataSource.sync();\n },\n\n deleteColumn: function(columnElement) {\n var that = this,\n column = that.columnDataItem(columnElement);\n\n that.columnsDataSource.remove(column);\n that.columnsDataSource.sync();\n },\n\n registerShortcut: function(selector, shortcut, options) {\n var that = this;\n\n that.keyboardManager.registerShortcut(selector, shortcut, options);\n },\n\n enable: function(cardElement, toggle) {\n cardElement = $(cardElement);\n\n cardElement.toggleClass(TaskBoard.styles.disabled, toggle === false);\n cardElement.attr(\"aria-disabled\", toggle === false);\n },\n\n enableByColumn: function(columnElement, toggle) {\n var that = this;\n\n columnElement = $(columnElement);\n\n that.itemsByColumn(columnElement).each(function(index, card) {\n that.enable(card, toggle);\n });\n },\n\n readOnly: function(cardElement, toggle) {\n cardElement = $(cardElement);\n\n toggle = toggle !== false;\n\n cardElement.find(\"[\" + kendo.attr(\"command\") + \"]\").toggleClass(TaskBoard.styles.disabled, toggle);\n cardElement.find(\"a,button\").toggleClass(TaskBoard.styles.disabled, toggle);\n\n cardElement.toggleClass(TaskBoard.styles.ignoreDrag, toggle);\n cardElement.attr(\"aria-readonly\", toggle);\n },\n\n readOnlyByColumn: function(columnElement, toggle) {\n var that = this;\n\n columnElement = $(columnElement);\n\n that.itemsByColumn(columnElement).each(function(index, card) {\n that.readOnly(card, toggle);\n });\n },\n\n setDataSource: function(dataSource) {\n var that = this;\n\n that.options.dataSource = dataSource;\n that._dataSource();\n\n if (that.options.autoBind) {\n that.dataSource.read();\n }\n },\n\n setColumnsDataSource: function(dataSource) {\n var that = this;\n\n that.options.columns = dataSource;\n that._columnsDataSource();\n\n if (that.options.autoBind) {\n that.columnsDataSource.fetch(function() {\n that._renderCards(that.dataSource.view());\n });\n }\n },\n\n _getColumn: function(status) {\n return this._columns[status];\n },\n\n _getColumnByElement: function(columnElement) {\n var that = this;\n\n columnElement = $(columnElement);\n\n for (var key in that._columns) {\n if (that._columns[key].element[0] === columnElement[0]) {\n return that._columns[key];\n }\n }\n },\n\n _openPane: function(options) {\n var that = this,\n pane = new ui.taskboard.panes[options.pane](that, extend({}, that.options, {\n states: that._buildStates()\n }), options.card, that.resources, options.column),\n focusableElement, keyboardManager;\n\n if (that.pane) {\n that._closePane();\n }\n\n that.pane = pane;\n that.content.after(that.pane.element);\n that.content.css(\"margin-right\",\n that.pane.element.outerWidth() -\n parseInt(that.content.css(\"paddingRight\"), 10));\n\n that.pane.bind(ACTION, that.executeCommand.bind(that));\n\n that.pane.keyboardManager = keyboardManager = new ui.taskboard.KeyboardManager(that.pane.element);\n\n keyboardManager.bind(ACTION, that.executeCommand.bind(that));\n\n keyboardManager.registerShortcut(\"*\", {\n keyCode: kendo.keys.ESC\n }, { command: \"ClosePaneCommand\" });\n\n keyboardManager.registerShortcut(\"*\", {\n keyCode: kendo.keys.ENTER\n }, { command: \"SaveChangesCommand\", options: {\n card: that.pane._dataItem\n } });\n\n focusableElement = that.pane.element.find(\"input\");\n\n if (!focusableElement.length) {\n focusableElement = that.pane.element.find(\"button\");\n }\n\n setTimeout(function() {\n focusableElement.eq(0).trigger(\"focus\");\n }, 0);\n },\n\n _closePane: function() {\n var that = this;\n\n if (that.pane) {\n that.pane.keyboardManager.destroy();\n that.pane.unbind(ACTION);\n that.pane.destroy();\n delete that.pane;\n\n that.content.css(\"margin-right\", \"\");\n }\n },\n\n _wrapper: function() {\n var that = this,\n options = that.options,\n styles = TaskBoard.styles,\n headerElm = \"\",\n contentElm = \"\",\n colsContainer = \"\";\n\n that.element.addClass(styles.wrapper)\n .width(options.width)\n .height(options.height)\n .attr(\"role\", \"application\");\n that.header = $(headerElm).appendTo(that.element);\n that.content = $(contentElm).appendTo(that.element);\n that.columnsContainer = $(colsContainer).appendTo(that.content);\n },\n\n _initToolbar: function() {\n var that = this,\n styles = TaskBoard.styles,\n options = that.options,\n toolbarElm = $(\"\"),\n toolbarOptions = isArray(options.toolbar) ? { items: options.toolbar } : options.toolbar;\n\n if (options.toolbar === false) {\n return;\n }\n\n toolbarOptions = extend({}, toolbarOptions, {\n taskboard: this,\n messages: options.messages,\n action: that.executeCommand.bind(that),\n states: that._buildStates()\n });\n\n that.header.append(toolbarElm);\n that.toolbar = new ui.taskboard.ToolBar(toolbarElm, toolbarOptions);\n },\n\n _buildStates: function() {\n var that = this;\n\n return {\n isEditable: that._isEditable(),\n isReorderable: that._isReorderable(),\n isSelectable: that._isSelectable(),\n isReadOnly: !that._isReorderable() && !that._isEditable(),\n isDisabled: !that._isReorderable() && !that._isEditable() && !that._isSelectable(),\n isSearchable: that._isSearchable(),\n notLocalColumns: !(that.columnsDataSource.transport instanceof kendo.data.LocalTransport),\n isRtl: kendo.support.isRtl(that.wrapper)\n };\n },\n\n _isSearchable: function() {\n return !!this.options.search;\n },\n\n _isEditable: function() {\n return !!this.options.editable;\n },\n\n _isReorderable: function() {\n return !!this.options.reorderable;\n },\n\n _isSelectable: function() {\n return !!this.options.selectable;\n },\n\n executeCommand: function(args) {\n var that = this,\n commandName = args.command,\n commandOptions = extend({ taskboard: this }, isPlainObject(args.options) ? that._extendExecArgs(args.options) : { value: args.options }),\n command = ui.taskboard.commands[commandName] && new ui.taskboard.commands[commandName](commandOptions);\n\n\n if (!that.trigger(EXECUTE, args)) {\n if (command) {\n command.exec();\n } else {\n window.console.warn(kendo.format(\"Trying to use {0} command, but such is not available in the kendo.ui.taskboard.commands namespace!\", commandName));\n }\n }\n },\n\n _extendExecArgs: function(args) {\n var that = this,\n target = args.draggableEvent ? args.item : args.target,\n columnElm, cardElm, columnDataItem, cardDataItem;\n\n if (args.card) {\n target = that.items().filter(function(idx, elm) {\n return $(elm).attr(kendo.attr(\"uid\")) === args.card.get(\"uid\");\n });\n }\n\n if (!target || !(target && target.length)) {\n return args;\n }\n\n columnElm = args.columnElement || (target.is(DOT + TaskBoard.styles.column) ? target : target.parents(DOT + TaskBoard.styles.column));\n columnDataItem = that.columnsDataSource.getByUid(columnElm.data(kendo.ns + \"uid\"));\n cardElm = target.is(DOT + TaskBoard.styles.card) ? target : target.closest(DOT + TaskBoard.styles.card);\n cardDataItem = that.dataSource.getByUid(cardElm.data(kendo.ns + \"uid\"));\n\n return extend(args, {\n card: cardDataItem,\n cardElement: cardElm.length ? cardElm : undefined$1,\n column: columnDataItem,\n columnElement: columnElm.length ? columnElm : undefined$1\n });\n },\n\n\n _select: function(card, toggle) {\n var that = this;\n\n if (toggle === null) {\n toggle = true;\n }\n\n if (!that.trigger(SELECT, { card: card })) {\n that.select(card, toggle);\n that.previewCard(card);\n }\n },\n\n _columnsDataSource: function() {\n var that = this,\n options = that.options,\n columnSettings = options.columnSettings,\n columnsDataSource = options.columns;\n\n columnsDataSource = isArray(columnsDataSource) ? { data: columnsDataSource } : columnsDataSource;\n\n if (columnSettings.dataOrderField && !columnsDataSource.sort) {\n columnsDataSource.sort = { field: columnSettings.dataOrderField, dir: \"asc\" };\n }\n\n if (!columnsDataSource.schema) {\n var fields = {};\n\n fields[columnSettings.dataStatusField] = { type: \"string\", defaultValue: function() { return kendo.guid().split(\"-\")[0]; } };\n fields[columnSettings.dataTextField] = { type: \"string\" };\n\n if (columnSettings.dataOrderField) {\n fields[columnSettings.dataOrderField] = { type: \"number\" };\n }\n\n columnsDataSource.schema = {\n model: {\n fields: fields\n }\n };\n }\n\n if (that.columnsDataSource && that._columnsChangeHandler) {\n that.columnsDataSource.unbind(CHANGE, that._columnsChangeHandler);\n that.columnsDataSource.unbind(CHANGE, that._columnsErrorHandler);\n } else {\n that._columnsChangeHandler = that._columnsDataSourceChange.bind(that);\n that._columnsErrorHandler = that._error.bind(that);\n }\n\n that.columnsDataSource = DataSource.create(columnsDataSource)\n .bind(CHANGE, that._columnsChangeHandler)\n .bind(ERROR, that._columnsErrorHandler);\n },\n\n _columnsDataSourceChange: function(ev) {\n var that = this,\n view = that.columnsDataSource.view(),\n columnSettings = extend(true, {}, that.options.columnSettings, {\n messages: that.options.messages,\n states: that._buildStates(),\n sortableIdentifier: that._sortableIdentifier\n }),\n statusField = columnSettings.dataStatusField;\n\n if (ev.action && ev.action !== \"sync\") {\n return;\n }\n\n if (that.trigger(COLUMNSDATABINDING, ev)) {\n return;\n }\n\n that._progress(true);\n\n that._columns = {};\n that.columnsContainer.html(\"\");\n\n for (var i = 0; i < view.length; i++) {\n var data = view[i];\n var status = data[statusField] || GENERIC;\n var column;\n\n column = that._columns[status] = new ui.taskboard.Column(columnSettings, data);\n that.columnsContainer.append(column.element);\n column.bind(ACTION, that.executeCommand.bind(that));\n column.bind(MOVE, that._move.bind(that));\n column.bind(MOVE_END, that._moveEnd.bind(that));\n column.bind(MOVE_START, that._moveStart.bind(that));\n column.bind(CHANGE, that._changeOrder.bind(that));\n that._tabindex(column.element);\n }\n\n if (ev.action === \"sync\" || ev.action === undefined$1) {\n that._renderCards(that.dataSource.view());\n }\n\n that._progress(false);\n that.trigger(COLUMNSDATABOUND, ev);\n },\n\n _move: function(ev) {\n this.trigger(MOVE, this._extendExecArgs(ev));\n },\n\n _moveEnd: function(ev) {\n this.trigger(MOVE_END, this._extendExecArgs(ev));\n },\n\n _moveStart: function(ev) {\n this.trigger(MOVE_START, this._extendExecArgs(ev));\n },\n\n _changeOrder: function(ev) {\n this.trigger(CHANGE, this._extendExecArgs(ev));\n },\n\n _dataSource: function() {\n var that = this,\n options = that.options,\n dataSource = options.dataSource;\n\n dataSource = isArray(dataSource) ? { data: dataSource } : dataSource;\n\n if (options.dataOrderField && !dataSource.sort) {\n dataSource.sort = { field: options.dataOrderField, dir: \"asc\" };\n }\n\n if (!dataSource.schema) {\n var fields = {};\n\n fields[options.dataStatusField] = { type: \"string\" };\n fields[options.dataTitleField] = { type: \"string\" };\n fields[options.dataDescriptionField] = { type: \"string\" };\n fields[options.dataCategoryField] = { type: \"string\" };\n\n if (options.dataOrderField) {\n fields[options.dataOrderField] = { type: \"number\" };\n }\n\n dataSource.schema = {\n model: {\n fields: fields\n }\n };\n }\n\n if (that.dataSource && that._changeHandler) {\n that.dataSource.unbind(CHANGE, that._changeHandler);\n that.dataSource.unbind(ERROR, that._errorHandler);\n } else {\n that._changeHandler = that._change.bind(that);\n that._errorHandler = that._error.bind(that);\n }\n\n that.dataSource = DataSource.create(dataSource)\n .bind(CHANGE, that._changeHandler);\n },\n\n _change: function(ev) {\n var that = this;\n\n if (ev.action && ev.action !== \"sync\") {\n return;\n }\n\n if (that.trigger(DATABINDING, ev)) {\n return;\n }\n\n that._progress(true);\n\n that._clearColumns();\n that._renderCards(that.dataSource.view());\n that._closePane();\n\n that.trigger(DATABOUND, ev);\n that._progress(false);\n },\n\n _error: function() {\n this._progress(false);\n },\n\n _renderCards: function(data) {\n var that = this;\n\n for (var i = 0; i < data.length; i++) {\n that._renderCard(data[i]);\n }\n },\n\n _renderCard: function(card) {\n var that = this,\n options = extend({}, that.options, { states: that._buildStates() }),\n statusField = options.dataStatusField,\n status = card[statusField] || GENERIC;\n\n if (status && that._columns[status]) {\n card = new ui.taskboard.Card(options, card, that.resources);\n that._columns[status].addCard(card.element);\n that._tabindex(card.element);\n }\n },\n\n _clearColumns: function() {\n var that = this;\n\n for (var key in that._columns) {\n that._columns[key].empty();\n }\n },\n\n _initCardMenu: function() {\n var that = this,\n options = that.options,\n cardMenuOptions = isArray(options.cardMenu) ? { items: options.cardMenu } : options.cardMenu;\n\n cardMenuOptions = extend({}, {\n messages: options.messages,\n target: that.columnsContainer,\n filter: \".k-taskboard-card-menu-button\",\n action: that.executeCommand.bind(that),\n showOn: \"click\",\n alignToAnchor: true,\n states: that._buildStates()\n }, cardMenuOptions);\n\n if (options.cardMenu === false) {\n return;\n }\n\n that.cardMenu = new ui.taskboard.CardMenu(\"