From 29316bb2aac865467d9dde475e6f088d0d245323 Mon Sep 17 00:00:00 2001 From: Jeff Avallone Date: Sat, 13 Dec 2014 12:28:16 -0500 Subject: [PATCH] Updating renderLabel to be promise based --- src/js/parser/javascript/any_character.js | 3 +- src/js/parser/javascript/base.js | 70 +++++++++-------------- src/js/parser/javascript/escape.js | 7 +-- src/js/parser/javascript/literal.js | 7 +-- src/js/parser/javascript/match.js | 28 +++++---- 5 files changed, 50 insertions(+), 65 deletions(-) diff --git a/src/js/parser/javascript/any_character.js b/src/js/parser/javascript/any_character.js index 4bfe969..aec4687 100644 --- a/src/js/parser/javascript/any_character.js +++ b/src/js/parser/javascript/any_character.js @@ -5,7 +5,6 @@ export default _.extend({}, Base, { type: 'any-character', _render() { - this.renderLabel('any character'); - return this.terminalRender(); + return this.renderLabel('any character'); } }); diff --git a/src/js/parser/javascript/base.js b/src/js/parser/javascript/base.js index cb7f887..014e3a6 100644 --- a/src/js/parser/javascript/base.js +++ b/src/js/parser/javascript/base.js @@ -16,33 +16,29 @@ export default { }, renderLabel(text) { - var group = this.container.group() - .addClass('label'); + var deferred = Q.defer(), + group = this.container.group() + .addClass('label'), + rect = group.rect(), + text = group.text().attr({ + text: text + }); - group.rect(); + setTimeout(deferred.resolve.bind(deferred, group)); + deferred.promise.then(() => { + var box = text.getBBox(), + margin = 5; - group.text().attr({ - text: text + text.transform(Snap.matrix() + .translate(margin, box.height + margin)); + + rect.attr({ + width: box.width + 2 * margin, + height: box.height + 2 * margin + }); }); - this._labelGroups.push(group); - - return group; - }, - - positionLabel(group) { - var text = group.select('text'), - rect = group.select('rect'), - box = text.getBBox(), - margin = 5; - - text.transform(Snap.matrix() - .translate(margin, box.height + margin)); - - rect.attr({ - width: box.width + 2 * margin, - height: box.height + 2 * margin - }); + return deferred.promise; }, render(container) { @@ -50,15 +46,11 @@ export default { this.setContainer(container); } - this._labelGroups = []; - return this._render().then((function() { - if (!this._proxy) { - _.each(this._labelGroups, this.positionLabel.bind(this)); - this._position(); - } - - return this; - }).bind(this)); + var promise = this._render(); + if (!this._proxy) { + promise = promise.then(this._position.bind(this)); + } + return promise.then(_.constant(this)); }, proxy(node) { @@ -66,25 +58,17 @@ export default { return this._proxy.render(this.container); }, - terminalRender() { - var deferred = Q.defer(); - - setTimeout(() => { deferred.resolve() }); - return deferred.promise; - }, - _render() { console.log(this.type, this); this.container.addClass('placeholder'); - this.renderLabel(this.type + ': ' + this.textValue) - .select('rect').attr({ + return this.renderLabel(this.type + ': ' + this.textValue).then(label => { + label.select('rect').attr({ rx: 10, ry: 10 }); - - return this.terminalRender(); + }); }, _position() {}, diff --git a/src/js/parser/javascript/escape.js b/src/js/parser/javascript/escape.js index 069c3f8..6804618 100644 --- a/src/js/parser/javascript/escape.js +++ b/src/js/parser/javascript/escape.js @@ -13,13 +13,12 @@ export default _.extend({}, Base, { }, _render() { - this.renderLabel(_.result(this, this.code())) - .select('rect').attr({ + return this.renderLabel(_.result(this, this.code())).then(label => { + label.select('rect').attr({ rx: 3, ry: 3 }); - - return this.terminalRender(); + }); }, // Escape code mappings diff --git a/src/js/parser/javascript/literal.js b/src/js/parser/javascript/literal.js index e663a00..3e3ff9c 100644 --- a/src/js/parser/javascript/literal.js +++ b/src/js/parser/javascript/literal.js @@ -5,12 +5,11 @@ export default _.extend({}, Base, { type: 'literal', _render() { - this.renderLabel('"' + this.literal.textValue + '"') - .select('rect').attr({ + return this.renderLabel('"' + this.literal.textValue + '"').then(label => { + label.select('rect').attr({ rx: 3, ry: 3 }); - - return this.terminalRender(); + }); } }); diff --git a/src/js/parser/javascript/match.js b/src/js/parser/javascript/match.js index 64b91bd..57b4f3a 100644 --- a/src/js/parser/javascript/match.js +++ b/src/js/parser/javascript/match.js @@ -6,30 +6,34 @@ export default _.extend({}, Base, { type: 'match', _render() { - this.contents = { parts: this.parts() }; + var start, end, + parts = this.parts(), + partPromises; if (this.anchorStart()) { - this.contents.anchor_start = this.renderLabel('Start of line') - .addClass('anchor'); + start = this.renderLabel('Start of line').then(label => { + return label.addClass('anchor'); + }); } if (this.anchorEnd()) { - this.contents.anchor_end = this.renderLabel('End of line') - .addClass('anchor'); + end = this.renderLabel('End of line').then(label => { + return label.addClass('anchor'); + }); } - if (this.contents.anchor_start || this.contents.anchor_end || this.contents.parts.length !== 1) { - return Q.all(_.map(this.contents.parts, (function(part) { + if (start || end || parts.length !== 1) { + partPromises = _.map(parts, (function(part) { return part.render(this.container.group()); - }).bind(this))); + }).bind(this)); + + return Q.all(_([start, partPromises, end]).flatten().compact().value()); } else { - return this.proxy(this.contents.parts[0]); + return this.proxy(parts[0]); } }, - _position() { - var items = _(this.contents).at('anchor_start', 'parts', 'anchor_end').flatten().compact().value(); - + _position(items) { this.spaceHorizontally(items, { padding: 10 });