statistics.html 26.1 KB
Newer Older
1 2
<div class="row">
	<div class="col-md-12">
3
		<!-- panels here -->
4
		<span data-ng-show="tokenInvalid == true">
5
			<div class="alert alert-danger" role="alert"><strong>{{'TOKEN_INVALID' | translate}}</strong> {{'STATS_TOKEN_INFO' | translate}}</div>
6 7
		</span>
		<span data-ng-show="tokenAuth != null">
8
			<div class="alert alert-warning" role="alert"><strong>{{'STATS_TOKEN_GROUP' | translate}}</strong> {{'STATS_TOKEN_GROUP_INFO' | translate}} <strong>{{stats.global_stats.shared_group_name}}</strong> {{'STATS_TOKEN_GROUP_INFO2' | translate}}</div>
9 10
		</span>
		<div class="whatsspy-no-information-data" data-ng-show="stats == null && tokenInvalid != true">
11 12
			<span data-ng-show="showLoader == false">{{'STATS_NO_INFO' | translate}}</span>
			<span data-ng-show="showLoader == true">{{'STATS_LOADING' | translate}}</span>
13
		</div>
14
		<span data-ng-show="authenticated == true && stats.global_stats != null">
15 16 17 18
			<div class="row">
				<div class="col-md-6">
					<div class="panel panel-default">
						<div class="panel-heading">
19
							<h3 class="panel-title"><span class="glyphicon glyphicon-filter" aria-hidden="true"></span> {{'STATS_FILTER' | translate}}</h3>
20 21 22 23 24 25 26 27 28 29 30 31 32
						</div>
						<div class="panel-body">
							<div class="row">
								<div class="col-md-12">
									<select class="form-control" data-ng-model="filterGroup" data-ng-options="group.gid as group.name for group in groups" ></select>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="col-md-6">
					<div class="panel panel-default">
						<div class="panel-heading">
33
							<h3 class="panel-title"><span class="glyphicon glyphicon-education" aria-hidden="true"></span> {{'STATS_NOTES' | translate}}</h3>
34 35
						</div>
						<div class="panel-body">
36
							<span data-ng-show="filterGroup == null">
37
							{{'STATS_INFO_VALIDITY' | translate}}
38 39 40 41 42 43 44 45 46 47 48
							</span>
							<span data-ng-show="filterGroup != null">
								<div class="row">
					    			<div class="col-sm-8 col-xs-12">
					    				<div class="input-group whatsspy-copy-token" data-ng-click="copyToClipboard(getTokenUrl('group', getGroupById(filterGroup).read_only_token))">
					        				<span class="input-group-addon"><span class="glyphicon glyphicon-link" aria-hidden="true"></span></span>  
							    			<input type="text" class="form-control" id="shareUrl" data-ng-value="getGroupById(filterGroup).read_only_token | emptyToken" disabled="disabled">
							    		</div>
					    			</div>
					    			<div class="col-sm-4 col-xs-12">
					    				<button type="button" class="btn btn-primary" data-ng-click="generateReadOnlyToken('group', null, getGroupById(filterGroup))">
49
					    					 {{'STATS_TOKEN_GEN' | translate}}
50 51
					    				</button>
					    				<button type="button" class="btn btn-danger" data-ng-click="resetReadOnlyToken('group', null, getGroupById(filterGroup))">
52
					    					 {{'STATS_TOKEN_RESET' | translate}}
53 54 55 56
					    				</button>
					    			</div>
					    		</div>    			
					    		<small>
57
					    			{{'STATS_SHARE_INFO' | translate}}
58 59
					    		</small>
					    	</span>
60 61 62 63 64 65
						</div>
					</div>
				</div>
			</div>
		</span>
		<span data-ng-show="stats.global_stats != null">
66 67 68 69
			<div class="row">
				<div class="col-md-6">
					<div class="panel panel-default">
						<div class="panel-heading">
70
							<h3 class="panel-title"><span class="glyphicon glyphicon-home" aria-hidden="true"></span> {{'STATS_H' | translate}}</h3>
71 72
						</div>
						<div class="panel-body whatsspy-statistics-first-row">
73
							<h5>{{'STATS_TRACKER_STATUS' | translate}}</h5>
74 75 76
							<table class="table table-striped table-bordered ">
						      <tbody>
						        <tr>
77
						          <th class="whatsspy-statistics-table-normal">{{'STATS_SESSION' | translate}} </th>
78 79 80
						          <td>{{stats.global_stats.tracker_session_count}}</td>
						        </tr>
						        <tr>
81
						          <th>{{'STATS_FIRST_SESSION' | translate}}</th>
82 83 84 85
						          <td>{{stats.global_stats.first_tracker_session | staticDatetime}}</td>
						        </tr>
						       </tbody>
						    </table>
86
						    <h5>{{'STATS_DB_CONTENT' | translate}}</h5>
87 88 89
						    <table class="table table-striped table-bordered ">
						      <tbody>
						        <tr>
90 91
						          <th class="whatsspy-statistics-table-normal">{{'STATS_NUMBER_OF_ACC' | translate}}</th>
						          <td>{{stats.global_stats.user_count}} {{'STATS_ACCOUNTS' | translate}}</td>
92 93
						        </tr>
						        <tr>
94 95
						          <th>{{'STATS_H_ONLINE' | translate}}</th>
						          <td>{{stats.global_stats.user_status_count}} {{'STATS_STATUSES' | translate}}</td>
96 97
						        </tr>
						        <tr>
98
						          <th>{{'STATS_H_TOTALTIME' | translate}}</th>
99 100 101
						          <td>{{stats.global_stats.user_status_count_time | timeFormat}}</td>
						        </tr>
						        <tr>
102 103
						          <th>{{'STATS_H_PROFPICSUM' | translate}}</th>
						          <td>{{stats.global_stats.profilepicture_count}} {{'STATS_PROFPIC' | translate}}</td>
104 105
						        </tr>
						        <tr>
106 107
						          <th>{{'STATS_H_STATUSMSGSUM' | translate}}</th>
						          <td>{{stats.global_stats.statusmessage_count}} {{'STATS_STSMSG' | translate}}</td>
108 109 110
						        </tr>
						      </tbody>
						    </table>
111
						    
112 113 114 115 116 117
						</div>
					</div>
				</div>
				<div class="col-md-6">
					<div class="panel panel-default">
						<div class="panel-heading">
118
							<h3 class="panel-title"><span class="glyphicon glyphicon-user" aria-hidden="true"></span> {{'STATS_H_PRIVACY' | translate}}</h3>
119 120
						</div>
						<div class="panel-body whatsspy-statistics-first-row">
121
							<h5>{{'STATS_PRIVACY_H' | translate}}</h5>
122 123 124
							<table class="table table-striped table-bordered ">
								<tbody>
								<tr>
125 126 127
								  <th>{{'STATS_PRIVACY_TABLE_TH1' | translate}}</th>
								  <th>{{'STATS_PRIVACY_TABLE_TH2' | translate}}</th>
								  <th>{{'STATS_PRIVACY_TABLE_TH3' | translate}}</th>
128 129
								</tr>
								<tr>
130 131 132
								  <td>{{'STATS_PRIVACY_OPTION1' | translate}}</td>
								  <td><span class="label label-danger">{{stats.global_stats.account_lastseen_privacy_enabled}} {{'STATS_PRIVACY_USERS' | translate}}</span></td>
								  <td><span class="label label-success">{{stats.global_stats.account_lastseen_privacy_disabled}} {{'STATS_PRIVACY_USERS' | translate}}</span></td>
133 134
								</tr>
								<tr>
