Skip to content

Commit

Permalink
Some tests added (still not 100%)
Browse files Browse the repository at this point in the history
  • Loading branch information
johnkiernander committed Mar 10, 2016
1 parent ad45b43 commit 919e199
Show file tree
Hide file tree
Showing 10 changed files with 2,267 additions and 419 deletions.
2 changes: 1 addition & 1 deletion bower.json
Expand Up @@ -9,7 +9,7 @@
"dependencies": {
"d3": ">=3.5.2"
},
"version": "0.1.15",
"version": "0.2.0",
"homepage": "https://github.com/PMSI-AlignAlytics/scrollgrid",
"authors": [
"johnkiernander <jkiernander@pmsi-consulting.com>"
Expand Down
146 changes: 98 additions & 48 deletions dist/scrollgrid.latest.js
Expand Up @@ -93,6 +93,7 @@
};

Scrollgrid.init = function (target, options) {
options = options || {};
options.target = target;
var scrollgrid = new Scrollgrid(options);
return scrollgrid;
Expand Down Expand Up @@ -195,6 +196,9 @@ Scrollgrid.prototype.internal.dom.layoutDOM = function (fixedSize) {
dom.setAbsolutePosition.call(self, dom.bottom.right.svg, physical.left + physical.visibleInnerWidth, physical.top + physical.visibleInnerHeight + topMargin, physical.right, physical.bottom);
dom.setAbsolutePosition.call(self, dom.main.svg, physical.left, physical.top + topMargin, physical.visibleInnerWidth, physical.visibleInnerHeight);

// Style all panels
dom.stylePanels.call(this, this.style);

// Top right panel needs a small offset for the handle
dom.top.right.transform.attr('transform', 'translate(' + physical.dragHandleWidth / 2 + ', 0)');

Expand All @@ -221,7 +225,6 @@ Scrollgrid.prototype.internal.dom.populateDOM = function () {
"use strict";

var int = this.internal,
style = this.style,
dom = int.dom;

// Get the parent container
Expand All @@ -230,19 +233,19 @@ Scrollgrid.prototype.internal.dom.populateDOM = function () {
dom.container = dom.parent.append('div');

// Populate the 5 regions of the control
dom.left = dom.populatePanel.call(this, style.left.panel);
dom.top = dom.populatePanel.call(this, style.top.panel);
dom.top.left = dom.populatePanel.call(this, style.top.left.panel);
dom.top.right = dom.populatePanel.call(this, style.top.right.panel);
dom.main = dom.populatePanel.call(this, style.main.panel);
dom.left = dom.populatePanel.call(this);
dom.top = dom.populatePanel.call(this);
dom.top.left = dom.populatePanel.call(this);
dom.top.right = dom.populatePanel.call(this);
dom.main = dom.populatePanel.call(this);

// Add the viewport which is the fixed area with scroll bars
dom.main.viewport = dom.container.append('div');

dom.right = dom.populatePanel.call(this, style.right.panel);
dom.bottom = dom.populatePanel.call(this, style.bottom.panel);
dom.bottom.left = dom.populatePanel.call(this, style.bottom.left.panel);
dom.bottom.right = dom.populatePanel.call(this, style.bottom.right.panel);
dom.right = dom.populatePanel.call(this);
dom.bottom = dom.populatePanel.call(this);
dom.bottom.left = dom.populatePanel.call(this);
dom.bottom.right = dom.populatePanel.call(this);

// The scroller is going to be as large as the virtual size of
// the data (as if it had all been rendered) this is so that
Expand All @@ -254,14 +257,13 @@ Scrollgrid.prototype.internal.dom.populateDOM = function () {
// Copyright: 2015 AlignAlytics
// License: "https://github.com/PMSI-AlignAlytics/scrollgrid/blob/master/MIT-LICENSE.txt"
// Source: /src/internal/dom/populatePanel.js
Scrollgrid.prototype.internal.dom.populatePanel = function (css) {
Scrollgrid.prototype.internal.dom.populatePanel = function () {
"use strict";

var dom = this.internal.dom,
panel = {};

panel.svg = dom.container.append('svg');
panel.svg.attr('class', css);
panel.transform = panel.svg.append('g');
panel.content = panel.transform.append('g');

Expand Down Expand Up @@ -390,6 +392,29 @@ Scrollgrid.prototype.internal.dom.setScrollerSize = function () {

};

// Copyright: 2015 AlignAlytics
// License: "https://github.com/PMSI-AlignAlytics/scrollgrid/blob/master/MIT-LICENSE.txt"
// Source: /src/internal/dom/stylePanels.js
Scrollgrid.prototype.internal.dom.stylePanels = function (style) {
"use strict";

var int = this.internal,
dom = int.dom;

this.style = style || this.style;

dom.left.svg.attr('class', this.style.left.panel);
dom.top.svg.attr('class', this.style.top.panel);
dom.right.svg.attr('class', this.style.right.panel);
dom.bottom.svg.attr('class', this.style.bottom.panel);
dom.top.left.svg.attr('class', this.style.top.left.panel);
dom.top.right.svg.attr('class', this.style.top.right.panel);
dom.bottom.left.svg.attr('class', this.style.bottom.left.panel);
dom.bottom.right.svg.attr('class', this.style.bottom.right.panel);
dom.main.svg.attr('class', this.style.main.panel);

};

// Copyright: 2015 AlignAlytics
// License: "https://github.com/PMSI-AlignAlytics/scrollgrid/blob/master/MIT-LICENSE.txt"
// Source: /src/internal/render/renderBackground.js
Expand Down Expand Up @@ -909,7 +934,7 @@ Scrollgrid.prototype.internal.render.getDataBounds = function (physicalViewArea)
Scrollgrid.prototype.internal.render.getDataInBounds = function (viewArea) {
"use strict";

var i, r, c, x,
var i, r, c, x, vc, vr = 0,
int = this.internal,
sizes = int.sizes,
render = int.render,
Expand All @@ -920,17 +945,14 @@ Scrollgrid.prototype.internal.render.getDataInBounds = function (viewArea) {
runningY,
rowHeight = 0,
visibleData = [],
adjustments,
getValue;
adjustments;

runningY = viewArea.startY;

// Load the data range and get the accessor
getValue = this.adapter.loadDataRange(viewArea);

for (r = viewArea.top || 0, i = 0; r < viewArea.bottom || 0; r += 1) {
rowHeight = physical.getRowHeight.call(this, r);
runningX = viewArea.startX || 0;
vc = 0;
for (c = viewArea.left || 0; c < viewArea.right || 0; c += 1, i += 1) {
// Get any measurement modifiers based on cell position
adjustments = render.calculateCellAdjustments.call(this, r, c);
Expand All @@ -942,6 +964,8 @@ Scrollgrid.prototype.internal.render.getDataInBounds = function (viewArea) {
visibleData[i] = {
x: x,
y: Math.floor(runningY) + adjustments.y + 0.5,
visibleRow: vr,
visibleColumn: vc,
boxWidth: Math.ceil(column.width) + adjustments.boxWidth,
boxHeight: Math.ceil(rowHeight) + adjustments.boxHeight,
textWidth: Math.ceil(column.width) + adjustments.textWidth,
Expand All @@ -955,7 +979,6 @@ Scrollgrid.prototype.internal.render.getDataInBounds = function (viewArea) {
columnIndex: c,
column: column,
formatter: null,
getValue: getValue,
renderForeground: render.renderForeground,
renderBetween: null,
renderBackground: render.renderBackground
Expand All @@ -964,8 +987,10 @@ Scrollgrid.prototype.internal.render.getDataInBounds = function (viewArea) {
// want to key by any value which should result in a redraw of a particular cell,
// this has huge performance benefits. The
visibleData[i].key = visibleData[i].columnIndex + '_' + visibleData[i].rowIndex + "_" + visibleData[i].boxHeight + "_" + visibleData[i].boxWidth + "_" + visibleData[i].sortIcon;
vc += 1;
runningX += column.width;
}
vr += 1;
runningY += rowHeight;
}

Expand Down Expand Up @@ -1120,22 +1145,22 @@ Scrollgrid.prototype.internal.render.renderForeground = function (g, viewData) {
render = int.render,
text;

// Clear any existing text
g.selectAll(".sg-no-style--text-selector").remove();

text = g.append("text")
.attr("class", viewData.foregroundStyle)
.attr("class", "sg-no-style--text-selector " + viewData.foregroundStyle)
.attr("dy", "0.35em")
.attr("x", render.getTextPosition.call(self, viewData))
.attr("y", viewData.textHeight / 2)
.style("text-anchor", render.getTextAnchor.call(self, viewData))
.text(render.cellWaitText);
.style("text-anchor", render.getTextAnchor.call(self, viewData));

viewData.getValue(viewData.rowIndex, viewData.columnIndex, function (value) {
if (viewData.formatter) {
text.text(viewData.formatter(value));
} else {
text.text(value);
}
render.cropText.call(this, text, viewData.textWidth - viewData.cellPadding - (!(!viewData.sortIcon || viewData.sortIcon === 'none') ? render.sortIconSize + viewData.cellPadding : 0));
});
if (viewData.formatter) {
text.text(viewData.formatter(viewData.value));
} else {
text.text(viewData.value);
}
render.cropText.call(this, text, viewData.textWidth - viewData.cellPadding - (!(!viewData.sortIcon || viewData.sortIcon === 'none') ? render.sortIconSize + viewData.cellPadding : 0));

};

Expand All @@ -1152,18 +1177,21 @@ Scrollgrid.prototype.internal.render.renderRegion = function (target, physicalOf
interaction = int.interaction,
events = int.events,
cells,
data;
metadata,
bounds;

if ((xVirtual.left || 0) !== (xVirtual.right || 0) && (yVirtual.top || 0) !== (yVirtual.bottom || 0)) {

data = render.getDataInBounds.call(self, {
bounds = {
startX: physicalOffset.x || 0,
startY: physicalOffset.y || 0,
top: yVirtual.top || 0,
bottom: yVirtual.bottom || 0,
left: xVirtual.left || 0,
right: xVirtual.right || 0
});
};

metadata = render.getDataInBounds.call(self, bounds);

// On refresh we will clear and redraw everything. This can
// be invoked externally or internally on full grid changes. On scroll or resize
Expand All @@ -1176,7 +1204,7 @@ Scrollgrid.prototype.internal.render.renderRegion = function (target, physicalOf

cells = target.content
.selectAll(".sg-no-style--cell-selector")
.data(data, function (d) {
.data(metadata, function (d) {
return d.key;
});

Expand All @@ -1190,12 +1218,6 @@ Scrollgrid.prototype.internal.render.renderRegion = function (target, physicalOf
if (d.renderBackground) {
d.renderBackground.call(self, group, d);
}
if (d.renderBetween) {
d.renderBetween.call(self, group, d);
}
if (d.renderForeground) {
d.renderForeground.call(self, group, d);
}
render.renderSortIcon.call(self, d, group, !(!d.sortIcon || d.sortIcon === 'none'));
// Add some interaction to the headers
if (interaction.allowSorting && (target === dom.top || target === dom.top.left || target === dom.top.right)) {
Expand All @@ -1206,6 +1228,9 @@ Scrollgrid.prototype.internal.render.renderRegion = function (target, physicalOf
events.addEventHandlers.call(self, group, d);
});

// Draw the foreground separately to allow for asynchronous adapters
render.renderRegionForeground.call(this, bounds, cells);

cells.attr("transform", function (d) {
return "translate(" + d.x + "," + d.y + ")";
});
Expand All @@ -1217,6 +1242,31 @@ Scrollgrid.prototype.internal.render.renderRegion = function (target, physicalOf
};


// Copyright: 2015 AlignAlytics
// License: "https://github.com/PMSI-AlignAlytics/scrollgrid/blob/master/MIT-LICENSE.txt"
// Source: /src/internal/render/renderRegionForeground.js
Scrollgrid.prototype.internal.render.renderRegionForeground = function (bounds, cells) {
"use strict";

var self = this;

this.adapter.loadDataRange.call(this, bounds, function (data) {
cells.each(function (d) {
var group = d3.select(this);

// Get the value from the visible range and set it in the data object
d.value = data[d.visibleRow][d.visibleColumn];

if (d.renderBetween) {
d.renderBetween.call(self, group, d);
}
if (d.renderForeground) {
d.renderForeground.call(self, group, d);
}
});
});
};

// Copyright: 2015 AlignAlytics
// License: "https://github.com/PMSI-AlignAlytics/scrollgrid/blob/master/MIT-LICENSE.txt"
// Source: /src/internal/render/renderSortIcon.js
Expand Down Expand Up @@ -1246,27 +1296,27 @@ Scrollgrid.prototype.internal.render.setDefaultStyles = function () {
// Define default classes, these are kept external as users might want to use their own
this.style = {
left: {
panel: 'sg-fixed sg-left'
panel: 'sg-grid sg-fixed sg-left'
},
top: {
panel: 'sg-fixed sg-top',
panel: 'sg-grid sg-fixed sg-top',
left: {
panel: 'sg-fixed sg-top-left'
panel: 'sg-grid sg-fixed sg-top sg-left'
},
right: {
panel: 'sg-fixed sg-top-right'
panel: 'sg-grid sg-fixed sg-top sg-right'
}
},
right: {
panel: 'sg-fixed sg-right'
panel: 'sg-grid sg-fixed sg-right'
},
bottom: {
panel: 'sg-fixed sg-bottom',
panel: 'sg-grid sg-fixed sg-bottom',
left: {
panel: 'sg-fixed sg-bottom-left'
panel: 'sg-grid sg-fixed sg-bottom sg-left'
},
right: {
panel: 'sg-fixed sg-bottom-right'
panel: 'sg-grid sg-fixed sg-bottom sg-right'
}
},
main: {
Expand Down
2 changes: 1 addition & 1 deletion dist/scrollgrid.latest.min.js

Large diffs are not rendered by default.

0 comments on commit 919e199

Please sign in to comment.