diff --git a/frontend-js/src/main/js/gui/AbstractGuiElement.js b/frontend-js/src/main/js/gui/AbstractGuiElement.js index 6183c5953282cb47688ef0caac0f67ace4e61bae..739abfa07a8a4c91685a8480f0fd49310d8a205c 100644 --- a/frontend-js/src/main/js/gui/AbstractGuiElement.js +++ b/frontend-js/src/main/js/gui/AbstractGuiElement.js @@ -89,7 +89,11 @@ AbstractGuiElement.prototype.setProject = function (project) { */ AbstractGuiElement.prototype.getProject = function () { if (this._project === undefined || this._project === null) { - return this.getMap().getProject(); + if (this.getMap()) { + return this.getMap().getProject(); + } else { + return null; + } } else { return this._project; } diff --git a/frontend-js/src/main/js/gui/leftPanel/AbstractDbPanel.js b/frontend-js/src/main/js/gui/leftPanel/AbstractDbPanel.js index 8d5c6d84f7e3159aeea25af7454d251187e11601..53abb947aab7dd1e45d4decba0233d025d9b5e3d 100644 --- a/frontend-js/src/main/js/gui/leftPanel/AbstractDbPanel.js +++ b/frontend-js/src/main/js/gui/leftPanel/AbstractDbPanel.js @@ -18,7 +18,7 @@ var Functions = require('../../Functions'); * @constructor * @extends Panel */ -function AbstractPanel(params) { +function AbstractDbPanel(params) { Panel.call(this, params); var self = this; @@ -30,10 +30,10 @@ function AbstractPanel(params) { } -AbstractPanel.prototype = Object.create(Panel.prototype); -AbstractPanel.prototype.constructor = AbstractPanel; +AbstractDbPanel.prototype = Object.create(Panel.prototype); +AbstractDbPanel.prototype.constructor = AbstractDbPanel; -AbstractPanel.prototype._createEventHandlers = function () { +AbstractDbPanel.prototype._createEventHandlers = function () { var self = this; var searchButton = self.getControlElement(PanelControlElementType.SEARCH_BUTTON); var searchInput = self.getControlElement(PanelControlElementType.SEARCH_INPUT); @@ -77,7 +77,7 @@ AbstractPanel.prototype._createEventHandlers = function () { }; -AbstractPanel.prototype._initializeGui = function (placeholder) { +AbstractDbPanel.prototype._initializeGui = function (placeholder) { var searchQueryDiv = Functions.createElement({ type: "div", name: "searchQuery", @@ -170,7 +170,7 @@ AbstractPanel.prototype._initializeGui = function (placeholder) { }; -AbstractPanel.prototype.setOverlayDb = function (overlayDb) { +AbstractDbPanel.prototype.setOverlayDb = function (overlayDb) { if (overlayDb === undefined) { throw new Error("Undefined overlayDb for panel: " + this.getPanelName()); } @@ -181,11 +181,11 @@ AbstractPanel.prototype.setOverlayDb = function (overlayDb) { * * @returns {AbstractDbOverlay} */ -AbstractPanel.prototype.getOverlayDb = function () { +AbstractDbPanel.prototype.getOverlayDb = function () { return this._overlayDb; }; -AbstractPanel.prototype.clearResults = function () { +AbstractDbPanel.prototype.clearResults = function () { var navElement = this.getControlElement(PanelControlElementType.SEARCH_RESULTS_NAV_TAB); while (navElement.firstChild) { navElement.removeChild(navElement.firstChild); @@ -197,7 +197,7 @@ AbstractPanel.prototype.clearResults = function () { } }; -AbstractPanel.prototype.refreshSearchResults = function () { +AbstractDbPanel.prototype.refreshSearchResults = function () { var self = this; self.clearResults(); var searchDb = self.getOverlayDb(); @@ -216,15 +216,15 @@ AbstractPanel.prototype.refreshSearchResults = function () { }); }; -AbstractPanel.prototype.getAutocomplete = function () { +AbstractDbPanel.prototype.getAutocomplete = function () { logger.warn("Get autocomplete not implemented"); }; -AbstractPanel.prototype.searchByQuery = function () { +AbstractDbPanel.prototype.searchByQuery = function () { throw new Error("searchByQuery is not implemented"); }; -AbstractPanel.prototype.addResultTab = function (query, elements) { +AbstractDbPanel.prototype.addResultTab = function (query, elements) { var self = this; var name = JSON.parse(query).query; @@ -291,7 +291,7 @@ AbstractPanel.prototype.addResultTab = function (query, elements) { * * @returns {Promise<HTMLTableRowElement>} */ -AbstractPanel.prototype.createTableElement = function () { +AbstractDbPanel.prototype.createTableElement = function () { throw new Error("Not implemented"); }; @@ -301,7 +301,7 @@ AbstractPanel.prototype.createTableElement = function () { * @param {string} icon * @returns {Promise<HTMLTableRowElement>} */ -AbstractPanel.prototype.createTargetRow = function (target, icon) { +AbstractDbPanel.prototype.createTargetRow = function (target, icon) { var self = this; var guiUtils = self.getGuiUtils(); var result = document.createElement("tr"); @@ -369,7 +369,7 @@ AbstractPanel.prototype.createTargetRow = function (target, icon) { return Promise.resolve(result); }; -AbstractPanel.prototype.computeAutocompleteDictionary = function (queries) { +AbstractDbPanel.prototype.computeAutocompleteDictionary = function (queries) { var result = {}; var i, j, k, mainString, substring, list; @@ -423,4 +423,4 @@ AbstractPanel.prototype.computeAutocompleteDictionary = function (queries) { }; -module.exports = AbstractPanel; +module.exports = AbstractDbPanel; diff --git a/frontend-js/src/main/js/gui/leftPanel/GuiUtils.js b/frontend-js/src/main/js/gui/leftPanel/GuiUtils.js index 87cf701f2818916178676825f3f045fad5710767..ac94582e47610b80bc90790de61f16ea0fde61f1 100644 --- a/frontend-js/src/main/js/gui/leftPanel/GuiUtils.js +++ b/frontend-js/src/main/js/gui/leftPanel/GuiUtils.js @@ -139,7 +139,7 @@ GuiUtils.prototype.createPostTranslationalModifications = function (label, value }); for (var i = 0; i < value.length; i++) { var modification = value[i]; - var row = self.createModificationRow(modification, self); + var row = self.createModificationRow(modification); if (row !== null) { list.appendChild(row); count++; @@ -784,6 +784,7 @@ GuiUtils.prototype.createTabMenuObject = function (params) { navLink.innerHTML = name; } navLink.onclick = function () { + console.log("SHOW", $(this)[0].href); $(this).tab('show'); }; navLi.appendChild(navLink); @@ -956,7 +957,6 @@ GuiUtils.prototype.initTabContent = function (abstractGuiElement) { } abstractGuiElement._panels = []; - abstractGuiElement._tabIdCount = 0; var tabDiv = Functions.createElement({ type: "div", @@ -981,11 +981,12 @@ GuiUtils.prototype.initTabContent = function (abstractGuiElement) { * @param {AbstractGuiElement} abstractGuiElement * @param {Object} params * @param {string} params.name + * @param {Object} [params.options] - optional parameters passed to the panel constructor * @param {function} params.panelClass */ GuiUtils.prototype.addTab = function (abstractGuiElement, params) { - var tabId = "admin_panel_tab_" + abstractGuiElement._tabIdCount; - abstractGuiElement._tabIdCount++; + var tabId = "panel_tab_" + tabIdCounter; + tabIdCounter++; var navElement = $(abstractGuiElement.getElement()).find("> .parentTabs > .nav-tabs")[0]; var contentElement = $(abstractGuiElement.getElement()).find("> .parentTabs > .tab-content")[0]; @@ -1004,12 +1005,20 @@ GuiUtils.prototype.addTab = function (abstractGuiElement, params) { contentElement.appendChild(contentDiv); - abstractGuiElement._panels.push(new params.panelClass({ + var options = { element: contentDiv, name: params.name, configuration: this.getConfiguration(), - serverConnector: abstractGuiElement.getServerConnector() - })); + serverConnector: abstractGuiElement.getServerConnector(), + customMap: abstractGuiElement.getMap(), + project: abstractGuiElement.getProject() + }; + + if (params.options !== undefined) { + options = jQuery.extend(options, params.options); + } + + abstractGuiElement._panels.push(new params.panelClass(options)); }; module.exports = GuiUtils; diff --git a/frontend-js/src/main/js/gui/leftPanel/LeftPanel.js b/frontend-js/src/main/js/gui/leftPanel/LeftPanel.js index 7a6942a1f5717649a9d6315bc0cac209373ca2bc..646c317f8edc13bfb5ec7d0355fa6354ca7a92ef 100644 --- a/frontend-js/src/main/js/gui/leftPanel/LeftPanel.js +++ b/frontend-js/src/main/js/gui/leftPanel/LeftPanel.js @@ -177,7 +177,7 @@ LeftPanel.prototype.showElementDetails = function (element) { }).siblings('.ui-dialog-titlebar').css("background", "gray"); } - var openedTabs = $("[name='tabView'] > ul li.active a > .maintabdiv"); + var openedTabs = $("[name='tabView'] > ul > li.active > a"); var openTabName = openedTabs[0].innerHTML; var searchTabName = openedTabs[1].innerHTML; var isPanelHidden = (self.getElement().style.display === "none"); diff --git a/frontend-js/src/main/js/gui/leftPanel/SearchPanel.js b/frontend-js/src/main/js/gui/leftPanel/SearchPanel.js index 96aed1d9c89be62d3b5a6251e4e0ea25730dadf4..22a3c038d76cc1f72e85f01abded2e059b04be99 100644 --- a/frontend-js/src/main/js/gui/leftPanel/SearchPanel.js +++ b/frontend-js/src/main/js/gui/leftPanel/SearchPanel.js @@ -10,73 +10,74 @@ var DrugPanel = require('./DrugPanel'); var MiRnaPanel = require('./MiRnaPanel'); var GenericSearchPanel = require('./GenericSearchPanel'); -var Functions = require('../../Functions'); var logger = require('../../logger'); +/** + * + * @param {Configuration} params.configuration + * @param {HTMLElement} params.element + * @param {Project} params.project + * @param {CustomMap} params.customMap + * @param params.parent + * + * @constructor + * @extends AbstractGuiElement + */ function SearchPanel(params) { - params.panelName = "global-search"; + params["panelName"] = "global-search"; Panel.call(this, params); var self = this; - this._tabIdCount = 0; - this._panels = []; - self._createPanelGui(); - } SearchPanel.prototype = Object.create(Panel.prototype); SearchPanel.prototype.constructor = SearchPanel; -SearchPanel.prototype._createPanelGui = function() { +/** + * + * @private + */ +SearchPanel.prototype._createPanelGui = function () { var self = this; - var panels = self.getPanelsDefinition(); - var tabDiv = Functions.createElement({ - type : "div", - name : "tabView", - className : "tabbable boxed parentTabs" - }); - self.getElement().appendChild(tabDiv); - - var tabMenuDiv = Functions.createElement({ - type : "ul", - className : "nav nav-tabs" - }); - tabDiv.appendChild(tabMenuDiv); - - var tabContentDiv = Functions.createElement({ - type : "div", - className : "tab-content" - }); - tabDiv.appendChild(tabContentDiv); + self.getGuiUtils().initTabContent(self); + var panels = self.getPanelsDefinition(); for (var i = 0; i < panels.length; i++) { - self.addTab(panels[i], tabMenuDiv, tabContentDiv); + self.getGuiUtils().addTab(self, panels[i]); } }; -SearchPanel.prototype.getPanelsDefinition = function() { - return [ { - name : "GENERIC", - className : "fa-search", - panelClass : GenericSearchPanel +/** + * + * @returns {*[]} + */ +SearchPanel.prototype.getPanelsDefinition = function () { + return [{ + name: "GENERIC", + panelClass: GenericSearchPanel, + options: {parent: this} }, { - name : "DRUG", - className : "fa-map-marker", - panelClass : DrugPanel + name: "DRUG", + panelClass: DrugPanel, + options: {parent: this} }, { - name : "CHEMICAL", - className : "fa-map-marker", - panelClass : ChemicalPanel + name: "CHEMICAL", + panelClass: ChemicalPanel, + options: {parent: this} }, { - name : "MiRNA", - className : "fa-map-marker", - panelClass : MiRnaPanel - } ]; + name: "MiRNA", + panelClass: MiRnaPanel, + options: {parent: this} + }]; }; -SearchPanel.prototype.hideTab = function(panel) { +/** + * + * @param {AbstractDbPanel} panel + */ +SearchPanel.prototype.hideTab = function (panel) { var self = this; var panelDefinitions = self.getPanelsDefinition(); for (var i = 0; i < panelDefinitions.length; i++) { @@ -91,7 +92,11 @@ SearchPanel.prototype.hideTab = function(panel) { } }; -SearchPanel.prototype.init = function() { +/** + * + * @returns {Promise} + */ +SearchPanel.prototype.init = function () { var self = this; var promises = []; @@ -101,59 +106,12 @@ SearchPanel.prototype.init = function() { return Promise.all(promises); }; -SearchPanel.prototype.addTab = function(params, navElement, contentElement) { - var self = this; - - var name = params.name; - - var tabId = "search_panel_tab_" + this._tabIdCount; - self._tabIdCount++; - - var navClass = ''; - var contentClass = 'tab-pane'; - if (navElement.children.length === 0) { - navClass = "active"; - contentClass = "tab-pane active"; - } - - var navLi = document.createElement("li"); - navLi.className = navClass; - - var navLink = document.createElement("a"); - navLink.href = "#" + tabId; - if (name !== undefined) { - if (name.length > 12) { - name = name.substring(0, 10) + "..."; - } - } else { - name = ""; - } - navLink.innerHTML = "<div class='maintabdiv'>" + name + "</div>"; - - navLink.onclick = function() { - $(this).tab('show'); - }; - - navLi.appendChild(navLink); - - navElement.appendChild(navLi); - - var contentDiv = document.createElement("div"); - contentDiv.style.height = "100%"; - contentDiv.className = contentClass; - contentDiv.id = tabId; - - contentElement.appendChild(contentDiv); - - this._panels.push(new params.panelClass({ - element : contentDiv, - customMap : self.getMap(), - parent : self - })); -}; - +/** + * + * @returns {Promise} + */ SearchPanel.prototype.destroy = function () { - return Promise.resolve(); + return Promise.resolve(); };