Skip to content

GitLab

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

include column dendrogram

parent ec5d8e3e
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 624 additions and 334 deletions
Gruntfile.js
View file @ 88d8eb71
/*global module:false*/ /*global module:false*/
module.exports = function(grunt) { module.exports = function (grunt) {
grunt grunt
.initConfig({ .initConfig({
pkg : grunt.file.readJSON('package.json'), pkg: grunt.file.readJSON('package.json'),
meta : { meta: {
banner : '/*! <%= pkg.title || pkg.name %> - v<%= pkg.version %> - ' banner: '/*! <%= pkg.title || pkg.name %> - v<%= pkg.version %> - '
+ '<%= grunt.template.today("yyyy-mm-dd") %>\n' + '<%= grunt.template.today("yyyy-mm-dd") %>\n'
+ '<%= pkg.homepage ? "* " + pkg.homepage + "\n" : "" %>' + '<%= pkg.homepage ? "* " + pkg.homepage + "\n" : "" %>'
+ '* Copyright (c) <%= grunt.template.today("yyyy") %> <%= pkg.author.name %>; %> */' + '* Copyright (c) <%= grunt.template.today("yyyy") %> <%= pkg.author.name %>; %> */'
},
uglify: {
morpheus: {
options: {
mangle: false,
preserveComments: false
}, },
uglify : { files: {
morpheus : { 'js/morpheus-latest.min.js': ['js/morpheus.js']
options : { }
mangle : false, },
preserveComments : false extJs: {
}, options: {
files : { mangle: false,
'js/morpheus-latest.min.js' : [ 'js/morpheus.js' ] preserveComments: false
}
},
extJs : {
options : {
mangle : false,
preserveComments : false
},
files : {
'js/morpheus-external.min.js' : [ 'js/morpheus-external.js' ]
}
}
},
cssmin : {
css : {
src : 'css/morpheus.all.css',
dest : 'css/morpheus-latest.min.css'
}
},
concat : {
css : {
src : [ 'css/bootstrap.min.css',
'css/bootstrap-select.min.css',
'css/jquery-ui.min.css',
'css/font-awesome.min.css',
'css/hopscotch.min.css', 'css/slick.grid.css',
'css/animate.css', 'css/morpheus.css' ],
dest : 'css/morpheus.all.css'
},
extJsAll : {
src : [ 'js/morpheus-external.min.js',
'js/plotly-latest.min.js' ],
dest : 'js/morpheus-external-latest.min.js'
},
extJs : {
nonull : true,
dest : 'js/morpheus-external.js',
src : [ 'js/d3.min.js', 'js/jquery-1.11.1.min.js',
'js/bootstrap.min.js', 'js/underscore-min.js',
'js/newick.js', 'js/hammer.min.js',
'js/jquery.mousewheel.min.js',
'js/bootstrap-select.min.js',
'js/xlsx.full.min.js', 'js/canvas2svg.js',
'js/canvg.js', 'js/rgbcolor.js',
'js/jquery-ui.min.js', 'js/parser.js',
'js/FileSaver.min.js', 'js/Blob.js',
'js/canvas-toBlob.js', 'js/colorbrewer.js',
'js/hopscotch.min.js', 'js/typed.min.js',
'js/jquery.event.drag-2.2.js',
'js/clipboard.min.js', 'js/slick.min.js',
'js/js.cookie.js', 'js/d3.layout.cloud.js' ]
},
morpheus : {
nonull : true,
dest : 'js/morpheus.js',
src : [ 'src/util/util.js', 'src/util/*.js',
'src/io/*.js', 'src/matrix/vector_adapter.js',
'src/matrix/*.js', 'src/*.js',
'src/tools/*.js', 'src/ui/*.js', 'src/**/*.js' ]
}
}, },
watch : { files: {
files : [ 'src/*.js', 'src/**/*.js' ], 'js/morpheus-external.min.js': ['js/morpheus-external.js']
tasks : [ 'concat:morpheus' ]
} }
}); }
},
cssmin: {
css: {
src: 'css/morpheus.all.css',
dest: 'css/morpheus-latest.min.css'
}
},
concat: {
css: {
src: ['css/bootstrap.min.css',
'css/bootstrap-select.min.css',
'css/jquery-ui.min.css',
'css/font-awesome.min.css',
'css/hopscotch.min.css', 'css/slick.grid.css', 'css/morpheus.grid.css',
'css/animate.css', 'css/morpheus.css'],
dest: 'css/morpheus.all.css'
},
extJsAll: {
src: ['js/morpheus-external.min.js',
'js/plotly-latest.min.js'],
dest: 'js/morpheus-external-latest.min.js'
},
extJs: {
nonull: true,
dest: 'js/morpheus-external.js',
src: ['js/d3.min.js', 'js/jquery-1.11.1.min.js',
'js/bootstrap.min.js', 'js/underscore-min.js',
'js/newick.js', 'js/hammer.min.js',
'js/jquery.mousewheel.min.js',
'js/bootstrap-select.min.js',
'js/xlsx.full.min.js', 'js/canvas2svg.js',
'js/canvg.js', 'js/rgbcolor.js',
'js/jquery-ui.min.js', 'js/parser.js',
'js/FileSaver.min.js', 'js/Blob.js',
'js/canvas-toBlob.js', 'js/colorbrewer.js',
'js/hopscotch.min.js', 'js/typed.min.js',
'js/jquery.event.drag-2.2.js',
'js/clipboard.min.js', 'js/slick.min.js',
'js/js.cookie.js', 'js/d3.layout.cloud.js']
},
morpheus: {
nonull: true,
dest: 'js/morpheus.js',
src: ['src/util/util.js', 'src/util/*.js',
'src/io/*.js', 'src/matrix/vector_adapter.js',
'src/matrix/*.js', 'src/*.js',
'src/tools/*.js', 'src/ui/*.js', 'src/**/*.js']
}
},
watch: {
files: ['src/*.js', 'src/**/*.js'],
tasks: ['concat:morpheus']
}
});
// rebuild js and css: // rebuild js and css:
// grunt concat:morpheus concat:extJs uglify concat:extJsAll // grunt concat:morpheus concat:extJs uglify concat:extJsAll
......
css/morpheus-latest.min.css
View file @ 88d8eb71
This source diff could not be displayed because it is too large. You can view the blob instead.
css/morpheus.grid.css 0 → 100644
View file @ 88d8eb71
.slick-cell {
margin: 0px;
border: none;
padding: 0px;
background-color: inherit;
white-space: normal !important;
}
.slick-row {
font-size: 13px;
line-height: 100%;
padding: 0px;
margin: 0px;
}
.slick-header-column.ui-state-default {
height: 20px;
line-height: 20px;
padding: 0px;
background: none;
background-color: #f6f7f8;
}
.slick-header-columns {
background-color: white;
}
.slick-table .ui-widget-content {
background: none;
}
.slick-table-compact .slick-row {
font-size: 12px;
}
.slick-table .slick-row {
background-color: white;
}
.slick-striped-table .slick-row.odd {
background-color: #fafafa;
}
.slick-bordered-table .ui-widget-content {
border-bottom: 1px solid #eee !important;
}
.slick-header-column {
color: black;
background-color: white;
font-weight: bold;
border-left: 1px solid black;
}
.slick-cell, .slick-headerrow-column {
overflow: hidden;
text-overflow: ellipsis;
}
.slick-header {
background-color: white;
border: none !important;
}
.slick-cell.selected {
background-color: #d9edf7;
}
.slick-stacked .slick-visible-stacked {
display: block;
}
.slick-table:not (.slick-stacked) .slick-visible-not-stacked {
display: block;
}
.slick-visible-not-stacked {
display: none;
}
.slick-visible-stacked {
display: none;
}
.slick-sort-indicator-desc {
background: none;
}
.slick-sort-indicator-asc {
background: none;
}
.slick-sort-indicator-desc::after {
content: "\f0dd";
font-family: FontAwesome;
margin-right: 3px;
margin-left: 4px;
margin-top: -3px;
}
.slick-sort-indicator {
float: none !important;
margin: 0 !important;
}
.slick-header-column-sorted {
font-style: normal;
}
.slick-column-name {
margin-left: 4px;
}
.slick-sort-indicator-asc::after {
content: "\f0de";
font-family: FontAwesome;
margin-right: 3px;
margin-left: 4px;
margin-top: -3px;
float: none;
}
.slick-cell-wrapper {
max-width: 0;
overflow: hidden;
vertical-align: middle;
display: table-cell;
text-overflow: ellipsis;
}
.slick-table-wrapper {
display: table;
height: 100%;
padding-left: 2px;
width: 100%;
}
js/morpheus-latest.min.js
View file @ 88d8eb71
This diff is collapsed.
src/ui/checkbox_list.js
View file @ 88d8eb71
...@@ -3,22 +3,22 @@ ...@@ -3,22 +3,22 @@
* options.set set of selected items * options.set set of selected items
* @see morpheus.Table * @see morpheus.Table
*/ */
morpheus.CheckBoxList = function(options) { morpheus.CheckBoxList = function (options) {
var _this = this; var _this = this;
var set = options.set || new morpheus.Set(); var set = options.set || new morpheus.Set();
options = $.extend(true, {}, { options = $.extend(true, {}, {
height : '138px', height: '150px',
showHeader : false, showHeader: false,
select : false, select: false,
search : true, search: true,
checkBoxSelectionOnTop : false, checkBoxSelectionOnTop: false,
rowHeader : function(item) { rowHeader: function (item) {
var header = []; var header = [];
// header // header
// .push('<div style="overflow: hidden;text-overflow: ellipsis;" // .push('<div style="overflow: hidden;text-overflow: ellipsis;"
// class="morpheus-hover">'); // class="morpheus-hover">');
header.push('<span><input name="toggle" type="checkbox" ' header.push('<span><input name="toggle" type="checkbox" '
+ (set.has(_this.getter(item)) ? ' checked' : '') + '/> '); + (set.has(_this.getter(item)) ? ' checked' : '') + '/> ');
header.push('</span>'); header.push('</span>');
// header // header
// .push('<button // .push('<button
...@@ -48,42 +48,44 @@ morpheus.CheckBoxList = function(options) { ...@@ -48,42 +48,44 @@ morpheus.CheckBoxList = function(options) {
var html = []; var html = [];
var table = new morpheus.Table(options); var table = new morpheus.Table(options);
if (options.columns.length === 1) {
options.$el.find('.slick-table-header').find('[name=right]').remove();
}
this.table = table; this.table = table;
var html = []; var html = [];
html.push('<div style="font-size:12px;">'); html.push('<div style="display:inline;">');
html.push('<div style="display:inline;" class="dropdown">'); html.push('<div style="display:inline;" class="dropdown">');
html html
.push('<button type="button" data-toggle="dropdown" class="btn btn-default btn-xs dropdown-toggle" aria-haspopup="true" aria-expanded="false">'); .push('<button type="button" data-toggle="dropdown" class="btn btn-default btn-xs dropdown-toggle" aria-haspopup="true" aria-expanded="false">');
html.push('<span class="caret"></span>'); html.push('<span class="caret"></span>');
html.push('</button>'); html.push('</button>');
html.push('<ul style="font-size:12px;" class="dropdown-menu">'); html.push('<ul style="font-size:12px;" class="dropdown-menu">');
html.push('<li><a name="selectAll" href="#">All</a></li>'); html.push('<li><a name="selectAll" href="#">Select All</a></li>');
html.push('<li><a name="selectNone" href="#">None</a></li>'); html.push('<li><a name="selectNone" href="#">Select None</a></li>');
html.push('<li><a name="invertSel" href="#">Invert</a></li>'); html.push('<li><a name="invertSel" href="#">Invert Selection</a></li>');
html.push('</ul>'); html.push('</ul>');
html.push('</div>'); html.push('</div>');
html.push('<span name="checkBoxResults" style="padding-left:6px;"></span>'); html.push('<span name="checkBoxResults" style="padding-left:6px;"></span>');
html.push('</div>'); html.push('</div>');
var $div = $(html.join('')); var $checkBoxEl = $(html.join(''));
var $checkBoxResults = $div.find('[name=checkBoxResults]'); table.$header.find('[name=left]').html($checkBoxEl);
table.$gridDiv.before($div); var $checkBoxResults = $checkBoxEl.find('[name=checkBoxResults]');
var $selectAll = $checkBoxEl.find('[name=selectAll]');
var $selectAll = $div.find('[name=selectAll]'); var $selectNone = $checkBoxEl.find('[name=selectNone]');
var $selectNone = $div.find('[name=selectNone]'); $selectAll.on('click', function (e) {
$selectAll.on('click', function(e) {
var items = table.getItems(); var items = table.getItems();
for (var i = 0, nitems = items.length; i < nitems; i++) { for (var i = 0, nitems = items.length; i < nitems; i++) {
set.add(_this.getter(items[i])); set.add(_this.getter(items[i]));
} }
_this.table.trigger('checkBoxSelectionChanged', { _this.table.trigger('checkBoxSelectionChanged', {
source : _this, source: _this,
set : set set: set
}); });
e.preventDefault(); e.preventDefault();
_this.table.redraw(); _this.table.redraw();
}); });
$div.find('[name=invertSel]').on('click', function(e) { $checkBoxEl.find('[name=invertSel]').on('click', function (e) {
// selected become unselected, unselected become selected // selected become unselected, unselected become selected
var items = table.getItems(); var items = table.getItems();
for (var i = 0, nitems = items.length; i < nitems; i++) { for (var i = 0, nitems = items.length; i < nitems; i++) {
...@@ -96,20 +98,20 @@ morpheus.CheckBoxList = function(options) { ...@@ -96,20 +98,20 @@ morpheus.CheckBoxList = function(options) {
} }
_this.table.trigger('checkBoxSelectionChanged', { _this.table.trigger('checkBoxSelectionChanged', {
source : _this, source: _this,
set : set set: set
}); });
e.preventDefault(); e.preventDefault();
_this.table.redraw(); _this.table.redraw();
}); });
$selectNone.on('click', function(e) { $selectNone.on('click', function (e) {
var items = table.getItems(); var items = table.getItems();
for (var i = 0, nitems = items.length; i < nitems; i++) { for (var i = 0, nitems = items.length; i < nitems; i++) {
set.remove(_this.getter(items[i])); set.remove(_this.getter(items[i]));
} }
_this.table.trigger('checkBoxSelectionChanged', { _this.table.trigger('checkBoxSelectionChanged', {
source : _this, source: _this,
set : set set: set
}); });
e.preventDefault(); e.preventDefault();
...@@ -119,10 +121,10 @@ morpheus.CheckBoxList = function(options) { ...@@ -119,10 +121,10 @@ morpheus.CheckBoxList = function(options) {
this.set = set; this.set = set;
this.table = table; this.table = table;
$checkBoxResults.html('selected ' + morpheus.Util.intFormat(set.size()) $checkBoxResults.html('selected ' + morpheus.Util.intFormat(set.size())
+ ' of ' + morpheus.Util.intFormat(table.getAllItemCount())); + ' of ' + morpheus.Util.intFormat(table.getAllItemCount()));
var priorCount = 0; var priorCount = 0;
this.table.on('checkBoxSelectionChanged', function() { this.table.on('checkBoxSelectionChanged', function () {
// if (options.checkBoxSelectionOnTop) { // if (options.checkBoxSelectionOnTop) {
// var selectedItems = set.values(); // var selectedItems = set.values();
// selectedItems.sort(); // selectedItems.sort();
...@@ -146,91 +148,91 @@ morpheus.CheckBoxList = function(options) { ...@@ -146,91 +148,91 @@ morpheus.CheckBoxList = function(options) {
// priorCount = set.size(); // priorCount = set.size();
// } // }
$checkBoxResults.html('selected ' + morpheus.Util.intFormat(set.size()) $checkBoxResults.html('selected ' + morpheus.Util.intFormat(set.size())
+ ' of ' + morpheus.Util.intFormat(table.getAllItemCount())); + ' of ' + morpheus.Util.intFormat(table.getAllItemCount()));
_this.table.redraw(); _this.table.redraw();
}); });
table.on('click', table.on('click',
function(e) { function (e) {
var $target = $(e.target); var $target = $(e.target);
var item = table.getItems()[e.row]; var item = table.getItems()[e.row];
var value = _this.getter(item); var value = _this.getter(item);
if ($target.is('.morpheus-hover-show')) { // only if ($target.is('.morpheus-hover-show')) { // only
set.clear(); set.clear();
set.add(value);
_this.table.trigger('checkBoxSelectionChanged', {
source: _this,
set: set
});
} else if (!options.select
|| ($target.is('[type=checkbox]') && $target
.attr('name') === 'toggle')) {
if (set.has(value)) {
set.remove(value);
} else {
set.add(value); set.add(value);
_this.table.trigger('checkBoxSelectionChanged', {
source : _this,
set : set
});
} else if (!options.select
|| ($target.is('[type=checkbox]') && $target
.attr('name') === 'toggle')) {
if (set.has(value)) {
set.remove(value);
} else {
set.add(value);
}
_this.table.trigger('checkBoxSelectionChanged', {
source : _this,
set : set
});
} }
_this.table.trigger('checkBoxSelectionChanged', {
source: _this,
set: set
});
}
}); });
}; };
morpheus.CheckBoxList.prototype = { morpheus.CheckBoxList.prototype = {
searchWithPredicates : function(predicates) { searchWithPredicates: function (predicates) {
this.table.searchWithPredicates(predicates); this.table.searchWithPredicates(predicates);
}, },
autocomplete : function(tokens, cb) { autocomplete: function (tokens, cb) {
this.table.autocomplete(tokens, cb); this.table.autocomplete(tokens, cb);
}, },
setHeight : function(height) { setHeight: function (height) {
this.table.setHeight(height); this.table.setHeight(height);
}, },
resize : function() { resize: function () {
this.table.resize(); this.table.resize();
}, },
setSearchVisible : function(visible) { setSearchVisible: function (visible) {
this.table.setSearchVisible(visible); this.table.setSearchVisible(visible);
}, },
getSelectedRows : function() { getSelectedRows: function () {
return this.table.getSelectedRows(); return this.table.getSelectedRows();
}, },
getSelectedItems : function() { getSelectedItems: function () {
return this.table.getSelectedItems(); return this.table.getSelectedItems();
}, },
setSelectedRows : function(rows) { setSelectedRows: function (rows) {
this.table.setSelectedRows(rows); this.table.setSelectedRows(rows);
}, },
getItems : function(items) { getItems: function (items) {
return this.table.getItems(); return this.table.getItems();
}, },
getAllItemCount : function() { getAllItemCount: function () {
return this.table.getAllItemCount(); return this.table.getAllItemCount();
}, },
getFilteredItemCount : function() { getFilteredItemCount: function () {
return this.table.getFilteredItemCount(); return this.table.getFilteredItemCount();
}, },
setFilter : function(f) { setFilter: function (f) {
this.table.setFilter(f); this.table.setFilter(f);
}, },
redraw : function() { redraw: function () {
this.table.redraw(); this.table.redraw();
}, },
getSelection : function() { getSelection: function () {
return this.set; return this.set;
}, },
clearSelection : function(values) { clearSelection: function (values) {
this.set.clear(); this.set.clear();
this.table.redraw(); this.table.redraw();
}, },
setValue : function(values) { setValue: function (values) {
this.setSelectedValues(values); this.setSelectedValues(values);
}, },
setSelectedValues : function(values) { setSelectedValues: function (values) {
this.set.clear(); this.set.clear();
if (morpheus.Util.isArray(values)) { if (morpheus.Util.isArray(values)) {
...@@ -242,17 +244,17 @@ morpheus.CheckBoxList.prototype = { ...@@ -242,17 +244,17 @@ morpheus.CheckBoxList.prototype = {
} }
this.table.redraw(); this.table.redraw();
}, },
val : function() { val: function () {
return this.set.values(); return this.set.values();
}, },
on : function(evtStr, handler) { on: function (evtStr, handler) {
this.table.on(evtStr, handler); this.table.on(evtStr, handler);
return this; return this;
}, },
off : function(evtStr, handler) { off: function (evtStr, handler) {
this.table.off(evtStr, handler); this.table.off(evtStr, handler);
}, },
setItems : function(items) { setItems: function (items) {
// remove items in selection that are not in new items // remove items in selection that are not in new items
var newItems = new morpheus.Set(); var newItems = new morpheus.Set();
var getter = this.getter; var getter = this.getter;
...@@ -261,21 +263,16 @@ morpheus.CheckBoxList.prototype = { ...@@ -261,21 +263,16 @@ morpheus.CheckBoxList.prototype = {
} }
var selection = this.set; var selection = this.set;
selection.forEach(function(val) { selection.forEach(function (val) {
if (!newItems.has(val)) { if (!newItems.has(val)) {
selection.remove(val); selection.remove(val);
} }
}); });
// if (this.table.tableSearch) {
// this.table.tableSearch.$el.css('display',
// items.length <= 6 ? 'none' : '');
// }
this.table.setItems(items); this.table.setItems(items);
this.table.trigger('checkBoxSelectionChanged', { this.table.trigger('checkBoxSelectionChanged', {
source : this, source: this,
set : selection set: selection
}); });
} }
}; };
src/ui/grid.js
View file @ 88d8eb71
...@@ -14,6 +14,7 @@ morpheus.Grid = function (options) { ...@@ -14,6 +14,7 @@ morpheus.Grid = function (options) {
return column.getter(item); return column.getter(item);
} }
this.filter = new morpheus.CombinedGridFilter();
var model = { var model = {
getLength: function () { getLength: function () {
return _this.viewOrder != null ? _this.viewOrder.length return _this.viewOrder != null ? _this.viewOrder.length
...@@ -115,10 +116,7 @@ morpheus.Grid = function (options) { ...@@ -115,10 +116,7 @@ morpheus.Grid = function (options) {
} }
} }
if (column != null) { if (column != null) {
sortCols.push({
sortCol: column,
sortAsc: c.sortAsc
});
gridSortColumns.push({ gridSortColumns.push({
columnId: column.id, columnId: column.id,
sortAsc: c.sortAsc sortAsc: c.sortAsc
...@@ -127,10 +125,7 @@ morpheus.Grid = function (options) { ...@@ -127,10 +125,7 @@ morpheus.Grid = function (options) {
console.log(c.name + ' not found.'); console.log(c.name + ' not found.');
} }
}); });
grid.setSortColumns(gridSortColumns); this.setSortColumns(gridSortColumns);
this.sortCols = sortCols;
this._updateMappings();
grid.invalidate();
} }
this.grid.invalidate(); this.grid.invalidate();
...@@ -138,6 +133,23 @@ morpheus.Grid = function (options) { ...@@ -138,6 +133,23 @@ morpheus.Grid = function (options) {
}; };
morpheus.Grid.prototype = { morpheus.Grid.prototype = {
columnsAutosized: false, columnsAutosized: false,
setSortColumns: function (gridSortColumns) {
this.grid.setSortColumns(gridSortColumns);
this.sortCols = [];
for (var i = 0; i < gridSortColumns.length; i++) {
var column = this.grid.getColumns()[this.grid.getColumnIndex(gridSortColumns[i].columnId)];
if (column == null) {
throw "Unable to find column " + gridSortColumns[i];
}
this.sortCols.push({
sortCol: column,
sortAsc: gridSortColumns[i].sortAsc
});
}
this._updateMappings();
this.grid.invalidate();
},
setColumns: function (columns) { setColumns: function (columns) {
this.grid.setColumns(columns); this.grid.setColumns(columns);
this.grid.resizeCanvas(); this.grid.resizeCanvas();
...@@ -200,10 +212,12 @@ morpheus.Grid.prototype = { ...@@ -200,10 +212,12 @@ morpheus.Grid.prototype = {
this.grid.setSelectedRows([]); this.grid.setSelectedRows([]);
} }
this.setFilter(this.filter); this.setFilter(this.filter);
this.maybeAutoResizeColumns();
},
maybeAutoResizeColumns: function () {
if (!this.columnsAutosized) { if (!this.columnsAutosized) {
this.autosizeColumns(); this.autosizeColumns();
} }
}, },
convertModelIndexToView: function (modelIndex) { convertModelIndexToView: function (modelIndex) {
if (this.modelToView !== null) { if (this.modelToView !== null) {
...@@ -229,14 +243,16 @@ morpheus.Grid.prototype = { ...@@ -229,14 +243,16 @@ morpheus.Grid.prototype = {
} }
this.viewOrder = null; this.viewOrder = null;
if (this.filter != null) { if (this.filter != null) {
this.viewOrder = []; this.filter.init();
for (var i = 0, length = this.items.length; i < length; i++) { if (!this.filter.isEmpty()) {
if (this.filter(this.items[i])) { this.viewOrder = [];
this.viewOrder.push(i); for (var i = 0, length = this.items.length; i < length; i++) {
if (this.filter.accept(this.items[i])) {
this.viewOrder.push(i);
}
} }
} }
} }
var cols = this.sortCols; var cols = this.sortCols;
if (cols && cols.length > 0) { if (cols && cols.length > 0) {
if (this.viewOrder == null) { if (this.viewOrder == null) {
...@@ -247,14 +263,15 @@ morpheus.Grid.prototype = { ...@@ -247,14 +263,15 @@ morpheus.Grid.prototype = {
} }
var ncols = cols.length; var ncols = cols.length;
var items = this.items; var items = this.items;
// nulls always go at end
this.viewOrder.sort(function (index1, index2) { this.viewOrder.sort(function (index1, index2) {
for (var i = 0; i < ncols; i++) { for (var i = 0; i < ncols; i++) {
var getter = cols[i].sortCol.getter; var getter = cols[i].sortCol.getter;
var sign = cols[i].sortAsc ? 1 : -1; var comparator = cols[i].sortAsc ? morpheus.SortKey.ASCENDING_COMPARATOR : morpheus.SortKey.DESCENDING_COMPARATOR;
var value1 = getter(items[index1]); var value1 = getter(items[index1]);
var value2 = getter(items[index2]); var value2 = getter(items[index2]);
var comparator = cols[i].sortCol.comparator; var result = comparator(value1, value2);
var result = comparator(value1, value2) * sign;
if (result !== 0) { if (result !== 0) {
return result; return result;
} }
...@@ -295,78 +312,78 @@ morpheus.Grid.prototype = { ...@@ -295,78 +312,78 @@ morpheus.Grid.prototype = {
return this.filter; return this.filter;
}, },
autosizeColumns: function () { autosizeColumns: function () {
var columns = this.grid.getColumns(); var columns = this.grid.getColumns();
var items = this.getItems(); var items = this.getItems();
if (!items || items.length == 0) {
if (!items || items.length === 0 || !columns || columns.length === 0) {
return; return;
} }
if (!columns || columns.length === 0) { var gridWidth = this.options.$el.width() - 30;
if (gridWidth <= 0) {
return; return;
} }
this.columnsAutosized = true; this.columnsAutosized = true;
if (columns.length <= 1) { if (columns.length > -1) {
return; var div = document.createElement('div');
} document.body.appendChild(div);
var $d = $(div);
var div = document.createElement('div'); $d.css({
document.body.appendChild(div); position: 'absolute',
var $d = $(div); left: -1000,
top: -1000
});
$d.css({ var $row = $('<div class="slick-table">'
position: 'absolute', + '<div class="ui-state-default slick-header-column slick-header-sortable ui-sortable-handle"></div>'
left: -1000, + '<div class="ui-widget-content slick-row"><div class="slick-cell selected"></div></div>'
top: -1000 + '</div>');
}); var $cell = $row.find('.slick-cell');
var $header = $row.find('.slick-header-column');
$row.appendTo($d);
var $row = $('<div class="slick-table">' var maxWidth = Math.min(parseInt(gridWidth / 2), 400);
+ '<div class="ui-state-default slick-header-column slick-header-sortable ui-sortable-handle"></div>' var getColumnWidth = function (column) {
+ '<div class="ui-widget-content slick-row"><div class="slick-cell selected"></div></div>' var w = $header.html(column.name).outerWidth() + 13; // leave space for sort indicator
+ '</div>');
var $cell = $row.find('.slick-cell');
var $header = $row.find('.slick-header-column');
$row.appendTo($d);
var gridWidth = this.options.$el.width() - 30;
var maxWidth = Math.min(parseInt(gridWidth / 2), 400);
var getColumnWidth = function (column) {
var w = $header.html(column.name).outerWidth() + 13; // leave space for sort indicator
if (column.prototypeValue) { if (column.prototypeValue) {
$cell.html(column.prototypeValue); $cell.html(column.prototypeValue);
w = Math.max($cell.outerWidth(), w);
} else {
for (var i = 0, nrows = Math.min(items.length, 10); i < nrows; i++) {
var html = column.formatter(i, null, column
.getter(items[i]), column, items[i]);
var $html = $(html);
$html.find('.slick-cell-wrapper').attr('class', '');
$cell.html($html);
w = Math.max($cell.outerWidth(), w); w = Math.max($cell.outerWidth(), w);
} else {
for (var i = 0, nrows = Math.min(items.length, 10); i < nrows; i++) {
var html = column.formatter(i, null, column
.getter(items[i]), column, items[i]);
var $html = $(html);
$html.find('.slick-cell-wrapper').attr('class', '');
$cell.html($html);
w = Math.max($cell.outerWidth(), w);
}
} }
column.width = parseInt(Math.min(maxWidth, w));
};
var totalWidth = 0;
for (var i = 0; i < columns.length; i++) {
getColumnWidth(columns[i]);
totalWidth += columns[i].width;
} }
column.width = parseInt(Math.min(maxWidth, w));
}; if (totalWidth < gridWidth) {
var totalWidth = 0; // grow columns
for (var i = 0; i < columns.length; i++) { // var delta = parseInt((gridWidth - totalWidth) / columns.length);
getColumnWidth(columns[i]); // for (var i = 0; i < columns.length; i++) {
totalWidth += columns[i].width; // //columns[i].width += delta;
} // }
if (totalWidth < gridWidth) {
// grow columns } else if (totalWidth > gridWidth) {
// var delta = parseInt((gridWidth - totalWidth) / columns.length); // shrink
// for (var i = 0; i < columns.length; i++) { //columns[columns.length - 1].width -= (totalWidth - gridWidth);
// //columns[i].width += delta; // shrink last column
// } }
} else if (totalWidth > gridWidth) { $d.remove();
// shrink this.grid.resizeCanvas();
//columns[columns.length - 1].width -= (totalWidth - gridWidth);
// shrink last column
} }
$d.remove();
this.grid.resizeCanvas();
} }
}; };
...@@ -524,3 +541,42 @@ morpheus.AutoTooltips2 = function (options) { ...@@ -524,3 +541,42 @@ morpheus.AutoTooltips2 = function (options) {
}); });
}; };
morpheus.CombinedGridFilter = function () {
this.filters = [];
};
morpheus.CombinedGridFilter.prototype = {
add: function (filter) {
this.filters.push(filter);
},
getFilters: function () {
return this.filters;
},
get: function (index) {
return this.filters[index];
},
set: function (index, f) {
this.filters[index] = f;
},
init: function () {
for (var i = 0; i < this.filters.length; i++) {
this.filters[i].init();
}
this.activeFilters = this.filters.filter(function (f) {
return !f.isEmpty();
});
this.nActiveFilters = this.activeFilters.length;
},
accept: function (item) {
for (var i = 0; i < this.nActiveFilters; i++) {
if (!this.activeFilters[i].accept(item)) {
return false;
}
}
return true;
},
isEmpty: function () {
return this.activeFilters.length === 0;
}
};
src/ui/heat_map.js
View file @ 88d8eb71
...@@ -2949,10 +2949,10 @@ morpheus.HeatMap.prototype = { ...@@ -2949,10 +2949,10 @@ morpheus.HeatMap.prototype = {
height: heatmapPrefSize.height height: heatmapPrefSize.height
}; };
if (this.isDendrogramVisible(false)) { // row dendrogram if (this.isDendrogramVisible(false)) { // row dendrogram
totalSize.width += this.rowDendrogram.getUnscaledWidth(); totalSize.width += this.rowDendrogram.getUnscaledWidth() + morpheus.HeatMap.SPACE_BETWEEN_HEAT_MAP_AND_ANNOTATIONS;
} }
if (this.isDendrogramVisible(true)) { if (this.isDendrogramVisible(true)) {
totalSize.height += this.columnDendrogram.getUnscaledHeight(); totalSize.height += this.columnDendrogram.getUnscaledHeight() + morpheus.HeatMap.SPACE_BETWEEN_HEAT_MAP_AND_ANNOTATIONS;
} }
var maxRowHeaderHeight = 0; var maxRowHeaderHeight = 0;
for (var i = 0, length = this.rowTracks.length; i < length; i++) { for (var i = 0, length = this.rowTracks.length; i < length; i++) {
...@@ -3067,12 +3067,13 @@ morpheus.HeatMap.prototype = { ...@@ -3067,12 +3067,13 @@ morpheus.HeatMap.prototype = {
context.restore(); context.restore();
legendHeight += Math.max(rowTrackLegend.getPreferredSize().height, legendHeight += Math.max(rowTrackLegend.getPreferredSize().height,
columnTrackLegendSize.height); columnTrackLegendSize.height);
var heatmapY = this.isDendrogramVisible(true) ? this.columnDendrogram
.getUnscaledHeight() : 0; var heatmapY = this.isDendrogramVisible(true) ? (this.columnDendrogram
.getUnscaledHeight() + morpheus.HeatMap.SPACE_BETWEEN_HEAT_MAP_AND_ANNOTATIONS) : 0;
heatmapY += legendHeight; heatmapY += legendHeight;
var columnTrackY = heatmapY; var columnTrackY = heatmapY;
var heatmapX = this.isDendrogramVisible(false) ? this.rowDendrogram var heatmapX = this.isDendrogramVisible(false) ? (this.rowDendrogram
.getUnscaledWidth() : 0; .getUnscaledWidth() + morpheus.HeatMap.SPACE_BETWEEN_HEAT_MAP_AND_ANNOTATIONS) : 0;
var isColumnTrackVisible = false; var isColumnTrackVisible = false;
for (var i = 0, length = this.columnTracks.length; i < length; i++) { for (var i = 0, length = this.columnTracks.length; i < length; i++) {
var track = this.columnTracks[i]; var track = this.columnTracks[i];
...@@ -3095,6 +3096,19 @@ morpheus.HeatMap.prototype = { ...@@ -3095,6 +3096,19 @@ morpheus.HeatMap.prototype = {
heatmapY = Math.max(heatmapY, header.getPrintSize().height); heatmapY = Math.max(heatmapY, header.getPrintSize().height);
} }
} }
if (this.isDendrogramVisible(true)) {
var columnDendrogramClip = {
x: 0,
y: 0,
height: this.columnDendrogram.getUnscaledHeight(),
width: heatmapPrefSize.width
};
context.save();
context.translate(heatmapX, legendHeight);
this.columnDendrogram.prePaint(columnDendrogramClip, context);
this.columnDendrogram.draw(columnDendrogramClip, context);
context.restore();
}
if (this.isDendrogramVisible(false)) { if (this.isDendrogramVisible(false)) {
var rowDendrogramClip = { var rowDendrogramClip = {
x: 0, x: 0,
......
src/ui/table.js
View file @ 88d8eb71
This diff is collapsed.
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