kallithea Changeset - c5bff92d5084

Changeset - c5bff92d5084

Parent rev.

Child rev.

[Not reviewed]

default

0 7 0

Mads Kiilerich - 8 years ago 2017-09-14 02:08:06
mads@kiilerich.com

templates: disable paging and page size controls in DataTables

Since all data is sent to the client side, it can just as well be rendered.
PageDown or scrolling is more convenient for paging than paging buttons, so
short of "infinite scrolling", showing all entries is an acceptable solution
... especially when it very rarely is hundres of entries.

There could perhaps be further changes to how DataTables is shown - this is one
step.

7 files changed with 14 insertions and 14 deletions:

kallithea/templates/admin/my_account/my_account_repos.html

kallithea/templates/admin/my_account/my_account_watched.html

kallithea/templates/admin/repo_groups/repo_groups.html

kallithea/templates/admin/repos/repos.html

kallithea/templates/admin/user_groups/user_groups.html

kallithea/templates/admin/users/users.html

kallithea/templates/index_base.html

0 comments (0 inline, 0 general)

kallithea/templates/admin/my_account/my_account_repos.html

➞

Show inline comments

 <h4>${_('Repositories You Own')}</h4>
 <div>
     <table class="table" id="datatable_list_wrap" width="100%"></table>
 </div>
 <script>
   var data = ${h.js(c.data)};
   var myDataTable = $("#datatable_list_wrap").DataTable({
         data: data.records,
         columns: [
             {data: "raw_name", "visible": false, searchable: false},
             {data: "name", "orderData": 1, title: ${h.jshtml(_('Name'))}},
             {data: "last_rev_raw", "visible": false, searchable: false},
             {data: "last_changeset", "orderData": 3, title: ${h.jshtml(_('Tip'))}, searchable: false},
             {data: "action", title: ${h.jshtml(_('Action'))}, sortable: false, searchable: false}
         ],
         order: [[2, "asc"]],
         dom: '<"dataTables_left"f><"dataTables_right"ilp>t',
         pageLength: 100
         dom: '<"dataTables_left"f><"dataTables_right"i>t',
         paging: false,
     });
 </script>

kallithea/templates/admin/my_account/my_account_watched.html

➞

Show inline comments

 <h4>${_('Repositories You are Watching')}</h4>
 <div>
     <table class="table" id="datatable_list_wrap" width="100%"></table>
 </div>
 <script>
   var data = ${h.js(c.data)};
   var myDataTable = $("#datatable_list_wrap").DataTable({
         data: data.records,
         columns: [
             {data: "raw_name", "visible": false, searchable: false},
             {data: "name", "orderData": 1, title: ${h.jshtml(_('Name'))}},
             {data: "last_rev_raw", "visible": false, searchable: false},
             {data: "last_changeset", "orderData": 3, title: ${h.jshtml(_('Tip'))}, searchable: false},
         ],
         order: [[2, "asc"]],
         dom: '<"dataTables_left"f><"dataTables_right"ilp>t',
         pageLength: 100
         dom: '<"dataTables_left"f><"dataTables_right"i>t',
         paging: false,
     });
 </script>

kallithea/templates/admin/repo_groups/repo_groups.html

➞

Show inline comments

@@ @@ -22,30 +22,30 @@ @@
         </div>
         <div class="pull-right">
             %if h.HasPermissionAny('hg.admin')():
                <a href="${h.url('new_repos_group')}" class="btn btn-success btn-xs"><i class="icon-plus"></i> ${_('Add Repository Group')}</a>
             %endif
         </div>
     </div>
     <div class="panel-body">
         <table class="table" id="datatable_list_wrap" width="100%"></table>
     </div>
 </div>
 <script>
   var data = ${h.js(c.data)};
   var myDataTable = $("#datatable_list_wrap").DataTable({
         data: data.records,
         columns: [
             {data: "raw_name", visible: false, searchable: false},
             {data: "group_name", orderData: 0, title: ${h.jshtml(_('Name'))}},
             {data: "desc", title: ${h.jshtml(_('Description'))}, searchable: false},
             {data: "repos", title: ${h.jshtml(_('Number of Top-level Repositories'))}, searchable: false},
             {data: "owner", title: ${h.jshtml(_('Owner'))}, searchable: false},
             {data: "action", title: ${h.jshtml(_('Action'))}, sortable: false, searchable: false}
         ],
         drawCallback: updateRowCountCallback($("#repo_group_count")),
         dom: '<"dataTables_left"f><"dataTables_right"ilp>t',
         pageLength: 100
         dom: '<"dataTables_left"f><"dataTables_right"i>t',
         paging: false,
     });
 </script>
 </%def>

kallithea/templates/admin/repos/repos.html

➞

Show inline comments

@@ @@ -23,30 +23,30 @@ @@
             <a href="${h.url('new_repo')}" class="btn btn-success btn-xs"><i class="icon-plus"></i> ${_('Add Repository')}</a>
          %endif
         </div>
     </div>
     <div class="panel-body">
         <table class="table" id="datatable_list_wrap" width="100%"></table>
     </div>
 </div>
 <script>
   var data = ${h.js(c.data)};
   var myDataTable = $("#datatable_list_wrap").DataTable({
         data: data.records,
         columns: [
             {data: "raw_name", visible: false, searchable: false},
             {data: "name", orderData: 1, title: ${h.jshtml(_('Name'))}},
             {data: "desc", title: ${h.jshtml(_('Description'))}, searchable: false},
             {data: "last_rev_raw", visible: false, searchable: false},
             {data: "last_changeset", orderData: 4, title: ${h.jshtml(_('Tip'))}, searchable: false},
             {data: "owner", title: ${h.jshtml(_('Owner'))}, searchable: false},
             {data: "state", title: ${h.jshtml(_('State'))}, searchable: false},
             {data: "action", title: ${h.jshtml(_('Action'))}, sortable: false, searchable: false}
         ],
         drawCallback: updateRowCountCallback($("#repo_count")),
         dom: '<"dataTables_left"f><"dataTables_right"ilp>t',
         pageLength: 100
         dom: '<"dataTables_left"f><"dataTables_right"i>t',
         paging: false,
     });
 </script>
 </%def>

kallithea/templates/admin/user_groups/user_groups.html

➞

Show inline comments

@@ @@ -22,29 +22,29 @@ @@
         <div class="pull-right">
         %if h.HasPermissionAny('hg.admin', 'hg.usergroup.create.true')():
             <a href="${h.url('new_users_group')}" class="btn btn-success btn-xs"><i class="icon-plus"></i> ${_('Add User Group')}</a>
         %endif
         </div>
     </div>
     <div class="panel-body">
         <table class="table" id="datatable_list_wrap" width="100%"></table>
     </div>
 </div>
 <script>
     var data = ${h.js(c.data)};
     var $dataTable = $("#datatable_list_wrap").DataTable({
         data: data.records,
         columns: [
             {data: "raw_name", visible: false, searchable: false},
             {data: "group_name", title: ${h.jshtml(_('Name'))}, orderData: 0},
             {data: "desc", title: ${h.jshtml(_('Description'))}, searchable: false},
             {data: "members", title: ${h.jshtml(_('Members'))}, searchable: false},
             {data: "active", title: ${h.jshtml(_('Active'))}, searchable: false, 'sType': 'str'},
             {data: "owner", title: ${h.jshtml(_('Owner'))}, searchable: false},
             {data: "action", title: ${h.jshtml(_('Action'))}, searchable: false, sortable: false}
         ],
         order: [[1, "asc"]],
         dom: '<"dataTables_left"f><"dataTables_right"ilp>t',
         pageLength: 100
         dom: '<"dataTables_left"f><"dataTables_right"i>t',
         paging: false,
     });
 </script>
 </%def>

kallithea/templates/admin/users/users.html

➞

Show inline comments

@@ @@ -25,30 +25,30 @@ @@
     </div>
     <div class="panel-body">
         <table class="table" id="datatable_list_wrap" width="100%"></table>
     </div>
 </div>
 <script>
     var data = ${h.js(c.data)};
     var $dataTable = $("#datatable_list_wrap").DataTable({
         data: data.records,
         columns: [
             {data: "gravatar", sortable: false, searchable: false},
             {data: "username", title: ${h.jshtml(_('Username'))}},
             {data: "firstname", title: ${h.jshtml(_('First Name'))}},
             {data: "lastname", title: ${h.jshtml(_('Last Name'))}},
             {data: "last_login_raw", visible: false, searchable: false},
             {data: "last_login", title: ${h.jshtml(_('Last Login'))}, orderData: 4, searchable: false},
             {data: "active", title: ${h.jshtml(_('Active'))}, searchable: false, 'sType': 'str'},
             {data: "admin", title: ${h.jshtml(_('Admin'))}, searchable: false, 'sType': 'str'},
             {data: "extern_type", title: ${h.jshtml(_('Auth Type'))}, searchable: false},
             {data: "action", title: ${h.jshtml(_('Action'))}, searchable: false, sortable: false}
         ],
         order: [[1, "asc"]],
         drawCallback: updateRowCountCallback($("#user_count")),
         dom: '<"dataTables_left"f><"dataTables_right"ilp>t',
         pageLength: 100
         dom: '<"dataTables_left"f><"dataTables_right"i>t',
         paging: false,
     });
 </script>
 </%def>

kallithea/templates/index_base.html

➞

Show inline comments

@@ @@ -43,28 +43,28 @@ @@
             <table class="table" id="repos_list_wrap" width="100%"></table>
         </div>
     </div>
       <script>
         var data = ${h.js(c.data)},
             $dataTable = $("#repos_list_wrap").DataTable({
                 data: data.records,
                 columns: [
                     {data: "raw_name", visible: false, searchable: false},
                     {title: ${h.jshtml(_('Repository'))}, data: "name", orderData: [0,], render: {
                         filter: function(data, type, row, meta) {
                             return row.just_name;
+                        }
                     }},
                     {data: "desc", title: ${h.jshtml(_('Description'))}, searchable: false},
                     {data: "last_change_iso", defaultContent: '', visible: false, searchable: false},
                     {data: "last_change", defaultContent: '', title: ${h.jshtml(_('Last Change'))}, orderData: [3,], searchable: false},
                     {data: "last_rev_raw", defaultContent: '', visible: false, searchable: false},
                     {data: "last_changeset", defaultContent: '', title: ${h.jshtml(_('Tip'))}, orderData: [5,], searchable: false},
                     {data: "owner", defaultContent: '', title: ${h.jshtml(_('Owner'))}, searchable: false},
                     {data: "atom", defaultContent: '', sortable: false}
                 ],
                 order: [[1, "asc"]],
                 dom: '<"dataTables_left"f><"dataTables_right"ilp>t',
                 pageLength: 100
                 dom: '<"dataTables_left"f><"dataTables_right"i>t',
                 paging: false,
             });
       </script>

0 comments (0 inline, 0 general)