Skip to content

GitLab

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

scroll lens updates

parent db2d4b78
Hide whitespace changes
Inline Side-by-side
Showing with 469 additions and 480 deletions
src/ui/heat_map.js
View file @ d75438e8
......@@ -2316,9 +2316,10 @@ morpheus.HeatMap.prototype = {
} else if (this.tooltipMode === 1) {
this.$tipInfoWindow.html(tipText);
}
if (tipFollowText !== '') {
this.tipFollowHidden = false;
this.$tipFollow.css('class', 'morpheus-tip-inline morpheus-padding-ver').html('<span style="max-width:400px;">' + tipFollowText + '</span>');
this.$tipFollow.html('<span style="max-width:400px;">' + tipFollowText + '</span>');
this._updateTipFollowPosition(options);
} else {
this.tipFollowHidden = true;
......
src/ui/heat_map_toolbar.js
View file @ d75438e8
morpheus.HeatMapToolBar = function(controller) {
morpheus.HeatMapToolBar = function (controller) {
this.controller = controller;
this.rowSearchResultModelIndices = [];
this.columnSearchResultModelIndices = [];
var _this = this;
var $el = $('<div name="toolbar" class=" hidden-print container-fluid">'
+ '<div class="row"><div name="toolbarSearch" class="col-xs-12"></div></div>'
+ '<div class="row"><div name="toolbarButtons" class="col-xs-12" style="border-bottom: 1px solid #e7e7e7;padding-bottom:4px; margin-bottom:14px;"></div></div>'
+ '</div>');
+ '<div class="row"><div name="lineOneColumn" class="col-xs-12"></div></div>'
+ '<div class="row"><div name="lineTwoColumn" class="col-xs-12" style="border-bottom: 1px solid #e7e7e7;padding-bottom:4px; margin-bottom:14px;"></div></div>'
+ '</div>');
var searchHtml = [];
var $search = $('<form name="searchForm" class="form form-inline" role="search"></form>');
$search.on('submit', function(e) {
$search.on('submit', function (e) {
e.preventDefault();
});
// search rows
if (controller.options.toolbar.searchRows) {
searchHtml.push('<div class="form-group">');
searchHtml.push('<div class="input-group input-group-sm">'); // group
searchHtml.push('<div class="input-group input-group-sm">');
searchHtml.push('<div class="input-group-btn">');
searchHtml
.push('<button type="button" class="btn btn-default btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><span data-toggle="tooltip" title="Search rows. Quote search term for exact match. Narrow search with field: modifier. Exclude matches using - modifier. Use min..max to perform a range search.">Rows</span> <span class="caret"></span></button>');
.push('<button type="button" class="btn btn-default btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><span data-toggle="tooltip" title="Search rows. Quote search term for exact match. Narrow search with field: modifier. Exclude matches using - modifier. Use min..max to perform a range search.">Rows</span> <span class="caret"></span></button>');
searchHtml.push('<ul name="rowSearchOptions" class="dropdown-menu">');
searchHtml.push('<li><a name="exact" href="#">Exact Match</a></li>');
searchHtml
.push('<li class="active"><a name="contains" href="#">Contains</a></li>');
.push('<li class="active"><a name="contains" href="#">Contains</a></li>');
searchHtml.push('</ul>');
searchHtml.push('</div>'); // input-group-btn
searchHtml
.push('<input type="text" style="width:240px;padding-right:25px;" class="form-control input-sm" autocomplete="off" name="searchRows">');
.push('<input type="text" style="border-top:3px solid rgb(127,127,127);width:240px;padding-buttons:25px;" class="form-control input-sm" autocomplete="off" name="searchRows">');
searchHtml.push('</div>');
searchHtml.push('</div>');
searchHtml.push('<div class="form-group">');
searchHtml.push('<span name="rowSearchDiv" style="display:none;">');
searchHtml
.push('<h6 name="searchResultsRows" style="display: inline;"></h6>');
.push('<h6 name="searchResultsRows" style="display: inline;"></h6>');
searchHtml
.push('<button name="previousRowMatch" type="button" class="btn btn-default btn-xs" data-toggle="tooltip" title="Previous"><i class="fa fa-chevron-up"></i></button>');
.push('<button name="previousRowMatch" type="button" class="btn btn-default btn-xs" data-toggle="tooltip" title="Previous"><i class="fa fa-chevron-up"></i></button>');
searchHtml
.push('<button name="nextRowMatch" type="button" class="btn btn-default btn-xs" data-toggle="tooltip" title="Next"><i class="fa fa-chevron-down"></i></button>');
.push('<button name="nextRowMatch" type="button" class="btn btn-default btn-xs" data-toggle="tooltip" title="Next"><i class="fa fa-chevron-down"></i></button>');
searchHtml
.push('<button name="rowMatchesToTop" type="button" class="btn btn-default btn-xs" data-toggle="tooltip" title="Matches To Top"><i class="fa fa-level-up"></i></button>');
.push('<button name="rowMatchesToTop" type="button" class="btn btn-default btn-xs" data-toggle="tooltip" title="Matches To Top"><i class="fa fa-level-up"></i></button>');
searchHtml.push('</span>');
searchHtml.push('</div>');
}
if (controller.options.toolbar.searchColumns) {
searchHtml
.push('<div class="form-group" style="margin-right:18px;"></div>'); // spacer
.push('<div class="form-group" style="margin-buttons:18px;"></div>'); // spacer
// search columns
searchHtml.push('<div class="form-group">');
searchHtml.push('<div class="input-group input-group-sm">'); // group
searchHtml.push('<div class="input-group-btn">');
searchHtml
.push('<button type="button" class="btn btn-default btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><span data-toggle="tooltip" title="Search columns. Quote search term for exact match. Narrow search with field: modifier. Exclude matches using - modifier. Use min..max to perform a range search.">Columns</span> <span class="caret"></span></button>');
.push('<button type="button" class="btn btn-default btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><span data-toggle="tooltip" title="Search columns. Quote search term for exact match. Narrow search with field: modifier. Exclude matches using - modifier. Use min..max to perform a range search.">Columns</span> <span class="caret"></span></button>');
searchHtml
.push('<ul name="columnSearchOptions" class="dropdown-menu">');
.push('<ul name="columnSearchOptions" class="dropdown-menu">');
searchHtml.push('<li><a name="exact" href="#">Exact Match</a></li>');
searchHtml
.push('<li class="active"><a name="contains" href="#">Contains</a></li>');
.push('<li class="active"><a name="contains" href="#">Contains</a></li>');
searchHtml.push('</ul>');
searchHtml.push('</div>'); // input-group-btn
searchHtml
.push('<input type="text" style="width:240px;padding-right:25px;" class="form-control input-sm" autocapitalize="off" autocomplete="off" name="searchColumns"></div>');
.push('<input type="text" style="border-buttons:4px solid rgb(127,127,127);width:240px;padding-buttons:25px;" class="form-control input-sm" autocapitalize="off" autocomplete="off" name="searchColumns"></div>');
searchHtml.push('</div>');
searchHtml.push('</div>');
searchHtml.push('<div class="form-group" style="margin-left:4px;">');
searchHtml
.push('<h6 name="searchResultsColumns" style="display: inline;"></h6>');
.push('<h6 name="searchResultsColumns" style="display: inline;"></h6>');
searchHtml.push('<span name="columnSearchDiv" style="display:none;">');
searchHtml
.push('<button name="previousColumnMatch" type="button" class="btn btn-default btn-xs" data-toggle="tooltip" title="Previous"><i class="fa fa-chevron-up"></i></button>');
.push('<button name="previousColumnMatch" type="button" class="btn btn-default btn-xs" data-toggle="tooltip" title="Previous"><i class="fa fa-chevron-up"></i></button>');
searchHtml
.push('<button name="nextColumnMatch" type="button" class="btn btn-default btn-xs" data-toggle="tooltip" title="Next"><i class="fa fa-chevron-down"></i></button>');
.push('<button name="nextColumnMatch" type="button" class="btn btn-default btn-xs" data-toggle="tooltip" title="Next"><i class="fa fa-chevron-down"></i></button>');
searchHtml
.push('<button name="columnMatchesToTop" type="button" class="btn btn-default btn-xs" data-toggle="tooltip" title="Matches To Top"><i class="fa fa-level-up"></i></button>');
.push('<button name="columnMatchesToTop" type="button" class="btn btn-default btn-xs" data-toggle="tooltip" title="Matches To Top"><i class="fa fa-level-up"></i></button>');
searchHtml.push('</span>');
searchHtml.push('</div>');
}
// search values
searchHtml
.push('<div name="searchValuesDiv" class="form-group" style="margin-left:18px;">');
.push('<div name="searchValuesDiv" class="form-group" style="margin-left:18px;">');
searchHtml
.push('<div class="input-group input-group-sm"><span class="input-group-addon">Values</span><input type="text" style="width:240px;padding-right:25px;" class="form-control input-sm" autocapitalize="off" autocomplete="off" name="searchValues"></div>');
.push('<div class="input-group input-group-sm"><span class="input-group-addon">Values</span><input type="text" style="width:240px;padding-buttons:25px;" class="form-control input-sm" autocapitalize="off" autocomplete="off" name="searchValues"></div>');
searchHtml.push('</div>');
searchHtml.push('<div class="form-group" style="margin-left:4px;">');
searchHtml
.push('<h6 name="searchResultsValues" style="display: inline;"></h6>');
.push('<h6 name="searchResultsValues" style="display: inline;"></h6>');
searchHtml.push('</div>');
// row dendrogram
searchHtml
.push('<div style="display: none; margin-left:18px;" name="searchRowDendrogramWrapper" class="form-group">');
.push('<div style="display: none; margin-left:18px;" name="searchRowDendrogramWrapper" class="form-group">');
searchHtml
.push('<div class="input-group input-group-sm"><span class="input-group-addon">Row Dendrogram</span><input type="text" style="width:240px;" class="form-control input-sm" autocapitalize="off" autocomplete="off" name="searchRowDendrogram"></div>');
.push('<div class="input-group input-group-sm"><span class="input-group-addon">Row Dendrogram</span><input type="text" style="width:240px;" class="form-control input-sm" autocapitalize="off" autocomplete="off" name="searchRowDendrogram"></div>');
searchHtml
.push('<h6 name="searchResultsRowDendrogram" style="display: inline;"></h6>');
.push('<h6 name="searchResultsRowDendrogram" style="display: inline;"></h6>');
searchHtml.push('</div>');
// column dendrogram
searchHtml
.push('<div style="display: none; margin-left:18px;" name="searchColumnDendrogramWrapper" class="form-group">');
.push('<div style="display: none; margin-left:18px;" name="searchColumnDendrogramWrapper" class="form-group">');
searchHtml
.push('<div class="input-group input-group-sm"><span class="input-group-addon">Column Dendrogram</span><input type="text" style="width:240px;" class="form-control input-sm" autocapitalize="off" autocomplete="off" name="searchColumnDendrogram"></div>');
.push('<div class="input-group input-group-sm"><span class="input-group-addon">Column Dendrogram</span><input type="text" style="width:240px;" class="form-control input-sm" autocapitalize="off" autocomplete="off" name="searchColumnDendrogram"></div>');
searchHtml
.push('<h6 name="searchResultsColumnDendrogram" style="display: inline;"></h6>');
.push('<h6 name="searchResultsColumnDendrogram" style="display: inline;"></h6>');
searchHtml.push('</div>');
// dimensions
searchHtml.push('<div class="form-group" name="datasetInfoGroup">');
searchHtml
.push('<h6 style="display: inline; margin-left:30px;" name="dim"></h6>');
.push('<h6 style="display: inline; margin-left:30px;" name="dim"></h6>');
searchHtml
.push('<h6 style="display: inline; margin-left:30px;" name="selection"></h6>');
.push('<h6 style="display: inline; margin-left:30px;" name="selection"></h6>');
searchHtml.push('</div>');
searchHtml.push('<div name="right" class="form-group pull-right">');
searchHtml.push('<div name="buttons" style="margin-left:18px;" class="form-group"></div>');
// searchHtml
// .push('<div id="hangout-div"></div>');
// searchHtml
// .push('<button onclick="TogetherJS(this); return false;" type="button"
// class="btn btn-default btn-xs" title="Collaboration"><i class="fa
// fa-users"></button></i>');
// searchHtml.push('<span style="margin-left:6px;"></span>');
// searchHtml
// .push('<button name="tutorial" type="button" class="btn btn-default
// btn-xs" title="Tutorial"><i class="fa
// fa-question-circle"></button></i>');
searchHtml.push('</div>');
$(searchHtml.join('')).appendTo($search);
if (!controller.options.toolbar.searchValues) {
$search.find('[name=searchValuesDiv]').css('display', 'none');
}
if (controller.options.tour) {
var $tour = $('<button type="button" class="btn btn-default btn-xs" data-toggle="tooltip" title="Take a tour"><i class="fa fa-plane"></i></button>');
$tour.prependTo($search.find('[name=right]'));
$tour.on('click', function(e) {
e.preventDefault();
controller.options.tour(controller);
});
}
if (controller.options.$help) {
controller.options.$help.appendTo($search.find('[name=right]'));
}
var $buttons = $search.find('[name=buttons]');
var $tools = $('<form name="tools" class="form-inline" role="form"></form>');
$tools.on('submit', function(e) {
$tools.on('submit', function (e) {
e.preventDefault();
});
var $toolbarForm = $('<form name="view" class="form-inline" role="form"></form>');
$toolbarForm.on('submit', function(e) {
e.preventDefault();
});
var toolbarHtml = [];
// zoom
if (controller.options.toolbar.zoom) {
toolbarHtml.push('<div class="form-group">');
toolbarHtml
.push('<button type="button" class="btn btn-default btn-xs" data-toggle="tooltip" title="Zoom Out (-)" name="out"><span class="fa fa-minus"></span></button>');
.push('<button type="button" class="btn btn-default btn-xs" data-toggle="tooltip" title="Zoom Out (-)" name="out"><span class="fa fa-minus"></span></button>');
toolbarHtml
.push('<button type="button" class="btn btn-default btn-xs" data-toggle="tooltip" title="Zoom In (+)" name="in"><span class="fa fa-plus"></span></button>');
.push('<button type="button" class="btn btn-default btn-xs" data-toggle="tooltip" title="Zoom In (+)" name="in"><span class="fa fa-plus"></span></button>');
toolbarHtml
.push('<button type="button" class="btn btn-default btn-xs" data-toggle="tooltip" title="Fit To Window" name="fit"><span class="fa fa-compress"></span></button>');
.push('<button type="button" class="btn btn-default btn-xs" data-toggle="tooltip" title="Fit To Window" name="fit"><span class="fa fa-compress"></span></button>');
toolbarHtml
.push('<button type="button" class="btn btn-default btn-xs" data-toggle="tooltip" title="Reset Zoom" name="resetZoom">100%</button>');
.push('<button type="button" class="btn btn-default btn-xs" data-toggle="tooltip" title="Reset Zoom" name="resetZoom">100%</button>');
}
toolbarHtml.push('<div class="morpheus-button-divider"></div>');
if (controller.options.toolbar.sort) {
toolbarHtml
.push('<button data-toggle="tooltip" title="Sort" name="sort" type="button" class="btn btn-default btn-xs"><span class="fa fa-sort-alpha-asc"></span></button>');
.push('<button data-toggle="tooltip" title="Sort" name="sort" type="button" class="btn btn-default btn-xs"><span class="fa fa-sort-alpha-asc"></span></button>');
}
if (controller.options.toolbar.options) {
toolbarHtml
.push('<button name="options" data-toggle="tooltip" title="Options" type="button" class="btn btn-default btn-xs"><span class="fa fa-cog"></span></button>');
.push('<button name="options" data-toggle="tooltip" title="Options" type="button" class="btn btn-default btn-xs"><span class="fa fa-cog"></span></button>');
}
toolbarHtml.push('<div class="morpheus-button-divider"></div>');
if (controller.options.toolbar.saveImage) {
toolbarHtml
.push('<button name="saveImage" data-toggle="tooltip" title="Save Image ('
+ morpheus.Util.COMMAND_KEY
+ 'S)" type="button" class="btn btn-default btn-xs"><span class="fa fa-file-image-o"></span></button>');
.push('<button name="saveImage" data-toggle="tooltip" title="Save Image ('
+ morpheus.Util.COMMAND_KEY
+ 'S)" type="button" class="btn btn-default btn-xs"><span class="fa fa-file-image-o"></span></button>');
}
if (controller.options.toolbar.saveDataset) {
toolbarHtml
.push('<button name="saveDataset" data-toggle="tooltip" title="Save Dataset ('
+ morpheus.Util.COMMAND_KEY
+ 'Shift+S)" type="button" class="btn btn-default btn-xs"><span class="fa fa-floppy-o"></span></button>');
.push('<button name="saveDataset" data-toggle="tooltip" title="Save Dataset ('
+ morpheus.Util.COMMAND_KEY
+ 'Shift+S)" type="button" class="btn btn-default btn-xs"><span class="fa fa-floppy-o"></span></button>');
}
if (controller.options.toolbar.openFile) {
toolbarHtml
.push('<button name="openFile" data-toggle="tooltip" title="Open File ('
+ morpheus.Util.COMMAND_KEY
+ 'O)" type="button" class="btn btn-default btn-xs"><span class="fa fa-folder-open-o"></span></button>');
.push('<button name="openFile" data-toggle="tooltip" title="Open File ('
+ morpheus.Util.COMMAND_KEY
+ 'O)" type="button" class="btn btn-default btn-xs"><span class="fa fa-folder-open-o"></span></button>');
}
toolbarHtml.push('<div class="morpheus-button-divider"></div>');
if (controller.options.toolbar.filter) {
toolbarHtml
.push('<button name="filterButton" data-toggle="tooltip" title="Filter" type="button" class="btn btn-default btn-xs"><span class="fa fa-filter"></span></button>');
.push('<button name="filterButton" data-toggle="tooltip" title="Filter" type="button" class="btn btn-default btn-xs"><span class="fa fa-filter"></span></button>');
}
if (typeof Plotly !== 'undefined') {
toolbarHtml
.push('<button name="chart" data-toggle="tooltip" title="Chart" type="button" class="btn btn-default btn-xs"><span class="fa fa-line-chart"></span></button>');
.push('<button name="chart" data-toggle="tooltip" title="Chart" type="button" class="btn btn-default btn-xs"><span class="fa fa-line-chart"></span></button>');
}
var tools = [ {
tool : new morpheus.HClusterTool()
var tools = [{
tool: new morpheus.HClusterTool()
}, {
tool : new morpheus.MarkerSelection()
tool: new morpheus.MarkerSelection()
}, {
tool : new morpheus.NearestNeighbors()
tool: new morpheus.NearestNeighbors()
}, {
tool : new morpheus.NewHeatMapTool(),
tool: new morpheus.NewHeatMapTool(),
}, null, {
tool : new morpheus.AdjustDataTool()
tool: new morpheus.AdjustDataTool()
}, {
tool : new morpheus.CollapseDatasetTool()
tool: new morpheus.CollapseDatasetTool()
}, {
tool : new morpheus.CreateAnnotation()
tool: new morpheus.CreateAnnotation()
}, {
tool : new morpheus.SimilarityMatrixTool()
tool: new morpheus.SimilarityMatrixTool()
}, {
tool : new morpheus.TransposeTool()
tool: new morpheus.TransposeTool()
}, {
tool : new morpheus.WordCloudTool()
} ]; // DevAPI, {
this.getToolByName = function(name) {
tool: new morpheus.WordCloudTool()
}]; // DevAPI, {
this.getToolByName = function (name) {
for (var i = 0; i < tools.length; i++) {
if (tools[i] && tools[i].tool.toString
&& tools[i].tool.toString() === name) {
&& tools[i].tool.toString() === name) {
return tools[i].tool;
}
}
......@@ -234,19 +210,19 @@ morpheus.HeatMapToolBar = function(controller) {
if (controller.options.toolbar.tools) {
toolbarHtml.push('<div class="btn-group">');
toolbarHtml
.push('<button type="button" class="btn btn-default btn-xs dropdown-toggle" data-toggle="dropdown"><span title="Tools" data-toggle="tooltip" class="fa fa-wrench"></span> <span class="fa fa-caret-down"></span></button>');
.push('<button type="button" class="btn btn-default btn-xs dropdown-toggle" data-toggle="dropdown"><span title="Tools" data-toggle="tooltip" class="fa fa-wrench"></span> <span class="fa fa-caret-down"></span></button>');
toolbarHtml.push('<ul name="tools" class="dropdown-menu" role="menu">');
for (var i = 0; i < tools.length; i++) {
if (tools[i] == null) {
toolbarHtml
.push('<li role="presentation" class="divider"></li>');
.push('<li role="presentation" class="divider"></li>');
} else if (tools[i].action) {
toolbarHtml.push('<li><a name="' + i + '" href="#">'
+ tools[i].name + '</a></li>');
+ tools[i].name + '</a></li>');
} else {
toolbarHtml.push('<li><a name="' + i + '" href="#">'
+ tools[i].tool.toString() + '</a></li>');
+ tools[i].tool.toString() + '</a></li>');
}
}
toolbarHtml.push('</ul></div>');
......@@ -258,27 +234,25 @@ morpheus.HeatMapToolBar = function(controller) {
toolbarHtml.push('<div class="btn-group">');
toolbarHtml
.push('<button type="button" class="btn btn-default btn-xs" data-toggle="dropdown"><span title="Color Key" data-toggle="tooltip" class="fa fa-key"></span></button>');
.push('<button type="button" class="btn btn-default btn-xs" data-toggle="dropdown"><span title="Color Key" data-toggle="tooltip" class="fa fa-key"></span></button>');
toolbarHtml.push('<ul name="key" class="dropdown-menu" role="menu">');
toolbarHtml.push('<li name="keyContent"></li>');
toolbarHtml.push('</ul>');
toolbarHtml.push('</div>');
}
toolbarHtml
.push('<div style="position:relative;display:inline;margin-left:12px;"><div name="tip" class="morpheus-tip" style="overflow:hidden;"></div></div>');
toolbarHtml.push('</div>');
$search.appendTo($el.find('[name=toolbarSearch]'));
$(toolbarHtml.join('')).appendTo($toolbarForm);
$toolbarForm.appendTo($el.find('[name=toolbarButtons]'));
$search.appendTo($el.find('[name=lineOneColumn]'));
var $toolbarForm = $(toolbarHtml.join(''));
$toolbarForm.appendTo($buttons);
if (controller.options.$help) {
controller.options.$help.appendTo($buttons);
}
$('<div name="tip" style="height: 14px; font-size: 12px;overflow:hidden;"></div>').appendTo($el.find('[name=lineTwoColumn]'));
$el.prependTo(controller.$content);
// gapi.hangout.render('hangout-div', {
// 'widget_size' : '72',
// 'render' : 'createhangout'
// });
var $tools = $el.find('[name=tools]');
this.$tip = $el.find('[name=tip]');
$tools.on('click', 'li > a', function(e) {
$tools.on('click', 'li > a', function (e) {
e.preventDefault();
var index = parseInt($(this).attr('name'));
if (tools[index].tool) {
......@@ -290,42 +264,42 @@ morpheus.HeatMapToolBar = function(controller) {
this.defaultRowMatchMode = 'contains';
this.defaultColumnMatchMode = 'contains';
var $rowSearchOptions = $el.find('[name=rowSearchOptions]');
$rowSearchOptions.on('click', 'li > a', function(e) {
$rowSearchOptions.on('click', 'li > a', function (e) {
e.preventDefault();
_this.defaultRowMatchMode = $(this).attr('name');
$rowSearchOptions.find('li').removeClass('active');
$(this).parent('li').addClass('active');
_this.search(true);
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'rowSearchMatchMode'
eventCategory: 'ToolBar',
eventAction: 'rowSearchMatchMode'
});
});
var $columnSearchOptions = $el.find('[name=columnSearchOptions]');
$columnSearchOptions.on('click', 'li > a', function(e) {
$columnSearchOptions.on('click', 'li > a', function (e) {
e.preventDefault();
_this.defaultColumnMatchMode = $(this).attr('name');
$columnSearchOptions.find('li').removeClass('active');
$(this).parent('li').addClass('active');
_this.search(false);
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'columnSearchMatchMode'
eventCategory: 'ToolBar',
eventAction: 'columnSearchMatchMode'
});
});
var filterModal = [];
var filterLabelId = _.uniqueId('morpheus');
filterModal
.push('<div class="modal fade" tabindex="1" role="dialog" aria-labelledby="'
+ filterLabelId + '">');
.push('<div class="modal fade" tabindex="1" role="dialog" aria-labelledby="'
+ filterLabelId + '">');
filterModal.push('<div class="modal-dialog" role="document">');
filterModal.push('<div class="modal-content">');
filterModal.push('<div class="modal-header">');
filterModal
.push('<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>');
.push('<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>');
filterModal.push('<h4 class="modal-title" id="' + filterLabelId
+ '">Filter</h4>');
+ '">Filter</h4>');
filterModal.push('</div>');
filterModal.push('<div class="modal-body">');
filterModal.push('');
......@@ -334,7 +308,7 @@ morpheus.HeatMapToolBar = function(controller) {
filterModal.push('</div>');
filterModal.push('</div>');
var $filterModal = $(filterModal.join(''));
$filterModal.on('mousewheel', function(e) {
$filterModal.on('mousewheel', function (e) {
e.stopPropagation();
});
var $filter = $('<div></div>');
......@@ -342,40 +316,40 @@ morpheus.HeatMapToolBar = function(controller) {
$filterModal.appendTo($el);
var filterHtml = [];
filterHtml
.push('<div class="radio"><label><input type="radio" name="rowsOrColumns" value="rows" checked>Rows</label></div> ');
.push('<div class="radio"><label><input type="radio" name="rowsOrColumns" value="rows" checked>Rows</label></div> ');
filterHtml
.push('<div class="radio"><label><input type="radio" name="rowsOrColumns" value="columns">Columns</label></div>');
.push('<div class="radio"><label><input type="radio" name="rowsOrColumns" value="columns">Columns</label></div>');
var $filterChooser = $(filterHtml.join(''));
$filterChooser.appendTo($filter);
var columnFilterUI = new morpheus.FilterUI(controller.getProject(), true);
var rowFilterUI = new morpheus.FilterUI(controller.getProject(), false);
controller.getProject().getRowFilter().on('focus', function(e) {
controller.getProject().getRowFilter().on('focus', function (e) {
$filterChooser.find('[value=rows]').prop('checked', true);
columnFilterUI.$div.hide();
rowFilterUI.$div.show();
$filterModal.modal('show');
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'rowFilter'
eventCategory: 'ToolBar',
eventAction: 'rowFilter'
});
});
controller.getProject().getColumnFilter().on('focus', function(e) {
controller.getProject().getColumnFilter().on('focus', function (e) {
$filterChooser.find('[value=columns]').prop('checked', true);
columnFilterUI.$div.show();
rowFilterUI.$div.hide();
$filterModal.modal('show');
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'columnFilter'
eventCategory: 'ToolBar',
eventAction: 'columnFilter'
});
});
rowFilterUI.$div.appendTo($filter);
columnFilterUI.$div.appendTo($filter);
columnFilterUI.$div.css('display', 'none');
var $filterRadio = $filterChooser.find('[name=rowsOrColumns]');
$filterRadio.on('change', function(e) {
$filterRadio.on('change', function (e) {
var val = $filterRadio.filter(':checked').val();
if (val === 'columns') {
columnFilterUI.$div.show();
......@@ -386,67 +360,67 @@ morpheus.HeatMapToolBar = function(controller) {
}
e.preventDefault();
});
$el.find('[name=filterButton]').on('click', function() {
$el.find('[name=filterButton]').on('click', function () {
$filterModal.modal('show');
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'filter'
eventCategory: 'ToolBar',
eventAction: 'filter'
});
});
$el.find('[data-toggle="tooltip"]').tooltip({
placement : 'bottom',
container : 'body',
trigger : 'hover'
}).on('click', function() {
placement: 'bottom',
container: 'body',
trigger: 'hover'
}).on('click', function () {
$(this).tooltip('hide');
});
var $key = $el.find('[name=key]');
var $keyContent = $el.find('[name=keyContent]');
$key.dropdown().parent().on('show.bs.dropdown', function() {
$key.dropdown().parent().on('show.bs.dropdown', function () {
new morpheus.HeatMapColorSchemeLegend(controller, $keyContent);
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'colorKey'
eventCategory: 'ToolBar',
eventAction: 'colorKey'
});
});
$el.find('[name=openFile]').on('click', function() {
$el.find('[name=openFile]').on('click', function () {
morpheus.HeatMap.showTool(new morpheus.OpenFileTool({
customUrls : controller._customUrls
customUrls: controller._customUrls
}), controller);
});
$el.find('[name=saveImage]').on('click', function() {
$el.find('[name=saveImage]').on('click', function () {
morpheus.HeatMap.showTool(new morpheus.SaveImageTool(), controller);
});
$el.find('[name=saveDataset]').on('click', function() {
$el.find('[name=saveDataset]').on('click', function () {
morpheus.HeatMap.showTool(new morpheus.SaveDatasetTool(), controller);
});
$el.find('[name=chart]').on(
'click',
function() {
new morpheus.ChartTool2({
project : controller.getProject(),
getVisibleTrackNames : _.bind(
controller.getVisibleTrackNames, controller)
});
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'chart'
});
'click',
function () {
new morpheus.ChartTool2({
project: controller.getProject(),
getVisibleTrackNames: _.bind(
controller.getVisibleTrackNames, controller)
});
morpheus.Util.trackEvent({
eventCategory: 'ToolBar',
eventAction: 'chart'
});
});
var _this = this;
$el
.find('[name=tutorial]')
.on(
'click',
function() {
window
.open('http://www.broadinstitute.org/cancer/software/morpheus/tutorial.html');
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'tutorial'
});
});
.find('[name=tutorial]')
.on(
'click',
function () {
window
.open('http://www.broadinstitute.org/cancer/software/morpheus/tutorial.html');
morpheus.Util.trackEvent({
eventCategory: 'ToolBar',
eventAction: 'tutorial'
});
});
this.$previousColumnMatch = $el.find('[name=previousColumnMatch]');
this.$nextColumnMatch = $el.find('[name=nextColumnMatch]');
......@@ -462,98 +436,98 @@ morpheus.HeatMapToolBar = function(controller) {
this.$rowSearchDiv = $el.find('[name=rowSearchDiv]');
this.$columnSearchDiv = $el.find('[name=columnSearchDiv]');
this.$searchRowDendrogramWrapper = $el
.find('[name=searchRowDendrogramWrapper]');
.find('[name=searchRowDendrogramWrapper]');
this.$searchRowDendrogram = $el.find('[name=searchRowDendrogram]');
this.$searchResultsRowDendrogram = $el
.find('[name=searchResultsRowDendrogram]');
.find('[name=searchResultsRowDendrogram]');
this.$searchColumnDendrogramWrapper = $el
.find('[name=searchColumnDendrogramWrapper]');
.find('[name=searchColumnDendrogramWrapper]');
this.$searchColumnDendrogram = $el.find('[name=searchColumnDendrogram]');
this.$searchResultsColumnDendrogram = $el
.find('[name=searchResultsColumnDendrogram]');
controller.on('dendrogramAnnotated', function(e) {
.find('[name=searchResultsColumnDendrogram]');
controller.on('dendrogramAnnotated', function (e) {
(e.isColumns ? _this.$searchColumnDendrogramWrapper
: _this.$searchRowDendrogramWrapper).show();
: _this.$searchRowDendrogramWrapper).show();
});
controller.on('dendrogramChanged', function(e) {
controller.on('dendrogramChanged', function (e) {
(e.isColumns ? _this.$searchColumnDendrogramWrapper
: _this.$searchRowDendrogramWrapper).hide();
: _this.$searchRowDendrogramWrapper).hide();
});
var project = controller.getProject();
morpheus.Util.autosuggest({
$el : this.$rowTextField,
filter : function(terms, cb) {
$el: this.$rowTextField,
filter: function (terms, cb) {
var indices = [];
var meta = project.getSortedFilteredDataset().getRowMetadata();
controller.getVisibleTrackNames(false).forEach(function(name) {
controller.getVisibleTrackNames(false).forEach(function (name) {
indices.push(morpheus.MetadataUtil.indexOf(meta, name));
});
meta = new morpheus.MetadataModelColumnView(meta, indices);
morpheus.MetadataUtil.autocomplete(meta)(terms, cb);
},
select : function() {
select: function () {
_this.search(true);
}
});
this.$rowTextField.on('keyup', _.debounce(function(e) {
this.$rowTextField.on('keyup', _.debounce(function (e) {
if (e.which === 13) {
e.preventDefault();
}
_this.search(true);
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'searchRows'
eventCategory: 'ToolBar',
eventAction: 'searchRows'
});
}, 500));
morpheus.Util.autosuggest({
$el : this.$columnTextField,
filter : function(terms, cb) {
$el: this.$columnTextField,
filter: function (terms, cb) {
var indices = [];
var meta = project.getSortedFilteredDataset().getColumnMetadata();
controller.getVisibleTrackNames(true).forEach(function(name) {
controller.getVisibleTrackNames(true).forEach(function (name) {
indices.push(morpheus.MetadataUtil.indexOf(meta, name));
});
meta = new morpheus.MetadataModelColumnView(meta, indices);
morpheus.MetadataUtil.autocomplete(meta)(terms, cb);
},
select : function() {
select: function () {
_this.search(false);
}
});
this.$columnTextField.on('keyup', _.debounce(function(e) {
this.$columnTextField.on('keyup', _.debounce(function (e) {
if (e.which === 13) {
e.preventDefault();
}
_this.search(false);
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'searchColumns'
eventCategory: 'ToolBar',
eventAction: 'searchColumns'
});
}, 500));
// TODO combine search with autocomplete
this.$searchRowDendrogram.on('keyup', _.debounce(function(e) {
this.$searchRowDendrogram.on('keyup', _.debounce(function (e) {
if (e.which === 13) {
// _this.$searchRowDendrogram.autocomplete('close');
e.preventDefault();
}
_this.searchDendrogram(false);
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'searchRowDendrogram'
eventCategory: 'ToolBar',
eventAction: 'searchRowDendrogram'
});
}, 500));
this.$searchColumnDendrogram.on('keyup', _.debounce(function(e) {
this.$searchColumnDendrogram.on('keyup', _.debounce(function (e) {
if (e.which === 13) {
// _this.$searchColumnDendrogram.autocomplete('close');
e.preventDefault();
}
_this.searchDendrogram(true);
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'searchColumnDendrogram'
eventCategory: 'ToolBar',
eventAction: 'searchColumnDendrogram'
});
}, 500));
......@@ -566,26 +540,27 @@ morpheus.HeatMapToolBar = function(controller) {
} else {
var viewIndices = new morpheus.Set();
morpheus.DatasetUtil.searchValues(project
.getSortedFilteredDataset(), text, function(value, i, j) {
viewIndices.add(new morpheus.Identifier([ i, j ]));
.getSortedFilteredDataset(), text, function (value, i, j) {
viewIndices.add(new morpheus.Identifier([i, j]));
});
project.getElementSelectionModel().setViewIndices(viewIndices);
$searchResultsLabel.html(viewIndices.size() + ' match'
+ (viewIndices.size() === 1 ? '' : 'es'));
+ (viewIndices.size() === 1 ? '' : 'es'));
}
}
morpheus.Util.autosuggest({
$el : this.$valueTextField,
filter : function(terms, cb) {
$el: this.$valueTextField,
filter: function (terms, cb) {
morpheus.DatasetUtil.autocompleteValues(
project.getSortedFilteredDataset())(terms, cb);
project.getSortedFilteredDataset())(terms, cb);
},
select : function() {
select: function () {
searchValues();
}
});
this.$valueTextField.on('keyup', _.debounce(function(e) {
this.$valueTextField.on('keyup', _.debounce(function (e) {
if (e.which === 13) {
_this.$valueTextField.autocomplete('close');
e.preventDefault();
......@@ -593,61 +568,61 @@ morpheus.HeatMapToolBar = function(controller) {
searchValues();
}, 500));
$toolbarForm.on('submit', function(e) {
$toolbarForm.on('submit', function (e) {
e.preventDefault();
});
$toolbarForm.on('click', '[name=in]', function(e) {
$toolbarForm.on('click', '[name=in]', function (e) {
e.preventDefault();
controller.zoom(true);
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'zoomIn'
eventCategory: 'ToolBar',
eventAction: 'zoomIn'
});
});
$toolbarForm.on('click', '[name=out]', function(e) {
$toolbarForm.on('click', '[name=out]', function (e) {
e.preventDefault();
controller.zoom(false);
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'zoomOut'
eventCategory: 'ToolBar',
eventAction: 'zoomOut'
});
});
$toolbarForm.on('click', '[name=options]', function(e) {
$toolbarForm.on('click', '[name=options]', function (e) {
e.preventDefault();
controller.showOptions();
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'options'
eventCategory: 'ToolBar',
eventAction: 'options'
});
});
$toolbarForm.on('click', '[name=sort]', function(e) {
$toolbarForm.on('click', '[name=sort]', function (e) {
e.preventDefault();
new morpheus.SortDialog(project);
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'sort'
eventCategory: 'ToolBar',
eventAction: 'sort'
});
});
$toolbarForm.on('click', '[name=fit]', function(e) {
$toolbarForm.on('click', '[name=fit]', function (e) {
e.preventDefault();
controller.fitToWindow(true);
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'fit'
eventCategory: 'ToolBar',
eventAction: 'fit'
});
});
$toolbarForm.on('click', '[name=resetZoom]', function(e) {
$toolbarForm.on('click', '[name=resetZoom]', function (e) {
e.preventDefault();
controller.resetZoom();
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'resetZoom'
eventCategory: 'ToolBar',
eventAction: 'resetZoom'
});
});
this.$el = $el;
var updateFilterStatus = function() {
var updateFilterStatus = function () {
if (controller.getProject().getRowFilter().isEnabled()
|| controller.getProject().getColumnFilter().isEnabled()) {
|| controller.getProject().getColumnFilter().isEnabled()) {
_this.$el.find('[name=filterButton]').addClass('btn-primary');
} else {
_this.$el.find('[name=filterButton]').removeClass('btn-primary');
......@@ -657,65 +632,65 @@ morpheus.HeatMapToolBar = function(controller) {
updateFilterStatus();
this.$columnMatchesToTop
.on(
'click',
function(e) {
e.preventDefault();
var $this = $(this);
$this.toggleClass('btn-primary');
var sortKeys = project.getColumnSortKeys();
// clear existing sort keys except dendrogram
sortKeys = sortKeys
.filter(function(key) {
return (key instanceof morpheus.SpecifiedModelSortOrder && key.name === 'dendrogram');
});
if ($this.hasClass('btn-primary')) {
var key = new morpheus.MatchesOnTopSortKey(project,
_this.columnSearchResultModelIndices,
'matches on top');
sortKeys.splice(0, 0, key);
controller.scrollLeft(0);
}
_this.searching = true;
project.setColumnSortKeys(sortKeys, true);
_this._updateSearchIndices(true);
_this.searching = false;
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'columnMatchesToTop'
});
});
.on(
'click',
function (e) {
e.preventDefault();
var $this = $(this);
$this.toggleClass('btn-primary');
var sortKeys = project.getColumnSortKeys();
// clear existing sort keys except dendrogram
sortKeys = sortKeys
.filter(function (key) {
return (key instanceof morpheus.SpecifiedModelSortOrder && key.name === 'dendrogram');
});
if ($this.hasClass('btn-primary')) {
var key = new morpheus.MatchesOnTopSortKey(project,
_this.columnSearchResultModelIndices,
'matches on top');
sortKeys.splice(0, 0, key);
controller.scrollLeft(0);
}
_this.searching = true;
project.setColumnSortKeys(sortKeys, true);
_this._updateSearchIndices(true);
_this.searching = false;
morpheus.Util.trackEvent({
eventCategory: 'ToolBar',
eventAction: 'columnMatchesToTop'
});
});
this.$rowMatchesToTop
.on(
'click',
function(e) {
e.preventDefault();
var $this = $(this);
$this.toggleClass('btn-primary');
var sortKeys = project.getRowSortKeys();
// clear existing sort keys except
// dendrogram
sortKeys = sortKeys
.filter(function(key) {
return (key instanceof morpheus.SpecifiedModelSortOrder && key.name === 'dendrogram');
});
if ($this.hasClass('btn-primary')) {
var key = new morpheus.MatchesOnTopSortKey(project,
_this.rowSearchResultModelIndices,
'matches on top');
sortKeys.splice(0, 0, key);
controller.scrollTop(0);
}
_this.searching = true;
project.setRowSortKeys(sortKeys, true);
_this._updateSearchIndices(false);
_this.searching = false;
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'rowMatchesToTop'
});
});
project.on('rowSortOrderChanged.morpheus', function(e) {
.on(
'click',
function (e) {
e.preventDefault();
var $this = $(this);
$this.toggleClass('btn-primary');
var sortKeys = project.getRowSortKeys();
// clear existing sort keys except
// dendrogram
sortKeys = sortKeys
.filter(function (key) {
return (key instanceof morpheus.SpecifiedModelSortOrder && key.name === 'dendrogram');
});
if ($this.hasClass('btn-primary')) {
var key = new morpheus.MatchesOnTopSortKey(project,
_this.rowSearchResultModelIndices,
'matches on top');
sortKeys.splice(0, 0, key);
controller.scrollTop(0);
}
_this.searching = true;
project.setRowSortKeys(sortKeys, true);
_this._updateSearchIndices(false);
_this.searching = false;
morpheus.Util.trackEvent({
eventCategory: 'ToolBar',
eventAction: 'rowMatchesToTop'
});
});
project.on('rowSortOrderChanged.morpheus', function (e) {
if (_this.searching) {
return;
}
......@@ -723,7 +698,7 @@ morpheus.HeatMapToolBar = function(controller) {
_this.$rowMatchesToTop.removeClass('btn-primary');
});
project.on('columnSortOrderChanged.morpheus', function(e) {
project.on('columnSortOrderChanged.morpheus', function (e) {
if (_this.searching) {
return;
}
......@@ -731,82 +706,82 @@ morpheus.HeatMapToolBar = function(controller) {
_this.$columnMatchesToTop.removeClass('btn-primary');
});
controller.getProject().on('rowFilterChanged.morpheus', function(e) {
controller.getProject().on('rowFilterChanged.morpheus', function (e) {
_this.search(true);
updateFilterStatus();
});
controller.getProject().on('columnFilterChanged.morpheus', function(e) {
controller.getProject().on('columnFilterChanged.morpheus', function (e) {
_this.search(false);
updateFilterStatus();
});
controller.getProject().on('datasetChanged.morpheus', function() {
controller.getProject().on('datasetChanged.morpheus', function () {
_this.search(true);
_this.search(false);
updateFilterStatus();
});
controller.getProject().getRowSelectionModel().on(
'selectionChanged.morpheus', function() {
_this.updateSelectionLabel();
});
'selectionChanged.morpheus', function () {
_this.updateSelectionLabel();
});
controller.getProject().getColumnSelectionModel().on(
'selectionChanged.morpheus', function() {
_this.updateSelectionLabel();
});
'selectionChanged.morpheus', function () {
_this.updateSelectionLabel();
});
this.rowSearchResultViewIndicesSorted = null;
this.currentRowSearchIndex = 0;
this.columnSearchResultViewIndicesSorted = null;
this.currentColumnSearchIndex = -1;
this.$previousColumnMatch
.on(
'click',
function() {
_this.currentColumnSearchIndex--;
if (_this.currentColumnSearchIndex < 0) {
_this.currentColumnSearchIndex = _this.columnSearchResultViewIndicesSorted.length - 1;
}
controller
.scrollLeft(controller
.getHeatMapElementComponent()
.getColumnPositions()
.getPosition(
_this.columnSearchResultViewIndicesSorted[_this.currentColumnSearchIndex]));
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'previousColumnMatch'
});
});
.on(
'click',
function () {
_this.currentColumnSearchIndex--;
if (_this.currentColumnSearchIndex < 0) {
_this.currentColumnSearchIndex = _this.columnSearchResultViewIndicesSorted.length - 1;
}
controller
.scrollLeft(controller
.getHeatMapElementComponent()
.getColumnPositions()
.getPosition(
_this.columnSearchResultViewIndicesSorted[_this.currentColumnSearchIndex]));
morpheus.Util.trackEvent({
eventCategory: 'ToolBar',
eventAction: 'previousColumnMatch'
});
});
this.$previousRowMatch
.on(
'click',
function() {
_this.currentRowSearchIndex--;
if (_this.currentRowSearchIndex < 0) {
_this.currentRowSearchIndex = _this.rowSearchResultViewIndicesSorted.length - 1;
}
controller
.scrollTop(controller
.getHeatMapElementComponent()
.getRowPositions()
.getPosition(
_this.rowSearchResultViewIndicesSorted[_this.currentRowSearchIndex]));
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'previousRowMatch'
});
});
this.$nextColumnMatch.on('click', function() {
.on(
'click',
function () {
_this.currentRowSearchIndex--;
if (_this.currentRowSearchIndex < 0) {
_this.currentRowSearchIndex = _this.rowSearchResultViewIndicesSorted.length - 1;
}
controller
.scrollTop(controller
.getHeatMapElementComponent()
.getRowPositions()
.getPosition(
_this.rowSearchResultViewIndicesSorted[_this.currentRowSearchIndex]));
morpheus.Util.trackEvent({
eventCategory: 'ToolBar',
eventAction: 'previousRowMatch'
});
});
this.$nextColumnMatch.on('click', function () {
_this.next(true);
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'nextColumnMatch'
eventCategory: 'ToolBar',
eventAction: 'nextColumnMatch'
});
});
this.$nextRowMatch.on('click', function() {
this.$nextRowMatch.on('click', function () {
_this.next(false);
morpheus.Util.trackEvent({
eventCategory : 'ToolBar',
eventAction : 'nextRowMatch'
eventCategory: 'ToolBar',
eventAction: 'nextRowMatch'
});
});
this.updateDimensionsLabel();
......@@ -817,23 +792,23 @@ morpheus.HeatMapToolBar.FILTER_SEARCH_MODE = 1;
morpheus.HeatMapToolBar.MATCHES_TO_TOP_SEARCH_MODE = 2;
morpheus.HeatMapToolBar.SELECT_MATCHES_SEARCH_MODE = 3;
morpheus.HeatMapToolBar.prototype = {
quickColumnFilter : false,
searching : false,
rowSearchMode : morpheus.HeatMapToolBar.SELECT_MATCHES_SEARCH_MODE,
columnSearchMode : morpheus.HeatMapToolBar.SELECT_MATCHES_SEARCH_MODE,
_updateSearchIndices : function(isColumns) {
quickColumnFilter: false,
searching: false,
rowSearchMode: morpheus.HeatMapToolBar.SELECT_MATCHES_SEARCH_MODE,
columnSearchMode: morpheus.HeatMapToolBar.SELECT_MATCHES_SEARCH_MODE,
_updateSearchIndices: function (isColumns) {
var project = this.controller.getProject();
if (isColumns) {
var viewIndices = [];
var modelIndices = this.columnSearchResultModelIndices;
for (var i = 0, length = modelIndices.length; i < length; i++) {
var index = project
.convertModelColumnIndexToView(modelIndices[i]);
.convertModelColumnIndexToView(modelIndices[i]);
if (index !== -1) {
viewIndices.push(index);
}
}
viewIndices.sort(function(a, b) {
viewIndices.sort(function (a, b) {
return a < b ? -1 : 1;
});
this.columnSearchResultViewIndicesSorted = viewIndices;
......@@ -847,14 +822,14 @@ morpheus.HeatMapToolBar.prototype = {
viewIndices.push(index);
}
}
viewIndices.sort(function(a, b) {
viewIndices.sort(function (a, b) {
return a < b ? -1 : 1;
});
this.rowSearchResultViewIndicesSorted = viewIndices;
this.currentRowSearchIndex = -1;
}
},
next : function(isColumns) {
next: function (isColumns) {
var controller = this.controller;
if (isColumns) {
this.currentColumnSearchIndex++;
......@@ -862,35 +837,35 @@ morpheus.HeatMapToolBar.prototype = {
this.currentColumnSearchIndex = 0;
}
controller
.scrollLeft(controller
.getHeatMapElementComponent()
.getColumnPositions()
.getPosition(
this.columnSearchResultViewIndicesSorted[this.currentColumnSearchIndex]));
.scrollLeft(controller
.getHeatMapElementComponent()
.getColumnPositions()
.getPosition(
this.columnSearchResultViewIndicesSorted[this.currentColumnSearchIndex]));
} else {
this.currentRowSearchIndex++;
if (this.currentRowSearchIndex >= this.rowSearchResultViewIndicesSorted.length) {
this.currentRowSearchIndex = 0;
}
controller
.scrollTop(controller
.getHeatMapElementComponent()
.getRowPositions()
.getPosition(
this.rowSearchResultViewIndicesSorted[this.currentRowSearchIndex]));
.scrollTop(controller
.getHeatMapElementComponent()
.getRowPositions()
.getPosition(
this.rowSearchResultViewIndicesSorted[this.currentRowSearchIndex]));
}
},
setSearchText : function(options) {
setSearchText: function (options) {
var $tf = options.isColumns ? this.$columnTextField
: this.$rowTextField;
: this.$rowTextField;
var existing = options.append ? $.trim($tf.val()) : '';
if (existing !== '') {
existing += ' ';
}
if (options.onTop) {
options.isColumns ? this.$columnMatchesToTop
.addClass('btn-primary') : this.$rowMatchesToTop
.addClass('btn-primary');
.addClass('btn-primary') : this.$rowMatchesToTop
.addClass('btn-primary');
}
$tf.val(existing + options.text);
......@@ -900,17 +875,17 @@ morpheus.HeatMapToolBar.prototype = {
// click next
}
},
updateDimensionsLabel : function() {
updateDimensionsLabel: function () {
var p = this.controller.getProject();
var d = p.getFullDataset();
var f = p.getSortedFilteredDataset();
var text = 'showing ' + morpheus.Util.intFormat(f.getRowCount())
+ ' of ' + morpheus.Util.intFormat(d.getRowCount()) + ' rows, '
+ morpheus.Util.intFormat(f.getColumnCount()) + ' of '
+ morpheus.Util.intFormat(d.getColumnCount()) + ' columns';
+ ' of ' + morpheus.Util.intFormat(d.getRowCount()) + ' rows, '
+ morpheus.Util.intFormat(f.getColumnCount()) + ' of '
+ morpheus.Util.intFormat(d.getColumnCount()) + ' columns';
this.$dimensionsLabel.html(text);
},
updateSelectionLabel : function() {
updateSelectionLabel: function () {
var nc = this.controller.getProject().getColumnSelectionModel().count();
var nr = this.controller.getProject().getRowSelectionModel().count();
var text = [];
......@@ -926,26 +901,26 @@ morpheus.HeatMapToolBar.prototype = {
text.push(' selected');
this.$selectionLabel.html(text.join(''));
},
searchDendrogram : function(isColumns) {
searchDendrogram: function (isColumns) {
var text = $.trim(isColumns ? this.$searchColumnDendrogram.val()
: this.$searchRowDendrogram.val());
: this.$searchRowDendrogram.val());
var dendrogram = isColumns ? this.controller.columnDendrogram
: this.controller.rowDendrogram;
: this.controller.rowDendrogram;
var $searchResults = isColumns ? this.$searchResultsColumnDendrogram
: this.$searchResultsRowDendrogram;
: this.$searchResultsRowDendrogram;
var matches = morpheus.AbstractDendrogram.search(
dendrogram.tree.rootNode, text);
dendrogram.tree.rootNode, text);
if (matches === -1) {
$searchResults.html('');
} else {
$searchResults.html(matches + ' match'
+ (matches === 1 ? '' : 'es'));
+ (matches === 1 ? '' : 'es'));
}
if (matches <= 0) {
var positions = isColumns ? this.controller
.getHeatMapElementComponent().getColumnPositions()
: this.controller.getHeatMapElementComponent()
.getRowPositions();
.getHeatMapElementComponent().getColumnPositions()
: this.controller.getHeatMapElementComponent()
.getRowPositions();
positions.setSquishedIndices(null);
if (isColumns) {
this.controller.getProject().setGroupColumns([], true);
......@@ -953,25 +928,25 @@ morpheus.HeatMapToolBar.prototype = {
this.controller.getProject().setGroupRows([], true);
}
positions.setSize(isColumns ? this.controller.getFitColumnSize()
: this.controller.getFitRowSize());
: this.controller.getFitRowSize());
} else {
morpheus.AbstractDendrogram.squishNonSearchedNodes(this.controller,
isColumns);
isColumns);
}
this.controller.updateDataset(); // need to update spaces for group
// by
this.controller.revalidate();
},
search : function(isRows) {
search: function (isRows) {
this.searching = true;
var isMatchesOnTop = isRows ? this.$rowMatchesToTop
.hasClass('btn-primary') : this.$columnMatchesToTop
.hasClass('btn-primary');
.hasClass('btn-primary') : this.$columnMatchesToTop
.hasClass('btn-primary');
var controller = this.controller;
var project = controller.getProject();
var sortKeys = isRows ? project.getRowSortKeys() : project
.getColumnSortKeys();
.getColumnSortKeys();
var keyIndex = -1;
for (var i = 0; i < sortKeys.length; i++) {
if (sortKeys[i].toString() === 'matches on top') {
......@@ -985,25 +960,25 @@ morpheus.HeatMapToolBar.prototype = {
var dataset = project.getSortedFilteredDataset();
var $searchResultsLabel = this.$el.find('[name=searchResults'
+ (isRows ? 'Rows' : 'Columns') + ']');
+ (isRows ? 'Rows' : 'Columns') + ']');
var searchText = !isRows ? $.trim(this.$columnTextField.val()) : $
.trim(this.$rowTextField.val());
.trim(this.$rowTextField.val());
var metadata = isRows ? dataset.getRowMetadata() : dataset
.getColumnMetadata();
.getColumnMetadata();
var visibleIndices = [];
controller.getVisibleTrackNames(!isRows).forEach(function(name) {
controller.getVisibleTrackNames(!isRows).forEach(function (name) {
visibleIndices.push(morpheus.MetadataUtil.indexOf(metadata, name));
});
metadata = new morpheus.MetadataModelColumnView(metadata,
visibleIndices);
visibleIndices);
var searchResultViewIndices = morpheus.MetadataUtil.search({
model : metadata,
text : searchText,
isColumns : !isRows,
defaultMatchMode : isRows ? this.defaultRowMatchMode
: this.defaultColumnMatchMode
model: metadata,
text: searchText,
isColumns: !isRows,
defaultMatchMode: isRows ? this.defaultRowMatchMode
: this.defaultColumnMatchMode
});
if (searchText === '') {
$searchResultsLabel.html('');
......@@ -1015,7 +990,7 @@ morpheus.HeatMapToolBar.prototype = {
} else {
$searchResultsLabel.html(searchResultViewIndices.length + ' match'
+ (searchResultViewIndices.length === 1 ? '' : 'es'));
+ (searchResultViewIndices.length === 1 ? '' : 'es'));
if (isRows) {
this.$rowSearchDiv.show();
} else {
......@@ -1029,15 +1004,15 @@ morpheus.HeatMapToolBar.prototype = {
for (var i = 0, length = searchResultViewIndices.length; i < length; i++) {
var viewIndex = searchResultViewIndices[i];
searchResultsModelIndices.push(isRows ? project
.convertViewRowIndexToModel(viewIndex) : project
.convertViewColumnIndexToModel(viewIndex));
.convertViewRowIndexToModel(viewIndex) : project
.convertViewColumnIndexToModel(viewIndex));
}
}
if (searchResultViewIndices !== null && isMatchesOnTop) {
var key = new morpheus.MatchesOnTopSortKey(project,
searchResultsModelIndices, 'matches on top');
sortKeys = sortKeys.filter(function(key) {
searchResultsModelIndices, 'matches on top');
sortKeys = sortKeys.filter(function (key) {
return !(key instanceof morpheus.MatchesOnTopSortKey);
});
searchResultViewIndices = key.indices; // matching indices
......@@ -1064,33 +1039,33 @@ morpheus.HeatMapToolBar.prototype = {
if (isRows) {
this.rowSearchResultModelIndices = searchResultsModelIndices;
this.rowSearchResultViewIndicesSorted = searchResultViewIndices
.sort(function(a, b) {
return a < b ? -1 : 1;
});
.sort(function (a, b) {
return a < b ? -1 : 1;
});
this.currentRowSearchIndex = -1;
} else {
this.columnSearchResultModelIndices = searchResultsModelIndices;
this.columnSearchResultViewIndicesSorted = searchResultViewIndices
.sort(function(a, b) {
return a < b ? -1 : 1;
});
.sort(function (a, b) {
return a < b ? -1 : 1;
});
this.currentColumnSearchIndex = -1;
}
// update selection
(!isRows ? project.getColumnSelectionModel() : project
.getRowSelectionModel()).setViewIndices(
searchResultsViewIndicesSet, true);
.getRowSelectionModel()).setViewIndices(
searchResultsViewIndicesSet, true);
if (isMatchesOnTop) { // resort
if (isRows) {
project.setRowSortKeys(morpheus.SortKey.keepExistingSortKeys(
sortKeys, project.getRowSortKeys()), true);
sortKeys, project.getRowSortKeys()), true);
} else {
project.setColumnSortKeys(morpheus.SortKey
.keepExistingSortKeys(sortKeys, project
.getColumnSortKeys()), true);
.keepExistingSortKeys(sortKeys, project
.getColumnSortKeys()), true);
}
}
this.updateDimensionsLabel();
......
src/ui/heat_map_tooltip_provider.js
View file @ d75438e8
morpheus.HeatMapTooltipProvider = function(heatMap, rowIndex, columnIndex,
options, separator, quick) {
morpheus.HeatMapTooltipProvider = function (heatMap, rowIndex, columnIndex,
options, separator, quick) {
var dataset = heatMap.project.getSortedFilteredDataset();
var tipText = [];
if (!quick) {
if (options.value) { // key value pairs for custom tooltip
_.each(options.value, function(pair) {
_.each(options.value, function (pair) {
if (tipText.length > 0) {
tipText.push(separator);
}
......@@ -27,16 +27,16 @@ morpheus.HeatMapTooltipProvider = function(heatMap, rowIndex, columnIndex,
if (rowIndex !== -1 && columnIndex !== -1) {
for (var i = 0, nseries = dataset.getSeriesCount(); i < nseries; i++) {
morpheus.HeatMapTooltipProvider._matrixValueToString(dataset,
rowIndex, columnIndex, i, tipText, separator,
options.showSeriesNameInTooltip || i > 0);
rowIndex, columnIndex, i, tipText, separator,
options.showSeriesNameInTooltip || i > 0);
}
if (quick) {
var quickRowTracks = heatMap.rowTracks.filter(function(t) {
var quickRowTracks = heatMap.rowTracks.filter(function (t) {
return t.settings.inlineTooltip;
});
morpheus.HeatMapTooltipProvider._tracksToString(options,
quickRowTracks, dataset.getRowMetadata(), rowIndex,
tipText, separator);
quickRowTracks, dataset.getRowMetadata(), rowIndex,
tipText, separator);
// if (quickRowTracks.length > 0) {
// tipText
......@@ -44,10 +44,10 @@ morpheus.HeatMapTooltipProvider = function(heatMap, rowIndex, columnIndex,
// style="height:1px;background-color:LightGrey;"></div>');
// }
morpheus.HeatMapTooltipProvider._tracksToString(options,
heatMap.columnTracks.filter(function(t) {
return t.settings.inlineTooltip;
}), dataset.getColumnMetadata(), columnIndex, tipText,
separator);
heatMap.columnTracks.filter(function (t) {
return t.settings.inlineTooltip;
}), dataset.getColumnMetadata(), columnIndex, tipText,
separator);
}
}
......@@ -55,25 +55,25 @@ morpheus.HeatMapTooltipProvider = function(heatMap, rowIndex, columnIndex,
if (!quick) {
if (rowIndex !== -1) {
morpheus.HeatMapTooltipProvider._metadataToString(options,
heatMap.rowTracks, dataset.getRowMetadata(), rowIndex,
tipText, separator);
heatMap.rowTracks, dataset.getRowMetadata(), rowIndex,
tipText, separator);
}
if (columnIndex !== -1) {
morpheus.HeatMapTooltipProvider._metadataToString(options,
heatMap.columnTracks, dataset.getColumnMetadata(),
columnIndex, tipText, separator);
heatMap.columnTracks, dataset.getColumnMetadata(),
columnIndex, tipText, separator);
}
} else if (options.name != null) {
var metadata = (rowIndex !== -1 ? dataset.getRowMetadata() : dataset
.getColumnMetadata());
.getColumnMetadata());
var vector = metadata.getByName(options.name);
var track = heatMap.getTrack(options.name, columnIndex !== -1);
var colorByName = track != null ? track.settings.colorByField : null;
var additionalVector = colorByName != null ? metadata
.getByName(colorByName) : null;
.getByName(colorByName) : null;
morpheus.HeatMapTooltipProvider.vectorToString(vector,
rowIndex !== -1 ? rowIndex : columnIndex, tipText, separator,
additionalVector);
rowIndex !== -1 ? rowIndex : columnIndex, tipText, separator,
additionalVector);
}
var rowNodes = [];
......@@ -90,70 +90,86 @@ morpheus.HeatMapTooltipProvider = function(heatMap, rowIndex, columnIndex,
if (!quick) {
if (heatMap.rowDendrogram) {
selectedRowNodes = _
.values(heatMap.rowDendrogram.selectedRootNodeIdToNode);
.values(heatMap.rowDendrogram.selectedRootNodeIdToNode);
}
if (heatMap.columnDendrogram) {
selectedColumnNodes = _
.values(heatMap.columnDendrogram.selectedRootNodeIdToNode);
.values(heatMap.columnDendrogram.selectedRootNodeIdToNode);
}
if (selectedRowNodes.length > 0 && rowNodes.length > 0) {
var nodeIds = {};
_.each(selectedRowNodes, function(n) {
_.each(selectedRowNodes, function (n) {
nodeIds[n.id] = true;
});
rowNodes = _.filter(rowNodes, function(n) {
rowNodes = _.filter(rowNodes, function (n) {
return nodeIds[n.id] === undefined;
});
}
if (selectedColumnNodes.length > 0 && columnNodes.length > 0) {
var nodeIds = {};
_.each(selectedColumnNodes, function(n) {
_.each(selectedColumnNodes, function (n) {
nodeIds[n.id] = true;
});
columnNodes = _.filter(columnNodes, function(n) {
columnNodes = _.filter(columnNodes, function (n) {
return nodeIds[n.id] === undefined;
});
}
}
morpheus.HeatMapTooltipProvider._nodesToString(tipText, rowNodes, null,
separator);
separator);
morpheus.HeatMapTooltipProvider._nodesToString(tipText, columnNodes, null,
separator);
separator);
if (!quick) {
if (selectedRowNodes.length > 0) {
morpheus.HeatMapTooltipProvider._nodesToString(tipText,
selectedRowNodes, heatMap.rowDendrogram._selectedNodeColor,
separator);
selectedRowNodes, heatMap.rowDendrogram._selectedNodeColor,
separator);
}
if (selectedColumnNodes.length > 0) {
morpheus.HeatMapTooltipProvider._nodesToString(tipText,
selectedColumnNodes,
heatMap.columnDendrogram._selectedNodeColor, separator);
selectedColumnNodes,
heatMap.columnDendrogram._selectedNodeColor, separator);
}
}
return tipText.join('');
};
morpheus.HeatMapTooltipProvider._matrixValueToString = function(dataset,
rowIndex, columnIndex, seriesIndex, tipText, separator,
showSeriesNameInTooltip) {
morpheus.HeatMapTooltipProvider._matrixValueToString = function (dataset,
rowIndex, columnIndex, seriesIndex, tipText, separator,
showSeriesNameInTooltip) {
var val = dataset.getValue(rowIndex, columnIndex, seriesIndex);
if (val != null) {
if (val.toObject || !_.isNumber(val)) {
var obj = val.toObject ? val.toObject() : val;
var keys = _.keys(obj);
_.each(keys, function(key) {
if (key !== '__v') { // special value key
var v = morpheus.Util.formatObject(obj[key]);
if (tipText.length > 0) {
tipText.push(separator);
if (keys.length === 0) {
var v = morpheus.Util.formatObject(obj);
if (tipText.length > 0) {
tipText.push(separator);
}
if (showSeriesNameInTooltip) {
tipText.push(dataset.getName(seriesIndex));
tipText.push(': ');
}
tipText.push('<b>');
tipText.push(v);
tipText.push('</b>');
} else {
for (var i = 0, nkeys = keys.length; i < nkeys; i++) {
var key = keys[i];
if (key !== '__v') { // special value key
var v = morpheus.Util.formatObject(obj[key]);
if (tipText.length > 0) {
tipText.push(separator);
}
tipText.push(key);
tipText.push(': <b>');
tipText.push(v);
tipText.push('</b>');
}
tipText.push(key);
tipText.push(': <b>');
tipText.push(v);
tipText.push('</b>');
}
});
}
} else {
if (tipText.length > 0) {
tipText.push(separator);
......@@ -170,9 +186,9 @@ morpheus.HeatMapTooltipProvider._matrixValueToString = function(dataset,
}
};
morpheus.HeatMapTooltipProvider.vectorToString = function(vector, index,
tipText, separator, additionalVector) {
var arrayValueToString = function(arrayFieldName, arrayVal) {
morpheus.HeatMapTooltipProvider.vectorToString = function (vector, index,
tipText, separator, additionalVector) {
var arrayValueToString = function (arrayFieldName, arrayVal) {
if (arrayVal != null) {
if (arrayFieldName != null) {
if (tipText.length > 0) {
......@@ -184,7 +200,7 @@ morpheus.HeatMapTooltipProvider.vectorToString = function(vector, index,
tipText.push(' ');
var obj = arrayVal.toObject();
var keys = _.keys(obj);
_.each(keys, function(key) {
_.each(keys, function (key) {
var subVal = obj[key];
if (subVal != null && subVal != '') {
if (tipText.length > 0) {
......@@ -208,27 +224,27 @@ morpheus.HeatMapTooltipProvider.vectorToString = function(vector, index,
var primaryVal = vector.getValue(index);
if (primaryVal != null && primaryVal != '') {
var primaryFields = vector.getProperties().get(
morpheus.VectorKeys.FIELDS);
morpheus.VectorKeys.FIELDS);
if (primaryFields != null) {
var visibleFieldIndices = vector.getProperties().get(
morpheus.VectorKeys.VISIBLE_FIELDS);
morpheus.VectorKeys.VISIBLE_FIELDS);
if (visibleFieldIndices === undefined) {
visibleFieldIndices = morpheus.Util
.seq(primaryFields.length);
.seq(primaryFields.length);
}
var additionalFieldNames = additionalVector != null ? additionalVector
.getProperties().get(morpheus.VectorKeys.FIELDS)
: null;
.getProperties().get(morpheus.VectorKeys.FIELDS)
: null;
var additionalVal = additionalFieldNames != null ? additionalVector
.getValue(index)
: null;
.getValue(index)
: null;
if (tipText.length > 0) {
tipText.push(separator);
}
tipText.push(vector.getName());
for (var j = 0; j < visibleFieldIndices.length; j++) {
arrayValueToString(primaryFields[visibleFieldIndices[j]],
primaryVal[visibleFieldIndices[j]]);
primaryVal[visibleFieldIndices[j]]);
}
if (additionalVal != null) {
......@@ -238,8 +254,8 @@ morpheus.HeatMapTooltipProvider.vectorToString = function(vector, index,
tipText.push(additionalVector.getName());
for (var j = 0; j < visibleFieldIndices.length; j++) {
arrayValueToString(
additionalFieldNames[visibleFieldIndices[j]],
additionalVal[visibleFieldIndices[j]]);
additionalFieldNames[visibleFieldIndices[j]],
additionalVal[visibleFieldIndices[j]]);
}
}
......@@ -256,17 +272,15 @@ morpheus.HeatMapTooltipProvider.vectorToString = function(vector, index,
}
}
};
morpheus.HeatMapTooltipProvider._tracksToString = function(options, tracks,
metadata, index, tipText, separator) {
morpheus.HeatMapTooltipProvider._tracksToString = function (options, tracks, metadata, index, tipText, separator) {
for (var i = 0; i < tracks.length; i++) {
var vector = metadata.getByName(tracks[i].name);
morpheus.HeatMapTooltipProvider.vectorToString(vector, index, tipText,
separator);
morpheus.HeatMapTooltipProvider.vectorToString(metadata.getByName(tracks[i].name), index, tipText,
separator);
}
};
morpheus.HeatMapTooltipProvider._metadataToString = function(options, tracks,
metadata, index, tipText, separator) {
morpheus.HeatMapTooltipProvider._metadataToString = function (options, tracks,
metadata, index, tipText, separator) {
var filtered = [];
for (var i = 0, ntracks = tracks.length; i < ntracks; i++) {
var track = tracks[i];
......@@ -276,19 +290,17 @@ morpheus.HeatMapTooltipProvider._metadataToString = function(options, tracks,
} else {
filtered.push(track);
}
}
}
// show the vector that we're mousing over 1st
morpheus.HeatMapTooltipProvider._tracksToString(options, filtered,
metadata, index, tipText, separator);
metadata, index, tipText, separator);
};
morpheus.HeatMapTooltipProvider._nodesToString = function(tipText, nodes,
color, separator) {
var renderField = function(name, value) {
morpheus.HeatMapTooltipProvider._nodesToString = function (tipText, nodes,
color, separator) {
var renderField = function (name, value) {
if (value != null) {
if (tipText.length > 0) {
tipText.push(separator);
......@@ -314,9 +326,9 @@ morpheus.HeatMapTooltipProvider._nodesToString = function(tipText, nodes,
}
}
};
_.each(nodes, function(node) {
_.each(nodes, function (node) {
if (node.info) {
for ( var name in node.info) {
for (var name in node.info) {
var value = node.info[name];
renderField(name, value);
}
......@@ -328,4 +340,4 @@ morpheus.HeatMapTooltipProvider._nodesToString = function(tipText, nodes,
// renderField('height', node.height);
}
});
};
\ No newline at end of file
};
src/ui/scented_search.js
View file @ d75438e8
......@@ -19,7 +19,7 @@ morpheus.ScentedSearch = function (model, positions, isVertical, scrollbar,
scrollbar.canvas.style.cursor = index < 0 ? 'default' : 'pointer';
var tipOptions = {
event: e,
heatMapLens: true
heatMapLens: index >= 0
};
if (isVertical) {
controller.setToolTip(index >= 0 ? _this.searchIndices[index] : -1,
......@@ -35,6 +35,7 @@ morpheus.ScentedSearch = function (model, positions, isVertical, scrollbar,
// but the canvas cursor has no effect
document.body.style.cursor = 'default';
scrollbar.canvas.style.cursor = 'default';
controller.setToolTip(-1, -1, {event: e});
};
$(scrollbar.canvas).on('mousemove', mouseMove).on('mouseout', mouseExit);
};
......@@ -215,4 +216,4 @@ morpheus.ScentedSearch.prototype = {
}
};
morpheus.Util.extend(morpheus.ScentedSearch, morpheus.AbstractCanvas);
\ No newline at end of file
morpheus.Util.extend(morpheus.ScentedSearch, morpheus.AbstractCanvas);
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