client/src/app/shared/instance/instance-statistics.component.html

   1 <p i18n *ngIf="null === serverStats">Loading instance statistics...</p>
   2
   3 <section *ngIf="null !== serverStats">
   4   <h5 i18n>Local</h5>
   5
   6   <div class="row">
   7     <div class="col-6 col-lg-4 col-xl-3">
   8       <div class="card stat">
   9         <div class="card-body">
  10           <p class="stat-value">{{ serverStats.totalUsers }}</p>
  11           <p class="stat-label" i18n>users</p>
  12         </div>
  13         <i class="glyphicon glyphicon-user icon-bottom"></i>
  14       </div>
  15     </div>
  16
  17     <div class="col-6 col-lg-4 col-xl-3">
  18       <div class="card stat">
  19         <div class="card-body">
  20           <p class="stat-value">{{ serverStats.totalLocalVideos }}</p>
  21           <p class="stat-label" i18n>videos</p>
  22         </div>
  23         <i class="glyphicon glyphicon-facetime-video"></i>
  24       </div>
  25     </div>
  26
  27     <div class="col-6 col-lg-4 col-xl-3">
  28       <div class="card stat">
  29         <div class="card-body">
  30           <p class="stat-value">{{ serverStats.totalLocalVideoViews }}</p>
  31           <p class="stat-label" i18n>video views</p>
  32         </div>
  33         <i class="glyphicon glyphicon-eye-open"></i>
  34       </div>
  35     </div>
  36
  37     <div class="col-6 col-lg-4 col-xl-3">
  38       <div class="card stat">
  39         <div class="card-body">
  40           <p class="stat-value">{{ serverStats.totalLocalVideoComments }}</p>
  41           <p class="stat-label" i18n>video comments</p>
  42         </div>
  43         <i class="glyphicon glyphicon-comment"></i>
  44       </div>
  45     </div>
  46
  47     <div class="col-6 col-lg-4 col-xl-3">
  48       <div class="card stat">
  49         <div class="card-body">
  50           <p class="stat-value">{{ serverStats.totalLocalVideoFilesSize | bytes:1 }}</p>
  51           <p class="stat-label" i18n>of hosted video</p>
  52         </div>
  53         <i class="glyphicon glyphicon-hdd"></i>
  54       </div>
  55     </div>
  56   </div>
  57
  58   <h5 i18n>Federation</h5>
  59
  60   <div class="row">
  61     <div class="col-6 col-lg-4 col-xl-3">
  62       <div class="card stat">
  63         <div class="card-body">
  64           <p class="stat-value">{{ serverStats.totalVideos }}</p>
  65           <p class="stat-label" i18n>videos</p>
  66         </div>
  67         <i class="glyphicon glyphicon-facetime-video"></i>
  68       </div>
  69     </div>
  70
  71     <div class="col-6 col-lg-4 col-xl-3">
  72       <div class="card stat">
  73         <div class="card-body">
  74           <p class="stat-value">{{ serverStats.totalVideoComments }}</p>
  75           <p class="stat-label" i18n>video comments</p>
  76         </div>
  77         <i class="glyphicon glyphicon-comment"></i>
  78       </div>
  79     </div>
  80
  81     <div class="col-6 col-lg-4 col-xl-3">
  82       <div class="card stat">
  83         <div class="card-body">
  84           <p class="stat-value">{{ serverStats.totalInstanceFollowers }}</p>
  85           <p class="stat-label" i18n>followers</p>
  86         </div>
  87         <i class="glyphicon glyphicon-retweet"></i>
  88       </div>
  89     </div>
  90
  91     <div class="col-6 col-lg-4 col-xl-3">
  92       <div class="card stat">
  93         <div class="card-body">
  94           <p class="stat-value">{{ serverStats.totalInstanceFollowing }}</p>
  95           <p class="stat-label" i18n>following</p>
  96         </div>
  97         <i class="glyphicon glyphicon-retweet"></i>
  98       </div>
  99     </div>
 100   </div>
 101 </section>