Skip to content

Commit 14b21a0

Browse files
labkey-jeckelslabkey-jeckels
authored
Issue 52643: Panorama QC metric pages loading slowly (#1060)
1 parent 8fbc5b7 commit 14b21a0

10 files changed

Lines changed: 85 additions & 46 deletions

File tree

‎resources/views/configureQCMetric.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
in each folder.
44
</p>
55

6-
<div id="qcMetricsTable"></div>
6+
<div id="qcMetricsTable">Loading...</div>
77
<div id="qcMetricsError"></div>
88
<script type="text/javascript" nonce="<%=scriptNonce%>">
99

‎src/org/labkey/targetedms/view/paretoPlot.jsp‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,7 @@
3333
dependencies.add("targetedms/css/ParetoPlot.css");
3434
dependencies.add("targetedms/js/BaseQCPlotPanel.js");
3535
dependencies.add("targetedms/js/ParetoPlotPanel.js");
36+
dependencies.add("targetedms/js/QCMetricConfigLoader.js");
3637
}
3738
%>
3839
<%

‎src/org/labkey/targetedms/view/qcSummary.jsp‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@
2929
dependencies.add("targetedms/js/BaseQCPlotPanel.js");
3030
dependencies.add("targetedms/css/QCSummary.css");
3131
dependencies.add("targetedms/js/QCSummaryPanel.js");
32+
dependencies.add("targetedms/js/QCMetricConfigLoader.js");
3233
}
3334
%>
3435
<%
@@ -37,7 +38,7 @@
3738
Integer sampleLimit = (Integer)HttpView.currentModel();
3839
%>
3940

40-
<div style="min-height: 160px;" id="<%=h(qcSummaryId)%>" ></div>
41+
<div style="min-height: 175px;" id="<%=h(qcSummaryId)%>" ></div>
4142

4243
<script type="text/javascript" nonce="<%=getScriptNonce()%>">
4344
Ext4.onReady(function()

‎src/org/labkey/targetedms/view/qcTrendPlotReport.jsp‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,7 @@
4747
dependencies.add("targetedms/js/QCTrendPlotPanel.js");
4848
dependencies.add("targetedms/js/QCPlotHoverPanel.js");
4949
dependencies.add("targetedms/js/PlotTypeCheckCombo.js");
50+
dependencies.add("targetedms/js/QCMetricConfigLoader.js");
5051
}
5152
%>
5253
<%