135 136 137
								  <td>{{'STATS_PRIVACY_OPTION2' | translate}}</td>
								  <td><span class="label label-danger">{{stats.global_stats.account_statusmessage_privacy_enabled}} {{'STATS_PRIVACY_USERS' | translate}}</span></td>
								  <td><span class="label label-success">{{stats.global_stats.account_statusmessage_privacy_disabled}} {{'STATS_PRIVACY_USERS' | translate}}</span></td>
138 139
								</tr>
								<tr>
140 141 142
								  <td>{{'STATS_PRIVACY_OPTION3' | translate}}</td>
								  <td><span class="label label-danger">{{stats.global_stats.account_profilepic_privacy_enabled}} {{'STATS_PRIVACY_USERS' | translate}}</span></td>
								  <td><span class="label label-success">{{stats.global_stats.account_profilepic_privacy_disabled}} {{'STATS_PRIVACY_USERS' | translate}}</span></td>
143 144 145
								</tr>
								</tbody>
							</table>
146
							<h5>{{'STATS_PRIVACY_HISTORY' | translate}}</h5>
147 148 149
							<table class="table table-striped table-bordered ">
								<tbody>
							        <tr>
150 151
							          <th class="whatsspy-statistics-table-normal">{{'STATS_PRIVACY_LASTSEEN' | translate}}</th>
							          <td>{{stats.global_stats.lastseen_privacy_count}} {{'STATS_PRIVACY_CHANGE' | translate}}</td>
152 153
							        </tr>
							        <tr>
154 155
							          <th>{{'STATS_PRIVACY_PROFPIC' | translate}}</th>
							          <td>{{stats.global_stats.profilepic_privacy_count}} {{'STATS_PRIVACY_CHANGE' | translate}}</td>
156 157
							        </tr>
							        <tr>
158 159
							          <th>{{'STATS_PRIVACY_STATUSMSG' | translate}}</th>
							          <td>{{stats.global_stats.statusmessage_privacy_count}} {{'STATS_PRIVACY_CHANGE' | translate}}</td>
160 161 162
							        </tr>
								</tbody>
							</table>
163
							<small>{{'STATS_PRIVACY_INFO1' | translate}} <a href="https://maikel.pro/blog/en-whatsapp-privacy-problem-explained-in-detail/" target="_blank">{{'STATS_PRIVACY_INFO2' | translate}}</a> {{'STATS_PRIVACY_INFO3' | translate}}</small>
164 165 166
						</div>
					</div>
				</div>
167
			</div>
168 169
		</span>
		<span data-ng-show="stats.user_status_analytics_user != null">
170 171 172 173
			<div class="row">
				<div class="col-md-12">
					<div class="panel panel-default">
						<div class="panel-heading">
174
							<h3 class="panel-title"><span class="glyphicon glyphicon-calendar" aria-hidden="true"></span> {{'STATS_PIE_CHART_ONLINE_TIME_H' | translate}}</h3>
175 176 177 178
						</div>
						<div class="panel-body">
							<div class="row">
								<div class="col-md-12 whatsspy-statistics-piechart-control">
179 180 181
					    				<button data-ng-disabled="stats.generated.showPieChart == 'today'" data-ng-click="stats.generated.showPieChart = 'today';" type="button" class="btn btn-info">{{'STATS_PIE_CHART_TODAY' | translate}}</button>
					    				<button data-ng-disabled="stats.generated.showPieChart == '7days'" data-ng-click="stats.generated.showPieChart = '7days';" type="button" class="btn btn-info">{{'STATS_PIE_CHART_7DAYS' | translate}}</button>
					    				<button data-ng-disabled="stats.generated.showPieChart == '14days'" data-ng-click="stats.generated.showPieChart = '14days';" type="button" class="btn btn-info">{{'STATS_PIE_CHART_14DAYS' | translate}}</button>
182
					    				<button data-ng-disabled="stats.generated.showPieChart == 'all'" data-ng-click="stats.generated.showPieChart = 'all';" type="button" class="btn btn-info">{{'STATS_PIE_CHART_ALL' | translate}}</button>
183 184 185 186 187
									</div>
								</div>
							<div class="row">
								<div class="col-md-6">
									<span data-ng-show="stats.generated.showPieChart == 'all'">
