Skip to content

Commit 29af692

Browse files
6pac6pac
committed
Merge branch 'master' of github.com:6pac/SlickGrid
2 parents 8b8bdd4 + fe3b9f8 commit 29af692

File tree

7 files changed

+178
-26
lines changed

7 files changed

+178
-26
lines changed

‎plugins/slick.cellrangedecorator.js‎

Lines changed: 13 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,12 @@
2424
selectionCss: {
2525
"zIndex": "9999",
2626
"border": "2px dashed red"
27+
},
28+
offset: {
29+
top: -1,
30+
left: -1,
31+
height: -2,
32+
width: -2
2733
}
2834
};
2935

@@ -33,19 +39,19 @@
3339
function show(range) {
3440
if (!_elem) {
3541
_elem = $("<div></div>", {css: options.selectionCss})
36-
.addClass(options.selectionCssClass)
37-
.css("position", "absolute")
38-
.appendTo(grid.getCanvasNode());
42+
.addClass(options.selectionCssClass)
43+
.css("position", "absolute")
44+
.appendTo(grid.getCanvasNode());
3945
}
4046

4147
var from = grid.getCellNodeBox(range.fromRow, range.fromCell);
4248
var to = grid.getCellNodeBox(range.toRow, range.toCell);
4349

4450
_elem.css({
45-
top: from.top - 1,
46-
left: from.left - 1,
47-
height: to.bottom - from.top - 2,
48-
width: to.right - from.left - 2
51+
top: from.top + options.offset.top,
52+
left: from.left + options.offset.left,
53+
height: to.bottom - from.top + options.offset.height,
54+
width: to.right - from.left + options.offset.width
4955
});
5056

5157
return _elem;

‎plugins/slick.cellrangeselector.js‎

Lines changed: 15 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,6 @@
66
}
77
});
88

9-
109
function CellRangeSelector(options) {
1110
var _grid;
1211
var _currentlySelectedRange;
@@ -21,10 +20,9 @@
2120
}
2221
};
2322

24-
2523
function init(grid) {
2624
options = $.extend(true, {}, _defaults, options);
27-
_decorator = new Slick.CellRangeDecorator(grid, options);
25+
_decorator = options.cellDecorator || new Slick.CellRangeDecorator(grid, options);
2826
_grid = grid;
2927
_canvas = _grid.getCanvasNode();
3028
_handler
@@ -38,6 +36,10 @@
3836
_handler.unsubscribeAll();
3937
}
4038

39+
function getCellDecorator() {
40+
return _decorator;
41+
}
42+
4143
function handleDragInit(e, dd) {
4244
// prevent the grid from cancelling drag'n'drop by default
4345
e.stopImmediatePropagation();
@@ -58,8 +60,8 @@
5860
_grid.focus();
5961

6062
var start = _grid.getCellFromPoint(
61-
dd.startX - $(_canvas).offset().left,
62-
dd.startY - $(_canvas).offset().top);
63+
dd.startX - $(_canvas).offset().left,
64+
dd.startY - $(_canvas).offset().top);
6365

6466
dd.range = {start: start, end: {}};
6567
_currentlySelectedRange = dd.range;
@@ -73,8 +75,8 @@
7375
e.stopImmediatePropagation();
7476

7577
var end = _grid.getCellFromPoint(
76-
e.pageX - $(_canvas).offset().left,
77-
e.pageY - $(_canvas).offset().top);
78+
e.pageX - $(_canvas).offset().left,
79+
e.pageY - $(_canvas).offset().top);
7880

7981
if (!_grid.canCellBeSelected(end.row, end.cell)) {
8082
return;
@@ -96,10 +98,10 @@
9698
_decorator.hide();
9799
_self.onCellRangeSelected.notify({
98100
range: new Slick.Range(
99-
dd.range.start.row,
100-
dd.range.start.cell,
101-
dd.range.end.row,
102-
dd.range.end.cell
101+
dd.range.start.row,
102+
dd.range.start.cell,
103+
dd.range.end.row,
104+
dd.range.end.cell
103105
)
104106
});
105107
}
@@ -111,10 +113,11 @@
111113
$.extend(this, {
112114
"init": init,
113115
"destroy": destroy,
116+
"getCellDecorator": getCellDecorator,
114117
"getCurrentRange": getCurrentRange,
115118

116119
"onBeforeCellRangeSelected": new Slick.Event(),
117120
"onCellRangeSelected": new Slick.Event()
118121
});
119122
}
120-
})(jQuery);
123+
})(jQuery);

