diff --git a/src/app/components/analysis-panel/analysis-panel.component.ts b/src/app/components/analysis-panel/analysis-panel.component.ts index 16c484db5423f95696bb2f3cd7bccbcedaa120ea..be1a6a759bc1070a05241028a6b3e19d5cc1f877 100644 --- a/src/app/components/analysis-panel/analysis-panel.component.ts +++ b/src/app/components/analysis-panel/analysis-panel.component.ts @@ -204,6 +204,7 @@ export class AnalysisPanelComponent implements OnInit, OnChanges, AfterViewInit if (!this.drugstoneConfig.config.physicsOn) { this.networkHandler.activeNetwork.updatePhysicsEnabled(false); } + this.networkHandler.updateAdjacentNodes(); }); this.tableDrugs = nodes.filter(e => e.drugstoneId && e.drugstoneType === 'drug'); this.tableDrugs.forEach((r) => { diff --git a/src/app/components/network/network.component.ts b/src/app/components/network/network.component.ts index 7366ff22224d58d0aea88a69ac50767970675520..d13a9c9dee8525aa2bff2624f042a923a20a1983 100644 --- a/src/app/components/network/network.component.ts +++ b/src/app/components/network/network.component.ts @@ -21,7 +21,7 @@ import {NetworkSettings} from 'src/app/network-settings'; import {pieChartContextRenderer} from 'src/app/utils'; import {NetworkHandlerService} from 'src/app/services/network-handler/network-handler.service'; import {LegendService} from 'src/app/services/legend-service/legend-service.service'; -import { LoadingScreenService } from 'src/app/services/loading-screen/loading-screen.service'; +import {LoadingScreenService} from 'src/app/services/loading-screen/loading-screen.service'; @Component({ @@ -81,7 +81,7 @@ export class NetworkComponent implements OnInit { public nodeRenderer = null; - public loading = false + public loading = false; constructor( public configService: DrugstoneConfigService, @@ -91,8 +91,8 @@ export class NetworkComponent implements OnInit { public drugstoneConfig: DrugstoneConfigService, public netex: NetexControllerService, public omnipath: OmnipathControllerService, - public loadingScreen: LoadingScreenService) - {} + public loadingScreen: LoadingScreenService) { + } ngOnInit(): void { this.networkHandler.networks[this.networkType] = this; @@ -116,15 +116,16 @@ export class NetworkComponent implements OnInit { updateQueryItems() { this.queryItems = []; - if (this.currentViewNodes) + if (this.currentViewNodes) { this.currentViewNodes.forEach((protein) => { this.queryItems.push(getWrapperFromNode(protein)); }); + } } public saveAddNodes(nodeList: Node[]) { const existing = this.nodeData.nodes.get().map(n => n.id); - const toAdd = nodeList.filter(n => existing.indexOf(n.id) === -1) + const toAdd = nodeList.filter(n => existing.indexOf(n.id) === -1); this.nodeData.nodes.add(toAdd); } @@ -132,31 +133,33 @@ export class NetworkComponent implements OnInit { this.loadingScreen.stateUpdate(true); this.adjacentDisordersProtein = bool; if (this.adjacentDisordersProtein) { - this.legendService.add_to_context('adjacentDisorders') + this.legendService.add_to_context('adjacentDisorders'); this.netex.adjacentDisorders(this.nodeData.nodes.get(), 'proteins', this.drugstoneConfig.config.associatedProteinDisorder, this.drugstoneConfig.config.licensedDatasets).subscribe(response => { - const proteinMap = this.getProteinMap() - const addedEdge = {} + const proteinMap = this.getProteinMap(); + const addedEdge = {}; for (const interaction of response.edges) { - const edge = mapCustomEdge({from: interaction.protein, to: interaction.disorder}, this.drugstoneConfig.config) + const edge = mapCustomEdge({from: interaction.protein, to: interaction.disorder}, this.drugstoneConfig.config); if (proteinMap[edge.from]) { proteinMap[edge.from].forEach(from => { - if (addedEdge[from] && addedEdge[from].indexOf(edge.to) !== -1) - return - const e = JSON.parse(JSON.stringify(edge)) - e.from = from - e.to = edge.to + if (addedEdge[from] && addedEdge[from].indexOf(edge.to) !== -1) { + return; + } + const e = JSON.parse(JSON.stringify(edge)); + e.from = from; + e.to = edge.to; this.adjacentProteinDisorderEdgesList.push(e); - if (!addedEdge[from]) - addedEdge[from] = [edge.to] - else - addedEdge[from].push(edge.to) - }) + if (!addedEdge[from]) { + addedEdge[from] = [edge.to]; + } else { + addedEdge[from].push(edge.to); + } + }); } } for (const disorder of response.disorders) { disorder.group = 'defaultDisorder'; disorder.id = disorder.drugstoneId; - this.adjacentProteinDisorderList.push(mapCustomNode(disorder, this.drugstoneConfig.currentConfig())) + this.adjacentProteinDisorderList.push(mapCustomNode(disorder, this.drugstoneConfig.currentConfig())); } this.saveAddNodes(this.adjacentProteinDisorderList); this.nodeData.edges.add(this.adjacentProteinDisorderEdgesList); @@ -197,8 +200,9 @@ export class NetworkComponent implements OnInit { this.loadingScreen.stateUpdate(false); }); } else { - if (!this.adjacentDisordersProtein) + if (!this.adjacentDisordersProtein) { this.legendService.remove_from_context('adjacentDisorders'); + } this.saveRemoveDisorders(this.adjacentDrugDisorderList); this.nodeData.edges.remove(this.adjacentDrugDisorderEdgesList); this.adjacentDrugDisorderList = []; @@ -209,68 +213,73 @@ export class NetworkComponent implements OnInit { } public getProteinMap() { - const proteinMap = {} + const proteinMap = {}; this.nodeData.nodes.get().forEach(n => { if (n.drugstoneType === 'protein') { n.drugstoneId.forEach(id => { if (typeof id === 'string') { - if (proteinMap[id]) - proteinMap[id].push(n.id) - else + if (proteinMap[id]) { + proteinMap[id].push(n.id); + } else { proteinMap[id] = [n.id]; + } } else { n.id.forEach(single_id => { - if (proteinMap[single_id]) - proteinMap[single_id].push(n.id) - else + if (proteinMap[single_id]) { + proteinMap[single_id].push(n.id); + } else { proteinMap[single_id] = [n.id]; - }) + } + }); } }); } }); - return proteinMap + return proteinMap; } public updateAdjacentDrugs(bool: boolean) { this.loadingScreen.stateUpdate(true); this.adjacentDrugs = bool; if (this.adjacentDrugs) { - this.legendService.add_to_context("adjacentDrugs") - const addedEdge = {} - const proteinMap = this.getProteinMap() + this.legendService.add_to_context('adjacentDrugs'); + const addedEdge = {}; + const proteinMap = this.getProteinMap(); this.netex.adjacentDrugs(this.drugstoneConfig.config.interactionDrugProtein, this.drugstoneConfig.config.licensedDatasets, this.nodeData.nodes.get()).subscribe(response => { const existingDrugIDs = this.nodeData.nodes.get().filter(n => n.drugstoneId && n.drugstoneType === 'drug').map(n => n.drugstoneId); for (const interaction of response.pdis) { - const edge = mapCustomEdge({from: interaction.protein, to: interaction.drug}, this.drugstoneConfig.currentConfig()) + const edge = mapCustomEdge({from: interaction.protein, to: interaction.drug}, this.drugstoneConfig.currentConfig()); if (proteinMap[edge.from]) { proteinMap[edge.from].forEach(from => { - if (addedEdge[from] && addedEdge[from].indexOf(edge.to) !== -1) - return - const e = JSON.parse(JSON.stringify(edge)) - e.from = from - e.to = edge.to + if (addedEdge[from] && addedEdge[from].indexOf(edge.to) !== -1) { + return; + } + const e = JSON.parse(JSON.stringify(edge)); + e.from = from; + e.to = edge.to; this.adjacentDrugEdgesList.push(e); - if (!addedEdge[from]) - addedEdge[from] = [edge.to] - else - addedEdge[from].push(edge.to) - }) + if (!addedEdge[from]) { + addedEdge[from] = [edge.to]; + } else { + addedEdge[from].push(edge.to); + } + }); } } for (const drug of response.drugs) { drug.group = 'foundDrug'; drug.id = getDrugNodeId(drug); - if (existingDrugIDs.indexOf(drug.drugstoneId) === -1) { - this.adjacentDrugList.push(mapCustomNode(drug, this.drugstoneConfig.currentConfig())) + if (!existingDrugIDs.includes(drug.drugstoneId)) { + existingDrugIDs.push(drug.drugstoneId); + this.adjacentDrugList.push(mapCustomNode(drug, this.drugstoneConfig.currentConfig())); } } this.nodeData.nodes.add(this.adjacentDrugList); this.nodeData.edges.add(this.adjacentDrugEdgesList); this.updateQueryItems(); this.loadingScreen.stateUpdate(false); - }) + }); } else { // remove adjacent drugs, make sure that also drug associated disorders are removed if (this.adjacentDisordersDrug) { @@ -290,13 +299,13 @@ export class NetworkComponent implements OnInit { } public saveRemoveDisorders(nodeList: Node[]) { - const other = this.adjacentDrugDisorderList === nodeList ? this.adjacentProteinDisorderList : this.adjacentDrugDisorderList - if (other == null) + const other = this.adjacentDrugDisorderList === nodeList ? this.adjacentProteinDisorderList : this.adjacentDrugDisorderList; + if (other == null) { this.nodeData.nodes.remove(nodeList); - else { + } else { const otherIds = other.map(d => d.id); - const rest = nodeList.filter(d => otherIds.indexOf(d.id) === -1) - this.nodeData.nodes.remove(rest) + const rest = nodeList.filter(d => otherIds.indexOf(d.id) === -1); + this.nodeData.nodes.remove(rest); } } @@ -367,7 +376,7 @@ export class NetworkComponent implements OnInit { this.nodeRenderer = null; const updatedNodes = []; // for (const item of this.proteins) { - const proteins = this.nodeData.nodes.get().filter(n => n.drugstoneId && n.drugstoneType === 'protein') + const proteins = this.nodeData.nodes.get().filter(n => n.drugstoneId && n.drugstoneType === 'protein'); for (const node of proteins) { const pos = this.networkInternal.getPositions([node.id]); node.x = pos[node.id].x; @@ -421,31 +430,33 @@ export class NetworkComponent implements OnInit { const updatedNodes = []; this.nodeRenderer = pieChartContextRenderer; // mapping from netex IDs to network IDs, TODO check if this step is necessary - const networkIdMapping = {} + const networkIdMapping = {}; this.nodeData.nodes.get().forEach(element => { if (element.drugstoneType === 'protein') { element.drugstoneId.forEach(id => { - if (networkIdMapping[id]) + if (networkIdMapping[id]) { networkIdMapping[id].push(element.id); - else - networkIdMapping[id] = [element.id] + } else { + networkIdMapping[id] = [element.id]; + } }); } }); const maxExpr = Math.max(...Object.values(this.expressionMap)); - const exprMap = {} + const exprMap = {}; for (const [drugstoneId, expressionlvl] of Object.entries(this.expressionMap)) { networkIdMapping[drugstoneId].forEach(networkId => { - if (!exprMap[networkId]) - exprMap[networkId] = [expressionlvl] - else - exprMap[networkId].push(expressionlvl) - }) + if (!exprMap[networkId]) { + exprMap[networkId] = [expressionlvl]; + } else { + exprMap[networkId].push(expressionlvl); + } + }); } - this.expressionMap = {} + this.expressionMap = {}; Object.keys(exprMap).forEach(networkId => { const expressionlvl = exprMap[networkId] ? exprMap[networkId].reduce((a, b) => a + b) / exprMap[networkId].length : null; - this.expressionMap[networkId] = expressionlvl + this.expressionMap[networkId] = expressionlvl; const node = this.nodeData.nodes.get(networkId); if (node === null) { return; @@ -468,20 +479,23 @@ export class NetworkComponent implements OnInit { node.shape = 'custom'; node.ctxRenderer = pieChartContextRenderer; updatedNodes.push(node); - }) + }); this.nodeData.nodes.update(updatedNodes); this.loadingScreen.stateUpdate(false); } - ) + ); } this.currentViewSelectedTissue = this.selectedTissue; } public hasDrugsLoaded(): boolean { - if (this.nodeData && this.nodeData.nodes) - for (const node of this.nodeData.nodes.get()) - if (node.drugstoneType && node.drugstoneId === 'drug') + if (this.nodeData && this.nodeData.nodes) { + for (const node of this.nodeData.nodes.get()) { + if (node.drugstoneType && node.drugstoneId === 'drug') { return true; + } + } + } return false; } @@ -497,10 +511,11 @@ export class NetworkComponent implements OnInit { this.loadingScreen.stateUpdate(true); this.highlightSeeds = bool; const updatedNodes = []; - if (this.highlightSeeds) - this.legendService.add_to_context('seeds') - else - this.legendService.remove_from_context('seeds') + if (this.highlightSeeds) { + this.legendService.add_to_context('seeds'); + } else { + this.legendService.remove_from_context('seeds'); + } for (const node of this.nodeData.nodes.get().filter(n => n.drugstoneType === 'protein')) { if (node.drugstoneId === undefined) { // nodes that are not mapped to backend remain untouched @@ -510,7 +525,7 @@ export class NetworkComponent implements OnInit { if (!node) { continue; } - console.log(node) + console.log(node); const pos = this.networkHandler.activeNetwork.networkInternal.getPositions([node.id]); node.x = pos[node.id].x; node.y = pos[node.id].y; diff --git a/src/app/config.ts b/src/app/config.ts index 31da31f923b7f9303dcd825526b1d85a6b04ab78..21914c8c125df5907b7a688dea7ab21df49983b2 100644 --- a/src/app/config.ts +++ b/src/app/config.ts @@ -60,11 +60,14 @@ export interface IConfig { showNetworkMenuButtonScreenshot: boolean; showNetworkMenuButtonExportGraphml: boolean; showNetworkMenuButtonAdjacentDrugs: boolean; + activateNetworkMenuButtonAdjacentDrugs: boolean; showNetworkMenuButtonCenter: boolean; showConnectGenes: boolean; networkMenuButtonAdjacentDrugsLabel: string; showNetworkMenuButtonAdjacentDisordersProteins: boolean; + activateNetworkMenuButtonAdjacentDisorders: boolean; networkMenuButtonAdjacentDisordersProteinsLabel: string; + activateNetworkMenuButtonAdjacentDisorderDrugs: boolean; showNetworkMenuButtonAdjacentDisordersDrugs: boolean; networkMenuButtonAdjacentDisordersDrugsLabel: string; showNetworkMenuButtonAnimation: boolean; @@ -155,10 +158,12 @@ export const defaultConfig: IConfig = { showNetworkMenuButtonScreenshot: true, showNetworkMenuButtonExportGraphml: true, showNetworkMenuButtonAdjacentDrugs: true, + activateNetworkMenuButtonAdjacentDrugs: false, showNetworkMenuButtonCenter: true, showNetworkMenuButtonAnimation: true, - + activateNetworkMenuButtonAdjacentDisorders: false, showNetworkMenuButtonAdjacentDisordersProteins: true, + activateNetworkMenuButtonAdjacentDisorderDrugs: false, showNetworkMenuButtonAdjacentDisordersDrugs: true, showConnectGenes: true, networkMenuButtonAdjacentDrugsLabel: 'Drugs', diff --git a/src/app/pages/explorer-page/explorer-page.component.ts b/src/app/pages/explorer-page/explorer-page.component.ts index ab2348c07ee45787c8d7630cc7a8ccd3068fbfb3..9fb7a0fcb76d82e0849c42d1c053e114b0648a5a 100644 --- a/src/app/pages/explorer-page/explorer-page.component.ts +++ b/src/app/pages/explorer-page/explorer-page.component.ts @@ -228,6 +228,7 @@ export class ExplorerPageComponent implements OnInit, AfterViewInit { if (this.drugstoneConfig.config.physicsOn) { this.networkHandler.activeNetwork.updatePhysicsEnabled(true); } + this.networkHandler.updateAdjacentNodes(); }); } } diff --git a/src/app/services/network-handler/network-handler.service.ts b/src/app/services/network-handler/network-handler.service.ts index d251fbaa636b777e8b3ea04c05619cf75a9f58a4..e422a0b992fd645867b163f0f9ec1d85dab8c45d 100644 --- a/src/app/services/network-handler/network-handler.service.ts +++ b/src/app/services/network-handler/network-handler.service.ts @@ -6,8 +6,8 @@ import {AnalysisService} from '../analysis/analysis.service'; import {DrugstoneConfigService} from '../drugstone-config/drugstone-config.service'; import {NetexControllerService} from '../netex-controller/netex-controller.service'; import {OmnipathControllerService} from '../omnipath-controller/omnipath-controller.service'; -import {LegendService} from "../legend-service/legend-service.service"; -import { LoadingScreenService } from '../loading-screen/loading-screen.service'; +import {LegendService} from '../legend-service/legend-service.service'; +import {LoadingScreenService} from '../loading-screen/loading-screen.service'; @Injectable({ providedIn: 'root' @@ -34,4 +34,19 @@ export class NetworkHandlerService { get getChange$() { return this.change.asObservable(); } + + async updateAdjacentNodes() { + if (this.drugstoneConfig.config.activateNetworkMenuButtonAdjacentDrugs) { + this.activeNetwork.adjacentDrugs = true; + await this.activeNetwork.updateAdjacentDrugs(true); + } + if (this.drugstoneConfig.config.activateNetworkMenuButtonAdjacentDisorders) { + this.activeNetwork.adjacentDisordersProtein = true; + await this.activeNetwork.updateAdjacentProteinDisorders(true); + } + if (this.drugstoneConfig.config.activateNetworkMenuButtonAdjacentDisorderDrugs) { + this.activeNetwork.adjacentDisordersDrug = true; + await this.activeNetwork.updateAdjacentDrugDisorders(true); + } + } } diff --git a/src/index.html b/src/index.html index 4e5a70b55e56b535861c7a59313829a83d30ac16..e7425fab404d6d3b65be9c5dc3221e739d37d4c0 100644 --- a/src/index.html +++ b/src/index.html @@ -97,7 +97,7 @@ <drugst-one id="tatata" groups= '{ "nodeGroups" : { "selectedNode": { "borderWidth": 3,"borderWidthSelected": 4,"color": { "border": "#ffffff","highlight": {"border": "#ffffff"}},"font": { "color": "#F8981","size": 14 }},"Protein":{"shape":"circle","groupName":"Protein","type":"Protein","color":"#172b4d","font":{"color":"#ffffff"}}}}' - config='{ "identifier":"symbol","title":"ROBUST output network", "taskDrugName": "Drug Search", "showLegendNodes": true, "showLegendEdges": true, "showSidebar": "left", "showOverview": true, "legendPos": "left", "legendClass": "legend", "showQuery": true, "showItemSelector": true,"showSimpleAnalysis": false,"showAdvAnalysis": true,"showSelection": true,"showTasks": true,"showNetworkMenu": "right","showLegend": true,"showNetworkMenuButtonExpression": true, "showNetworkMenuButtonScreenshot": true,"showNetworkMenuButtonExportGraphml": true,"showNetworkMenuButtonAdjacentDrugs": true,"showNetworkMenuButtonCenter": true,"showConnectGenes": false,"networkMenuButtonAdjacentDrugsLabel": "Drugs","showNetworkMenuButtonAdjacentDisordersProteins": true,"networkMenuButtonAdjacentDisordersProteinsLabel": "Disorders (protein)","showNetworkMenuButtonAdjacentDisordersDrugs": true,"networkMenuButtonAdjacentDisordersDrugsLabel": "Disorders (drug)","showNetworkMenuButtonAnimation": true,"networkMenuButtonAnimationLabel": "Animation", "autofillEdges": true, "physicsOn": false,"useNedrexLicenced": true,"selfReferences": false, "interactionDrugProtein": "NeDRex", "indicationDrugDisorder": "NeDRex","nodeShadow": true,"edgeShadow": true, "algorithms": {"drug": ["trustrank", "closeness", "degree", "proximity"], "drug-target": ["trustrank", "multisteiner", "keypathwayminer", "degree", "closeness", "betweenness"]}, "associatedProteinDisorder": "NeDRex", "expandNetworkMenu": true}' + config='{ "activateNetworkMenuButtonAdjacentDrugs": true,"activateNetworkMenuButtonAdjacentDisorders": true, "activateNetworkMenuButtonAdjacentDisorderDrugs": true, "identifier":"symbol","title":"ROBUST output network", "taskDrugName": "Drug Search", "showLegendNodes": true, "showLegendEdges": true, "showSidebar": "left", "showOverview": true, "legendPos": "left", "legendClass": "legend", "showQuery": true, "showItemSelector": true,"showSimpleAnalysis": false,"showAdvAnalysis": true,"showSelection": true,"showTasks": true,"showNetworkMenu": "right","showLegend": true,"showNetworkMenuButtonExpression": true, "showNetworkMenuButtonScreenshot": true,"showNetworkMenuButtonExportGraphml": true,"showNetworkMenuButtonAdjacentDrugs": true,"showNetworkMenuButtonCenter": true,"showConnectGenes": false,"networkMenuButtonAdjacentDrugsLabel": "Drugs","showNetworkMenuButtonAdjacentDisordersProteins": true,"networkMenuButtonAdjacentDisordersProteinsLabel": "Disorders (protein)","showNetworkMenuButtonAdjacentDisordersDrugs": true,"networkMenuButtonAdjacentDisordersDrugsLabel": "Disorders (drug)","showNetworkMenuButtonAnimation": true,"networkMenuButtonAnimationLabel": "Animation", "autofillEdges": true, "physicsOn": false,"useNedrexLicenced": true,"selfReferences": false, "interactionDrugProtein": "NeDRex", "indicationDrugDisorder": "NeDRex","nodeShadow": true,"edgeShadow": true, "algorithms": {"drug": ["trustrank", "closeness", "degree", "proximity"], "drug-target": ["trustrank", "multisteiner", "keypathwayminer", "degree", "closeness", "betweenness"]}, "associatedProteinDisorder": "NeDRex", "expandNetworkMenu": true}' network='{"nodes": [{"id":"PSEN1","group":"Protein","label":"PSEN1"},{"id":"PSEN2","group":"Protein","label":"PSEN2"},{"id":"APP","group":"Protein","label":"APP"},{"id":"APOE","group":"Protein","label":"APOE"},{"id":"RNF32","group":"Protein","label":"RNF32"},{"id":"STX5","group":"Protein","label":"STX5"},{"id":"TRAF3IP1","group":"Protein","label":"TRAF3IP1"},{"id":"PHB1","group":"Protein","label":"PHB1"},{"id":"MAPT","group":"Protein","label":"MAPT"},{"id":"ESR1","group":"Protein","label":"ESR1"},{"id":"IRF3","group":"Protein","label":"IRF3"},{"id":"DYNC1H1","group":"Protein","label":"DYNC1H1"},{"id":"CUL3","group":"Protein","label":"CUL3"},{"id":"HMGB1","group":"Protein","label":"HMGB1"},{"id":"DNAJC7","group":"Protein","label":"DNAJC7"},{"id":"NEFM","group":"Protein","label":"NEFM"},{"id":"DISC1","group":"Protein","label":"DISC1"},{"id":"PPP5C","group":"Protein","label":"PPP5C"},{"id":"CTNNB1","group":"Protein","label":"CTNNB1"},{"id":"KRAS","group":"Protein","label":"KRAS"}]}' ></drugst-one>