188
										<h4 class="whatsspy-stat-head">{{'STATS_PIE_CHART_PIE_OPEN_H_ALL' | translate}}</h4>
189 190 191
										<nvd3-pie-chart
											data="stats.user_status_analytics_user"
											id="pieChart-user-activities-count-all"
192 193
											width="600"
											height="600"
194 195 196 197 198 199
											x="xFunction()"
											y="yFunction('count_all')"
											margin="{left:0,top:15,bottom:0,right:0}"
											labelType="percent"
											tooltips="true"
											noData="No information available"
200 201 202 203 204 205
											tooltipcontent="tooltipUserStatusCount('count_all')"
											showLabels="true">
											<svg></svg>
										</nvd3-pie-chart>
									</span>
									<span data-ng-show="stats.generated.showPieChart == 'today'">
206
										<h4 class="whatsspy-stat-head">{{'STATS_PIE_CHART_PIE_OPEN_H_TODAY' | translate}}</h4>
207 208 209
										<nvd3-pie-chart
											data="stats.user_status_analytics_user"
											id="pieChart-user-activities-count-today"
210 211
											width="600"
											height="600"
212 213 214 215 216 217 218
											x="xFunction()"
											y="yFunction('count_today')"
											margin="{left:0,top:15,bottom:0,right:0}"
											labelType="percent"
											tooltips="true"
											noData="No information available"
											tooltipcontent="tooltipUserStatusCount('count_today')"
219 220 221 222 223
											showLabels="true">
											<svg></svg>
										</nvd3-pie-chart>
									</span>
									<span data-ng-show="stats.generated.showPieChart == '7days'">
224
										<h4 class="whatsspy-stat-head">{{'STATS_PIE_CHART_PIE_OPEN_H_7DAYS' | translate}}</h4>
225 226 227
										<nvd3-pie-chart
											data="stats.user_status_analytics_user"
											id="pieChart-user-activities-count-7day"
228 229
											width="600"
											height="600"
230 231 232 233 234 235
											x="xFunction()"
											y="yFunction('count_7day')"
											margin="{left:0,top:15,bottom:0,right:0}"
											labelType="percent"
											tooltips="true"
											noData="No information available"
236
											tooltipcontent="tooltipUserStatusCount('count_7day')"
237 238 239 240 241
											showLabels="true">
											<svg></svg>
										</nvd3-pie-chart>
									</span>
									<span data-ng-show="stats.generated.showPieChart == '14days'">
242
										<h4 class="whatsspy-stat-head">{{'STATS_PIE_CHART_PIE_OPEN_H_14DAYS' | translate}}</h4>
243 244 245
										<nvd3-pie-chart
											data="stats.user_status_analytics_user"
											id="pieChart-user-activities-count-14day"
246 247
											width="600"
											height="600"
248 249 250 251 252 253
											x="xFunction()"
											y="yFunction('count_14day')"
											margin="{left:0,top:15,bottom:0,right:0}"
											labelType="percent"
											tooltips="true"
											noData="No information available"
254
											tooltipcontent="tooltipUserStatusCount('count_14day')"
255 256 257 258 259 260 261
											showLabels="true">
											<svg></svg>
										</nvd3-pie-chart>
									</span>
								</div>
								<div class="col-md-6">
									<span data-ng-show="stats.generated.showPieChart == 'all'">
262
										<h4 class="whatsspy-stat-head">{{'STATS_PIE_CHART_PIE_ONLINE_H_ALL' | translate}}</h4>
263 264 265
										<nvd3-pie-chart
											data="stats.user_status_analytics_user"
											id="pieChart-user-activities-time-all"
266 267
											width="600"
											height="600"
268 269 270 271 272 273
											x="xFunction()"
											y="yFunction('seconds_all')"
											margin="{left:0,top:15,bottom:0,right:0}"
											labelType="percent"
											tooltips="true"
											noData="No information available"
