Skip to content

Commit 887bbf3

Browse files
committed
Merge pull request #2448 from jeff1evesque/feature-2447
#2447: Reduce redundant fetch 'if (this.mounted)', add spinner
2 parents 96b354e + 5ecebd9 commit 887bbf3

File tree

4 files changed

+92
-48
lines changed

4 files changed

+92
-48
lines changed

src/jsx/import/input-data/supply_predictors.jsx

Lines changed: 10 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -94,19 +94,17 @@ var SupplyPredictors = React.createClass({
9494
};
9595

9696
// asynchronous callback: ajax 'done' promise
97-
ajaxCaller(function (asynchObject) {
98-
// Append to DOM
99-
if (this.mounted) {
97+
if (this.mounted) {
98+
ajaxCaller(function (asynchObject) {
99+
// Append to DOM
100100
if (asynchObject && asynchObject.error) {
101101
this.setState({ajax_done_error: asynchObject.error});
102102
} else if (asynchObject) {
103103
this.setState({ajax_done_options: asynchObject});
104104
}
105-
}
106-
}.bind(this),
107-
// asynchronous callback: ajax 'fail' promise
108-
function (asynchStatus, asynchError) {
109-
if (this.mounted) {
105+
}.bind(this),
106+
// asynchronous callback: ajax 'fail' promise
107+
function (asynchStatus, asynchError) {
110108
if (asynchStatus) {
111109
this.setState({ajax_fail_status: asynchStatus});
112110
console.log('Error Status: ' + asynchStatus);
@@ -115,10 +113,10 @@ var SupplyPredictors = React.createClass({
115113
this.setState({ajax_fail_error: asynchError});
116114
console.log('Error Thrown: ' + asynchError);
117115
}
118-
}
119-
}.bind(this),
120-
// pass ajax arguments
121-
ajaxArguments);
116+
}.bind(this),
117+
// pass ajax arguments
118+
ajaxArguments);
119+
}
122120
},
123121
componentWillUnmount() {
124122
this.mounted = false;

src/jsx/import/session-type/data_append.jsx

Lines changed: 27 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ import SupplyDatasetFile from '../input-data/supply_dataset_file.jsx';
1414
import SupplyDatasetUrl from '../input-data/supply_dataset_url.jsx';
1515
import checkValidString from './../validator/valid_string.js';
1616
import checkValidInt from './../validator/valid_int.js';
17+
import Spinner from './../general/spinner.jsx';
1718

1819
var DataAppend = React.createClass({
1920
// initial 'state properties'
@@ -76,6 +77,13 @@ var DataAppend = React.createClass({
7677
var Dataset = this.getSupplyDataset(inputDatasetType, inputSessionId);
7778
var options = this.state.ajax_done_options;
7879

80+
if (this.state.display_spinner) {
81+
var AjaxSpinner = Spinner;
82+
}
83+
else {
84+
var AjaxSpinner = 'span';
85+
}
86+
7987
return(
8088
<fieldset className='fieldset-session-data-upload'>
8189
<legend>Data Upload</legend>
@@ -115,6 +123,8 @@ var DataAppend = React.createClass({
115123
</fieldset>
116124

117125
<Dataset onChange={this.displaySubmit}/>
126+
127+
<AjaxSpinner />
118128
</fieldset>
119129
);
120130
},
@@ -142,20 +152,23 @@ var DataAppend = React.createClass({
142152
'data': null
143153
};
144154

155+
// boolean to show ajax spinner
156+
this.setState({display_spinner: true});
157+
145158
// asynchronous callback: ajax 'done' promise
146-
ajaxCaller(function (asynchObject) {
147-
// Append to DOM
148-
if (this.mounted) {
159+
if (this.mounted) {
160+
ajaxCaller(function (asynchObject) {
161+
// Append to DOM
149162
if (asynchObject && asynchObject.error) {
150163
this.setState({ajax_done_error: asynchObject.error});
151164
} else if (asynchObject) {
152165
this.setState({ajax_done_options: asynchObject});
153166
}
154-
}
155-
}.bind(this),
156-
// asynchronous callback: ajax 'fail' promise
157-
function (asynchStatus, asynchError) {
158-
if (this.mounted) {
167+
// boolean to hide ajax spinner
168+
this.setState({display_spinner: false});
169+
}.bind(this),
170+
// asynchronous callback: ajax 'fail' promise
171+
function (asynchStatus, asynchError) {
159172
if (asynchStatus) {
160173
this.setState({ajax_fail_status: asynchStatus});
161174
console.log('Error Status: ' + asynchStatus);
@@ -164,10 +177,12 @@ var DataAppend = React.createClass({
164177
this.setState({ajax_fail_error: asynchError});
165178
console.log('Error Thrown: ' + asynchError);
166179
}
167-
}
168-
}.bind(this),
169-
// pass ajax arguments
170-
ajaxArguments);
180+
// boolean to hide ajax spinner
181+
this.setState({display_spinner: false});
182+
}.bind(this),
183+
// pass ajax arguments
184+
ajaxArguments);
185+
}
171186
},
172187
componentWillUnmount() {
173188
this.mounted = false;

src/jsx/import/session-type/model_generate.jsx

Lines changed: 28 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99

1010
import checkValidString from './../validator/valid_string.js';
1111
import checkValidInt from './../validator/valid_int.js';
12+
import Spinner from './../general/spinner.jsx';
1213

1314
var ModelGenerate = React.createClass({
1415
// initial 'state properties'
@@ -69,6 +70,14 @@ var ModelGenerate = React.createClass({
6970
// triggered when 'state properties' change
7071
render: function(){
7172
var options = this.state.ajax_done_options;
73+
74+
if (this.state.display_spinner) {
75+
var AjaxSpinner = Spinner;
76+
}
77+
else {
78+
var AjaxSpinner = 'span';
79+
}
80+
7281
return(
7382
<fieldset className='fieldset-session-generate'>
7483
<legend>Generate Model</legend>
@@ -106,6 +115,8 @@ var ModelGenerate = React.createClass({
106115

107116
</select>
108117
</fieldset>
118+
119+
<AjaxSpinner />
109120
</fieldset>
110121
);
111122
},
@@ -121,20 +132,23 @@ var ModelGenerate = React.createClass({
121132
'data': null
122133
};
123134

135+
// boolean to show ajax spinner
136+
this.setState({display_spinner: true});
137+
124138
// asynchronous callback: ajax 'done' promise
125-
ajaxCaller(function (asynchObject) {
126-
// Append to DOM
127-
if (this.mounted) {
139+
if (this.mounted) {
140+
ajaxCaller(function (asynchObject) {
141+
// Append to DOM
128142
if (asynchObject && asynchObject.error) {
129143
this.setState({ajax_done_error: asynchObject.error});
130144
} else if (asynchObject) {
131145
this.setState({ajax_done_options: asynchObject});
132146
}
133-
}
134-
}.bind(this),
135-
// asynchronous callback: ajax 'fail' promise
136-
function (asynchStatus, asynchError) {
137-
if (this.mounted) {
147+
// boolean to hide ajax spinner
148+
this.setState({display_spinner: false});
149+
}.bind(this),
150+
// asynchronous callback: ajax 'fail' promise
151+
function (asynchStatus, asynchError) {
138152
if (asynchStatus) {
139153
this.setState({ajax_fail_status: asynchStatus});
140154
console.log('Error Status: ' + asynchStatus);
@@ -143,10 +157,12 @@ var ModelGenerate = React.createClass({
143157
this.setState({ajax_fail_error: asynchError});
144158
console.log('Error Thrown: ' + asynchError);
145159
}
146-
}
147-
}.bind(this),
148-
// pass ajax arguments
149-
ajaxArguments);
160+
// boolean to hide ajax spinner
161+
this.setState({display_spinner: false});
162+
}.bind(this),
163+
// pass ajax arguments
164+
ajaxArguments);
165+
}
150166
},
151167
componentWillUnmount() {
152168
this.mounted = false;

src/jsx/import/session-type/model_predict.jsx

Lines changed: 27 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99

1010
import SupplyPredictors from '../input-data/supply_predictors.jsx';
1111
import checkValidInt from './../validator/valid_int.js';
12+
import Spinner from './../general/spinner.jsx';
1213

1314
var ModelPredict = React.createClass({
1415
// initial 'state properties'
@@ -61,6 +62,13 @@ var ModelPredict = React.createClass({
6162
var Predictors = this.getSupplyPredictors(inputModelId);
6263
var options = this.state.ajax_done_options;
6364

65+
if (this.state.display_spinner) {
66+
var AjaxSpinner = Spinner;
67+
}
68+
else {
69+
var AjaxSpinner = 'span';
70+
}
71+
6472
return(
6573
<fieldset className='fieldset-session-predict'>
6674
<legend>Analysis</legend>
@@ -93,6 +101,8 @@ var ModelPredict = React.createClass({
93101
onChange={this.displaySubmit}
94102
selectedModelId={this.state.value_model_id}
95103
/>
104+
105+
<AjaxSpinner />
96106
</fieldset>
97107
);
98108
},
@@ -117,20 +127,23 @@ var ModelPredict = React.createClass({
117127
'data': null
118128
};
119129

130+
// boolean to show ajax spinner
131+
this.setState({display_spinner: true});
132+
120133
// asynchronous callback: ajax 'done' promise
121-
ajaxCaller(function (asynchObject) {
122-
// Append to DOM
123-
if (this.mounted) {
134+
if (this.mounted) {
135+
ajaxCaller(function (asynchObject) {
136+
// Append to DOM
124137
if (asynchObject && asynchObject.error) {
125138
this.setState({ajax_done_error: asynchObject.error});
126139
} else if (asynchObject) {
127140
this.setState({ajax_done_options: asynchObject});
128141
}
129-
}
130-
}.bind(this),
131-
// asynchronous callback: ajax 'fail' promise
132-
function (asynchStatus, asynchError) {
133-
if (this.mounted) {
142+
// boolean to hide ajax spinner
143+
this.setState({display_spinner: false});
144+
}.bind(this),
145+
// asynchronous callback: ajax 'fail' promise
146+
function (asynchStatus, asynchError) {
134147
if (asynchStatus) {
135148
this.setState({ajax_fail_status: asynchStatus});
136149
console.log('Error Status: ' + asynchStatus);
@@ -139,10 +152,12 @@ var ModelPredict = React.createClass({
139152
this.setState({ajax_fail_error: asynchError});
140153
console.log('Error Thrown: ' + asynchError);
141154
}
142-
}
143-
}.bind(this),
144-
// pass ajax arguments
145-
ajaxArguments);
155+
// boolean to hide ajax spinner
156+
this.setState({display_spinner: false});
157+
}.bind(this),
158+
// pass ajax arguments
159+
ajaxArguments);
160+
}
146161
},
147162
componentWillUnmount() {
148163
this.mounted = false;

0 commit comments

Comments
 (0)