From 83b624d30c3bdd4ab47bd9e0579ab99b19e95d76 Mon Sep 17 00:00:00 2001
From: Michael Hartung <michi@Michaels-MacBook-Pro.local>
Date: Wed, 11 Aug 2021 17:13:47 +0200
Subject: [PATCH] bugfix: make legend again move to right
---
app-test/legend_image.html | 3 +--
.../analysis-panel.component.html | 20 +++++++++----------
.../analysis-panel.component.ts | 3 +--
.../network-legend.component.scss | 4 ++--
.../launch-analysis.component.ts | 6 ------
.../explorer-page.component.html | 6 +++---
.../explorer-page/explorer-page.component.ts | 1 -
src/index.html | 7 ++++++-
8 files changed, 22 insertions(+), 28 deletions(-)
diff --git a/app-test/legend_image.html b/app-test/legend_image.html
index dbb6b44a..9a0dda04 100644
--- a/app-test/legend_image.html
+++ b/app-test/legend_image.html
@@ -41,8 +41,7 @@
"showQuery": false,
"legendPos": "right",
"nodeGroups": {"default": {"color": "grey", "name": "Default Group", "shape": "triangle"} },
- "edgeGroups":{"default": {"color": "grey", "name": "Default Edge Group"}, "custom": {"color": "red", "name": "Custom Edge Group"}},
- "legendUrl": "https://exbio.wzw.tum.de/covex/assets/leg1.png"
+ "edgeGroups":{"default": {"color": "grey", "name": "Default Edge Group"}, "custom": {"color": "red", "name": "Custom Edge Group"}}
}' style="height: 100vh"></network-expander>
</div>
diff --git a/src/app/components/analysis-panel/analysis-panel.component.html b/src/app/components/analysis-panel/analysis-panel.component.html
index 27d87521..cde8b7b4 100644
--- a/src/app/components/analysis-panel/analysis-panel.component.html
+++ b/src/app/components/analysis-panel/analysis-panel.component.html
@@ -143,7 +143,10 @@
<ng-container *ngIf="myConfig.showFooterButtonScreenshot">
<button class="button is-primary is-rounded has-tooltip network-footer-toolbar-element footer-buttons"
- pTooltip="Take a screenshot of the current network." tooltipStyleClass="drgstn" tooltipPosition="top" (click)="toImage()">
+ pTooltip="Take a screenshot of the current network."
+ tooltipStyleClass="drgstn"
+ tooltipPosition="top"
+ (click)="toImage()">
<span class="icon">
<i class="fas fa-camera" aria-hidden="true"></i>
</span>
@@ -153,15 +156,10 @@
</button>
</ng-container>
- <ng-container *ngIf="myConfig.showFooterButtonScreenshot">
+ <ng-container *ngIf="myConfig.showFooterButtonExportGraphml">
<button
(click)="graphmlLink()"
- class="
- button
- is-success is-rounded
- has-tooltip
- network-footer-toolbar-element
- "
+ class="button is-primary is-rounded has-tooltip network-footer-toolbar-element footer-buttons"
pTooltip="Export this network as .graphml file."
tooltipStyleClass="drgstn"
tooltipPosition="top"
@@ -170,7 +168,7 @@
<i class="fas fa-download" aria-hidden="true"></i>
</span>
<span [ngClass]="{ 'text-normal': smallStyle }"
- >Export as .graphml</span
+ >.graphml</span
>
</button>
</ng-container>
@@ -234,13 +232,13 @@
[value]="highlightSeeds" (valueChange)="updateHighlightSeeds($event)"></app-toggle>
<app-toggle *ngIf="task.info.target === 'drug-target'" class="footer-buttons network-footer-toolbar-element"
- textOn="Drugs On" textOff="Off"
+ textOn="Drugs" textOff="Off"
tooltipOn="Display adjacent drugs ON."
tooltipOff="Display adjacent drugs OFF."
[smallStyle]="smallStyle"
[value]="adjacentDrugs" (valueChange)="updateAdjacentDrugs($event)"></app-toggle>
- <app-toggle class="footer-buttons network-footer-toolbar-element" textOn="Animation On" textOff="Off"
+ <app-toggle class="footer-buttons network-footer-toolbar-element" textOn="Animation" textOff="Off"
tooltipOn="Enable the network animation."
tooltipOff="Disable the network animation and freeze nodes."
[smallStyle]="smallStyle"
diff --git a/src/app/components/analysis-panel/analysis-panel.component.ts b/src/app/components/analysis-panel/analysis-panel.component.ts
index c912f98a..f12a9090 100644
--- a/src/app/components/analysis-panel/analysis-panel.component.ts
+++ b/src/app/components/analysis-panel/analysis-panel.component.ts
@@ -70,6 +70,7 @@ export class AnalysisPanelComponent implements OnInit, OnChanges {
for (const key of Object.keys(config)) {
this.myConfig[key] = config[key];
}
+ console.log(this.myConfig)
}
@Output() tokenChange = new EventEmitter<string | null>();
@Output() showDetailsChange = new EventEmitter<Wrapper>();
@@ -493,7 +494,6 @@ export class AnalysisPanelComponent implements OnInit, OnChanges {
nodeDetails.group = nodeDetails.group ? nodeDetails.group : 'default';
nodeDetails.label = nodeDetails.label ? nodeDetails.label : nodeDetails[identifier]
}
- console.log(nodeDetails)
// IMPORTANT we set seeds to "selected" and not to seeds. The user should be inspired to run
// further analysis and the button function can be used to highlight seeds
// option to use scores[node] as gradient, but sccores are very small
@@ -624,7 +624,6 @@ export class AnalysisPanelComponent implements OnInit, OnChanges {
this.tableSelectedProteins = e;
const addItems = [];
const removeItems = [];
- console.log(e)
for (const i of this.tableSelectedProteins) {
const wrapper = getWrapperFromNode(i);
diff --git a/src/app/components/network-legend/network-legend.component.scss b/src/app/components/network-legend/network-legend.component.scss
index e0b54d8c..0d1cb302 100644
--- a/src/app/components/network-legend/network-legend.component.scss
+++ b/src/app/components/network-legend/network-legend.component.scss
@@ -4,14 +4,14 @@
div.legend {
position: absolute;
bottom: 0;
- left: 1rem;
- bottom: 1rem;
+ margin-left: 1rem;
z-index: $explorer-networklegend-z;
&.right {
right: 0;
}
img {
max-width: 20vw;
+ // margin-bottom: 1rem;
}
td.group-name{
color:var(--drgstn-text-primary);
diff --git a/src/app/dialogs/launch-analysis/launch-analysis.component.ts b/src/app/dialogs/launch-analysis/launch-analysis.component.ts
index b2e3a533..526c084f 100644
--- a/src/app/dialogs/launch-analysis/launch-analysis.component.ts
+++ b/src/app/dialogs/launch-analysis/launch-analysis.component.ts
@@ -112,12 +112,9 @@ export class LaunchAnalysisComponent implements OnInit, OnChanges {
config: this.config,
input_network: this.inputNetwork
};
- console.log("config")
- console.log(this.config)
parameters.ppi_dataset = this.config.interactionProteinProtein;
parameters.pdi_dataset = this.config.interactionDrugProtein;
- console.log(this.target)
parameters.target = this.target === 'drug' ? 'drug' : 'drug-target';
// pass network data to reconstruct network in analysis result to connect non-proteins to results
// drop interactions in nodes beforehand to no cause cyclic error, information is contained in edges
@@ -176,9 +173,6 @@ export class LaunchAnalysisComponent implements OnInit, OnChanges {
}
parameters.hub_penalty = this.multisteinerHubPenalty;
}
- console.log('parameters')
-
- console.log(parameters)
await this.analysis.startAnalysis(this.algorithm, this.target, parameters);
}
diff --git a/src/app/pages/explorer-page/explorer-page.component.html b/src/app/pages/explorer-page/explorer-page.component.html
index 49c19fc8..14720f3d 100644
--- a/src/app/pages/explorer-page/explorer-page.component.html
+++ b/src/app/pages/explorer-page/explorer-page.component.html
@@ -198,7 +198,7 @@
(click)="graphmlLink()"
class="
button footer-buttons
- is-success is-rounded
+ is-primary is-rounded
has-tooltip
network-footer-toolbar-element
"
@@ -210,7 +210,7 @@
<i class="fas fa-download" aria-hidden="true"></i>
</span>
<span [ngClass]="{ 'text-normal': smallStyle }"
- >Export as .graphml</span
+ >.graphml</span
>
</button>
</ng-container>
@@ -293,7 +293,7 @@
<app-toggle
class="footer-buttons network-footer-toolbar-element"
- textOn="Animation On"
+ textOn="Animation"
textOff="Off"
tooltipOn="Enable the network animation."
tooltipOff="Disable the network animation and freeze nodes."
diff --git a/src/app/pages/explorer-page/explorer-page.component.ts b/src/app/pages/explorer-page/explorer-page.component.ts
index 4a861930..fa2a95db 100644
--- a/src/app/pages/explorer-page/explorer-page.component.ts
+++ b/src/app/pages/explorer-page/explorer-page.component.ts
@@ -389,7 +389,6 @@ export class ExplorerPageComponent implements OnInit, AfterViewInit {
// skip if node is not a protein mapped to backend
return;
}
- console.log(node)
const wrapper = getWrapperFromNode(node);
if (this.analysis.inSelection(node)) {
this.analysis.removeItems([wrapper]);
diff --git a/src/index.html b/src/index.html
index 01498710..4d49895b 100644
--- a/src/index.html
+++ b/src/index.html
@@ -20,6 +20,10 @@
<input type="checkbox" onclick=changeConfigStr('{"showSelection":'+this.checked+'}') checked /> Show Selection<br>
<input type="checkbox" onclick=changeConfigStr('{"showFooter":'+this.checked+'}') checked /> Show Footer<br>
<input type="checkbox" onclick=changeConfigStr('{"showLegend":'+this.checked+'}') checked /> Show Legend<br>
+<input type="checkbox" onclick=changeConfigStr('{"showFooterButtonScreenshot":'+this.checked+'}') checked /> Show Screenshot button<br>
+<input type="checkbox" onclick=changeConfigStr('{"showFooterButtonExportGraphml":'+this.checked+'}') checked /> Show Export As Graphml Button<br>
+
+
<input id="new_color" type="text" /> <button onclick=changeColor(document.getElementById("new_color").value) >Set Color </button> <br>
<button onclick=changeConfigStr('{"legendPos":"left"}') > Legend to Left </button> <br>
<button onclick=changeConfigStr('{"legendPos":"right"}') > Legend to Right </button> <br>
@@ -39,7 +43,8 @@
"edgeGroups": {"xxx": {"color": "black", "groupName": "xxx Group", "dashes": [1, 2]}, "notdashes": {"color": "black", "groupName": "not dashes Group"}},
"identifier": "symbol",
"nodeShadow": true,
- "edgeShadow": true
+ "edgeShadow": true,
+ "legendUrl": "https://exbio.wzw.tum.de/covex/assets/leg1.png"
}'
network='{
"nodes": [{"id": "TP53", "group": "0.5"}, {"id": "MYC", "group": "pugGroup"}, {"id": "Patient No. 5", "group": "patientgroup"}, {"label": "PTEN", "id": "PTEN", "group": 0.5, "value":"5"}],
--
GitLab