DEV: Remove buffered rendering from popup-input-tips

This is another refactoring in the multi-step process to remove all uses
of our custom Render Buffer.

Previous commit: fe9293b8b554ab79636faa61a4756d5ff514a233 in this
series.

This commit affects the display of popup input tips, like in the
composer when the title is too short or too long. It is just a refactor
and does not change any functionality.
This commit is contained in:
Blake Erickson 2019-12-05 10:59:36 -07:00
parent 891b71bdf5
commit f269e45978
2 changed files with 57 additions and 59 deletions

View File

@ -5,15 +5,15 @@ import {
default as discourseComputed, default as discourseComputed,
observes observes
} from "discourse-common/utils/decorators"; } from "discourse-common/utils/decorators";
import { bufferedRender } from "discourse-common/lib/buffered-render";
export default Component.extend( export default Component.extend({
bufferedRender({
classNameBindings: [":popup-tip", "good", "bad", "lastShownAt::hide"], classNameBindings: [":popup-tip", "good", "bad", "lastShownAt::hide"],
animateAttribute: null, animateAttribute: null,
bouncePixels: 6, bouncePixels: 6,
bounceDelay: 100, bounceDelay: 100,
rerenderTriggers: ["validation.reason"], rerenderTriggers: ["validation.reason"],
closeIcon: `${iconHTML("times-circle")}`.htmlSafe(),
tipReason: null,
click() { click() {
this.set("shownAt", null); this.set("shownAt", null);
@ -33,8 +33,7 @@ export default Component.extend(
if (this.lastShownAt) { if (this.lastShownAt) {
var $elem = $(this.element); var $elem = $(this.element);
if (!this.animateAttribute) { if (!this.animateAttribute) {
this.animateAttribute = this.animateAttribute = $elem.css("left") === "auto" ? "right" : "left";
$elem.css("left") === "auto" ? "right" : "left";
} }
if (this.animateAttribute === "left") { if (this.animateAttribute === "left") {
this.bounceLeft($elem); this.bounceLeft($elem);
@ -44,15 +43,14 @@ export default Component.extend(
} }
}, },
buildBuffer(buffer) { didReceiveAttrs() {
const reason = this.get("validation.reason"); this._super(...arguments);
if (!reason) { let reason = this.get("validation.reason");
return; if (reason) {
this.set("tipReason", `${reason}`.htmlSafe());
} else {
this.set("tipReason", null);
} }
buffer.push(
`<span class='close'>${iconHTML("times-circle")}</span>${reason}`
);
}, },
bounceLeft($elem) { bounceLeft($elem) {
@ -70,5 +68,4 @@ export default Component.extend(
.animate({ right: "+=" + this.bouncePixels }, this.bounceDelay); .animate({ right: "+=" + this.bouncePixels }, this.bounceDelay);
} }
} }
}) });
);

View File

@ -0,0 +1 @@
<span class='close'>{{closeIcon}}</span>{{tipReason}}