view/templates/admin/federation.tpl

   1 <script src="{{$baseurl}}/vendor/asset/Chart-js/dist/Chart.min.js"></script>
   2 <canvas id="FederationChart" class="federation-graph" width="400" height="400"></canvas>
   3 <div id="adminpage">
   4     <h1>{{$title}} - {{$page}}</h1>
   5     <p>{{$intro}}</p>
   6     {{if not $autoactive}}
   7     <p class="error-message">{{$hint}}</p>
   8     {{/if}}
   9     <p>{{$legendtext}}</p>
  10     <ul>
  11         {{foreach $counts as $c}}
  12         {{if $c[0]['total'] > 0}}
  13         <li>{{$c[0]['platform']}} ({{$c[0]['total']}}/{{$c[0]['users']}})</li>
  14             {{/if}}
  15             {{/foreach}}
  16     </ul>
  17 </div>
  18 <script>
  19 var FedData = {
  20     datasets: [{
  21         data: [
  22     {{foreach $counts as $c}}
  23             {{$c[0]['total']}},
  24     {{/foreach}}
  25         ],
  26         backgroundColor: [
  27 {{foreach $counts as $c}}
  28             '{{$c[3]}}',
  29 {{/foreach}}
  30         ],
  31         hoverBackgroundColor: [
  32 {{foreach $counts as $c}}
  33             '#EE90A1',
  34 {{/foreach}}
  35         ]
  36     }],
  37     labels: [
  38 {{foreach $counts as $c}}
  39         "{{$c[0]['platform']}}",
  40 {{/foreach}}
  41     ]
  42 };
  43 var ctx = document.getElementById("FederationChart").getContext("2d");
  44 var myDoughnutChart = new Chart(ctx, {
  45     type: 'doughnut',
  46     data: FedData,
  47     options: {
  48         legend: {display: false},
  49         animation: {animateRotate: false},
  50         responsive: false
  51     }
  52 });
  53 </script>
  54
  55 <table id="federation-stats">
  56 {{foreach $counts as $c}}
  57     {{if $c[0]['total'] > 0}}
  58     <tr>
  59         <th>{{$c[0]['platform']}}</th>
  60         <th><strong>{{$c[0]['total']}}</strong></td>
  61         <td>{{$c[0]['network']}}</td>
  62     </tr>
  63     <tr>
  64         <td colspan="3" class="federation-data">
  65             <canvas id="{{$c[2]}}Chart" class="federation-network-graph" width="240" height="240"></canvas>
  66             <script>
  67 var {{$c[2]}}data = {
  68     datasets: [{
  69         data: [
  70         {{foreach $c[1] as $v}}
  71             {{$v['total']}},
  72         {{/foreach}}
  73         ],
  74         backgroundColor: [
  75         {{foreach $c[1] as $v}}
  76             '{{$c[3]}}',
  77         {{/foreach}}
  78         ],
  79         hoverBackgroundColor: [
  80         {{foreach $c[1] as $v}}
  81             '#EE90A1',
  82         {{/foreach}}
  83         ]
  84     }],
  85     labels: [
  86         {{foreach $c[1] as $v}}
  87         '{{$v['version']}}',
  88         {{/foreach}}
  89     ]
  90 };
  91 var ctx = document.getElementById("{{$c[2]}}Chart").getContext("2d");
  92 var my{{$c[2]}}DoughnutChart = new Chart(ctx, {
  93     type: 'doughnut',
  94     data: {{$c[2]}}data,
  95     options: {
  96     legend: {display: false},
  97         animation: {animateRotate: false},
  98         responsive: false
  99     }
 100 });
 101             </script>
 102             <ul class="federation-stats">
 103         {{foreach $c[1] as $v}}
 104                 <li>
 105             {{if ($c[0]['platform']==='Friendica' and  $version===$v['version']) }}
 106                     <span class="version-match">{{$v['version']}}</span>
 107             {{else}}
 108                     {{$v['version']}}
 109             {{/if}}
 110                     ({{$v['total']}})
 111                 </li>
 112         {{/foreach}}
 113             </ul>
 114         </td>
 115     </tr>
 116     {{/if}}
 117 {{/foreach}}
 118 </table>