From 51d2677525b4743561e9df5faa42c44bb38248be Mon Sep 17 00:00:00 2001 From: Erik Johnston Date: Wed, 22 Jul 2015 17:53:18 +0100 Subject: [PATCH] Prompt if a user really wants to leave the room --- skins/base/views/organisms/QuestionDialog.js | 66 ++++++++++++++++++++ src/ComponentBroker.js | 1 + src/Modal.js | 2 +- src/controllers/molecules/MemberTile.js | 33 ++++++---- src/controllers/organisms/QuestionDialog.js | 39 ++++++++++++ 5 files changed, 129 insertions(+), 12 deletions(-) create mode 100644 skins/base/views/organisms/QuestionDialog.js create mode 100644 src/controllers/organisms/QuestionDialog.js diff --git a/skins/base/views/organisms/QuestionDialog.js b/skins/base/views/organisms/QuestionDialog.js new file mode 100644 index 0000000000..920100f5fd --- /dev/null +++ b/skins/base/views/organisms/QuestionDialog.js @@ -0,0 +1,66 @@ +/* +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'; + +/* + * Usage: + * Modal.createDialog(ErrorDialog, { + * title: "some text", (default: "Error") + * description: "some more text", + * button: "Button Text", + * onClose: someFunction, + * focus: true|false (default: true) + * }); + */ + +var React = require('react'); +var QuestionDialogController = require("../../../../src/controllers/organisms/QuestionDialog"); + +module.exports = React.createClass({ + displayName: 'QuestionDialog', + mixins: [QuestionDialogController], + + onOk: function() { + this.props.onFinished(true); + }, + + onCancel: function() { + this.props.onFinished(false); + }, + + render: function() { + return ( +
+
+ {this.props.title} +
+
+ {this.props.description} +
+
+ + + +
+
+ ); + } +}); diff --git a/src/ComponentBroker.js b/src/ComponentBroker.js index 6e5d1e11eb..e74d8eccb0 100644 --- a/src/ComponentBroker.js +++ b/src/ComponentBroker.js @@ -112,4 +112,5 @@ require('../skins/base/views/molecules/voip/MCallHangupTile'); require('../skins/base/views/molecules/EventAsTextTile'); require('../skins/base/views/molecules/MemberInfo'); require('../skins/base/views/organisms/ErrorDialog'); +require('../skins/base/views/organisms/QuestionDialog'); } diff --git a/src/Modal.js b/src/Modal.js index 1e3ded42be..d18b39e68b 100644 --- a/src/Modal.js +++ b/src/Modal.js @@ -41,7 +41,7 @@ module.exports = { var closeDialog = function() { React.unmountComponentAtNode(self.getOrCreateContainer()); - if (props && props.onFinished) props.onFinished.apply(arguments); + if (props && props.onFinished) props.onFinished.apply(null, arguments); }; // FIXME: If a dialog uses getDefaultProps it clobbers the onFinished diff --git a/src/controllers/molecules/MemberTile.js b/src/controllers/molecules/MemberTile.js index 5d1f99a6f7..ae4682847a 100644 --- a/src/controllers/molecules/MemberTile.js +++ b/src/controllers/molecules/MemberTile.js @@ -18,6 +18,8 @@ limitations under the License. var dis = require("../../dispatcher"); var Modal = require("../../Modal"); +var ComponentBroker = require('../../ComponentBroker'); +var QuestionDialog = ComponentBroker.get("organisms/QuestionDialog"); var Loader = require("react-loader"); var MatrixClientPeg = require("../../MatrixClientPeg"); @@ -31,19 +33,28 @@ module.exports = { }, onLeaveClick: function() { - var d = MatrixClientPeg.get().leave(this.props.member.roomId); + var roomId = this.props.member.roomId; + Modal.createDialog(QuestionDialog, { + title: "Leave room", + description: "Are you sure you want to leave the room?", + onFinished: function(should_leave) { + if (should_leave) { + var d = MatrixClientPeg.get().leave(roomId); - var modal = Modal.createDialog(Loader); + var modal = Modal.createDialog(Loader); - d.then(function() { - modal.close(); - dis.dispatch({action: 'view_next_room'}); - }, function(err) { - modal.close(); - Modal.createDialog(ErrorDialog, { - title: "Failed to leave room", - description: err.toString() - }); + d.then(function() { + modal.close(); + dis.dispatch({action: 'view_next_room'}); + }, function(err) { + modal.close(); + Modal.createDialog(ErrorDialog, { + title: "Failed to leave room", + description: err.toString() + }); + }); + } + } }); } }; diff --git a/src/controllers/organisms/QuestionDialog.js b/src/controllers/organisms/QuestionDialog.js new file mode 100644 index 0000000000..c890d143aa --- /dev/null +++ b/src/controllers/organisms/QuestionDialog.js @@ -0,0 +1,39 @@ +/* +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"); + +module.exports = { + propTypes: { + title: React.PropTypes.string, + description: React.PropTypes.string, + button: React.PropTypes.string, + focus: React.PropTypes.bool, + onFinished: React.PropTypes.func.isRequired, + }, + + getDefaultProps: function() { + var self = this; + return { + title: "", + description: "", + button: "OK", + focus: true, + }; + }, +};