274 275 276 277 278 279
											tooltipcontent="tooltipUserStatusTime('seconds_all')"
											showLabels="true">
											<svg></svg>
										</nvd3-pie-chart>
									</span>
									<span data-ng-show="stats.generated.showPieChart == 'today'">
280
										<h4 class="whatsspy-stat-head">{{'STATS_PIE_CHART_PIE_ONLINE_H_TODAY' | translate}}</h4>
281 282 283
										<nvd3-pie-chart
											data="stats.user_status_analytics_user"
											id="pieChart-user-activities-time-today"
284 285
											width="600"
											height="600"
286 287 288 289 290 291 292
											x="xFunction()"
											y="yFunction('seconds_today')"
											margin="{left:0,top:15,bottom:0,right:0}"
											labelType="percent"
											tooltips="true"
											noData="No information available"
											tooltipcontent="tooltipUserStatusTime('seconds_today')"
293 294 295 296 297
											showLabels="true">
											<svg></svg>
										</nvd3-pie-chart>
									</span>
									<span data-ng-show="stats.generated.showPieChart == '7days'">
298
										<h4 class="whatsspy-stat-head">{{'STATS_PIE_CHART_PIE_ONLINE_H_7DAYS' | translate}}</h4>
299 300 301
										<nvd3-pie-chart
											data="stats.user_status_analytics_user"
											id="pieChart-user-activities-time-7day"
302 303
											width="600"
											height="600"
304 305 306 307 308 309
											x="xFunction()"
											y="yFunction('seconds_7day')"
											margin="{left:0,top:15,bottom:0,right:0}"
											labelType="percent"
											tooltips="true"
											noData="No information available"
310
											tooltipcontent="tooltipUserStatusTime('seconds_7day')"
311 312 313 314 315
											showLabels="true">
											<svg></svg>
										</nvd3-pie-chart>
									</span>
									<span data-ng-show="stats.generated.showPieChart == '14days'">
316
										<h4 class="whatsspy-stat-head">{{'STATS_PIE_CHART_PIE_ONLINE_H_14DAYS' | translate}}</h4>
317 318 319
										<nvd3-pie-chart
											data="stats.user_status_analytics_user"
											id="pieChart-user-activities-time-14day"
320 321
											width="600"
											height="600"
322 323 324 325 326 327
											x="xFunction()"
											y="yFunction('seconds_14day')"
											margin="{left:0,top:15,bottom:0,right:0}"
											labelType="percent"
											tooltips="true"
											noData="No information available"
328
											tooltipcontent="tooltipUserStatusTime('seconds_14day')"
329 330 331 332 333 334
											showLabels="true">
											<svg></svg>
										</nvd3-pie-chart>
									</span>
								</div>	
							</div>
335
							{{'STATS_PIE_CHART_PIE_INFO' | translate}}
336
						</div>
337 338 339
					</div>
				</div>
			</div>
340 341
		</span>
		<span data-ng-show="stats.user_status_analytics_time != null">
342 343 344 345
			<div class="row">
				<div class="col-md-12">
					<div class="panel panel-default">
						<div class="panel-heading">
346
							<h3 class="panel-title"><span class="glyphicon glyphicon-calendar" aria-hidden="true"></span> {{'STATS_PIE_CHART_BAR_H' | translate}}</h3>
347 348 349 350 351
						</div>
						<div class="panel-body">
							<div class="row">
								<div class="col-md-6">
									<span data-ng-show="stats.generated.showWeekday == true">
352
						    			<h4>{{'STATS_PIE_CHART_BAR_OPEN_H_WEEKDAY' | translate}}</h4>
353 354 355 356 357 358 359 360 361 362 363 364 365 366 367 368
						    			<nvd3-multi-bar-chart
									    	data="stats.generated.chart_weekday_status_count_all"
									        id="opened-overview-graph-weekday"
									        tooltipcontent="barChartToolTip('weekday', 'times')"
									        width="500"
											height="300"
									        showXAxis="false"
									        showYAxis="true"
									        margin=" {top:5,bottom:5,right:0}"
									        showLegend="true"
									        tooltips="true"
									        stacked="true">
									        	<svg></svg>
									    </nvd3-multi-bar-chart>
									</span>
									<span data-ng-show="stats.generated.showHour == true">
