diff options
| author | Arthur de Jong <arthur@arthurdejong.org> | 2020-08-16 18:51:10 +0200 |
|---|---|---|
| committer | Arthur de Jong <arthur@arthurdejong.org> | 2020-08-16 22:10:33 +0200 |
| commit | 0c3bd112348cc6221b3e0befcf117252861c0e68 (patch) | |
| tree | a3f3b882eaec8ca79bb70d3503f31c296b5b543e /src | |
| parent | fb97c69baf7963f43a304b321d1c78212c31afc4 (diff) | |
Allow downloading the dashboard as a JSON file
Diffstat (limited to 'src')
| -rw-r--r-- | src/index.html | 1 | ||||
| -rw-r--r-- | src/munin-plot.js | 40 |
2 files changed, 30 insertions, 11 deletions
diff --git a/src/index.html b/src/index.html index dbb6cf1..cbfc515 100644 --- a/src/index.html +++ b/src/index.html @@ -189,6 +189,7 @@ </div> <div class="modal-footer"> <button type="button" class="btn btn-sm btn-primary" id="saveDashboardClipboard" title="Copy data to clipboard"><i class="fa fa-copy"></i></button> + <button type="button" class="btn btn-sm btn-primary" id="saveDashboardFile" title="Download as file"><i class="fa fa-file-download"></i></button> </div> </form> </div> diff --git a/src/munin-plot.js b/src/munin-plot.js index ef22a4a..7728f3a 100644 --- a/src/munin-plot.js +++ b/src/munin-plot.js @@ -725,6 +725,22 @@ $(document).ready(function () { $('#saveDashboard .alert').remove() }) + // output readable but compact JSON + function getSaveDashboardData() { + var value = '{\n' + var name = $('#saveDashboardName').val() + if (name) { + value += ' "name": ' + JSON.stringify(name) + ',\n' + } + if ($('#saveDashboardDateRange:checked').length) { + var dateRange = JSON.parse(localStorage.getItem('dateRange')) + value += ' "dateRange": ' + JSON.stringify(dateRange) + ',\n' + } + var graphs = JSON.parse(localStorage.getItem('shownGraphs')) + value += ' "graphs": ' + JSON.stringify(graphs) + '\n}' + return value + } + // save dialog copy data to clipboard $('#saveDashboardClipboard').on('click', function (event) { // create a temporary text area @@ -735,17 +751,7 @@ $(document).ready(function () { top: '-1000px' }) // fill text area with JSON - textarea.value = '{\n' - var name = $('#saveDashboardName').val() - if (name) { - textarea.value += ' "name": ' + JSON.stringify(name) + ',\n' - } - if ($('#saveDashboardDateRange:checked').length) { - var dateRange = JSON.parse(localStorage.getItem('dateRange')) - textarea.value += ' "dateRange": ' + JSON.stringify(dateRange) + ',\n' - } - var graphs = JSON.parse(localStorage.getItem('shownGraphs')) - textarea.value += ' "graphs": ' + JSON.stringify(graphs) + '\n}' + textarea.value = getSaveDashboardData() // copy text area to clipboard $('#saveDashboard form').append(textarea) textarea.select() @@ -760,6 +766,18 @@ $(document).ready(function () { }) }) + // save dashboard definition to file + $('#saveDashboardFile').on('click', function (event) { + var element = document.createElement('a') + element.setAttribute('href', 'data:application/json;charset=utf-8,' + encodeURIComponent(getSaveDashboardData() + '\n')) + element.setAttribute('download', 'dashboard.json') + element.style.display = 'none' + document.body.appendChild(element) + element.click() + document.body.removeChild(element) + $('#saveDashboard').modal('hide') + }) + // handle showing and hiding of the load dashboard dialog $('#loadDashboard').on('shown.bs.modal', function () { $('#loadDashboardData').trigger('focus') |