Log Files table is now a DataTable. Adding support of 'file' params in URL to directly load a file.

Author: Jérémie SOLIGNY

.gitignore

@@ -6,3 +6,5 @@ dist/
 *.pyc
 *.log
 *backup*
+/venv/
+/.idea/

README.rst

@@ -9,7 +9,7 @@ This project was modified from: https://bitbucket.org/inkalabsinc/django-log-vie
 
 -----------------
 
-.. image:: https://i.imgur.com/IZQKm4T.png
+.. image:: https://i.imgur.com/kqxzIpX.png
 
 
 Quick start
@@ -48,6 +48,7 @@ Quick start
     LOG_VIEWER_FILES_DIR = 'logs/'
     LOG_VIEWER_PAGE_LENGTH = 25       # total log lines per-page
     LOG_VIEWER_MAX_READ_LINES = 1000  # total log lines will be read
+    LOG_VIEWER_FILE_LIST_MAX_ITEMS_PER_PAGE = 25 # Max log files loaded in Datatable per page
     LOG_VIEWER_PATTERNS = ['[INFO]', '[DEBUG]', '[WARNING]', '[ERROR]', '[CRITICAL]']
 
     # Optionally you can set the next variables in order to customize the admin:

log_viewer/settings.py

@@ -10,5 +10,6 @@
 LOG_VIEWER_MAX_READ_LINES = getattr(settings, 'LOG_VIEWER_MAX_READ_LINES', 1000)
 LOG_VIEWER_FILE_LIST_TITLE = getattr(settings, 'LOG_VIEWER_FILE_LIST_TITLE', None)
 LOG_VIEWER_FILE_LIST_STYLES = getattr(settings, 'LOG_VIEWER_FILE_LIST_STYLES', None)
+LOG_VIEWER_FILE_LIST_MAX_ITEMS_PER_PAGE = getattr(settings, 'LOG_VIEWER_FILE_LIST_MAX_ITEMS_PER_PAGE', 25)
 LOG_VIEWER_PATTERNS = getattr(settings, 'LOG_VIEWER_PATTERNS', ['[INFO]', '[DEBUG]', '[WARNING]',
                                                                 '[ERROR]', '[CRITICAL]'])

log_viewer/static/log_viewer/css/log-viewer.css

@@ -46,3 +46,31 @@ table#log-entries.no-footer {
 #log-entries_length, #log-entries_length {
   margin: .5em 0;
 }
+#log-files-list_length {
+  width: 100%;
+  text-align: center;
+  float: none;
+}
+#log-files-list_filter {
+  float: none;
+  text-align: center;
+  padding: 0.5em 0.2em;
+}
+#log-files-list td {
+  font-size: 1em;
+  padding: 1em;
+}
+#log-files-list_info {
+  float: none;
+  text-align: center;
+  width: 100%;
+}
+#log-files-list_paginate {
+  float: none;
+  text-align: center;
+  margin-top: 1em;
+  width: 100%;
+}
+#log-files-list_paginate .paginate_button {
+  display: inline-block;
+}

log_viewer/templates/log_viewer/logfile_viewer.html

