Commit 748ea21d authored by Joshua Gould's avatar Joshua Gould

scroll lens multi

parent f3122169
This source diff could not be displayed because it is too large. You can view the blob instead.
...@@ -2148,6 +2148,30 @@ morpheus.HeatMap.prototype = { ...@@ -2148,6 +2148,30 @@ morpheus.HeatMap.prototype = {
toggleInfoWindow: function () { toggleInfoWindow: function () {
this.setTooltipMode(this.tooltipMode == 1 ? 0 : 1); this.setTooltipMode(this.tooltipMode == 1 ? 0 : 1);
}, },
_setTipText: function (tipText, tipFollowText, options) {
if (this.tooltipMode === 0) {
this.toolbar.$tip.html(tipText.join(''));
} else if (this.tooltipMode === 1) {
this.$tipInfoWindow.html(tipText.join(''));
}
if (tipFollowText.length > 0) {
this.tipFollowHidden = false;
this.$tipFollow.html('<span style="max-width:400px;">' + tipFollowText.join('') + '</span>');
this._updateTipFollowPosition(options);
} else {
this.tipFollowHidden = true;
this.$tipFollow.html('').css({
left: -1000,
top: -1000
});
}
this.trigger('change', {
name: 'setToolTip',
source: this,
arguments: arguments
});
},
setToolTip: function (rowIndex, columnIndex, options) { setToolTip: function (rowIndex, columnIndex, options) {
options = options || {}; options = options || {};
if (this.options.showSeriesNameInTooltip) { if (this.options.showSeriesNameInTooltip) {
...@@ -2156,10 +2180,19 @@ morpheus.HeatMap.prototype = { ...@@ -2156,10 +2180,19 @@ morpheus.HeatMap.prototype = {
if (options.heatMapLens) { if (options.heatMapLens) {
// don't draw lens if currently visible // don't draw lens if currently visible
// row lens // row lens
if (rowIndex >= 0 && (rowIndex >= this.heatmap.lastPosition.bottom || rowIndex < this.heatmap.lastPosition.top)) { var $wrapper = $('<div></div>');
var wrapperHeight = 0;
var wrapperWidth = 0;
var found = false;
var inline = [];
if (rowIndex != null && rowIndex.length > 0) {
for (var hoverIndex = 0; hoverIndex < rowIndex.length; hoverIndex++) {
var row = rowIndex[hoverIndex];
if (row >= 0 && (row >= this.heatmap.lastPosition.bottom || row < this.heatmap.lastPosition.top)) {
found = true;
var heatMapWidth = this.heatmap.getUnscaledWidth(); var heatMapWidth = this.heatmap.getUnscaledWidth();
var top = rowIndex; // Math.max(0, rowIndex - 1); var top = row; // Math.max(0, rowIndex - 1);
var bottom = rowIndex + 1; //Math.min(rowIndex + 1, this.heatmap.rowPositions.getLength()); var bottom = row + 1; //Math.min(rowIndex + 1, this.heatmap.rowPositions.getLength());
var startPix = this.heatmap.rowPositions.getPosition(top); var startPix = this.heatmap.rowPositions.getPosition(top);
var endPix = startPix + this.heatmap.rowPositions.getItemSize(top); var endPix = startPix + this.heatmap.rowPositions.getItemSize(top);
var heatMapHeight = endPix - startPix; var heatMapHeight = endPix - startPix;
...@@ -2171,9 +2204,11 @@ morpheus.HeatMap.prototype = { ...@@ -2171,9 +2204,11 @@ morpheus.HeatMap.prototype = {
trackWidth += track.getUnscaledWidth(); trackWidth += track.getUnscaledWidth();
} }
} }
var canvasWidth = trackWidth + heatMapWidth + morpheus.HeatMap.SPACE_BETWEEN_HEAT_MAP_AND_ANNOTATIONS; var canvasWidth = trackWidth + heatMapWidth + morpheus.HeatMap.SPACE_BETWEEN_HEAT_MAP_AND_ANNOTATIONS;
canvas.width = canvasWidth * morpheus.CanvasUtil.BACKING_SCALE; canvas.width = canvasWidth * morpheus.CanvasUtil.BACKING_SCALE;
canvas.style.width = canvasWidth + 'px'; canvas.style.width = canvasWidth + 'px';
canvas.height = heatMapHeight * morpheus.CanvasUtil.BACKING_SCALE; canvas.height = heatMapHeight * morpheus.CanvasUtil.BACKING_SCALE;
canvas.style.height = heatMapHeight + 'px'; canvas.style.height = heatMapHeight + 'px';
var context = canvas.getContext('2d'); var context = canvas.getContext('2d');
...@@ -2210,25 +2245,51 @@ morpheus.HeatMap.prototype = { ...@@ -2210,25 +2245,51 @@ morpheus.HeatMap.prototype = {
trackWidth += track.getUnscaledWidth(); trackWidth += track.getUnscaledWidth();
} }
} }
var $wrapper = $('<div></div>'); $(canvas).appendTo($wrapper);
canvas.style.top = wrapperHeight + 'px';
wrapperHeight += parseFloat(canvas.style.height);
wrapperWidth = parseFloat(canvas.style.width);
} else {
inline.push(row);
}
}
if (found) {
$wrapper.css({ $wrapper.css({
height: canvas.style.height, height: wrapperHeight,
width: parseFloat(canvas.style.width) width: wrapperWidth
}); });
$(canvas).appendTo($wrapper);
var rect = this.$parent[0].getBoundingClientRect(); var rect = this.$parent[0].getBoundingClientRect();
this.$tipFollow.html($wrapper).css({ this.$tipFollow.html($wrapper).css({
left: parseFloat(this.heatmap.canvas.style.left) - 1, left: parseFloat(this.heatmap.canvas.style.left) - 1,
top: options.event.clientY - rect.top top: options.event.clientY - rect.top - wrapperHeight / 2
}); });
return; return;
} else {
var tipText = [];
var tipFollowText = [];
for (var hoverIndex = 0; hoverIndex < inline.length; hoverIndex++) {
this.tooltipProvider(this, inline[hoverIndex], -1,
options, this.tooltipMode === 0 ? '&nbsp;&nbsp;&nbsp;'
: '<br />', false, tipText);
if (this.options.inlineTooltip) {
this.tooltipProvider(this, inline[hoverIndex], -1,
options, '<br />', true, tipFollowText);
}
}
this._setTipText(tipText, tipFollowText, options);
}
} }
if (columnIndex != null && columnIndex.length > 0) {
// column lens for (var hoverIndex = 0; hoverIndex < columnIndex.length; hoverIndex++) {
if (columnIndex >= 0 && (columnIndex >= this.heatmap.lastPosition.right || columnIndex < this.heatmap.lastPosition.left)) { var column = columnIndex[hoverIndex];
if (column >= 0 && (column >= this.heatmap.lastPosition.right || column < this.heatmap.lastPosition.left)) {
found = true;
var heatMapHeight = this.heatmap.getUnscaledHeight(); var heatMapHeight = this.heatmap.getUnscaledHeight();
var left = columnIndex; // Math.max(0, rowIndex - 1); var left = column; // Math.max(0, rowIndex - 1);
var right = columnIndex + 1; //Math.min(rowIndex + 1, this.heatmap.rowPositions.getLength()); var right = column + 1; //Math.min(rowIndex + 1, this.heatmap.rowPositions.getLength());
var startPix = this.heatmap.columnPositions.getPosition(left); var startPix = this.heatmap.columnPositions.getPosition(left);
var endPix = startPix + this.heatmap.columnPositions.getItemSize(left); var endPix = startPix + this.heatmap.columnPositions.getItemSize(left);
var heatMapWidth = endPix - startPix; var heatMapWidth = endPix - startPix;
...@@ -2246,7 +2307,7 @@ morpheus.HeatMap.prototype = { ...@@ -2246,7 +2307,7 @@ morpheus.HeatMap.prototype = {
canvas.height = canvasHeight * morpheus.CanvasUtil.BACKING_SCALE; canvas.height = canvasHeight * morpheus.CanvasUtil.BACKING_SCALE;
canvas.style.height = canvasHeight + 'px'; canvas.style.height = canvasHeight + 'px';
var context = canvas.getContext('2d'); var context = canvas.getContext('2d');
morpheus.CanvasUtil.resetTransform(context);
context.translate(-startPix, 0); context.translate(-startPix, 0);
context.save(); context.save();
context.rect(startPix, trackHeight + morpheus.HeatMap.SPACE_BETWEEN_HEAT_MAP_AND_ANNOTATIONS, this.heatmap.lastClip.width, this.heatmap.lastClip.height + trackHeight + morpheus.HeatMap.SPACE_BETWEEN_HEAT_MAP_AND_ANNOTATIONS); context.rect(startPix, trackHeight + morpheus.HeatMap.SPACE_BETWEEN_HEAT_MAP_AND_ANNOTATIONS, this.heatmap.lastClip.width, this.heatmap.lastClip.height + trackHeight + morpheus.HeatMap.SPACE_BETWEEN_HEAT_MAP_AND_ANNOTATIONS);
...@@ -2284,56 +2345,60 @@ morpheus.HeatMap.prototype = { ...@@ -2284,56 +2345,60 @@ morpheus.HeatMap.prototype = {
trackHeight += track.getUnscaledHeight(); trackHeight += track.getUnscaledHeight();
} }
} }
canvas.style.left = wrapperWidth + 'px';
wrapperWidth += parseFloat(canvas.style.width);
wrapperHeight = parseFloat(canvas.style.height);
$(canvas).appendTo($wrapper);
} else {
inline.push(column);
}
}
var $wrapper = $('<div></div>'); if (found) {
$wrapper.css({ $wrapper.css({
width: canvas.style.width, height: wrapperHeight,
height: parseFloat(canvas.style.height) width: wrapperWidth
}); });
$(canvas).appendTo($wrapper);
var rect = this.$parent[0].getBoundingClientRect(); var rect = this.$parent[0].getBoundingClientRect();
this.$tipFollow.html($wrapper).css({ this.$tipFollow.html($wrapper).css({
top: parseFloat(this.heatmap.canvas.style.top) - trackHeight - morpheus.HeatMap.SPACE_BETWEEN_HEAT_MAP_AND_ANNOTATIONS - 1, top: parseFloat(this.heatmap.canvas.style.top) - trackHeight - morpheus.HeatMap.SPACE_BETWEEN_HEAT_MAP_AND_ANNOTATIONS - 1,
left: (options.event.clientX - rect.left) - (parseFloat(canvas.style.width) / 2) left: (options.event.clientX - rect.left) - (wrapperWidth / 2)
}); });
return; return;
} else {
var tipText = [];
var tipFollowText = [];
for (var hoverIndex = 0; hoverIndex < inline.length; hoverIndex++) {
this.tooltipProvider(this, -1, inline[hoverIndex],
options, this.tooltipMode === 0 ? '&nbsp;&nbsp;&nbsp;'
: '<br />', false, tipText);
if (this.options.inlineTooltip) {
this.tooltipProvider(this, -1, inline[hoverIndex],
options, '<br />', true, tipFollowText);
}
}
this._setTipText(tipText, tipFollowText, options);
} }
}
// column lens
} }
// tooltipMode=0 top, 1=window, 2=inline // tooltipMode=0 top, 1=window, 2=inline
var tipText = this.tooltipProvider(this, rowIndex, columnIndex, var tipText = [];
this.tooltipProvider(this, rowIndex, columnIndex,
options, this.tooltipMode === 0 ? '&nbsp;&nbsp;&nbsp;' options, this.tooltipMode === 0 ? '&nbsp;&nbsp;&nbsp;'
: '<br />'); : '<br />', false, tipText);
var tipFollowText = ''; var tipFollowText = [];
if (this.options.inlineTooltip) { if (this.options.inlineTooltip) {
tipFollowText = this.tooltipProvider(this, rowIndex, columnIndex, this.tooltipProvider(this, rowIndex, columnIndex,
options, '<br />', true); options, '<br />', true, tipFollowText);
}
if (this.tooltipMode === 0) {
this.toolbar.$tip.html(tipText);
} else if (this.tooltipMode === 1) {
this.$tipInfoWindow.html(tipText);
} }
this._setTipText(tipText, tipFollowText, options);
if (tipFollowText !== '') {
this.tipFollowHidden = false;
this.$tipFollow.html('<span style="max-width:400px;">' + tipFollowText + '</span>');
this._updateTipFollowPosition(options);
} else {
this.tipFollowHidden = true;
this.$tipFollow.html('').css({
left: -1000,
top: -1000
});
}
this.trigger('change', {
name: 'setToolTip',
source: this,
arguments: arguments
});
} }
, ,
_updateTipFollowPosition: function (options) { _updateTipFollowPosition: function (options) {
......
morpheus.HeatMapTooltipProvider = function (heatMap, rowIndex, columnIndex, morpheus.HeatMapTooltipProvider = function (heatMap, rowIndex, columnIndex,
options, separator, quick) { options, separator, quick, tipText) {
var dataset = heatMap.project.getSortedFilteredDataset(); var dataset = heatMap.project.getSortedFilteredDataset();
var tipText = [];
if (!quick) { if (!quick) {
if (options.value) { // key value pairs for custom tooltip if (options.value) { // key value pairs for custom tooltip
_.each(options.value, function (pair) { _.each(options.value, function (pair) {
...@@ -50,6 +49,21 @@ morpheus.HeatMapTooltipProvider = function (heatMap, rowIndex, columnIndex, ...@@ -50,6 +49,21 @@ morpheus.HeatMapTooltipProvider = function (heatMap, rowIndex, columnIndex,
separator); separator);
} }
} else if (quick) {
if (rowIndex !== -1) {
morpheus.HeatMapTooltipProvider._tracksToString(options,
heatMap.rowTracks.filter(function (t) {
return t.settings.inlineTooltip;
}), dataset.getRowMetadata(), rowIndex, tipText,
separator);
}
if (columnIndex !== -1) {
morpheus.HeatMapTooltipProvider._tracksToString(options,
heatMap.columnTracks.filter(function (t) {
return t.settings.inlineTooltip;
}), dataset.getColumnMetadata(), columnIndex, tipText,
separator);
}
} }
if (!quick) { if (!quick) {
...@@ -131,7 +145,7 @@ morpheus.HeatMapTooltipProvider = function (heatMap, rowIndex, columnIndex, ...@@ -131,7 +145,7 @@ morpheus.HeatMapTooltipProvider = function (heatMap, rowIndex, columnIndex,
heatMap.columnDendrogram._selectedNodeColor, separator); heatMap.columnDendrogram._selectedNodeColor, separator);
} }
} }
return tipText.join('');
}; };
morpheus.HeatMapTooltipProvider._matrixValueToString = function (dataset, morpheus.HeatMapTooltipProvider._matrixValueToString = function (dataset,
......
...@@ -13,20 +13,20 @@ morpheus.ScentedSearch = function (model, positions, isVertical, scrollbar, ...@@ -13,20 +13,20 @@ morpheus.ScentedSearch = function (model, positions, isVertical, scrollbar,
scrollbar.decorator = this; scrollbar.decorator = this;
var _this = this; var _this = this;
var mouseMove = function (e) { var mouseMove = function (e) {
var index = _this.getIndex(e); var indices = _this.getSearchIndices(e);
_this.mouseMovedIndex = index;
document.body.style.cursor = index < 0 ? 'default' : 'pointer'; document.body.style.cursor = indices.length === 0 ? 'default' : 'pointer';
scrollbar.canvas.style.cursor = index < 0 ? 'default' : 'pointer'; scrollbar.canvas.style.cursor = indices.length === 0 ? 'default' : 'pointer';
var tipOptions = { var tipOptions = {
event: e, event: e,
heatMapLens: index >= 0 heatMapLens: indices.length >= 0
}; };
if (isVertical) { if (isVertical) {
controller.setToolTip(index >= 0 ? _this.searchIndices[index] : -1, controller.setToolTip(indices.length >= 0 ? indices : null,
-1, tipOptions); -1, tipOptions);
} else { } else {
controller.setToolTip(-1, index >= 0 ? _this.searchIndices[index] controller.setToolTip(-1, indices.length >= 0 ? indices
: -1, tipOptions); : null, tipOptions);
} }
}; };
...@@ -48,6 +48,27 @@ morpheus.ScentedSearch.prototype = { ...@@ -48,6 +48,27 @@ morpheus.ScentedSearch.prototype = {
var val = pix[this.isVertical ? 'y' : 'x']; var val = pix[this.isVertical ? 'y' : 'x'];
return this.getIndexForPix(val); return this.getIndexForPix(val);
}, },
getSearchIndices: function (event) {
var pix = morpheus.CanvasUtil.getMousePos(event.target, event);
var val = pix[this.isVertical ? 'y' : 'x'];
return this.getSearchIndicesForPix(val);
},
getSearchIndicesForPix: function (pix) {
var indices = this.searchIndices;
if (indices == null) {
return [];
}
var scale = this.scale;
var tolerance = morpheus.ScentedSearch.LINE_HEIGHT;
var matches = [];
for (var i = 0, length = indices.length; i < length; i++) {
var midVal = this.positions.getPosition(indices[i]) * scale;
if (Math.abs(midVal - pix) <= tolerance) {
matches.push(indices[i]);
}
}
return matches;
},
getIndexForPix: function (pix) { getIndexForPix: function (pix) {
var indices = this.searchIndices; var indices = this.searchIndices;
if (indices == null) { if (indices == null) {
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment