diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 2eb67893e0029b37a7baf377284d16613cf608b9..57b4a7989b31d122be25961d140fa2ceb2e632f2 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -34,7 +34,7 @@ import {
faRulerVertical, faDna, faMicroscope, faBook, faPause, faTrash, faSpinner, faExclamationTriangle, faPlus,
faExpand, faInfo, faRocket, faAngleDown, faSearch, faFastForward, faExternalLinkAlt, faTasks, faFilter,
faMinus, faUpload, faAngleDoubleDown, faSync, faBroom, faAngleDoubleUp, faChild, faHeadSideMask, faBiohazard,
- faBullseye, faSeedling, faSyncAlt, faCompress, faKey, faInfoCircle, faWrench
+ faBullseye, faSeedling, faSyncAlt, faCompress, faKey, faInfoCircle, faWrench, faProjectDiagram
} from '@fortawesome/free-solid-svg-icons';
import { TooltipModule } from 'primeng/tooltip';
import { NetworkMenuComponent } from './components/network/network-menu/network-menu.component';
@@ -47,6 +47,8 @@ import { NetworkControlComponent } from './components/network-control/network-co
import { CenterViewComponent } from './components/network/network-menu/center-view/center-view.component';
import { CenterViewInverseComponent } from './components/network/network-menu-left/center-view-inverse/center-view-inverse.component';
import { LicenseAgreementComponent } from './components/license-agreement/license-agreement.component';
+import { QuickDrugTargetComponent } from './components/quick-drug-target/quick-drug-target.component';
+import { QuickDrugComponent } from './components/quick-drug/quick-drug.component';
@NgModule({
@@ -75,6 +77,8 @@ import { LicenseAgreementComponent } from './components/license-agreement/licens
CenterViewComponent,
CenterViewInverseComponent,
LicenseAgreementComponent,
+ QuickDrugTargetComponent,
+ QuickDrugComponent,
],
imports: [
BrowserModule,
@@ -100,7 +104,7 @@ export class AppModule {
faSpinner, faExclamationTriangle, faPlus, faExpand, faInfo, faRocket, faAngleDown, faSearch,
faFastForward, faExternalLinkAlt, faTasks, faFilter, faMinus, faUpload, faAngleDoubleDown,
faSync, faBroom, faAngleDoubleUp, faChild, faHeadSideMask, faBiohazard, faBullseye, faSeedling,
- faSyncAlt, faExpand, faCompress, faKey, faInfoCircle,faWrench);
+ faSyncAlt, faExpand, faCompress, faKey, faInfoCircle, faWrench, faProjectDiagram);
const NetworkExpander = createCustomElement(ExplorerPageComponent, { injector });
// Register the custom element with the browser.
customElements.define('drugst-one', NetworkExpander);
diff --git a/src/app/components/analysis-panel/analysis-panel.component.ts b/src/app/components/analysis-panel/analysis-panel.component.ts
index 6112dc2cf5567f4f3f4113adee749496ca7b2b53..59ba4596aa84ecd3f5af101b00bfce6894bf2e2e 100644
--- a/src/app/components/analysis-panel/analysis-panel.component.ts
+++ b/src/app/components/analysis-panel/analysis-panel.component.ts
@@ -73,7 +73,6 @@ export class AnalysisPanelComponent implements OnInit, OnChanges, AfterViewInit
}
@Output() tokenChange = new EventEmitter<string | null>();
@Output() showDetailsChange = new EventEmitter<Wrapper>();
- @Output() setInputNetwork = new EventEmitter<any>();
@Output() visibleItems = new EventEmitter<[any[], [Node[], Tissue], NodeInteraction[]]>();
public task: Task | null = null;
public result: any = null;
@@ -188,7 +187,7 @@ export class AnalysisPanelComponent implements OnInit, OnChanges, AfterViewInit
// Create
const { nodes, edges } = this.createNetwork(this.result);
- this.setInputNetwork.emit({ nodes: nodes, edges: edges });
+ this.analysis.inputNetwork = { nodes: nodes, edges: edges };
this.nodeData.nodes = new vis.DataSet(nodes);
this.nodeData.edges = new vis.DataSet(edges);
const container = this.networkHandler.activeNetwork.networkEl.nativeElement;
@@ -365,7 +364,7 @@ export class AnalysisPanelComponent implements OnInit, OnChanges, AfterViewInit
this.analysis.switchSelection('main');
this.token = null;
this.tokenChange.emit(this.token);
- this.setInputNetwork.emit(undefined);
+ this.analysis.inputNetwork = {};
this.emitVisibleItems(false);
}
diff --git a/src/app/components/quick-drug-target/quick-drug-target.component.html b/src/app/components/quick-drug-target/quick-drug-target.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..78e18f4e83819ccd30b39dbe8b9cb9028e048ca0
--- /dev/null
+++ b/src/app/components/quick-drug-target/quick-drug-target.component.html
@@ -0,0 +1,102 @@
+<div class="card bar-large">
+ <header
+ class="card-header"
+ [ngClass]="{ 'b-text-small': drugstoneConfig.smallStyle }"
+ >
+ <p class="card-header-title">
+ <span class="icon">
+ <i class="fas fa-project-diagram" aria-hidden="true"></i>
+ </span>
+ Connect Nodes
+ </p>
+ <a
+ (click)="collapseQuickConnect = !collapseQuickConnect"
+ data-action="collapse"
+ class="card-header-icon is-hidden-fullscreen"
+ aria-label="more options"
+ >
+ <span *ngIf="collapseQuickConnect" class="icon">
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
+ </span>
+ <span *ngIf="!collapseQuickConnect" class="icon">
+ <i class="fas fa-angle-left" aria-hidden="true"></i>
+ </span>
+ </a>
+ </header>
+ <div *ngIf="collapseQuickConnect">
+ <div
+ class="card-content quick-find"
+ [ngClass]="{ small: drugstoneConfig.smallStyle }"
+ >
+ <div class="field">
+ <div class="control">
+ <div style="display: flex; justify-content: center">
+ <button
+ (click)="analysis.startQuickAnalysis(false, 'connect')"
+ [disabled]="analysis.isLaunchingQuick()"
+ [ngClass]="{
+ 'text-small': drugstoneConfig.smallStyle
+ }"
+ class="button is-rounded has-tooltip quick-start-btn is-fullwidth is-primary"
+ pTooltip="Connect all proteins in the network."
+ [tooltipStyleClass]="'drgstn drgstn-tooltip drgstn-tooltip-top'"
+ tooltipPosition="top"
+ >
+ <span class="icon quick-icon">
+ <span *ngIf="!analysis.isLaunchingQuick()">
+ <i class="fa fa-capsules"></i>
+ </span>
+ <span *ngIf="analysis.isLaunchingQuick()">
+ <i class="fa fa-spin fa-spinner"></i>
+ </span>
+ </span>
+ <span
+ [ngClass]="{
+ 'text-normal': drugstoneConfig.smallStyle
+ }"
+ >
+ Connect All
+ </span>
+ </button>
+ </div>
+ <div style="display: flex; justify-content: center; width: 100%">
+ <div class="divisor-rapid">— or —</div>
+ </div>
+ <div style="display: flex; justify-content: center">
+ <button
+ (click)="analysis.startQuickAnalysis(true, 'connectSelected')"
+ [disabled]="
+ analysis.getCount() === 0 || analysis.isLaunchingQuick()
+ "
+ [ngClass]="{
+ 'text-small': drugstoneConfig.smallStyle
+ }"
+ class="button is-rounded quick-start-btn drugs-btn is-fullwidth is-primary"
+ pTooltip="Connect the selected nodes."
+ [tooltipStyleClass]="
+ 'drgstn drgstn-tooltip drgstn-tooltip-top'
+ "
+ tooltipPosition="top"
+ >
+ <span class="icon quick-icon">
+ <span *ngIf="!analysis.isLaunchingQuick()">
+ <i class="fa fa-capsules"></i>
+ </span>
+ <span *ngIf="analysis.isLaunchingQuick()">
+ <i class="fa fa-spin fa-spinner"></i>
+ </span>
+ </span>
+ <span
+ [ngClass]="{
+ 'text-normal': drugstoneConfig.smallStyle
+ }"
+ >
+ Connect Selected
+ </span>
+ </button>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
diff --git a/src/app/components/quick-drug-target/quick-drug-target.component.scss b/src/app/components/quick-drug-target/quick-drug-target.component.scss
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
diff --git a/src/app/components/quick-drug-target/quick-drug-target.component.spec.ts b/src/app/components/quick-drug-target/quick-drug-target.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..24116c14a14630c9bb5d1c923e0a1aa48309e40d
--- /dev/null
+++ b/src/app/components/quick-drug-target/quick-drug-target.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { QuickDrugTargetComponent } from './quick-drug-target.component';
+
+describe('QuickDrugTargetComponent', () => {
+ let component: QuickDrugTargetComponent;
+ let fixture: ComponentFixture<QuickDrugTargetComponent>;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ declarations: [ QuickDrugTargetComponent ]
+ })
+ .compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(QuickDrugTargetComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/components/quick-drug-target/quick-drug-target.component.ts b/src/app/components/quick-drug-target/quick-drug-target.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..a0f65ce2acf43d1078398ffc1fd015d9d372b2e4
--- /dev/null
+++ b/src/app/components/quick-drug-target/quick-drug-target.component.ts
@@ -0,0 +1,21 @@
+import { Component, OnInit } from '@angular/core';
+import { AnalysisService } from 'src/app/services/analysis/analysis.service';
+import { DrugstoneConfigService } from 'src/app/services/drugstone-config/drugstone-config.service';
+
+@Component({
+ selector: 'app-quick-drug-target',
+ templateUrl: './quick-drug-target.component.html',
+ styleUrls: ['./quick-drug-target.component.scss']
+})
+export class QuickDrugTargetComponent implements OnInit {
+
+ constructor(
+ public drugstoneConfig: DrugstoneConfigService,
+ public analysis: AnalysisService) { }
+
+ public collapseQuickConnect = false;
+
+ ngOnInit(): void {
+ }
+
+}
diff --git a/src/app/components/quick-drug/quick-drug.component.html b/src/app/components/quick-drug/quick-drug.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..356077c03b3665c0712a10d09a0f258e3ffcec2b
--- /dev/null
+++ b/src/app/components/quick-drug/quick-drug.component.html
@@ -0,0 +1,104 @@
+<div class="card bar-large">
+ <header
+ class="card-header"
+ [ngClass]="{ 'b-text-small': drugstoneConfig.smallStyle }"
+ >
+ <p class="card-header-title">
+ <span class="icon">
+ <i class="fas fa-flask" aria-hidden="true"></i>
+ </span>
+ Simple Analysis
+ </p>
+ <a
+ (click)="collapseAnalysisQuick = !collapseAnalysisQuick"
+ data-action="collapse"
+ class="card-header-icon is-hidden-fullscreen"
+ aria-label="more options"
+ >
+ <span *ngIf="collapseAnalysisQuick" class="icon">
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
+ </span>
+ <span *ngIf="!collapseAnalysisQuick" class="icon">
+ <i class="fas fa-angle-left" aria-hidden="true"></i>
+ </span>
+ </a>
+ </header>
+ <div *ngIf="collapseAnalysisQuick">
+ <div
+ class="card-content quick-find"
+ [ngClass]="{ small: drugstoneConfig.smallStyle }"
+ >
+ <div class="field">
+ <div class="control">
+ <div style="display: flex; justify-content: center">
+ <button
+ (click)="analysis.startQuickAnalysis(true, 'super')"
+ [disabled]="analysis.isLaunchingQuick()"
+ [ngClass]="{
+ 'text-small': drugstoneConfig.smallStyle
+ }"
+ class="button is-primary is-rounded has-tooltip quick-start-btn is-fullwidth"
+ pTooltip="Find drugs for all proteins."
+ [tooltipStyleClass]="'drgstn drgstn-tooltip drgstn-tooltip-top'"
+ tooltipPosition="top"
+ >
+ <span class="icon quick-icon">
+ <span *ngIf="!analysis.isLaunchingQuick()">
+ <i class="fa fa-capsules"></i>
+ </span>
+ <span *ngIf="analysis.isLaunchingQuick()">
+ <i class="fa fa-spin fa-spinner"></i>
+ </span>
+ </span>
+ <span
+ [ngClass]="{
+ 'text-normal': drugstoneConfig.smallStyle
+ }"
+ >
+ Quick Start
+ </span>
+ </button>
+ </div>
+ <div
+ style="display: flex; justify-content: center"
+ class="is-fullwidth"
+ >
+ <div class="divisor-rapid">— or —</div>
+ </div>
+
+ <div style="display: flex; justify-content: center">
+ <button
+ (click)="analysis.startQuickAnalysis(false, 'quick')"
+ [disabled]="
+ analysis.getCount() === 0 || analysis.isLaunchingQuick()
+ "
+ [ngClass]="{
+ 'text-small': drugstoneConfig.smallStyle
+ }"
+ class="button is-primary is-rounded quick-start-btn drugs-btn is-fullwidth"
+ pTooltip="Find drugs for the selected proteins."
+ [tooltipStyleClass]="'drgstn drgstn-tooltip drgstn-tooltip-top'"
+ tooltipPosition="top"
+ >
+ <span class="icon quick-icon">
+ <span *ngIf="!analysis.isLaunchingQuick()">
+ <i class="fa fa-capsules"></i>
+ </span>
+ <span *ngIf="analysis.isLaunchingQuick()">
+ <i class="fa fa-spin fa-spinner"></i>
+ </span>
+ </span>
+ <span
+ [ngClass]="{
+ 'text-normal': drugstoneConfig.smallStyle
+ }"
+ >
+ Seed Analysis
+ </span>
+ </button>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
diff --git a/src/app/components/quick-drug/quick-drug.component.scss b/src/app/components/quick-drug/quick-drug.component.scss
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
diff --git a/src/app/components/quick-drug/quick-drug.component.spec.ts b/src/app/components/quick-drug/quick-drug.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..3729fce8a332f3d585b73c22192ccbd882d7a351
--- /dev/null
+++ b/src/app/components/quick-drug/quick-drug.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { QuickDrugComponent } from './quick-drug.component';
+
+describe('QuickDrugComponent', () => {
+ let component: QuickDrugComponent;
+ let fixture: ComponentFixture<QuickDrugComponent>;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ declarations: [ QuickDrugComponent ]
+ })
+ .compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(QuickDrugComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/components/quick-drug/quick-drug.component.ts b/src/app/components/quick-drug/quick-drug.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..185e0e2184e1f60a2c046b7b065e7a2caaa1b06e
--- /dev/null
+++ b/src/app/components/quick-drug/quick-drug.component.ts
@@ -0,0 +1,20 @@
+import { Component, OnInit } from '@angular/core';
+import { AnalysisService } from 'src/app/services/analysis/analysis.service';
+import { DrugstoneConfigService } from 'src/app/services/drugstone-config/drugstone-config.service';
+
+@Component({
+ selector: 'app-quick-drug',
+ templateUrl: './quick-drug.component.html',
+ styleUrls: ['./quick-drug.component.scss']
+})
+export class QuickDrugComponent implements OnInit {
+
+ constructor(
+ public drugstoneConfig: DrugstoneConfigService,
+ public analysis: AnalysisService) { }
+
+ public collapseAnalysisQuick = false;
+
+ ngOnInit(): void {
+ }
+}
diff --git a/src/app/config.ts b/src/app/config.ts
index c575eae9d6f553923feb79dc33bf681d8255ddb8..70810c6959ff2da7df96c59c8e8044099ae4643f 100644
--- a/src/app/config.ts
+++ b/src/app/config.ts
@@ -57,6 +57,7 @@ export interface IConfig {
showNetworkMenuButtonExportGraphml: boolean;
showNetworkMenuButtonAdjacentDrugs: boolean;
showNetworkMenuButtonCenter: boolean;
+ showConnectNodes: boolean;
networkMenuButtonAdjacentDrugsLabel: string;
showNetworkMenuButtonAdjacentDisordersProteins: boolean;
networkMenuButtonAdjacentDisordersProteinsLabel: string;
@@ -111,6 +112,7 @@ export const defaultConfig: IConfig = {
showNetworkMenuButtonExportGraphml: true,
showNetworkMenuButtonAdjacentDrugs: true,
showNetworkMenuButtonCenter: true,
+ showConnectNodes: true,
networkMenuButtonAdjacentDrugsLabel: 'Drugs',
showNetworkMenuButtonAdjacentDisordersProteins: true,
networkMenuButtonAdjacentDisordersProteinsLabel: 'Disorders (protein)',
diff --git a/src/app/dialogs/launch-analysis/launch-analysis.component.ts b/src/app/dialogs/launch-analysis/launch-analysis.component.ts
index 2810fcc700d6588e160dd9822d5472c90c9808ca..329a54854ab632c9dc143b18fd91f4724672c3fa 100644
--- a/src/app/dialogs/launch-analysis/launch-analysis.component.ts
+++ b/src/app/dialogs/launch-analysis/launch-analysis.component.ts
@@ -20,8 +20,6 @@ export class LaunchAnalysisComponent implements OnInit, OnChanges {
public show = false;
@Input()
public target: 'drug' | 'drug-target';
- @Input()
- public inputNetwork: { nodes: any, edges: any };
@Output()
public showChange = new EventEmitter<boolean>();
@Output()
@@ -116,7 +114,7 @@ export class LaunchAnalysisComponent implements OnInit, OnChanges {
const parameters: any = {
seeds: seedsFiltered,
config: this.drugstoneConfig.config,
- input_network: this.inputNetwork
+ input_network: this.analysis.inputNetwork
};
parameters.ppi_dataset = this.drugstoneConfig.config.interactionProteinProtein;
@@ -124,7 +122,8 @@ export class LaunchAnalysisComponent implements OnInit, OnChanges {
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
- this.inputNetwork.nodes.forEach(node => {
+ // @ts-ignore
+ this.analysis.inputNetwork.nodes.forEach(node => {
delete node.interactions
});
diff --git a/src/app/interfaces.ts b/src/app/interfaces.ts
index 160489662b791f090b4fea0d94981e124d3e6f21..494bc044e80470f52c79926e37f0b98269af3e89 100644
--- a/src/app/interfaces.ts
+++ b/src/app/interfaces.ts
@@ -240,7 +240,7 @@ export type AlgorithmType =
| 'degree'
| 'proximity'
| 'betweenness';
-export type QuickAlgorithmType = 'quick' | 'super';
+export type QuickAlgorithmType = 'quick' | 'super' | 'connect' | 'connectSelected';
export interface Algorithm {
slug: AlgorithmType | QuickAlgorithmType;
diff --git a/src/app/pages/explorer-page/explorer-page.component.html b/src/app/pages/explorer-page/explorer-page.component.html
index 2bc4959dff1a1ec56f80ee84da98dcb863486b17..d40d5985d3ca8c75f08702963fc3150fb6849612 100644
--- a/src/app/pages/explorer-page/explorer-page.component.html
+++ b/src/app/pages/explorer-page/explorer-page.component.html
@@ -6,7 +6,6 @@
<app-launch-analysis
[(show)]="showAnalysisDialog"
[target]="analysisDialogTarget"
- [inputNetwork]="{ nodes: proteins, edges: edges }"
(taskEvent)="emitTaskEvent($event)"
>
</app-launch-analysis>
@@ -196,189 +195,9 @@
</div>
</div>
- <div
- *ngIf="drugstoneConfig.config.showSimpleAnalysis"
- class="card bar-large"
- >
- <header
- class="card-header"
- [ngClass]="{ 'b-text-small': drugstoneConfig.smallStyle }"
- >
- <p class="card-header-title">
- <span class="icon">
- <i class="fas fa-flask" aria-hidden="true"></i>
- </span>
- Simple Analysis
- </p>
- <a
- (click)="collapseAnalysisQuick = !collapseAnalysisQuick"
- data-action="collapse"
- class="card-header-icon is-hidden-fullscreen"
- aria-label="more options"
- >
- <span *ngIf="collapseAnalysisQuick" class="icon">
- <i class="fas fa-angle-down" aria-hidden="true"></i>
- </span>
- <span *ngIf="!collapseAnalysisQuick" class="icon">
- <i class="fas fa-angle-left" aria-hidden="true"></i>
- </span>
- </a>
- </header>
- <div *ngIf="collapseAnalysisQuick">
- <div
- class="card-content quick-find"
- [ngClass]="{ small: drugstoneConfig.smallStyle }"
- >
- <div class="field">
- <div class="control">
- <div
- class="tile notification quick-start warning"
- [ngClass]="{ small: drugstoneConfig.smallStyle }"
- >
- <div class="align-vmiddle">
- <div
- [ngClass]="{
- digit: !drugstoneConfig.smallStyle,
- 'digit-small': drugstoneConfig.smallStyle
- }"
- >
- <i class="fa fa-fast-forward"></i>
- </div>
- <div
- style="
- display: flex;
- justify-content: center;
- width: 100%;
- "
- >
- <button
- (click)="analysis.startQuickAnalysis(true, null)"
- [disabled]="analysis.isLaunchingQuick()"
- class="button is-white is-rounded has-tooltip quick-start-btn"
- pTooltip="Find drugs for all proteins."
- [tooltipStyleClass]="
- 'drgstn drgstn-tooltip drgstn-tooltip-top'
- "
- tooltipPosition="top"
- >
- <span class="icon quick-icon">
- <span *ngIf="!analysis.isLaunchingQuick()">
- <i class="fa fa-capsules"></i>
- </span>
- <span *ngIf="analysis.isLaunchingQuick()">
- <i class="fa fa-spin fa-spinner"></i>
- </span>
- </span>
- <span
- [ngClass]="{
- 'text-normal': drugstoneConfig.smallStyle
- }"
- >
- Quick Start
- </span>
- </button>
- </div>
- </div>
- </div>
- <div class="divisor-rapid">— or —</div>
- <div
- class="tile notification quick-start info"
- [ngClass]="{ small: drugstoneConfig.smallStyle }"
- >
- <div class="align-vmiddle">
- <div
- [ngClass]="{
- digit: !drugstoneConfig.smallStyle,
- 'digit-small': drugstoneConfig.smallStyle
- }"
- *ngIf="analysis.getCount() == 0"
- >
- 1
- </div>
- <div
- [ngClass]="{
- digit: !drugstoneConfig.smallStyle,
- 'digit-small': drugstoneConfig.smallStyle
- }"
- *ngIf="analysis.getCount() > 0"
- >
- <i class="fa fa-check"></i>
- </div>
- <div
- style="
- display: flex;
- justify-content: center;
- width: 100%;
- "
- >
- <div
- [ngClass]="{
- 'text-normal': drugstoneConfig.smallStyle
- }"
- class="quick-start-btn"
- >
- Select Proteins
- </div>
- </div>
- </div>
- </div>
- <div
- class="tile notification quick-start info"
- [ngClass]="{ small: drugstoneConfig.smallStyle }"
- >
- <div class="align-vmiddle">
- <div
- [ngClass]="{
- digit: !drugstoneConfig.smallStyle,
- 'digit-small': drugstoneConfig.smallStyle
- }"
- >
- 2
- </div>
- <div
- style="
- display: flex;
- justify-content: center;
- width: 100%;
- "
- >
- <button
- (click)="analysis.startQuickAnalysis(false, null)"
- [disabled]="
- analysis.getCount() === 0 ||
- analysis.isLaunchingQuick()
- "
- class="button is-white is-rounded quick-start-btn drugs-btn"
- pTooltip="Find drugs for the selected proteins."
- [tooltipStyleClass]="
- 'drgstn drgstn-tooltip drgstn-tooltip-top'
- "
- tooltipPosition="top"
- >
- <span class="icon quick-icon">
- <span *ngIf="!analysis.isLaunchingQuick()">
- <i class="fa fa-capsules"></i>
- </span>
- <span *ngIf="analysis.isLaunchingQuick()">
- <i class="fa fa-spin fa-spinner"></i>
- </span>
- </span>
- <span
- [ngClass]="{
- 'text-normal': drugstoneConfig.smallStyle
- }"
- >
- {{ drugstoneConfig.config.taskDrugName }}
- </span>
- </button>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
+ <app-quick-drug-target *ngIf="drugstoneConfig.config.showConnectNodes"></app-quick-drug-target>
+
+ <app-quick-drug *ngIf="drugstoneConfig.config.showSimpleAnalysis"></app-quick-drug>
<div
*ngIf="drugstoneConfig.config.showAdvAnalysis"
diff --git a/src/app/pages/explorer-page/explorer-page.component.ts b/src/app/pages/explorer-page/explorer-page.component.ts
index 34bcd013e7d5bf455d6644b505ad3d12dbecfea3..79f3f692127b00ff2ffecde0e8bc372b013c24d9 100644
--- a/src/app/pages/explorer-page/explorer-page.component.ts
+++ b/src/app/pages/explorer-page/explorer-page.component.ts
@@ -93,7 +93,6 @@ export class ExplorerPageComponent implements OnInit, AfterViewInit {
public showDetails = false;
- public collapseAnalysisQuick = true;
public collapseAnalysis = true;
public collapseDetails = true;
public collapseTask = true;
@@ -119,8 +118,6 @@ export class ExplorerPageComponent implements OnInit, AfterViewInit {
public selectedAnalysisToken: string | null = null;
- @Input() inputNetwork = {};
-
@Input() set taskId(token: string | null) {
if (token == null || token.length === 0)
this.selectedAnalysisToken = null
@@ -391,7 +388,7 @@ export class ExplorerPageComponent implements OnInit, AfterViewInit {
});
// remove edges without endpoints
network.edges = edges;
- this.inputNetwork = network;
+ this.analysis.inputNetwork = network;
this.proteins = network.nodes;
this.edges = network.edges;
}
@@ -546,9 +543,9 @@ export class ExplorerPageComponent implements OnInit, AfterViewInit {
setInputNetwork(network: any) {
if (network == null)
- this.inputNetwork = { nodes: this.proteins, edges: this.edges }
+ this.analysis.inputNetwork = { nodes: this.proteins, edges: this.edges }
else
- this.inputNetwork = network;
+ this.analysis.inputNetwork = network;
}
}
diff --git a/src/app/services/analysis/analysis.service.ts b/src/app/services/analysis/analysis.service.ts
index f85cb23f1f32eface3b6807ecd97d86cb86280e5..da4e07598cfa6c1da4c171300130e6b5fe09e45f 100644
--- a/src/app/services/analysis/analysis.service.ts
+++ b/src/app/services/analysis/analysis.service.ts
@@ -1,10 +1,12 @@
-import {Wrapper, Task, getWrapperFromNode, Node, Dataset, Tissue, Algorithm} from '../../interfaces';
+import {Wrapper, Task, getWrapperFromNode, Node, Dataset, Tissue, Algorithm, QuickAlgorithmType} from '../../interfaces';
import {Subject} from 'rxjs';
import {HttpClient} from '@angular/common/http';
import {environment} from '../../../environments/environment';
import {toast} from 'bulma-toast';
import {Injectable} from '@angular/core';
import {NetexControllerService} from '../netex-controller/netex-controller.service';
+import { DrugstoneConfigService } from '../drugstone-config/drugstone-config.service';
+import { NetworkHandlerService } from '../network-handler/network-handler.service';
export const algorithmNames = {
trustrank: 'TrustRank',
@@ -16,6 +18,8 @@ export const algorithmNames = {
betweenness: 'Betweenness Centrality',
quick: 'Simple',
super: 'Quick-Start',
+ connect: 'Connect All',
+ connectSelected: 'Connect Selected',
};
export const TRUSTRANK: Algorithm = {slug: 'trustrank', name: algorithmNames.trustrank};
@@ -35,6 +39,8 @@ export class AnalysisService {
private selection = 'main';
+ public inputNetwork = {};
+
private selectedItems = new Map<string, Wrapper>();
private selectListSubject = new Subject<{ items: Wrapper[], selected: boolean | null }>();
@@ -53,7 +59,11 @@ export class AnalysisService {
private tissues: Tissue[] = [];
- constructor(private http: HttpClient, public netex: NetexControllerService) {
+ constructor(
+ private http: HttpClient,
+ public netex: NetexControllerService,
+ public drugstoneConfig: DrugstoneConfigService,
+ public networkHandler: NetworkHandlerService) {
const tokens = localStorage.getItem(this.tokensCookieKey);
const finishedTokens = localStorage.getItem(this.tokensFinishedCookieKey);
@@ -192,7 +202,7 @@ export class AnalysisService {
});
}
- async startQuickAnalysis(isSuper: boolean, dataset: Dataset) {
+ async startQuickAnalysis(isSuper: boolean, algorithm: QuickAlgorithmType) {
if (!this.canLaunchTask()) {
toast({
message: `You can only run ${MAX_TASKS} tasks at once. Please wait for one of them to finish or delete it from the task list.`,
@@ -206,36 +216,48 @@ export class AnalysisService {
return;
}
- if (dataset == null) {
- toast({
- message: `Passed dataset is null. This feature might be still under development.`,
- duration: 5000,
- dismissible: true,
- pauseOnHover: true,
- type: 'is-danger',
- position: 'top-center',
- animate: {in: 'fadeIn', out: 'fadeOut'}
- });
- return;
- }
-
this.launchingQuick = true;
+ const seeds = [];
+ if (isSuper) {
+ // get ids for selected nodes
+ this.getSelection().forEach((item: Wrapper) => {
+ if (item.data.drugstoneId != null) {
+ seeds.push(item.data.drugstoneId);
+ }
+ })
+ } else {
+ // get all node ids
+ this.networkHandler.activeNetwork.currentViewProteins.forEach((item: Node) => {
+ if (item.drugstoneId != null) {
+ seeds.push(item.drugstoneId);
+ }
+ })
+ }
+ const target = ['connect', 'connectSelected'].includes(algorithm) ? 'drug-target' : 'drug'
+ console.log(target)
+ const parameters: any = {
+ seeds: seeds,
+ config: this.drugstoneConfig.config,
+ input_network: this.inputNetwork,
+ ppi_dataset: this.drugstoneConfig.config.interactionProteinProtein,
+ pdi_dataset: this.drugstoneConfig.config.interactionDrugProtein,
+ target: target,
+ num_trees: 5,
+ tolerance: 10,
+ };
+
const resp = await this.http.post<any>(`${environment.backend}task/`, {
- algorithm: isSuper ? 'super' : 'quick',
- target: 'drug',
- parameters: {
- strain_or_drugs: dataset.id,
- bait_datasets: dataset.data,
- seeds: isSuper ? [] : this.getSelection().map((i) => i.id),
- },
+ algorithm: algorithm,
+ target: target,
+ parameters: parameters,
}).toPromise();
this.tokens.push(resp.token);
localStorage.setItem(this.tokensCookieKey, JSON.stringify(this.tokens));
this.startWatching();
toast({
- message: 'Quick analysis started. This may take a while.' +
+ message: 'Quick analysis started.' +
' Once the computation finished you can view the results in the task list to the right.',
duration: 10000,
dismissible: true,
diff --git a/src/index.html b/src/index.html
index 119e369954f7916ccc35017232df0e40af3cb840..8c682413579d3467855e7916f748fa6cb8800346 100644
--- a/src/index.html
+++ b/src/index.html
@@ -14,7 +14,8 @@
<input type="checkbox" onclick=changeConfigStr('{"showQuery":'+this.checked+'}') /> Show query<br>
<!-- <input type="checkbox" onclick=changeConfigStr('{"showSidebar":'+this.checked+'}') checked /> Show sidebar<br> -->
<input type="checkbox" onclick=changeConfigStr('{"showItemSelector":'+this.checked+'}') checked /> Show ItemSelector<br>
-<input type="checkbox" onclick=changeConfigStr('{"showSimpleAnalysis":'+this.checked+'}') /> Show SimpleAnalysis<br>
+<input type="checkbox" onclick=changeConfigStr('{"showConnectNodes":'+this.checked+'}') /> Show Connect Nodes<br>
+<input type="checkbox" onclick=changeConfigStr('{"showSimpleAnalysis":'+this.checked+'}') /> Show Simple Analysis<br>
<input type="checkbox" onclick=changeConfigStr('{"showAdvAnalysis":'+this.checked+'}') checked /> Show Advanced Analysis<br>
<input type="checkbox" onclick=changeConfigStr('{"showTasks":'+this.checked+'}') checked /> Show Tasks<br>
<input type="checkbox" onclick=changeConfigStr('{"showSelection":'+this.checked+'}') checked /> Show Selection<br>
diff --git a/src/stylesheets/styles.scss b/src/stylesheets/styles.scss
index 4a22560835561397061ea481811866004dbe1844..09f37cf54c17b2d173c2ee097104fe51d71dd63e 100644
--- a/src/stylesheets/styles.scss
+++ b/src/stylesheets/styles.scss
@@ -210,4 +210,8 @@
}
}
}
+
+ button.is-secondary, button.is-secondary:hover {
+ background-color: var(--drgstn-secondary) !important;
+ }
}