369
						    			<h4>{{'STATS_PIE_CHART_BAR_OPEN_H_HOUR' | translate}}</h4>
370 371 372 373 374 375 376 377 378 379 380 381 382 383 384 385 386 387
						    			<nvd3-multi-bar-chart
									    	data="stats.generated.chart_hour_status_count_all"
									        id="opened-overview-graph-hour"
									        tooltipcontent="barChartToolTip('hour', 'times')"
									        width="500"
											height="300"
									        showXAxis="false"
									        showYAxis="true"
									        margin=" {top:5,bottom:5,right:0}"
									        showLegend="true"
									        tooltips="true"
									        stacked="true">
									        	<svg></svg>
									    </nvd3-multi-bar-chart>
									</span>
								</div>
								<div class="col-md-6">
									<div class="whatsspy-bar-graph-toggle">
388 389
					    				<button data-ng-show="stats.generated.showHour != true" data-ng-click="stats.generated.showWeekday = false; stats.generated.showHour = true; " type="button" class="btn btn-info">{{'STATS_PIE_CHART_BAR_SHOWHOUR' | translate}}</button>
					    				<button data-ng-show="stats.generated.showWeekday != true" data-ng-click="stats.generated.showWeekday = true; stats.generated.showHour = false" type="button" class="btn btn-info">{{'STATS_PIE_CHART_BAR_SHOWWEEKDAY' | translate}}</button>
390 391
					    			</div>
					    			<span data-ng-show="stats.generated.showWeekday == true">
392
						    			<h4>{{'STATS_PIE_CHART_BAR_TIME_H_WEEKDAY' | translate}}</h4>
393 394 395 396 397 398 399 400 401 402 403 404 405 406 407 408
						    			<nvd3-multi-bar-chart
									    	data="stats.generated.chart_weekday_status_time_all"
									        id="time-overview-graph-weekday"
									        tooltipcontent="barChartToolTip('weekday', 'minutes')"
									        width="500"
											height="300"
									        showXAxis="false"
									        showYAxis="true"
									        margin=" {top:5,bottom:5,right:0}"
									        showLegend="true"
									        tooltips="true"
									        stacked="true">
									        	<svg></svg>
									    </nvd3-multi-bar-chart>
									</span>
									<span data-ng-show="stats.generated.showHour == true">
409
						    			<h4>{{'STATS_PIE_CHART_BAR_TIME_H_HOUR' | translate}}</h4>
410 411 412 413 414 415 416 417 418 419 420 421 422 423 424 425 426 427 428 429 430 431
						    			<nvd3-multi-bar-chart
									    	data="stats.generated.chart_hour_status_time_all"
									        id="time-overview-graph-hour"
									        tooltipcontent="barChartToolTip('hour', 'minutes')"
									        width="500"
											height="300"
									        showXAxis="false"
									        showYAxis="true"
									        margin=" {top:5,bottom:5,right:0}"
									        showLegend="true"
									        tooltips="true"
									        stacked="true">
									        	<svg></svg>
									    </nvd3-multi-bar-chart>
									</span>
								</div>	
							</div>
							<br />
							<br />
						</div>
					</div>	
				</div>
432
			</div>
433
		</span>
434
		<span data-ng-show="stats.top_usage_users != null">
435 436 437 438
			<div class="row">
				<div class="col-md-12">
					<div class="panel panel-default">
						<div class="panel-heading">
439
							<h3 class="panel-title"><span class="glyphicon glyphicon-th-list" aria-hidden="true"></span> {{'STATS_TOP_H1' | translate}} {{showTopUsers}} {{'STATS_TOP_H2' | translate}}</h3>
