primo commit

This commit is contained in:
2024-12-17 17:34:10 +01:00
commit e650f8df99
16435 changed files with 2451012 additions and 0 deletions

View File

@ -0,0 +1,83 @@
(function ($) {
// Register namespace
$.extend(true, window, {
"Slick": {
"AutoTooltips": AutoTooltips
}
});
/**
* AutoTooltips plugin to show/hide tooltips when columns are too narrow to fit content.
* @constructor
* @param {boolean} [options.enableForCells=true] - Enable tooltip for grid cells
* @param {boolean} [options.enableForHeaderCells=false] - Enable tooltip for header cells
* @param {number} [options.maxToolTipLength=null] - The maximum length for a tooltip
*/
function AutoTooltips(options) {
var _grid;
var _self = this;
var _defaults = {
enableForCells: true,
enableForHeaderCells: false,
maxToolTipLength: null
};
/**
* Initialize plugin.
*/
function init(grid) {
options = $.extend(true, {}, _defaults, options);
_grid = grid;
if (options.enableForCells) _grid.onMouseEnter.subscribe(handleMouseEnter);
if (options.enableForHeaderCells) _grid.onHeaderMouseEnter.subscribe(handleHeaderMouseEnter);
}
/**
* Destroy plugin.
*/
function destroy() {
if (options.enableForCells) _grid.onMouseEnter.unsubscribe(handleMouseEnter);
if (options.enableForHeaderCells) _grid.onHeaderMouseEnter.unsubscribe(handleHeaderMouseEnter);
}
/**
* Handle mouse entering grid cell to add/remove tooltip.
* @param {jQuery.Event} e - The event
*/
function handleMouseEnter(e) {
var cell = _grid.getCellFromEvent(e);
if (cell) {
var $node = $(_grid.getCellNode(cell.row, cell.cell));
var text;
if ($node.innerWidth() < $node[0].scrollWidth) {
text = $.trim($node.text());
if (options.maxToolTipLength && text.length > options.maxToolTipLength) {
text = text.substr(0, options.maxToolTipLength - 3) + "...";
}
} else {
text = "";
}
$node.attr("title", text);
}
}
/**
* Handle mouse entering header cell to add/remove tooltip.
* @param {jQuery.Event} e - The event
* @param {object} args.column - The column definition
*/
function handleHeaderMouseEnter(e, args) {
var column = args.column,
$node = $(e.target).closest(".slick-header-column");
if (!column.toolTip) {
$node.attr("title", ($node.innerWidth() < $node[0].scrollWidth) ? column.name : "");
}
}
// Public API
$.extend(this, {
"init": init,
"destroy": destroy
});
}
})(jQuery);

View File

@ -0,0 +1,86 @@
(function ($) {
// register namespace
$.extend(true, window, {
"Slick": {
"CellCopyManager": CellCopyManager
}
});
function CellCopyManager() {
var _grid;
var _self = this;
var _copiedRanges;
function init(grid) {
_grid = grid;
_grid.onKeyDown.subscribe(handleKeyDown);
}
function destroy() {
_grid.onKeyDown.unsubscribe(handleKeyDown);
}
function handleKeyDown(e, args) {
var ranges;
if (!_grid.getEditorLock().isActive()) {
if (e.which == $.ui.keyCode.ESCAPE) {
if (_copiedRanges) {
e.preventDefault();
clearCopySelection();
_self.onCopyCancelled.notify({ranges: _copiedRanges});
_copiedRanges = null;
}
}
if (e.which == 67 && (e.ctrlKey || e.metaKey)) {
ranges = _grid.getSelectionModel().getSelectedRanges();
if (ranges.length != 0) {
e.preventDefault();
_copiedRanges = ranges;
markCopySelection(ranges);
_self.onCopyCells.notify({ranges: ranges});
}
}
if (e.which == 86 && (e.ctrlKey || e.metaKey)) {
if (_copiedRanges) {
e.preventDefault();
clearCopySelection();
ranges = _grid.getSelectionModel().getSelectedRanges();
_self.onPasteCells.notify({from: _copiedRanges, to: ranges});
_copiedRanges = null;
}
}
}
}
function markCopySelection(ranges) {
var columns = _grid.getColumns();
var hash = {};
for (var i = 0; i < ranges.length; i++) {
for (var j = ranges[i].fromRow; j <= ranges[i].toRow; j++) {
hash[j] = {};
for (var k = ranges[i].fromCell; k <= ranges[i].toCell; k++) {
hash[j][columns[k].id] = "copied";
}
}
}
_grid.setCellCssStyles("copy-manager", hash);
}
function clearCopySelection() {
_grid.removeCellCssStyles("copy-manager");
}
$.extend(this, {
"init": init,
"destroy": destroy,
"clearCopySelection": clearCopySelection,
"onCopyCells": new Slick.Event(),
"onCopyCancelled": new Slick.Event(),
"onPasteCells": new Slick.Event()
});
}
})(jQuery);

