Skip to content

Commit

Permalink
Merge branch 'feature/mergedCustomHeaderRendererCellFunctionsGetters'…
Browse files Browse the repository at this point in the history 
… into develop
  • Loading branch information
@warpech
warpech committed Nov 18, 2013
2 parents 4107d88 + ea94ac2 commit 3151685
Show file tree
Hide file tree
Showing 16 changed files with 850 additions and 174 deletions.
492 changes: 492 additions & 0 deletions demo/js/jquery.ui.position.js
View file

Large diffs are not rendered by default.

168 changes: 102 additions & 66 deletions demo/renderers_html.html
View file
Expand Up @@ -12,6 +12,7 @@
<link data-jsfiddle="common" rel="stylesheet" media="screen" href="../dist/jquery.handsontable.full.css"> <link data-jsfiddle="common" rel="stylesheet" media="screen" href="../dist/jquery.handsontable.full.css">
<!-- the below is only needed for DateCell (uses jQuery UI Datepicker) --> <!-- the below is only needed for DateCell (uses jQuery UI Datepicker) -->
<script data-jsfiddle="common" src="../lib/jquery-ui/js/jquery-ui.custom.min.js"></script> <script data-jsfiddle="common" src="../lib/jquery-ui/js/jquery-ui.custom.min.js"></script>
<script data-jsfiddle="common" src="js/jquery.ui.position.js"></script>
<link data-jsfiddle="common" rel="stylesheet" media="screen" <link data-jsfiddle="common" rel="stylesheet" media="screen"
href="../lib/jquery-ui/css/ui-bootstrap/jquery-ui.custom.css"> href="../lib/jquery-ui/css/ui-bootstrap/jquery-ui.custom.css">


Expand Down Expand Up @@ -274,12 +275,13 @@ <h2>Changing cell type from a dropdown menu in cell header</h2>
.changeType { .changeType {
border: 1px solid #bbb; border: 1px solid #bbb;
color: #bbb; color: #bbb;
background: #eee;
border-radius: 2px; border-radius: 2px;
padding: 2px; padding: 2px;
font-size: 9px; font-size: 9px;


float: right; float: right;
line-height: 12px; line-height: 9px;
margin: 3px 3px 0 0; margin: 3px 3px 0 0;
} }


Expand All @@ -292,95 +294,99 @@ <h2>Changing cell type from a dropdown menu in cell header</h2>
.changeType.pressed { .changeType.pressed {
background-color: #999; background-color: #999;
} }
</style>


