updated call and citation page

src/app/app-routing.module.ts

@@ -9,7 +9,8 @@ const routes: Routes = [
     { path: "idea", component: PagesComponent },
     { path: "standalone", component: StandaloneComponent },
     { path: "playground", component: PagesComponent },
-    { path: "call", component: CallLandingComponent },
+    { path: "cite", component: PagesComponent },
+    { path: "call", component: PagesComponent },
     {
         path: "doc", component: PagesComponent, children: [
             { path: 'home', component: PagesComponent },

src/app/app.module.ts

@@ -129,6 +129,7 @@ import { ExamplesComponent } from './components/playground/examples/examples.com
 import { CallLandingComponent } from './pages/call-landing/call-landing.component';
 import { ToolsBannerComponent } from './components/other/tools-banner/tools-banner.component';
 import { ToolPanelComponent } from './components/other/tools-banner/tool-panel/tool-panel.component';
+import { CiteComponent } from './pages/cite/cite.component';
 
 
 @NgModule({
@@ -200,6 +201,7 @@ import { ToolPanelComponent } from './components/other/tools-banner/tool-panel/t
         PrivacyPolicyComponent,
         ExamplesComponent,
         CallLandingComponent,
+        CiteComponent,
         ToolsBannerComponent,
         ToolPanelComponent,
     ],

src/app/components/footer/footer.component.html

@@ -29,11 +29,10 @@
         <li class="nav-item mb-2"><a href="https://www.cosy.bio/contact" target="_blank" class="nav-link p-0 text-muted">Impressum</a></li>
         <li class="nav-item mb-2"><a href="https://twitter.com/cosybio_uhh?lang=de" target="_blank" class="nav-link p-0 text-muted">Twitter</a></li>
         <!-- <li class="nav-item mb-2"><a href="/doc#contact_us" target="_blank" class="nav-link p-0 text-muted">Contact us</a></li> -->
+        <li class="nav-item mb-2"><a class="nav-link p-0 text-muted" href= "/cite">Cite us</a></li>
         <li class="nav-item mb-2"><a class="nav-link p-0 text-muted" href= "mailto:contact@drugst.one">Contact us</a></li>
       </ul>
     </div>
     
   </footer>
 </div>
-
-

src/app/components/header/header.component.ts

@@ -29,7 +29,8 @@ export class HeaderComponent implements OnInit {
                 command: () => this.tabChange(3)
             },
             { label: 'DOCUMENTATION', icon: 'pi pi-fw pi-book', routerLink: 'doc', command: () => this.tabChange(4) },
-            { label: 'COLLABORATION', icon: 'pi pi-fw pi-phone', routerLink: 'call', command: () => this.tabChange(5) }]
+            { label: 'CITE', icon: 'pi pi-fw pi-pencil', routerLink: 'cite', command: () => this.tabChange(5)},
+            { label: 'COLLABORATION', icon: 'pi pi-fw pi-phone', routerLink: 'call', command: () => this.tabChange(6) }]
         this.activeTab = this.tabsModel[0];
     }
 

src/app/components/other/tools-banner/tools-banner.component.ts

@@ -16,7 +16,7 @@ export class ToolsBannerComponent implements OnInit {
     public tool_list = [
         {label: "BiCoN", link: "https://exbio.wzw.tum.de/bicon/"},
         {label: "BioCypher", link: "https://biocypher.org/", icon:"assets/tools/biocypher.png"},
-        // {label: "DOMINO", link: "http://domino.cs.tau.ac.il/", icon: "assets/tools/domino.png"},
+        {label: "DOMINO", link: "http://domino.cs.tau.ac.il/", icon: "assets/tools/domino.png"},
         {label: "G-Browser", link: "https://exbio.wzw.tum.de/genome-browser/"},
         {label: "GraphFusion", link: "https://github.com/CarlosJesusGH/GraphFusion"},
         {label: "GraphSimViz", link: "https://graphsimviz.net/", icon: "assets/tools/graphsimviz.png"},

src/app/pages/call-landing/call-landing.component.html

@@ -4,7 +4,7 @@
   <div class="col-lg-12 align-self-end">
     <h1 class="display-5">Call for Collaboration</h1>
   </div>
-  <div class="row justify-content-center align-items-center">
+  <div class="row justify-content-center align-items-center mb-5">
     <div class="col-md-10 text-center">
       <img
         class="img-fluid call-image"
@@ -22,7 +22,9 @@
         and closely related drugs. The plugin is designed to seamlessly fit into
         any web application with just three lines of code.
         <br />
-        For more information, check out our preprint: ___
+        For more information, check out our preprint: <a target="_blank" href=" 	
+https://doi.org/10.48550/arXiv.2305.15453"> 	
+https://doi.org/10.48550/arXiv.2305.15453</a>
       </p>
       <p class="text-white-75 mb-5 blockquote">
         We are looking for collaborators to join the Drugst.One initiative. If
@@ -39,4 +41,10 @@
       >
     </div>
   </div>
+  <p-divider></p-divider>
+  <div >
+    <h1 class="display-5 d-flex justify-content-center">
+      Existing Collaborations</h1>
+    <app-tools-banner></app-tools-banner>
+  </div>
 </div>

src/app/pages/cite/cite.component.html

+<div
+        class="container px-4 px-lg-5 align-items-center justify-content-center text-center"
+>
+
+    <div class="col-lg-12">
+        <h1 class="display-5">How to cite</h1>
+    </div>
+
+
+    <div class="row justify-content-start align-items-start text-start">
+
+        <p>If you use Drugst.One in your work, please cite as follows:</p>
+        <div class="mb-3">
+            <label for="plain" class="form-label">Plain</label>
+            <pre id="plain"><textarea class="form-control" rows="3" disabled> {{plain}} </textarea></pre>
+        </div>
+        <div class="mb-3">
+            <label for="bibtex" class="form-label">BibTeX</label>
+            <pre id="bibtex"><textarea class="form-control" rows="14" disabled> {{bibtex}} </textarea></pre>
+        </div>
+        <div class="mb-3">
+            Preprint URL: <a href="
+https://doi.org/10.48550/arXiv.2305.15453" target="_blank">
+            https://doi.org/10.48550/arXiv.2305.15453 </a>
+        </div>
+    </div>
+
+</div>
+

src/app/pages/cite/cite.component.spec.ts

+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { CiteComponent } from './cite.component';
+
+describe('CiteComponent', () => {
+  let component: CiteComponent;
+  let fixture: ComponentFixture<CiteComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ CiteComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(CiteComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/pages/cite/cite.component.ts

+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-cite',
+  templateUrl: './cite.component.html',
+  styleUrls: ['./cite.component.scss']
+})
+export class CiteComponent implements OnInit {
+
+  constructor() { }
+
+  public plain = `Maier A, Hartung M, Baumbach J, et al. (2023) Drugst.One -- A plug-and-play solution for online systems medicine and network-based drug repurposing (Version 1). arXiv. https://doi.org/10.48550/ARXIV.2305.15453`
+
+  public bibtex = ` @ARTICLE{Maier2023-ag,
+   title         = "{Drugst.One} -- A plug-and-play solution for online systems
+                    medicine and network-based drug repurposing",
+   author        = "Maier, Andreas and Hartung, Michael and Abovsky, Mark and
+                    Adamowicz, Klaudia and Bader, Gary D and Baier, Sylvie and
+                    Blumenthal, David B and Chen, Jing and Elkjaer, Maria L and
+                    Garcia-Hernandez, Carlos and Hoffmann, Markus and Jurisica,
+                    Igor and Kotlyar, Max and Lazareva, Olga and Levi, Hagai and
+                    List, Markus and Lobentanzer, Sebastian and Loscalzo, Joseph
+                    and Malod-Dognin, Noel and Manz, Quirin and Matschinske,
+                    Julian and Oubounyt, Mhaned and Pico, Alexander R and
+                    Pillich, Rudolf T and Poschenrieder, Julian M and Pratt,
+                    Dexter and Pr{\\v z}ulj, Nata{\\v s}a and Sadegh, Sepideh and
+                    Saez-Rodriguez, Julio and Sakar, Suryadipto and Shaked,
+                    Gideon and Shamir, Ron and Trummer, Nico and Turhan, Ugur
+                    and Wang, Ruisheng and Zolotareva, Olga and Baumbach, Jan",
+   abstract      = "In recent decades, the development of new drugs has become
+                    increasingly expensive and inefficient, and the molecular
+                    mechanisms of most pharmaceuticals remain poorly understood.
+                    In response, computational systems and network medicine
+                    tools have emerged to identify potential drug repurposing
+                    candidates. However, these tools often require complex
+                    installation and lack intuitive visual network mining
+                    capabilities. To tackle these challenges, we introduce
+                    Drugst.One, a platform that assists specialized
+                    computational medicine tools in becoming user-friendly,
+                    web-based utilities for drug repurposing. With just three
+                    lines of code, Drugst.One turns any systems biology software
+                    into an interactive web tool for modeling and analyzing
+                    complex protein-drug-disease networks. Demonstrating its
+                    broad adaptability, Drugst.One has been successfully
+                    integrated with 21 computational systems medicine tools.
+                    Available at https://drugst.one, Drugst.One has significant
+                    potential for streamlining the drug discovery process,
+                    allowing researchers to focus on essential aspects of
+                    pharmaceutical treatment research.",
+   month         =  may,
+   year          =  2023,
+   archivePrefix = "arXiv",
+   primaryClass  = "q-bio.QM",
+   eprint        = "2305.15453",
+   doi           = "10.48550/arXiv.2305.15453",
+ }`
+
+  ngOnInit(): void {
+  }
+
+}

src/app/pages/pages.component.html

@@ -5,4 +5,5 @@
 <app-playground #playground *ngIf="currentTabId===3" [theme]="theme" [hidden]="currentTabId!==3" [api]="backendPath"></app-playground>
 <app-doc [hidden]="currentTabId!==4" [api]="backendPath" [version]="'v'+version" [cdn]="cdn"
          [host]="host"></app-doc>
-<app-call-landing #call *ngIf="currentTabId===5" [theme]="theme" [hidden]="currentTabId!==5" [api]="backendPath"></app-call-landing>
+<app-cite #cite *ngIf="currentTabId===5" [theme]="theme" [hidden]="currentTabId!==5" [api]="backendPath"></app-cite>
+<app-call-landing #call *ngIf="currentTabId===6" [theme]="theme" [hidden]="currentTabId!==6" [api]="backendPath"></app-call-landing>