View File

@ -0,0 +1,66 @@
(function ($) {
// register namespace
$.extend(true, window, {
"Slick": {
"CellRangeDecorator": CellRangeDecorator
}
});
/***
* Displays an overlay on top of a given cell range.
*
* TODO:
* Currently, it blocks mouse events to DOM nodes behind it.
* Use FF and WebKit-specific "pointer-events" CSS style, or some kind of event forwarding.
* Could also construct the borders separately using 4 individual DIVs.
*
* @param {Grid} grid
* @param {Object} options
*/
function CellRangeDecorator(grid, options) {
var _elem;
var _defaults = {
selectionCssClass: 'slick-range-decorator',
selectionCss: {
"zIndex": "9999",
"border": "2px dashed red"
}
};
options = $.extend(true, {}, _defaults, options);
function show(range) {
if (!_elem) {
_elem = $("<div></div>", {css: options.selectionCss})
.addClass(options.selectionCssClass)
.css("position", "absolute")
.appendTo(grid.getCanvasNode());
}
var from = grid.getCellNodeBox(range.fromRow, range.fromCell);
var to = grid.getCellNodeBox(range.toRow, range.toCell);
_elem.css({
top: from.top - 1,
left: from.left - 1,
height: to.bottom - from.top - 2,
width: to.right - from.left - 2
});
return _elem;
}
function hide() {
if (_elem) {
_elem.remove();
_elem = null;
}
}
$.extend(this, {
"show": show,
"hide": hide
});
}
})(jQuery);

View File

@ -0,0 +1,113 @@
(function ($) {
// register namespace
$.extend(true, window, {
"Slick": {
"CellRangeSelector": CellRangeSelector
}
});
function CellRangeSelector(options) {
var _grid;
var _canvas;
var _dragging;
var _decorator;
var _self = this;
var _handler = new Slick.EventHandler();
var _defaults = {
selectionCss: {
"border": "2px dashed blue"
}
};
function init(grid) {
options = $.extend(true, {}, _defaults, options);
_decorator = new Slick.CellRangeDecorator(grid, options);
_grid = grid;
_canvas = _grid.getCanvasNode();
_handler
.subscribe(_grid.onDragInit, handleDragInit)
.subscribe(_grid.onDragStart, handleDragStart)
.subscribe(_grid.onDrag, handleDrag)
.subscribe(_grid.onDragEnd, handleDragEnd);
}
function destroy() {
_handler.unsubscribeAll();
}
function handleDragInit(e, dd) {
// prevent the grid from cancelling drag'n'drop by default
e.stopImmediatePropagation();
}
function handleDragStart(e, dd) {
var cell = _grid.getCellFromEvent(e);
if (_self.onBeforeCellRangeSelected.notify(cell) !== false) {
if (_grid.canCellBeSelected(cell.row, cell.cell)) {
_dragging = true;
e.stopImmediatePropagation();
}
}
if (!_dragging) {
return;
}
_grid.focus();
var start = _grid.getCellFromPoint(
dd.startX - $(_canvas).offset().left,
dd.startY - $(_canvas).offset().top);
dd.range = {start: start, end: {}};
return _decorator.show(new Slick.Range(start.row, start.cell));
}
function handleDrag(e, dd) {
if (!_dragging) {
return;
}
e.stopImmediatePropagation();
var end = _grid.getCellFromPoint(
e.pageX - $(_canvas).offset().left,
e.pageY - $(_canvas).offset().top);
if (!_grid.canCellBeSelected(end.row, end.cell)) {
return;
}
dd.range.end = end;
_decorator.show(new Slick.Range(dd.range.start.row, dd.range.start.cell, end.row, end.cell));
}
function handleDragEnd(e, dd) {
if (!_dragging) {
return;
}
_dragging = false;
e.stopImmediatePropagation();
_decorator.hide();
_self.onCellRangeSelected.notify({
range: new Slick.Range(
dd.range.start.row,
dd.range.start.cell,
dd.range.end.row,
dd.range.end.cell
)
});
}
$.extend(this, {
"init": init,
"destroy": destroy,
"onBeforeCellRangeSelected": new Slick.Event(),
"onCellRangeSelected": new Slick.Event()
});
}
})(jQuery);

View File

@ -0,0 +1,154 @@
(function ($) {
// register namespace
$.extend(true, window, {
"Slick": {
"CellSelectionModel": CellSelectionModel
}
});
function CellSelectionModel(options) {
var _grid;
var _canvas;
var _ranges = [];
var _self = this;
var _selector = new Slick.CellRangeSelector({
"selectionCss": {
"border": "2px solid black"
}
});
var _options;
var _defaults = {
selectActiveCell: true
};
function init(grid) {
_options = $.extend(true, {}, _defaults, options);
_grid = grid;
_canvas = _grid.getCanvasNode();
_grid.onActiveCellChanged.subscribe(handleActiveCellChange);
_grid.onKeyDown.subscribe(handleKeyDown);
grid.registerPlugin(_selector);
_selector.onCellRangeSelected.subscribe(handleCellRangeSelected);
_selector.onBeforeCellRangeSelected.subscribe(handleBeforeCellRangeSelected);
}
function destroy() {
_grid.onActiveCellChanged.unsubscribe(handleActiveCellChange);
_grid.onKeyDown.unsubscribe(handleKeyDown);
_selector.onCellRangeSelected.unsubscribe(handleCellRangeSelected);
_selector.onBeforeCellRangeSelected.unsubscribe(handleBeforeCellRangeSelected);
_grid.unregisterPlugin(_selector);
}
function removeInvalidRanges(ranges) {
var result = [];
for (var i = 0; i < ranges.length; i++) {
var r = ranges[i];
if (_grid.canCellBeSelected(r.fromRow, r.fromCell) && _grid.canCellBeSelected(r.toRow, r.toCell)) {
result.push(r);
}
}
return result;
}
function setSelectedRanges(ranges) {
_ranges = removeInvalidRanges(ranges);
_self.onSelectedRangesChanged.notify(_ranges);
}
function getSelectedRanges() {
return _ranges;
}
function handleBeforeCellRangeSelected(e, args) {
if (_grid.getEditorLock().isActive()) {
e.stopPropagation();
return false;
}
}
function handleCellRangeSelected(e, args) {
setSelectedRanges([args.range]);
}
function handleActiveCellChange(e, args) {
if (_options.selectActiveCell && args.row != null && args.cell != null) {
setSelectedRanges([new Slick.Range(args.row, args.cell)]);
}
}
function handleKeyDown(e) {
/***
* Кey codes
* 37 left
* 38 up
* 39 right
* 40 down
*/
var ranges, last;
var active = _grid.getActiveCell();
if ( active && e.shiftKey && !e.ctrlKey && !e.altKey &&
(e.which == 37 || e.which == 39 || e.which == 38 || e.which == 40) ) {
ranges = getSelectedRanges();
if (!ranges.length)
ranges.push(new Slick.Range(active.row, active.cell));
// keyboard can work with last range only
last = ranges.pop();
// can't handle selection out of active cell
if (!last.contains(active.row, active.cell))
last = new Slick.Range(active.row, active.cell);
var dRow = last.toRow - last.fromRow,
dCell = last.toCell - last.fromCell,
// walking direction
dirRow = active.row == last.fromRow ? 1 : -1,
dirCell = active.cell == last.fromCell ? 1 : -1;
if (e.which == 37) {
dCell -= dirCell;
} else if (e.which == 39) {
dCell += dirCell ;
} else if (e.which == 38) {
dRow -= dirRow;
} else if (e.which == 40) {
dRow += dirRow;
}
// define new selection range
var new_last = new Slick.Range(active.row, active.cell, active.row + dirRow*dRow, active.cell + dirCell*dCell);
if (removeInvalidRanges([new_last]).length) {
ranges.push(new_last);
var viewRow = dirRow > 0 ? new_last.toRow : new_last.fromRow;
var viewCell = dirCell > 0 ? new_last.toCell : new_last.fromCell;
_grid.scrollRowIntoView(viewRow);
_grid.scrollCellIntoView(viewRow, viewCell);
}
else
ranges.push(last);
setSelectedRanges(ranges);
e.preventDefault();
e.stopPropagation();
}
}
$.extend(this, {
"getSelectedRanges": getSelectedRanges,
"setSelectedRanges": setSelectedRanges,
"init": init,
"destroy": destroy,
"onSelectedRangesChanged": new Slick.Event()
});
}
})(jQuery);

View File

@ -0,0 +1,153 @@
(function ($) {
// register namespace
$.extend(true, window, {
"Slick": {
"CheckboxSelectColumn": CheckboxSelectColumn
}
});
function CheckboxSelectColumn(options) {
var _grid;
var _self = this;
var _handler = new Slick.EventHandler();
var _selectedRowsLookup = {};
var _defaults = {
columnId: "_checkbox_selector",
cssClass: null,
toolTip: "Select/Deselect All",
width: 30
};
var _options = $.extend(true, {}, _defaults, options);
function init(grid) {
_grid = grid;
_handler
.subscribe(_grid.onSelectedRowsChanged, handleSelectedRowsChanged)
.subscribe(_grid.onClick, handleClick)
.subscribe(_grid.onHeaderClick, handleHeaderClick)
.subscribe(_grid.onKeyDown, handleKeyDown);
}
function destroy() {
_handler.unsubscribeAll();
}
function handleSelectedRowsChanged(e, args) {
var selectedRows = _grid.getSelectedRows();
var lookup = {}, row, i;
for (i = 0; i < selectedRows.length; i++) {
row = selectedRows[i];
lookup[row] = true;
if (lookup[row] !== _selectedRowsLookup[row]) {
_grid.invalidateRow(row);
delete _selectedRowsLookup[row];
}
}
for (i in _selectedRowsLookup) {
_grid.invalidateRow(i);
}
_selectedRowsLookup = lookup;
_grid.render();
if (selectedRows.length && selectedRows.length == _grid.getDataLength()) {
_grid.updateColumnHeader(_options.columnId, "<input type='checkbox' checked='checked'>", _options.toolTip);
} else {
_grid.updateColumnHeader(_options.columnId, "<input type='checkbox'>", _options.toolTip);
}
}
function handleKeyDown(e, args) {
if (e.which == 32) {
if (_grid.getColumns()[args.cell].id === _options.columnId) {
// if editing, try to commit
if (!_grid.getEditorLock().isActive() || _grid.getEditorLock().commitCurrentEdit()) {
toggleRowSelection(args.row);
}
e.preventDefault();
e.stopImmediatePropagation();
}
}
}
function handleClick(e, args) {
// clicking on a row select checkbox
if (_grid.getColumns()[args.cell].id === _options.columnId && $(e.target).is(":checkbox")) {
// if editing, try to commit
if (_grid.getEditorLock().isActive() && !_grid.getEditorLock().commitCurrentEdit()) {
e.preventDefault();
e.stopImmediatePropagation();
return;
}
toggleRowSelection(args.row);
e.stopPropagation();
e.stopImmediatePropagation();
}
}
function toggleRowSelection(row) {
if (_selectedRowsLookup[row]) {
_grid.setSelectedRows($.grep(_grid.getSelectedRows(), function (n) {
return n != row
}));
} else {
_grid.setSelectedRows(_grid.getSelectedRows().concat(row));
}
}
function handleHeaderClick(e, args) {
if (args.column.id == _options.columnId && $(e.target).is(":checkbox")) {
// if editing, try to commit
if (_grid.getEditorLock().isActive() && !_grid.getEditorLock().commitCurrentEdit()) {
e.preventDefault();
e.stopImmediatePropagation();
return;
}
if ($(e.target).is(":checked")) {
var rows = [];
for (var i = 0; i < _grid.getDataLength(); i++) {
rows.push(i);
}
_grid.setSelectedRows(rows);
} else {
_grid.setSelectedRows([]);
}
e.stopPropagation();
e.stopImmediatePropagation();
}
}
function getColumnDefinition() {
return {
id: _options.columnId,
name: "<input type='checkbox'>",
toolTip: _options.toolTip,
field: "sel",
width: _options.width,
resizable: false,
sortable: false,
cssClass: _options.cssClass,
formatter: checkboxSelectionFormatter
};
}
function checkboxSelectionFormatter(row, cell, value, columnDef, dataContext) {
if (dataContext) {
return _selectedRowsLookup[row]
? "<input type='checkbox' checked='checked'>"
: "<input type='checkbox'>";
}
return null;
}
$.extend(this, {
"init": init,
"destroy": destroy,
"getColumnDefinition": getColumnDefinition
});
}
})(jQuery);

View File

@ -0,0 +1,39 @@
.slick-column-name,
.slick-sort-indicator {
/**
* This makes all "float:right" elements after it that spill over to the next line
* display way below the lower boundary of the column thus hiding them.
*/
display: inline-block;
float: left;
margin-bottom: 100px;
}
.slick-header-button {
display: inline-block;
float: right;
vertical-align: top;
margin: 1px;
/**
* This makes all "float:right" elements after it that spill over to the next line
* display way below the lower boundary of the column thus hiding them.
*/
margin-bottom: 100px;
height: 15px;
width: 15px;
background-repeat: no-repeat;
background-position: center center;
cursor: pointer;
}
.slick-header-button-hidden {
width: 0;
-webkit-transition: 0.2s width;
-ms-transition: 0.2s width;
transition: 0.2s width;
}
.slick-header-column:hover > .slick-header-button {
width: 15px;
}

View File

