Permalink
Browse files

Merge git://github.com/SitePen/dgrid into datachange-no-store

Conflicts:
	Editor.js
  • Loading branch information...
kriszyp committed Oct 20, 2011
2 parents ddddf83 + 3f81b9d commit b3353b7a779d71324fdbbeec762a91b717211faa
Showing with 1,469 additions and 613 deletions.
  1. +2 −2 CellSelection.js
  2. +55 −30 ColumnSet.js
  3. +0 −28 Editor.js
  4. +58 −28 Grid.js
  5. +13 −10 GridFromHtml.js
  6. +2 −2 Keyboard.js
  7. +33 −38 List.js
  8. +104 −33 OnDemandList.js
  9. +13 −13 README.md
  10. +55 −70 Selection.js
  11. +98 −0 Selector.js
  12. +3 −1 Tree.js
  13. +53 −0 css/dgrid.css
  14. 0 css/{resize.css → extensions/ColumnResizer.css}
  15. +4 −1 css/skins/nihilo.css
  16. +2 −3 css/skins/slate.css
  17. +0 −1 css/skins/soria.css
  18. +4 −0 css/skins/squid.css
  19. +0 −1 css/skins/tundra.css
  20. 0 test/data_songs.js → demos/itunes/data.js
  21. +6 −6 test/test_songs.html → demos/itunes/index.html
  22. +10 −7 { → extensions}/ColumnResizer.js
  23. +72 −49 { → extensions}/DnD.js
  24. +11 −6 test/data.js
  25. +22 −7 test/{test_column_resize.html → extensions/ColumnResizer.html}
  26. +6 −6 test/{test_complex_column_resize.html → extensions/ColumnResizer_complex.html}
  27. +36 −9 test/{test_dnd.html → extensions/DnD.html}
  28. +9 −5 test/test_GridFromHtml_Editors.html
  29. 0 test/{test_legacy.html → test_Grid_rendering.html}
  30. +331 −0 test/test_OnDemand.html
  31. +92 −7 test/test_complex_column.html
  32. +3 −44 test/test_editors.html
  33. +89 −0 test/test_editors2.html
  34. +142 −0 test/test_headerless.html
  35. +1 −1 test/test_mobile_grid.html
  36. 0 test/{test_datagrid_performance.html → test_performance_dojox_datagrid.html}
  37. +7 −4 test/test_selectors.html
  38. +11 −9 test/test_sparse.html
  39. +0 −191 test/test_store_observation.html
  40. +0 −1 test/test_treegrid.html
  41. +122 −0 test/test_widths.html
