From 48924a61066c26b5f8b1c8455312bbfee8c4d8ec Mon Sep 17 00:00:00 2001 From: David Baker Date: Thu, 15 Oct 2015 14:14:33 +0100 Subject: [PATCH] Change resend buttons to a context menu with working resending and non-working 'view source' --- src/controllers/organisms/RoomView.js | 1 + src/skins/vector/skindex.js | 1 + .../views/molecules/MessageContextMenu.js | 72 +++++++++++++++++++ .../vector/views/molecules/MessageTile.js | 14 +++- 4 files changed, 85 insertions(+), 3 deletions(-) create mode 100644 src/skins/vector/views/molecules/MessageContextMenu.js diff --git a/src/controllers/organisms/RoomView.js b/src/controllers/organisms/RoomView.js index 0166afde..ca62f72a 100644 --- a/src/controllers/organisms/RoomView.js +++ b/src/controllers/organisms/RoomView.js @@ -70,6 +70,7 @@ module.exports = { switch (payload.action) { case 'message_send_failed': case 'message_sent': + case 'message_resend_started': this.setState({ room: MatrixClientPeg.get().getRoom(this.props.roomId) }); diff --git a/src/skins/vector/skindex.js b/src/skins/vector/skindex.js index 51bfb105..c2cd9611 100644 --- a/src/skins/vector/skindex.js +++ b/src/skins/vector/skindex.js @@ -46,6 +46,7 @@ skin['molecules.MemberInfo'] = require('./views/molecules/MemberInfo'); skin['molecules.MemberTile'] = require('./views/molecules/MemberTile'); skin['molecules.MEmoteTile'] = require('./views/molecules/MEmoteTile'); skin['molecules.MessageComposer'] = require('./views/molecules/MessageComposer'); +skin['molecules.MessageContextMenu'] = require('./views/molecules/MessageContextMenu'); skin['molecules.MessageTile'] = require('./views/molecules/MessageTile'); skin['molecules.MFileTile'] = require('./views/molecules/MFileTile'); skin['molecules.MImageTile'] = require('./views/molecules/MImageTile'); diff --git a/src/skins/vector/views/molecules/MessageContextMenu.js b/src/skins/vector/views/molecules/MessageContextMenu.js new file mode 100644 index 00000000..adb8d10f --- /dev/null +++ b/src/skins/vector/views/molecules/MessageContextMenu.js @@ -0,0 +1,72 @@ +/* +Copyright 2015 OpenMarket Ltd + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +'use strict'; + +var React = require('react'); + +var MatrixClientPeg = require('matrix-react-sdk/lib/MatrixClientPeg'); +var dis = require('matrix-react-sdk/lib/dispatcher'); + +module.exports = React.createClass({ + displayName: 'MessageContextMenu', + + onResendClick: function() { + MatrixClientPeg.get().resendEvent( + this.props.mxEvent, MatrixClientPeg.get().getRoom( + this.props.mxEvent.getRoomId() + ) + ).done(function() { + dis.dispatch({ + action: 'message_sent' + }); + }, function() { + dis.dispatch({ + action: 'message_send_failed' + }); + }); + dis.dispatch({action: 'message_resend_started'}); + if (this.props.onFinished) this.props.onFinished(); + }, + + onViewSourceClick: function() { + }, + + render: function() { + var resendButton; + var viewSourceButton; + + if (this.props.mxEvent.status == 'not_sent') { + resendButton = ( +
+ Resend +
+ ); + } + viewSourceButton = ( +
+ View Source +
+ ); + + return ( +
+ {resendButton} + {viewSourceButton} +
+ ); + } +}); diff --git a/src/skins/vector/views/molecules/MessageTile.js b/src/skins/vector/views/molecules/MessageTile.js index 386b19d3..acc74761 100644 --- a/src/skins/vector/views/molecules/MessageTile.js +++ b/src/skins/vector/views/molecules/MessageTile.js @@ -17,17 +17,26 @@ limitations under the License. 'use strict'; var React = require('react'); - var classNames = require("classnames"); var sdk = require('matrix-react-sdk') var MessageTileController = require('matrix-react-sdk/lib/controllers/molecules/MessageTile') +var ContextualMenu = require('../../../../ContextualMenu'); module.exports = React.createClass({ displayName: 'MessageTile', mixins: [MessageTileController], + onClick: function(e) { + var MessageContextMenu = sdk.getComponent('molecules.MessageContextMenu'); + ContextualMenu.createMenu(MessageContextMenu, { + mxEvent: this.props.mxEvent, + right: window.innerWidth - e.pageX, + top: e.pageY + }); + }, + render: function() { var MessageTimestamp = sdk.getComponent('atoms.MessageTimestamp'); var SenderProfile = sdk.getComponent('molecules.SenderProfile'); @@ -83,10 +92,9 @@ module.exports = React.createClass({ ; } return ( -
+
{ avatar } { timestamp } - { resend } { sender }