@ -0,0 +1,177 @@
(function ($) {
// register namespace
$.extend(true, window, {
"Slick": {
"Plugins": {
"HeaderButtons": HeaderButtons
}
}
});
/***
* A plugin to add custom buttons to column headers.
*
* USAGE:
*
* Add the plugin .js & .css files and register it with the grid.
*
* To specify a custom button in a column header, extend the column definition like so:
*
* var columns = [
* {
* id: 'myColumn',
* name: 'My column',
*
* // This is the relevant part
* header: {
* buttons: [
* {
* // button options
* },
* {
* // button options
* }
* ]
* }
* }
* ];
*
* Available button options:
* cssClass: CSS class to add to the button.
* image: Relative button image path.
* tooltip: Button tooltip.
* showOnHover: Only show the button on hover.
* handler: Button click handler.
* command: A command identifier to be passed to the onCommand event handlers.
*
* The plugin exposes the following events:
* onCommand: Fired on button click for buttons with 'command' specified.
* Event args:
* grid: Reference to the grid.
* column: Column definition.
* command: Button command identified.
* button: Button options. Note that you can change the button options in your
* event handler, and the column header will be automatically updated to
* reflect them. This is useful if you want to implement something like a
* toggle button.
*
*
* @param options {Object} Options:
* buttonCssClass: a CSS class to use for buttons (default 'slick-header-button')
* @class Slick.Plugins.HeaderButtons
* @constructor
*/
function HeaderButtons(options) {
var _grid;
var _self = this;
var _handler = new Slick.EventHandler();
var _defaults = {
buttonCssClass: "slick-header-button"
};
function init(grid) {
options = $.extend(true, {}, _defaults, options);
_grid = grid;
_handler
.subscribe(_grid.onHeaderCellRendered, handleHeaderCellRendered)
.subscribe(_grid.onBeforeHeaderCellDestroy, handleBeforeHeaderCellDestroy);
// Force the grid to re-render the header now that the events are hooked up.
_grid.setColumns(_grid.getColumns());
}
function destroy() {
_handler.unsubscribeAll();
}
function handleHeaderCellRendered(e, args) {
var column = args.column;
if (column.header && column.header.buttons) {
// Append buttons in reverse order since they are floated to the right.
var i = column.header.buttons.length;
while (i--) {
var button = column.header.buttons[i];
var btn = $("<div></div>")
.addClass(options.buttonCssClass)
.data("column", column)
.data("button", button);
if (button.showOnHover) {
btn.addClass("slick-header-button-hidden");
}
if (button.image) {
btn.css("backgroundImage", "url(" + button.image + ")");
}
if (button.cssClass) {
btn.addClass(button.cssClass);
}
if (button.tooltip) {
btn.attr("title", button.tooltip);
}
if (button.command) {
btn.data("command", button.command);
}
if (button.handler) {
btn.bind("click", button.handler);
}
btn
.bind("click", handleButtonClick)
.appendTo(args.node);
}
}
}
function handleBeforeHeaderCellDestroy(e, args) {
var column = args.column;
if (column.header && column.header.buttons) {
// Removing buttons via jQuery will also clean up any event handlers and data.
// NOTE: If you attach event handlers directly or using a different framework,
// you must also clean them up here to avoid memory leaks.
$(args.node).find("." + options.buttonCssClass).remove();
}
}
function handleButtonClick(e) {
var command = $(this).data("command");
var columnDef = $(this).data("column");
var button = $(this).data("button");
if (command != null) {
_self.onCommand.notify({
"grid": _grid,
"column": columnDef,
"command": command,
"button": button
}, e, _self);
// Update the header in case the user updated the button definition in the handler.
_grid.updateColumnHeader(columnDef.id);
}
// Stop propagation so that it doesn't register as a header click event.
e.preventDefault();
e.stopPropagation();
}
$.extend(this, {
"init": init,
"destroy": destroy,
"onCommand": new Slick.Event()
});
}
})(jQuery);

View File

@ -0,0 +1,59 @@
/* Menu button */
.slick-header-menubutton {
position: absolute;
right: 0;
top: 0;
bottom: 0;
width: 14px;
background-repeat: no-repeat;
background-position: left center;
background-image: url(../images/down.gif);
cursor: pointer;
display: none;
border-left: thin ridge silver;
}
.slick-header-column:hover > .slick-header-menubutton,
.slick-header-column-active .slick-header-menubutton {
display: inline-block;
}
/* Menu */
.slick-header-menu {
position: absolute;
display: inline-block;
margin: 0;
padding: 2px;
cursor: default;
}
/* Menu items */
.slick-header-menuitem {
list-style: none;
margin: 0;
padding: 0;
cursor: pointer;
}
.slick-header-menuicon {
display: inline-block;
width: 16px;
height: 16px;
vertical-align: middle;
margin-right: 4px;
background-repeat: no-repeat;
background-position: center center;
}
.slick-header-menucontent {
display: inline-block;
vertical-align: middle;
}
/* Disabled */
.slick-header-menuitem-disabled {
color: silver;
}

View File

