ORIENT/modules/backend/widgets/table/assets/js/table.processor.checkbox.js

132 lines
4.1 KiB
JavaScript
Raw Normal View History

2014-12-03 05:46:54 +00:00
/*
* Checkbox cell processor for the table control.
*/
+function ($) { "use strict";
// NAMESPACE CHECK
// ============================
if ($.oc.table === undefined)
throw new Error("The $.oc.table namespace is not defined. Make sure that the table.js script is loaded.");
if ($.oc.table.processor === undefined)
throw new Error("The $.oc.table.processor namespace is not defined. Make sure that the table.processor.base.js script is loaded.");
// CLASS DEFINITION
// ============================
var Base = $.oc.table.processor.base,
BaseProto = Base.prototype
2014-12-04 06:48:16 +00:00
var CheckboxProcessor = function(tableObj, columnName, columnConfiguration) {
2014-12-03 05:46:54 +00:00
//
// Parent constructor
//
2014-12-04 06:48:16 +00:00
Base.call(this, tableObj, columnName, columnConfiguration)
2014-12-03 05:46:54 +00:00
}
CheckboxProcessor.prototype = Object.create(BaseProto)
CheckboxProcessor.prototype.constructor = CheckboxProcessor
CheckboxProcessor.prototype.dispose = function() {
BaseProto.dispose.call(this)
}
/*
* Determines if the processor's cell is focusable.
*/
CheckboxProcessor.prototype.isCellFocusable = function() {
return false
}
/*
* Renders the cell in the normal (no edit) mode
*/
CheckboxProcessor.prototype.renderCell = function(value, cellContentContainer) {
var checkbox = document.createElement('div')
checkbox.setAttribute('data-checkbox-element', 'true')
checkbox.setAttribute('tabindex', '0')
if (value && value != 0 && value != "false") {
2014-12-03 05:46:54 +00:00
checkbox.setAttribute('class', 'checked')
}
2014-12-03 05:46:54 +00:00
cellContentContainer.appendChild(checkbox)
}
/*
* This method is called when the cell managed by the processor
* is focused (clicked or navigated with the keyboard).
*/
CheckboxProcessor.prototype.onFocus = function(cellElement, isClick) {
cellElement.querySelector('div[data-checkbox-element]').focus()
}
/*
* Event handler for the keydown event. The table class calls this method
* for all processors.
*/
CheckboxProcessor.prototype.onKeyDown = function(ev) {
if (ev.keyCode == 32)
this.onClick(ev)
}
/*
* Event handler for the click event. The table class calls this method
* for all processors.
*/
CheckboxProcessor.prototype.onClick = function(ev) {
var target = this.tableObj.getEventTarget(ev, 'DIV')
if (target.getAttribute('data-checkbox-element')) {
// The method is called for all processors, but we should
// update only the checkbox in the clicked column.
var container = this.getCheckboxContainerNode(target)
if (container.getAttribute('data-column') !== this.columnName) {
return
}
2014-12-03 05:46:54 +00:00
this.changeState(target)
2015-09-11 03:45:07 +00:00
$(ev.target).trigger('change')
2014-12-03 05:46:54 +00:00
}
}
CheckboxProcessor.prototype.changeState = function(divElement) {
var cell = divElement.parentNode.parentNode
if (divElement.getAttribute('class') == 'checked') {
divElement.setAttribute('class', '')
this.tableObj.setCellValue(cell, 0)
}
else {
2014-12-03 05:46:54 +00:00
divElement.setAttribute('class', 'checked')
this.tableObj.setCellValue(cell, 1)
}
}
CheckboxProcessor.prototype.getCheckboxContainerNode = function(checkbox) {
return checkbox.parentNode.parentNode
}
/*
* This method is called when a cell value in the row changes.
*/
CheckboxProcessor.prototype.onRowValueChanged = function(columnName, cellElement) {
if (columnName != this.columnName) {
return
}
var checkbox = cellElement.querySelector('div[data-checkbox-element]'),
value = this.tableObj.getCellValue(cellElement)
if (value && value != 0 && value != "false") {
checkbox.setAttribute('class', 'checked')
}
else {
checkbox.setAttribute('class', '')
}
}
2014-12-03 05:46:54 +00:00
$.oc.table.processor.checkbox = CheckboxProcessor;
}(window.jQuery);