Improved message placeholder

app/js/lib/utils.js

@@ -189,6 +189,7 @@ function getRichElementValue(node, lines, line, selNode, selOffset) {
   if (node.nodeType != 1) { // NON-ELEMENT
     return;
   }
+  var isSelected = (selNode === node);
   var isBlock = node.tagName == 'DIV' || node.tagName == 'P';
   var curChild;
   if (isBlock && line.length || node.tagName == 'BR') {
@@ -200,12 +201,15 @@ function getRichElementValue(node, lines, line, selNode, selOffset) {
       line.push(node.alt);
     }
   }
+  if (isSelected && !selOffset) {
+    line.push('\001');
+  }
   var curChild = node.firstChild;
   while (curChild) {
     getRichElementValue(curChild, lines, line, selNode, selOffset);
     curChild = curChild.nextSibling;
   }
-  if (selNode === node) {
+  if (isSelected && selOffset) {
     line.push('\001');
   }
   if (isBlock && line.length) {

app/js/message_composer.js

@@ -695,6 +695,10 @@ MessageComposer.prototype.checkAutocomplete = function (forceFull) {
     var valueCaret = getRichValueWithCaret(textarea);
     var value = valueCaret[0];
     var pos = valueCaret[1] >= 0 ? valueCaret[1] : value.length;
+
+    if (!pos) {
+      this.cleanRichTextarea(value, true);
+    }
   } else {
     var textarea = this.textareaEl[0];
     var pos = getFieldSelection(textarea);
@@ -799,6 +803,7 @@ MessageComposer.prototype.onFocusBlur = function (e) {
   this.isActive = e.type == 'focus';
 
   if (!this.isActive) {
+    this.cleanRichTextarea();
     this.hideSuggestions();
   } else {
     setTimeout(this.checkAutocomplete.bind(this), 100);
@@ -832,6 +837,24 @@ MessageComposer.prototype.onRichPaste = function (e) {
   return true;
 }
 
+MessageComposer.prototype.cleanRichTextarea = function (value, focused) {
+  if (value === undefined) {
+    value = getRichValue(this.richTextareaEl[0]);
+  }
+  if (value.match(/^\s*$/) && this.richTextareaEl.html().length > 0) {
+    this.richTextareaEl.html('');
+    this.lastLength = 0;
+    this.wasEmpty = true;
+
+    if (focused) {
+      var self = this;
+      setZeroTimeout(function () {
+        self.focus();
+      });
+    }
+  }
+}
+
 MessageComposer.prototype.onRichPasteNode = function (e) {
   var element = (e.originalEvent || e).target,
       src = (element || {}).src || '',

app/less/app.less

@@ -2723,20 +2723,15 @@ a.composer_command_option.composer_autocomplete_option_active .composer_command_
   &:empty:before {
     content: attr(placeholder);
     color: #9aa2ab;
+    display: block;
+    margin-top: -1px;
+    margin-left: 1px;
   }
-
-  &:active:before,
-  &:focus:before {
-    content: none;
-  }
-
-  /*
   &:empty:active:before,
   &:empty:focus:before {
-    content: attr(placeholder);
+    opacity: 0.75;
-    color: #9aa2ab;
   }
-  */
+
 
   img {
     width: 20px;