@ -0,0 +1,275 @@
(function ($) {
// register namespace
$.extend(true, window, {
"Slick": {
"Plugins": {
"HeaderMenu": HeaderMenu
}
}
});
/***
* A plugin to add drop-down menus to column headers.
*
* USAGE:
*
* Add the plugin .js & .css files and register it with the grid.
*
* To specify a menu in a column header, extend the column definition like so:
*
* var columns = [
* {
* id: 'myColumn',
* name: 'My column',
*
* // This is the relevant part
* header: {
* menu: {
* items: [
* {
* // menu item options
* },
* {
* // menu item options
* }
* ]
* }
* }
* }
* ];
*
*
* Available menu options:
* tooltip: Menu button tooltip.
*
*
* Available menu item options:
* title: Menu item text.
* disabled: Whether the item is disabled.
* tooltip: Item tooltip.
* command: A command identifier to be passed to the onCommand event handlers.
* iconCssClass: A CSS class to be added to the menu item icon.
* iconImage: A url to the icon image.
*
*
* The plugin exposes the following events:
* onBeforeMenuShow: Fired before the menu is shown. You can customize the menu or dismiss it by returning false.
* Event args:
* grid: Reference to the grid.
* column: Column definition.
* menu: Menu options. Note that you can change the menu items here.
*
* onCommand: Fired on menu item click for buttons with 'command' specified.
* Event args:
* grid: Reference to the grid.
* column: Column definition.
* command: Button command identified.
* button: Button options. Note that you can change the button options in your
* event handler, and the column header will be automatically updated to
* reflect them. This is useful if you want to implement something like a
* toggle button.
*
*
* @param options {Object} Options:
* buttonCssClass: an extra CSS class to add to the menu button
* buttonImage: a url to the menu button image (default '../images/down.gif')
* @class Slick.Plugins.HeaderButtons
* @constructor
*/
function HeaderMenu(options) {
var _grid;
var _self = this;
var _handler = new Slick.EventHandler();
var _defaults = {
buttonCssClass: null,
buttonImage: null
};
var $menu;
var $activeHeaderColumn;
function init(grid) {
options = $.extend(true, {}, _defaults, options);
_grid = grid;
_handler
.subscribe(_grid.onHeaderCellRendered, handleHeaderCellRendered)
.subscribe(_grid.onBeforeHeaderCellDestroy, handleBeforeHeaderCellDestroy);
// Force the grid to re-render the header now that the events are hooked up.
_grid.setColumns(_grid.getColumns());
// Hide the menu on outside click.
$(document.body).bind("mousedown", handleBodyMouseDown);
}
function destroy() {
_handler.unsubscribeAll();
$(document.body).unbind("mousedown", handleBodyMouseDown);
}
function handleBodyMouseDown(e) {
if ($menu && $menu[0] != e.target && !$.contains($menu[0], e.target)) {
hideMenu();
}
}
function hideMenu() {
if ($menu) {
$menu.remove();
$menu = null;
$activeHeaderColumn
.removeClass("slick-header-column-active");
}
}
function handleHeaderCellRendered(e, args) {
var column = args.column;
var menu = column.header && column.header.menu;
if (menu) {
var $el = $("<div></div>")
.addClass("slick-header-menubutton")
.data("column", column)
.data("menu", menu);
if (options.buttonCssClass) {
$el.addClass(options.buttonCssClass);
}
if (options.buttonImage) {
$el.css("background-image", "url(" + options.buttonImage + ")");
}
if (menu.tooltip) {
$el.attr("title", menu.tooltip);
}
$el
.bind("click", showMenu)
.appendTo(args.node);
}
}
function handleBeforeHeaderCellDestroy(e, args) {
var column = args.column;
if (column.header && column.header.menu) {
$(args.node).find(".slick-header-menubutton").remove();
}
}
function showMenu(e) {
var $menuButton = $(this);
var menu = $menuButton.data("menu");
var columnDef = $menuButton.data("column");
// Let the user modify the menu or cancel altogether,
// or provide alternative menu implementation.
if (_self.onBeforeMenuShow.notify({
"grid": _grid,
"column": columnDef,
"menu": menu
}, e, _self) == false) {
return;
}
if (!$menu) {
$menu = $("<div class='slick-header-menu'></div>")
.appendTo(_grid.getContainerNode());
}
$menu.empty();
// Construct the menu items.
for (var i = 0; i < menu.items.length; i++) {
var item = menu.items[i];
var $li = $("<div class='slick-header-menuitem'></div>")
.data("command", item.command || '')
.data("column", columnDef)
.data("item", item)
.bind("click", handleMenuItemClick)
.appendTo($menu);
if (item.disabled) {
$li.addClass("slick-header-menuitem-disabled");
}
if (item.tooltip) {
$li.attr("title", item.tooltip);
}
var $icon = $("<div class='slick-header-menuicon'></div>")
.appendTo($li);
if (item.iconCssClass) {
$icon.addClass(item.iconCssClass);
}
if (item.iconImage) {
$icon.css("background-image", "url(" + item.iconImage + ")");
}
$("<span class='slick-header-menucontent'></span>")
.text(item.title)
.appendTo($li);
}
// Position the menu.
$menu
.offset({ top: $(this).offset().top + $(this).height(), left: $(this).offset().left });
// Mark the header as active to keep the highlighting.
$activeHeaderColumn = $menuButton.closest(".slick-header-column");
$activeHeaderColumn
.addClass("slick-header-column-active");
// Stop propagation so that it doesn't register as a header click event.
e.preventDefault();
e.stopPropagation();
}
function handleMenuItemClick(e) {
var command = $(this).data("command");
var columnDef = $(this).data("column");
var item = $(this).data("item");
if (item.disabled) {
return;
}
hideMenu();
if (command != null && command != '') {
_self.onCommand.notify({
"grid": _grid,
"column": columnDef,
"command": command,
"item": item
}, e, _self);
}
// Stop propagation so that it doesn't register as a header click event.
e.preventDefault();
e.stopPropagation();
}
$.extend(this, {
"init": init,
"destroy": destroy,
"onBeforeMenuShow": new Slick.Event(),
"onCommand": new Slick.Event()
});
}
})(jQuery);

