Merge branch 'enhance' into 'master'

enhance

See merge request covid-19/frontend!10

src/app/pages/explorer-page/explorer-page.component.html

 <div class="content explorer">
 
-  <!--  <div class="modal" [class.is-active]="showModal">
-      <div class="modal-background" (click)="closeSummary()"></div>
-      <div class="modal-card">
-        <header class="modal-card-head">
-          <p class="modal-card-title">{{groupId}}</p>
-          <button class="delete" aria-label="close" (click)="closeSummary()"></button>
-        </header>
-        <section class="modal-card-body">
-          <h2>General Information</h2>
-          <ul>
-            <li><b>Protein Group:</b> {{proteinGroup}}</li>
-            <li><b>Gene Name(s):</b> <span *ngFor="let geneName of geneNames"> {{ geneName }}</span>
-            <li><b>Protein Name(s):</b> <span *ngFor="let proteinName of proteinNames"> {{ proteinName }}</span>
-            </li>
-            <li><b>Protein AC(s):</b>
-              <a href="https://www.uniprot.org/uniprot/{{proteinAC}}" target="_blank"
-                 *ngFor="let proteinAC of proteinACs">
-                {{ proteinAC }}<span><img class="inline" align="center" src="../assets/uniprot.png"></span>
-              </a>
-            </li>
-            <li><b>Number of Interactions:</b> {{numberOfInteractions}}</li>
-          </ul>
-
-          <h2>Summary</h2>
-          <figure class="image" (click)="openSummary('A4435')">
-            <img src="../assets/boxplot.png" alt="Boxplots">
-          </figure>
-        </section>
-
-        <footer class="modal-card-foot">
-          <button class="button is-danger" (click)="closeSummary()">Close</button>
-        </footer>
-      </div>
-    </div>-->
-
-
   <div class="content bar-left">
 
     <div class="card bar">
@@ -83,7 +47,7 @@
       <div class="card-content">
         <div class="content">
           <div class="field">
-            <div class="control is-loading">
+            <div class="control">
               <input class="input" type="text" placeholder="Search for Protein/Gene...">
             </div>
           </div>
@@ -113,7 +77,7 @@
         </div>
       </div>
       <footer class="card-footer">
-        <button class="card-footer-item button is-danger">Reset
+        <button (click)="reset($event);" class="card-footer-item button is-danger">Reset
         </button>
       </footer>
     </div>
@@ -150,13 +114,13 @@
     </div>
 
     <div class="card bar">
-      <header class="card-header">
-        <p class="card-header-title">
-          <span class="icon">
-        <i class="fas fa-filter" aria-hidden="true"></i>
-      </span> Summary
-        </p>
-      </header>
+<!--      <header class="card-header">-->
+<!--        <p class="card-header-title">-->
+<!--          <span class="icon">-->
+<!--        <i class="fas fa-filter" aria-hidden="true"></i>-->
+<!--      </span> Summary-->
+<!--        </p>-->
+<!--      </header>-->
       <div *ngIf="showDetails" class="card-content">
         <div class="content">
           <h2>Summary</h2>

src/app/pages/explorer-page/explorer-page.component.ts

@@ -94,6 +94,12 @@ export class ExplorerPageComponent implements OnInit, AfterViewInit {
     this.edges = data.edges;
   }
 
+   public reset(event) {
+    const checked = event.target.checked;
+    this.baitProteins.forEach(item => item.checked = checked);
+    this.filterNodes();
+  }
+
   public zoomToNode(id: string) {
     const coords = this.network.getPositions(id)[id];
     this.network.moveTo({