Skip to content

Commit

Permalink
History js
Browse files Browse the repository at this point in the history
  • Loading branch information
aceberg committed Aug 24, 2024
1 parent 0d10123 commit b86ee2b
Show file tree
Hide file tree
Showing 11 changed files with 143 additions and 123 deletions.
12 changes: 6 additions & 6 deletions internal/conf/getconfig.go
Original file line number Diff line number Diff line change
Expand Up @@ -16,10 +16,10 @@ func Get(path string) (config models.Conf) {
viper.SetDefault("COLOR", "dark")
viper.SetDefault("NODEPATH", "")
// viper.SetDefault("SCANER", "arpscan")
viper.SetDefault("ARPARGS", "")
viper.SetDefault("ARP_ARGS", "")
viper.SetDefault("IFACES", "")
viper.SetDefault("TIMEOUT", 60)
viper.SetDefault("IGNOREIP", "no")
viper.SetDefault("TRIM_HIST", 48)

viper.SetConfigFile(path)
viper.SetConfigType("yaml")
Expand All @@ -34,10 +34,10 @@ func Get(path string) (config models.Conf) {
config.Color = viper.Get("COLOR").(string)
config.NodePath = viper.Get("NODEPATH").(string)
// config.Scaner = viper.Get("SCANER").(string)
config.ArpArgs = viper.Get("ARPARGS").(string)
config.ArpArgs = viper.Get("ARP_ARGS").(string)
config.Ifaces = viper.Get("IFACES").(string)
config.Timeout = viper.GetInt("TIMEOUT")
config.IgnoreIP = viper.Get("IGNOREIP").(string)
config.TrimHist = viper.GetInt("TRIM_HIST")

return config
}
Expand All @@ -54,10 +54,10 @@ func Write(config models.Conf) {
viper.Set("COLOR", config.Color)
viper.Set("NODEPATH", config.NodePath)
// viper.Set("SCANER", config.Scaner)
viper.Set("ARPARGS", config.ArpArgs)
viper.Set("ARP_ARGS", config.ArpArgs)
viper.Set("IFACES", config.Ifaces)
viper.Set("TIMEOUT", config.Timeout)
viper.Set("IGNOREIP", config.IgnoreIP)
viper.Set("TRIM_HIST", config.TrimHist)

err := viper.WriteConfig()
check.IfError(err)
Expand Down
2 changes: 1 addition & 1 deletion internal/models/models.go
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ type Conf struct {
// Scaner string
ArpArgs string
Timeout int
IgnoreIP string
TrimHist int
}

// Host - one host
Expand Down
7 changes: 6 additions & 1 deletion internal/web/config.go
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ package web
import (
"log/slog"
"net/http"
"strconv"

"github.com/gin-gonic/gin"

Expand Down Expand Up @@ -34,10 +35,14 @@ func saveConfigHandler(c *gin.Context) {
appConfig.Theme = c.PostForm("theme")
appConfig.Color = c.PostForm("color")
appConfig.NodePath = c.PostForm("node")
appConfig.IgnoreIP = c.PostForm("ignore")
appConfig.ArpArgs = c.PostForm("arpargs")
appConfig.Ifaces = c.PostForm("ifaces")

timeout := c.PostForm("timeout")
trimHist := c.PostForm("trim")
appConfig.Timeout, _ = strconv.Atoi(timeout)
appConfig.TrimHist, _ = strconv.Atoi(trimHist)

conf.Write(appConfig)

slog.Info("writing new config to " + appConfig.ConfPath)
Expand Down
20 changes: 20 additions & 0 deletions internal/web/public/js/hist-html.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@

function getHistHTML(hist) {

let html = '', col, title;

for (let h of hist) {
if (h.Now != 0) {
col = `fill:var(--bs-success);stroke:var(--bs-primary);`;
} else {
col = `fill:var(--bs-gray-500);stroke:var(--bs-primary);`;
}
title = `title="Date: ${h.Date}\nIface: ${h.Iface}\nIP: ${h.IP}\nKnown: ${h.Known}"`;

html = html + `<i ${title}><svg width="10" height="20">
<rect width="10" height="20" style="${col}"/>
Sorry, your browser does not support inline SVG.
</svg></i>`;
}
return html;
}
82 changes: 48 additions & 34 deletions internal/web/public/js/history.js
Original file line number Diff line number Diff line change
@@ -1,46 +1,60 @@
var addrsArray = {};
let show = 500;
let addrsArray;

loadAddrs();

function createHTML(addr, i) {
let now = '';

if (addr.Now == 0) {
now = `<i class="bi bi-circle-fill" style="color:var(--bs-gray-500);"></i>`;
} else {
now = `<i class="bi bi-check-circle-fill" style="color:var(--bs-success);"></i>`;
}

let html = `
<tr>
<td style="opacity: 45%;">${i}.</td>
<td>${addr.Name}</td>
<td>${addr.Iface}</td>
<td>
<a href="http://${addr.IP}">${addr.IP}</a>
</td>
<td>${addr.Mac}</td>
<td>${addr.Hw}</td>
<td>${addr.Date}</td>
<td>${addr.Known}</td>
<td>${now}</td>
</tr>
`;
async function loadAddrs() {

return html;
const n = localStorage.getItem("histShow");
if (n != null) {
show = n;
}

const url = '/api/all';
addrsArray = await (await fetch(url)).json();

loadHistory();
}

async function loadAddrs() {
async function loadHistory() {

let url = '/api/history';
let addrsMap = await (await fetch(url)).json();
if (addrsMap != null) {
addrsArray = Object.values(addrsMap);
let tr, td, url, hist;
let i = 0;

document.getElementById('showHist').innerHTML = '';

for (let a of addrsArray) {
url = '/api/history/'+a.Mac;
hist = await (await fetch(url)).json();
if (show > 0) {
hist = hist.slice(0, show);
}

td = getHistHTML(hist); // hist-html.js
i = i + 1;

tr = `
<tr>
<td style="opacity: 45%;">${i}.</td>
<td>
<p>${a.Name}</p>
<p><a href="http://${a.IP}" target="blank">${a.IP}</a></p>
<p><a href="/host/${a.ID}">${a.Mac}</a></p>
</td>
<td>${td}</td>
</tr>`;

document.getElementById('showHist').insertAdjacentHTML('beforeend', tr);
}
}

displayArrayData(addrsArray);
function showHist(n) {
show = n;
localStorage.setItem("histShow", show);
loadHistory();
}

function sortBy(field) {
sortByAny(addrsArray, field);
function manualShow() {
const n = document.getElementById('man-show').value;
showHist(n);
}
39 changes: 22 additions & 17 deletions internal/web/public/js/host.js
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
let show = 500;
let mac;

async function delHost(id) {

Expand All @@ -8,34 +10,37 @@ async function delHost(id) {
window.location.href = '/';
}

async function loadHistory(mac) {
async function loadHistory(m) {

const n = localStorage.getItem("hostShow");
if (n != null) {
show = n;
}

mac = m;
const url = '/api/history/'+mac;

let hist = await (await fetch(url)).json();
if (show > 0) {
hist = hist.slice(0, show);
}

// console.log("HIST", hist);
displayHistory(hist);
}

function displayHistory(hist) {

let html, col, title;

for (let h of hist) {
if (h.Now != 0) {
col = `fill:var(--bs-success);stroke:var(--bs-primary);`;
} else {
col = `fill:var(--bs-gray-500);stroke:var(--bs-primary);`;
}
title = `title="Date: ${h.Date}\nIface: ${h.Iface}\nIP: ${h.IP}\nKnown: ${h.Known}"`;
document.getElementById('showHist').innerHTML = getHistHTML(hist); // hist-html.js
}

html = `<i ${title}><svg width="10" height="20">
<rect width="10" height="20" style="${col}"/>
Sorry, your browser does not support inline SVG.
</svg></i>`;
function showHist(n) {
show = n;
localStorage.setItem("hostShow", show);
loadHistory(mac);
}

// html = `<i class="bi bi-file-fill" style="${col}" ${title}></i>`;
document.getElementById('showHist').insertAdjacentHTML('beforeend', html);
}
function manualShow() {
const n = document.getElementById('man-show').value;
showHist(n);
}
2 changes: 1 addition & 1 deletion internal/web/public/js/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ function createHTML(addr, i) {
<td>${name}</td>
<td>${addr.Iface}</td>
<td>
<a href="http://${addr.IP}">${addr.IP}</a>
<a href="http://${addr.IP}" target="blank">${addr.IP}</a>
</td>
<td><a href="/host/${addr.ID}">${addr.Mac}</a></td>
<td>${addr.Hw}</td>
Expand Down
45 changes: 0 additions & 45 deletions internal/web/public/js/old_history.js

This file was deleted.

12 changes: 6 additions & 6 deletions internal/web/templates/config.html
Original file line number Diff line number Diff line change
Expand Up @@ -43,17 +43,17 @@
<td><input name="ifaces" type="text" class="form-control" value="{{ .Config.Ifaces }}"></td>
</tr>
<tr>
<td>Ignore IP</td>
<td><select name="ignore" class="form-select">
<option selected>{{ .Config.IgnoreIP }}</option>
<option value="yes">yes</option>
<option value="no">no</option>
</select></td>
<td>Timeout</td>
<td><input name="timeout" type="number" class="form-control" value="{{ .Config.Timeout }}"></td>
</tr>
<tr>
<td>Args for arpscan</td>
<td><input name="arpargs" type="text" class="form-control" value="{{ .Config.ArpArgs }}"></td>
</tr>
<tr>
<td>Trim History (hours)</td>
<td><input name="trim" type="number" class="form-control" value="{{ .Config.TrimHist }}"></td>
</tr>
<tr>
<td><button type="submit" class="btn btn-primary">Save</button></td>
<td></td>
Expand Down
30 changes: 19 additions & 11 deletions internal/web/templates/history.html
Original file line number Diff line number Diff line change
@@ -1,27 +1,35 @@
{{ define "history.html" }}
</head>
<script src="/fs/public/js/history.js"></script>
<script src="/fs/public/js/sort.js"></script>
<script src="/fs/public/js/hist-html.js"></script>

<body>
<div class="container-lg">
<div class="row">
<div class="col-md mt-4 mb-4">
<div class="card border-primary">
<div class="card-header">
<div class="input-group">
<button class="btn btn-outline-primary dropdown-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false">Show</button>
<ul class="dropdown-menu">
<li><a class="dropdown-item" onclick="showHist(500)">500</a></li>
<li><a class="dropdown-item" onclick="showHist(1000)">1000</a></li>
<li><a class="dropdown-item" onclick="showHist(2000)">2000</a></li>
<li><a class="dropdown-item" onclick="showHist(5000)">5000</a></li>
<li><a class="dropdown-item" onclick="showHist(0)">All</a></li>
</ul>
<input class="form-control" id="man-show" onchange="manualShow()" placeholder="Show elements" style="max-width: 10em;">
</div>
</div>
<div class="card-body table-responsive">
<table class="table table-striped">
<thead>
<th style="width: 3em;"></th>
<th>Name <i class="bi bi-sort-down-alt my-btn" onclick="sortBy('Name')"></i></th>
<th>Iface <i class="bi bi-sort-down-alt my-btn" onclick="sortBy('Iface')"></i></th>
<th>IP <i class="bi bi-sort-down-alt my-btn" onclick="sortBy('IP')"></i></th>
<th>MAC <i class="bi bi-sort-down-alt my-btn" onclick="sortBy('Mac')"></i></th>
<th>Hardware <i class="bi bi-sort-down-alt my-btn" onclick="sortBy('Hw')"></i></th>
<th>Date <i class="bi bi-sort-down-alt my-btn" onclick="sortBy('Date')"></i></th>
<th>Known <i class="bi bi-sort-down-alt my-btn" onclick="sortBy('Known')"></i></th>
<th>Online <i class="bi bi-sort-down-alt my-btn" onclick="sortBy('Now')"></i></th>
<th>Host</th>
<th>History</th>
</thead>
<tbody id="tBody"></tbody>
<!-- index.js -->
<tbody id="showHist"></tbody>
<!-- history.js -->
</table>
</div>
</div>
Expand Down
Loading

0 comments on commit b86ee2b

Please sign in to comment.