From fd0adb76826262bc4ca574e16e6cad4e71e39976 Mon Sep 17 00:00:00 2001
From: "k.triantafyllou" <k.triantafyllou@d315682c-612b-4755-9ff5-7f18f6832af3>
Date: Wed, 19 Jun 2019 08:14:38 +0000
Subject: [PATCH] [Admin|Trunk]: Statistics: toggle value on change follows
 element value.

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-admin-portal/trunk@56112 d315682c-612b-4755-9ff5-7f18f6832af3
---
 src/app/pages/stats/stats.component.html | 153 +++++++----------------
 1 file changed, 48 insertions(+), 105 deletions(-)

diff --git a/src/app/pages/stats/stats.component.html b/src/app/pages/stats/stats.component.html
index 50a557d..e7dfc9e 100644
--- a/src/app/pages/stats/stats.component.html
+++ b/src/app/pages/stats/stats.component.html
@@ -75,14 +75,16 @@
                                                                                 <th>In Graph Analysis</th>
                                                                                 <th class="uk-text-center">
                                                                                     <mat-slide-toggle [checked]="statisticsDisplay.entities[entity].numbers.map['total'].showInMonitor"
-                                                                                                      (change)="toggleShowInMonitor(entity,'numbers','total')"></mat-slide-toggle>
+                                                                                                      (change)="$event.checked = statisticsDisplay.entities[entity].numbers.map['total'].showInMonitor;
+                                                                                                      toggleShowInMonitor(entity,'numbers','total')"></mat-slide-toggle>
                                                                                 </th>
                                                                             </tr>
                                                                             <tr>
                                                                                 <th>In Overview</th>
                                                                                 <th class="uk-text-center">
                                                                                     <mat-slide-toggle [checked]="statisticsDisplay.entities[entity].numbers.map['total'].showInDashboard"
-                                                                                                      (change)="toggleShowInDashboard(entity,'numbers','total')"></mat-slide-toggle>
+                                                                                                      (change)="$event.checked = statisticsDisplay.entities[entity].numbers.map['total'].showInDashboard;
+                                                                                                      toggleShowInDashboard(entity,'numbers','total')"></mat-slide-toggle>
                                                                                 </th>
                                                                             </tr>
                                                                             </tbody>
@@ -111,14 +113,16 @@
                                                                                 <th>In Graph Analysis</th>
                                                                                 <th class="uk-text-center">
                                                                                     <mat-slide-toggle [checked]="statisticsDisplay.entities[entity].numbers.map['project'].showInMonitor"
-                                                                                                      (change)="toggleShowInMonitor(entity,'numbers','project')"></mat-slide-toggle>
+                                                                                                      (change)="$event.checked = statisticsDisplay.entities[entity].numbers.map['project'].showInMonitor;
+                                                                                                      toggleShowInMonitor(entity,'numbers','project')"></mat-slide-toggle>
                                                                                 </th>
                                                                             </tr>
                                                                             <tr>
                                                                                 <th>In Overview</th>
                                                                                 <th class="uk-text-center">
                                                                                     <mat-slide-toggle [checked]="statisticsDisplay.entities[entity].numbers.map['project'].showInDashboard"
-                                                                                                      (change)="toggleShowInDashboard(entity,'numbers','project')"></mat-slide-toggle>
+                                                                                                      (change)="$event.checked = statisticsDisplay.entities[entity].numbers.map['project'].showInDashboard;
+                                                                                                      toggleShowInDashboard(entity,'numbers','project')"></mat-slide-toggle>
                                                                                 </th>
                                                                             </tr>
                                                                             </tbody>
@@ -147,14 +151,16 @@
                                                                                 <th>In Graph Analysis</th>
                                                                                 <th class="uk-text-center">
                                                                                     <mat-slide-toggle [checked]="statisticsDisplay.entities[entity].numbers.map['open'].showInMonitor"
-                                                                                                      (change)="toggleShowInMonitor(entity,'numbers','open')"></mat-slide-toggle>
+                                                                                                      (change)="$event.checked = statisticsDisplay.entities[entity].numbers.map['open'].showInMonitor;
+                                                                                                      toggleShowInMonitor(entity,'numbers','open')"></mat-slide-toggle>
                                                                                 </th>
                                                                             </tr>
                                                                             <tr>
                                                                                 <th>In Overview</th>
                                                                                 <th class="uk-text-center">
                                                                                     <mat-slide-toggle [checked]="statisticsDisplay.entities[entity].numbers.map['open'].showInDashboard"
-                                                                                                      (change)="toggleShowInDashboard(entity,'numbers','open')"></mat-slide-toggle>
+                                                                                                      (change)="$event.checked = statisticsDisplay.entities[entity].numbers.map['open'].showInDashboard;
+                                                                                                      toggleShowInDashboard(entity,'numbers','open')"></mat-slide-toggle>
                                                                                 </th>
                                                                             </tr>
                                                                             </tbody>
@@ -183,14 +189,16 @@
                                                                                 <th>In Graph Analysis</th>
                                                                                 <th class="uk-text-center">
                                                                                     <mat-slide-toggle [checked]="statisticsDisplay.entities[entity].numbers.map['closed'].showInMonitor"
-                                                                                                      (change)="toggleShowInMonitor(entity,'numbers','closed')"></mat-slide-toggle>
+                                                                                                      (change)="$event.checked = statisticsDisplay.entities[entity].numbers.map['closed'].showInMonitor;
+                                                                                                      toggleShowInMonitor(entity,'numbers','closed')"></mat-slide-toggle>
                                                                                 </th>
                                                                             </tr>
                                                                             <tr>
                                                                                 <th>In Overview</th>
                                                                                 <th class="uk-text-center">
                                                                                     <mat-slide-toggle [checked]="statisticsDisplay.entities[entity].numbers.map['closed'].showInDashboard"
-                                                                                                      (change)="toggleShowInDashboard(entity,'numbers','closed')"></mat-slide-toggle>
+                                                                                                      (change)="$event.checked = statisticsDisplay.entities[entity].numbers.map['closed'].showInDashboard;
+                                                                                                      toggleShowInDashboard(entity,'numbers','closed')"></mat-slide-toggle>
                                                                                 </th>
                                                                             </tr>
                                                                             </tbody>
@@ -219,14 +227,16 @@
                                                                                 <th>In Graph Analysis</th>
                                                                                 <th class="uk-text-center">
                                                                                     <mat-slide-toggle [checked]="statisticsDisplay.entities[entity].numbers.map['restricted'].showInMonitor"
-                                                                                                      (change)="toggleShowInMonitor(entity,'numbers','restricted')"></mat-slide-toggle>
+                                                                                                      (change)="$event.checked = statisticsDisplay.entities[entity].numbers.map['restricted'].showInMonitor;
+                                                                                                      toggleShowInMonitor(entity,'numbers','restricted')"></mat-slide-toggle>
                                                                                 </th>
                                                                             </tr>
                                                                             <tr>
                                                                                 <th>In Overview</th>
                                                                                 <th class="uk-text-center">
                                                                                     <mat-slide-toggle [checked]="statisticsDisplay.entities[entity].numbers.map['restricted'].showInDashboard"
-                                                                                                      (change)="toggleShowInDashboard(entity,'numbers','restricted')"></mat-slide-toggle>
+                                                                                                      (change)="$event.checked = statisticsDisplay.entities[entity].numbers.map['restricted'].showInDashboard;
+                                                                                                      toggleShowInDashboard(entity,'numbers','restricted')"></mat-slide-toggle>
                                                                                 </th>
                                                                             </tr>
                                                                             </tbody>
@@ -255,14 +265,16 @@
                                                                                 <th>In Graph Analysis</th>
                                                                                 <th class="uk-text-center">
                                                                                     <mat-slide-toggle [checked]="statisticsDisplay.entities[entity].numbers.map['embargo'].showInMonitor"
-                                                                                                      (change)="toggleShowInMonitor(entity,'numbers','embargo')"></mat-slide-toggle>
+                                                                                                      (change)="$event.checked = statisticsDisplay.entities[entity].numbers.map['embargo'].showInMonitor;
+                                                                                                      toggleShowInMonitor(entity,'numbers','embargo')"></mat-slide-toggle>
                                                                                 </th>
                                                                             </tr>
                                                                             <tr>
                                                                                 <th>In Overview</th>
                                                                                 <th class="uk-text-center">
                                                                                     <mat-slide-toggle [checked]="statisticsDisplay.entities[entity].numbers.map['embargo'].showInDashboard"
-                                                                                                      (change)="toggleShowInDashboard(entity,'numbers','embargo')"></mat-slide-toggle>
+                                                                                                      (change)="$event.checked = statisticsDisplay.entities[entity].numbers.map['embargo'].showInDashboard;
+                                                                                                      toggleShowInDashboard(entity,'numbers','embargo')"></mat-slide-toggle>
                                                                                 </th>
                                                                             </tr>
                                                                             </tbody>
@@ -270,70 +282,6 @@
                                                                     </div>
                                                                 </div>
                                                             </div>
-
-                                                            <!--<span>
-                                                                <a (click)="toggleShowInMonitor(entity,'numbers','total')"
-                                                                   data-uk-tooltip
-                                                                   [title]="statisticsDisplay.entities[entity].numbers.map['total'].showInMonitor ? 'Hide in monitor' : 'Show in monitor'"
-                                                                   [ngStyle]="{'color': statisticsDisplay.entities[entity].numbers.map['total'].showInMonitor ? 'green' : 'red'}">
-
-                                                                    {{statisticsSum[entity].total | number}}
-                                                                </a>
-                                                                {{ entity == 'dataset' ? 'Datasets' : entitiesMap.get(entity) }}
-                                                                from
-                                                                <a (click)="toggleShowInMonitor(entity,'numbers','project')"
-                                                                   data-uk-tooltip
-                                                                   [title]="statisticsDisplay.entities[entity].numbers.map['project'].showInMonitor ? 'Hide in monitor' : 'Show in monitor'"
-                                                                   [ngStyle]="{'color': statisticsDisplay.entities[entity].numbers.map['project'].showInMonitor ? 'green' : 'red'}">
-
-                                                                    {{statisticsSum[entity].projects | number}}
-                                                                </a>
-                                                                project{{ statisticsSum[entity].projects == 1 ? '' : 's' }}.
-                                                            </span><br>
-                                                            <span>
-                                                                <a (click)="toggleShowInMonitor(entity,'numbers','open')"
-                                                                   data-uk-tooltip
-                                                                   [title]="statisticsDisplay.entities[entity].numbers.map['open'].showInMonitor ? 'Hide in monitor' : 'Show in monitor'"
-                                                                   [ngStyle]="{'color': statisticsDisplay.entities[entity].numbers.map['open'].showInMonitor ? 'green' : 'red'}">
-
-                                                                    {{statisticsSum[entity].open_access | number}}
-                                                                </a>
-
-                                                                {{statisticsSum[entity].open_access == 1 ? 'is' : 'are'}} OA
-                                                            </span>
-                                                            <span>
-                                                                ,
-                                                                <a (click)="toggleShowInMonitor(entity,'numbers','closed')"
-                                                                   data-uk-tooltip
-                                                                   [title]="statisticsDisplay.entities[entity].numbers.map['closed'].showInMonitor ? 'Hide in monitor' : 'Show in monitor'"
-                                                                   [ngStyle]="{'color': statisticsDisplay.entities[entity].numbers.map['closed'].showInMonitor ? 'green' : 'red'}">
-
-                                                                    {{statisticsSum[entity].closed_access | number}}
-                                                                </a>
-                                                                {{statisticsSum[entity].closed_access == 1 ? 'is' : 'are'}} closed
-                                                            </span>
-                                                            <span>
-                                                                ,
-                                                                <a (click)="toggleShowInMonitor(entity,'numbers','restricted')"
-                                                                   data-uk-tooltip
-                                                                   [title]="statisticsDisplay.entities[entity].numbers.map['restricted'].showInMonitor ? 'Hide in monitor' : 'Show in monitor'"
-                                                                   [ngStyle]="{'color': statisticsDisplay.entities[entity].numbers.map['restricted'].showInMonitor ? 'green' : 'red'}">
-
-                                                                    {{statisticsSum[entity].restricted | number}}
-                                                                </a>
-                                                                {{statisticsSum[entity].restricted == 1 ? 'is' : 'are'}} restricted
-                                                            </span>
-                                                            <span>
-                                                                and
-                                                                <a (click)="toggleShowInMonitor(entity,'numbers','embargo')"
-                                                                   data-uk-tooltip
-                                                                   [title]="statisticsDisplay.entities[entity].numbers.map['embargo'].showInMonitor ? 'Hide in monitor' : 'Show in monitor'"
-                                                                   [ngStyle]="{'color': statisticsDisplay.entities[entity].numbers.map['embargo'].showInMonitor ? 'green' : 'red'}">
-
-                                                                    {{statisticsSum[entity].embargo | number}}
-                                                                </a>
-                                                                {{statisticsSum[entity].embargo == 1 ? 'is' : 'are'}} still in embargo.
-                                                            </span>-->
                                                         </div>
                                                     </div>
                                                     <div *ngIf="statisticsSum[entity].total==0"
@@ -365,36 +313,21 @@
                                                                                 <th>In Graph Analysis</th>
                                                                                 <th class="uk-text-center">
                                                                                     <mat-slide-toggle [checked]="statisticsDisplay.entities[entity].charts.map['timeline'].showInMonitor"
-                                                                                                      (change)="toggleShowInMonitor(entity,'charts','timeline')"></mat-slide-toggle>
+                                                                                                      (change)="$event.checked = statisticsDisplay.entities[entity].charts.map['timeline'].showInMonitor;
+                                                                                                      toggleShowInMonitor(entity,'charts','timeline')"></mat-slide-toggle>
                                                                                 </th>
                                                                             </tr>
                                                                             <tr>
                                                                                 <th>In Overview</th>
                                                                                 <th class="uk-text-center">
                                                                                     <mat-slide-toggle [checked]="statisticsDisplay.entities[entity].charts.map['timeline'].showInDashboard"
-                                                                                                      (change)="toggleShowInDashboard(entity,'charts','timeline')"></mat-slide-toggle>
+                                                                                                      (change)="$event.checked = statisticsDisplay.entities[entity].charts.map['timeline'].showInDashboard;
+                                                                                                      toggleShowInDashboard(entity,'charts','timeline')"></mat-slide-toggle>
                                                                                 </th>
                                                                             </tr>
                                                                         </tbody>
                                                                     </table>
                                                                 </div>
-                                                                <!--<div style="margin-top:20px;">
-                                                                    <div style="margin-top:10px;">
-                                                                        <div class="uk-display-inline uk-vertical-align-middle"
-                                                                             style="min-width:50px; min-height:50px; border:2px solid #3e4e55; border-radius: 20px; margin-right: 10px;"
-                                                                             [ngStyle]="{'background-color': statisticsDisplay.entities[entity].charts.map['timeline'].showInMonitor ? 'lightgreen' : 'red'}">&nbsp;&nbsp;&nbsp;&nbsp;</div>
-                                                                        <a class="uk-label uk-label-arrow"
-                                                                           style="width:120px; text-align: center;"
-                                                                           (click)="toggleShowInMonitor(entity,'charts','timeline')">Show in Monitor</a>
-                                                                    </div>
-                                                                    <div style="margin-top:10px;">
-                                                                        <div class="uk-display-inline uk-vertical-align-middle"
-                                                                             style="min-width:50px; min-height:50px; border:2px solid #3e4e55; border-radius: 20px; margin-right: 10px;"
-                                                                             [ngStyle]="{'background-color': statisticsDisplay.entities[entity].charts.map['timeline'].showInDashboard ? 'lightgreen' : 'red'}">&nbsp;&nbsp;&nbsp;&nbsp;</div>
-                                                                        <a class="uk-label uk-label-arrow" style="width:120px; text-align: center;"
-                                                                           (click)="toggleShowInDashboard(entity,'charts','timeline')">Show in Dashboard</a>
-                                                                    </div>
-                                                                </div>-->
                                                             </div>
                                                             <hr>
                                                             <div *ngIf="statisticsDisplay.entities[entity].charts.map['graph'] &&
@@ -419,14 +352,16 @@
                                                                             <th>In Graph Analysis</th>
                                                                             <th class="uk-text-center">
                                                                                 <mat-slide-toggle [checked]="statisticsDisplay.entities[entity].charts.map['graph'].showInMonitor"
-                                                                                                  (change)="toggleShowInMonitor(entity,'charts','graph')"></mat-slide-toggle>
+                                                                                                  (change)="$event.checked = statisticsDisplay.entities[entity].charts.map['graph'].showInMonitor;
+                                                                                                  toggleShowInMonitor(entity,'charts','graph')"></mat-slide-toggle>
                                                                             </th>
                                                                         </tr>
                                                                         <tr>
                                                                             <th>In Overview</th>
                                                                             <th class="uk-text-center">
                                                                                 <mat-slide-toggle [checked]="statisticsDisplay.entities[entity].charts.map['graph'].showInDashboard"
-                                                                                                  (change)="toggleShowInDashboard(entity,'charts','graph')"></mat-slide-toggle>
+                                                                                                  (change)="$event.checked = statisticsDisplay.entities[entity].charts.map['graph'].showInDashboard;
+                                                                                                  toggleShowInDashboard(entity,'charts','graph')"></mat-slide-toggle>
                                                                             </th>
                                                                         </tr>
                                                                         </tbody>
@@ -500,19 +435,23 @@
                                                                         <th>In Graph Analysis</th>
                                                                         <th class="uk-text-center">
                                                                             <mat-slide-toggle [checked]="statisticsDisplay.entities[entity].charts.map['projectColumn'].showInMonitor"
-                                                                                              (change)="toggleShowInMonitor(entity,'charts','projectColumn')"></mat-slide-toggle>
+                                                                                              (change)="$event.checked = statisticsDisplay.entities[entity].charts.map['projectColumn'].showInMonitor;
+                                                                                              toggleShowInMonitor(entity,'charts','projectColumn')"></mat-slide-toggle>
                                                                         </th>
                                                                         <th class="uk-text-center">
                                                                             <mat-slide-toggle [checked]="statisticsDisplay.entities[entity].charts.map['projectPie'].showInMonitor"
-                                                                                              (change)="toggleShowInMonitor(entity,'charts','projectPie')"></mat-slide-toggle>
+                                                                                              (change)="$event.checked = statisticsDisplay.entities[entity].charts.map['projectPie'].showInMonitor;
+                                                                                              toggleShowInMonitor(entity,'charts','projectPie')"></mat-slide-toggle>
                                                                         </th>
                                                                         <th class="uk-text-center">
                                                                             <mat-slide-toggle [checked]="statisticsDisplay.entities[entity].charts.map['projectTable'].showInMonitor"
-                                                                                              (change)="toggleShowInMonitor(entity,'charts','projectTable')"></mat-slide-toggle>
+                                                                                              (change)="$event.checked = statisticsDisplay.entities[entity].charts.map['projectTable'].showInMonitor;
+                                                                                              toggleShowInMonitor(entity,'charts','projectTable')"></mat-slide-toggle>
                                                                         </th>
                                                                         <th class="uk-text-center">
                                                                             <mat-slide-toggle [checked]="showAllInMonitor"
-                                                                                              (change)="toggleShowAllInMonitor(entity)"></mat-slide-toggle>
+                                                                                              (change)="$event.checked = showAllInMonitor;
+                                                                                              toggleShowAllInMonitor(entity)"></mat-slide-toggle>
 
                                                                         </th>
                                                                     </tr>
@@ -520,19 +459,23 @@
                                                                         <th>In Overview</th>
                                                                         <th class="uk-text-center">
                                                                             <mat-slide-toggle [checked]="statisticsDisplay.entities[entity].charts.map['projectColumn'].showInDashboard"
-                                                                                              (change)="toggleShowInDashboard(entity,'charts','projectColumn')"></mat-slide-toggle>
+                                                                                              (change)="$event.checked = statisticsDisplay.entities[entity].charts.map['projectColumn'].showInDashboard;
+                                                                                              toggleShowInDashboard(entity,'charts','projectColumn')"></mat-slide-toggle>
                                                                         </th>
                                                                         <th class="uk-text-center">
                                                                             <mat-slide-toggle [checked]="statisticsDisplay.entities[entity].charts.map['projectPie'].showInDashboard"
-                                                                                              (change)="toggleShowInDashboard(entity,'charts','projectPie')"></mat-slide-toggle>
+                                                                                              (change)="$event.checked = statisticsDisplay.entities[entity].charts.map['projectPie'].showInDashboard;
+                                                                                              toggleShowInDashboard(entity,'charts','projectPie')"></mat-slide-toggle>
                                                                         </th>
                                                                         <th class="uk-text-center">
                                                                             <mat-slide-toggle [checked]="statisticsDisplay.entities[entity].charts.map['projectTable'].showInDashboard"
-                                                                                              (change)="toggleShowInDashboard(entity,'charts','projectTable')"></mat-slide-toggle>
+                                                                                              (change)="$event.checked = statisticsDisplay.entities[entity].charts.map['projectTable'].showInDashboard;
+                                                                                              toggleShowInDashboard(entity,'charts','projectTable')"></mat-slide-toggle>
                                                                         </th>
                                                                         <th class="uk-text-center">
                                                                             <mat-slide-toggle [checked]="showAllInDashboard"
-                                                                                              (change)="toggleShowAllInDashboard(entity)"></mat-slide-toggle>
+                                                                                              (change)="$event.checked = showAllInDashboard;
+                                                                                              toggleShowAllInDashboard(entity)"></mat-slide-toggle>
 
                                                                         </th>
                                                                     </tr>