From a9bb99a1a7d1ce616f13b530a268d9d109ca63ca Mon Sep 17 00:00:00 2001
From: JC Brand <jc@opkode.com>
Date: Sun, 8 Jul 2018 13:43:28 +0200
Subject: [PATCH] Show animation when a message has been corrected

updates #421
---
 dist/converse.js             | 11 ++++++++++-
 src/converse-message-view.js | 10 +++++++++-
 2 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/dist/converse.js b/dist/converse.js
index 3d7cac8e9..d3ddc7a92 100644
--- a/dist/converse.js
+++ b/dist/converse.js
@@ -74587,7 +74587,7 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
 
         initialize() {
           this.model.vcard.on('change', this.render, this);
-          this.model.on('change:correcting', this.render, this);
+          this.model.on('change:correcting', this.onMessageCorrection, this);
           this.model.on('change:message', this.render, this);
           this.model.on('change:progress', this.renderFileUploadProgresBar, this);
           this.model.on('change:type', this.render, this);
@@ -74617,6 +74617,15 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
           return this.el;
         },
 
+        onMessageCorrection() {
+          this.render();
+
+          if (!this.model.get('correcting') && this.model.changed.message) {
+            this.el.addEventListener('animationend', () => u.removeClass('onload', this.el));
+            u.addClass('onload', this.el);
+          }
+        },
+
         replaceElement(msg) {
           if (!_.isNil(this.el.parentElement)) {
             this.el.parentElement.replaceChild(msg, this.el);
diff --git a/src/converse-message-view.js b/src/converse-message-view.js
index 293d8be65..98eac7830 100644
--- a/src/converse-message-view.js
+++ b/src/converse-message-view.js
@@ -91,7 +91,7 @@
 
                 initialize () {
                     this.model.vcard.on('change', this.render, this);
-                    this.model.on('change:correcting', this.render, this);
+                    this.model.on('change:correcting', this.onMessageCorrection, this);
                     this.model.on('change:message', this.render, this);
                     this.model.on('change:progress', this.renderFileUploadProgresBar, this);
                     this.model.on('change:type', this.render, this);
@@ -118,6 +118,14 @@
                     return this.el;
                 },
 
+                onMessageCorrection () {
+                    this.render();
+                    if (!this.model.get('correcting') && this.model.changed.message) {
+                        this.el.addEventListener('animationend', () => u.removeClass('onload', this.el));
+                        u.addClass('onload', this.el);
+                    }
+                },
+
                 replaceElement (msg) {
                     if (!_.isNil(this.el.parentElement)) {
                         this.el.parentElement.replaceChild(msg, this.el);