@@ -55,8 +55,13 @@ <h1 class="pull-left">{% if custom_file_list_title %}{{ custom_file_list_title }
         </form>
         <div id="changelist-filter">
           <h2>{% trans 'Log Files' %}</h2>
-          <div id="log-files-list">
-          </div>
+{#          <div id="log-files-list">#}
+{#          </div>#}
+            <table id="log-files-list" class="display" style="width:100%">
+              <tbody>
+                <tr><td colspan="2">{% trans 'No entries!' %}</td></tr>
+              </tbody>
+            </table>
         </div>
       </div>
     </div>
@@ -81,7 +86,7 @@ <h2>{% trans 'Log Files' %}</h2>
 
     function loadDataTable(table_name, url_json) {
       $(table_name).DataTable({
-        pageLength: {{ page_length }},
+        pageLength: {{ files_per_page }},
         columns: [{data: 0}, {data: 1}],
         ajax: function (data, callback, settings) {
           $.ajax({
@@ -91,9 +96,46 @@ <h2>{% trans 'Log Files' %}</h2>
                 const new_logs = [];
                 var next_page = response.next_page || 1;
 
-                response.logs.forEach(function(text, numb, logs){
-                  text = escapeHtml(text);
-                  new_logs.push([numb+1, text]);
+                try {
+                    response.logs.forEach(function(text, numb, logs){
+                      text = escapeHtml(text);
+                      new_logs.push([numb+1, text]);
+                    });
+                } catch {
+                    console.warn("This log file doesn't exist");
+                }
+
+
+                callback({
+                  data: new_logs,
+                  recordsTotal: next_page,
+                  recordsFiltered: next_page
+                });
+            }
+          });
+        }
+      });
+    }
+
+    function loadDataTableFiles(table_name, url_json) {
+      $(table_name).DataTable({
+        pageLength: {{ files_per_page }},
+        columns: [{data: 1}],
+        ajax: function (data, callback, settings) {
+          $.ajax({
+            type: 'get',
+            url: url_json,
+            success:function(response){
+                const new_logs = [];
+                let next_page = response.next_page_files || 1;
+                response.log_files.forEach(function(logs, numb){
+                    const keys = Object.keys(logs);
+                    Object.entries(logs).forEach(([file_name, xtra]) => {
+                        logs = '<a class="btn-load-json-log" href="javascript:;" '+
+                                   'data-file-name="'+file_name+'" '+
+                                   'data-href="'+url_json+file_name+'">'+xtra.display+'</a>'
+                    });
+                    new_logs.push([numb+1, logs]);
                 });
 
                 callback({
@@ -121,19 +163,11 @@ <h2>{% trans 'Log Files' %}</h2>
     $(document).ready(function() {
         // just blank entry to get the `log_files`
         var url_json = "{% url 'log_viewer:log_json_view' xxxxx %}";
-        $.getJSON(url_json, function(result){
-            result.log_files.forEach(function(log) {
-                const keys = Object.keys(log);
-                Object.entries(log).forEach(([file_name, xtra]) => {
-                    // console.log(file_name);
-                    // console.log(xtra);
-                    var html = '<ul><li><a class="btn-load-json-log" href="javascript:;" '+
-                               'data-file-name="'+file_name+'" '+
-                               'data-href="'+url_json+file_name+'">'+xtra.display+'</a></li></ul>'
-                    $('div#log-files-list').append(html);
-                });
-            });
-        });
+        var table_name ='table#log-files-list';
+        loadDataTableFiles(table_name, url_json);
+        let params = new URLSearchParams(window.location.search);
+        loadDataTableTrigger(params.get("file"))
+
     });
 
     $(document).on('click', '.btn-load-json-log', function(){

log_viewer/utils.py

@@ -8,20 +8,24 @@
 from log_viewer import settings
 
 
-def get_log_files(directory):
+def get_log_files(directory, max_items_per_page, curr_page):
     result = {}
     for root, _, files in os.walk(directory):
         all_files = list(filter(lambda x: x.find('~') == -1, files))
 
-        log_files = []
-        log_files.extend(list(filter(lambda x: x in settings.LOG_VIEWER_FILES, all_files)))
-        log_files.extend([x for x in all_files if fnmatch(x, settings.LOG_VIEWER_FILES_PATTERN)])
-
+        all_log_files = []
+        all_log_files.extend(list(filter(lambda x: x in settings.LOG_VIEWER_FILES, all_files)))
+        all_log_files.extend([x for x in all_files if fnmatch(x, settings.LOG_VIEWER_FILES_PATTERN)])
         log_dir = os.path.relpath(root, directory)
         if log_dir == '.':
             log_dir = ''
 
-        result[log_dir] = list(set(log_files))
+        result["logs"] = {
+            log_dir: list(set(all_log_files))
+        }
+        result["next_page_files"] = curr_page + 1
+        result["last_files"] = all_log_files.__len__() <= curr_page * max_items_per_page
+
     return result
 
 

log_viewer/views.py

@@ -43,8 +43,11 @@ def get_log_json(self, original_context={}):
         context['next_page'] = page + 1
         context['log_files'] = []
 
-        log_file_data = get_log_files(settings.LOG_VIEWER_FILES_DIR)
-        for log_dir, log_files in log_file_data.items():
+        log_file_data = get_log_files(settings.LOG_VIEWER_FILES_DIR, settings.LOG_VIEWER_FILE_LIST_MAX_ITEMS_PER_PAGE, 1)
+        context['next_page_files'] = log_file_data["next_page_files"]
+        context['last_files'] = log_file_data["last_files"]
+
+        for log_dir, log_files in log_file_data["logs"].items():
             for log_file in log_files:
                 display = os.path.join(log_dir, log_file)
                 uri = os.path.join(settings.LOG_VIEWER_FILES_DIR, display)
@@ -108,7 +111,8 @@ class LogDownloadView(TemplateView):
     def render_to_response(self, context, **response_kwargs):
         # file_name = context.get('file_name', None)
         file_name = self.request.GET.get('file_name', None)
-        log_file_result = get_log_files(settings.LOG_VIEWER_FILES_DIR)
+        log_file_result = get_log_files(settings.LOG_VIEWER_FILES_DIR,
+                                        settings.LOG_VIEWER_FILE_LIST_MAX_ITEMS_PER_PAGE, 1)["logs"]
 
         if file_name:
             file_path = unquote(file_name)
@@ -166,6 +170,7 @@ def get_context_data(self, file_name=None, page=1, **kwargs):
         context['custom_file_list_title'] = settings.LOG_VIEWER_FILE_LIST_TITLE
         context['custom_style_file'] = settings.LOG_VIEWER_FILE_LIST_STYLES
         context['page_length'] = settings.LOG_VIEWER_PAGE_LENGTH
+        context['files_per_page'] = settings.LOG_VIEWER_FILE_LIST_MAX_ITEMS_PER_PAGE
         return context
 
 

setup.py

@@ -28,6 +28,7 @@
         'Framework :: Django :: 2.0',
         'Framework :: Django :: 3.0',
         'Framework :: Django :: 3.1',
+        'Framework :: Django :: 4.0',
         'Intended Audience :: Developers',
         'Operating System :: OS Independent',
         'Programming Language :: Python',
@@ -36,6 +37,7 @@
         'Programming Language :: Python :: 3.5',
         'Programming Language :: Python :: 3.6',
         'Programming Language :: Python :: 3.7',
+        'Programming Language :: Python :: 3.9',
         'Development Status :: 5 - Production/Stable',
         'Topic :: Software Development :: Libraries :: Python Modules',
         'License :: OSI Approved :: MIT License',