Adding a delay before positioning the regex

This gives the page time to render the loading indicator before doing
all the positioning work; providing a better experience for users when
rendering complicated regexs like that Perl email regex.
This commit is contained in:
Jeff Avallone 2014-12-13 08:19:27 -05:00
parent f81ba6535f
commit bc84f68250

View File

@ -81,9 +81,7 @@ export default class Regexper {
renderRegexp(expression) { renderRegexp(expression) {
var snap = Snap(this.svg), var snap = Snap(this.svg),
deferred = Q.defer(), padding = this.padding;
padding = this.padding,
result;
snap.selectAll('g').remove(); snap.selectAll('g').remove();
@ -95,17 +93,25 @@ export default class Regexper {
return result; return result;
}, this.showError.bind(this)) }, this.showError.bind(this))
.then((result) => { .then((result) => {
var box; var deferred = Q.defer();
result.position(); setTimeout(() => {
var box;
box = result.getBBox(); result.position();
result.container.transform(Snap.matrix()
.translate(padding - box.x, padding - box.y)); box = result.getBBox();
snap.attr({ result.container.transform(Snap.matrix()
width: box.width + padding * 2, .translate(padding - box.x, padding - box.y));
height: box.height + padding * 2 snap.attr({
width: box.width + padding * 2,
height: box.height + padding * 2
});
deferred.resolve();
}); });
return deferred.promise;
}); });
} }
} }