Created initial RoomTagContextMenu component

This commit is contained in:
wmwragg 2016-08-05 15:23:07 +01:00
parent a190862ed3
commit 5ce1aba493
4 changed files with 193 additions and 0 deletions

View File

@ -36,6 +36,7 @@ module.exports.components['structures.SearchBox'] = require('./components/struct
module.exports.components['structures.ViewSource'] = require('./components/structures/ViewSource');
module.exports.components['views.context_menus.MessageContextMenu'] = require('./components/views/context_menus/MessageContextMenu');
module.exports.components['views.context_menus.NotificationStateContextMenu'] = require('./components/views/context_menus/NotificationStateContextMenu');
module.exports.components['views.context_menus.RoomTagContextMenu'] = require('./components/views/context_menus/RoomTagContextMenu');
module.exports.components['views.elements.ImageView'] = require('./components/views/elements/ImageView');
module.exports.components['views.elements.Spinner'] = require('./components/views/elements/Spinner');
module.exports.components['views.globals.GuestWarningBar'] = require('./components/views/globals/GuestWarningBar');

View File

@ -0,0 +1,132 @@
/*
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 q = require("q");
var React = require('react');
var classNames = require('classnames');
var MatrixClientPeg = require('matrix-react-sdk/lib/MatrixClientPeg');
var dis = require('matrix-react-sdk/lib/dispatcher');
module.exports = React.createClass({
displayName: 'RoomTagContextMenu',
propTypes: {
room: React.PropTypes.object.isRequired,
/* callback called when the menu is dismissed */
onFinished: React.PropTypes.func,
},
getInitialState: function() {
// var areNotifsMuted = false;
// var cli = MatrixClientPeg.get();
// if (!cli.isGuest()) {
// var roomPushRule = cli.getRoomPushRule("global", this.props.room.roomId);
// if (roomPushRule) {
// if (0 <= roomPushRule.actions.indexOf("dont_notify")) {
// areNotifsMuted = true;
// }
// }
// }
//
// return {
// areNotifsMuted: areNotifsMuted,
// };
},
// _save: function( isMuted ) {
// var self = this;
// const roomId = this.props.room.roomId;
// var cli = MatrixClientPeg.get();
//
// if (!cli.isGuest()) {
// cli.setRoomMutePushRule(
// "global", roomId, isMuted
// ).then(function() {
// self.setState({areNotifsMuted: isMuted});
//
// // delay slightly so that the user can see their state change
// // before closing the menu
// q.delay(500).then(function() {
// // tell everyone that wants to know of the change in
// // notification state
// dis.dispatch({
// action: 'notification_change',
// roomId: self.props.room.roomId,
// isMuted: isMuted,
// });
//
// // Close the context menu
// if (self.props.onFinished) {
// self.props.onFinished();
// };
// });
// }).fail(function(error) {
// // TODO: some form of error notification to the user
// // to inform them that their state change failed.
// });
// }
// },
_onClickFavourite: function() {
// Tag room as 'Favourite'
},
_onClickLowPriority: function() {
// Tag room as 'Low Priority'
},
_onClickLeave: function() {
// Leave room - tag room as 'Archive'?
},
render: function() {
var cli = MatrixClientPeg.get();
var favouriteClasses = classNames({
'mx_RoomTagContextMenu_field': true,
'mx_RoomTagContextMenu_fieldDisabled': true,
});
var lowPriorityClasses = classNames({
'mx_RoomTagContextMenu_field': true,
'mx_RoomTagContextMenu_fieldSet': !this.state.areNotifsMuted,
});
var leaveClasses = classNames({
'mx_RoomTagContextMenu_field': true,
'mx_RoomTagContextMenu_fieldDisabled': true,
});
return (
<div>
<div className={ favouriteClasses } onClick={this._onClickFavourite} >
<img className="mx_RoomTagContextMenu_icon" src="img/icon-context-fave.svg" width="13" height="13" />
Favourite
</div>
<div className={ lowPriorityClasses } onClick={this._onClickLowPriority} >
<img className="mx_RoomTagContextMenu_icon" src="img/icon-context-fave.svg" width="13" height="13" />
Low Priority
</div>
<div className={ leaveClasses } onClick={this._onClickLeave} >
<img className="mx_RoomTagContextMenu_icon" src="img/icon-context-fave.svg" width="13" height="13" />
Leave
</div>
</div>
);
}
});

View File

@ -0,0 +1,44 @@
/*
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.
*/
.mx_RoomTagContextMenu_field {
padding-top: 4px;
padding-right: 6px;
padding-bottom: 10px;
padding-left: 20px;
cursor: pointer;
white-space: nowrap;
display: flex;
align-items: center;
}
.mx_RoomTagContextMenu_field.mx_RoomTagContextMenu_fieldSet {
font-weight: bold;
padding-left: 8px;
}
.mx_RoomTagContextMenu_field.mx_RoomTagContextMenu_fieldDisabled {
color: rgba(0, 0, 0, 0.2);
}
.mx_RoomTagContextMenu_icon {
padding-right: 4px;
padding-left: 4px;
}
.mx_RoomTagContextMenu_fieldSet .mx_RoomTagContextMenu_icon {
}

View File

@ -0,0 +1,16 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="13px" height="13px" viewBox="0 0 13 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 3.8.3 (29802) - http://www.bohemiancoding.com/sketch -->
<title>3658772C-9483-49C3-A6B2-B4E3112661C1</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" opacity="0.2" stroke-linejoin="round">
<g id="02_15-Context-Menus" transform="translate(-64.000000, -304.000000)" stroke="#000000">
<g id="Rectangle-2-Copy-+-General" transform="translate(48.000000, 293.000000)">
<g id="icon_context_fave" transform="translate(16.000000, 11.000000)">
<polygon id="Star-1" points="6.5 9.75 2.67939586 11.7586105 3.40906632 7.50430523 0.318132644 4.49138954 4.58969793 3.87069477 6.5 0 8.41030207 3.87069477 12.6818674 4.49138954 9.59093368 7.50430523 10.3206041 11.7586105"></polygon>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB