-
Welcome to LogVPro! Use the left menu to select a log file
-
+
+
+
+
+
+
+
+
+
+
Please select a log file from the dropdown menu to view analysis and summary.
+
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Notes: Some log files might be huge. Make sure you have checked the log file size before opening
-
-
Notes: Some log files might be huge. Make sure you have checked the log file size before opening
@@ -247,14 +266,14 @@ Pick a log file from the menu to start debugging
/* Menu Subpanel Switch */
$(".subpanel").hide();
- $("#dashboard").show();
+ $("#logviewer").show();
$(".panel_menu_btn").on("click", function() {
var id = $(this).attr("id");
$(".subpanel").hide();
$(".ui.menu .item").removeClass("active");
$(this).addClass("active");
- if (id === "dashboardMenu") {
- $("#dashboard").show();
+ if (id === "summaryMenu") {
+ $("#summary").show();
} else if (id === "logViewMenu") {
$("#logviewer").show();
} else if (id === "settingsMenu") {
@@ -276,12 +295,18 @@ Pick a log file from the menu to start debugging
});
}
$('#logfileDropdown').dropdown('refresh');
+
+ //let firstItem = $menu.find('.item').first();
+ //if (firstItem.length) {
+ // $('#logfileDropdown').dropdown('set selected', firstItem.data('value'));
+ //}
});
}
$('#logfileDropdown').dropdown({
onChange: function(value, text, $choice) {
if (value) {
openLog(null, $choice.data('category'), value, currentFilter || "all");
+ loadLogSummary(value);
}
}
});
@@ -333,6 +358,198 @@ Pick a log file from the menu to start debugging
});
});
+ /* Analyzer */
+ function loadLogSummary(filename){
+ $.get("/api/log/summary?file=" + filename, function(data){
+ if (data.error !== undefined){
+ $("#analyzer").html("
");
+ return;
+ }
+
+ $("#successRequestsCount").text(data.total_valid || 0);
+ $("#errorRequestsCount").text(data.total_errors || 0);
+ $("#totalRequestsCount").text(data.total_requests || 0);
+ renderSummaryToHTML(data);
+ });
+
+ $.get("/api/log/errors?file=" + encodeURIComponent(filename), function(data) {
+ renderErrorHighlights(data);
+ }).fail(function() {
+ $("#errorHighlightWrapper").html(
+ `
+
+
`
+ );
+ });
+
+ }
+
+ function renderSummaryToHTML(data){
+ /* Render summary analysis to #analyzer */
+ let html = `
+
+
+
+
+
+
+
+
+ | IP | Requests |
|---|
+
+ ${Object.entries(data.unique_ips)
+ .sort((a, b) => b[1] - a[1])
+ .map(([ip, count]) => `| ${ip} | ${count} |
`)
+ .join("")}
+
+
+
+
+
+
+ | User Agent | Requests |
|---|
+
+ ${Object.entries(data.top_user_agents)
+ .sort((a, b) => b[1] - a[1])
+ .map(([ua, count]) => `| ${ua} | ${count} |
`)
+ .join("")}
+
+
+
+
+
+
+
+
+
+ | Path | Requests |
|---|
+
+ ${Object.entries(data.top_paths)
+ .sort((a, b) => b[1] - a[1])
+ .map(([path, count]) => `| ${path} | ${count} |
`)
+ .join("")}
+
+
+
+
+ `;
+
+ $("#analyzer").html(html);
+
+ // Load Chart.js if not loaded
+ function loadChartJs(cb) {
+ if (window.Chart) { cb(); return; }
+ let s = document.createElement("script");
+ s.src = "https://cdn.jsdelivr.net/npm/chart.js";
+ s.onload = cb;
+ document.head.appendChild(s);
+ }
+
+ // Prepare data for charts
+ function getDateRangeLabels(hitPerDay) {
+ let dates = Object.keys(hitPerDay).sort();
+ if (dates.length === 0) return [];
+ let start = new Date(dates[0]);
+ let end = new Date(dates[dates.length - 1]);
+ let labels = [];
+ for (let d = new Date(start); d <= end; d.setDate(d.getDate() + 1)) {
+ let y = d.getFullYear(), m = (d.getMonth() + 1).toString().padStart(2, "0"), day = d.getDate().toString().padStart(2, "0");
+ labels.push(`${y}-${m}-${day}`);
+ }
+ return labels;
+ }
+
+ loadChartJs(function() {
+ // 1. Pie chart for request methods
+ let reqMethods = data.request_methods || {};
+ let reqLabels = Object.keys(reqMethods);
+ let reqCounts = Object.values(reqMethods);
+ new Chart(document.getElementById("requestMethodsChart"), {
+ type: "pie",
+ data: {
+ labels: reqLabels,
+ datasets: [{
+ data: reqCounts,
+ backgroundColor: ["#4b75ff", "#21ba45", "#db2828", "#fbbd08", "#b5cc18", "#a333c8"]
+ }]
+ },
+ options: { responsive: true, plugins: { legend: { position: "bottom" } } }
+ });
+
+ // 2. Histogram for hit_per_day
+ let hitPerDay = data.hit_per_day || {};
+ let dayLabels = getDateRangeLabels(hitPerDay);
+ let dayCounts = dayLabels.map(d => hitPerDay[d] || 0);
+ new Chart(document.getElementById("hitsPerDayChart"), {
+ type: "bar",
+ data: {
+ labels: dayLabels,
+ datasets: [{
+ label: "Hits",
+ data: dayCounts,
+ backgroundColor: "#4b75ff"
+ }]
+ },
+ options: {
+ responsive: true,
+ plugins: { legend: { display: false } },
+ scales: { x: { ticks: { autoSkip: false, maxRotation: 90, minRotation: 45 } } }
+ }
+ });
+
+ // 3. Line chart for each site in hit_per_site
+ let siteChartsDiv = $("#siteCharts");
+ let siteData = data.hit_per_site || {};
+ let i = 0;
+ for (let [site, counts] of Object.entries(siteData)) {
+ let canvasId = "siteChart_" + i;
+ siteChartsDiv.append(`
+
+ ${site}
+
+
+ `);
+ // If counts length doesn't match dayLabels, pad left with zeros
+ let paddedCounts = counts.slice(-dayLabels.length);
+ while (paddedCounts.length < dayLabels.length) paddedCounts.unshift(0);
+ new Chart(document.getElementById(canvasId), {
+ type: "line",
+ data: {
+ labels: dayLabels,
+ datasets: [{
+ label: "Hits",
+ data: paddedCounts,
+ fill: false,
+ borderColor: "#21ba45",
+ backgroundColor: "#21ba45",
+ tension: 0.2
+ }]
+ },
+ options: {
+ responsive: true,
+ plugins: { legend: { display: false } },
+ scales: { x: { ticks: { autoSkip: false, maxRotation: 90, minRotation: 45 } } }
+ }
+ });
+ i++;
+ }
+ });
+ }
+
function openLog(object, catergory, filename, filter="all"){
$(".logfile.active").removeClass('active');
@@ -347,48 +564,13 @@ Pick a log file from the menu to start debugging
renderLogWithCurrentFilter(data);
});
}
-
-
\ No newline at end of file