mirror of
https://github.com/henrywhitaker3/Speedtest-Tracker.git
synced 2025-12-21 21:33:08 +01:00
Added auto-refresh on all tests table
This commit is contained in:
@@ -1,6 +1,6 @@
|
|||||||
# Speedtest Tracker
|
# Speedtest Tracker
|
||||||
|
|
||||||
[](https://hub.docker.com/r/henrywhitaker3/speedtest-tracker) [](https://github.com/henrywhitaker3/Speedtest-Tracker/commits) [](https://github.com/henrywhitaker3/Speedtest-Tracker/issues)  [](https://github.com/henrywhitaker3/Speedtest-Tracker/blob/master/LICENSE)
|
[](https://hub.docker.com/r/henrywhitaker3/speedtest-tracker) [](https://github.com/henrywhitaker3/Speedtest-Tracker/commits) [](https://github.com/henrywhitaker3/Speedtest-Tracker/issues)  [](https://github.com/henrywhitaker3/Speedtest-Tracker/blob/master/LICENSE)
|
||||||
|
|
||||||
This program runs a speedtest check every hour and graphs the results. The back-end is written in [Laravel](https://laravel.com/) and the front-end uses [React](https://reactjs.org/). It uses the [speedtest-cli](https://www.speedtest.net/apps/cli) package to get the data and uses [Chart.js](https://www.chartjs.org/) to plot the results.
|
This program runs a speedtest check every hour and graphs the results. The back-end is written in [Laravel](https://laravel.com/) and the front-end uses [React](https://reactjs.org/). It uses the [speedtest-cli](https://www.speedtest.net/apps/cli) package to get the data and uses [Chart.js](https://www.chartjs.org/) to plot the results.
|
||||||
|
|
||||||
|
|||||||
@@ -1,7 +1,13 @@
|
|||||||
{
|
{
|
||||||
|
"1.5.6": [
|
||||||
|
{
|
||||||
|
"description": "Auto-update all tests table",
|
||||||
|
"link": ""
|
||||||
|
}
|
||||||
|
],
|
||||||
"1.5.5": [
|
"1.5.5": [
|
||||||
{
|
{
|
||||||
"description": "Store host/id of speedtes.net server",
|
"description": "Store host/id of speedtest.net server",
|
||||||
"link": ""
|
"link": ""
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
|
|||||||
@@ -7,7 +7,7 @@ return [
|
|||||||
|--------------------------------------------------------------------------
|
|--------------------------------------------------------------------------
|
||||||
*/
|
*/
|
||||||
|
|
||||||
'version' => '1.5.5',
|
'version' => '1.5.6',
|
||||||
|
|
||||||
/*
|
/*
|
||||||
|--------------------------------------------------------------------------
|
|--------------------------------------------------------------------------
|
||||||
|
|||||||
2
public/js/app.js
vendored
2
public/js/app.js
vendored
File diff suppressed because one or more lines are too long
1
resources/js/components/Graphics/TableRow.js
vendored
1
resources/js/components/Graphics/TableRow.js
vendored
@@ -28,7 +28,6 @@ export default class TableRow extends Component {
|
|||||||
render() {
|
render() {
|
||||||
var e = this.state.data;
|
var e = this.state.data;
|
||||||
var show = this.state.show;
|
var show = this.state.show;
|
||||||
console.log(e.server_host == null);
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<tr>
|
<tr>
|
||||||
|
|||||||
23
resources/js/components/Graphics/TestsTable.js
vendored
23
resources/js/components/Graphics/TestsTable.js
vendored
@@ -13,26 +13,35 @@ export default class TestsTable extends Component {
|
|||||||
lastPage: 1,
|
lastPage: 1,
|
||||||
data: [],
|
data: [],
|
||||||
showTable: false,
|
showTable: false,
|
||||||
|
refresh: true,
|
||||||
|
interval: null
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
this.getData();
|
this.getData();
|
||||||
|
var int = setInterval(this.getData, 10000);
|
||||||
|
this.setState({
|
||||||
|
interval: int
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
getData = (page = this.state.page) => {
|
getData = (page = this.state.page, refresh = true) => {
|
||||||
var url = 'api/speedtest/?page=' + page;
|
var url = 'api/speedtest/?page=' + page;
|
||||||
|
|
||||||
Axios.get(url)
|
Axios.get(url)
|
||||||
.then((resp) => {
|
.then((resp) => {
|
||||||
var data = resp.data.data.data;
|
var data = resp.data.data.data;
|
||||||
|
if(!refresh) {
|
||||||
data = this.state.data.concat(data);
|
data = this.state.data.concat(data);
|
||||||
|
}
|
||||||
var page = resp.data.data.current_page;
|
var page = resp.data.data.current_page;
|
||||||
var lastPage = resp.data.data.last_page;
|
var lastPage = resp.data.data.last_page;
|
||||||
this.setState({
|
this.setState({
|
||||||
data: data,
|
data: data,
|
||||||
page: page,
|
page: page,
|
||||||
lastPage: lastPage,
|
lastPage: lastPage,
|
||||||
|
refresh: refresh
|
||||||
});
|
});
|
||||||
})
|
})
|
||||||
.catch((err) => {
|
.catch((err) => {
|
||||||
@@ -44,7 +53,11 @@ export default class TestsTable extends Component {
|
|||||||
var page = this.state.page;
|
var page = this.state.page;
|
||||||
page = page + 1;
|
page = page + 1;
|
||||||
|
|
||||||
this.getData(page);
|
if(this.state.refresh) {
|
||||||
|
clearInterval(this.state.interval);
|
||||||
|
}
|
||||||
|
|
||||||
|
this.getData(page, false);
|
||||||
}
|
}
|
||||||
|
|
||||||
toggleCollapse = () => {
|
toggleCollapse = () => {
|
||||||
@@ -66,6 +79,7 @@ export default class TestsTable extends Component {
|
|||||||
var lastPage = this.state.lastPage;
|
var lastPage = this.state.lastPage;
|
||||||
var data = this.state.data;
|
var data = this.state.data;
|
||||||
var show = this.state.showTable;
|
var show = this.state.showTable;
|
||||||
|
var refresh = this.state.refresh;
|
||||||
|
|
||||||
if(data.length > 0) {
|
if(data.length > 0) {
|
||||||
return (
|
return (
|
||||||
@@ -80,6 +94,11 @@ export default class TestsTable extends Component {
|
|||||||
<span className="ti-angle-down"></span>
|
<span className="ti-angle-down"></span>
|
||||||
}
|
}
|
||||||
</div>
|
</div>
|
||||||
|
{(show) &&
|
||||||
|
<div className="my-1">
|
||||||
|
<span className="text-muted">Auto refresh: {(refresh) ? 'On' : 'Off'}</span>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
</Col>
|
</Col>
|
||||||
</Row>
|
</Row>
|
||||||
<Collapse in={show}>
|
<Collapse in={show}>
|
||||||
|
|||||||
Reference in New Issue
Block a user