View File

@ -0,0 +1,138 @@
(function ($) {
// register namespace
$.extend(true, window, {
"Slick": {
"RowMoveManager": RowMoveManager
}
});
function RowMoveManager(options) {
var _grid;
var _canvas;
var _dragging;
var _self = this;
var _handler = new Slick.EventHandler();
var _defaults = {
cancelEditOnDrag: false
};
function init(grid) {
options = $.extend(true, {}, _defaults, options);
_grid = grid;
_canvas = _grid.getCanvasNode();
_handler
.subscribe(_grid.onDragInit, handleDragInit)
.subscribe(_grid.onDragStart, handleDragStart)
.subscribe(_grid.onDrag, handleDrag)
.subscribe(_grid.onDragEnd, handleDragEnd);
}
function destroy() {
_handler.unsubscribeAll();
}
function handleDragInit(e, dd) {
// prevent the grid from cancelling drag'n'drop by default
e.stopImmediatePropagation();
}
function handleDragStart(e, dd) {
var cell = _grid.getCellFromEvent(e);
if (options.cancelEditOnDrag && _grid.getEditorLock().isActive()) {
_grid.getEditorLock().cancelCurrentEdit();
}
if (_grid.getEditorLock().isActive() || !/move|selectAndMove/.test(_grid.getColumns()[cell.cell].behavior)) {
return false;
}
_dragging = true;
e.stopImmediatePropagation();
var selectedRows = _grid.getSelectedRows();
if (selectedRows.length == 0 || $.inArray(cell.row, selectedRows) == -1) {
selectedRows = [cell.row];
_grid.setSelectedRows(selectedRows);
}
var rowHeight = _grid.getOptions().rowHeight;
dd.selectedRows = selectedRows;
dd.selectionProxy = $("<div class='slick-reorder-proxy'/>")
.css("position", "absolute")
.css("zIndex", "99999")
.css("width", $(_canvas).innerWidth())
.css("height", rowHeight * selectedRows.length)
.appendTo(_canvas);
dd.guide = $("<div class='slick-reorder-guide'/>")
.css("position", "absolute")
.css("zIndex", "99998")
.css("width", $(_canvas).innerWidth())
.css("top", -1000)
.appendTo(_canvas);
dd.insertBefore = -1;
}
function handleDrag(e, dd) {
if (!_dragging) {
return;
}
e.stopImmediatePropagation();
var top = e.pageY - $(_canvas).offset().top;
dd.selectionProxy.css("top", top - 5);
var insertBefore = Math.max(0, Math.min(Math.round(top / _grid.getOptions().rowHeight), _grid.getDataLength()));
if (insertBefore !== dd.insertBefore) {
var eventData = {
"rows": dd.selectedRows,
"insertBefore": insertBefore
};
if (_self.onBeforeMoveRows.notify(eventData) === false) {
dd.guide.css("top", -1000);
dd.canMove = false;
} else {
dd.guide.css("top", insertBefore * _grid.getOptions().rowHeight);
dd.canMove = true;
}
dd.insertBefore = insertBefore;
}
}
function handleDragEnd(e, dd) {
if (!_dragging) {
return;
}
_dragging = false;
e.stopImmediatePropagation();
dd.guide.remove();
dd.selectionProxy.remove();
if (dd.canMove) {
var eventData = {
"rows": dd.selectedRows,
"insertBefore": dd.insertBefore
};
// TODO: _grid.remapCellCssClasses ?
_self.onMoveRows.notify(eventData);
}
}
$.extend(this, {
"onBeforeMoveRows": new Slick.Event(),
"onMoveRows": new Slick.Event(),
"init": init,
"destroy": destroy
});
}
})(jQuery);

View File

