diff options
Diffstat (limited to 'applications/luci-app-babeld')
6 files changed, 254 insertions, 0 deletions
diff --git a/applications/luci-app-babeld/Makefile b/applications/luci-app-babeld/Makefile new file mode 100644 index 0000000000..6af9280261 --- /dev/null +++ b/applications/luci-app-babeld/Makefile @@ -0,0 +1,9 @@ +include $(TOPDIR)/rules.mk + +LUCI_TITLE:=LuCI support for babeld +LUCI_DEPENDS:=+babeld +luci-compat +LUCI_PKGARCH:=all + +include ../../luci.mk + +# call BuildPackage - OpenWrt buildroot signature diff --git a/applications/luci-app-babeld/luasrc/view/babeld.htm b/applications/luci-app-babeld/luasrc/view/babeld.htm new file mode 100644 index 0000000000..d3436f0e69 --- /dev/null +++ b/applications/luci-app-babeld/luasrc/view/babeld.htm @@ -0,0 +1,22 @@ +<%+header%> +<script type="text/javascript" src="<%=resource%>/babeld.js"></script> + +<div id="babeld"></div> + +<script type="text/javascript"> + data = {}; + data["ubus_rpc_session"] = "<%=luci.dispatcher.context.authsession%>" + origin = document.location.href.replace(location.pathname, "") + ubus_url = origin + "/ubus/" + + var info = ubus_call("babeld", "get_info", {}); + var xroutes = ubus_call("babeld", "get_xroutes", {}); + var routes = ubus_call("babeld", "get_routes", {}); + var neighbours = ubus_call("babeld", "get_neighbours", {}); + + renderTableInfo(info, 'babeld'); + renderTableXRoutes(xroutes, 'babeld'); + renderTableRoutes(routes, 'babeld'); + renderTableNeighbours(neighbours, 'babeld'); +</script> +<%+footer%> diff --git a/applications/luci-app-babeld/root/etc/uci-defaults/40_luci-babeld b/applications/luci-app-babeld/root/etc/uci-defaults/40_luci-babeld new file mode 100644 index 0000000000..c9b223eec9 --- /dev/null +++ b/applications/luci-app-babeld/root/etc/uci-defaults/40_luci-babeld @@ -0,0 +1,5 @@ +#!/bin/sh + +uci set babeld.@general[0].ubus_bindings='true' + +return 0 diff --git a/applications/luci-app-babeld/root/usr/share/luci/menu.d/luci-app-babeld.json b/applications/luci-app-babeld/root/usr/share/luci/menu.d/luci-app-babeld.json new file mode 100644 index 0000000000..a5f7e9259e --- /dev/null +++ b/applications/luci-app-babeld/root/usr/share/luci/menu.d/luci-app-babeld.json @@ -0,0 +1,12 @@ +{ + "admin/status/babeld": { + "title": "Babeld", + "action": { + "type": "template", + "path": "babeld" + }, + "depends": { + "acl": [ "luci-app-babeld" ] + } + } +} diff --git a/applications/luci-app-babeld/root/usr/share/rpcd/acl.d/luci-app-babeld.json b/applications/luci-app-babeld/root/usr/share/rpcd/acl.d/luci-app-babeld.json new file mode 100644 index 0000000000..71755b30d4 --- /dev/null +++ b/applications/luci-app-babeld/root/usr/share/rpcd/acl.d/luci-app-babeld.json @@ -0,0 +1,17 @@ +{ + "luci-app-babeld": { + "description": "Grant UCI access for babeld", + "read": { + "uci": [ "babeld" ], + "ubus": { + "babeld": [ "*" ] + } + }, + "write": { + "uci": [ "babeld" ], + "ubus": { + "babeld": [ "*" ] + } + } + } +} diff --git a/applications/luci-app-babeld/root/www/luci-static/resources/babeld.js b/applications/luci-app-babeld/root/www/luci-static/resources/babeld.js new file mode 100644 index 0000000000..864010ef6c --- /dev/null +++ b/applications/luci-app-babeld/root/www/luci-static/resources/babeld.js @@ -0,0 +1,189 @@ +function ubus_call(command, argument, params) { + var request_data = {}; + request_data.jsonrpc = "2.0"; + request_data.method = "call"; + request_data.params = [data.ubus_rpc_session, command, argument, params] + var request_json = JSON.stringify(request_data); + var request = new XMLHttpRequest(); + request.open("POST", ubus_url, false); + request.setRequestHeader("Content-type", "application/json"); + request.send(request_json); + if (request.status === 200) { + var response = JSON.parse(request.responseText) + if (!("error" in response) && "result" in response) { + if (response.result.length === 2) { + return response.result[1]; + } + } else { + console.err("Failed query ubus!"); + } + } +} + +function renderTableXRoutes(data, target_id) { + for (var protocol in data) { + var target = document.getElementById(target_id); + + var title = document.createElement('h3'); + title.appendChild(document.createTextNode('X-Routes ' + protocol)); + target.appendChild(title); + + var table = document.createElement('div'); + table.setAttribute('class', 'table'); + table.setAttribute('id', 'babel_overview_xroutes_' + protocol); + + var headerRow = document.createElement('div'); + headerRow.setAttribute('class', 'tr table-titles'); + var headerContent = '<div class="th" style="font-weight: 700;">' + protocol + ' Prefix</div>\ + <div class="th" style="font-weight: 700;">Metric</div>\ + <div class="th" style="font-weight: 700;">Source-Prefix</div>'; + + headerRow.innerHTML = headerContent; + table.appendChild(headerRow); + + + for (var prefix in data[protocol]) { + var prefixRow = document.createElement('div'); + prefixRow.setAttribute('class', 'tr'); + var prefixContent = '<div class="td" data-title="xroutes_' + protocol + '_prefix">' + prefix + '</div>\ + <div class="td" data-title="xroutes_' + protocol + '_metric">' + data[protocol][prefix]["metric"] + '</div>\ + <div class="td" data-title="xroutes_' + protocol + '_src-prefix">' + data[protocol][prefix]["src-prefix"] + '</div>'; + + prefixRow.innerHTML = prefixContent; + table.appendChild(prefixRow); + } + target.appendChild(table); + } +} + +function renderTableRoutes(data, target_id) { + for (var protocol in data) { + var target = document.getElementById(target_id); + + var title = document.createElement('h3'); + title.appendChild(document.createTextNode('Routes ' + protocol)); + target.appendChild(title); + + var table = document.createElement('div'); + table.setAttribute('class', 'table'); + table.setAttribute('id', 'babel_overview_routes_' + protocol); + + var headerRow = document.createElement('div'); + headerRow.setAttribute('class', 'tr table-titles'); + var headerContent = '<div class="th" style="font-weight: 700;">' + protocol + ' Prefix</div>\ + <div class="th" style="font-weight: 700;">Source-Prefix</div>\ + <div class="th" style="font-weight: 700;">Route-Metric</div>\ + <div class="th" style="font-weight: 700;">Route Smoothed Metric</div>\ + <div class="th" style="font-weight: 700;">Refmetric</div>\ + <div class="th" style="font-weight: 700;">ID</div>\ + <div class="th" style="font-weight: 700;">Seq. No.</div>\ + <div class="th" style="font-weight: 700;">Channes</div>\ + <div class="th" style="font-weight: 700;">Age</div>\ + <div class="th" style="font-weight: 700;">Via</div>\ + <div class="th" style="font-weight: 700;">Nexthop</div>\ + <div class="th" style="font-weight: 700;">Installed</div>\ + <div class="th" style="font-weight: 700;">Feasible</div>'; + + headerRow.innerHTML = headerContent; + table.appendChild(headerRow); + + for (var prefix in data[protocol]) { + var prefixRow = document.createElement('div'); + prefixRow.setAttribute('class', 'tr'); + var prefixContent = '<div class="td" data-title="routes_' + protocol + '_prefix">' + prefix + '</div>\ + <div class="td" data-title="routes_' + protocol + '_src-prefix">' + data[protocol][prefix]["src-prefix"] + '</div>\ + <div class="td" data-title="routes_' + protocol + '_metric">' + data[protocol][prefix]["route_metric"] + '</div>\ + <div class="td" data-title="routes_' + protocol + '_rout-smoothed-metric">' + data[protocol][prefix]["route_smoothed_metric"] + '</div>\ + <div class="td" data-title="routes_' + protocol + '_refmetric">' + data[protocol][prefix]["refmetric"] + '</div>\ + <div class="td" data-title="routes_' + protocol + '_id">' + data[protocol][prefix]["id"] + '</div>\ + <div class="td" data-title="routes_' + protocol + '_seqno">' + data[protocol][prefix]["seqno"] + '</div>\ + <div class="td" data-title="routes_' + protocol + '_channels">' + data[protocol][prefix]["channels"] + '</div>\ + <div class="td" data-title="routes_' + protocol + '_age">' + data[protocol][prefix]["age"] + '</div>\ + <div class="td" data-title="routes_' + protocol + '_via">' + data[protocol][prefix]["via"] + '</div>\ + <div class="td" data-title="routes_' + protocol + '_nexthop">' + data[protocol][prefix]["nexthop"] + '</div>\ + <div class="td" data-title="routes_' + protocol + '_installed">' + data[protocol][prefix]["installed"] + '</div>\ + <div class="td" data-title="routes_' + protocol + '_feasible">' + data[protocol][prefix]["feasible"] + '</div>'; + + prefixRow.innerHTML = prefixContent; + table.appendChild(prefixRow); + } + target.appendChild(table); + } +} + +function renderTableNeighbours(data, target_id) { + for (var protocol in data) { + var target = document.getElementById(target_id); + + var title = document.createElement('h3'); + title.appendChild(document.createTextNode('Neighbours ' + protocol)); + target.appendChild(title); + + var table = document.createElement('div'); + table.setAttribute('class', 'table'); + table.setAttribute('id', 'babel_overview_neighbours_' + protocol); + + var headerRow = document.createElement('div'); + headerRow.setAttribute('class', 'tr table-titles'); + var headerContent = '<div class="th" style="font-weight: 700;">' + protocol + ' Neighbour</div>\ + <div class="th" style="font-weight: 700;">Device</div>\ + <div class="th" style="font-weight: 700;">Hello-Reach</div>\ + <div class="th" style="font-weight: 700;">RX cost</div>\ + <div class="th" style="font-weight: 700;">TX cost</div>\ + <div class="th" style="font-weight: 700;">RTT</div>\ + <div class="th" style="font-weight: 700;">Channel</div>\ + <div class="th" style="font-weight: 700;">Interface up</div>'; + + headerRow.innerHTML = headerContent; + table.appendChild(headerRow); + + for (var neighbour in data[protocol]) { + var neighbourRow = document.createElement('div'); + neighbourRow.setAttribute('class', 'tr'); + var neighbourContent = '<div class="td" data-title="' + protocol + '_neighbour">' + neighbour + '</div>\ + <div class="td" data-title="neighbours_' + protocol + '_dev">' + data[protocol][neighbour]["dev"] + '</div>\ + <div class="td" data-title="neighbours_' + protocol + '_hello-reach">' + data[protocol][neighbour]["hello-reach"] + '</div>\ + <div class="td" data-title="neighbours_' + protocol + '_rxcost">' + data[protocol][neighbour]["rxcost"] + '</div>\ + <div class="td" data-title="neighbours_' + protocol + '_txcost">' + data[protocol][neighbour]["txcost"] + '</div>\ + <div class="td" data-title="neighbours_' + protocol + '_rtt">' + data[protocol][neighbour]["rtt"] + '</div>\ + <div class="td" data-title="neighbours_' + protocol + '_channel">' + data[protocol][neighbour]["channel"] + '</div>\ + <div class="td" data-title="neighbours_' + protocol + '_if_up">' + data[protocol][neighbour]["if_up"] + '</div>'; + + neighbourRow.innerHTML = neighbourContent; + table.appendChild(neighbourRow); + } + target.appendChild(table); + } +} + +function renderTableInfo(data, target_id) { + var target = document.getElementById(target_id); + + var title = document.createElement('h3'); + title.appendChild(document.createTextNode('Info')); + target.appendChild(title); + + var table = document.createElement('div'); + table.setAttribute('class', 'table'); + table.setAttribute('id', 'babel_overview_info'); + + + var headerRow = document.createElement('div'); + headerRow.setAttribute('class', 'tr table-titles'); + var headerContent = '<div class="th" style="font-weight: 700;">Babeld Version</div>\ + <div class="th" style="font-weight: 700;">My-ID</div>\ + <div class="th" style="font-weight: 700;">Host</div>'; + + headerRow.innerHTML = headerContent; + table.appendChild(headerRow); + + var neighbourRow = document.createElement('div'); + neighbourRow.setAttribute('class', 'tr'); + var neighbourContent = '<div class="td" data-title="info_babeld-version">' + data["babeld-version"] + '</div>\ + <div class="td" data-title="info_dev">' + data["my-id"] + '</div>\ + <div class="td" data-title="info_hello-reach">' + data["host"] + '</div>'; + + neighbourRow.innerHTML = neighbourContent; + table.appendChild(neighbourRow); + target.appendChild(table); +} |