logviewer 1.5.1 → 1.6.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: f8784d7513678b085069d4383c9aaed89a93e3e542bc6a053754ccb0814ef784
-  data.tar.gz: 9beac9a4fd089a81ea1f5dd7305ab69813b830e136b954b93899965fe9ff500f
+  metadata.gz: 1b9106af1e9941238180f211dbbc156e1a0399bf5cca0e3f19923e4c7e6ad5d1
+  data.tar.gz: e6af770c419e32950450d7d65d85f43c1f85146d0a76c31615a4a2ed4ddd562b
 SHA512:
-  metadata.gz: 84ac955ffd0d95dcc1f2d3f554911500e616a328bcde2398d80ec9d2fe552a78885c588520b2863e9b99bf28ba2547ee1a5c54ddb2736452a109de80a431cdaf
-  data.tar.gz: ab97e9be8d51a702896c5309422599c55d9ba45b30ee2ffe8e23802817e98779f87220ff48e59ee88f3baec1c9bae1cee16ccf1d75614dbcd1698d31c3926444
+  metadata.gz: cc4e7bfb85ab4faa538250ac7eefde469ee1356c62bb320abfbb43416cc34821c7a586dd2ada1d0a4dfda2c034f8eb09702635b98ef2f6a891444154c1feba3c
+  data.tar.gz: e40ae9a7947dfa360abea65221a691990d893790ba58e572b7e78ecf7cf62060e524a5f7b92f71058e6767445313bd368b679c8ac9e3ea937927f91d894e7bf2

data/README.md

@@ -11,6 +11,7 @@ A Ruby gem that converts NDJSON log files into a readable HTML format for easy v
 - Simplified file paths (shows only filename, not full path)
 - Color-coded log levels for easy identification
 - Large, readable fonts throughout the interface (18px base size)
+- Interactive dynamic filtering by log level in the browser
 - Responsive design that works well in any browser
 - Automatically opens the generated HTML file in your default browser
 