@ -0,0 +1,187 @@
(function ($) {
// register namespace
$.extend(true, window, {
"Slick": {
"RowSelectionModel": RowSelectionModel
}
});
function RowSelectionModel(options) {
var _grid;
var _ranges = [];
var _self = this;
var _handler = new Slick.EventHandler();
var _inHandler;
var _options;
var _defaults = {
selectActiveRow: true
};
function init(grid) {
_options = $.extend(true, {}, _defaults, options);
_grid = grid;
_handler.subscribe(_grid.onActiveCellChanged,
wrapHandler(handleActiveCellChange));
_handler.subscribe(_grid.onKeyDown,
wrapHandler(handleKeyDown));
_handler.subscribe(_grid.onClick,
wrapHandler(handleClick));
}
function destroy() {
_handler.unsubscribeAll();
}
function wrapHandler(handler) {
return function () {
if (!_inHandler) {
_inHandler = true;
handler.apply(this, arguments);
_inHandler = false;
}
};
}
function rangesToRows(ranges) {
var rows = [];
for (var i = 0; i < ranges.length; i++) {
for (var j = ranges[i].fromRow; j <= ranges[i].toRow; j++) {
rows.push(j);
}
}
return rows;
}
function rowsToRanges(rows) {
var ranges = [];
var lastCell = _grid.getColumns().length - 1;
for (var i = 0; i < rows.length; i++) {
ranges.push(new Slick.Range(rows[i], 0, rows[i], lastCell));
}
return ranges;
}
function getRowsRange(from, to) {
var i, rows = [];
for (i = from; i <= to; i++) {
rows.push(i);
}
for (i = to; i < from; i++) {
rows.push(i);
}
return rows;
}
function getSelectedRows() {
return rangesToRows(_ranges);
}
function setSelectedRows(rows) {
setSelectedRanges(rowsToRanges(rows));
}
function setSelectedRanges(ranges) {
_ranges = ranges;
_self.onSelectedRangesChanged.notify(_ranges);
}
function getSelectedRanges() {
return _ranges;
}
function handleActiveCellChange(e, data) {
if (_options.selectActiveRow && data.row != null) {
setSelectedRanges([new Slick.Range(data.row, 0, data.row, _grid.getColumns().length - 1)]);
}
}
function handleKeyDown(e) {
var activeRow = _grid.getActiveCell();
if (activeRow && e.shiftKey && !e.ctrlKey && !e.altKey && !e.metaKey && (e.which == 38 || e.which == 40)) {
var selectedRows = getSelectedRows();
selectedRows.sort(function (x, y) {
return x - y
});
if (!selectedRows.length) {
selectedRows = [activeRow.row];
}
var top = selectedRows[0];
var bottom = selectedRows[selectedRows.length - 1];
var active;
if (e.which == 40) {
active = activeRow.row < bottom || top == bottom ? ++bottom : ++top;
} else {
active = activeRow.row < bottom ? --bottom : --top;
}
if (active >= 0 && active < _grid.getDataLength()) {
_grid.scrollRowIntoView(active);
_ranges = rowsToRanges(getRowsRange(top, bottom));
setSelectedRanges(_ranges);
}
e.preventDefault();
e.stopPropagation();
}
}
function handleClick(e) {
var cell = _grid.getCellFromEvent(e);
if (!cell || !_grid.canCellBeActive(cell.row, cell.cell)) {
return false;
}
if (!_grid.getOptions().multiSelect || (
!e.ctrlKey && !e.shiftKey && !e.metaKey)) {
return false;
}
var selection = rangesToRows(_ranges);
var idx = $.inArray(cell.row, selection);
if (idx === -1 && (e.ctrlKey || e.metaKey)) {
selection.push(cell.row);
_grid.setActiveCell(cell.row, cell.cell);
} else if (idx !== -1 && (e.ctrlKey || e.metaKey)) {
selection = $.grep(selection, function (o, i) {
return (o !== cell.row);
});
_grid.setActiveCell(cell.row, cell.cell);
} else if (selection.length && e.shiftKey) {
var last = selection.pop();
var from = Math.min(cell.row, last);
var to = Math.max(cell.row, last);
selection = [];
for (var i = from; i <= to; i++) {
if (i !== last) {
selection.push(i);
}
}
selection.push(last);
_grid.setActiveCell(cell.row, cell.cell);
}
_ranges = rowsToRanges(selection);
setSelectedRanges(_ranges);
e.stopImmediatePropagation();
return true;
}
$.extend(this, {
"getSelectedRows": getSelectedRows,
"setSelectedRows": setSelectedRows,
"getSelectedRanges": getSelectedRanges,
"setSelectedRanges": setSelectedRanges,
"init": init,
"destroy": destroy,
"onSelectedRangesChanged": new Slick.Event()
});
}
})(jQuery);