‎plugins/slick.cellselectionmodel.js‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,14 +6,14 @@
66
}
77
});
88

9-
109
function CellSelectionModel(options) {
1110
var _grid;
1211
var _canvas;
1312
var _ranges = [];
1413
var _self = this;
1514
var _selector;
16-
if ( typeof options === "undefined" || typeof options.cellRangeSelector === "undefined") {
15+
16+
if (typeof options === "undefined" || typeof options.cellRangeSelector === "undefined") {
1717
_selector = new Slick.CellRangeSelector({
1818
"selectionCss": {
1919
"border": "2px solid black"
@@ -28,7 +28,6 @@
2828
selectActiveCell: true
2929
};
3030

31-
3231
function init(grid) {
3332
_options = $.extend(true, {}, _defaults, options);
3433
_grid = grid;

‎tests/plugins/cellrangedecorator.html‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>SlickGrid - Cell Selection Model plugin tests</title>
5+
<link rel="stylesheet" href="../../lib/qunit.css" type="text/css"/>
6+
<link rel="stylesheet" href="../../slick.grid.css" type="text/css"/>
7+
<link rel="stylesheet" href="../../slick-default-theme.css" type="text/css" />
8+
</head>
9+
<body>
10+
<h1 id="qunit-header">SlickGrid - Cell Selection Model Test Suite</h1>
11+
<h2 id="qunit-banner"></h2>
12+
<div id="qunit-testrunner-toolbar"></div>
13+
<h2 id="qunit-userAgent"></h2>
14+
<ol id="qunit-tests"></ol>
15+
16+
<br/><br/><br/>
17+
<div id="container" style="width:600px; height:400px;"></div>
18+
19+
<script type="text/javascript" src="../../lib/qunit.js"></script>
20+
<script type="text/javascript" src="../../lib/jquery-1.11.2.min.js"></script>
21+
<script type="text/javascript" src="../../lib/jquery-ui-1.11.3.min.js"></script>
22+
<script type="text/javascript" src="../../lib/jquery.event.drag-2.3.0.js"></script>
23+
<script type="text/javascript" src="../../lib/qunit.js"></script>
24+
<script type="text/javascript">
25+
jQuery.noConflict();
26+
</script>
27+
<script type="text/javascript" src="../../slick.core.js"></script>
28+
<script type="text/javascript" src="../../slick.grid.js"></script>
29+
<script type="text/javascript" src="../../plugins/slick.cellrangedecorator.js"></script>
30+
<script type="text/javascript" src="../../plugins/slick.cellrangeselector.js"></script>
31+
<script type="text/javascript" src="../../plugins/slick.cellselectionmodel.js"></script>
32+
<script type="text/javascript" src="cellrangedecorator_spec.js"></script>
33+
34+
</body>
35+
</html>

‎tests/plugins/cellrangedecorator_spec.js‎

Lines changed: 96 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,96 @@
1+
(function ($) {
2+
3+
var grid, // The SlickGrid instance
4+
cols = [ // The column definitions
5+
{name: "Header", field: "header", width: 100},
6+
{name: "Another Header", field: "another-header", width: 100},
7+
{name: "Yet another header", field: "y-a-header", width: 100},
8+
],
9+
data = [], // The grid data
10+
$container = $("#container");
11+
12+
var $canvas, cellSelector, cellDecorator;
13+
14+
// Create data
15+
for (var i = 0; i < 10; i++) {
16+
data.push({
17+
"id": "row" + i,
18+
"header": "some data",
19+
"another-header": "more data",
20+
"y-a-header": "data data"
21+
});
22+
}
23+
24+
function setupGridWithValues() {
25+
var $testgrid = $('<div id="grid" />');
26+
$testgrid.height(600);
27+
28+
$("#container").append($testgrid);
29+
grid = new Slick.Grid("#grid", data, cols);
30+
cellDecorator = new Slick.CellRangeDecorator(grid, {
31+
offset: {
32+
top: 1,
33+
left: 1,
34+
height: 1,
35+
width: 1
36+
}
37+
});
38+
cellSelector = new Slick.CellRangeSelector({cellDecorator: cellDecorator});
39+
grid.setSelectionModel(new Slick.CellSelectionModel({cellRangeSelector: cellSelector}));
40+
grid.render();
41+
$canvas = $(".grid-canvas");
42+
}
43+
44+
function setupGridWithoutValues() {
45+
var $testgrid = $('<div id="grid" />');
46+
$testgrid.height(600);
47+
48+
$("#container").append($testgrid);
49+
grid = new Slick.Grid("#grid", data, cols);
50+
cellDecorator = new Slick.CellRangeDecorator(grid);
51+
cellSelector = new Slick.CellRangeSelector({cellDecorator: cellDecorator});
52+
grid.setSelectionModel(new Slick.CellSelectionModel({cellRangeSelector: cellSelector}));
53+
grid.render();
54+
$canvas = $(".grid-canvas");
55+
}
56+
57+
function teardownGrid() {
58+
$container.empty();
59+
}
60+
61+
module("plugins - cellrangemodel receives a prebuilt decorator -", {
62+
setup: function () {
63+
setupGridWithValues();
64+
},
65+
teardown: teardownGrid
66+
});
67+
68+
test("check the values passed on options are used", function () {
69+
var element = cellDecorator.show(new Slick.Range(1, 1, 2, 2));
70+
var resultCss = element[0].style;
71+
72+
deepEqual(resultCss.top, "26px", "CSS Property Top");
73+
deepEqual(resultCss.left, "101px", "CSS Property Left");
74+
deepEqual(resultCss.height, "50px", "CSS Property Height");
75+
deepEqual(resultCss.width, "201px", "CSS Property Width");
76+
});
77+
78+
module("plugins - cellrangemodel uses a default decorator -", {
79+
setup: function () {
80+
setupGridWithoutValues();
81+
},
82+
teardown: teardownGrid
83+
});
84+
85+
test("check the values passed on options are used", function () {
86+
var element = cellDecorator.show(new Slick.Range(1, 1, 2, 2));
87+
var resultCss = element[0].style;
88+
89+
deepEqual(resultCss.top, "24px", "CSS Property Top");
90+
deepEqual(resultCss.left, "99px", "CSS Property Left");
91+
deepEqual(resultCss.height, "47px", "CSS Property Height");
92+
deepEqual(resultCss.width, "198px", "CSS Property Width");
93+
});
94+
95+
96+
})(jQuery);

‎tests/plugins/cellrangeselector.html‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
<!DOCTYPE html>
22
<html>
33
<head>
4-
<title>SlickGrid - Cell Selection Model plugin tests</title>
4+
<title>SlickGrid - Cell Range Selector plugin tests</title>
55
<link rel="stylesheet" href="../../lib/qunit.css" type="text/css"/>
66
<link rel="stylesheet" href="../../slick.grid.css" type="text/css"/>
7-
<link rel="stylesheet" href="../../slick-default-theme.css" type="text/css" />
7+
<link rel="stylesheet" href="../../slick-default-theme.css" type="text/css"/>
88
</head>
99
<body>
10-
<h1 id="qunit-header">SlickGrid - Cell Selection Model Test Suite</h1>
10+
<h1 id="qunit-header">SlickGrid - Cell Range Selector Test Suite</h1>
1111
<h2 id="qunit-banner"></h2>
1212
<div id="qunit-testrunner-toolbar"></div>
1313
<h2 id="qunit-userAgent"></h2>

‎tests/plugins/cellrangeselector_spec.js‎

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
data = [], // The grid data
1010
$container = $("#container");
1111

12-
var $canvas, dragRangeContainer, cellSelector;
12+
var $canvas, cellSelector;
1313

1414
// Create data
1515
for (var i = 0; i < 10; i++) {
@@ -102,4 +102,17 @@
102102
grid.setSelectionModel(new Slick.CellSelectionModel({}));
103103
grid.render();
104104
});
105+
106+
module("plugins - cellrangeselector without options", {
107+
setup: function () {
108+
setupGrid();
109+
},
110+
teardown: teardownGrid
111+
});
112+
113+
test("constructs decorator correctly", function () {
114+
cellSelector.init(grid);
115+
notEqual(cellSelector.getCellDecorator(), undefined, "Grid Cell Decorator");
116+
cellSelector.destroy();
117+
});
105118
})(jQuery);

0 commit comments

Comments
 (0)