Check in map of science's comparison view for 1.4 release testing

Remaining works:
- support csv download for sub-entity
- show sub-entity mapping results

productMods/css/visualization/mapofscience/layout.css

@@ -99,36 +99,36 @@ a.clear-selected-entities {
 
 /* filter */
 
-.filter-option {
+.filter-option, .comparison-filter-option {
 	color: #2485AE;
 	cursor: pointer;
 	/*padding-right: 5px;*/
 	text-decoration: underline;
 }
 
-.active-filter {
+.active-filter, .comparison-active-filter {
 	color: #595B5B;
 	text-decoration: none;
 }
 
-.filterInfoIcon {
+.filterInfoIcon, .comparisonFilterInfoIcon {
 	/*vertical-align:top;*/
 	width:15px;
 	margin-left: 9px;
 }
 
-#science-areas-filter {
+.science-areas-filter {
 	margin-bottom: 10px;
 } 
 
 /* search in table */
 
-.sDomSearchBar {
+.sDomSearchBar, .sDomComparisonSearchBar {
     margin-bottom: -10px;
     margin-left: 41%;
 }
 
-#reset-search {
+#reset-search, #comparison-reset-search {
     color: #2485AE;
     cursor: pointer;
     margin-left: 10px;

productMods/js/visualization/mapofscience/ComparisonDataTableWidget.js

@@ -0,0 +1,267 @@
+/* $This file is distributed under the terms of the license in /doc/license.txt$ */
+
+var ComparisonDataTableWidget = Class.extend({
+	
+	dom: {
+		searchBarParentContainerClass : "comparisonSearchbar",
+		paginationContainerClass : "paginatedtabs",
+		containerID: "main-science-areas-table-container",
+		footerID: "main-science-areas-table-footer",
+		firstFilterID: "comparison-first-filter",
+		secondFilterID: "comparison-second-filter",
+		filterOptionClass: "comparison-filter-option",
+		activeFilterClass: "comparison-active-filter",
+		filterInfoIconClass: "comparisonFilterInfoIcon"
+	},
+	init: function(sciMapWidget) {
+		var me = this;
+		me.sciMapWidget = sciMapWidget;
+		me.widgetType = "COMPARISON_SCIENCE_AREAS";
+		me.currentSelectedFilter = COMPARISON_TYPE.ORGANIZATION;
+		me.widget = '';
+		me.tableDiv = $('<div />');
+		$("#" + me.dom.containerID).append(this.tableDiv);
+	},
+	loadJsonData: function(data) {
+		
+		var me = this;
+		me.uri = data.uri;
+		me.label = data.label;
+		me.pubsWithNoJournals = data.pubsWithNoJournals;
+		me.pubsWithInvalidJournals = data.pubsWithInvalidJournals;
+		me.pubsMapped = data.pubsMapped;
+		me.type = data.type;
+		me.subEntities = data.subEntities;
+		
+		me.setupView();
+	},
+	hasKey: function(key) {
+		return (this.keyToMarkerManagers.hasOwnProperty(key));
+	},
+	show: function(key) {
+		this.tableDiv.show();
+	},
+	hide: function(key) {
+		this.tableDiv.hide();
+	},
+	cleanView: function() {
+		this.hide();
+	},
+	initView: function() {
+		this.show();
+		this.changeFilter(this.currentSelectedFilter);
+	},
+	setupView: function() {
+		
+		var me = this;
+		
+		/* Create filter */
+		var dom = me.dom;
+		var filter = $('<div class="science-areas-filter">' +
+	    	'<span id="' + dom.firstFilterID + '" class="' + dom.filterOptionClass + ' ' + dom.activeFilterClass + '">Organizations</span> | ' +
+	    	'<span id="' + dom.secondFilterID + '" class="' + dom.filterOptionClass + '">People</span>' +
+	    	'<img class="' + dom.filterInfoIconClass + '" id="comparisonImageIconTwo" src="'+ infoIconUrl +'" alt="information icon" title="" /></div>');
+		me.tableDiv.append(filter);
+		createToolTip($("#comparisonImageIconTwo"), $("#comparisonToolTipTwo").html(), "topLeft");
+		initFilter(dom);
+		
+		/* Create table */
+		var table = $('<table>');
+		table.attr('id', 'comparisonDatatable');
+		table.addClass('datatable-table');
+		
+		var thead = $('<thead>');
+		var tr = $('<tr>');
+		
+		var levelOfScienceAreaTH = $('<th>');
+		levelOfScienceAreaTH.html('Entity Type');
+		
+		var checkBoxTH = $('<th>');
+		checkBoxTH.html('');
+		
+		var scienceAreasTH = $('<th>');
+		scienceAreasTH.attr("id", "comparison-science-areas-th");
+		if (this.currentSelectedFilter === COMPARISON_TYPE.ORGANIZATION ) {
+			scienceAreasTH.html('Organization');
+		} else {
+			scienceAreasTH.html('Person');
+		}
+		
+		var activityCountTH = $('<th>');
+		activityCountTH.html('# of pubs.');
+		activityCountTH.attr("id", "activity-count-column");
+
+		tr.append(levelOfScienceAreaTH);
+		tr.append(checkBoxTH);
+		tr.append(scienceAreasTH);
+		tr.append(activityCountTH);
+		
+		thead.append(tr);
+		
+		table.append(thead);
+		
+		var tbody = $('<tbody id="comparisonTbody">');
+		
+		var rowsToInsert = [];
+		var i = 0;
+		
+		$.each(me.subEntities, function(index, item) {
+			rowsToInsert[i++] = '<tr id="' + index + '" style="color: grey;"><td>' + item.type + '</td>';
+			rowsToInsert[i++] = '<td><input class="chk" type="checkbox" value="' + index + '"/></td>';
+			rowsToInsert[i++] = '<td>' + item.label + '</td>';
+			rowsToInsert[i++] = '<td>' + item.pubs.toFixed(2) + '</td></tr>';
+		});
+		
+		tbody.append(rowsToInsert.join(''));
+
+		table.append(tbody);
+		me.tableDiv.append(table);
+		
+		table.children("tbody").children("tr").mouseenter(function() {
+			
+			var item = me.subEntities[$(this).attr("id")];
+			me.sciMapWidget.mouseIn(item.type, item.label);
+		});
+		
+		table.children("tbody").children("tr").mouseleave(function() {
+
+			var item = me.subEntities[$(this).attr("id")];
+			me.sciMapWidget.mouseOut(item.type, item.label);
+		});
+		
+		$('.chk').click(function() {
+			var element = $(this);
+			var index = element.attr("value");
+			var item = me.subEntities[index];
+			var color = "grey";
+			if (element.attr('checked')) {
+				if ($("input:checkbox[class=chk]:checked").length > 3) {
+					element.attr('checked', false);
+					alert("The maximum number of items for comparison is 3.");
+				} else {
+					me.loadEntity(item.uri, index);
+				}
+			} else {
+				me.unloadEntity(item.type, item.label, index);
+			}
+		});
+		
+		/*
+		 * GMAIL_STYLE_PAGINATION_CONTAINER_CLASS, ACTIVE_DISCIPLINE_SUBDISCIPLINE_FILTER has to be declared 
+		 * for the filter & pagination to work properly.
+		 * */
+		GMAIL_STYLE_PAGINATION_CONTAINER_CLASS = me.dom.paginationContainerClass;
+		ACTIVE_DISCIPLINE_SUBDISCIPLINE_FILTER = me.currentSelectedFilter;
+		
+		if($.inArray(disciplineOrSubdisciplineDataTableFilter, $.fn.dataTableExt.afnFiltering) < 0) {
+			$.fn.dataTableExt.afnFiltering.push(disciplineOrSubdisciplineDataTableFilter);
+		}
+		
+		me.widget = table.dataTable({
+		    "sDom": '<"' + me.dom.searchBarParentContainerClass 
+		    			+ '"f><"filterInfo"i><"' 
+		    			+ me.dom.paginationContainerClass + '"p><"table-separator"><"datatablewrapper"t>',
+		    "aaSorting": [
+		        [3, "desc"], [2,'asc']
+		    ],
+		    "asStripClasses": [],
+		    "aoColumns": [{ "bVisible": false, "bSearchable": false },
+		                  null,
+		                  null,
+		                  null], 
+		    "iDisplayLength": 10,
+		    "bInfo": true,
+		    "oLanguage": {
+				"sInfo": "_START_ - _END_ of _TOTAL_",
+				"sInfoEmpty": "No matching science areas found",
+				"sInfoFiltered": ""
+			},
+		    "sPaginationType": "gmail_style",
+		    "fnDrawCallback": function () {
+		    	
+		        /* We check whether max number of allowed comparisions (currently 10) is reached
+		         * here as well becasue the only function that is guaranteed to be called during 
+		         * page navigation is this. No need to bind it to the nav-buttons becuase 1. It is over-ridden
+		         * by built-in navigation events & this is much cleaner.
+		         * */
+//		        checkIfColorLimitIsReached();
+		    }
+		});
+		
+		/* Create search box */
+		var searchInputBox = $("." + me.dom.searchBarParentContainerClass).find("input[type=text]");
+		searchInputBox.css("width", "140px");
+		searchInputBox.after("<span id='comparison-reset-search' title='Clear search query'>X</span>" 
+								+ "<img class='comparisonFilterInfoIcon' id='comparisonSearchInfoIcon' src='" + infoIconUrl + "' alt='information icon' title='' />");
+		$("#comparison-reset-search").live('click', function() {
+			me.widget.fnFilter("");
+		});
+		createToolTip($("#comparisonSearchInfoIcon"), $("#comparisonSearchInfoTooltipText").html(), "topLeft");
+		
+		/* Create csv download button */
+		var csvButton = '<hr class="subtle-hr"/><div id="main-science-areas-table-footer"><a id="csv" href="' +
+						entityMapOfScienceSubDisciplineCSVURL + 
+						'" class="map-of-science-links">Save All as CSV</a></div>';
+		me.tableDiv.append(csvButton);
+		
+		/* Create mapping statistic result */
+		var totalPublications = me.pubsWithNoJournals + me.pubsWithInvalidJournals + me.pubsMapped;
+		$("#mapped-publications").text(addCommasToNumber(me.pubsMapped));
+		$("#percent-mapped-info").show();
+		$("#percent-mapped").text((100 * me.pubsMapped / totalPublications).toFixed(2));
+		$("#total-publications").text(addCommasToNumber(totalPublications));
+		
+	},
+	changeFilter: function(filterType) {
+		var me = this;
+		if (filterType === COMPARISON_TYPE.ORGANIZATION) {
+			
+			$("#comparison-science-areas-th").html("Organization");
+			me.currentSelectedFilter = COMPARISON_TYPE.ORGANIZATION;
+			$("a#csv").attr("href", entityMapOfScienceSubDisciplineCSVURL);
+		} else {
+			
+			$("#comparison-science-areas-th").html("Person");
+			me.currentSelectedFilter = COMPARISON_TYPE.PERSON;
+			$("a#csv").attr("href", entityMapOfScienceDisciplineCSVURL);
+			
+		}
+		
+		ACTIVE_DISCIPLINE_SUBDISCIPLINE_FILTER = me.currentSelectedFilter;
+
+		if (me.widget) {
+			me.widget.fnSettings()._iDisplayLength = 10;
+			me.widget.fnDraw();
+			// load one item if no item is selected. Need to be improved
+			if ($("input:checkbox[class=chk]:checked").length == 0) {
+				$("input:checkbox[class=chk]").each(function(){
+					var item = me.subEntities[$(this).attr("value")];
+					if (item.type == me.currentSelectedFilter) {
+						// click event didn't work at this point???
+						$(this).click();
+						me.loadEntity(item.uri, $(this).attr("value"));
+						return false;
+					}
+				});
+			}
+		}
+	},
+	loadEntity: function(uri, index) {
+		
+		// Download data from server and add to markerManager if not gotten already
+		var me = this;
+		var url = scienceMapDataPrefix + uri;
+		downloader.download(url, function(data) {
+			me.sciMapWidget.loadEntity(data[0]);
+			
+			// This is ugly, need fix!!!
+			$("#comparisonTbody > tr[id=" + index + "]").css("color", me.sciMapWidget.getColor(me.currentSelectedFilter, me.subEntities[index].label));
+		});
+	},
+	unloadEntity: function(key, childKey, index) {
+		this.sciMapWidget.unloadEntity(key, childKey);
+		
+		// This is ugly, need fix!!!
+		$("#comparisonTbody > tr[id=" + index + "]").css("color", "grey");
+	}
+});

productMods/js/visualization/mapofscience/ComparisonScimapWidget.js

@@ -0,0 +1,249 @@
+/* $This file is distributed under the terms of the license in /doc/license.txt$ */
+COMPARISON = {
+	"one":{ "name": "one", "color": "#1e90ff"},
+	"two":{ "name": "two", "color": "#ff69b4"},
+	"three":{ "name": "three", "color": "#32cd32"}
+}
+
+COMPARISON_TYPE = {
+	"ORGANIZATION": "ORGANIZATION",
+	"PERSON": "PERSON"
+}
+
+var ManagerRegistry = Class.extend({
+	init: function(itemArray) {
+		this.occupied = {};
+		this.availability = itemArray;
+	},
+	register: function(key) {
+		var me = this;
+		if (me.occupied[key] == null && me.isAvailable()) {
+			me.occupied[key] = me.availability.pop();
+		}
+		
+		return me.occupied[key];
+	},
+	unregister: function(key) {
+		var me = this;
+		var item = me.occupied[key];
+		if (item) {
+			me.availability.push(me.occupied[key]);
+			delete me.occupied[key];
+		}
+		
+		return item;
+	},
+	isAvailable: function() {
+		return (this.availability.length != 0);
+	}
+});
+
+var ComparisonScimapWidget = Class.extend({
+	init: function(map) {
+		var me = this;
+		me.activeCompositeManager = null;
+		me.map = map;
+		me.initView();
+	},
+	initView: function(){
+		var me = this;
+		me.initControlPanels();
+		me.initMarkerManagers();
+		me.show(COMPARISON_TYPE.ORGANIZATION);
+		this.activeCompositeManager.addManagersToMap();
+		this.updateDisplayedMarkers();
+	},
+	cleanView: function() {
+		var me = this;
+		me._cleanUpManagers();
+		me.sliderControl.removeFromMap();
+		me.disciplineLabelsControl.removeFromMap();
+		me.labelsMarkerManager.removeMarkersFromMap();
+	},
+	initControlPanels: function() {
+		var me = this;
+		
+		/* Create slider control panel */
+		if (me.sliderControl == null) {
+			me.sliderControl = new SliderControlPanel({ 
+				map:me.map, 
+				controlPositions: google.maps.ControlPosition.RIGHT_BOTTOM
+			});
+		}
+		
+		/* Register event */
+		me.sliderControl.addToMap();
+		me.sliderControl.setChangeEventHandler(function(event, ui) {
+			if (me.keyToCompositeManager) {
+				me.updateDisplayedMarkers();
+			}
+		});
+		
+		/* create */
+		if (me.disciplineLabelsControl == null) {
+			me.labelsMarkerManager = new DisciplineLabelsMarkerManager(map);
+			me.disciplineLabelsControl = new CheckBoxPanel({ 
+				map: map,
+				checked: true,
+				text: "Show discipline labels",
+				click: function() {
+					if($(this).attr('checked')) {
+						me.labelsMarkerManager.showMarkers();
+					} else {
+						me.labelsMarkerManager.hideMarkers();
+					}
+				}
+			});
+		}
+		
+		/* Display labels if checked */
+		me.disciplineLabelsControl.addToMap();
+		me.labelsMarkerManager.addMarkersToMap();
+		if (me.disciplineLabelsControl.isChecked()) {
+			me.labelsMarkerManager.showMarkers();
+		}
+	},
+	initMarkerManagers: function() {
+		if (this.keyToCompositeManager == null) {
+			
+			// Create all the marker managers
+			var me = this;
+			me.keyToCompositeManager = {};
+			$.each(COMPARISON_TYPE, function(type, value) {
+				var managerArray = [];
+				
+				$.each(COMPARISON, function(key, attrs) {
+					var manager = new SubdisciplineMarkerManager(
+						me.map,
+						new SingleColorStrategy(attrs.color), 
+						null
+					);
+					manager.color = attrs.color;
+					managerArray.push(manager);
+				});
+				me.keyToCompositeManager[type] = new CompositeMarkerManager();
+				me.keyToCompositeManager[type].registry = new ManagerRegistry(managerArray);
+			});
+		}
+	},
+	loadJsonData: function(data) {
+		this.isUnloaded = false;
+	},
+	loadEntity: function(data) {
+		var me = this;
+		me.uri = data.uri;
+		me.label = data.label;
+		me.pubsWithNoJournals = data.pubsWithNoJournals;
+		me.pubsWithInvalidJournals = data.pubsWithInvalidJournals;
+		me.pubsMapped = data.pubsMapped;
+		
+		var scienceActivities = data.subdisciplineActivity;
+		
+		var childKey = data.label;
+		var compositeManager = me.getCompositeManager(data.type);
+		// Avoid reload if data was loaded
+		if (compositeManager.hasKey(childKey)) {
+			me.updateMap();
+		} else {
+			var manager = compositeManager.registry.register(childKey);
+			if (manager) {
+				// clean previous markers
+				manager.removeAll();
+				
+				// Need to create the AreaSizeCoding function
+				manager.setSizeCoder(new CircleSizeCoder({ 
+					scaler: new Scaler({ maxValue: me.pubsMapped }) 
+				}));
+				
+				$.each(scienceActivities, function(science, density) {
+			
+					// Create marker and add it to manager
+					manager.createMarker(science, density);
+					
+				}); // end each scienceActivity
+				manager.sort();
+				
+				compositeManager.addManager(childKey, manager);
+				me.updateMap();
+			}
+		}
+	},
+	unloadEntity: function(key, childKey) {
+		this.removeManager(key, childKey);
+	},
+	getCompositeManager: function(key) {
+		return this.keyToCompositeManager[key];
+	},
+	mouseIn: function(key, childKey) {
+		var compositeManager = this.getCompositeManager(key);
+		
+		// Focus if only it is a valid manager
+		if (compositeManager == this.activeCompositeManager) {
+			// Focus all
+			compositeManager.mouseIn(childKey);
+		}
+	},
+	mouseOut: function(key, childKey) {
+		var compositeManager = this.getCompositeManager(key);
+		
+		// Unfocus if only it is a valid manager
+		if (compositeManager == this.activeCompositeManager) {
+			// Unfocus all
+			compositeManager.mouseOut(childKey);
+		}
+	},
+	removeManager: function(key, childKey) {
+		var compositeManager = this.getCompositeManager(key);
+		
+		// Remove manager
+		if (compositeManager == this.activeCompositeManager) {
+			this.activeCompositeManager.removeManager(childKey);
+			this.activeCompositeManager.registry.unregister(childKey);
+		}
+	},
+	show: function(key) {
+		var compositeManager = this.getCompositeManager(key);
+		if (compositeManager) {
+			this._switchActiveCompositeManager(compositeManager);
+		}
+	},
+	hide: function(key) {
+		var compositeManager = this.getCompositeManager(key);
+		if (this.activeCompositeManager == compositeManager) {
+			this._cleanupMarkers();
+		}
+	},
+	_switchActiveCompositeManager: function(compositeManager) {
+		if (this.activeCompositeManager != compositeManager) {
+			this._cleanUpManagers();
+			compositeManager.addManagersToMap();
+			this.activeCompositeManager = compositeManager;
+			this.updateMap();
+		}
+	},
+	_cleanUpManagers: function() {
+		if (this.activeCompositeManager) {
+			this.activeCompositeManager.removeManagersFromMap();
+			INFO_WINDOW.close();
+		}
+	},
+	updateDisplayedMarkers: function() {
+		this.activeCompositeManager.display(this.sliderControl.getValue());
+	},
+	updateMap: function() {
+		var compositeManager = this.activeCompositeManager;
+		if (compositeManager) {
+			var length = compositeManager.length();
+			var slider = this.sliderControl;
+			slider.setMin(Math.min(1, length));
+			slider.setMax(length);
+			slider.setValue(length);
+		}
+	},
+	changeFilter: function(filterType) {
+		this.show(filterType);
+	},
+	getColor: function(key, childKey) {
+		return this.getCompositeManager(key).registry.register(childKey).color;
+	}
+});

productMods/js/visualization/mapofscience/CustomMarker.js

@@ -26,19 +26,20 @@ var ScinodePolygon = CirclePolygon.extend({
 	registerEvents : function() {
 		var me = this;
 		var polygon = me.polygon;
-		this._super();
+		me._super();
-		this.registerEvent(addClickListener(polygon, function() {
+		
+		me.registerEvent(addClickListener(polygon, function() {
 			INFO_WINDOW.setPosition(this.center);
 			var content = this.content;
 			INFO_WINDOW.setContent(content);
 			INFO_WINDOW.open(this.map);
 		}));
 		
-		this.registerEvent(addMouseOverListener(polygon, function() {
+		me.registerEvent(addMouseOverListener(polygon, function() {
 			me.focus();
 		}));
 		
-		this.registerEvent(addMouseOutListener(polygon, function() {
+		me.registerEvent(addMouseOutListener(polygon, function() {
 			me.unfocus();
 		}));
 	}

productMods/js/visualization/mapofscience/DataTableWidget.js

@@ -2,30 +2,27 @@
 
 var DataTableWidget = Class.extend({
 	
-	widgetType: "MAIN_SCIENCE_AREAS",
-	
-	currentSelectedFilter: SCIMAP_TYPE.DISCIPLINE,
-	
 	dom: {
 		searchBarParentContainerClass : "searchbar",
 		paginationContainerClass : "paginatedtabs",
 		containerID: "main-science-areas-table-container",
 		footerID: "main-science-areas-table-footer",
-		disciplineFilterID: "discipline-filter",
+		firstFilterID: "first-filter",
-		subdisciplinesFilterID: "subdisciplines-filter",
+		secondFilterID: "second-filter",
 		filterOptionClass: "filter-option",
-		activeFilterClass: "active-filter"
+		activeFilterClass: "active-filter",
+		filterInfoIconClass: "filterInfoIcon"
 	},
-	
-	widget: '',
-	
 	init: function(sciMapWidget) {
-		this.sciMapWidget = sciMapWidget;
-		
-		this.subdisciplineInfo = {};
-		this.disciplineInfo = {};
-		
 		var me = this;
+		me.sciMapWidget = sciMapWidget;
+		me.widgetType = "MAIN_SCIENCE_AREAS";
+		me.currentSelectedFilter = SCIMAP_TYPE.SUBDISCIPLINE;
+		me.subdisciplineInfo = {};
+		me.disciplineInfo = {};
+		me.widget = '';
+		me.tableDiv = $('<div />');
+		$("#" + me.dom.containerID).append(this.tableDiv);
 		
 		$.each(DISCIPLINES, function(index, item) {
 			var emptyScienceAreaElement = {
@@ -42,7 +39,6 @@ var DataTableWidget = Class.extend({
 			};
 			me.subdisciplineInfo[index] = emptyScienceAreaElement;
 		});
-		
 	},
 	loadJsonData: function(data) {
 		
@@ -74,12 +70,17 @@ var DataTableWidget = Class.extend({
 		return (this.keyToMarkerManagers.hasOwnProperty(key));
 	},
 	show: function(key) {
+		this.tableDiv.show();
 	},
 	hide: function(key) {
+		this.tableDiv.hide();
 	},
-	cleanUp: function() {
+	cleanView: function() {
+		this.hide();
 	},
 	initView: function() {
+		this.show();
+		this.changeFilter(me.currentSelectedFilter);
 	},
 	parseIDIntoScienceTypeAreaID: function(rawID) {
 		
@@ -92,6 +93,15 @@ var DataTableWidget = Class.extend({
 		
 		var me = this;
 		
+		var dom = me.dom;
+		var filter = $('<div class="science-areas-filter">' +
+				'<span id="' + dom.firstFilterID + '" class="' + dom.filterOptionClass + ' ' + dom.activeFilterClass + '">Sub-Disciplines</span> | ' +
+		    	'<span id="' + dom.secondFilterID + '" class="' + dom.filterOptionClass + '">Disciplines</span>' +
+		    	'<img class="'+ dom.filterInfoIconClass +'" id="imageIconTwo" src="'+ infoIconUrl +'" alt="information icon" title="" /></div>');
+		me.tableDiv.append(filter);
+		createToolTip($("#imageIconTwo"), $('#toolTipTwo').html(), "topLeft");
+		initFilter(dom);
+		
 		var table = $('<table>');
 		table.attr('id', 'datatable');
 		table.addClass('datatable-table');
@@ -150,7 +160,7 @@ var DataTableWidget = Class.extend({
 		tbody.append(rowsToInsert.join(''));
 
 		table.append(tbody);
-		$("#" + me.dom.containerID).append(table);
+		me.tableDiv.append(table);
 		
 		table.children("tbody").children("tr").mouseenter(function() {
 			
@@ -208,16 +218,18 @@ var DataTableWidget = Class.extend({
 		
 		
 		var searchInputBox = $("." + me.dom.searchBarParentContainerClass).find("input[type=text]");
-		
 		searchInputBox.css("width", "140px");
-		
 		searchInputBox.after("<span id='reset-search' title='Clear search query'>X</span>" 
-								+ "<img class='filterInfoIcon' id='searchInfoIcon' src='" + baseImageFolderPrefix + "/iconInfo.png' alt='information icon' title='' />");
+								+ "<img class='filterInfoIcon' id='searchInfoIcon' src='" + infoIconUrl + "' alt='information icon' title='' />");
-		
 		$("#reset-search").live('click', function() {
 			me.widget.fnFilter("");
 		});
+		createToolTip($("#searchInfoIcon"), $('#searchInfoTooltipText').html(), "topLeft");
 		
+		var csvButton = '<hr class="subtle-hr"/><div id="main-science-areas-table-footer"><a id="csv" href="' +
+						entityMapOfScienceSubDisciplineCSVURL + 
+						'" class="map-of-science-links">Save All as CSV</a></div>';
+		this.tableDiv.append(csvButton);
 		
 		var totalPublications = me.pubsWithNoJournals + me.pubsWithInvalidJournals + me.pubsMapped;
 		$("#mapped-publications").text(addCommasToNumber(me.pubsMapped));
@@ -228,7 +240,6 @@ var DataTableWidget = Class.extend({
 	},
 	changeFilter: function(filterType) {
 		var me = this;
-		
 		if (filterType === SCIMAP_TYPE.SUBDISCIPLINE) {
 			
 			$("#science-areas-th").html("Sub-Disciplines");
@@ -250,6 +261,7 @@ var DataTableWidget = Class.extend({
 		}
 		
 		ACTIVE_DISCIPLINE_SUBDISCIPLINE_FILTER = me.currentSelectedFilter;
+
 		if (me.widget) {
 			me.widget.fnDraw();
 		}

productMods/js/visualization/mapofscience/InitializeMap.js

@@ -68,9 +68,10 @@ function initMap() {
 }
 
 function initVisModeController() {
-	var controller = new EntityVisModeController(map);
+	var controller = getVisModeController(ENTITY_VIS_MODE);
-	visModeControllers[controller.visMode] = controller;
 	switchVisMode(controller.visMode);
+	initVisModeTypeButton();
+	initGlobalToolTips();
 	currentController.loadData(scienceMapDataURL, false);
 }
 

productMods/js/visualization/mapofscience/Marker.js

@@ -50,7 +50,11 @@ var Marker = Class.extend({
 		this.handlers = handlers;
 	},
 	unregisterEvents : function() {
-		removeListeners(this.handlers);
+		if (this.handlers) {
-		this.handlers = null;
+			$.each(this.handlers, function(i, handler) {
+				removeListener(handler);
+			});
+			this.handlers = null;
+		}
 	}
 });

productMods/js/visualization/mapofscience/MarkerManager.js

@@ -47,6 +47,10 @@ var MarkerManager = Class.extend({
 		$.each(this.keyToMarker, function(i, marker) {
 			marker.removeFromMap();
 		});
+	},
+	removeAll: function() {
+		this.removeMarkersFromMap();
+		this.keyToMarker = {};
 	}
 });
 
@@ -204,3 +208,95 @@ var SubdisciplineMarkerManager = ScimapMarkerManager.extend({
 		return marker;
 	}
 });
+
+var CompositeMarkerManager = Class.extend({
+	init: function() {
+		this.keyToManager = {};
+	},
+	addManager: function(key, manager) {
+		this.keyToManager[key] = manager;
+	},
+	length: function() {
+		var size = 0;
+
+		$.each(this.keyToManager, function(i, manager) {
+			msize = manager.length();
+			if (size < msize) {
+				size = msize;
+			}
+		});
+		return size;
+	},
+	getManager: function(key) {
+		return this.keyToManager[key];
+	},
+	getManagerArray: function() {
+		var array = [];
+		$.each(this.keyToManager, function(i, e){ 
+			array.push(e); 
+		});
+		return array;
+	},
+	hasKey: function(key) {
+		return (this.keyToManager.hasOwnProperty(key));
+	},
+	showManager: function() {
+		$.each(this.keyToManager, function(i, manager) {
+			manager.showMarkers();
+		});
+	},
+	hideManager: function() {
+		$.each(this.keyToManager, function(i, manager) {
+			manager.hideMarkers();
+		});
+	},
+	addManagersToMap: function() {
+		$.each(this.keyToManager, function(i, manager) {
+			manager.addMarkersToMap();
+		});
+	},
+	removeManagersFromMap: function() {
+		$.each(this.keyToManager, function(i, manager) {
+			manager.removeMarkersFromMap();
+		});
+	},
+	removeManager: function(key) {
+		if (this.hasKey(key)) {
+			this.getManager(key).removeAll();
+			delete this.keyToManager[key];
+		}
+	},
+	removeAll: function() {
+		$.each(this.keyToManager, function(i, manager) {
+			manager.removeAll();
+		});
+		this.keyToManager = {};
+	},
+	mouseIn: function(key) {
+		var manager = this.getManager(key);
+		if (manager) {
+			manager.mouseInAll();
+		}
+	},
+	mouseInAll: function() {
+		$.each(this.keyToManager, function(i, manager) {
+			manager.mouseInAll();
+		});
+	},
+	mouseOut: function(key) {
+		var manager = this.getManager(key);
+		if (manager) {
+			manager.mouseOutAll();
+		}
+	},
+	mouseOutAll: function() {
+		$.each(this.keyToManager, function(i, manager) {
+			manager.mouseOutAll();
+		});
+	},
+	display: function(numberOfMarkers) {
+		$.each(this.keyToManager, function(i, manager) {
+			manager.display(numberOfMarkers);
+		});
+	}
+});

productMods/js/visualization/mapofscience/Polygon.js

@@ -58,10 +58,12 @@ var Polygon = Class.extend({
 	registerEvents : function() {
 	},
 	unregisterEvents : function() {
-		$.each(this.handlers, function(){
+		if (this.handlers) {
-			removeListener(this);
+			$.each(this.handlers, function(i, handler) {
-		});
+				removeListener(handler);
-		this.handlers = null;
+			});
+			this.handlers = null;
+		}
 	}
 });
 
@@ -92,7 +94,6 @@ var CirclePolygon = Polygon.extend({
 		if (!this.isPointsCreated()) {
 			this.initCirclePoints();
 		}
-		
 		this._super();
 	},
 	isPointsCreated: function() {

productMods/js/visualization/mapofscience/ScimapWidget.js

@@ -13,7 +13,15 @@ var ScimapWidget = Class.extend({
 		var me = this;
 		me.initControlPanels();
 		me.initMarkerManagers();
-		me.show(SCIMAP_TYPE.SUBDISCIPLINE);
+		me.activeManager.addMarkersToMap();
+		me.updateDisplayedMarkers();
+	},
+	cleanView: function() {
+		var me = this;
+		me._cleanUpMarkers();
+		me.sliderControl.removeFromMap();
+		me.disciplineLabelsControl.removeFromMap();
+		me.labelsMarkerManager.removeMarkersFromMap();
 	},
 	initControlPanels: function() {
 		var me = this;
@@ -30,7 +38,7 @@ var ScimapWidget = Class.extend({
 		me.sliderControl.addToMap();
 		me.sliderControl.setChangeEventHandler(function(event, ui) {
 			if (me.keyToMarkerManagers) {
-				me.updateDisplayedMarkers(ui.value);
+				me.updateDisplayedMarkers();
 			}
 		});
 		
@@ -53,6 +61,7 @@ var ScimapWidget = Class.extend({
 		
 		/* Display labels if checked */
 		me.disciplineLabelsControl.addToMap();
+		me.labelsMarkerManager.addMarkersToMap();
 		if (me.disciplineLabelsControl.isChecked()) {
 			me.labelsMarkerManager.showMarkers();
 		}
@@ -75,6 +84,7 @@ var ScimapWidget = Class.extend({
 				null
 			);
 			this.keyToMarkerManagers = managers;
+			this.show(SCIMAP_TYPE.SUBDISCIPLINE);
 		}
 	},
 	needLoaded: function(){
@@ -185,14 +195,8 @@ var ScimapWidget = Class.extend({
 			INFO_WINDOW.close();
 		}
 	},
-	cleanup: function() {
+	updateDisplayedMarkers: function() {
-		var me = this;
+		this.activeManager.display(this.sliderControl.getValue());
-		me._cleanUpMarkers();
-		me.sliderControl.RemoveFromMap();
-		me.disciplineLabelsControl.RemoveFromMap();
-	},
-	updateDisplayedMarkers: function(numberOfMarkers) {
-		this.activeManager.display(numberOfMarkers);
 	},
 	updateMap: function() {
 		var manager = this.activeManager;

productMods/js/visualization/mapofscience/VisCommonControl.js

@@ -14,22 +14,110 @@ function switchMarkerManager(id) {
 	}
 }
 
+function createVisModeController(visMode) {
+	if (visMode === ENTITY_VIS_MODE) {
+		var controller = new EntityVisModeController(map);
+		visModeControllers[controller.visMode] = controller;
+	}
+	
+	if (visMode === COMPARISON_VIS_MODE) {
+		var controller = new ComparisonVisModeController(map);
+		visModeControllers[controller.visMode] = controller;
+		controller.loadData(scienceMapDataURL, false);
+	}
+}
+
 function isActiveVisMode(visMode) {
-	return (currentVisMode == visMode);
+	return (currentVisMode === visMode);
 }
 
 function getVisModeController(visMode){
+	if (visModeControllers[visMode] == null) {
+		createVisModeController(visMode);
+	}
 	return visModeControllers[visMode];
 }
 
 function switchVisMode(visMode) {
-	if (currentVisMode != visMode) {
+	if (!isActiveVisMode(visMode)) {
-		currentVisMode = visMode;
 		if (currentController) {
 			currentController.cleanView();
 		}
 		currentController = getVisModeController(visMode);
+		currentVisMode = visMode;
 		currentController.initView();
 	}
-	return 
+}
+
+function initFilter(dom) {
+	
+	// Switch filter handling
+	$("." + dom.filterOptionClass).live('click', function() { 
+		var obj = $(this);
+		if (!obj.hasClass(dom.activeFilterClass)) {
+			var checked = obj.attr('id');
+			if (checked === dom.secondFilterID) {
+				$("#" + dom.firstFilterID).removeClass(dom.activeFilterClass);
+				currentController.changeFilter(2);
+				
+			} else if (checked === dom.firstFilterID) {
+				$("#" + dom.secondFilterID).removeClass(dom.activeFilterClass);
+				currentController.changeFilter(1);
+			}
+				
+			obj.addClass(dom.activeFilterClass);	
+		}
+	});
+	
+	$("#" + dom.firstFilterID).trigger('click');
+}
+
+function initVisModeTypeButton() {
+	// Switch vis mode handling
+	var viewTypeRadio = "input[name='view-type']";
+	$(viewTypeRadio).change( function() {
+		var visMode = $(viewTypeRadio+ ":checked").val();
+		switchVisMode(visMode);
+	});
+	
+	/* Init default filter */
+	$(viewTypeRadio+ ":eq(0)").click();
+}
+
+function initGlobalToolTips() {
+
+	createToolTip($("#imageIconOne"), $('#toolTipOne').html(), "topLeft");
+	createToolTip($("#imageIconThree"), $('#toolTipThree').html(), "topRight");
+}
+
+function createToolTip(target, tipText, tipLocation) {
+	target.qtip({
+        content: {
+            text: tipText
+        },
+        position: {
+            corner: {
+                target: 'center',
+                tooltip: tipLocation
+            }
+        },
+        show: {
+            when: {
+                event: 'mouseover'
+            }
+        },
+        hide: {
+            fixed: true // Make it fixed so it can be hovered over
+        },
+        style: {
+            padding: '6px 6px',
+            // Give it some extra padding
+            width: 500,
+            textAlign: 'left',
+            backgroundColor: '#ffffc0',
+            fontSize: '.7em',
+            padding: '6px 10px 6px 10px',
+            lineHeight: '14px'
+        }
+    });
 }

productMods/js/visualization/mapofscience/VisModeControllers.js

@@ -2,6 +2,8 @@
 var ENTITY_VIS_MODE = "ENTITY";
 var COMPARISON_VIS_MODE = "COMPARISON";
 
+var dataMarket = {};
+
 var VisModeController = Class.extend({
 	init: function(map) {
 		this.visMode = ENTITY_VIS_MODE;
@@ -14,6 +16,47 @@ var VisModeController = Class.extend({
 	needLoaded: function() {
 		return this.isUnloaded;
 	},
+	loadData: function(url, sync) {
+		
+		// Download data from server and add to markerManager if not gotten already
+		var me = this;
+		if (me.isUnloaded) {
+			// Lazy loading
+			if (!dataMarket[url]) {
+				if (sync) {
+					downloader.downloadAndWait(url, function(data) {
+						dataMarket[url] = data;
+						me.loadJsonData(me, data);
+					});
+				} else {
+					downloader.download(url, function(data) {
+						dataMarket[url] = data;
+						me.loadJsonData(me, data);
+					});
+				}
+			} else {
+				me.loadJsonData(me, dataMarket[url]);
+			}
+		} // end if
+	},
+	loadJsonData: function(me, data) {
+		
+		$("#" + responseContainerID).unblock();
+		
+		if (ERROR_DISPLAY_WIDGET.isErrorConditionTriggered(data)) {
+			$("#map-of-science-response").hide();
+			ERROR_DISPLAY_WIDGET.show(ENTITY_TYPE, data);
+			return;
+		}
+		
+		data = data[0];
+		
+		$.each(me.widgets, function(i, widget) {
+			widget.loadJsonData(data);
+		});
+		//me.initToolTipInfo();
+		me.isUnloaded = false;
+	},
 	initView: function() {
 		$.each(this.widgets, function(i, widget) {
 			widget.initView();
@@ -30,49 +73,32 @@ var VisModeController = Class.extend({
 			widget.hide(key);
 		});
 	},
-	cleanUp: function() {
+	cleanView: function() {
 		$.each(this.widgets, function(i, widget) {
-			widget.cleanUp(key);
+			widget.cleanView();
 		});
-	}
+	},
+	changeFilter: function(value) {
+		var type = this.getFilterType(value);
+		
+		$.each(this.widgets, function(i, widget) {
+			widget.changeFilter(type);
+		});
+	},
 });
 
 var EntityVisModeController = VisModeController.extend({
 	init: function(map) {
 		this._super(map);
 		this.visMode = ENTITY_VIS_MODE;
-		this.initFilter();
+		this.firstFilterLabel = "554 Sub-Disciplines";
+		this.secondFilterLabel = "13 Disciplines";
 	},
-	initFilter: function() {
+	getFilterType: function(value) {
-		var widgets = this.widgets;
+		if (value === 1) {
-		var dom = {
+			return SCIMAP_TYPE.SUBDISCIPLINE;
-			disciplineFilterID: "discipline-filter",
+		}
-			subdisciplinesFilterID: "subdisciplines-filter",
+		return SCIMAP_TYPE.DISCIPLINE;
-			filterOptionClass: "filter-option",
-			activeFilterClass: "active-filter"
-		};
-		
-		$("." + dom.filterOptionClass).live('click', function() {
-			if (!$(this).hasClass(dom.activeFilterClass)) {
-				if ($(this).attr('id') === dom.subdisciplinesFilterID) {
-					$("#" + dom.disciplineFilterID).removeClass(dom.activeFilterClass);
-					$.each(widgets, function(i, widget) {
-						widget.changeFilter(SCIMAP_TYPE.SUBDISCIPLINE);
-					});
-					
-				} else if ($(this).attr('id') === dom.disciplineFilterID) {
-					$("#" + dom.subdisciplinesFilterID).removeClass(dom.activeFilterClass);
-					$.each(widgets, function(i, widget) {
-						widget.changeFilter(SCIMAP_TYPE.DISCIPLINE);
-					});
-				}
-					
-				$(this).addClass('active-filter');	
-			}
-		});
-		
-		/* Init default filter */
-		$("#" + dom.subdisciplinesFilterID).trigger('click');
 	},
 	initWidgets: function(map) {
 		var widgets = {};
@@ -80,223 +106,27 @@ var EntityVisModeController = VisModeController.extend({
 		widgets['sci_area_table'] = new DataTableWidget(widgets['scimap']);
 		
 		this.widgets = widgets;
-	},
-	loadData: function(url, sync) {
-		
-		// Download data from server and add to markerManager if not gotten already
-		var me = this;
-		if (me.isUnloaded) {
-			if (sync) {
-				downloader.downloadAndWait(url, function(data) {
-						me.loadJsonData(me, data);
-				});
-			} else {
-				downloader.download(url, function(data) {
-						me.loadJsonData(me, data);
-				});
-			}
-		} // end if
-	},
-	loadJsonData: function(me, data) {
-		
-		$("#" + responseContainerID).unblock();
-		
-		if (ERROR_DISPLAY_WIDGET.isErrorConditionTriggered(data)) {
-			$("#map-of-science-response").hide();
-			ERROR_DISPLAY_WIDGET.show(ENTITY_TYPE, data);
-			return;
-		}
-		
-		data = data[0];
-		
-		$.each(me.widgets, function(i, widget) {
-			widget.loadJsonData(data);
-		});
-		me.isUnloaded = false;
-		me.initToolTipInfo();
-		
-	},
-	initToolTipInfo: function() {
-
-		$('.filterInfoIcon').each(function () {
-		    
-			var me = $(this);
-			
-			var tipText;
-		    var tipLocation = "topLeft";
-		    
-		    if (me.attr('id') == 'imageIconOne') {
-		        tipText = $('#toolTipOne').html();
-		    } else if (me.attr('id') == 'imageIconTwo') {
-		        tipText = $('#toolTipTwo').html();
-		    } else if (me.attr('id') == 'searchInfoIcon') {
-		        tipText = $('#searchInfoTooltipText').html();
-		    } else {
-		        tipText = $('#toolTipThree').html();
-		        tipLocation = "topRight";
-		    }
-		    
-		    me.qtip({
-		        content: {
-		            text: tipText
-		        },
-		        position: {
-		            corner: {
-		                target: 'center',
-		                tooltip: tipLocation
-		            }
-		        },
-		        show: {
-		            when: {
-		                event: 'mouseover'
-		            }
-		        },
-		        hide: {
-		            fixed: true // Make it fixed so it can be hovered over
-		        },
-		        style: {
-		            padding: '6px 6px',
-		            // Give it some extra padding
-		            width: 500,
-		            textAlign: 'left',
-		            backgroundColor: '#ffffc0',
-		            fontSize: '.7em',
-		            padding: '6px 10px 6px 10px',
-		            lineHeight: '14px'
-		        }
-		    });
-		});
 	}
 });
 
-var ComparisonVisModeController = Class.extend({
+var ComparisonVisModeController = VisModeController.extend({
 	init: function(map) {
 		this._super(map);
 		this.visMode = COMPARISON_VIS_MODE;
-		this.initFilter();
+		this.firstFilterLabel = "Organizations";
+		this.secondFilterLabel = "People";
 	},
-	initFilter: function() {
+	getFilterType: function(value) {
-		var widgets = this.widgets;
+		if (value === 1) {
-		var dom = {
+			return COMPARISON_TYPE.ORGANIZATION;
-			disciplineFilterID: "discipline-filter",
+		}
-			subdisciplinesFilterID: "subdisciplines-filter",
+		return COMPARISON_TYPE.PERSON;
-			filterOptionClass: "filter-option",
-			activeFilterClass: "active-filter"
-		};
-		
-		$("." + dom.filterOptionClass).live('click', function() {
-			if (!$(this).hasClass(dom.activeFilterClass)) {
-				if ($(this).attr('id') === dom.subdisciplinesFilterID) {
-					$("#" + dom.disciplineFilterID).removeClass(dom.activeFilterClass);
-					$.each(widgets, function(i, widget) {
-						widget.changeFilter(SCIMAP_TYPE.SUBDISCIPLINE);
-					});
-					
-				} else if ($(this).attr('id') === dom.disciplineFilterID) {
-					$("#" + dom.subdisciplinesFilterID).removeClass(dom.activeFilterClass);
-					$.each(widgets, function(i, widget) {
-						widget.changeFilter(SCIMAP_TYPE.DISCIPLINE);
-					});
-				}
-					
-				$(this).addClass('active-filter');	
-			}
-		});
-		
-		/* Init default filter */
-		$("#" + dom.subdisciplinesFilterID).trigger('click');
 	},
 	initWidgets: function(map) {
 		var widgets = {};
-		widgets['scimap'] = new ScimapWidget(map);
+		widgets['scimap'] = new ComparisonScimapWidget(map);
-		widgets['sci_area_table'] = new DataTableWidget(widgets['scimap']);
+		widgets['sci_area_table'] = new ComparisonDataTableWidget(widgets['scimap']);
 		
 		this.widgets = widgets;
-	},
-	loadData: function(url, sync) {
-		
-		// Download data from server and add to markerManager if not gotten already
-		var me = this;
-		if (me.isUnloaded) {
-			if (sync) {
-				downloader.downloadAndWait(url, function(data) {
-						me.loadJsonData(me, data);
-				});
-			} else {
-				downloader.download(url, function(data) {
-						me.loadJsonData(me, data);
-				});
-			}
-		} // end if
-	},
-	loadJsonData: function(me, data) {
-		
-		$("#" + responseContainerID).unblock();
-		
-		if (ERROR_DISPLAY_WIDGET.isErrorConditionTriggered(data)) {
-			$("#map-of-science-response").hide();
-			ERROR_DISPLAY_WIDGET.show(ENTITY_TYPE, data);
-			return;
-		}
-		
-		data = data[0];
-		
-		$.each(me.widgets, function(i, widget) {
-			widget.loadJsonData(data);
-		});
-		me.isUnloaded = false;
-		me.initToolTipInfo();
-		
-	},
-	initToolTipInfo: function() {
-
-		$('.filterInfoIcon').each(function () {
-		    
-			var me = $(this);
-			
-			var tipText;
-		    var tipLocation = "topLeft";
-		    
-		    if (me.attr('id') == 'imageIconOne') {
-		        tipText = $('#toolTipOne').html();
-		    } else if (me.attr('id') == 'imageIconTwo') {
-		        tipText = $('#toolTipTwo').html();
-		    } else if (me.attr('id') == 'searchInfoIcon') {
-		        tipText = $('#searchInfoTooltipText').html();
-		    } else {
-		        tipText = $('#toolTipThree').html();
-		        tipLocation = "topRight";
-		    }
-		    
-		    me.qtip({
-		        content: {
-		            text: tipText
-		        },
-		        position: {
-		            corner: {
-		                target: 'center',
-		                tooltip: tipLocation
-		            }
-		        },
-		        show: {
-		            when: {
-		                event: 'mouseover'
-		            }
-		        },
-		        hide: {
-		            fixed: true // Make it fixed so it can be hovered over
-		        },
-		        style: {
-		            padding: '6px 6px',
-		            // Give it some extra padding
-		            width: 500,
-		            textAlign: 'left',
-		            backgroundColor: '#ffffc0',
-		            fontSize: '.7em',
-		            padding: '6px 10px 6px 10px',
-		            lineHeight: '14px'
-		        }
-		    });
-		});
 	}
 });

productMods/templates/freemarker/visualization/mapOfScience/mapOfScienceSetup.ftl

@@ -36,18 +36,23 @@
 <script language="JavaScript" type="text/javascript">
 
 var contextPath = "${urls.base}";
+var scienceMapDataPrefix = "${urls.base}${dataVisualizationURLRoot}?vis=${mapOfScienceVisParam}&output=json&uri=";
+var scienceMapDataURL = scienceMapDataPrefix + "${entityURI}";
 
-var scienceMapDataURL = "${entityMapOfScienceDataURL}";
+var infoIconUrl = "${urls.images}/iconInfo.png";
-
-var baseImageFolderPrefix = "${urls.images}/";
 var imageFolderPrefix = "${urls.images}/visualization/";
 var mapOfScienceImageFolderPrefix  = imageFolderPrefix 
 											+ "mapofscience/";
 var disciplineLabelImageUrlPrefix = mapOfScienceImageFolderPrefix + "labels/";
 											
-var entityLabel = "${entityLabel}";
+var entityLabel = '${entityLabel}';
 
 var ENTITY_TYPE = '${entityType}';
+<#if entityType == "PERSON" >
+	<#assign viewTypeFilterDisplay = "none">
+<#else>
+	<#assign viewTypeFilterDisplay = "block">
+</#if>
 
 var loadingImageLink = contextPath + "/images/visualization/ajax-loader-indicator.gif";
 var refreshPageImageLink = contextPath + "/images/visualization/refresh-green.png";
@@ -81,6 +86,8 @@ ${scripts.add('<script type="text/javascript" src="http://maps.google.com/maps/a
 			  '<script type="text/javascript" src="${urls.base}/js/visualization/mapofscience/MarkerManager.js"></script>',
 			  '<script type="text/javascript" src="${urls.base}/js/visualization/mapofscience/ScimapWidget.js"></script>',
 			  '<script type="text/javascript" src="${urls.base}/js/visualization/mapofscience/DataTableWidget.js"></script>',
+			  '<script type="text/javascript" src="${urls.base}/js/visualization/mapofscience/ComparisonScimapWidget.js"></script>',
+			  '<script type="text/javascript" src="${urls.base}/js/visualization/mapofscience/ComparisonDataTableWidget.js"></script>',
 			  '<script type="text/javascript" src="${urls.base}/js/visualization/mapofscience/VisModeControllers.js"></script>',
 			  '<script type="text/javascript" src="${urls.base}/js/visualization/mapofscience/VisCommonControl.js"></script>',
 			  '<script type="text/javascript" src="${urls.base}/js/visualization/mapofscience/InitializeMap.js"></script>')}              

productMods/templates/freemarker/visualization/mapOfScience/mapOfScienceStandalone.ftl

@@ -39,26 +39,18 @@ corresponding changes in the included Templates. -->
             <h1>&#035;{title}</h1>
             <p>&#035;{text}</p>
         </div>
+    </div>
     
+    <#-- VIEW TYPE FILTER -->
+    <div id="view-type-filter" style="display:${viewTypeFilterDisplay};">
+    	<input type="radio" name="view-type" value="ENTITY"> Explore ${entityLabel} </input><br>
+		<input type="radio" name="view-type" value="COMPARISON"> Compare organizations (or people) </input><br><br>
     </div>
     
     <!-- <h3>What do you want to compare?</h3> -->
-    <div id="science-areas-filter">
-    	<span id="discipline-filter" class="filter-option active-filter">13 Disciplines</span> | 
-    	<span id="subdisciplines-filter" class="filter-option">554 Sub-Disciplines</span>
-    	<img class="filterInfoIcon" id="imageIconTwo" src="${urls.images}/iconInfo.png" 
-    		 alt="information icon" 
-    		 title="" />
-    </div>
     
     <div id="main-science-areas-table-container"></div>
 
-    <hr class="subtle-hr"/>
-    
-    <div id="main-science-areas-table-footer">
-    <a id="csv" href="${entityMapOfScienceDisciplineCSVURL}" class="map-of-science-links">Save All as CSV</a>
-    <#-- <a class="clear-selected-entities map-of-science-links" title="Clear all selected entities.">Clear</a> -->
-    </div>
 </div>		
 
 <div id="right-column"><div id="map_area"></div>
@@ -78,6 +70,9 @@ mapped <span id="percent-mapped"></span>% of <span id="total-publications"></spa
 
 </div>
 </div>
+
+<#-- START TOOLTIP TEXT -->
+
 <div id="toolTipOne" style="display:none;">
 VIVO's Map of Science visualization shows the publication activity of any organization, person, or university in a VIVO instance, 
 overlaid on the map of science. This particular page shows the publication activity of ${entityLabel}.<br /> <br /> 
@@ -144,9 +139,33 @@ concern.</div>
 
 <div id="searchInfoTooltipText" style="display:none;">
 	<!-- Search for specific sub-discipline (or discipline) label in the first column of the table. -->
-	List only map of science areas whose names contain this text.
+	List only sub-disciplines (or disciplines) whose name contains this text.
 </div>
 
+
+<#-- COMPARISON TOOLTIP TEXT -->
+
+<div id="comparisonToolTipTwo" style="display:none;">
+The organizations or people listed below are only those which are directly beneath ${entityLabel} in the 
+organization hierarchy. You may 'drill down' to see the organizations or people below a given sub-organization 
+by selecting the chart icon next to a selected sub-organization's name below the graph on the right.
+<br /><br />
+
+The <b># of pubs.</b> column shows how many of the publications were mapped to each field.  
+This count can be fractional because some publication venues are associated with more than one field.  
+Each publication in such a venue contributes fractionally to all associated fields according to a weighting scheme.
+
+<br /><br />
+The <b>% activity</b> column shows what proportion of the publications were mapped to each field.
+
+</div>
+
+<div id="comparisonSearchInfoTooltipText" style="display:none;">
+	<!-- Search for specific sub-discipline (or discipline) label in the first column of the table. -->
+	List only organizations (or people) whose name contains this text.
+</div>
+<#-- END TOOLTIP TEXT -->
+
 <div id="error-container">
 
 <h1 id="noPublications-header">${entityLabel}</h1>