aprsd 1.0.0__py3-none-any.whl → 3.4.2__py3-none-any.whl

aprsd/web/admin/static/js/charts.js

@@ -0,0 +1,235 @@
+var packet_list = {};
+
+window.chartColors = {
+    red: 'rgb(255, 99, 132)',
+    orange: 'rgb(255, 159, 64)',
+    yellow: 'rgb(255, 205, 86)',
+    green: 'rgb(26, 181, 77)',
+    blue: 'rgb(54, 162, 235)',
+    purple: 'rgb(153, 102, 255)',
+    grey: 'rgb(201, 203, 207)',
+    black: 'rgb(0, 0, 0)',
+    lightcoral: 'rgb(240,128,128)',
+    darkseagreen: 'rgb(143, 188,143)'
+
+};
+
+function size_dict(d){c=0; for (i in d) ++c; return c}
+
+function start_charts() {
+    Chart.scaleService.updateScaleDefaults('linear', {
+        ticks: {
+            min: 0
+        }
+    });
+
+    packets_chart = new Chart($("#packetsChart"), {
+        label: 'APRS Packets',
+        type: 'line',
+        data: {
+            labels: [],
+            datasets: [{
+                label: 'Packets Sent',
+                borderColor: window.chartColors.lightcoral,
+                data: [],
+            },
+            {
+                label: 'Packets Recieved',
+                borderColor: window.chartColors.darkseagreen,
+                data: [],
+            }]
+        },
+        options: {
+            responsive: true,
+            maintainAspectRatio: false,
+            title: {
+                display: true,
+                text: 'APRS Packets',
+            },
+            scales: {
+                x: {
+                    type: 'timeseries',
+                    offset: true,
+                    ticks: {
+                        major: { enabled: true },
+                        fontStyle: context => context.tick.major ? 'bold' : undefined,
+                        source: 'data',
+                        maxRotation: 0,
+                        autoSkip: true,
+                        autoSkipPadding: 75,
+                    }
+                }
+            }
+        }
+    });
+
+    message_chart = new Chart($("#messageChart"), {
+        label: 'Messages',
+        type: 'line',
+        data: {
+            labels: [],
+            datasets: [{
+                label: 'Messages Sent',
+                borderColor: window.chartColors.lightcoral,
+                data: [],
+            },
+            {
+                label: 'Messages Recieved',
+                borderColor: window.chartColors.darkseagreen,
+                data: [],
+            },
+            {
+                label: 'Ack Sent',
+                borderColor: window.chartColors.purple,
+                data: [],
+            },
+            {
+                label: 'Ack Recieved',
+                borderColor: window.chartColors.black,
+                data: [],
+            }],
+        },
+        options: {
+            responsive: true,
+            maintainAspectRatio: false,
+            title: {
+                display: true,
+                text: 'APRS Messages',
+            },
+            scales: {
+                x: {
+                    type: 'timeseries',
+                    offset: true,
+                    ticks: {
+                        major: { enabled: true },
+                        fontStyle: context => context.tick.major ? 'bold' : undefined,
+                        source: 'data',
+                        maxRotation: 0,
+                        autoSkip: true,
+                        autoSkipPadding: 75,
+                    }
+                }
+            }
+        }
+    });
+
+    email_chart = new Chart($("#emailChart"), {
+        label: 'Email Messages',
+        type: 'line',
+        data: {
+            labels: [],
+            datasets: [{
+                label: 'Sent',
+                borderColor: window.chartColors.lightcoral,
+                data: [],
+            },
+            {
+                label: 'Recieved',
+                borderColor: window.chartColors.darkseagreen,
+                data: [],
+            }],
+        },
+        options: {
+            responsive: true,
+            maintainAspectRatio: false,
+            title: {
+                display: true,
+                text: 'Email Messages',
+            },
+            scales: {
+                x: {
+                    type: 'timeseries',
+                    offset: true,
+                    ticks: {
+                        major: { enabled: true },
+                        fontStyle: context => context.tick.major ? 'bold' : undefined,
+                        source: 'data',
+                        maxRotation: 0,
+                        autoSkip: true,
+                        autoSkipPadding: 75,
+                    }
+                }
+            }
+        }
+    });
+
+    memory_chart = new Chart($("#memChart"), {
+        label: 'Memory Usage',
+        type: 'line',
+        data: {
+            labels: [],
+            datasets: [{
+                label: 'Peak Ram usage',
+                borderColor: window.chartColors.red,
+                data: [],
+            },
+            {
+                label: 'Current Ram usage',
+                borderColor: window.chartColors.blue,
+                data: [],
+            }],
+        },
+        options: {
+            responsive: true,
+            maintainAspectRatio: false,
+            title: {
+                display: true,
+                text: 'Memory Usage',
+            },
+            scales: {
+                x: {
+                    type: 'timeseries',
+                    offset: true,
+                    ticks: {
+                        major: { enabled: true },
+                        fontStyle: context => context.tick.major ? 'bold' : undefined,
+                        source: 'data',
+                        maxRotation: 0,
+                        autoSkip: true,
+                        autoSkipPadding: 75,
+                    }
+                }
+            }
+        }
+    });
+}
+
+
+function addData(chart, label, newdata) {
+    chart.data.labels.push(label);
+    chart.data.datasets.forEach((dataset) => {
+        dataset.data.push(newdata);
+    });
+    chart.update();
+}
+
+function updateDualData(chart, label, first, second) {
+    chart.data.labels.push(label);
+    chart.data.datasets[0].data.push(first);
+    chart.data.datasets[1].data.push(second);
+    chart.update();
+}
+function updateQuadData(chart, label, first, second, third, fourth) {
+    chart.data.labels.push(label);
+    chart.data.datasets[0].data.push(first);
+    chart.data.datasets[1].data.push(second);
+    chart.data.datasets[2].data.push(third);
+    chart.data.datasets[3].data.push(fourth);
+    chart.update();
+}
+
+function update_stats( data ) {
+    our_callsign = data["APRSDStats"]["callsign"];
+    $("#version").text( data["APRSDStats"]["version"] );
+    $("#aprs_connection").html( data["aprs_connection"] );
+    $("#uptime").text( "uptime: " + data["APRSDStats"]["uptime"] );
+    const html_pretty = Prism.highlight(JSON.stringify(data, null, '\t'), Prism.languages.json, 'json');
+    $("#jsonstats").html(html_pretty);
+    short_time = data["time"].split(/\s(.+)/)[1];
+    packet_list = data["PacketList"]["packets"];
+    updateDualData(packets_chart, short_time, data["PacketList"]["sent"], data["PacketList"]["received"]);
+    updateQuadData(message_chart, short_time, packet_list["MessagePacket"]["tx"], packet_list["MessagePacket"]["rx"],
+     packet_list["AckPacket"]["tx"], packet_list["AckPacket"]["rx"]);
+    updateDualData(email_chart, short_time, data["EmailStats"]["sent"], data["EmailStats"]["recieved"]);
+    updateDualData(memory_chart, short_time, data["APRSDStats"]["memory_peak"], data["APRSDStats"]["memory_current"]);
+}