@@ -46,7 +47,7 @@ This will:
 logviewer --level info example.ndjson
 ```
 
-Only shows log entries with level "info" and above (info, warning, error, fatal).
+Only includes log entries with level "info" and above in the HTML file. You can then use the interactive dropdown in the browser to filter further.
 
 ### Auto-Detection of Log Files
 
@@ -104,6 +105,7 @@ Example log entry:
 The generated HTML file will be saved in `/tmp/` with a timestamp and automatically opened in your browser. The HTML includes:
 
 - A wide, responsive table layout (1800px max width) with columns in order: date, level, tag, file, function, text
+- Interactive log level filtering dropdown for dynamic filtering in the browser
 - Human-readable timestamps (MM/DD HH:MM:SS format)
 - Color-coded log levels
 - Sticky header for easy navigation
@@ -114,6 +116,14 @@ The generated HTML file will be saved in `/tmp/` with a timestamp and automatica
 - Date, file, and function names in monospace font
 - Color-coded tags for easy categorization
 
+## Interactive Features
+
+Once the HTML file opens in your browser, you can:
+- Use the dropdown in the header to dynamically filter log entries by minimum level
+- Filter changes are applied instantly without page reload
+- Entry counts update automatically to show how many entries match the current filter
+- Command line level acts as the initial data set - browser filtering works within those entries
+
 ## Development
 
 After checking out the repo, run the following commands to set up development:

data/lib/logviewer/version.rb

@@ -1,3 +1,3 @@
 module LogViewer
-  VERSION = "1.5.1"
+  VERSION = "1.6.1"
 end

data/lib/logviewer.rb

@@ -182,6 +182,7 @@ module LogViewer
                     width: 100%;
                     border-collapse: collapse;
                     font-size: 18px;
+                    table-layout: fixed;
                 }
                 th {
                     background: #e9ecef;
@@ -207,9 +208,9 @@ module LogViewer
                     white-space: nowrap;
                 }
                 .text {
-                    min-width: 600px;
                     word-wrap: break-word;
                     white-space: pre-wrap;
+                    width: auto;
                 }
                 .file {
                     font-family: 'Monaco', 'Menlo', monospace;
@@ -223,6 +224,9 @@ module LogViewer
                     font-size: 16px;
                     color: #333;
                     font-weight: 500;
+                    max-width: 300px;
+                    word-wrap: break-word;
+                    overflow-wrap: break-word;
                 }
                 .timestamp {
                     font-family: 'Monaco', 'Menlo', monospace;
@@ -248,6 +252,24 @@ module LogViewer
                 <div class="header">
                     <h1>Log Viewer</h1>
                     <p>#{File.basename(@input_file)} • #{logs.length} entries • Level: #{@min_level.upcase}+</p>
+                    <div style="margin-top: 15px;">
+                        <label for="levelFilter" style="color: white; margin-right: 10px;">Filter by level:</label>
+                        <select id="levelFilter" style="padding: 5px; font-size: 14px; border-radius: 4px; border: none;">
+      HTML
+
+    # Generate dropdown options only for levels >= command line minimum
+    min_level_num = LOG_LEVELS[@min_level]
+    LOG_LEVELS.each do |level, level_num|
+      if level_num >= min_level_num
+        html += <<~HTML
+                            <option value="#{level}">#{level.upcase}+</option>
+        HTML
+      end
+    end
+
+    html += <<~HTML
+                        </select>
+                    </div>
                 </div>
                 <div class="table-container">
                     <table>
@@ -257,8 +279,8 @@ module LogViewer
                                 <th style="width: 80px;">Level</th>
                                 <th style="width: 120px;">Tag</th>
                                 <th style="width: 180px;">File</th>
-                                <th style="width: 100px;">Function</th>
-                                <th>Text</th>
+                                <th style="width: 300px;">Function</th>
+                                <th style="width: auto;">Text</th>
                             </tr>
                         </thead>
                         <tbody>
@@ -275,7 +297,7 @@ module LogViewer
         method_content = log[:method].empty? ? '<span class="empty">-</span>' : log[:method]
         
         html += <<~HTML
-                                <tr>
+                                <tr data-level="#{log[:level].downcase}" data-level-num="#{LOG_LEVELS[log[:level].downcase] || 0}">
                                     <td class="timestamp">#{timestamp_content}</td>
                                     <td class="level" style="#{level_style}">#{log[:level]}</td>
                                     <td class="tag">#{tag_content}</td>
@@ -291,6 +313,51 @@ module LogViewer
                     </table>
                 </div>
             </div>
+          
+            <script>
+                const LOG_LEVELS = {
+                    'trace': 0,
+                    'debug': 1,
+                    'info': 2,
+                    'warning': 3,
+                    'error': 4,
+                    'fatal': 5
+                };
+              
+                const levelFilter = document.getElementById('levelFilter');
+                const tableRows = document.querySelectorAll('tbody tr');
+              
+                // Set initial filter to match command line parameter
+                levelFilter.value = '#{@min_level}';
+              
+                function filterByLevel() {
+                    const selectedLevel = levelFilter.value;
+                    const selectedLevelNum = LOG_LEVELS[selectedLevel];
+                    let visibleCount = 0;
+                  
+                    tableRows.forEach(row => {
+                        const rowLevelNum = parseInt(row.dataset.levelNum);
+                        if (rowLevelNum >= selectedLevelNum) {
+                            row.style.display = '';
+                            visibleCount++;
+                        } else {
+                            row.style.display = 'none';
+                        }
+                    });
+                  
+                    // Update the header count
+                    const header = document.querySelector('.header p');
+                    const originalText = header.textContent.split(' • ');
+                    originalText[1] = visibleCount + ' entries';
+                    originalText[2] = 'Level: ' + selectedLevel.toUpperCase() + '+';
+                    header.textContent = originalText.join(' • ');
+                }
+              
+                levelFilter.addEventListener('change', filterByLevel);
+              
+                // Apply initial filter
+                filterByLevel();
+            </script>
         </body>
         </html>
       HTML

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: logviewer
 version: !ruby/object:Gem::Version
-  version: 1.5.1
+  version: 1.6.1
 platform: ruby
 authors:
 - Justin Bishop