
Tables should look better on mobile now. Don't show table column selector on mobile sizes. Show more important columns on mobile.
78 lines
2.8 KiB
HTML
78 lines
2.8 KiB
HTML
<%inherit file="base.html"/>
|
|
<%!
|
|
from plexpy import helpers
|
|
%>
|
|
|
|
<%def name="headIncludes()">
|
|
<link rel="stylesheet" href="interfaces/default/css/plexwatch-tables.css">
|
|
<link rel="stylesheet" href="interfaces/default/css/dataTables.responsive.css">
|
|
</%def>
|
|
|
|
<%def name="body()">
|
|
<div class='container-fluid'>
|
|
<div class='row-fluid'>
|
|
<div class='span12'>
|
|
<div class='table-card-back'>
|
|
<div class="header-bar">
|
|
<h2><i class="fa fa-group"></i> Active Users</h2>
|
|
</div>
|
|
<div class="button-bar">
|
|
<button class="rounded" id="refresh-users-list"><i class="fa fa-refresh"></i> Refresh users</button>
|
|
</div>
|
|
</div>
|
|
<div class='table-card-back'>
|
|
<table id="users_list_table" class="display" width="100%">
|
|
<thead>
|
|
<tr>
|
|
<th class="all" align="right" id="avatar"></th>
|
|
<th class="all" align="left" id="friendly_name">User</th>
|
|
<th class="min-tablet" align="left" id="last_seen">Last Seen</th>
|
|
<th class="min-tablet" align="left" id="last_known_ip">Last Known IP</th>
|
|
<th class="min-tablet" align="left" id="total_plays">Total Plays</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<footer></footer>
|
|
</div>
|
|
|
|
</%def>
|
|
|
|
<%def name="javascriptIncludes()">
|
|
<script src="interfaces/default/js/jquery.dataTables.min.js"></script>
|
|
<script src="interfaces/default/js/dataTables.responsive.js"></script>
|
|
<script src="interfaces/default/js/jquery.dataTables.bootstrap.pagination.integration.js"></script>
|
|
<script src="interfaces/default/js/moment-with-locale.js"></script>
|
|
<script src="interfaces/default/js/tables/users.js"></script>
|
|
<script>
|
|
users_list_table_options.ajax = {
|
|
"url": "get_user_list",
|
|
type: "post",
|
|
data: function ( d ) {
|
|
return { 'json_data': JSON.stringify( d ) };
|
|
}
|
|
}
|
|
|
|
var users_list_table = $('#users_list_table').DataTable(users_list_table_options);
|
|
|
|
$("#refresh-users-list").click(function() {
|
|
$.ajax({
|
|
url: 'refresh_users_list',
|
|
cache: false,
|
|
async: true,
|
|
success : function(data) {
|
|
showMsg('<i class="fa fa-check"></i> User list refresh started...',false,true,2000,false)
|
|
},
|
|
error: function(jqXHR, textStatus, errorThrown) {
|
|
showMsg('<i class="fa fa-exclamation-circle"></i> Unable to refresh user list.',false,true,2000,true)
|
|
},
|
|
});
|
|
});
|
|
|
|
</script>
|
|
</%def>
|