OpenCloud
/
element-web
mirror of https://github.com/vector-im/element-web
1
0
Fork 0
Code Issues Releases Wiki Activity

Merge pull request #2978 from matrix-org/bwindels/message-edit-editor3 

Message editing: smaller fixes
pull/21833/head
Bruno Windels 2019-05-15 17:20:40 +00:00 committed by GitHub
parent 76570beb3c 085f2d199d
commit 897e1735b5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 36 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
res/img/edit.svg
View File

@ -1 +1 @@
<svg height="14.865319" viewBox="0 0 15.093 14.865319" width="15.093" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><filter id="a" height="1.158" width="1.118" x="-.059" y="-.079"><feOffset dy="2" in="SourceAlpha" result="shadowOffsetOuter1"/><feGaussianBlur in="shadowOffsetOuter1" result="shadowBlurOuter1" stdDeviation="16"/><feColorMatrix in="shadowBlurOuter1" result="shadowMatrixOuter1" values="0 0 0 0 0 0 0 0 0 0.473684211 0 0 0 0 1 0 0 0 0.241258741 0"/><feMerge><feMergeNode in="shadowMatrixOuter1"/><feMergeNode in="SourceGraphic"/></feMerge></filter><g style="fill:none;fill-rule:evenodd;stroke:#2e2f32;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;filter:url(#a)" transform="translate(-1048.2035 -582.14881)"><path d="m1055.75 596h6.75m-3.375-12.375a1.591 1.591 0 0 1 2.25 2.25l-9.375 9.375-3 .75.75-3z"/></g></svg>
<svg height="14.865319" viewBox="0 0 15.093 14.865319" width="15.093" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g style="fill:none;fill-rule:evenodd;stroke:#2e2f32;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;" transform="translate(-1048.2035 -582.14881)"><path d="m1055.75 596h6.75m-3.375-12.375a1.591 1.591 0 0 1 2.25 2.25l-9.375 9.375-3 .75.75-3z"/></g></svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 874 B

After

Width:  |  Height:  |  Size: 415 B

15
src/components/views/elements/MessageEditor.js
View File

@ -110,9 +110,15 @@ export default class MessageEditor extends React.Component {
"msgtype": "m.text",
"body": textSerialize(this.model),
};
const contentBody = {
msgtype: newContent.msgtype,
body: ` * ${newContent.body}`,
};
if (requiresHtml(this.model)) {
newContent.format = "org.matrix.custom.html";
newContent.formatted_body = htmlSerialize(this.model);
contentBody.format = newContent.format;
contentBody.formatted_body = ` * ${newContent.formatted_body}`;
}
const content = Object.assign({
"m.new_content": newContent,
@ -120,7 +126,7 @@ export default class MessageEditor extends React.Component {
"rel_type": "m.replace",
"event_id": this.props.event.getId(),
},
}, newContent);
}, contentBody);
const roomId = this.props.event.getRoomId();
this.context.matrixClient.sendMessage(roomId, content);
@ -138,6 +144,13 @@ export default class MessageEditor extends React.Component {
componentDidMount() {
this._updateEditorState();
const sel = document.getSelection();
const range = document.createRange();
range.selectNodeContents(this._editorRef);
range.collapse(false);
sel.removeAllRanges();
sel.addRange(range);
this._editorRef.focus();
}
render() {

14
src/components/views/messages/MessageActionBar.js
View File

@ -23,7 +23,7 @@ import dis from '../../../dispatcher';
import Modal from '../../../Modal';
import { createMenu } from '../../structures/ContextualMenu';
import SettingsStore from '../../../settings/SettingsStore';
import { isContentActionable } from '../../../utils/EventUtils';
import { isContentActionable, canEditContent } from '../../../utils/EventUtils';
export default class MessageActionBar extends React.PureComponent {
static propTypes = {
@ -148,12 +148,12 @@ export default class MessageActionBar extends React.PureComponent {
title={_t("Reply")}
onClick={this.onReplyClick}
/>;
if (this.isEditingEnabled()) {
editButton = <span className="mx_MessageActionBar_maskButton mx_MessageActionBar_editButton"
title={_t("Edit")}
onClick={this.onEditClick}
/>;
}
}
if (this.isEditingEnabled() && canEditContent(this.props.mxEvent)) {
editButton = <span className="mx_MessageActionBar_maskButton mx_MessageActionBar_editButton"
title={_t("Edit")}
onClick={this.onEditClick}
/>;
}
return <div className="mx_MessageActionBar">

9
src/components/views/messages/TextualBody.js
View File

@ -88,7 +88,10 @@ module.exports = React.createClass({
componentDidMount: function() {
this._unmounted = false;
this._applyFormatting();
},
_applyFormatting() {
// pillifyLinks BEFORE linkifyElement because plain room/user URLs in the composer
// are still sent as plaintext URLs. If these are ever pillified in the composer,
// we should be pillify them here by doing the linkifying BEFORE the pillifying.
@ -123,7 +126,11 @@ module.exports = React.createClass({
}
},
componentDidUpdate: function() {
componentDidUpdate: function(prevProps) {
const messageWasEdited = prevProps.replacingEventId !== this.props.replacingEventId;
if (messageWasEdited) {
this._applyFormatting();
}
this.calculateUrlPreview();
},

6
src/utils/EventUtils.js
View File

@ -15,6 +15,7 @@ limitations under the License.
*/
import { EventStatus } from 'matrix-js-sdk';
import MatrixClientPeg from '../MatrixClientPeg';
/**
* Returns whether an event should allow actions like reply, reactions, edit, etc.
@ -43,3 +44,8 @@ export function isContentActionable(mxEvent) {
return false;
}
export function canEditContent(mxEvent) {
return isContentActionable(mxEvent) &&
mxEvent.getSender() === MatrixClientPeg.get().getUserId();
}