jingrow/datatable
1
0
Fork 0
Code Pull Requests Activity

Mouse Selection

Browse Source
This commit is contained in:
Faris Ansari 2017-11-02 10:40:48 +05:30
parent d55ee1b45f
commit f9145845a9
4 changed files with 94 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
index.html
View File

@ -18,7 +18,7 @@
<body>
<h1>Frappé DataTable</h1>
<button onclick="datatable.render()">Refresh</button>
<section style="width: 60%;">
<section style="width: 60%; font-size: 12px;">
</section>
<script src="./node_modules/jquery/dist/jquery.js"></script>

69
lib/frappe-datatable.js
View File

@ -1351,6 +1351,7 @@ var CellManager = function () {
this.bindKeyboardNav();
this.bindKeyboardSelection();
this.bindCopyCellContents();
this.bindMouseEvents();
}
}, {
key: 'bindFocusCell',
@ -1445,18 +1446,9 @@ var CellManager = function () {
return $selectionCursor;
};
var selectArea = function selectArea($selectionCursor) {
if (!_this4.$focusedCell) return;
if (_this4.selectArea(_this4.$focusedCell, $selectionCursor)) {
// valid selection
_this4.$selectionCursor = $selectionCursor;
}
};
['left', 'right', 'up', 'down'].map(function (direction) {
return _keyboard2.default.on('shift+' + direction, function () {
return selectArea(getNextSelectionCursor(direction));
return _this4.selectArea(getNextSelectionCursor(direction));
});
});
}
@ -1469,6 +1461,27 @@ var CellManager = function () {
_this5.copyCellContents(_this5.$focusedCell, _this5.$selectionCursor);
});
}
}, {
key: 'bindMouseEvents',
value: function bindMouseEvents() {
var _this6 = this;
var mouseDown = null;
this.bodyScrollable.on('mousedown', '.data-table-col', function (e) {
mouseDown = true;
_this6.focusCell($(e.currentTarget));
});
this.bodyScrollable.on('mouseup', function () {
mouseDown = false;
});
this.bodyScrollable.on('mousemove', '.data-table-col', function (e) {
if (!mouseDown) return;
_this6.selectArea($(e.currentTarget));
});
}
}, {
key: 'focusCell',
value: function focusCell($cell) {
@ -1477,7 +1490,7 @@ var CellManager = function () {
var _getCellAttr = this.getCellAttr($cell),
colIndex = _getCellAttr.colIndex;
if (colIndex < this.instance.getFirstColumnIndex()) {
if (this.isStandardCell(colIndex)) {
return;
}
@ -1528,8 +1541,18 @@ var CellManager = function () {
}
}, {
key: 'selectArea',
value: function selectArea($cell1, $cell2) {
var _this6 = this;
value: function selectArea($selectionCursor) {
if (!this.$focusedCell) return;
if (this._selectArea(this.$focusedCell, $selectionCursor)) {
// valid selection
this.$selectionCursor = $selectionCursor;
}
}
}, {
key: '_selectArea',
value: function _selectArea($cell1, $cell2) {
var _this7 = this;
var cells = this.getCellsInRange.apply(this, arguments);
@ -1540,7 +1563,7 @@ var CellManager = function () {
c = _ref2[0],
r = _ref2[1];
return _this6.getCell$(r, c)[0];
return _this7.getCell$(r, c)[0];
});
$($cells).addClass('highlight');
@ -1588,6 +1611,10 @@ var CellManager = function () {
colIndex2 = _ref4[1];
}
if (this.isStandardCell(colIndex1) || this.isStandardCell(colIndex2)) {
return false;
}
var cells = [];
var colIndex = colIndex1;
var rowIndex = rowIndex1;
@ -1691,7 +1718,7 @@ var CellManager = function () {
}, {
key: 'submitEditing',
value: function submitEditing($cell) {
var _this7 = this;
var _this8 = this;
var _getCellAttr5 = this.getCellAttr($cell),
rowIndex = _getCellAttr5.rowIndex,
@ -1707,7 +1734,7 @@ var CellManager = function () {
if (done && done.then) {
// wait for promise then update internal state
done.then(function () {
return _this7.updateCell(rowIndex, colIndex, value);
return _this8.updateCell(rowIndex, colIndex, value);
});
} else {
this.updateCell(rowIndex, colIndex, value);
@ -1720,7 +1747,7 @@ var CellManager = function () {
}, {
key: 'copyCellContents',
value: function copyCellContents($cell1, $cell2) {
var _this8 = this;
var _this9 = this;
var cells = this.getCellsInRange.apply(this, arguments);
@ -1729,7 +1756,7 @@ var CellManager = function () {
var values = cells
// get cell objects
.map(function (index) {
return _this8.getCell.apply(_this8, _toConsumableArray(index));
return _this9.getCell.apply(_this9, _toConsumableArray(index));
})
// convert to array of rows
.reduce(function (acc, curr) {
@ -1765,6 +1792,12 @@ var CellManager = function () {
$cell.html((0, _utils.getCellContent)(cell));
}
}, {
key: 'isStandardCell',
value: function isStandardCell(colIndex) {
// Standard cells are in Sr. No and Checkbox column
return colIndex < this.instance.getFirstColumnIndex();
}
}, {
key: 'getCell$',
value: function getCell$(rowIndex, colIndex) {

2
lib/frappe-datatable.js.map
View File

File diff suppressed because one or more lines are too long

53
src/cellmanager.js
View File

@ -22,6 +22,7 @@ export default class CellManager {
this.bindKeyboardNav();
this.bindKeyboardSelection();
this.bindCopyCellContents();
this.bindMouseEvents();
}
bindFocusCell() {
@ -102,18 +103,9 @@ export default class CellManager {
return $selectionCursor;
};
const selectArea = ($selectionCursor) => {
if (!this.$focusedCell) return;
if (this.selectArea(this.$focusedCell, $selectionCursor)) {
// valid selection
this.$selectionCursor = $selectionCursor;
}
};
['left', 'right', 'up', 'down'].map(
direction => keyboard.on('shift+' + direction,
() => selectArea(getNextSelectionCursor(direction)))
() => this.selectArea(getNextSelectionCursor(direction)))
);
}
@ -123,11 +115,30 @@ export default class CellManager {
});
}
bindMouseEvents() {
let mouseDown = null;
this.bodyScrollable.on('mousedown', '.data-table-col', (e) => {
mouseDown = true;
this.focusCell($(e.currentTarget));
});
this.bodyScrollable.on('mouseup', () => {
mouseDown = false;
});
this.bodyScrollable.on('mousemove', '.data-table-col', (e) => {
if (!mouseDown) return;
this.selectArea($(e.currentTarget));
});
}
focusCell($cell) {
if (!$cell.length) return;
const { colIndex } = this.getCellAttr($cell);
if (colIndex < this.instance.getFirstColumnIndex()) {
if (this.isStandardCell(colIndex)) {
return;
}
@ -173,7 +184,16 @@ export default class CellManager {
};
}
selectArea($cell1, $cell2) {
selectArea($selectionCursor) {
if (!this.$focusedCell) return;
if (this._selectArea(this.$focusedCell, $selectionCursor)) {
// valid selection
this.$selectionCursor = $selectionCursor;
}
};
_selectArea($cell1, $cell2) {
const cells = this.getCellsInRange(...arguments);
if (!cells) return false;
@ -213,6 +233,10 @@ export default class CellManager {
[colIndex1, colIndex2] = [colIndex2, colIndex1];
}
if (this.isStandardCell(colIndex1) || this.isStandardCell(colIndex2)) {
return false;
}
let cells = [];
let colIndex = colIndex1;
let rowIndex = rowIndex1;
@ -367,6 +391,11 @@ export default class CellManager {
$cell.html(getCellContent(cell));
}
isStandardCell(colIndex) {
// Standard cells are in Sr. No and Checkbox column
return colIndex < this.instance.getFirstColumnIndex();
}
getCell$(rowIndex, colIndex) {
return this.bodyScrollable.find(`.data-table-col[data-row-index="${rowIndex}"][data-col-index="${colIndex}"]`);
}