add preloader for build console
This commit is contained in:
parent
b07ae57499
commit
cbbf1db699
2
app.js
2
app.js
@ -32,7 +32,7 @@ var server = http.createServer(function(req, res) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
if (req.url.indexOf('/data.io.js') === -1) {
|
if (req.url.indexOf('/data.io.js') === -1) {
|
||||||
if (/(js|css|fonts)/.test(req.url)) {
|
if (/(js|css|fonts|images)/.test(req.url)) {
|
||||||
staticServer.serve(req, res);
|
staticServer.serve(req, res);
|
||||||
} else {
|
} else {
|
||||||
// serve index for all app pages
|
// serve index for all app pages
|
||||||
|
BIN
static/images/preloader.gif
Normal file
BIN
static/images/preloader.gif
Normal file
Binary file not shown.
After Width: | Height: | Size: 11 KiB |
@ -1,3 +1,3 @@
|
|||||||
.terminal
|
.terminal
|
||||||
pre.terminal_code
|
pre.terminal_code
|
||||||
.terminal_footer(style={height: '30px'})
|
.terminal_footer
|
||||||
|
@ -5,9 +5,18 @@ define([
|
|||||||
'react',
|
'react',
|
||||||
'reflux',
|
'reflux',
|
||||||
'app/stores/terminal',
|
'app/stores/terminal',
|
||||||
|
'app/stores/build',
|
||||||
'ansi_up',
|
'ansi_up',
|
||||||
'templates/app/components/terminal/terminal',
|
'templates/app/components/terminal/terminal'
|
||||||
], function(_, React, Reflux, terminalStore, ansiUp, template) {
|
], function(
|
||||||
|
_,
|
||||||
|
React,
|
||||||
|
Reflux,
|
||||||
|
terminalStore,
|
||||||
|
buildStore,
|
||||||
|
ansiUp,
|
||||||
|
template
|
||||||
|
) {
|
||||||
var Component = React.createClass({
|
var Component = React.createClass({
|
||||||
mixins: [Reflux.ListenerMixin],
|
mixins: [Reflux.ListenerMixin],
|
||||||
|
|
||||||
@ -19,9 +28,26 @@ define([
|
|||||||
this.listenTo(terminalStore, this.updateItems);
|
this.listenTo(terminalStore, this.updateItems);
|
||||||
var node = document.getElementsByClassName('terminal')[0];
|
var node = document.getElementsByClassName('terminal')[0];
|
||||||
this.initialScrollPosition = node.getBoundingClientRect().top;
|
this.initialScrollPosition = node.getBoundingClientRect().top;
|
||||||
|
if (this.props.showPreloader) {
|
||||||
|
this.getTerminal().insertAdjacentHTML('afterend',
|
||||||
|
'<img src="/images/preloader.gif" class="terminal_preloader"/>'
|
||||||
|
);
|
||||||
|
|
||||||
|
this.listenTo(buildStore, function(build) {
|
||||||
|
if (build.completed) {
|
||||||
|
this.removePreloader();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
window.onscroll = this.onScroll;
|
window.onscroll = this.onScroll;
|
||||||
},
|
},
|
||||||
|
removePreloader: function() {
|
||||||
|
var preloader = document.getElementsByClassName(
|
||||||
|
'terminal_preloader'
|
||||||
|
)[0];
|
||||||
|
preloader.parentNode.removeChild(preloader);
|
||||||
|
},
|
||||||
componentWillUnmount: function() {
|
componentWillUnmount: function() {
|
||||||
window.onscroll = null;
|
window.onscroll = null;
|
||||||
},
|
},
|
||||||
@ -91,6 +117,9 @@ define([
|
|||||||
this.data = build.data;
|
this.data = build.data;
|
||||||
this.renderBuffer();
|
this.renderBuffer();
|
||||||
}
|
}
|
||||||
|
if (this.props.showPreloader && build.buildCompleted) {
|
||||||
|
this.removePreloader();
|
||||||
|
}
|
||||||
},
|
},
|
||||||
shouldComponentUpdate: function() {
|
shouldComponentUpdate: function() {
|
||||||
return false;
|
return false;
|
||||||
|
@ -36,6 +36,7 @@ define([
|
|||||||
self.lines = self.lines.concat(data.lines);
|
self.lines = self.lines.concat(data.lines);
|
||||||
self.trigger({
|
self.trigger({
|
||||||
buildId: build.id,
|
buildId: build.id,
|
||||||
|
buildCompleted: build.completed,
|
||||||
name: 'Console for build #' + build.id,
|
name: 'Console for build #' + build.id,
|
||||||
data: _(self.lines).pluck('text')
|
data: _(self.lines).pluck('text')
|
||||||
});
|
});
|
||||||
|
Loading…
x
Reference in New Issue
Block a user