440 441
						</div>
						<div class="panel-body">
442 443
							<div class="row">
								<div class="col-md-12">
444
									<button data-ng-show="stats.top_usage_users.meta.count <= 20" data-ng-disabled="showTopUsers == 5" data-ng-click="showTopUsers = 5;" type="button" class="btn btn-primary">{{'STATS_TOP_H1' | translate}} 5</button> 
445
									<button data-ng-disabled="showTopUsers == 10" data-ng-click="showTopUsers = 10;" type="button" class="btn btn-primary">{{'STATS_TOP_H1' | translate}} 10</button> 
446 447 448 449
									<button data-ng-show="stats.top_usage_users.meta.count >= 20" data-ng-disabled="showTopUsers == 20" data-ng-click="showTopUsers = 20;" type="button" class="btn btn-primary">{{'STATS_TOP_H1' | translate}} 20</button> 
									<button data-ng-show="stats.top_usage_users.meta.count >= 30" data-ng-disabled="showTopUsers == 30" data-ng-click="showTopUsers = 30;" type="button" class="btn btn-primary">{{'STATS_TOP_H1' | translate}} 30</button> 
									<button data-ng-show="stats.top_usage_users.meta.count >= 50" data-ng-disabled="showTopUsers == 50" data-ng-click="showTopUsers = 50;" type="button" class="btn btn-primary">{{'STATS_TOP_H1' | translate}} 50</button> 
									<button data-ng-show="stats.top_usage_users.meta.count >= 100" data-ng-disabled="showTopUsers == 100" data-ng-click="showTopUsers = 100;" type="button" class="btn btn-primary">{{'STATS_TOP_H1' | translate}} 100</button> 
450
									<button data-ng-show="stats.top_usage_users.meta.count > 100" data-ng-disabled="showTopUsers == stats.top_usage_users.meta.count" data-ng-click="showTopUsers = stats.top_usage_users.meta.count;" type="button" class="btn btn-primary">{{'STATS_TOP_ALL_SHOW' | translate}}</button> 
451 452
								</div>
							</div>
453 454
							<div class="row">
								<div class="col-md-6">
455
									<h4>{{'STATS_TOP_H1' | translate}} {{showTopUsers}} {{'STATS_TOP_H3' | translate}} - {{'STATS_TYPE_' + stats.generated.top10DayChoice | translate}}</h4>
456 457 458 459 460
									<button data-ng-disabled="stats.generated.top10DayChoice == 'today'" data-ng-click="stats.generated.top10DayChoice = 'today';" type="button" class="btn btn-info">{{'STATS_TOP_TODAY' | translate}}</button>
									<button data-ng-disabled="stats.generated.top10DayChoice == 'yesterday'" data-ng-click="stats.generated.top10DayChoice = 'yesterday';" type="button" class="btn btn-info">{{'STATS_TOP_YESTERDAY' | translate}}</button>
									<button data-ng-disabled="stats.generated.top10DayChoice == '2days_ago'" data-ng-click="stats.generated.top10DayChoice = '2days_ago';" type="button" class="btn btn-info">2 {{'STATS_TOP_DAYS_AGO' | translate}}</button>
									<button data-ng-disabled="stats.generated.top10DayChoice == '3days_ago'" data-ng-click="stats.generated.top10DayChoice = '3days_ago';" type="button" class="btn btn-info">3 {{'STATS_TOP_DAYS_AGO' | translate}}</button>
									<button data-ng-disabled="stats.generated.top10DayChoice == '4days_ago'" data-ng-click="stats.generated.top10DayChoice = '4days_ago';" type="button" class="btn btn-info">4 {{'STATS_TOP_DAYS_AGO' | translate}}</button>
461 462 463 464 465
									<br />
									<br />
									<table class="table table-striped table-bordered ">
										<tbody>
										<tr>
466 467 468
										  <th>{{'STATS_TOP_TRACKED_CONTACT' | translate}}</th>
										  <th>{{'STATS_TOP_TIME' | translate}}</th>
										  <th>{{'STATS_TOP_OPENED' | translate}}</th>