aprsd/web/admin/static/js/echarts.js

@@ -0,0 +1,465 @@
+var packet_list = {};
+
+var tx_data = [];
+var rx_data = [];
+
+var packet_types_data = {};
+
+var mem_current = []
+var mem_peak = []
+
+var thread_current = []
+
+
+function start_charts() {
+    console.log("start_charts() called");
+    // Initialize the echarts instance based on the prepared dom
+    create_packets_chart();
+    create_packets_types_chart();
+    create_messages_chart();
+    create_ack_chart();
+    create_memory_chart();
+    create_thread_chart();
+}
+
+
+function create_packets_chart() {
+    // The packets totals TX/RX chart.
+    pkt_c_canvas = document.getElementById('packetsChart');
+    packets_chart = echarts.init(pkt_c_canvas);
+
+    // Specify the configuration items and data for the chart
+    var option = {
+      title: {
+          text: 'APRS Packet totals'
+      },
+      legend: {},
+      tooltip : {
+        trigger: 'axis'
+      },
+      toolbox: {
+        show : true,
+        feature : {
+           mark : {show: true},
+           dataView : {show: true, readOnly: true},
+           magicType : {show: true, type: ['line', 'bar']},
+           restore : {show: true},
+           saveAsImage : {show: true}
+        }
+      },
+      calculable : true,
+      xAxis: { type: 'time' },
+      yAxis: { },
+      series: [
+          {
+             name: 'tx',
+             type: 'line',
+             smooth: true,
+             color: 'red',
+             encode: {
+               x: 'timestamp',
+               y: 'tx' // refer sensor 1 value
+             }
+          },{
+             name: 'rx',
+             type: 'line',
+             smooth: true,
+             encode: {
+               x: 'timestamp',
+               y: 'rx'
+          }
+      }]
+    };
+
+    // Display the chart using the configuration items and data just specified.
+    packets_chart.setOption(option);
+}
+
+
+function create_packets_types_chart() {
+    // The packets types chart
+    pkt_types_canvas = document.getElementById('packetTypesChart');
+    packet_types_chart = echarts.init(pkt_types_canvas);
+
+    // The series and data are built and updated on the fly
+    // as packets come in.
+    var option = {
+      title: {
+          text: 'Packet Types'
+      },
+      legend: {},
+      tooltip : {
+        trigger: 'axis'
+      },
+      toolbox: {
+        show : true,
+        feature : {
+           mark : {show: true},
+           dataView : {show: true, readOnly: true},
+           magicType : {show: true, type: ['line', 'bar']},
+           restore : {show: true},
+           saveAsImage : {show: true}
+        }
+      },
+      calculable : true,
+      xAxis: { type: 'time' },
+      yAxis: { },
+    }
+
+    packet_types_chart.setOption(option);
+}
+
+
+function create_messages_chart() {
+    msg_c_canvas = document.getElementById('messagesChart');
+    message_chart = echarts.init(msg_c_canvas);
+
+    // Specify the configuration items and data for the chart
+    var option = {
+      title: {
+          text: 'Message Packets'
+      },
+      legend: {},
+      tooltip: {
+        trigger: 'axis'
+      },
+      toolbox: {
+        show: true,
+        feature: {
+           mark : {show: true},
+           dataView : {show: true, readOnly: true},
+           magicType : {show: true, type: ['line', 'bar']},
+           restore : {show: true},
+           saveAsImage : {show: true}
+        }
+      },
+      calculable: true,
+      xAxis: { type: 'time' },
+      yAxis: { },
+      series: [
+          {
+             name: 'tx',
+             type: 'line',
+             smooth: true,
+             color: 'red',
+             encode: {
+               x: 'timestamp',
+               y: 'tx' // refer sensor 1 value
+             }
+          },{
+             name: 'rx',
+             type: 'line',
+             smooth: true,
+             encode: {
+               x: 'timestamp',
+               y: 'rx'
+          }
+      }]
+    };
+
+    // Display the chart using the configuration items and data just specified.
+    message_chart.setOption(option);
+}
+
+function create_ack_chart() {
+    ack_canvas = document.getElementById('acksChart');
+    ack_chart = echarts.init(ack_canvas);
+
+    // Specify the configuration items and data for the chart
+    var option = {
+      title: {
+          text: 'Ack Packets'
+      },
+      legend: {},
+      tooltip: {
+        trigger: 'axis'
+      },
+      toolbox: {
+        show: true,
+        feature: {
+           mark : {show: true},
+           dataView : {show: true, readOnly: false},
+           magicType : {show: true, type: ['line', 'bar']},
+           restore : {show: true},
+           saveAsImage : {show: true}
+        }
+      },
+      calculable: true,
+      xAxis: { type: 'time' },
+      yAxis: { },
+      series: [
+          {
+             name: 'tx',
+             type: 'line',
+             smooth: true,
+             color: 'red',
+             encode: {
+               x: 'timestamp',
+               y: 'tx' // refer sensor 1 value
+             }
+          },{
+             name: 'rx',
+             type: 'line',
+             smooth: true,
+             encode: {
+               x: 'timestamp',
+               y: 'rx'
+          }
+      }]
+    };
+
+    ack_chart.setOption(option);
+}
+
+function create_memory_chart() {
+    ack_canvas = document.getElementById('memChart');
+    memory_chart = echarts.init(ack_canvas);
+
+    // Specify the configuration items and data for the chart
+    var option = {
+      title: {
+          text: 'Memory Usage'
+      },
+      legend: {},
+      tooltip: {
+        trigger: 'axis'
+      },
+      toolbox: {
+        show: true,
+        feature: {
+           mark : {show: true},
+           dataView : {show: true, readOnly: false},
+           magicType : {show: true, type: ['line', 'bar']},
+           restore : {show: true},
+           saveAsImage : {show: true}
+        }
+      },
+      calculable: true,
+      xAxis: { type: 'time' },
+      yAxis: { },
+      series: [
+          {
+             name: 'current',
+             type: 'line',
+             smooth: true,
+             color: 'red',
+             encode: {
+               x: 'timestamp',
+               y: 'current' // refer sensor 1 value
+             }
+          },{
+             name: 'peak',
+             type: 'line',
+             smooth: true,
+             encode: {
+               x: 'timestamp',
+               y: 'peak'
+          }
+      }]
+    };
+
+    memory_chart.setOption(option);
+}
+
+function create_thread_chart() {
+    thread_canvas = document.getElementById('threadChart');
+    thread_chart = echarts.init(thread_canvas);
+
+    // Specify the configuration items and data for the chart
+    var option = {
+      title: {
+          text: 'Active Threads'
+      },
+      legend: {},
+      tooltip: {
+        trigger: 'axis'
+      },
+      toolbox: {
+        show: true,
+        feature: {
+           mark : {show: true},
+           dataView : {show: true, readOnly: false},
+           magicType : {show: true, type: ['line', 'bar']},
+           restore : {show: true},
+           saveAsImage : {show: true}
+        }
+      },
+      calculable: true,
+      xAxis: { type: 'time' },
+      yAxis: { },
+      series: [
+          {
+             name: 'current',
+             type: 'line',
+             smooth: true,
+             color: 'red',
+             encode: {
+               x: 'timestamp',
+               y: 'current' // refer sensor 1 value
+             }
+          }
+      ]
+    };
+
+    thread_chart.setOption(option);
+}
+
+
+
+
+function updatePacketData(chart, time, first, second) {
+    tx_data.push([time, first]);
+    rx_data.push([time, second]);
+    option = {
+        series: [
+          {
+            name: 'tx',
+            data: tx_data,
+          },
+          {
+            name: 'rx',
+            data: rx_data,
+          }
+        ]
+    }
+    chart.setOption(option);
+}
+
+function updatePacketTypesData(time, typesdata) {
+    //The options series is created on the fly each time based on
+    //the packet types we have in the data
+    var series = []
+
+    for (const k in typesdata) {
+        tx = [time, typesdata[k]["tx"]]
+        rx = [time, typesdata[k]["rx"]]
+
+        if (packet_types_data.hasOwnProperty(k)) {
+            packet_types_data[k]["tx"].push(tx)
+            packet_types_data[k]["rx"].push(rx)
+        } else {
+            packet_types_data[k] = {'tx': [tx], 'rx': [rx]}
+        }
+    }
+}
+
+function updatePacketTypesChart() {
+  series = []
+  for (const k in packet_types_data) {
+      entry = {
+          name: k+"tx",
+          data: packet_types_data[k]["tx"],
+          type: 'line',
+          smooth: true,
+          encode: {
+            x: 'timestamp',
+            y: k+'tx' // refer sensor 1 value
+          }
+      }
+      series.push(entry)
+      entry = {
+          name: k+"rx",
+          data: packet_types_data[k]["rx"],
+          type: 'line',
+          smooth: true,
+          encode: {
+            x: 'timestamp',
+            y: k+'rx' // refer sensor 1 value
+          }
+      }
+      series.push(entry)
+  }
+
+  option = {
+      series: series
+  }
+  packet_types_chart.setOption(option);
+}
+
+function updateTypeChart(chart, key)  {
+    //Generic function to update a packet type chart
+    if (! packet_types_data.hasOwnProperty(key)) {
+        return;
+    }
+
+    if (! packet_types_data[key].hasOwnProperty('tx')) {
+        return;
+    }
+    var option = {
+        series: [{
+            name: "tx",
+            data: packet_types_data[key]["tx"],
+        },
+        {
+            name: "rx",
+            data: packet_types_data[key]["rx"]
+        }]
+    }
+
+   chart.setOption(option);
+}
+
+function updateMemChart(time, current, peak) {
+    mem_current.push([time, current]);
+    mem_peak.push([time, peak]);
+    option = {
+        series: [
+          {
+            name: 'current',
+            data: mem_current,
+          },
+          {
+            name: 'peak',
+            data: mem_peak,
+          }
+        ]
+    }
+    memory_chart.setOption(option);
+}
+
+function updateThreadChart(time, threads) {
+    keys = Object.keys(threads);
+    thread_count = keys.length;
+    thread_current.push([time, thread_count]);
+    option = {
+        series: [
+              {
+                name: 'current',
+                data: thread_current,
+              }
+            ]
+    }
+    thread_chart.setOption(option);
+}
+
+function updateMessagesChart() {
+    updateTypeChart(message_chart, "MessagePacket")
+}
+
+function updateAcksChart() {
+    updateTypeChart(ack_chart, "AckPacket")
+}
+
+function update_stats( data ) {
+    console.log("update_stats() echarts.js called")
+    stats = data["stats"];
+    our_callsign = stats["APRSDStats"]["callsign"];
+    $("#version").text( stats["APRSDStats"]["version"] );
+    $("#aprs_connection").html( stats["aprs_connection"] );
+    $("#uptime").text( "uptime: " + stats["APRSDStats"]["uptime"] );
+    const html_pretty = Prism.highlight(JSON.stringify(data, null, '\t'), Prism.languages.json, 'json');
+    $("#jsonstats").html(html_pretty);
+
+    t = Date.parse(data["time"]);
+    ts = new Date(t);
+    updatePacketData(packets_chart, ts, stats["PacketList"]["tx"], stats["PacketList"]["rx"]);
+    updatePacketTypesData(ts, stats["PacketList"]["types"]);
+    updatePacketTypesChart();
+    updateMessagesChart();
+    updateAcksChart();
+    updateMemChart(ts, stats["APRSDStats"]["memory_current"], stats["APRSDStats"]["memory_peak"]);
+    updateThreadChart(ts, stats["APRSDThreadList"]);
+    //updateQuadData(message_chart, short_time, data["stats"]["messages"]["sent"], data["stats"]["messages"]["received"], data["stats"]["messages"]["ack_sent"], data["stats"]["messages"]["ack_recieved"]);
+    //updateDualData(email_chart, short_time, data["stats"]["email"]["sent"], data["stats"]["email"]["recieved"]);
+    //updateDualData(memory_chart, short_time, data["stats"]["aprsd"]["memory_peak"], data["stats"]["aprsd"]["memory_current"]);
+}