##// END OF EJS Templates
datatables: use new way of generating labels for count of dynamic datatables....
marcink -
r2726:a9ece9dd default
parent child Browse files
Show More
@@ -1,93 +1,88 b''
1
1
2 <div class="panel panel-default">
2 <div class="panel panel-default">
3 <div class="panel-heading">
3 <div class="panel-heading">
4 <h3 class="panel-title">${_('SSH Keys')} - <span id="ssh_keys_count"></span></h3>
4 <h3 class="panel-title">${_('SSH Keys')} - <span id="ssh_keys_count"></span></h3>
5
5
6 ${h.secure_form(h.route_path('admin_permissions_ssh_keys_update'), request=request)}
6 ${h.secure_form(h.route_path('admin_permissions_ssh_keys_update'), request=request)}
7 <button class="btn btn-link pull-right" type="submit">${_('Update SSH keys file')}</button>
7 <button class="btn btn-link pull-right" type="submit">${_('Update SSH keys file')}</button>
8 ${h.end_form()}
8 ${h.end_form()}
9 </div>
9 </div>
10 <div class="panel-body">
10 <div class="panel-body">
11 <input class="q_filter_box" id="q_filter" size="15" type="text" name="filter" placeholder="${_('quick filter...')}" value=""/>
11 <input class="q_filter_box" id="q_filter" size="15" type="text" name="filter" placeholder="${_('quick filter...')}" value=""/>
12
12
13 <div id="repos_list_wrap">
13 <div id="repos_list_wrap">
14 <table id="ssh_keys_table" class="display"></table>
14 <table id="ssh_keys_table" class="display"></table>
15 </div>
15 </div>
16 </div>
16 </div>
17 </div>
17 </div>
18
18
19
19
20 <script type="text/javascript">
20 <script type="text/javascript">
21
21
22 $(document).ready(function() {
22 $(document).ready(function() {
23 var $sshKeyListTable = $('#ssh_keys_table');
23 var $sshKeyListTable = $('#ssh_keys_table');
24
24
25 var getDatatableCount = function(){
26 var table = $sshKeyListTable.dataTable();
27 var page = table.api().page.info();
28 var active = page.recordsDisplay;
29 var total = page.recordsTotal;
30
31 var _text = _gettext("{0} out of {1} ssh keys").format(active, total);
32 $('#ssh_keys_count').text(_text);
33 };
34
35 // user list
25 // user list
36 $sshKeyListTable.DataTable({
26 $sshKeyListTable.DataTable({
37 processing: true,
27 processing: true,
38 serverSide: true,
28 serverSide: true,
39 ajax: "${h.route_path('admin_permissions_ssh_keys_data')}",
29 ajax: {
30 "url": "${h.route_path('admin_permissions_ssh_keys_data')}",
31 "dataSrc": function ( json ) {
32 var filteredCount = json.recordsFiltered;
33 var total = json.recordsTotal;
34
35 var _text = _gettext("{0} out of {1} ssh keys").format(filteredCount, total);
36 $('#ssh_keys_count').text(_text);
37 return json.data;
38 }
39 },
40 dom: 'rtp',
40 dom: 'rtp',
41 pageLength: ${c.visual.admin_grid_items},
41 pageLength: ${c.visual.admin_grid_items},
42 order: [[ 0, "asc" ]],
42 order: [[ 0, "asc" ]],
43 columns: [
43 columns: [
44 { data: {"_": "username",
44 { data: {"_": "username",
45 "sort": "username"}, title: "${_('Username')}", className: "td-user" },
45 "sort": "username"}, title: "${_('Username')}", className: "td-user" },
46 { data: {"_": "fingerprint",
46 { data: {"_": "fingerprint",
47 "sort": "fingerprint"}, title: "${_('Fingerprint')}", className: "td-type" },
47 "sort": "fingerprint"}, title: "${_('Fingerprint')}", className: "td-type" },
48 { data: {"_": "description",
48 { data: {"_": "description",
49 "sort": "description"}, title: "${_('Description')}", className: "td-type" },
49 "sort": "description"}, title: "${_('Description')}", className: "td-type" },
50 { data: {"_": "created_on",
50 { data: {"_": "created_on",
51 "sort": "created_on"}, title: "${_('Created on')}", className: "td-time" },
51 "sort": "created_on"}, title: "${_('Created on')}", className: "td-time" },
52 { data: {"_": "accessed_on",
52 { data: {"_": "accessed_on",
53 "sort": "accessed_on"}, title: "${_('Accessed on')}", className: "td-time" },
53 "sort": "accessed_on"}, title: "${_('Accessed on')}", className: "td-time" },
54 { data: {"_": "action",
54 { data: {"_": "action",
55 "sort": "action"}, title: "${_('Action')}", className: "td-action", orderable: false }
55 "sort": "action"}, title: "${_('Action')}", className: "td-action", orderable: false }
56 ],
56 ],
57 language: {
57 language: {
58 paginate: DEFAULT_GRID_PAGINATION,
58 paginate: DEFAULT_GRID_PAGINATION,
59 sProcessing: _gettext('loading...'),
59 sProcessing: _gettext('loading...'),
60 emptyTable: _gettext("No ssh keys available yet.")
60 emptyTable: _gettext("No ssh keys available yet.")
61 },
61 },
62
62
63 "createdRow": function ( row, data, index ) {
63 "createdRow": function ( row, data, index ) {
64 if (!data['active_raw']){
64 if (!data['active_raw']){
65 $(row).addClass('closed')
65 $(row).addClass('closed')
66 }
66 }
67 }
67 }
68 });
68 });
69
69
70 $sshKeyListTable.on('xhr.dt', function(e, settings, json, xhr){
70 $sshKeyListTable.on('xhr.dt', function(e, settings, json, xhr){
71 $sshKeyListTable.css('opacity', 1);
71 $sshKeyListTable.css('opacity', 1);
72 });
72 });
73
73
74 $sshKeyListTable.on('preXhr.dt', function(e, settings, data){
74 $sshKeyListTable.on('preXhr.dt', function(e, settings, data){
75 $sshKeyListTable.css('opacity', 0.3);
75 $sshKeyListTable.css('opacity', 0.3);
76 });
76 });
77
77
78 // refresh counters on draw
79 $sshKeyListTable.on('draw.dt', function(){
80 getDatatableCount();
81 });
82
83 // filter
78 // filter
84 $('#q_filter').on('keyup',
79 $('#q_filter').on('keyup',
85 $.debounce(250, function() {
80 $.debounce(250, function() {
86 $sshKeyListTable.DataTable().search(
81 $sshKeyListTable.DataTable().search(
87 $('#q_filter').val()
82 $('#q_filter').val()
88 ).draw();
83 ).draw();
89 })
84 })
90 );
85 );
91
86
92 });
87 });
93 </script>
88 </script>
@@ -1,119 +1,106 b''
1 ## -*- coding: utf-8 -*-
1 ## -*- coding: utf-8 -*-
2 <%inherit file="/base/base.mako"/>
2 <%inherit file="/base/base.mako"/>
3
3
4 <%def name="title()">
4 <%def name="title()">
5 ${_('%s Forks') % c.repo_name}
5 ${_('%s Forks') % c.repo_name}
6 %if c.rhodecode_name:
6 %if c.rhodecode_name:
7 &middot; ${h.branding(c.rhodecode_name)}
7 &middot; ${h.branding(c.rhodecode_name)}
8 %endif
8 %endif
9 </%def>
9 </%def>
10
10
11 <%def name="breadcrumbs_links()">
11 <%def name="breadcrumbs_links()">
12 ${_('Forks')}
12 ${_('Forks')}
13 </%def>
13 </%def>
14
14
15 <%def name="menu_bar_nav()">
15 <%def name="menu_bar_nav()">
16 ${self.menu_items(active='repositories')}
16 ${self.menu_items(active='repositories')}
17 </%def>
17 </%def>
18
18
19 <%def name="menu_bar_subnav()">
19 <%def name="menu_bar_subnav()">
20 ${self.repo_menu(active='summary')}
20 ${self.repo_menu(active='summary')}
21 </%def>
21 </%def>
22
22
23 <%def name="main()">
23 <%def name="main()">
24 <div class="box">
24 <div class="box">
25 <div class="title">
25 <div class="title">
26 ${self.repo_page_title(c.rhodecode_db_repo)}
26 ${self.repo_page_title(c.rhodecode_db_repo)}
27 <ul class="links">
27 <ul class="links">
28 <li>
28 <li>
29 <a class="btn btn-small btn-success" href="${h.route_path('repo_fork_new',repo_name=c.repo_name)}">
29 <a class="btn btn-small btn-success" href="${h.route_path('repo_fork_new',repo_name=c.repo_name)}">
30 ${_('Create new fork')}
30 ${_('Create new fork')}
31 </a>
31 </a>
32 </li>
32 </li>
33 </ul>
33 </ul>
34 </div>
34 </div>
35
35
36 <div id="fork_list_wrap">
36 <div id="fork_list_wrap">
37 <table id="fork_list_table" class="display"></table>
37 <table id="fork_list_table" class="display"></table>
38 </div>
38 </div>
39 </div>
39 </div>
40
40
41
41
42
42
43 <script type="text/javascript">
43 <script type="text/javascript">
44
44
45 $(document).ready(function() {
45 $(document).ready(function() {
46 var $userListTable = $('#fork_list_table');
46 var $forksListTable = $('#fork_list_table');
47
47
48 var getDatatableCount = function(){
48 // fork list
49 var table = $userListTable.dataTable();
49 $forksListTable.DataTable({
50 var page = table.api().page.info();
51 var active = page.recordsDisplay;
52 var total = page.recordsTotal;
53
54 var _text = _gettext("{0} out of {1} users").format(active, total);
55 $('#user_count').text(_text);
56 };
57
58 // user list
59 $userListTable.DataTable({
60 processing: true,
50 processing: true,
61 serverSide: true,
51 serverSide: true,
62 ajax: "${h.route_path('repo_forks_data', repo_name=c.repo_name)}",
52 ajax: {
53 "url": "${h.route_path('repo_forks_data', repo_name=c.repo_name)}",
54 },
63 dom: 'rtp',
55 dom: 'rtp',
64 pageLength: ${c.visual.dashboard_items},
56 pageLength: ${c.visual.dashboard_items},
65 order: [[ 0, "asc" ]],
57 order: [[ 0, "asc" ]],
66 columns: [
58 columns: [
67 { data: {"_": "username",
59 { data: {"_": "username",
68 "sort": "username"}, title: "${_('Owner')}", className: "td-user" },
60 "sort": "username"}, title: "${_('Owner')}", className: "td-user" },
69 { data: {"_": "fork_name",
61 { data: {"_": "fork_name",
70 "sort": "fork_name"}, title: "${_('Fork name')}", className: "td-email" },
62 "sort": "fork_name"}, title: "${_('Fork name')}", className: "td-email" },
71 { data: {"_": "description",
63 { data: {"_": "description",
72 "sort": "description"}, title: "${_('Description')}", className: "td-user" },
64 "sort": "description"}, title: "${_('Description')}", className: "td-user" },
73 { data: {"_": "fork_date",
65 { data: {"_": "fork_date",
74 "sort": "fork_date"}, title: "${_('Forked')}", className: "td-user" },
66 "sort": "fork_date"}, title: "${_('Forked')}", className: "td-user" },
75 { data: {"_": "last_activity",
67 { data: {"_": "last_activity",
76 "sort": "last_activity",
68 "sort": "last_activity",
77 "type": Number}, title: "${_('Last activity')}", className: "td-time" },
69 "type": Number}, title: "${_('Last activity')}", className: "td-time" },
78 { data: {"_": "action",
70 { data: {"_": "action",
79 "sort": "action"}, title: "${_('Action')}", className: "td-action", orderable: false }
71 "sort": "action"}, title: "${_('Action')}", className: "td-action", orderable: false }
80 ],
72 ],
81
73
82 language: {
74 language: {
83 paginate: DEFAULT_GRID_PAGINATION,
75 paginate: DEFAULT_GRID_PAGINATION,
84 sProcessing: _gettext('loading...'),
76 sProcessing: _gettext('loading...'),
85 emptyTable: _gettext("No forks available yet.")
77 emptyTable: _gettext("No forks available yet.")
86 },
78 },
87
79
88 "createdRow": function ( row, data, index ) {
80 "createdRow": function ( row, data, index ) {
89 if (!data['active_raw']){
81 if (!data['active_raw']){
90 $(row).addClass('closed')
82 $(row).addClass('closed')
91 }
83 }
92 }
84 }
93 });
85 });
94
86
95 $userListTable.on('xhr.dt', function(e, settings, json, xhr){
87 $forksListTable.on('xhr.dt', function(e, settings, json, xhr){
96 $userListTable.css('opacity', 1);
88 $forksListTable.css('opacity', 1);
97 });
89 });
98
90
99 $userListTable.on('preXhr.dt', function(e, settings, data){
91 $forksListTable.on('preXhr.dt', function(e, settings, data){
100 $userListTable.css('opacity', 0.3);
92 $forksListTable.css('opacity', 0.3);
101 });
102
103 // refresh counters on draw
104 $userListTable.on('draw.dt', function(){
105 getDatatableCount();
106 });
93 });
107
94
108 // filter
95 // filter
109 $('#q_filter').on('keyup',
96 $('#q_filter').on('keyup',
110 $.debounce(250, function() {
97 $.debounce(250, function() {
111 $userListTable.DataTable().search(
98 $forksListTable.DataTable().search(
112 $('#q_filter').val()
99 $('#q_filter').val()
113 ).draw();
100 ).draw();
114 })
101 })
115 );
102 );
116
103
117 });
104 });
118 </script>
105 </script>
119 </%def>
106 </%def>
General Comments 0
You need to be logged in to leave comments. Login now