kallithea Changeset - 69418cbd8285

Changeset - 69418cbd8285

Parent rev.

Child rev.

[Not reviewed]

default

0 2 0

Mads Kiilerich - 10 years ago 2016-05-23 18:02:33
madski@unity3d.com

admin: use jQuery DataTables for my & watched repos

2 files changed with 31 insertions and 204 deletions:

kallithea/templates/admin/my_account/my_account_repos.html

102

kallithea/templates/admin/my_account/my_account_watched.html

102

0 comments (0 inline, 0 general)

kallithea/templates/admin/my_account/my_account_repos.html

➞

Show inline comments

 <div style="font-size: 20px; color: #666666; padding: 0px 0px 10px 0px">${_('Repositories You Own')}</div>
 <input class="q_filter_box" id="q_filter" size="15" type="text" name="filter"
        placeholder="${_('quick filter...')}" value=""/>
 <div class="table-grid table yui-skin-sam" id="repos_list_wrap"></div>
 <div id="user-paginator" style="padding: 0px 0px 0px 20px"></div>
 <div class="table">
     <table id="datatable_list_wrap"></table>
 </div>
 <script>
 function table_renderer(data){
     var myDataSource = new YAHOO.util.DataSource(data);
     myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
     myDataSource.responseSchema = {
         resultsList: "records",
         fields: [
             {key:"menu"},
             {key:"raw_name"},
             {key:"name"},
             {key:"last_changeset"},
             {key:"last_rev_raw"},
             {key:"action"}
+            ]
         };
     myDataSource.doBeforeCallback = function(req,raw,res,cb) {
         // This is the filter function
         var data     = res.results || [],
             filtered = [],
             i,l;
         if (req) {
             req = req.toLowerCase();
             for (i = 0; i<data.length; i++) {
                 var pos = data[i].raw_name.toLowerCase().indexOf(req);
                 if (pos != -1) {
                     filtered.push(data[i]);
+                }
+            }
             res.results = filtered;
+        }
         return res;
+    }
       // main table sorting
       var myColumnDefs = [
           {key:"menu",label:"",sortable:false,className:"quick_repo_menu hidden"},
           {key:"name",label:"${_('Name')}",sortable:true,
               sortOptions: { sortFunction: nameSort }},
           {key:"last_changeset",label:"${_('Tip')}",sortable:true,
               sortOptions: { sortFunction: revisionSort }},
           {key:"action",label:"${_('Action')}",sortable:false}
       ];
       var myDataTable = new YAHOO.widget.DataTable("repos_list_wrap", myColumnDefs, myDataSource,{
         sortedBy:{key:"name",dir:"asc"},
         paginator: YUI_paginator(50, ['user-paginator']),
         MSG_SORTASC:"${_('Click to sort ascending')}",
         MSG_SORTDESC:"${_('Click to sort descending')}",
         MSG_EMPTY:"${_('No records found.')}",
         MSG_ERROR:"${_('Data error.')}",
         MSG_LOADING:"${_('Loading...')}"
+      }
       );
       myDataTable.subscribe('postRenderEvent',function(oArgs) {
           tooltip_activate();
           quick_repo_menu();
       });
       var filterTimeout = null;
       updateFilter = function() {
           // Reset timeout
           filterTimeout = null;
           // Reset sort
           var state = myDataTable.getState();
           state.sortedBy = {key:'name', dir:YAHOO.widget.DataTable.CLASS_ASC};
           // Get filtered data
           myDataSource.sendRequest(YUD.get('q_filter').value,{
               success : myDataTable.onDataReturnInitializeTable,
               failure : myDataTable.onDataReturnInitializeTable,
               scope   : myDataTable,
               argument: state
           });
       };
       $('#q_filter').click(function(){
           if(!$('#q_filter').hasClass('loaded')){
               //TODO: load here full list later to do search within groups
               $('#q_filter').addClass('loaded');
+          }
       });
       $('#q_filter').keyup(function(){
           clearTimeout(filterTimeout);
           filterTimeout = setTimeout(updateFilter,600);
       });
       if($('#q_filter').val()) {
           updateFilter();
+      }
+    }
 table_renderer(${c.data |n});
   var data = ${c.data|n};
   var myDataTable = $("#datatable_list_wrap").DataTable({
         data: data.records,
         columns: [
             {data: "menu", sortable: false, className: "quick_repo_menu hidden", searchable: false},
             {data: "raw_name", "visible": false, searchable: false},
             {data: "name", "orderData": 1, title: "${_('Name')}"},
             {data: "last_rev_raw", "visible": false, searchable: false},
             {data: "last_changeset", "orderData": 3, title: "${_('Tip')}", searchable: false},
             {data: "action", title: "${_('Action')}", sortable: false, searchable: false}
         ],
         order: [[2, "asc"]]
     });
 </script>

kallithea/templates/admin/my_account/my_account_watched.html

➞

Show inline comments

 <div style="font-size: 20px; color: #666666; padding: 0px 0px 10px 0px">${_('Repositories You are Watching')}</div>
 <input class="q_filter_box" id="q_filter" size="15" type="text" name="filter"
        placeholder="${_('quick filter...')}" value=""/>
 <div class="table-grid table yui-skin-sam" id="repos_list_wrap"></div>
 <div id="user-paginator" style="padding: 0px 0px 0px 20px"></div>
 <div class="table">
     <table id="datatable_list_wrap"></table>
 </div>
 <script>
 function table_renderer(data){
     var myDataSource = new YAHOO.util.DataSource(data);
     myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
     myDataSource.responseSchema = {
         resultsList: "records",
         fields: [
             {key:"menu"},
             {key:"raw_name"},
             {key:"name"},
             {key:"last_changeset"},
             {key:"last_rev_raw"},
             {key:"action"}
+            ]
         };
     myDataSource.doBeforeCallback = function(req,raw,res,cb) {
         // This is the filter function
         var data     = res.results || [],
             filtered = [],
             i,l;
         if (req) {
             req = req.toLowerCase();
             for (i = 0; i<data.length; i++) {
                 var pos = data[i].raw_name.toLowerCase().indexOf(req);
                 if (pos != -1) {
                     filtered.push(data[i]);
+                }
+            }
             res.results = filtered;
+        }
         return res;
+    }
       // main table sorting
       var myColumnDefs = [
           {key:"menu",label:"",sortable:false,className:"quick_repo_menu hidden"},
           {key:"name",label:"${_('Name')}",sortable:true,
               sortOptions: { sortFunction: nameSort }},
           {key:"last_changeset",label:"${_('Tip')}",sortable:true,
               sortOptions: { sortFunction: revisionSort }},
           {key:"action",label:"${_('Action')}",sortable:false}
       ];
       var myDataTable = new YAHOO.widget.DataTable("repos_list_wrap", myColumnDefs, myDataSource,{
         sortedBy:{key:"name",dir:"asc"},
         paginator: YUI_paginator(50, ['user-paginator']),
         MSG_SORTASC:"${_('Click to sort ascending')}",
         MSG_SORTDESC:"${_('Click to sort descending')}",
         MSG_EMPTY:"${_('No records found.')}",
         MSG_ERROR:"${_('Data error.')}",
         MSG_LOADING:"${_('Loading...')}"
+      }
       );
       myDataTable.subscribe('postRenderEvent',function(oArgs) {
           tooltip_activate();
           quick_repo_menu();
       });
       var filterTimeout = null;
       updateFilter = function() {
           // Reset timeout
           filterTimeout = null;
           // Reset sort
           var state = myDataTable.getState();
           state.sortedBy = {key:'name', dir:YAHOO.widget.DataTable.CLASS_ASC};
           // Get filtered data
           myDataSource.sendRequest(YUD.get('q_filter').value,{
               success : myDataTable.onDataReturnInitializeTable,
               failure : myDataTable.onDataReturnInitializeTable,
               scope   : myDataTable,
               argument: state
           });
       };
       $('#q_filter').click(function(){
           if(!$('#q_filter').hasClass('loaded')){
               //TODO: load here full list later to do search within groups
               $('#q_filter').addClass('loaded');
+          }
       });
       $('#q_filter').keyup(function(){
           clearTimeout(filterTimeout);
           filterTimeout = setTimeout(updateFilter,600);
       });
       if($('#q_filter').val()) {
           updateFilter();
+      }
+    }
 table_renderer(${c.data |n});
   var data = ${c.data|n};
   var myDataTable = $("#datatable_list_wrap").DataTable({
         data: data.records,
         columns: [
             {data: "menu", sortable: false, className: "quick_repo_menu hidden", searchable: false},
             {data: "raw_name", "visible": false, searchable: false},
             {data: "name", "orderData": 1, title: "${_('Name')}"},
             {data: "last_rev_raw", "visible": false, searchable: false},
             {data: "last_changeset", "orderData": 3, title: "${_('Tip')}", searchable: false},
         ],
         order: [[2, "asc"]]
     });
 </script>

0 comments (0 inline, 0 general)