‎test/src/org/labkey/test/pages/panoramapremium/ConfigureMetricsUIPage.java‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -74,7 +74,7 @@ public ConfigureMetricsUIPage setShowMetricNoOutlier(QCPlotsWebPart.MetricType m
7474

7575
public void waitForMetricToAppear(QCPlotsWebPart.MetricType metric)
7676
{
77-
longWait().until(ExpectedConditions.visibilityOf(Locator.name(metric.toString()).findElement(getDriver())));
77+
waitForElement(Locator.name(metric.toString()), WAIT_FOR_PAGE);
7878
}
7979

8080
public String getLowerBound(String metric)
@@ -89,7 +89,7 @@ public String getUpperBound(String metric)
8989

9090
public void verifyNoDataForMetric(String metricName)
9191
{
92-
Assert.assertEquals("Data should not be present for this metric - " + metricName, getText(Locator.id(metricName)), "No data in this folder");
92+
Assert.assertEquals("Data should not be present for this metric - " + metricName, "No data in this folder", getText(Locator.id(metricName)));
9393
}
9494

9595
public void clickSave()

‎webapp/TargetedMS/js/BaseQCPlotPanel.js‎

Lines changed: 5 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -31,21 +31,20 @@ Ext4.define('LABKEY.targetedms.BaseQCPlotPanel', {
3131
},
3232

3333
getPlotWebPartHeader: function(wp, title) {
34-
var html = '<br/>' +
35-
'<table class="labkey-wp ' + wp + '">' +
34+
return '<br/>' +
35+
'<table class="labkey-wp ' + Ext4.util.Format.htmlEncode(wp) + '">' +
3636
' <tr class="labkey-wp-header">' +
3737
' <th class="labkey-wp-title-left">' +
38-
' <span class="labkey-wp-title-text ' + wp + '-title">'+ Ext4.util.Format.htmlEncode(title) + '</span>' +
38+
' <span class="labkey-wp-title-text ' + Ext4.util.Format.htmlEncode(wp) + '-title">' + Ext4.util.Format.htmlEncode(title) + '</span>' +
3939
' </th>' +
4040
' </tr>';
41-
return html;
4241
},
4342

4443
addPlotWebPartToPlotDiv: function (id, title, div, wp) {
4544
var html = this.getPlotWebPartHeader(wp, title);
4645
html += '<tr>' +
4746
' <td class="labkey-wp-body">' +
48-
' <div id="' + id + '" class="chart-render-div"></div>' +
47+
' <div id="' + Ext4.util.Format.htmlEncode(id) + '" class="chart-render-div"></div>' +
4948
' </td>' +
5049
' </tr>' +
5150
'</table>';
@@ -57,7 +56,7 @@ Ext4.define('LABKEY.targetedms.BaseQCPlotPanel', {
5756

5857
Ext4.each(ids, function(plotId){
5958
html += '<tr>' +
60-
' <td><div id="' + plotId + '" class="chart-render-div"></div></td>' +
59+
' <td><div id="' + Ext4.util.Format.htmlEncode(plotId) + '" class="chart-render-div"></div></td>' +
6160
' </tr>';
6261
});
6362
html += '</table>';
@@ -136,21 +135,6 @@ Ext4.define('LABKEY.targetedms.BaseQCPlotPanel', {
136135
}
137136
},
138137

139-
queryInitialQcMetrics : function(successCallback,callbackScope) {
140-
LABKEY.Ajax.request({
141-
url: LABKEY.ActionURL.buildURL('targetedms', 'GetQCMetricConfigurations.api'),
142-
method: 'GET',
143-
success: function(response) {
144-
this.metricPropArr = Ext4.JSON.decode(response.responseText).configurations;
145-
successCallback.call(callbackScope);
146-
},
147-
failure: LABKEY.Utils.getCallbackWrapper(function(response) {
148-
this.failureHandler(response);
149-
}, null, true),
150-
scope: this
151-
});
152-
},
153-
154138
queryQCInstruments: function(successCallback, callbackScope) {
155139
LABKEY.Query.executeSql({
156140
schemaName: 'targetedms',

‎webapp/TargetedMS/js/ParetoPlotPanel.js‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -15,12 +15,13 @@ Ext4.define('LABKEY.targetedms.ParetoPlotPanel', {
1515
{
1616
this.callParent();
1717

18-
this.queryInitialQcMetrics(this.initPlot, this);
19-
},
18+
Ext4.get(this.plotDivId).mask("Loading...");
2019

21-
initPlot : function() {
20+
LABKEY.targetedms.QCMetricConfigLoader.getMetrics(this.initPlot, this);
21+
},
2222

23-
Ext4.get(this.plotDivId).mask("Loading...");
23+
initPlot : function(metrics) {
24+
this.metricPropArr = metrics;
2425

2526
LABKEY.Ajax.request({
2627
url: LABKEY.ActionURL.buildURL('targetedms', 'GetQCMetricOutliers.api'),

‎webapp/TargetedMS/js/QCMetricConfigLoader.js‎

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
if (!LABKEY.targetedms) {
2+
LABKEY.targetedms = {};
3+
}
4+
5+
if (!LABKEY.targetedms.QCMetricConfigLoader) {
6+
LABKEY.targetedms.QCMetricConfigLoader = {
7+
initialQcMetrics: null,
8+
initialQcMetricsCallbacks: [],
9+
initialQcMetricsRequested: false,
10+
11+
getMetrics : function(successCallback, callbackScope) {
12+
if (this.initialQcMetrics) {
13+
successCallback.call(callbackScope, this.initialQcMetrics);
14+
}
15+
else {
16+
this.initialQcMetricsCallbacks.push({callback: successCallback, scope: callbackScope});
17+
18+
if (!this.initialQcMetricsRequested) {
19+
this.initialQcMetricsRequested = true;
20+
LABKEY.Ajax.request({
21+
url: LABKEY.ActionURL.buildURL('targetedms', 'GetQCMetricConfigurations.api'),
22+
method: 'GET',
23+
success: function (response) {
24+
const configs = Ext4.JSON.decode(response.responseText).configurations;
25+
this.initialQcMetrics = configs;
26+
for (const c of this.initialQcMetricsCallbacks) {
27+
c.callback.call(c.scope, this.initialQcMetrics);
28+
}
29+
this.initialQcMetricsCallbacks = [];
30+
},
31+
failure: LABKEY.Utils.getCallbackWrapper(function (response) {
32+
this.failureHandler(response);
33+
}, null, true),
34+
scope: this
35+
});
36+
}
37+
}
38+
},
39+
40+
}
41+
}

‎webapp/TargetedMS/js/QCSummaryPanel.js‎

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -16,11 +16,17 @@ Ext4.define('LABKEY.targetedms.QCSummary', {
1616

1717
this.callParent();
1818

19-
this.qcPlotPanel.queryInitialQcMetrics(this.initPanel, this);
19+
this.add({
20+
xtype: 'label',
21+
text: 'Loading...'
22+
})
23+
24+
LABKEY.targetedms.QCMetricConfigLoader.getMetrics(this.initPanel, this);
2025
this.numSampleFileStats = config ? config.sampleLimit : 3;
2126
},
2227

23-
initPanel : function() {
28+
initPanel : function(metrics) {
29+
this.metricPropArr = metrics;
2430
this.qcPlotPanel.queryQCInstruments(this.getQCSummary, this);
2531
},
2632

@@ -32,6 +38,7 @@ Ext4.define('LABKEY.targetedms.QCSummary', {
3238
},
3339
scope: this,
3440
success: LABKEY.Utils.getCallbackWrapper(function (response) {
41+
this.removeAll();
3542
var containers = response['containers'],
3643
container,
3744
childPanelItems = [],
@@ -49,7 +56,7 @@ Ext4.define('LABKEY.targetedms.QCSummary', {
4956
container = containers[0];
5057
container.showName = hasChildren;
5158
container.isParent = true;
52-
container.parentOnly = containers.length == 1;
59+
container.parentOnly = containers.length === 1;
5360
if (this.qcPlotPanel.qcIntrumentsArr) {
5461
if (this.qcPlotPanel.qcIntrumentsArr.length > 1) {
5562
container.instrument = ' for multiple instruments: <ul>';

‎webapp/TargetedMS/js/QCTrendPlotPanel.js‎

Lines changed: 17 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -92,8 +92,9 @@ Ext4.define('LABKEY.targetedms.QCTrendPlotPanel', {
9292
if (this.minAcquiredTime == null || this.maxAcquiredTime == null)
9393
Ext4.get(this.plotDivId).update("<span class='labkey-error'>Unable to render report. Missing min and max AcquiredTime from data query.</span>");
9494
else {
95+
Ext4.get(this.plotDivId).update("Loading...");
9596
// Load replicate annotations in the callback.
96-
this.queryInitialQcMetrics(this.queryContainerReplicateAnnotations, this);
97+
LABKEY.targetedms.QCMetricConfigLoader.getMetrics(this.queryContainerReplicateAnnotations, this);
9798
}
9899
},
99100

@@ -111,7 +112,7 @@ Ext4.define('LABKEY.targetedms.QCTrendPlotPanel', {
111112
if (value === "true" || value === "false") {
112113
value = value === "true";
113114
}
114-
else if (value != undefined && value.length > 0 && !isNaN(Number(value))) {
115+
else if (value !== undefined && value.length > 0 && !isNaN(Number(value))) {
115116
value = +value;
116117
}
117118
else if (key === 'plotTypes') { // convert string to array
@@ -120,15 +121,15 @@ Ext4.define('LABKEY.targetedms.QCTrendPlotPanel', {
120121
value = value.split(',');
121122
}
122123
if(key === 'selectedAnnotations') {
123-
var annotations = {};
124+
const annotations = {};
124125

125-
var a = value.split(',');
126-
for(var i = 0; i < a.length; i++)
126+
const a = value.split(',');
127+
for (let i = 0; i < a.length; i++)
127128
{
128-
var b = a[i].split(":");
129-
var name = b[0];
130-
var val = b[1];
131-
var selected = annotations[name];
129+
const b = a[i].split(":");
130+
const name = b[0];
131+
const val = b[1];
132+
let selected = annotations[name];
132133
if(!selected)
133134
{
134135
selected = [];
@@ -154,7 +155,8 @@ Ext4.define('LABKEY.targetedms.QCTrendPlotPanel', {
154155
});
155156
},
156157

157-
queryContainerReplicateAnnotations : function() {
158+
queryContainerReplicateAnnotations : function(metrics) {
159+
this.metricPropArr = metrics;
158160
LABKEY.Ajax.request({
159161
url: LABKEY.ActionURL.buildURL('targetedms', 'GetContainerReplicateAnnotations.api'),
160162
method: 'GET',
@@ -211,6 +213,8 @@ Ext4.define('LABKEY.targetedms.QCTrendPlotPanel', {
211213
}
212214

213215
this.getExpRunRangeDetails();
216+
// We just finished loading the previously set options so clear any dirty state
217+
this.havePlotOptionsChanged = false;
214218
},
215219

216220
getExpRunRangeDetails: function() {
@@ -286,7 +290,6 @@ Ext4.define('LABKEY.targetedms.QCTrendPlotPanel', {
286290

287291
getFirstPlotOptionsToolbar: function() {
288292
if (!this.plotTypeOptionsToolbar) {
289-
let items = [];
290293
this.plotTypeOptionsToolbar = Ext4.create('Ext.toolbar.Toolbar', {
291294
ui: 'footer',
292295
cls: 'levey-jennings-toolbar',
@@ -327,7 +330,7 @@ Ext4.define('LABKEY.targetedms.QCTrendPlotPanel', {
327330
minValue: 2,
328331
listeners: {
329332
scope: this,
330-
change: function (cmp, newVal, oldVal) {
333+
change: function (cmp, newVal) {
331334
this.trailingRuns = newVal;
332335
this.havePlotOptionsChanged = true;
333336
this.displayTrendPlot();
@@ -370,7 +373,7 @@ Ext4.define('LABKEY.targetedms.QCTrendPlotPanel', {
370373
value: selectedPlotTypes,
371374
listeners: {
372375
scope: this,
373-
change: function(cmp, newVal, oldVal) {
376+
change: function(cmp, newVal) {
374377
var newValues = newVal;
375378
this.plotTypes = newValues ? Ext4.isArray(newValues) ? newValues : [newValues] : [];
376379

@@ -418,7 +421,7 @@ Ext4.define('LABKEY.targetedms.QCTrendPlotPanel', {
418421

419422
toolbarItems.push(this.getGroupedXCheckbox());
420423
toolbarItems.push({xtype: 'tbspacer'}, {xtype: 'tbseparator'}, {xtype: 'tbspacer'});
421-
var location = toolbarItems.push(this.getSinglePlotCheckbox());
424+
const location = toolbarItems.push(this.getSinglePlotCheckbox());
422425
toolbarItems.push({xtype: 'tbspacer'}, {xtype: 'tbseparator'}, {xtype: 'tbspacer'});
423426
toolbarItems.push(this.getShowExcludedCheckbox());
424427
toolbarItems.push({xtype: 'tbspacer'}, {xtype: 'tbseparator'}, {xtype: 'tbspacer'});

0 commit comments

Comments
 (0)