mirror of
https://github.com/RaspAP/raspap-webgui.git
synced 2024-11-26 09:30:26 +00:00
Merge branch 'master' into wificlient-ap
This commit is contained in:
billz
commit
9abf79b23c
6 changed files with 114 additions and 19 deletions
17
README.md
17
README.md
|
|
@ -24,16 +24,19 @@ We'd be curious to hear about how you use this with your own RPi-powered project
|
||||||
- [License](#license)
|
- [License](#license)
|
||||||
|
|
||||||
## Prerequisites
|
## Prerequisites
|
||||||
You need to install some extra software in order for the Raspberry Pi to act as a WiFi router and access point. If all you're interested in is configuring your RPi as a client on an existing WiFi network, you can skip this step.
|
Start with a clean install of the [latest release of Raspbian](https://www.raspberrypi.org/downloads/raspbian/) (currently Stretch). Raspbian Stretch Lite is recommended.
|
||||||
|
|
||||||
There are many guides available to help you select a WiFi adapter, install a compatible driver, configure HostAPD and so on. The details are outside the scope of this project, although I've had consistently good results with the [**Edimax Wireless 802.11b/g/n nano USB adapter**](http://www.edimax.com/edimax/merchandise/merchandise_detail/data/edimax/global/wireless_adapters_n150/ew-7811un) – it's small, cheap and easy to work with.
|
1. Update Raspbian, including the kernel and firmware, followed by a reboot:
|
||||||
|
```
|
||||||
|
sudo apt-get update
|
||||||
|
sudo apt-get dist-upgrade
|
||||||
|
sudo reboot
|
||||||
|
```
|
||||||
|
2. Set the WiFi country in raspi-config's **Localisation Options**: `sudo raspi-config`
|
||||||
|
|
||||||
To configure your RPi as a WiFi router, either of these resources will start you on the right track:
|
3. If you have an older Raspberry Pi without an onboard WiFi chipset, the [**Edimax Wireless 802.11b/g/n nano USB adapter**](https://www.edimax.com/edimax/merchandise/merchandise_detail/data/edimax/global/wireless_adapters_n150/ew-7811un) is an excellent option – it's small, cheap and has good driver support.
|
||||||
* [**How-To: Setting up a Raspberry Pi as an access point in a standalone network (Tested with Raspbian Stretch)**](https://github.com/SurferTim/documentation/blob/6bc583965254fa292a470990c40b145f553f6b34/configuration/wireless/access-point.md)
|
|
||||||
* [**How-To: Use The Raspberry Pi As A Wireless Access Point/Router Part 1**](http://sirlagz.net/2012/08/09/how-to-use-the-raspberry-pi-as-a-wireless-access-pointrouter-part-1/)
|
|
||||||
* [**How-To: Turn a Raspberry Pi into a WiFi router**](http://raspberrypihq.com/how-to-turn-a-raspberry-pi-into-a-wifi-router/) (uses isc-dhcp-server instead of dnsmasq)
|
|
||||||
|
|
||||||
After you complete the intial setup, you'll be able to administer these services using the web UI.
|
With the prerequisites done, you can proceed with either the Quick installer or Manual installation steps below.
|
||||||
|
|
||||||
## Quick installer
|
## Quick installer
|
||||||
Install RaspAP from your RaspberryPi's shell prompt:
|
Install RaspAP from your RaspberryPi's shell prompt:
|
||||||
|
|
|
||||||
|
|
@ -26,6 +26,8 @@ if (strlen($interface) > IFNAMSIZ) {
|
||||||
exit('Invalid interface name.');
|
exit('Invalid interface name.');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
require_once './get_bandwidth_hourly.php';
|
||||||
|
|
||||||
exec(sprintf('vnstat -i %s --json ', escapeshellarg($interface)), $jsonstdoutvnstat,
|
exec(sprintf('vnstat -i %s --json ', escapeshellarg($interface)), $jsonstdoutvnstat,
|
||||||
$exitcodedaily);
|
$exitcodedaily);
|
||||||
if ($exitcodedaily !== 0) {
|
if ($exitcodedaily !== 0) {
|
||||||
|
|
|
||||||
63
ajax/bandwidth/get_bandwidth_hourly.php
Normal file
63
ajax/bandwidth/get_bandwidth_hourly.php
Normal file
|
|
@ -0,0 +1,63 @@
|
||||||
|
<?php
|
||||||
|
if (filter_input(INPUT_GET, 'tu') == 'h') {
|
||||||
|
|
||||||
|
header('X-Content-Type-Options: nosniff');
|
||||||
|
header('Content-Type: application/json');
|
||||||
|
|
||||||
|
$data_template = array(
|
||||||
|
0 => array('date' => '00:00', 'rx' => 0, 'tx' => 0),
|
||||||
|
1 => array('date' => '01:00', 'rx' => 0, 'tx' => 0),
|
||||||
|
2 => array('date' => '02:00', 'rx' => 0, 'tx' => 0),
|
||||||
|
3 => array('date' => '03:00', 'rx' => 0, 'tx' => 0),
|
||||||
|
4 => array('date' => '04:00', 'rx' => 0, 'tx' => 0),
|
||||||
|
5 => array('date' => '05:00', 'rx' => 0, 'tx' => 0),
|
||||||
|
6 => array('date' => '06:00', 'rx' => 0, 'tx' => 0),
|
||||||
|
7 => array('date' => '07:00', 'rx' => 0, 'tx' => 0),
|
||||||
|
8 => array('date' => '08:00', 'rx' => 0, 'tx' => 0),
|
||||||
|
9 => array('date' => '09:00', 'rx' => 0, 'tx' => 0),
|
||||||
|
10 => array('date' => '10:00', 'rx' => 0, 'tx' => 0),
|
||||||
|
11 => array('date' => '11:00', 'rx' => 0, 'tx' => 0),
|
||||||
|
12 => array('date' => '12:00', 'rx' => 0, 'tx' => 0),
|
||||||
|
13 => array('date' => '13:00', 'rx' => 0, 'tx' => 0),
|
||||||
|
14 => array('date' => '14:00', 'rx' => 0, 'tx' => 0),
|
||||||
|
15 => array('date' => '15:00', 'rx' => 0, 'tx' => 0),
|
||||||
|
16 => array('date' => '16:00', 'rx' => 0, 'tx' => 0),
|
||||||
|
17 => array('date' => '17:00', 'rx' => 0, 'tx' => 0),
|
||||||
|
18 => array('date' => '18:00', 'rx' => 0, 'tx' => 0),
|
||||||
|
19 => array('date' => '19:00', 'rx' => 0, 'tx' => 0),
|
||||||
|
20 => array('date' => '20:00', 'rx' => 0, 'tx' => 0),
|
||||||
|
21 => array('date' => '21:00', 'rx' => 0, 'tx' => 0),
|
||||||
|
22 => array('date' => '22:00', 'rx' => 0, 'tx' => 0),
|
||||||
|
23 => array('date' => '23:00', 'rx' => 0, 'tx' => 0)
|
||||||
|
);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
exec(sprintf('vnstat -i %s --json h', escapeshellarg($interface)), $jsonstdoutvnstat, $exitcodedaily);
|
||||||
|
if ($exitcodedaily !== 0) {
|
||||||
|
exit('vnstat error');
|
||||||
|
}
|
||||||
|
|
||||||
|
$jsonobj = json_decode($jsonstdoutvnstat[0], true)['interfaces'][0];
|
||||||
|
$jsonData = $jsonobj['traffic']['hours'];
|
||||||
|
for ($i = count($jsonData) - 1; $i >= 0; --$i) {
|
||||||
|
$data_template[$jsonData[$i]['id']]['rx'] = round($jsonData[$i]['rx'] / 1024, 0);
|
||||||
|
$data_template[$jsonData[$i]['id']]['tx'] = round($jsonData[$i]['tx'] / 1024, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
$data = array();
|
||||||
|
$hour = $jsonobj['updated']['time']['hour'];
|
||||||
|
foreach ($data_template as $key => $value) {
|
||||||
|
if ($key > $hour) {
|
||||||
|
array_push($data, $value);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
foreach ($data_template as $key => $value) {
|
||||||
|
if ($key <= $hour) {
|
||||||
|
array_push($data, $value);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
echo json_encode($data);
|
||||||
|
exit(0);
|
||||||
|
}
|
||||||
|
|
@ -5,6 +5,7 @@
|
||||||
*/
|
*/
|
||||||
function DisplayDataUsage(&$extraFooterScripts)
|
function DisplayDataUsage(&$extraFooterScripts)
|
||||||
{
|
{
|
||||||
|
exec("ip -o link show | awk -F ': ' '{print $2}' | grep -v lo ", $interfacesWlo);
|
||||||
?>
|
?>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-lg-12">
|
<div class="col-lg-12">
|
||||||
|
|
@ -16,27 +17,48 @@ function DisplayDataUsage(&$extraFooterScripts)
|
||||||
<div class="panel panel-default">
|
<div class="panel panel-default">
|
||||||
<div class="panel-body">
|
<div class="panel-body">
|
||||||
<ul id="tabbarBandwidth" class="nav nav-tabs" role="tablist">
|
<ul id="tabbarBandwidth" class="nav nav-tabs" role="tablist">
|
||||||
<li role="presentation" class="active"><a href="#daily" aria-controls="daily" role="tab" data-toggle="tab"><?php echo _("Daily"); ?></a></li>
|
<li role="presentation" class="active"><a href="#hourly" aria-controls="hourly" role="tab" data-toggle="tab"><?php echo _("Hourly"); ?></a></li>
|
||||||
|
<li role="presentation" class=""><a href="#daily" aria-controls="daily" role="tab" data-toggle="tab"><?php echo _("Daily"); ?></a></li>
|
||||||
<li role="presentation" class=""><a href="#monthly" aria-controls="monthly" role="tab" data-toggle="tab"><?php echo _("Monthly"); ?></a></li>
|
<li role="presentation" class=""><a href="#monthly" aria-controls="monthly" role="tab" data-toggle="tab"><?php echo _("Monthly"); ?></a></li>
|
||||||
</ul>
|
</ul>
|
||||||
<div id="tabsBandwidth" class="tabcontenttraffic tab-content">
|
<div id="tabsBandwidth" class="tabcontenttraffic tab-content">
|
||||||
<div role="tabpanel" class="tab-pane active fade in" id="daily">
|
<div role="tabpanel" class="tab-pane active fade in" id="hourly">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-lg-12">
|
||||||
|
<h4><?php echo _('Hourly traffic amount'); ?></h4>
|
||||||
|
<label for="cbxInterfacehourly"><?php echo _('interface'); ?></label>
|
||||||
|
<select id="cbxInterfacehourly" class="form-control" name="interfacehourly">
|
||||||
|
<?php
|
||||||
|
foreach ($interfacesWlo as $interface) {
|
||||||
|
echo ' <option value="' , htmlentities($interface, ENT_QUOTES) , '">' ,
|
||||||
|
htmlentities($interface, ENT_QUOTES) , '</option>' , PHP_EOL;
|
||||||
|
}
|
||||||
|
?>
|
||||||
|
</select>
|
||||||
|
<div class="hidden alert alert-info" id="divLoaderBandwidthhourly">
|
||||||
|
<?php echo sprintf(_("Loading %s bandwidth chart"), _('hourly')); ?>
|
||||||
|
</div>
|
||||||
|
<div id="divChartBandwidthhourly"></div>
|
||||||
|
<div id="divTableBandwidthhourly"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div><!-- /.tab-pane -->
|
||||||
|
<div role="tabpanel" class="tab-pane fade" id="daily">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-lg-12">
|
<div class="col-lg-12">
|
||||||
<h4><?php echo _('Daily traffic amount'); ?></h4>
|
<h4><?php echo _('Daily traffic amount'); ?></h4>
|
||||||
<label for="cbxInterfacedaily"><?php echo _('interface'); ?></label>
|
<label for="cbxInterfacedaily"><?php echo _('interface'); ?></label>
|
||||||
<select id="cbxInterfacedaily" class="form-control" name="interfacedaily">
|
<select id="cbxInterfacedaily" class="form-control" name="interfacedaily">
|
||||||
<?php
|
<?php
|
||||||
exec("ip -o link show | awk -F ': ' '{print $2}' | grep -v lo ", $interfacesWlo);
|
|
||||||
foreach ($interfacesWlo as $interface) {
|
foreach ($interfacesWlo as $interface) {
|
||||||
echo ' <option value="' , htmlentities($interface, ENT_QUOTES) , '">' ,
|
echo ' <option value="' , htmlentities($interface, ENT_QUOTES) , '">' ,
|
||||||
htmlentities($interface, ENT_QUOTES) , '</option>' , PHP_EOL;
|
htmlentities($interface, ENT_QUOTES) , '</option>' , PHP_EOL;
|
||||||
}
|
}
|
||||||
|
|
||||||
?>
|
?>
|
||||||
</select>
|
</select>
|
||||||
<div class="hidden alert alert-info" id="divLoaderBandwidthdaily"><?php
|
<div class="hidden alert alert-info" id="divLoaderBandwidthdaily">
|
||||||
echo sprintf(_("Loading %s bandwidth chart"), _('daily')); ?></div>
|
<?php echo sprintf(_("Loading %s bandwidth chart"), _('daily')); ?>
|
||||||
|
</div>
|
||||||
<div id="divChartBandwidthdaily"></div>
|
<div id="divChartBandwidthdaily"></div>
|
||||||
<div id="divTableBandwidthdaily"></div>
|
<div id="divTableBandwidthdaily"></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -53,7 +75,6 @@ foreach ($interfacesWlo as $interface) {
|
||||||
echo ' <option value="' , htmlentities($interface, ENT_QUOTES) , '">' ,
|
echo ' <option value="' , htmlentities($interface, ENT_QUOTES) , '">' ,
|
||||||
htmlentities($interface, ENT_QUOTES) , '</option>' , PHP_EOL;
|
htmlentities($interface, ENT_QUOTES) , '</option>' , PHP_EOL;
|
||||||
}
|
}
|
||||||
|
|
||||||
?>
|
?>
|
||||||
</select>
|
</select>
|
||||||
<div class="hidden alert alert-info" id="divLoaderBandwidthmonthly">
|
<div class="hidden alert alert-info" id="divLoaderBandwidthmonthly">
|
||||||
|
|
|
||||||
|
|
@ -276,6 +276,10 @@ function patch_system_files() {
|
||||||
else
|
else
|
||||||
install_log "Sudoers file already patched"
|
install_log "Sudoers file already patched"
|
||||||
fi
|
fi
|
||||||
|
|
||||||
|
# Unmask and enable hostapd.service
|
||||||
|
sudo systemctl unmask hostapd.service
|
||||||
|
sudo systemctl enable hostapd.service
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -9,8 +9,8 @@
|
||||||
element: placeholder,
|
element: placeholder,
|
||||||
xkey: 'date',
|
xkey: 'date',
|
||||||
ykeys: ['rx', 'tx'],
|
ykeys: ['rx', 'tx'],
|
||||||
labels: [_t['send']+' '+datasizeunits.toUpperCase(),
|
labels: [_t['receive']+' '+datasizeunits.toUpperCase(),
|
||||||
_t['receive']+' '+datasizeunits.toUpperCase()]
|
_t['send']+' '+datasizeunits.toUpperCase()]
|
||||||
});
|
});
|
||||||
|
|
||||||
return barchart;
|
return barchart;
|
||||||
|
|
@ -31,9 +31,11 @@
|
||||||
*/
|
*/
|
||||||
function ShowBandwidthChartHandler(e) {
|
function ShowBandwidthChartHandler(e) {
|
||||||
// Remove all morrisjs charts
|
// Remove all morrisjs charts
|
||||||
|
$('#divChartBandwidthhourly').empty();
|
||||||
$('#divChartBandwidthdaily').empty();
|
$('#divChartBandwidthdaily').empty();
|
||||||
$('#divChartBandwidthmonthly').empty();
|
$('#divChartBandwidthmonthly').empty();
|
||||||
// Remove all datatables
|
// Remove all datatables
|
||||||
|
$('#divTableBandwidthhourly').empty();
|
||||||
$('#divTableBandwidthdaily').empty();
|
$('#divTableBandwidthdaily').empty();
|
||||||
$('#divTableBandwidthmonthly').empty();
|
$('#divTableBandwidthmonthly').empty();
|
||||||
// Construct ajax uri for getting the proper data.
|
// Construct ajax uri for getting the proper data.
|
||||||
|
|
@ -66,8 +68,8 @@
|
||||||
'order': [[ 0, 'ASC' ]],
|
'order': [[ 0, 'ASC' ]],
|
||||||
'columns': [
|
'columns': [
|
||||||
{ 'data': 'date' },
|
{ 'data': 'date' },
|
||||||
{ 'data': 'rx', "title": _t['send']+' '+datasizeunits.toUpperCase() },
|
{ 'data': 'rx', "title": _t['receive']+' '+datasizeunits.toUpperCase() },
|
||||||
{ 'data': 'tx', "title": _t['receive']+' '+datasizeunits.toUpperCase() }]
|
{ 'data': 'tx', "title": _t['send']+' '+datasizeunits.toUpperCase() }]
|
||||||
});
|
});
|
||||||
}).fail(function(xhr, textStatus) {
|
}).fail(function(xhr, textStatus) {
|
||||||
if (window.console) {
|
if (window.console) {
|
||||||
|
|
@ -80,8 +82,8 @@
|
||||||
|
|
||||||
$(document).ready(function() {
|
$(document).ready(function() {
|
||||||
$('#tabbarBandwidth a[data-toggle="tab"]').on('shown.bs.tab', ShowBandwidthChartHandler);
|
$('#tabbarBandwidth a[data-toggle="tab"]').on('shown.bs.tab', ShowBandwidthChartHandler);
|
||||||
|
$('#cbxInterfacehourly').on('change', ShowBandwidthChartHandler);
|
||||||
$('#cbxInterfacedaily').on('change', ShowBandwidthChartHandler);
|
$('#cbxInterfacedaily').on('change', ShowBandwidthChartHandler);
|
||||||
$('#cbxInterfaceweekly').on('change', ShowBandwidthChartHandler);
|
|
||||||
$('#cbxInterfacemonthly').on('change', ShowBandwidthChartHandler);
|
$('#cbxInterfacemonthly').on('change', ShowBandwidthChartHandler);
|
||||||
ShowBandwidthChartHandler();
|
ShowBandwidthChartHandler();
|
||||||
});
|
});
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue