[TASK] Update node and link infobox with latest json

- Includes a cache-breaker variable for stats images
This commit is contained in:
Xaver Maierhofer 2016-06-22 03:15:53 +02:00
parent daf7a05d5c
commit 1d1cf5595b
8 changed files with 52 additions and 26 deletions

View File

@ -3,6 +3,7 @@
### Main differences to https://github.com/ffnord/meshviewer
#### Some features are maybe merged
- Updates selected node or list (incl. image stats cache-breaker) - not only overview tables
- Formatted Code
- Grunt inline for some css and js - less requests
- Icon font with only needed icons
@ -121,7 +122,7 @@ This option allows to show node statistics depending on following case-sensitive
- `caption` is shown, if `thumbnail` is not present (no thumbnail in infobox)
To insert current node-id in either `href`, `thumbnail` or `caption`
you can use the case-sensitive template string `{NODE_ID}`.
you can use the case-sensitive template string `{NODE_ID}`, `{NODE_NAME}` and `{TIME}` as cache-breaker.
Examples for `nodeInfos`:
@ -129,12 +130,12 @@ Examples for `nodeInfos`:
{ "name": "Clientstatistik",
"href": "stats/dashboard/db/node-byid?var-nodeid={NODE_ID}",
"thumbnail": "stats/render/dashboard-solo/db/node-byid?panelId=1&fullscreen&theme=light&width=600&height=300&var-nodeid={NODE_ID}",
"thumbnail": "stats/render/dashboard-solo/db/node-byid?panelId=1&fullscreen&theme=light&width=600&height=300&var-nodeid={NODE_ID}&var-host={NODE_NAME}&_t={TIME}",
"caption": "Knoten {NODE_ID}"
},
{ "name": "Uptime",
"href": "stats/dashboard/db/node-byid?var-nodeid={NODE_ID}",
"thumbnail": "stats/render/dashboard-solo/db/node-byid?panelId=2&fullscreen&theme=light&width=600&height=300&var-nodeid={NODE_ID}",
"thumbnail": "stats/render/dashboard-solo/db/node-byid?panelId=2&fullscreen&theme=light&width=600&height=300&var-nodeid={NODE_ID}&_t={TIME}",
"caption": "Knoten {NODE_ID}"
}
]
@ -174,11 +175,11 @@ This option allows to show link statistics depending on the following case-sensi
- `caption` is shown, if `thumbnail` is not present (no thumbnail in infobox)
To insert the source or target node-id in either `href`, `thumbnail` or `caption`
you can use the case-sensitive template strings `{SOURCE}` and `{TARGET}`.
you can use the case-sensitive template strings `{SOURCE}`, `{TARGET}` and `{TIME}` as cache-breaker.
"linkInfos": [
{ "href": "stats/dashboard/db/links?var-source={SOURCE}&var-target={TARGET}",
"thumbnail": "stats/render/dashboard-solo/db/links?panelId=1&fullscreen&theme=light&width=800&height=600&var-source={SOURCE}&var-target={TARGET}"
"thumbnail": "stats/render/dashboard-solo/db/links?panelId=1&fullscreen&theme=light&width=800&height=600&var-source={SOURCE}&var-target={TARGET}&_t={TIME}"
}
]

View File

@ -5,13 +5,13 @@
{
"name": "Clientstatistik",
"href": "https://regensburg.freifunk.net/netz/statistik/node/{NODE_ID}/",
"thumbnail": "https://grafana.regensburg.freifunk.net/render/dashboard-solo/db/ffrgb-all-nodes?panelId=1&from=now-7d&var-nodeid={NODE_ID}&var-host={NODE_NAME}&width=650&height=350&theme=light",
"thumbnail": "https://grafana.regensburg.freifunk.net/render/dashboard-solo/db/ffrgb-all-nodes?panelId=1&from=now-7d&var-nodeid={NODE_ID}&var-host={NODE_NAME}&width=650&height=350&theme=light&_t={TIME}",
"caption": "Knoten {NODE_ID} - weiteren Statistiken"
},
{
"name": "Trafficstatistik",
"href": "https://regensburg.freifunk.net/netz/statistik/node/{NODE_ID}/",
"thumbnail": "https://grafana.regensburg.freifunk.net/render/dashboard-solo/db/ffrgb-all-nodes?panelId=2&from=now-7d&var-nodeid={NODE_ID}&var-host={NODE_NAME}&width=650&height=350&theme=light",
"thumbnail": "https://grafana.regensburg.freifunk.net/render/dashboard-solo/db/ffrgb-all-nodes?panelId=2&from=now-7d&var-nodeid={NODE_ID}&var-host={NODE_NAME}&width=650&height=350&theme=light&_t={TIME}",
"caption": "Knoten {NODE_ID} - weiteren Statistiken"
}
],

View File

