diff --git a/skins/base/views/atoms/EditableText.js b/skins/base/views/atoms/EditableText.js
index 07bdc911d7..a450874468 100644
--- a/skins/base/views/atoms/EditableText.js
+++ b/skins/base/views/atoms/EditableText.js
@@ -44,7 +44,7 @@ module.exports = React.createClass({
onFinish: function(ev) {
if (ev.target.value) {
- this.setValue(ev.target.value);
+ this.setValue(ev.target.value, ev.key === "Enter");
} else {
this.cancelEdit();
}
diff --git a/skins/base/views/organisms/MemberList.js b/skins/base/views/organisms/MemberList.js
index 590ebb5555..9283a928ea 100644
--- a/skins/base/views/organisms/MemberList.js
+++ b/skins/base/views/organisms/MemberList.js
@@ -23,6 +23,7 @@ var MemberListController = require("../../../../src/controllers/organisms/Member
var ComponentBroker = require('../../../../src/ComponentBroker');
var MemberTile = ComponentBroker.get("molecules/MemberTile");
+var EditableText = ComponentBroker.get("atoms/EditableText");
module.exports = React.createClass({
@@ -39,6 +40,31 @@ module.exports = React.createClass({
});
},
+ onPopulateInvite: function(inputText, shouldSubmit) {
+ // reset back to placeholder
+ this.refs.invite.setValue("Invite", false, true);
+ if (!shouldSubmit) {
+ return; // enter key wasn't pressed
+ }
+ this.onInvite(inputText);
+ },
+
+ inviteTile: function() {
+ if (this.state.inviting) {
+ return (
+
+ );
+ }
+ return (
+
+ );
+ },
+
render: function() {
return (
@@ -49,10 +75,7 @@ module.exports = React.createClass({
Members
{this.makeMemberTiles()}
-
+ {this.inviteTile()}
diff --git a/src/controllers/atoms/EditableText.js b/src/controllers/atoms/EditableText.js
index 4d9eb01016..15ee58a7f3 100644
--- a/src/controllers/atoms/EditableText.js
+++ b/src/controllers/atoms/EditableText.js
@@ -55,11 +55,16 @@ module.exports = {
return this.state.value;
},
- setValue: function(val) {
+ setValue: function(val, shouldSubmit, suppressListener) {
+ var self = this;
this.setState({
value: val,
phase: this.Phases.Display,
- }, this.onValueChanged);
+ }, function() {
+ if (!suppressListener) {
+ self.onValueChanged(shouldSubmit);
+ }
+ });
},
edit: function() {
@@ -74,7 +79,7 @@ module.exports = {
});
},
- onValueChanged: function() {
- this.props.onValueChanged(this.state.value);
+ onValueChanged: function(shouldSubmit) {
+ this.props.onValueChanged(this.state.value, shouldSubmit);
},
};
diff --git a/src/controllers/organisms/MemberList.js b/src/controllers/organisms/MemberList.js
index fb5c002812..6021d0fc9a 100644
--- a/src/controllers/organisms/MemberList.js
+++ b/src/controllers/organisms/MemberList.js
@@ -61,6 +61,32 @@ module.exports = {
});
},
+ onInvite: function(inputText) {
+ var self = this;
+ // sanity check the input
+ inputText = inputText.trim(); // react requires es5-shim so we know trim() exists
+ if (inputText[0] !== '@' || inputText.indexOf(":") === -1) {
+ console.error("Bad user ID to invite: %s", inputText);
+ return;
+ }
+ self.setState({
+ inviting: true
+ });
+ console.log("Invite %s to %s", inputText, this.props.roomId);
+ MatrixClientPeg.get().invite(this.props.roomId, inputText).done(
+ function(res) {
+ console.log("Invited");
+ self.setState({
+ inviting: false
+ });
+ }, function(err) {
+ console.error("Failed to invite: %s", JSON.stringify(err));
+ self.setState({
+ inviting: false
+ });
+ });
+ },
+
roomMembers: function(limit) {
if (!this.props.roomId) return {};
var cli = MatrixClientPeg.get();