Browse Source

Improved message placeholder

master
Igor Zhukov 9 years ago
parent
commit
2a587f5c5f
  1. 6
      app/js/lib/utils.js
  2. 23
      app/js/message_composer.js
  3. 15
      app/less/app.less

6
app/js/lib/utils.js

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

23
app/js/message_composer.js

@ -695,6 +695,10 @@ MessageComposer.prototype.checkAutocomplete = function (forceFull) {
var valueCaret = getRichValueWithCaret(textarea); var valueCaret = getRichValueWithCaret(textarea);
var value = valueCaret[0]; var value = valueCaret[0];
var pos = valueCaret[1] >= 0 ? valueCaret[1] : value.length; var pos = valueCaret[1] >= 0 ? valueCaret[1] : value.length;
if (!pos) {
this.cleanRichTextarea(value, true);
}
} else { } else {
var textarea = this.textareaEl[0]; var textarea = this.textareaEl[0];
var pos = getFieldSelection(textarea); var pos = getFieldSelection(textarea);
@ -799,6 +803,7 @@ MessageComposer.prototype.onFocusBlur = function (e) {
this.isActive = e.type == 'focus'; this.isActive = e.type == 'focus';
if (!this.isActive) { if (!this.isActive) {
this.cleanRichTextarea();
this.hideSuggestions(); this.hideSuggestions();
} else { } else {
setTimeout(this.checkAutocomplete.bind(this), 100); setTimeout(this.checkAutocomplete.bind(this), 100);
@ -832,6 +837,24 @@ MessageComposer.prototype.onRichPaste = function (e) {
return true; 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) { MessageComposer.prototype.onRichPasteNode = function (e) {
var element = (e.originalEvent || e).target, var element = (e.originalEvent || e).target,
src = (element || {}).src || '', src = (element || {}).src || '',

15
app/less/app.less

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

Loading…
Cancel
Save