<script data-jsfiddle="example3"> .changeTypeMenu {
//TODO fix the colHeader menu demo. I commented it out because it caused exceptions since 0.10.0-beta3 position: absolute;
/* border: 1px solid #ccc;
var HOT margin-top: 18px;
, changeCol box-shadow: 0 1px 3px -1px #323232;
, columns = [ background: white;
{type: 'numeric'}, padding: 0;
{type: 'numeric'}, display: none;
{type: 'numeric'}, z-index: 10;
{type: 'numeric'},
{type: 'numeric'},
{type: 'numeric'}
];
function contextMenuItem(name, value) {
return {name: name, type: "radio", radio: "typeRadio", value: value, events: {
change: function () {
$(this).trigger('contextmenu:hide');
}
}};
} }


$.contextMenu({ .changeTypeMenu li{
selector: '.changeType', text-align: left;
items: { list-style: none;
"text": contextMenuItem("Text", "text"), padding: 2px 20px;
"numeric": contextMenuItem("Numeric", "numeric"), cursor: pointer;
"date": contextMenuItem("Date", "date") }
},
events: {
show: function (opt) {
$.contextMenu.setInputValues(opt, {typeRadio: getColumnType(changeCol)});
},
hide: function (opt) {
var values = $.contextMenu.getInputValues(opt);
setColumnType(changeCol, values.typeRadio);
}
}
});


function getColumnType(i) { .changeTypeMenu li.active:before {
return columns[i].type; content: "\2714";
margin-left: -15px;
margin-right: 3px;
} }


function setColumnType(i, type) { .changeTypeMenu li:hover {
columns[i].type = type; background: #eee;
HOT.updateSettings({columns: columns});
HOT.render();
} }



</style>

<script data-jsfiddle="example3">
var data = [ var data = [
["", "Maserati", "Mazda", "Mercedes", "Mini", "Mitsubishi"], ["", "Maserati", "Mazda", "Mercedes", "Mini", "Mitsubishi"],
["2009", 0, 2941, 4303, 354, 5814], ["2009", 0, 2941, 4303, 354, 5814],
["2010", "fff", 2905, 2867, 412, 5284], ["2010", 3, 2905, 2867, 412, 5284],
["2011", 4, 2517, 4822, 552, 6127], ["2011", 4, 2517, 4822, 552, 6127],
["2012", 2, 2422, 5399, 776, 4151] ["2012", 2, 2422, 5399, 776, 4151]
]; ];


var columns = [
{type: 'numeric'},
{type: 'numeric'},
{type: 'numeric'},
{type: 'numeric'},
{type: 'numeric'},
{type: 'numeric'}
];


$('#example3').handsontable({ $('#example3').handsontable({
data: data, data: data,
minRows: 5,
minCols: 6,
minSpareRows: 1,
autoWrapRow: true,
colHeaders: true, colHeaders: true,
minSpareRows: 1,
type: 'numeric',
columns: columns, columns: columns,
contextMenu: true,
allowInvalid: true,
afterGetColHeader: function (col, TH) { afterGetColHeader: function (col, TH) {
var BUTTON = document.createElement('DIV'); var instance = this;
BUTTON.className = "changeType"; var menu = buildMenu(columns[col].type);
BUTTON.appendChild(document.createTextNode('\u25BC')); //adds BLACK DOWN-POINTING TRIANGLE icon


var $button = $(BUTTON); var $button = buildButton();
$button.click(function () { $button.click(function (e) {
changeCol = col;


var pos = $button.offset(); e.preventDefault();
$button.contextMenu({x: pos.left, y: pos.top + $button.outerHeight() }); e.stopImmediatePropagation();
BUTTON.className = "changeType pressed";


$(document.body).one("contextmenu:hide", function () { $('.changeTypeMenu').hide();
BUTTON.className = "changeType";
menu.show();

menu.position({
my: 'left top',
at: 'left bottom',
of: $button,
within: instance.rootElement
}); });

$(document).off('click.changeTypeMenu.hide');

$(document).one('click.changeTypeMenu.hide', function () {
menu.hide();
});


}); });


TH.firstChild.appendChild(BUTTON); menu.on('click', 'li', function () {
setColumnType(col, $(this).data('colType'), instance);
});

TH.firstChild.appendChild($button[0]);
TH.appendChild(menu[0]);
}, },
cells: function (row, col, prop) { cells: function (row, col, prop) {
if (row === 0) { if (row === 0) {
Expand All @@ -392,8 +398,38 @@ <h2>Changing cell type from a dropdown menu in cell header</h2>
} }
}); });


HOT = $('#example3').handsontable('getInstance'); function buildMenu(activeCellType){
*/ var menu = $('<ul></ul>').addClass('changeTypeMenu');

$.each(['text', 'numeric', 'date'], function (i, type) {
var item = $('<li></li>').data('colType', type).text(type);

if(activeCellType == type){
item.addClass('active');
}

menu.append(item);

});


return menu;

}

function buildButton() {
return $('<button></button>').addClass('changeType').html('\u25BC');
}

function setColumnType(i, type, instance) {
columns[i].type = type;
instance.updateSettings({columns: columns});
instance.validateCells(function(){
instance.render();
});
}


</script> </script>
</div> </div>
</div> </div>
Expand Down
43 changes: 29 additions & 14 deletions src/core.js
View file
Expand Up @@ -14,12 +14,9 @@ Handsontable.Core = function (rootElement, userSettings) {
, editorManager , editorManager
, autofill , autofill
, instance = this , instance = this
, GridSettings = function () { , GridSettings = function () {};
};


Handsontable.helper.inherit(GridSettings, DefaultSettings); //create grid settings as a copy of default settings Handsontable.helper.inherit(GridSettings, DefaultSettings); //create grid settings as a copy of default settings
Handsontable.helper.extend(GridSettings.prototype, Handsontable.TextCell); //overwrite defaults with default cell
expandType(userSettings);
Handsontable.helper.extend(GridSettings.prototype, userSettings); //overwrite defaults with user settings Handsontable.helper.extend(GridSettings.prototype, userSettings); //overwrite defaults with user settings


this.rootElement = rootElement; this.rootElement = rootElement;
Expand Down Expand Up @@ -1317,17 +1314,18 @@ Handsontable.Core = function (rootElement, userSettings) {
changes.splice(i, 1); changes.splice(i, 1);
} }
else { else {
var row = changes[i][0];
var col = datamap.propToCol(changes[i][1]); var col = datamap.propToCol(changes[i][1]);
var logicalCol = instance.runHooksAndReturn('modifyCol', col); //column order may have changes, so we need to translate physical col index (stored in datasource) to logical (displayed to user) var logicalCol = instance.runHooksAndReturn('modifyCol', col); //column order may have changes, so we need to translate physical col index (stored in datasource) to logical (displayed to user)
var cellProperties = instance.getCellMeta(changes[i][0], logicalCol); var cellProperties = instance.getCellMeta(row, logicalCol);


if (cellProperties.dataType === 'number' && typeof changes[i][3] === 'string') { if (cellProperties.type === 'numeric' && typeof changes[i][3] === 'string') {
if (changes[i][3].length > 0 && /^-?[\d\s]*\.?\d*$/.test(changes[i][3])) { if (changes[i][3].length > 0 && /^-?[\d\s]*\.?\d*$/.test(changes[i][3])) {
changes[i][3] = numeral().unformat(changes[i][3] || '0'); //numeral cannot unformat empty string changes[i][3] = numeral().unformat(changes[i][3] || '0'); //numeral cannot unformat empty string
} }
} }


if (cellProperties.validator) { if (instance.getCellValidator(cellProperties)) {
waitingForValidator.addValidatorToQueue(); waitingForValidator.addValidatorToQueue();
instance.validateCell(changes[i][3], cellProperties, (function (i, cellProperties) { instance.validateCell(changes[i][3], cellProperties, (function (i, cellProperties) {
return function (result) { return function (result) {
Expand Down Expand Up @@ -1407,7 +1405,7 @@ Handsontable.Core = function (rootElement, userSettings) {
} }


this.validateCell = function (value, cellProperties, callback, source) { this.validateCell = function (value, cellProperties, callback, source) {
var validator = cellProperties.validator; var validator = instance.getCellValidator(cellProperties);


if (Object.prototype.toString.call(validator) === '[object RegExp]') { if (Object.prototype.toString.call(validator) === '[object RegExp]') {
validator = (function (validator) { validator = (function (validator) {
Expand Down Expand Up @@ -1826,7 +1824,7 @@ Handsontable.Core = function (rootElement, userSettings) {
// Use settings provided by user // Use settings provided by user
if (GridSettings.prototype.columns) { if (GridSettings.prototype.columns) {
column = GridSettings.prototype.columns[i]; column = GridSettings.prototype.columns[i];
expandType(column); // expandType(column);
Handsontable.helper.extend(proto, column); Handsontable.helper.extend(proto, column);
} }
} }
Expand Down Expand Up @@ -2051,13 +2049,13 @@ Handsontable.Core = function (rootElement, userSettings) {
cellProperties.instance = instance; cellProperties.instance = instance;


instance.PluginHooks.run('beforeGetCellMeta', row, col, cellProperties); instance.PluginHooks.run('beforeGetCellMeta', row, col, cellProperties);
expandType(cellProperties); //for `type` added in beforeGetCellMeta // expandType(cellProperties); //for `type` added in beforeGetCellMeta


if (cellProperties.cells) { if (cellProperties.cells) {
var settings = cellProperties.cells.call(cellProperties, row, col, prop); var settings = cellProperties.cells.call(cellProperties, row, col, prop);


if (settings) { if (settings) {
expandType(settings); //for `type` added in cells // expandType(settings); //for `type` added in cells
Handsontable.helper.extend(cellProperties, settings); Handsontable.helper.extend(cellProperties, settings);
} }
} }
Expand Down Expand Up @@ -2091,6 +2089,22 @@ Handsontable.Core = function (rootElement, userSettings) {
} }
}; };


this.getCellRenderer = function (row, col) {
var renderer = Handsontable.helper.cellMethodLookupFactory('renderer').call(this, row, col);

if(typeof renderer == 'string'){
renderer = Handsontable.cellLookup.renderer[renderer];
}

return renderer

};

this.getCellEditor = Handsontable.helper.cellMethodLookupFactory('editor');

this.getCellValidator = Handsontable.helper.cellMethodLookupFactory('validator');


/** /**
* Validates all cells using their validator functions and calls callback when finished. Does not render the view * Validates all cells using their validator functions and calls callback when finished. Does not render the view
* @param callback * @param callback
Expand Down Expand Up @@ -2559,8 +2573,8 @@ Handsontable.Core = function (rootElement, userSettings) {
this.version = '@@version'; //inserted by grunt from package.json this.version = '@@version'; //inserted by grunt from package.json
}; };


var DefaultSettings = function () { var DefaultSettings = function () {};
};
DefaultSettings.prototype = { DefaultSettings.prototype = {
data: void 0, data: void 0,
width: void 0, width: void 0,
Expand Down Expand Up @@ -2596,7 +2610,8 @@ DefaultSettings.prototype = {
invalidCellClassName: 'htInvalid', invalidCellClassName: 'htInvalid',
fragmentSelection: false, fragmentSelection: false,
readOnly: false, readOnly: false,
nativeScrollbars: false nativeScrollbars: false,
type: 'text'
}; };
Handsontable.DefaultSettings = DefaultSettings; Handsontable.DefaultSettings = DefaultSettings;


Expand Down
2 changes: 1 addition & 1 deletion src/editorManager.js
View file
Expand Up @@ -358,7 +358,7 @@
var originalValue = instance.getDataAtCell(row, col); var originalValue = instance.getDataAtCell(row, col);
var cellProperties = instance.getCellMeta(row, col); var cellProperties = instance.getCellMeta(row, col);


var editorClass = cellProperties.editor; var editorClass = instance.getCellEditor(cellProperties);
activeEditor = Handsontable.editors.getEditor(editorClass, instance); activeEditor = Handsontable.editors.getEditor(editorClass, instance);


activeEditor.prepare(row, col, prop, td, originalValue, cellProperties); activeEditor.prepare(row, col, prop, td, originalValue, cellProperties);
Expand Down
18 changes: 13 additions & 5 deletions src/editors/baseEditor.js
View file
Expand Up @@ -23,9 +23,7 @@
this._closeCallback(result); this._closeCallback(result);
} }


BaseEditor.prototype.init = function(){ BaseEditor.prototype.init = function(){};
throw Error('Editor init() method unimplemented');
};


BaseEditor.prototype.val = function(newValue){ BaseEditor.prototype.val = function(newValue){
throw Error('Editor val() method unimplemented'); throw Error('Editor val() method unimplemented');
Expand Down Expand Up @@ -56,7 +54,17 @@
baseClass.apply(this, arguments); baseClass.apply(this, arguments);
} }


return Handsontable.helper.inherit(Editor, baseClass); function inherit(Child, Parent){
function Bridge() {
}

Bridge.prototype = Parent.prototype;
Child.prototype = new Bridge();
Child.prototype.constructor = Child;
return Child;
}

return inherit(Editor, baseClass);
}; };


BaseEditor.prototype.saveValue = function (val, ctrlDown) { BaseEditor.prototype.saveValue = function (val, ctrlDown) {
Expand Down Expand Up @@ -135,7 +143,7 @@


this.saveValue(val, ctrlDown); this.saveValue(val, ctrlDown);


if(this.cellProperties.validator){ if(this.instance.getCellValidator(this.cellProperties)){
var that = this; var that = this;
this.instance.addHookOnce('afterValidate', function (result) { this.instance.addHookOnce('afterValidate', function (result) {
that.state = Handsontable.EditorState.FINISHED; that.state = Handsontable.EditorState.FINISHED;
Expand Down

0 comments on commit 3151685

Please sign in to comment.