Skip to content

GitLab

M
morpheus.js
Commit 48a2fcd1 authored by Joshua Gould's avatar Joshua Gould
Browse files
Options

resize cursor tolerance

parent 64b3343f
Hide whitespace changes
Inline Side-by-side
Showing with 230 additions and 228 deletions
src/ui/vector_track_header.js
View file @ 48a2fcd1
morpheus.VectorTrackHeader = function(project, name, isColumns, controller) { morpheus.VectorTrackHeader = function (project, name, isColumns, controller) {
morpheus.AbstractCanvas.call(this); morpheus.AbstractCanvas.call(this);
this.project = project; this.project = project;
this.name = name; this.name = name;
...@@ -6,48 +6,50 @@ morpheus.VectorTrackHeader = function(project, name, isColumns, controller) { ...@@ -6,48 +6,50 @@ morpheus.VectorTrackHeader = function(project, name, isColumns, controller) {
var canvas = this.canvas; var canvas = this.canvas;
this.controller = controller; this.controller = controller;
var vector = (isColumns ? project.getFullDataset().getColumnMetadata() var vector = (isColumns ? project.getFullDataset().getColumnMetadata()
: project.getFullDataset().getRowMetadata()).getByName(name); : project.getFullDataset().getRowMetadata()).getByName(name);
if (vector && vector.getProperties().has(morpheus.VectorKeys.TITLE)) { if (vector && vector.getProperties().has(morpheus.VectorKeys.TITLE)) {
this.canvas.setAttribute('title', vector.getProperties().get( this.canvas.setAttribute('title', vector.getProperties().get(
morpheus.VectorKeys.TITLE)); morpheus.VectorKeys.TITLE));
$(this.canvas).tooltip(); $(this.canvas).tooltip();
} }
var _this = this; var _this = this;
this.setBounds({ this.setBounds({
height : this.defaultFontHeight height: this.defaultFontHeight
+ morpheus.VectorTrackHeader.FONT_OFFSET + morpheus.VectorTrackHeader.FONT_OFFSET
}); });
function getResizeCursor(pos) { function getResizeCursor(pos) {
if (isColumns) { if (isColumns) {
if (pos.y >= (_this.getUnscaledHeight() - 3)) { if (pos.y < 3 || pos.y >= (_this.getUnscaledHeight() - 3)) {
return 'ns-resize'; return 'ns-resize';
} }
} }
if (pos.x >= (_this.getUnscaledWidth() - 3)) { if (pos.x < 3 || pos.x >= (_this.getUnscaledWidth() - 3)) {
return 'ew-resize'; return 'ew-resize';
} }
} }
var mouseMove = function(event) {
var mouseMove = function (event) {
if (!morpheus.CanvasUtil.dragging) { if (!morpheus.CanvasUtil.dragging) {
var pos = morpheus.CanvasUtil.getMousePos(event.target, event); var pos = morpheus.CanvasUtil.getMousePos(event.target, event);
var cursor = getResizeCursor(pos); var cursor = getResizeCursor(pos);
canvas.style.cursor = !cursor ? 'default' : cursor; canvas.style.cursor = !cursor ? 'default' : cursor;
//document.body.style.cursor = !cursor ? 'default' : cursor;
_this.isMouseOver = true; _this.isMouseOver = true;
_this.repaint(); _this.repaint();
} }
}; };
var mouseExit = function(e) { var mouseExit = function (e) {
if (!morpheus.CanvasUtil.dragging) { if (!morpheus.CanvasUtil.dragging) {
canvas.style.cursor = 'default'; canvas.style.cursor = 'default';
} }
_this.isMouseOver = false; _this.isMouseOver = false;
_this.repaint(); _this.repaint();
}; };
var showPopup = function(e) { var showPopup = function (e) {
controller.setSelectedTrack(_this.name, isColumns); controller.setSelectedTrack(_this.name, isColumns);
var track = controller.getTrack(_this.name, isColumns); var track = controller.getTrack(_this.name, isColumns);
if (!track) { if (!track) {
...@@ -65,9 +67,9 @@ morpheus.VectorTrackHeader = function(project, name, isColumns, controller) { ...@@ -65,9 +67,9 @@ morpheus.VectorTrackHeader = function(project, name, isColumns, controller) {
}; };
this.selectedBackgroundColor = '#c8c8c8'; this.selectedBackgroundColor = '#c8c8c8';
this.backgroundColor = '#f9f9f9'; this.backgroundColor = '#f9f9f9';
$(this.canvas).css('background-color', this.backgroundColor).on( $(this.canvas).css({'background-color': this.backgroundColor}).on(
'mousemove.morpheus', mouseMove).on('mouseout.morpheus', mouseExit) 'mousemove.morpheus', mouseMove).on('mouseout.morpheus', mouseExit)
.on('mouseenter.morpheus', mouseMove); .on('mouseenter.morpheus', mouseMove);
$(this.canvas).on('contextmenu.morpheus', showPopup); $(this.canvas).on('contextmenu.morpheus', showPopup);
...@@ -84,207 +86,207 @@ morpheus.VectorTrackHeader = function(project, name, isColumns, controller) { ...@@ -84,207 +86,207 @@ morpheus.VectorTrackHeader = function(project, name, isColumns, controller) {
// }, 100); // }, 100);
// $(canvas).on('mouseout', throttled).on('mousemove', throttled); // $(canvas).on('mouseout', throttled).on('mousemove', throttled);
this.hammer = morpheus.Util this.hammer = morpheus.Util
.hammer(canvas, [ 'pan', 'tap', 'longpress' ]) .hammer(canvas, ['pan', 'tap', 'longpress'])
.on('longpress', function(event) { .on('longpress', function (event) {
event.preventDefault();
controller.setSelectedTrack(_this.name, isColumns);
var track = controller.getTrack(_this.name, isColumns);
track.showPopup(event.srcEvent, true);
})
.on(
'panend',
function (event) {
_this.isMouseOver = false;
morpheus.CanvasUtil.dragging = false;
canvas.style.cursor = 'default';
var index = controller.getTrackIndex(_this.name,
isColumns);
var header = controller.getTrackHeaderByIndex(index,
isColumns);
var track = controller
.getTrackByIndex(index, isColumns);
var $canvas = $(track.canvas);
$canvas.css('z-index', '0');
$(header.canvas).css('z-index', '0');
controller.revalidate();
})
.on(
'panstart',
function (event) {
_this.isMouseOver = false;
if (morpheus.CanvasUtil.dragging) {
return;
}
resizeCursor = getResizeCursor(morpheus.CanvasUtil
.getMousePos(event.target, event, true));
if (resizeCursor) { // make sure start event was on
// hotspot
morpheus.CanvasUtil.dragging = true;
canvas.style.cursor = resizeCursor;
dragStartWidth = _this.getUnscaledWidth();
dragStartHeight = _this.getUnscaledHeight();
event.preventDefault(); event.preventDefault();
dragging = false;
} else {
var index = controller.getTrackIndex(_this.name,
isColumns);
if (index == -1) {
throw _this.name + ' not found';
}
var header = controller.getTrackHeaderByIndex(
index, isColumns);
var track = controller.getTrackByIndex(index,
isColumns);
controller.setSelectedTrack(_this.name, isColumns); controller.setSelectedTrack(_this.name, isColumns);
var track = controller.getTrack(_this.name, isColumns); var $canvas = $(track.canvas);
track.showPopup(event.srcEvent, true); dragStartPosition = $canvas.position();
}) $canvas.css('z-index', '100');
.on( $(header.canvas).css('z-index', '100');
'panend', morpheus.CanvasUtil.dragging = true;
function(event) { resizeCursor = undefined;
_this.isMouseOver = false; dragging = true;
morpheus.CanvasUtil.dragging = false; }
canvas.style.cursor = 'default'; })
var index = controller.getTrackIndex(_this.name, .on(
isColumns); 'panmove',
var header = controller.getTrackHeaderByIndex(index, function (event) {
isColumns); _this.isMouseOver = false;
var track = controller if (resizeCursor) {
.getTrackByIndex(index, isColumns); var width;
var $canvas = $(track.canvas); var height;
$canvas.css('z-index', '0'); if (resizeCursor === 'ew-resize') {
$(header.canvas).css('z-index', '0'); var dx = event.deltaX;
controller.revalidate(); width = Math.max(8, dragStartWidth + dx);
}) }
.on(
'panstart',
function(event) {
_this.isMouseOver = false;
if (morpheus.CanvasUtil.dragging) {
return;
}
resizeCursor = getResizeCursor(morpheus.CanvasUtil
.getMousePos(event.target, event, true));
if (resizeCursor) { // make sure start event was on
// hotspot
morpheus.CanvasUtil.dragging = true;
canvas.style.cursor = resizeCursor;
dragStartWidth = _this.getUnscaledWidth();
dragStartHeight = _this.getUnscaledHeight();
event.preventDefault();
dragging = false;
} else {
var index = controller.getTrackIndex(_this.name,
isColumns);
if (index == -1) {
throw _this.name + ' not found';
}
var header = controller.getTrackHeaderByIndex(
index, isColumns);
var track = controller.getTrackByIndex(index,
isColumns);
controller.setSelectedTrack(_this.name, isColumns);
var $canvas = $(track.canvas);
dragStartPosition = $canvas.position();
$canvas.css('z-index', '100');
$(header.canvas).css('z-index', '100');
morpheus.CanvasUtil.dragging = true;
resizeCursor = undefined;
dragging = true;
}
})
.on(
'panmove',
function(event) {
_this.isMouseOver = false;
if (resizeCursor) {
var width;
var height;
if (resizeCursor === 'ew-resize') {
var dx = event.deltaX;
width = Math.max(8, dragStartWidth + dx);
}
if (resizeCursor === 'ns-resize') { if (resizeCursor === 'ns-resize') {
var dy = event.deltaY; var dy = event.deltaY;
height = Math.max(8, dragStartHeight + dy); height = Math.max(8, dragStartHeight + dy);
} }
controller.resizeTrack(_this.name, width, height, controller.resizeTrack(_this.name, width, height,
isColumns); isColumns);
} else if (dragging) { // reorder } else if (dragging) { // reorder
var index = controller.getTrackIndex(_this.name, var index = controller.getTrackIndex(_this.name,
isColumns); isColumns);
var header = controller.getTrackHeaderByIndex( var header = controller.getTrackHeaderByIndex(
index, isColumns); index, isColumns);
var track = controller.getTrackByIndex(index, var track = controller.getTrackByIndex(index,
isColumns); isColumns);
var ntracks = controller.getNumTracks(isColumns); var ntracks = controller.getNumTracks(isColumns);
var delta = isColumns ? event.deltaY : event.deltaX; var delta = isColumns ? event.deltaY : event.deltaX;
var newIndex = index + (delta > 0 ? 1 : -1); var newIndex = index + (delta > 0 ? 1 : -1);
newIndex = Math.min(Math.max(0, newIndex), newIndex = Math.min(Math.max(0, newIndex),
ntracks - 1); ntracks - 1);
var prop = isColumns ? 'top' : 'left'; var prop = isColumns ? 'top' : 'left';
var w = isColumns ? 'getUnscaledHeight' var w = isColumns ? 'getUnscaledHeight'
: 'getUnscaledWidth'; : 'getUnscaledWidth';
var trackBounds = {}; var trackBounds = {};
trackBounds[prop] = dragStartPosition[prop] + delta; trackBounds[prop] = dragStartPosition[prop] + delta;
track.setBounds(trackBounds); track.setBounds(trackBounds);
header.setBounds(trackBounds); header.setBounds(trackBounds);
var dragOverTrack = controller.getTrackByIndex( var dragOverTrack = controller.getTrackByIndex(
newIndex, isColumns); newIndex, isColumns);
var dragOverWidth = dragOverTrack[w](); var dragOverWidth = dragOverTrack[w]();
var dragOverLeft = $(dragOverTrack.canvas) var dragOverLeft = $(dragOverTrack.canvas)
.position()[prop]; .position()[prop];
var dragleft = dragStartPosition[prop] + delta; var dragleft = dragStartPosition[prop] + delta;
var dragright = dragleft + track[w](); var dragright = dragleft + track[w]();
if ((delta > 0 && dragright >= dragOverLeft if ((delta > 0 && dragright >= dragOverLeft
+ dragOverWidth / 2) + dragOverWidth / 2)
|| (delta < 0 && dragleft <= dragOverLeft || (delta < 0 && dragleft <= dragOverLeft
+ dragOverWidth / 2)) { + dragOverWidth / 2)) {
if (index !== newIndex) { if (index !== newIndex) {
controller.moveTrack(index, newIndex, controller.moveTrack(index, newIndex,
isColumns); isColumns);
var otherHeader = controller var otherHeader = controller
.getTrackHeaderByIndex(index, .getTrackHeaderByIndex(index,
isColumns); isColumns);
var otherTrack = controller var otherTrack = controller
.getTrackByIndex(index, isColumns); .getTrackByIndex(index, isColumns);
var $movedCanvas = $(otherTrack.canvas); var $movedCanvas = $(otherTrack.canvas);
var newLeft = $movedCanvas.position()[prop]; var newLeft = $movedCanvas.position()[prop];
if (delta < 0) { if (delta < 0) {
newLeft += track[w](); newLeft += track[w]();
} else { } else {
newLeft -= track[w](); newLeft -= track[w]();
}
var otherBounds = {};
otherBounds[prop] = newLeft;
otherTrack.setBounds(otherBounds);
otherHeader.setBounds(otherBounds);
}
}
}
})
.on(
'tap',
function(event) {
if (morpheus.Util.IS_MAC && event.srcEvent.ctrlKey) { // right-click
return;
}
_this.isMouseOver = false;
controller.setSelectedTrack(_this.name, isColumns);
if (isColumns && !controller.options.columnsSortable) {
return;
}
if (!isColumns && !controller.options.rowsSortable) {
return;
} }
var otherBounds = {};
otherBounds[prop] = newLeft;
otherTrack.setBounds(otherBounds);
otherHeader.setBounds(otherBounds);
}
}
}
})
.on(
'tap',
function (event) {
if (morpheus.Util.IS_MAC && event.srcEvent.ctrlKey) { // right-click
return;
}
_this.isMouseOver = false;
controller.setSelectedTrack(_this.name, isColumns);
if (isColumns && !controller.options.columnsSortable) {
return;
}
if (!isColumns && !controller.options.rowsSortable) {
return;
}
var additionalSort = event.srcEvent.shiftKey; var additionalSort = event.srcEvent.shiftKey;
var isGroupBy = false; // event.srcEvent.altKey; var isGroupBy = false; // event.srcEvent.altKey;
var existingSortKeyIndex = _this var existingSortKeyIndex = _this
.getSortKeyIndexForColumnName(_this .getSortKeyIndexForColumnName(_this
.getSortKeys(), _this.name); .getSortKeys(), _this.name);
var sortOrder; var sortOrder;
var sortKey; var sortKey;
if (existingSortKeyIndex != -1) { if (existingSortKeyIndex != -1) {
sortKey = _this.getSortKeys()[existingSortKeyIndex]; sortKey = _this.getSortKeys()[existingSortKeyIndex];
if (sortKey.getSortOrder() === morpheus.SortKey.SortOrder.UNSORTED) { if (sortKey.getSortOrder() === morpheus.SortKey.SortOrder.UNSORTED) {
sortOrder = morpheus.SortKey.SortOrder.ASCENDING; // 1st sortOrder = morpheus.SortKey.SortOrder.ASCENDING; // 1st
// click // click
} else if (sortKey.getSortOrder() === morpheus.SortKey.SortOrder.ASCENDING) { } else if (sortKey.getSortOrder() === morpheus.SortKey.SortOrder.ASCENDING) {
sortOrder = morpheus.SortKey.SortOrder.DESCENDING; // 2nd sortOrder = morpheus.SortKey.SortOrder.DESCENDING; // 2nd
// click // click
} else { } else {
sortOrder = morpheus.SortKey.SortOrder.UNSORTED; // 3rd sortOrder = morpheus.SortKey.SortOrder.UNSORTED; // 3rd
// click // click
} }
} else { } else {
sortKey = new morpheus.SortKey(_this.name, sortKey = new morpheus.SortKey(_this.name,
morpheus.SortKey.SortOrder.ASCENDING); morpheus.SortKey.SortOrder.ASCENDING);
sortOrder = morpheus.SortKey.SortOrder.ASCENDING; sortOrder = morpheus.SortKey.SortOrder.ASCENDING;
} }
if (sortKey != null) { if (sortKey != null) {
sortKey.setSortOrder(sortOrder); sortKey.setSortOrder(sortOrder);
_this.setSortingStatus(_this.getSortKeys(), _this.setSortingStatus(_this.getSortKeys(),
sortKey, additionalSort, isGroupBy); sortKey, additionalSort, isGroupBy);
} }
// } // }
}); });
}; };
morpheus.VectorTrackHeader.FONT_OFFSET = 2; morpheus.VectorTrackHeader.FONT_OFFSET = 2;
morpheus.VectorTrackHeader.prototype = { morpheus.VectorTrackHeader.prototype = {
selected : false, selected: false,
isMouseOver : false, isMouseOver: false,
defaultFontHeight : 11, defaultFontHeight: 11,
dispose : function() { dispose: function () {
morpheus.AbstractCanvas.prototype.dispose.call(this); morpheus.AbstractCanvas.prototype.dispose.call(this);
$(this.canvas) $(this.canvas)
.off( .off(
'contextmenu.morpheus mousemove.morpheus mouseout.morpheus mouseenter.morpheus'); 'contextmenu.morpheus mousemove.morpheus mouseout.morpheus mouseenter.morpheus');
this.hammer.destroy(); this.hammer.destroy();
}, },
getPreferredSize : function() { getPreferredSize: function () {
var size = this.getPrintSize(); var size = this.getPrintSize();
size.width += 22; size.width += 22;
if (!this.isColumns) { if (!this.isColumns) {
size.height = this.defaultFontHeight size.height = this.defaultFontHeight
+ morpheus.VectorTrackHeader.FONT_OFFSET; + morpheus.VectorTrackHeader.FONT_OFFSET;
} }
// var vector = (this.isColumns ? this.project.getFullDataset() // var vector = (this.isColumns ? this.project.getFullDataset()
// .getColumnMetadata() : this.project.getFullDataset() // .getColumnMetadata() : this.project.getFullDataset()
...@@ -304,33 +306,33 @@ morpheus.VectorTrackHeader.prototype = { ...@@ -304,33 +306,33 @@ morpheus.VectorTrackHeader.prototype = {
// } // }
return size; return size;
}, },
getPrintSize : function() { getPrintSize: function () {
var context = this.canvas.getContext('2d'); var context = this.canvas.getContext('2d');
context.font = this.defaultFontHeight + 'px ' context.font = this.defaultFontHeight + 'px '
+ morpheus.CanvasUtil.FONT_NAME; + morpheus.CanvasUtil.FONT_NAME;
var width = 4 + context.measureText(this.name).width; var width = 4 + context.measureText(this.name).width;
return { return {
width : width, width: width,
height : this.getUnscaledHeight() height: this.getUnscaledHeight()
}; };
}, },
getSortKeys : function() { getSortKeys: function () {
return this.isColumns ? this.project.getColumnSortKeys() : this.project return this.isColumns ? this.project.getColumnSortKeys() : this.project
.getRowSortKeys(); .getRowSortKeys();
}, },
setOrder : function(sortKeys) { setOrder: function (sortKeys) {
if (this.isColumns) { if (this.isColumns) {
this.project.setColumnSortKeys(morpheus.SortKey this.project.setColumnSortKeys(morpheus.SortKey
.keepExistingSortKeys(sortKeys, this.project .keepExistingSortKeys(sortKeys, this.project
.getColumnSortKeys()), false); .getColumnSortKeys()), false);
} else { } else {
this.project.setRowSortKeys(morpheus.SortKey.keepExistingSortKeys( this.project.setRowSortKeys(morpheus.SortKey.keepExistingSortKeys(
sortKeys, this.project.getRowSortKeys()), false); sortKeys, this.project.getRowSortKeys()), false);
} }
}, },
setGroupBy : function(groupBy) { setGroupBy: function (groupBy) {
var existingGroupBy = this.isColumns ? this.project.groupColumns var existingGroupBy = this.isColumns ? this.project.groupColumns
: this.project.groupRows; : this.project.groupRows;
// see if already exists, if so remove it // see if already exists, if so remove it
var index = -1; var index = -1;
for (var i = 0, length = existingGroupBy.length; i < length; i++) { for (var i = 0, length = existingGroupBy.length; i < length; i++) {
...@@ -339,7 +341,7 @@ morpheus.VectorTrackHeader.prototype = { ...@@ -339,7 +341,7 @@ morpheus.VectorTrackHeader.prototype = {
break; break;
} }
} }
var newGroupBy = [ groupBy ]; var newGroupBy = [groupBy];
if (index !== -1) { if (index !== -1) {
newGroupBy = existingGroupBy; newGroupBy = existingGroupBy;
newGroupBy.splice(index, 1); newGroupBy.splice(index, 1);
...@@ -350,31 +352,31 @@ morpheus.VectorTrackHeader.prototype = { ...@@ -350,31 +352,31 @@ morpheus.VectorTrackHeader.prototype = {
this.project.setGroupRows(newGroupBy, true); this.project.setGroupRows(newGroupBy, true);
} }
}, },
setSelected : function(selected) { setSelected: function (selected) {
if (selected != this.selected) { if (selected != this.selected) {
this.selected = selected; this.selected = selected;
$(this.canvas) $(this.canvas)
.css( .css(
{ {
'background-color' : this.selected ? this.selectedBackgroundColor 'background-color': this.selected ? this.selectedBackgroundColor
: this.backgroundColor : this.backgroundColor
}); });
} }
}, },
setSortingStatus : function(sortKeys, sortKey, additionalSort, isGroupBy) { setSortingStatus: function (sortKeys, sortKey, additionalSort, isGroupBy) {
if (!isGroupBy) { if (!isGroupBy) {
if (sortKey.getSortOrder() == morpheus.SortKey.SortOrder.UNSORTED if (sortKey.getSortOrder() == morpheus.SortKey.SortOrder.UNSORTED
&& !additionalSort) { && !additionalSort) {
this.setOrder([]); this.setOrder([]);
} else { } else {
if (additionalSort && sortKeys.length == 0) { if (additionalSort && sortKeys.length == 0) {
additionalSort = false; additionalSort = false;
} }
if (!additionalSort) { if (!additionalSort) {
sortKeys = [ sortKey ]; sortKeys = [sortKey];
} else { } else {
var sortKeyIndex = this.getSortKeyIndexForColumnName( var sortKeyIndex = this.getSortKeyIndexForColumnName(
sortKeys, sortKey.toString()); sortKeys, sortKey.toString());
if (sortKeyIndex === -1) { // new sort column if (sortKeyIndex === -1) { // new sort column
sortKeys.push(sortKey); sortKeys.push(sortKey);
} else { // change sort order of existing sort column } else { // change sort order of existing sort column
...@@ -394,7 +396,7 @@ morpheus.VectorTrackHeader.prototype = { ...@@ -394,7 +396,7 @@ morpheus.VectorTrackHeader.prototype = {
} }
} }
}, },
getSortKeyIndexForColumnName : function(sortKeys, columnName) { getSortKeyIndexForColumnName: function (sortKeys, columnName) {
if (sortKeys != null) { if (sortKeys != null) {
for (var i = 0, size = sortKeys.length; i < size; i++) { for (var i = 0, size = sortKeys.length; i < size; i++) {
if (columnName === sortKeys[i].toString()) { if (columnName === sortKeys[i].toString()) {
...@@ -404,7 +406,7 @@ morpheus.VectorTrackHeader.prototype = { ...@@ -404,7 +406,7 @@ morpheus.VectorTrackHeader.prototype = {
} }
return -1; return -1;
}, },
print : function(clip, context) { print: function (clip, context) {
if (clip.height <= 6) { if (clip.height <= 6) {
return; return;
} }
...@@ -413,23 +415,23 @@ morpheus.VectorTrackHeader.prototype = { ...@@ -413,23 +415,23 @@ morpheus.VectorTrackHeader.prototype = {
context.textAlign = 'right'; context.textAlign = 'right';
context.font = Math.min(this.defaultFontHeight, clip.height context.font = Math.min(this.defaultFontHeight, clip.height
- morpheus.VectorTrackHeader.FONT_OFFSET) - morpheus.VectorTrackHeader.FONT_OFFSET)
+ 'px ' + morpheus.CanvasUtil.FONT_NAME; + 'px ' + morpheus.CanvasUtil.FONT_NAME;
} else { } else {
context.textAlign = 'left'; context.textAlign = 'left';
context.font = (clip.height - morpheus.VectorTrackHeader.FONT_OFFSET) context.font = (clip.height - morpheus.VectorTrackHeader.FONT_OFFSET)
+ 'px ' + morpheus.CanvasUtil.FONT_NAME; + 'px ' + morpheus.CanvasUtil.FONT_NAME;
} }
context.fillStyle = morpheus.CanvasUtil.FONT_COLOR; context.fillStyle = morpheus.CanvasUtil.FONT_COLOR;
context.fillText(this.name, 0, 0); context.fillText(this.name, 0, 0);
}, },
draw : function(clip, context) { draw: function (clip, context) {
var sortKeys = this.getSortKeys(); var sortKeys = this.getSortKeys();
var name = this.name; var name = this.name;
var existingSortKeyIndex = this.getSortKeyIndexForColumnName(sortKeys, var existingSortKeyIndex = this.getSortKeyIndexForColumnName(sortKeys,
name); name);
morpheus.CanvasUtil.resetTransform(context); morpheus.CanvasUtil.resetTransform(context);
context.clearRect(0, 0, this.getUnscaledWidth(), this context.clearRect(0, 0, this.getUnscaledWidth(), this
.getUnscaledHeight()); .getUnscaledHeight());
if (this.getUnscaledHeight() < 5) { if (this.getUnscaledHeight() < 5) {
return; return;
...@@ -449,11 +451,11 @@ morpheus.VectorTrackHeader.prototype = { ...@@ -449,11 +451,11 @@ morpheus.VectorTrackHeader.prototype = {
context.textAlign = 'left'; context.textAlign = 'left';
} }
var fontHeight = Math.min(this.defaultFontHeight, this var fontHeight = Math.min(this.defaultFontHeight, this
.getUnscaledHeight() .getUnscaledHeight()
- morpheus.VectorTrackHeader.FONT_OFFSET); - morpheus.VectorTrackHeader.FONT_OFFSET);
var squished = this.controller.getTrack(this.name, this.isColumns).settings.squished; var squished = this.controller.getTrack(this.name, this.isColumns).settings.squished;
context.font = (squished ? 'Italic ' : '') + fontHeight + 'px ' context.font = (squished ? 'Italic ' : '') + fontHeight + 'px '
+ morpheus.CanvasUtil.FONT_NAME; + morpheus.CanvasUtil.FONT_NAME;
var textWidth = context.measureText(name).width; var textWidth = context.measureText(name).width;
var isColumns = this.isColumns; var isColumns = this.isColumns;
var xpix = this.isColumns ? this.getUnscaledWidth() - 2 : 10; var xpix = this.isColumns ? this.getUnscaledWidth() - 2 : 10;
...@@ -466,7 +468,7 @@ morpheus.VectorTrackHeader.prototype = { ...@@ -466,7 +468,7 @@ morpheus.VectorTrackHeader.prototype = {
} }
} }
var ypix = this.isColumns ? (this.getUnscaledHeight() / 2) var ypix = this.isColumns ? (this.getUnscaledHeight() / 2)
: (this.getUnscaledHeight() - (this.defaultFontHeight + morpheus.VectorTrackHeader.FONT_OFFSET) / 2); : (this.getUnscaledHeight() - (this.defaultFontHeight + morpheus.VectorTrackHeader.FONT_OFFSET) / 2);
context.textBaseline = 'middle'; context.textBaseline = 'middle';
if (this.isMouseOver) { if (this.isMouseOver) {
context.fillStyle = 'rgb(0,0,0)'; context.fillStyle = 'rgb(0,0,0)';
...@@ -640,9 +642,9 @@ morpheus.VectorTrackHeader.prototype = { ...@@ -640,9 +642,9 @@ morpheus.VectorTrackHeader.prototype = {
context.textAlign = 'left'; context.textAlign = 'left';
context.font = '8px ' + morpheus.CanvasUtil.FONT_NAME; context.font = '8px ' + morpheus.CanvasUtil.FONT_NAME;
context.fillText('' + (existingSortKeyIndex + 1), x + 4, context.fillText('' + (existingSortKeyIndex + 1), x + 4,
ypix - 3); ypix - 3);
} }
} }
} }
}; };
morpheus.Util.extend(morpheus.VectorTrackHeader, morpheus.AbstractCanvas); morpheus.Util.extend(morpheus.VectorTrackHeader, morpheus.AbstractCanvas);
\ No newline at end of file
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