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

 ## -*- coding: utf-8 -*-
 <%inherit file="/base/base.html"/>
 <%block name="title">
     ${_('Repository Groups Administration')}
 </%block>
 <%def name="breadcrumbs_links()">
     ${h.link_to(_('Admin'),h.url('admin_home'))} &raquo; <span id="repo_group_count">0</span> ${_('Repository Groups')}
 </%def>
 <%block name="header_menu">
     ${self.menu('admin')}
 </%block>
 <%def name="main()">
 <div class="panel panel-primary">
     <div class="panel-heading clearfix">
         <div class="pull-left">
             ${self.breadcrumbs()}
         </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

 ## -*- coding: utf-8 -*-
 <%inherit file="/base/base.html"/>
 <%block name="title">
     ${_('Repositories Administration')}
 </%block>
 <%def name="breadcrumbs_links()">
     <span id="repo_count">0</span> ${_('Repositories')}
 </%def>
 <%block name="header_menu">
     ${self.menu('admin')}
 </%block>
 <%def name="main()">
 <div class="panel panel-primary">
     <div class="panel-heading clearfix">
         <div class="pull-left">
             ${self.breadcrumbs()}
         </div>
         <div class="pull-right">
          %if h.HasPermissionAny('hg.admin','hg.create.repository')():
             <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

 ## -*- coding: utf-8 -*-
 <%inherit file="/base/base.html"/>
 <%block name="title">
     ${_('User Groups Administration')}
 </%block>
 <%def name="breadcrumbs_links()">
     ${h.link_to(_('Admin'),h.url('admin_home'))} &raquo; ${_('User Groups')}
 </%def>
 <%block name="header_menu">
     ${self.menu('admin')}
 </%block>
 <%def name="main()">
 <div class="panel panel-primary">
     <div class="panel-heading clearfix">
         <div class="pull-left">
             ${self.breadcrumbs()}
         </div>
         <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

 ## -*- coding: utf-8 -*-
 <%inherit file="/base/base.html"/>
 <%block name="title">
     ${_('Users Administration')}
 </%block>
 <%def name="breadcrumbs_links()">
     ${h.link_to(_('Admin'),h.url('admin_home'))} &raquo; <span id="user_count">0</span> ${_('Users')}
 </%def>
 <%block name="header_menu">
     ${self.menu('admin')}
 </%block>
 <%def name="main()">
 <div class="panel panel-primary">
     <div class="panel-heading clearfix">
         <div class="pull-left">
             ${self.breadcrumbs()}
         </div>
         <div class="pull-right">
             <a href="${h.url('new_user')}" class="btn btn-success btn-xs"><i class="icon-plus"></i> ${_('Add User')}</a>
         </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: "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

@@ @@ -19,52 +19,52 @@ @@
                     create_on_write = h.HasPermissionAny('hg.create.write_on_repogroup.true')()
                     group_admin = h.HasRepoGroupPermissionLevel('admin')(gr_name, 'can write into group index page')
                     group_write = h.HasRepoGroupPermissionLevel('write')(gr_name, 'can write into group index page')
                 %>
                 %if h.HasPermissionAny('hg.admin','hg.create.repository')() or (group_admin or (group_write and create_on_write)):
                   %if c.group:
                         <a href="${h.url('new_repo',parent_group=c.group.group_id)}" class="btn btn-default btn-xs"><i class="icon-plus"></i> ${_('Add Repository')}</a>
                         %if h.HasPermissionAny('hg.admin')() or h.HasRepoGroupPermissionLevel('admin')(c.group.group_name):
                             <a href="${h.url('new_repos_group', parent_group=c.group.group_id)}" class="btn btn-default btn-xs"><i class="icon-plus"></i> ${_('Add Repository Group')}</a>
                         %endif
                   %else:
                     <a href="${h.url('new_repo')}" class="btn btn-default btn-xs"><i class="icon-plus"></i> ${_('Add Repository')}</a>
                     %if h.HasPermissionAny('hg.admin')():
                         <a href="${h.url('new_repos_group')}" class="btn btn-default btn-xs"><i class="icon-plus"></i> ${_('Add Repository Group')}</a>
                     %endif
                   %endif
                 %endif
                 %if c.group and h.HasRepoGroupPermissionLevel('admin')(c.group.group_name):
                     <a href="${h.url('edit_repo_group',group_name=c.group.group_name)}" title="${_('You have admin right to this group, and can edit it')}" class="btn btn-default btn-xs"><i class="icon-pencil"></i> ${_('Edit Repository Group')}</a>
                 %endif
               </div>
             %endif
         </div>
         <div class="panel-body">
             <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)