469
										</tr>
470
										<tr data-ng-repeat="user in stats.top_usage_users[stats.generated.top10DayChoice]">
471 472 473 474 475 476
										  <td>
										  	<a data-ng-show="tokenAuth == null" data-ng-href="#/overview#{{user.id}}" class="whatsspy-clean-link"><span class="glyphicon glyphicon-user" aria-hidden="true"></span> {{user.name | emptyName}}</a>

										  	<span data-ng-show="tokenAuth != null">
										  	<span data-ng-show="tokenAuth != null" class="glyphicon glyphicon-user" aria-hidden="true"></span> {{user.name | emptyName}}</span>
										  </td>
477
										  <td>{{user.online | timeFormat}}</td>
478
										  <td>{{user.count}} {{'STATS_TOP_TIMES' | translate}}</td>
479 480 481
										</tr>
										</tbody>
									</table>
482 483
								</div>
								<div class="col-md-6">
484
									<h4>{{'STATS_TOP_H1' | translate}} {{showTopUsers}} {{'STATS_TOP_H4' | translate}} - {{'STATS_TYPE_' + stats.generated.top10TimeChoice | translate}}</h4>
485 486 487 488 489
									<button data-ng-disabled="stats.generated.top10TimeChoice == 'alltime'" data-ng-click="stats.generated.top10TimeChoice = 'alltime';" type="button" class="btn btn-info">{{'STATS_TOP_ALL' | translate}}</button>
									<button data-ng-disabled="stats.generated.top10TimeChoice == '31days'" data-ng-click="stats.generated.top10TimeChoice = '31days';" type="button" class="btn btn-info">31 {{'STATS_TOP_DAYS' | translate}}</button>
									<button data-ng-disabled="stats.generated.top10TimeChoice == '14days'" data-ng-click="stats.generated.top10TimeChoice = '14days';" type="button" class="btn btn-info">14 {{'STATS_TOP_DAYS' | translate}}</button>
									<button data-ng-disabled="stats.generated.top10TimeChoice == '7days'" data-ng-click="stats.generated.top10TimeChoice = '7days';" type="button" class="btn btn-info">7 {{'STATS_TOP_DAYS' | translate}}</button>
									<button data-ng-disabled="stats.generated.top10TimeChoice == '24hours'" data-ng-click="stats.generated.top10TimeChoice = '24hours';" type="button" class="btn btn-info">24 {{'STATS_TOP_HOURS' | translate}}</button>
490 491 492 493 494
									<br />
									<br />
									<table class="table table-striped table-bordered ">
										<tbody>
										<tr>
495 496 497
										  <th>{{'STATS_TOP_TRACKED_CONTACT' | translate}}</th>
										  <th>{{'STATS_TOP_TIME' | translate}}</th>
										  <th>{{'STATS_TOP_OPENED' | translate}}</th>
498
										</tr>
499
										<tr data-ng-repeat="user in stats.top_usage_users[stats.generated.top10TimeChoice]">
500 501 502 503 504 505 506
										  <td>
										  	<a data-ng-show="tokenAuth == null" data-ng-href="#/overview#{{user.id}}" class="whatsspy-clean-link"><span class="glyphicon glyphicon-user" aria-hidden="true"></span> {{user.name | emptyName}}</a>

										  	<span data-ng-show="tokenAuth != null">
										  	<span class="glyphicon glyphicon-user" aria-hidden="true"></span> {{user.name | emptyName}}
										  </span>
										  </td>
507
										  <td>{{user.online | timeFormat}}</td>
508
										  <td>{{user.count}} {{'STATS_TOP_TIMES' | translate}}</td>
509 510 511
										</tr>
										</tbody>
									</table>
512 513 514
								</div>	
							</div>
						</div>
515 516 517
					</div>	
				</div>
			</div>
518
		</span>
519 520
	</div>
</div>