made tabs compact

css/morpheus.css

@@ -93,3 +93,18 @@
     padding: 2px !important;
     background-color: white !important;
 }
+
+.nav-tabs.compact > li > a {
+    font-size: 0.9em;
+    padding: 1px 5px;
+    margin-right: 4px;
+    line-height: 16px;
+}
+
+.form-compact .form-control {
+    padding: 0px 2px;
+    height: 22px;
+    font-size: 13px;
+}
+
+

src/io/buffered_reader.js

@@ -88,6 +88,7 @@ morpheus.BufferedReader.getArrayBuffer = function (fileOrUrl, callback) {
 		};
 
 		oReq.send(null);
+		return oReq;
 	} else {
 		var reader = new FileReader();
 		reader.onload = function (event) {
@@ -97,5 +98,6 @@ morpheus.BufferedReader.getArrayBuffer = function (fileOrUrl, callback) {
 			callback(event);
 		};
 		reader.readAsArrayBuffer(fileOrUrl);
+		return reader;
 	}
 };

src/ui/heat_map.js

@@ -261,7 +261,8 @@ morpheus.HeatMap = function (options) {
 			});
 			// var $img = $a.find('img');
 
-			var $right = $('<li style="margin-right:2px;" class="pull-right"></li>');
+			var $right = $('<li data-name="help" style="margin-right:2px;"' +
+				' class="pull-right"></li>');
 			$a.appendTo($right);
 			new morpheus.HelpMenu().$el.appendTo($right);
 			$right.appendTo(this.tabManager.$nav);
@@ -393,6 +394,7 @@ morpheus.HeatMap = function (options) {
 
 		if (_this.options.focus) {
 			_this.tabManager.setActiveTab(tab.id);
+			$(_this.heatmap.canvas).focus();
 		}
 		_this.$el.trigger('heatMapLoaded', _this);
 	};
@@ -480,6 +482,7 @@ morpheus.HeatMap = function (options) {
 				message.push(err.message);
 
 			}
+
 			morpheus.FormBuilder.showInModal({
 				title: 'Error',
 				html: message.join('')
@@ -2294,6 +2297,7 @@ morpheus.HeatMap.prototype = {
 						if (this.options.inlineTooltip) {
 							this.tooltipProvider(this, inline[hoverIndex], -1,
 								options, '<br />', true, tipFollowText);
+
 						}
 					}
 					this._setTipText(tipText, tipFollowText, options);
@@ -2414,8 +2418,16 @@ morpheus.HeatMap.prototype = {
 		if (this.options.inlineTooltip) {
 			this.tooltipProvider(this, rowIndex, columnIndex,
 				options, '<br />', true, tipFollowText);
+
+			if (this.options.tooltip && rowIndex !== -1 && columnIndex !== -1) {
+				tipFollowText.push('<div data-name="tip"></div>');
+
+			}
 		}
 		this._setTipText(tipText, tipFollowText, options);
+		if (this.options.tooltip && rowIndex !== -1 && columnIndex !== -1) {
+			this.options.tooltip(this, rowIndex, columnIndex, this.$tipFollow.find('[data-name=tip]'));
+		}
 
 	}
 	,
@@ -2446,7 +2458,7 @@ morpheus.HeatMap.prototype = {
 		_.each(tracks, function (track) {
 			var existingTrack = _this.getTrack(track.name, track.isColumns);
 			if (track.visible && existingTrack != null
-				&& _.keys(existingTrack.renderSettings).length === 0) {
+				&& _.keys(existingTrack.settings).length === 0) {
 				existingTrack.settingFromConfig('Text');
 			}
 			_this.setTrackVisible(track.name, track.visible, track.isColumns);
@@ -2914,6 +2926,9 @@ morpheus.HeatMap.prototype = {
 		this.hscroll.setValue(pos, true);
 	}
 	,
+	isSelectedTrackColumns: function () {
+		return this.selectedTrackIsColumns;
+	},
 	setSelectedTrack: function (name, isColumns) {
 		if (name !== this.selectedTrackName
 			|| isColumns !== this.selectedTrackIsColumns) {

src/ui/heat_map_key_listener.js

 morpheus.HeatMapKeyListener = function (controller) {
 	var keydown = function (e) {
 		var tagName = e.target.tagName;
-		if (tagName == 'INPUT' || tagName == 'SELECT' || tagName == 'TEXTAREA') {
-			return;
-		}
 		var found = false;
 		var commandKey = morpheus.Util.IS_MAC ? e.metaKey : e.ctrlKey;
 		var altKey = e.altKey;
 		var shiftKey = e.shiftKey;
+		if (commandKey && shiftKey && e.which === 70) { // ctrl-shift-f
+			controller.getToolbar().toggleMenu();
+			found = true;
+		}
 
-		if (commandKey && e.which === 65) { // select all
+		if (tagName == 'INPUT' || tagName == 'SELECT' || tagName == 'TEXTAREA') {
+			; // skip
+		} else if (commandKey && e.which === 65) { // select all
 			var active = controller.getActiveComponent();
 			if (active !== -1) {
 				found = true;

src/ui/heat_map_toolbar.js

@@ -3,19 +3,19 @@ morpheus.HeatMapToolBar = function (controller) {
 	this.rowSearchResultModelIndices = [];
 	this.columnSearchResultModelIndices = [];
 	var _this = this;
-	var $el = $('<div class=" hidden-print container-fluid">'
-		+ '<div class="row"><div data-name="lineOneColumn" class="col-xs-12"></div></div>'
-		+ '<div class="row"><div data-name="lineTwoColumn" class="col-xs-12" style="border-bottom: 1px solid #e7e7e7;padding-bottom:4px; margin-bottom:14px;"></div></div>'
+	var $el = $('<div style="white-space:nowrap;" class="hidden-print container-fluid">'
+		+ '<div class="row"><div class="col-xs-12"><div data-name="lineOneColumn"></div></div></div>'
+		+ '<div class="row"><div class="col-xs-12"><div data-name="lineTwoColumn" style="border-bottom: 1px solid #e7e7e7;margin-bottom:10px;"></div></div></div>'
 		+ '</div>');
 	var searchHtml = [];
-	var $search = $('<form name="searchForm" class="form form-inline" role="search"></form>');
+	var $search = $('<form name="searchForm" class="form form-inline form-compact" role="search"></form>');
 	$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">');
+		searchHtml.push('<div class="input-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 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>');
@@ -48,7 +48,7 @@ morpheus.HeatMapToolBar = function (controller) {
 		.push('<div class="form-group" style="margin-right:10px;"></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">'); // 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>');
@@ -82,7 +82,7 @@ morpheus.HeatMapToolBar = function (controller) {
 	searchHtml
 	.push('<div data-name="searchValuesDiv" class="form-group" style="margin-left:10px;">');
 	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" autocomplete="off" name="searchValues"></div>');
+	.push('<div class="input-group"><span class="input-group-addon">Values</span><input type="text" style="width:240px;padding-right:25px;" class="form-control input-sm" autocomplete="off" name="searchValues"></div>');
 	searchHtml.push('</div>');
 	searchHtml.push('<div class="form-group" style="margin-left:4px;">');
 	searchHtml
@@ -94,7 +94,7 @@ morpheus.HeatMapToolBar = function (controller) {
 	.push('<div style="display: none;  margin-left:10px;" data-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" autocomplete="off" name="searchRowDendrogram"></div>');
+	.push('<div class="input-group"><span class="input-group-addon">Row Dendrogram</span><input type="text" style="width:240px;" class="form-control input-sm" autocomplete="off" name="searchRowDendrogram"></div>');
 	searchHtml
 	.push('<h6 data-name="searchResultsRowDendrogram" style="display: inline;"></h6>');
 	searchHtml.push('</div>');
@@ -103,7 +103,7 @@ morpheus.HeatMapToolBar = function (controller) {
 	.push('<div style="display: none; margin-left:10px;"' +
 		' data-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" autocomplete="off" name="searchColumnDendrogram"></div>');
+	.push('<div class="input-group"><span class="input-group-addon">Column Dendrogram</span><input type="text" style="width:240px;" class="form-control input-sm" autocomplete="off" name="searchColumnDendrogram"></div>');
 	searchHtml
 	.push('<h6 data-name="searchResultsColumnDendrogram" style="display: inline;"></h6>');
 	searchHtml.push('</div>');
@@ -235,7 +235,6 @@ morpheus.HeatMapToolBar = function (controller) {
 	// legend
 	if (controller.options.toolbar.colorKey) {
 		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>');
 		toolbarHtml.push('<ul data-name="key" class="dropdown-menu" role="menu">');
@@ -244,15 +243,17 @@ morpheus.HeatMapToolBar = function (controller) {
 		toolbarHtml.push('</div>');
 	}
 
-	$search.appendTo($el.find('[data-name=lineOneColumn]'));
+	var $lineOneColumn = $el.find('[data-name=lineOneColumn]');
+	$search.appendTo($lineOneColumn);
 	var $toolbarForm = $(toolbarHtml.join(''));
 	$toolbarForm.appendTo($buttons);
 	if (controller.options.$help) {
 		controller.options.$help.appendTo($buttons);
 	}
 	$('<div data-name="tip" style="height: 14px; font-size: 12px;overflow:hidden;"></div>').appendTo($el.find('[data-name=lineTwoColumn]'));
-	$el.prependTo(controller.$content);
 
+	// $hide.appendTo($el.find('[data-name=toggleEl]'));
+	$el.prependTo(controller.$content);
 	var $tools = $el.find('[data-name=tools]');
 	this.$tip = $el.find('[data-name=tip]');
 	$tools.on('click', 'li > a', function (e) {
@@ -622,6 +623,15 @@ morpheus.HeatMapToolBar = function (controller) {
 			eventAction: 'resetZoom'
 		});
 	});
+	this.toggleMenu = function () {
+		if ($lineOneColumn.css('display') === 'none') {
+			$lineOneColumn.css('display', '');
+			_this.$rowTextField.focus();
+		} else {
+			$lineOneColumn.css('display', 'none');
+			$(_this.controller.heatmap.canvas).focus();
+		}
+	};
 	this.$el = $el;
 	var updateFilterStatus = function () {
 		if (controller.getProject().getRowFilter().isEnabled()

src/ui/tab_manager.js

@@ -10,7 +10,7 @@ morpheus.TabManager = function (options) {
 	this.activeTabObject = null;
 	this.activeTabId = null;
 	this.idToTabObject = new morpheus.Map();
-	this.$nav = $('<ul class="nav nav-tabs"></ul>');
+	this.$nav = $('<ul class="nav nav-tabs compact"></ul>');
 	this.$nav.on('click', 'li > a', function (e) {
 		var tabId = $(this).attr('href');
 		e.preventDefault();
@@ -255,6 +255,16 @@ morpheus.TabManager.prototype = {
 			tab: target
 		});
 	},
+	setOptions: function (options) {
+		this.options = options;
+		if (this.options.autohideTabBar) {
+			this.$nav.css('display', this.idToTabObject.size() > 1 ? ''
+				: 'none');
+		}
+	},
+	getOptions: function () {
+		return this.options;
+	},
 	setActiveTab: function (id) {
 		if (id === this.activeTabId) {
 			this.trigger('change', {