From eb955eb371275e10dfc5534806d248bfb9ea5444 Mon Sep 17 00:00:00 2001 From: Kegan Dougal Date: Tue, 12 Jan 2016 14:11:15 +0000 Subject: [PATCH] Add a RoomPreviewBar which asks if you'd like to join a peeked room --- src/component-index.js | 9 ++-- src/components/structures/RoomView.js | 28 ++++++++-- src/components/views/rooms/RoomPreviewBar.js | 56 ++++++++++++++++++++ 3 files changed, 85 insertions(+), 8 deletions(-) create mode 100644 src/components/views/rooms/RoomPreviewBar.js diff --git a/src/component-index.js b/src/component-index.js index 0c08d70b73..cef1b093a4 100644 --- a/src/component-index.js +++ b/src/component-index.js @@ -23,14 +23,14 @@ limitations under the License. module.exports.components = {}; module.exports.components['structures.CreateRoom'] = require('./components/structures/CreateRoom'); +module.exports.components['structures.login.Login'] = require('./components/structures/login/Login'); +module.exports.components['structures.login.PostRegistration'] = require('./components/structures/login/PostRegistration'); +module.exports.components['structures.login.Registration'] = require('./components/structures/login/Registration'); module.exports.components['structures.MatrixChat'] = require('./components/structures/MatrixChat'); module.exports.components['structures.RoomView'] = require('./components/structures/RoomView'); module.exports.components['structures.ScrollPanel'] = require('./components/structures/ScrollPanel'); module.exports.components['structures.UploadBar'] = require('./components/structures/UploadBar'); module.exports.components['structures.UserSettings'] = require('./components/structures/UserSettings'); -module.exports.components['structures.login.Login'] = require('./components/structures/login/Login'); -module.exports.components['structures.login.PostRegistration'] = require('./components/structures/login/PostRegistration'); -module.exports.components['structures.login.Registration'] = require('./components/structures/login/Registration'); module.exports.components['views.avatars.MemberAvatar'] = require('./components/views/avatars/MemberAvatar'); module.exports.components['views.avatars.RoomAvatar'] = require('./components/views/avatars/RoomAvatar'); module.exports.components['views.create_room.CreateRoomButton'] = require('./components/views/create_room/CreateRoomButton'); @@ -51,10 +51,10 @@ module.exports.components['views.login.LoginHeader'] = require('./components/vie module.exports.components['views.login.PasswordLogin'] = require('./components/views/login/PasswordLogin'); module.exports.components['views.login.RegistrationForm'] = require('./components/views/login/RegistrationForm'); module.exports.components['views.login.ServerConfig'] = require('./components/views/login/ServerConfig'); +module.exports.components['views.messages.MessageEvent'] = require('./components/views/messages/MessageEvent'); module.exports.components['views.messages.MFileBody'] = require('./components/views/messages/MFileBody'); module.exports.components['views.messages.MImageBody'] = require('./components/views/messages/MImageBody'); module.exports.components['views.messages.MVideoBody'] = require('./components/views/messages/MVideoBody'); -module.exports.components['views.messages.MessageEvent'] = require('./components/views/messages/MessageEvent'); module.exports.components['views.messages.TextualBody'] = require('./components/views/messages/TextualBody'); module.exports.components['views.messages.TextualEvent'] = require('./components/views/messages/TextualEvent'); module.exports.components['views.messages.UnknownBody'] = require('./components/views/messages/UnknownBody'); @@ -65,6 +65,7 @@ module.exports.components['views.rooms.MemberTile'] = require('./components/view module.exports.components['views.rooms.MessageComposer'] = require('./components/views/rooms/MessageComposer'); module.exports.components['views.rooms.RoomHeader'] = require('./components/views/rooms/RoomHeader'); module.exports.components['views.rooms.RoomList'] = require('./components/views/rooms/RoomList'); +module.exports.components['views.rooms.RoomPreviewBar'] = require('./components/views/rooms/RoomPreviewBar'); module.exports.components['views.rooms.RoomSettings'] = require('./components/views/rooms/RoomSettings'); module.exports.components['views.rooms.RoomTile'] = require('./components/views/rooms/RoomTile'); module.exports.components['views.rooms.SearchResultTile'] = require('./components/views/rooms/SearchResultTile'); diff --git a/src/components/structures/RoomView.js b/src/components/structures/RoomView.js index c622a7d769..7a729a4436 100644 --- a/src/components/structures/RoomView.js +++ b/src/components/structures/RoomView.js @@ -74,6 +74,7 @@ module.exports = React.createClass({ syncState: MatrixClientPeg.get().getSyncState(), hasUnsentMessages: this._hasUnsentMessages(room), callState: null, + guestsCanJoin: false } }, @@ -106,15 +107,27 @@ module.exports = React.createClass({ // succeeds then great, show the preview (but we still may be able to /join!). if (!this.state.room) { console.log("Attempting to peek into room %s", this.props.roomId); - MatrixClientPeg.get().peekInRoom(this.props.roomId).done(function() { + MatrixClientPeg.get().peekInRoom(this.props.roomId).done(() => { // we don't need to do anything - JS SDK will emit Room events - // which will update the UI. + // which will update the UI. We *do* however need to know if we + // can join the room so we can fiddle with the UI appropriately. + var peekedRoom = MatrixClientPeg.get().getRoom(this.props.roomId); + if (!peekedRoom) { + return; + } + var guestAccessEvent = peekedRoom.currentState.getStateEvents("m.room.guest_access", ""); + if (!guestAccessEvent) { + return; + } + if (guestAccessEvent.getContent().guest_access === "can_join") { + this.setState({ + guestsCanJoin: true + }); + } }, function(err) { console.error("Failed to peek into room: %s", err); }); } - - }, componentWillUnmount: function() { @@ -1132,6 +1145,7 @@ module.exports = React.createClass({ var SearchBar = sdk.getComponent("rooms.SearchBar"); var ScrollPanel = sdk.getComponent("structures.ScrollPanel"); var TintableSvg = sdk.getComponent("elements.TintableSvg"); + var RoomPreviewBar = sdk.getComponent("rooms.RoomPreviewBar"); if (!this.state.room) { if (this.props.roomId) { @@ -1282,6 +1296,12 @@ module.exports = React.createClass({ else if (this.state.searching) { aux = ; } + else if (this.state.guestsCanJoin && MatrixClientPeg.get().isGuest() && + (!myMember || myMember.membership !== "join")) { + aux = ( + + ); + } var conferenceCallNotification = null; if (this.state.displayConfCallNotification) { diff --git a/src/components/views/rooms/RoomPreviewBar.js b/src/components/views/rooms/RoomPreviewBar.js new file mode 100644 index 0000000000..2f12c4c8e2 --- /dev/null +++ b/src/components/views/rooms/RoomPreviewBar.js @@ -0,0 +1,56 @@ +/* +Copyright 2015, 2016 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 = React.createClass({ + displayName: 'RoomPreviewBar', + + propTypes: { + onJoinClick: React.PropTypes.func, + canJoin: React.PropTypes.bool + }, + + getDefaultProps: function() { + return { + onJoinClick: function() {}, + canJoin: false + }; + }, + + render: function() { + var joinBlock; + + if (this.props.canJoin) { + joinBlock = ( +
+ Would you like to join this room? +
+ ); + } + + return ( +
+
+ This is a preview of this room. Room interactions have been disabled. +
+ {joinBlock} +
+ ); + } +});