andi/perfdb
1
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Activity

add links to current settings and to current image

Browse Source
This commit is contained in:
Andreas Huber
2018-04-10 19:59:09 +02:00
parent fe29b0d738
commit 7018a11ab3
7 changed files with 198 additions and 95 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
pdb-ui/src/main/resources/resources/js/ui.js
View File

@@ -200,7 +200,7 @@ Vue.component('result-view', {
},
computed: {
showPrevNext: function() {
return data.searchBar.splitBy.values.length > 0 && data.resultView.imageUrl;
return data.searchBar.splitBy.values.length > 0 && !data.resultView.loadingGameActive;
}
},
template: `
@@ -445,13 +445,12 @@ Vue.component('search-bar', {
},
computed: {
permalink: function() {
var groupBy = [];
data.searchBar.groupByKeys.forEach(function(e){ if (e.selected) {groupBy.push(e.selected);}});
var params = {
'query': data.searchBar.query,
'groupBy': groupBy,
var groupBy = [];
data.searchBar.groupByKeys.forEach(function(e){ if (e.selected) {groupBy.push(e.selected);}});
var params = {
'query': data.searchBar.query,
'groupBy': groupBy,
'splitByKeys.selected': data.searchBar.splitByKeys.selected,
'limitBy.selected': data.searchBar.limitBy.selected,
'limitBy.number': data.searchBar.limitBy.number,
@@ -459,12 +458,12 @@ Vue.component('search-bar', {
'dateRange': data.searchBar.dateRange,
'axisScale': data.searchBar.axisScale,
'plotType': data.searchBar.plotType,
'showAggregate': data.searchBar.showAggregate,
'aggregate': data.searchBar.aggregate,
'keyOutside': data.searchBar.keyOutside,
};
var link = window.location.origin+ window.location.pathname + "?" + jQuery.param( params );
return link;
};
var link = window.location.origin+ window.location.pathname + "?" + jQuery.param( params );
return link;
}
},
template: `
@@ -554,7 +553,7 @@ Vue.component('search-bar', {
<div class="group" id="group-show-aggregate" v-show="searchBar.plotType == 'SCATTER'">
<label for="show-aggregate">Aggregate:</label>
<select id="show-aggregate" v-model="searchBar.showAggregate">
<select id="show-aggregate" v-model="searchBar.aggregate">
<option value="NONE">-</option>
<option value="PERCENTILES">percentiles</option>
</select>
@@ -578,7 +577,9 @@ Vue.component('search-bar', {
v-on:click.prevent.stop="dashboard"
><i class="fa fa-object-group" aria-hidden="true"></i> Dashboard</button>
-->
<a v-bind:href="permalink" title="Permanent Link" class="permalink"><i class="fa fa-link" aria-hidden="true"></i></a>
<a v-bind:href="permalink" v-show="permalink" title="Permanent link to the current settings." class="permalink"><i class="fa fa-sliders" aria-hidden="true"></i></a>
<a v-bind:href="searchBar.imagelink" v-show="searchBar.imagelink" title="Image Link" class="permalink"><i class="fa fa-image" aria-hidden="true"></i></a>
</div>
</div>
</form>`
@@ -638,7 +639,7 @@ var data = {
dateRange: GetURLParameter('dateRange','1 week'),
axisScale: GetURLParameter('axisScale','LOG10'),
plotType: GetURLParameter('plotType','SCATTER'),
showAggregate: GetURLParameter('showAggregate','NONE'),
aggregate: GetURLParameter('aggregate','NONE'),
keyOutside: GetURLParameterBoolean('keyOutside', 'false'),
splitBy: {
@@ -646,12 +647,14 @@ var data = {
query: '',
values: [],
index: 0
}
},
imagelink: ""
},
resultView: {
imageUrl: '',
errorMessage: ''
}
errorMessage: '',
loadingGameActive: false
},
};
@@ -659,10 +662,17 @@ function showLoadingIcon()
{
data.resultView.imageUrl = '';
data.resultView.errorMessage = '';
data.resultView.loadingGameActive = true;
startInvaders();
}
function hideLoadingIcon()
{
data.resultView.loadingGameActive = false;
pauseInvaders();
}
function plotCurrent()
{
showLoadingIcon();
@@ -712,14 +722,15 @@ function sendPlotRequest(query){
request['dateRange'] = data.searchBar.dateRange;
request['axisScale'] = data.searchBar.axisScale;
request['plotType'] = data.searchBar.plotType;
request['aggregate'] = data.searchBar.showAggregate;
request['aggregate'] = data.searchBar.aggregate;
request['keyOutside'] = data.searchBar.keyOutside;
var success = function(response){
data.resultView.imageUrl = response.imageUrl;
data.resultView.errorMessage = '';
pauseInvaders();
hideLoadingIcon();
updateImageLink(query);
};
var error = function(e) {
data.resultView.imageUrl = '';
@@ -732,12 +743,36 @@ function sendPlotRequest(query){
else{
data.resultView.errorMessage = "FAILED: " + JSON.parse(e.responseText).message;
}
pauseInvaders();
hideLoadingIcon();
};
data.searchBar.imagelink = '';
postJson("plots", request, success, error);
}
function updateImageLink(query) {
var groupBy = [];
data.searchBar.groupByKeys.forEach(function(e){ if (e.selected) {groupBy.push(e.selected);}});
var params = {
'query': query,
'groupBy': groupBy,
'splitByKeys.selected': data.searchBar.splitByKeys.selected,
'limitBy.selected': data.searchBar.limitBy.selected,
'limitBy.number': data.searchBar.limitBy.number,
'dateFrom': data.searchBar.dateFrom,
'dateRange': data.searchBar.dateRange,
'axisScale': data.searchBar.axisScale,
'plotType': data.searchBar.plotType,
'aggregate': data.searchBar.aggregate,
'keyOutside': data.searchBar.keyOutside,
'width': $('#result-image').width(),
'height': $('#result-image').height()
};
data.searchBar.imagelink = window.location.origin+ window.location.pathname + "plots?" + jQuery.param(params);
}
function postJson(url, requestData, successCallback, errorCallback) {
@@ -748,8 +783,7 @@ function postJson(url, requestData, successCallback, errorCallback) {
contentType: 'application/json'
})
.done(successCallback)
.fail(errorCallback)
;
.fail(errorCallback);
}
function getJson(url, requestData, successCallback, errorCallback) {