View
@@ -1,4 +1,4 @@
-define(["dojo/_base/declare", "./Selection", "dojo/on", "put-selector/put"], function(declare, Selection, listen, put){
+define(["dojo/_base/declare", "./Selection", "dojo/on", "put-selector/put", "dojo/query"], function(declare, Selection, listen, put){
return declare([Selection], {
// summary:
// Add cell level selection capabilities to a grid. The grid will have a selection property and
@@ -110,4 +110,4 @@ return declare([Selection], {
}
}
});
-});
+});
View
@@ -1,9 +1,9 @@
define(["xstyle/css!./css/columnset.css", "dojo/has", "put-selector/put", "dojo/_base/declare", "dojo/on", "dojo/aspect", "dojo/query", "./Grid", "xstyle/has-class", "dojo/_base/sniff"],
function(styleSheet, has, put, declare, listen, aspect, query, Grid, hasClass){
- // summary:
+ // summary:
// This module provides column sets to isolate horizontal scroll of sets of
- // columns from each other. This mainly serves the purpose of allowing for
- // column locking.
+ // columns from each other. This mainly serves the purpose of allowing for
+ // column locking.
hasClass("safari", "ie-7");
return declare([Grid], {
columnSets: [],
@@ -14,7 +14,6 @@ function(styleSheet, has, put, declare, listen, aspect, query, Grid, hasClass){
// iterate through the columnSets
var columnSet = this.columnSets[i];
var cell = put(tr, tag + ".dgrid-column-set-cell.column-set-" + i + " div.dgrid-column-set[colsetid=" + i + "]");
- /*var td = put(tag + ".dgrid-column-set[colsetid=" + i + "]"*/
this.subRows = columnSet;
cell.appendChild(this.inherited(arguments));
}
@@ -31,12 +30,16 @@ function(styleSheet, has, put, declare, listen, aspect, query, Grid, hasClass){
// summary:
// Setup the headers for the grid
this.inherited(arguments);
- var columnSets = this.columnSets;
this.bodyNode.style.bottom = "17px";
- var domNode = this.domNode;
- var scrollers = this._columnSetScrollers = {};
- var scrollerContents = this._columnSetScrollerContents = {};
- var scrollLefts = this._columnSetScrollLefts = {};
+
+ var columnSets = this.columnSets,
+ domNode = this.domNode,
+ scrollers = this._columnSetScrollers,
+ scrollerContents = this._columnSetScrollerContents = {},
+ scrollLefts = this._columnSetScrollLefts = {},
+ grid = this,
+ i, l;
+
function onScroll(){
var scrollLeft = this.scrollLeft;
var colSetId = this.getAttribute("colsetid");
@@ -48,22 +51,39 @@ function(styleSheet, has, put, declare, listen, aspect, query, Grid, hasClass){
});
}
}
- for(var i = 0, l = columnSets.length; i < l; i++){
- (function(columnSet, i){
- var scroller = scrollers[i] =
- put(domNode, "div.dgrid-column-set-scroller.dgrid-scrollbar-height.column-set-scroller-" + i + "[colsetid=" + i +"]");
- scrollerContents[i] = put(scroller, "div.dgrid-column-set-scroller-content");
- listen(scroller, "scroll", onScroll);
- })(columnSets[i], i);
+
+ function putScroller(columnSet, i){
+ // function called for each columnSet
+ var scroller = scrollers[i] =
+ put(domNode, "div.dgrid-column-set-scroller.dgrid-scrollbar-height.column-set-scroller-" + i + "[colsetid=" + i +"]");
+ scrollerContents[i] = put(scroller, "div.dgrid-column-set-scroller-content");
+ listen(scroller, "scroll", onScroll);
}
- var grid = this;
- positionScrollers(this, domNode);
+
function reposition(){
positionScrollers(grid, domNode);
}
- aspect.after(this, "resize", reposition);
- listen(domNode, ".dgrid-column-set:cellfocusin", onScroll);
- aspect.after(this, "styleColumn", reposition);
+
+ if (scrollers) {
+ // this isn't the first time; destroy existing scroller nodes first
+ for(i in scrollers){
+ put("!", scrollers[i]);
+ }
+ } else {
+ // first-time-only operations
+ aspect.after(this, "resize", reposition);
+ listen(domNode, ".dgrid-column-set:cellfocusin", onScroll);
+ aspect.after(this, "styleColumn", reposition);
+ }
+
+ // reset to new object to be populated in loop below
+ scrollers = this._columnSetScrollers = {};
+
+ for(i = 0, l = columnSets.length; i < l; i++){
+ putScroller(columnSets[i], i);
+ }
+
+ positionScrollers(this, domNode);
},
configStructure: function(){
this.columns = {};
@@ -74,19 +94,25 @@ function(styleSheet, has, put, declare, listen, aspect, query, Grid, hasClass){
columnSet[j] = this._configColumns(i + '-' + j + '-', columnSet[j]);
}
}
+ },
+ setColumnSets: function(columnSets){
+ this.columnSets = columnSets;
+ this.configStructure();
+ this._updateColumns();
}
});
function positionScrollers(grid, domNode){
- var left = 0, scrollerWidth = 0;
- var scrollers = grid._columnSetScrollers;
- var scrollerContents = grid._columnSetScrollerContents;
- var columnSets = grid.columnSets;
- for(var i = 0, l = columnSets.length; i < l; i++){
+ var scrollers = grid._columnSetScrollers,
+ scrollerContents = grid._columnSetScrollerContents,
+ columnSets = grid.columnSets,
+ left = 0, scrollerWidth = 0,
+ i, l, columnSetElement, contentWidth;
+ for(i = 0, l = columnSets.length; i < l; i++){
// iterate through the columnSets
left += scrollerWidth;
- var columnSetElement = query('.dgrid-column-set[colsetid="' + i +'"]', domNode)[0];
- var scrollerWidth = columnSetElement.offsetWidth;
- var contentWidth = columnSetElement.firstChild.offsetWidth;
+ columnSetElement = query('.dgrid-column-set[colsetid="' + i +'"]', domNode)[0];
+ scrollerWidth = columnSetElement.offsetWidth;
+ contentWidth = columnSetElement.firstChild.offsetWidth;
scrollerContents[i].style.width = contentWidth + "px";
scrollers[i].style.width = scrollerWidth + "px";
scrollers[i].style.overflowX = contentWidth > scrollerWidth ? "scroll" : "auto"; // IE seems to need it be set explicitly
@@ -106,5 +132,4 @@ function(styleSheet, has, put, declare, listen, aspect, query, Grid, hasClass){
doAdjustScrollLeft();
}
}
-
});
View
@@ -149,19 +149,6 @@ return function(column, editor, editOn){
return oldValue;
}
}
- if(column.selector){
- if(editor == "radio" || column.selector == "single"){
- grid.clearSelection();
- }
- if(row){
- suppressSelect = true;
- grid.select(row.id, null, value);
- suppressSelect = false;
- }else{
- // select all
- grid[value ? "selectAll" : "clearSelection"]();
- }
- }
}
return value;
}
@@ -170,21 +157,6 @@ return function(column, editor, editOn){
var cmp; // stores input/widget being rendered
if(!grid){
grid = column.grid;
- if(column.selector){
- grid.on("select,deselect", function(event){
- // Selector only cares about selection events from rows.
- // We can't just use event delegation here, because we *don't* want
- // to capture events bubbled from deeper (e.g. text editors).
- if(!suppressSelect && /\bdgrid-row\b/.test(event.target.className)){
- var cell = grid.cell(event.row.id, column.id).element;
- renderWidget(event.type == "select", cell.contents || cell, object);
- }
- });
- }
- }
- if(column.selector){
- var row = object && grid.row(object);
- value = row && grid.selection[row.id];
}
if(column.editOn){ // TODO: Make this use event delegation, particularly now that we can do event delegation with focus events
// if we are dealing with IE<8, the cell element is the padding cell, need to go to parent
View
86 Grid.js
@@ -1,4 +1,4 @@
-define(["dojo/has", "put-selector/put", "dojo/_base/declare", "dojo/on", "dojo/query", "./Editor", "./List", "dojo/_base/sniff"], function(has, put, declare, listen, query, Editor, List){
+define(["dojo/has", "put-selector/put", "dojo/_base/declare", "dojo/on", "./Editor", "./List", "dojo/_base/sniff"], function(has, put, declare, listen, Editor, List){
var contentBoxSizing = has("ie") < 8 && !has("quirks");
function appendIfNode(parent, subNode){
@@ -15,6 +15,7 @@ define(["dojo/has", "put-selector/put", "dojo/_base/declare", "dojo/on", "dojo/q
// navigation.
cellNavigation: true,
tabableHeader: true,
+ showHeader: true,
column: function(target){
// summary:
// Get the column object by node, or event, or a columnId
@@ -176,12 +177,11 @@ define(["dojo/has", "put-selector/put", "dojo/_base/declare", "dojo/on", "dojo/q
}
var row = this.createRowCells("th[role=columnheader]", function(th, column){
- var contentNode = th;
+ var contentNode = column.headerNode = th;
if(contentBoxSizing){
// we're interested in the th, but we're passed the inner div
th = th.parentNode;
}
- column.grid = grid;
var field = column.field;
if(field){
th.field = field;
@@ -238,10 +238,18 @@ define(["dojo/has", "put-selector/put", "dojo/_base/declare", "dojo/on", "dojo/q
this.inherited(arguments);
- if(contentNode){
- if((width = headerTableNode.offsetWidth) != contentNode.offsetWidth){
- // update size of content node if necessary (to match size of rows)
- contentNode.style.width = width + "px";
+ if(!has("ie") || (has("ie") > 7 && !has("quirks"))){
+ // Force contentNode width to match up with header width.
+ // (Old IEs don't have a problem due to how they layout.)
+
+ contentNode.style.width = ""; // reset first
+
+ if(contentNode && headerTableNode){
+ if((width = headerTableNode.offsetWidth) != contentNode.offsetWidth){
+ // update size of content node if necessary (to match size of rows)
+ // (if headerTableNode can't be found, there isn't much we can do)
+ contentNode.style.width = width + "px";
+ }
}
}
},
@@ -252,27 +260,34 @@ define(["dojo/has", "put-selector/put", "dojo/_base/declare", "dojo/on", "dojo/q
// if we were invoked from a header cell click handler, grab
// stashed target node; otherwise (e.g. direct sort call) need to look up
- var target = this._sortNode ||
- query("#" + this.id + " .dgrid-header .field-" + property)[0];
-
+ var target = this._sortNode, columns, column, i;
+ if(!target){
+ columns = this.columns;
+ for(i in columns){
+ column = columns[i];
+ if(column.field == property){
+ target = column.headerNode;
+ }
+ }
+ }
// skip this logic if field being sorted isn't actually displayed
- if(!target){ return this.inherited(arguments); }
-
- target = target.contents || target;
- if(this._lastSortedArrow){
- // remove the sort classes from parent node
- put(this._lastSortedArrow, "<!dgrid-sort-up!dgrid-sort-down");
- // destroy the lastSortedArrow node
- put(this._lastSortedArrow, "!");
+ if(target){
+ target = target.contents || target;
+ if(this._lastSortedArrow){
+ // remove the sort classes from parent node
+ put(this._lastSortedArrow, "<!dgrid-sort-up!dgrid-sort-down");
+ // destroy the lastSortedArrow node
+ put(this._lastSortedArrow, "!");
+ }
+ // place sort arrow under clicked node, and add up/down sort class
+ this._lastSortedArrow = put(target.firstChild, "-div.dgrid-sort-arrow.ui-icon[role=presentation]");
+ this._lastSortedArrow.innerHTML = "&nbsp;";
+ put(target, descending ? ".dgrid-sort-down" : ".dgrid-sort-up");
+ // call resize in case relocation of sort arrow caused any height changes
+ this.resize();
+
+ delete this._sortNode;
}
- // place sort arrow under clicked node, and add up/down sort class
- this._lastSortedArrow = put(target.firstChild, "-div.dgrid-sort-arrow.ui-icon[role=presentation]");
- this._lastSortedArrow.innerHTML = "&nbsp;";
- put(target, descending ? ".dgrid-sort-down" : ".dgrid-sort-up");
- // call resize in case relocation of sort arrow caused any height changes
- this.resize();
-
- delete this._sortNode;
this.inherited(arguments);
},
styleColumn: function(colId, css){
@@ -297,7 +312,12 @@ define(["dojo/has", "put-selector/put", "dojo/_base/declare", "dojo/on", "dojo/q
columnId = column.id = column.id || (isNaN(columnId) ? columnId : (prefix + columnId));
if(prefix){
this.columns[columnId] = column;
- }
+ }
+
+ // add reference to this instance to each column object,
+ // for potential use by column plugins
+ column.grid = this;
+
subRow.push(column); // make sure it can be iterated on
}
return isArray ? rowColumns : subRow;
@@ -321,12 +341,22 @@ define(["dojo/has", "put-selector/put", "dojo/_base/declare", "dojo/on", "dojo/q
this.columns = columns;
// re-run logic
this.configStructure();
+ this._updateColumns();
+ },
+ setSubRows: function(subrows){
+ this.subRows = subrows;
+ this.configStructure();
+ this._updateColumns();
+ },
+ _updateColumns: function(){
+ // summary:
+ // Called after e.g. columns, subRows, columnSets are updated
+
this.renderHeader();
this.refresh();
// re-render last collection if present
this.lastCollection && this.renderArray(this.lastCollection);
this.resize();
}
- // TODO: setSubRows
});
});
View
@@ -110,18 +110,21 @@ define(["./OnDemandGrid", "dojo/_base/declare", "dojo/_base/lang", "dojo/dom-con
getObj = GridFromHtml.utils.getObjFromAttr,
getBool = GridFromHtml.utils.getBoolFromAttr,
getNum = GridFromHtml.utils.getNumFromAttr,
- obj = {}, tmp;
+ obj, tmp;
- // inspect standard attributes first
- obj.label = th.innerHTML;
- obj.field = th.className || th.innerHTML; // often overridden in props
- if(th.className){ obj.className = th.className; }
- if((tmp = getNum(th, "rowspan"))){ obj.rowSpan = tmp; }
- if((tmp = getNum(th, "colspan"))){ obj.colSpan = tmp; }
+ // Look for properties in data attribute.
+ // It's imperative that we hold on to this object as returned, as the
+ // object may be augmented further by other sources,
+ // e.g. Grid adding the grid property to reference the instance.
+ obj = GridFromHtml.utils.getPropsFromNode(th);
+
+ // inspect standard attributes, but data attribute takes precedence
+ obj.label = obj.label || th.innerHTML;
+ obj.field = obj.field || th.className || th.innerHTML;
+ if(!obj.className && th.className){ obj.className = th.className; }
+ if(!obj.rowSpan && (tmp = getNum(th, "rowspan"))){ obj.rowSpan = tmp; }
+ if(!obj.colSpan && (tmp = getNum(th, "colspan"))){ obj.colSpan = tmp; }
- // look for rest of properties in data attribute
- // (properties in data attribute can override the HTML attributes above)
- dojo.mixin(obj, GridFromHtml.utils.getPropsFromNode(th));
return obj;
}
}
View
@@ -57,7 +57,7 @@ return declare([List], {
element.focus();
}
put(element, ".dgrid-focus");
- on.emit(cellFocusedElement, "cellfocusin", event);
+ on.emit(cellFocusedElement, "cellfocusin", dojo.mixin({ parentType: event.type }, event));
}
}
}
@@ -143,4 +143,4 @@ return declare([List], {
navigateArea(grid.contentNode);
}
});
-});
+});
Oops, something went wrong.

0 comments on commit b3353b7

Please sign in to comment.