@ -1,10 +1,11 @@
define(["helper"], function (helper) {
"use strict";
function showStatImg(o, source, target) {
function showStatImg(o, source, target, time) {
var subst = {};
subst["{SOURCE}"] = source;
subst["{TARGET}"] = target;
subst["{TIME}"] = time;
return helper.showStat(o, subst);
}
@ -46,11 +47,12 @@ define(["helper"], function (helper) {
if (config.linkInfos) {
var source = d.source.node_id;
var target = d.target.node_id;
var time = d.target.node.lastseen.format("DDMMYYYYHmmss");
config.linkInfos.forEach(function (linkInfo) {
var h4 = document.createElement("h4");
h4.textContent = linkInfo.name;
el.appendChild(h4);
el.appendChild(showStatImg(linkInfo, source, target));
el.appendChild(showStatImg(linkInfo, source, target, time));
});
}
};

View File

@ -32,15 +32,31 @@ define(["infobox/link", "infobox/node", "infobox/location"], function (Link, Nod
el.appendChild(closeButton);
}
function clear() {
var closeButton = el.firstChild;
while (el.firstChild) {
el.removeChild(el.firstChild);
}
el.appendChild(closeButton);
}
self.resetView = destroy;
self.gotoNode = function (d) {
create();
self.gotoNode = function (d, update) {
if (update !== true) {
create();
} else {
clear();
}
Node(config, el, router, d);
};
self.gotoLink = function (d) {
create();
self.gotoLink = function (d, update) {
if (update !== true) {
create();
} else {
clear();
}
Link(config, el, router, d);
};

View File

@ -237,6 +237,7 @@ define(["chroma-js", "moment", "tablesort", "helper", "moment.de"],
var subst = {};
subst["{NODE_ID}"] = d.nodeinfo.node_id ? d.nodeinfo.node_id : "unknown";
subst["{NODE_NAME}"] = d.nodeinfo.hostname ? d.nodeinfo.hostname.replace(/[^a-z0-9\-]/ig, "_") : "unknown";
subst["{TIME}"] = d.lastseen.format("DDMMYYYYHmmss");
return helper.showStat(o, subst);
}
@ -344,7 +345,7 @@ define(["chroma-js", "moment", "tablesort", "helper", "moment.de"],
} else {
td2.textContent = d.id;
}
tr.appendChild(td2);
var td3 = document.createElement("td");

View File

@ -181,6 +181,7 @@ define(["moment", "router", "leaflet", "gui", "helper", "moment.de"],
update().then(function (d) {
gui.setData(d);
router.setData(d);
router.update();
});
}, 60000);
})

View File

@ -452,16 +452,16 @@ define(["map/clientlayer", "map/labelslayer",
updateView();
};
self.gotoNode = function (d) {
self.gotoNode = function (d, update) {
disableTracking();
highlight = {type: "node", o: d};
updateView();
updateView(update);
};
self.gotoLink = function (d) {
self.gotoLink = function (d, update) {
disableTracking();
highlight = {type: "link", o: d};
updateView();
updateView(update);
};
self.gotoLocation = function () {

View File

@ -45,25 +45,25 @@ define(["helper"], function (helper) {
}
}
function gotoNode(d) {
function gotoNode(d, update) {
if (!d) {
return false;
}
targets.forEach(function (t) {
t.gotoNode(d);
t.gotoNode(d, update);
});
return true;
}
function gotoLink(d) {
function gotoLink(d, update) {
if (!d) {
return false;
}
targets.forEach(function (t) {
t.gotoLink(d);
t.gotoLink(d, update);
});
return true;
@ -84,7 +84,7 @@ define(["helper"], function (helper) {
return true;
}
function loadState(s) {
function loadState(s, update) {
if (!s) {
return false;
}
@ -100,7 +100,7 @@ define(["helper"], function (helper) {
s.slice(2).split(";").forEach(function (d) {
var args = d.split(":");
if (args[0] === "v" && args[1] in views) {
if (update !== true && args[0] === "v" && args[1] in views) {
currentView = args[1];
views[args[1]]();
}
@ -111,7 +111,7 @@ define(["helper"], function (helper) {
id = args[1];
if (id in objects.nodes) {
currentObject = {node: objects.nodes[id]};
gotoNode(objects.nodes[id]);
gotoNode(objects.nodes[id], update);
targetSet = true;
}
}
@ -120,7 +120,7 @@ define(["helper"], function (helper) {
id = args[1];
if (id in objects.links) {
currentObject = {link: objects.links[id]};
gotoLink(objects.links[id]);
gotoLink(objects.links[id], update);
targetSet = true;
}
}
@ -225,6 +225,11 @@ define(["helper"], function (helper) {
data.graph.links.forEach(function (d) {
objects.links[d.id] = d;
});
};
self.update = function () {
loadState(window.location.hash, true);
};
return self;