Merge pull request #2111 from vector-im/dbkr/toggle_dm_room
Support toggling DM status of roomspull/2134/head
						commit
						9e771ddd07
					
				|  | @ -21,6 +21,8 @@ var React = require('react'); | |||
| var classNames = require('classnames'); | ||||
| var MatrixClientPeg = require('matrix-react-sdk/lib/MatrixClientPeg'); | ||||
| var dis = require('matrix-react-sdk/lib/dispatcher'); | ||||
| var DMRoomMap = require('matrix-react-sdk/lib/utils/DMRoomMap'); | ||||
| var Rooms = require('matrix-react-sdk/lib/Rooms'); | ||||
| 
 | ||||
| module.exports = React.createClass({ | ||||
|     displayName: 'RoomTagContextMenu', | ||||
|  | @ -32,9 +34,11 @@ module.exports = React.createClass({ | |||
|     }, | ||||
| 
 | ||||
|     getInitialState: function() { | ||||
|         const dmRoomMap = new DMRoomMap(MatrixClientPeg.get()); | ||||
|         return { | ||||
|             isFavourite: this.props.room.tags.hasOwnProperty("m.favourite"), | ||||
|             isLowPriority: this.props.room.tags.hasOwnProperty("m.lowpriority"), | ||||
|             isDirectMessage: Boolean(dmRoomMap.getUserIdForRoomId(this.props.room.roomId)), | ||||
|         }; | ||||
|     }, | ||||
| 
 | ||||
|  | @ -113,6 +117,43 @@ module.exports = React.createClass({ | |||
|         } | ||||
|     }, | ||||
| 
 | ||||
|     _onClickDM: function() { | ||||
|         const newIsDirectMessage = !this.state.isDirectMessage; | ||||
|         this.setState({ | ||||
|             isDirectMessage: newIsDirectMessage, | ||||
|         }); | ||||
| 
 | ||||
|         if (MatrixClientPeg.get().isGuest()) return; | ||||
| 
 | ||||
|         let newTarget; | ||||
|         if (newIsDirectMessage) { | ||||
|             const guessedTarget = Rooms.guessDMRoomTarget( | ||||
|                 this.props.room, | ||||
|                 this.props.room.getMember(MatrixClientPeg.get().credentials.userId), | ||||
|             ); | ||||
|             newTarget = guessedTarget.userId; | ||||
|         } else { | ||||
|             newTarget = null; | ||||
|         } | ||||
| 
 | ||||
|         // give some time for the user to see the icon change first, since
 | ||||
|         // this will hide the context menu once it completes
 | ||||
|         q.delay(500).done(() => { | ||||
|             return Rooms.setDMRoom(this.props.room.roomId, newTarget).finally(() => { | ||||
|                 // Close the context menu
 | ||||
|                 if (this.props.onFinished) { | ||||
|                     this.props.onFinished(); | ||||
|                 }; | ||||
|             }, (err) => { | ||||
|                 var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); | ||||
|                 Modal.createDialog(ErrorDialog, { | ||||
|                     title: "Failed to set Direct Message status of room", | ||||
|                     description: err.toString() | ||||
|                 }); | ||||
|             }); | ||||
|         }); | ||||
|     }, | ||||
| 
 | ||||
|     _onClickLeave: function() { | ||||
|         // Leave room
 | ||||
|         dis.dispatch({ | ||||
|  | @ -146,27 +187,33 @@ module.exports = React.createClass({ | |||
|     }, | ||||
| 
 | ||||
|     render: function() { | ||||
|         var myUserId = MatrixClientPeg.get().credentials.userId; | ||||
|         var myMember = this.props.room.getMember(myUserId); | ||||
|         const myUserId = MatrixClientPeg.get().credentials.userId; | ||||
|         const myMember = this.props.room.getMember(myUserId); | ||||
| 
 | ||||
|         var favouriteClasses = classNames({ | ||||
|         const favouriteClasses = classNames({ | ||||
|             'mx_RoomTagContextMenu_field': true, | ||||
|             'mx_RoomTagContextMenu_fieldSet': this.state.isFavourite, | ||||
|             'mx_RoomTagContextMenu_fieldDisabled': false, | ||||
|         }); | ||||
| 
 | ||||
|         var lowPriorityClasses = classNames({ | ||||
|         const lowPriorityClasses = classNames({ | ||||
|             'mx_RoomTagContextMenu_field': true, | ||||
|             'mx_RoomTagContextMenu_fieldSet': this.state.isLowPriority, | ||||
|             'mx_RoomTagContextMenu_fieldDisabled': false, | ||||
|         }); | ||||
| 
 | ||||
|         var leaveClasses = classNames({ | ||||
|         const leaveClasses = classNames({ | ||||
|             'mx_RoomTagContextMenu_field': true, | ||||
|             'mx_RoomTagContextMenu_fieldSet': false, | ||||
|             'mx_RoomTagContextMenu_fieldDisabled': false, | ||||
|         }); | ||||
| 
 | ||||
|         const dmClasses = classNames({ | ||||
|             'mx_RoomTagContextMenu_field': true, | ||||
|             'mx_RoomTagContextMenu_fieldSet': this.state.isDirectMessage, | ||||
|             'mx_RoomTagContextMenu_fieldDisabled': false, | ||||
|         }); | ||||
| 
 | ||||
|         if (myMember && myMember.membership === "leave") { | ||||
|             return ( | ||||
|                 <div> | ||||
|  | @ -190,6 +237,11 @@ module.exports = React.createClass({ | |||
|                     <img className="mx_RoomTagContextMenu_icon_set" src="img/icon_context_low_on.svg" width="15" height="15" /> | ||||
|                     Low Priority | ||||
|                 </div> | ||||
|                 <div className={ dmClasses } onClick={this._onClickDM} > | ||||
|                     <img className="mx_RoomTagContextMenu_icon" src="img/icon_context_person.svg" width="15" height="15" /> | ||||
|                     <img className="mx_RoomTagContextMenu_icon_set" src="img/icon_context_person_on.svg" width="15" height="15" /> | ||||
|                     Direct Message | ||||
|                 </div> | ||||
|                 <hr className="mx_RoomTagContextMenu_separator" /> | ||||
|                 <div className={ leaveClasses } onClick={(myMember && myMember.membership === "join") ? this._onClickLeave : null} > | ||||
|                     <img className="mx_RoomTagContextMenu_icon" src="img/icon_context_delete.svg" width="15" height="15" /> | ||||
|  |  | |||
|  | @ -0,0 +1,85 @@ | |||
| <?xml version="1.0" encoding="UTF-8" standalone="no"?> | ||||
| <svg | ||||
|    xmlns:dc="http://purl.org/dc/elements/1.1/" | ||||
|    xmlns:cc="http://creativecommons.org/ns#" | ||||
|    xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" | ||||
|    xmlns:svg="http://www.w3.org/2000/svg" | ||||
|    xmlns="http://www.w3.org/2000/svg" | ||||
|    xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" | ||||
|    xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" | ||||
|    width="11.000464" | ||||
|    height="13" | ||||
|    viewBox="0 0 11.000464 13" | ||||
|    version="1.1" | ||||
|    id="svg4500" | ||||
|    inkscape:version="0.91 r13725" | ||||
|    sodipodi:docname="icon_context_person.svg"> | ||||
|   <metadata | ||||
|      id="metadata4520"> | ||||
|     <rdf:RDF> | ||||
|       <cc:Work | ||||
|          rdf:about=""> | ||||
|         <dc:format>image/svg+xml</dc:format> | ||||
|         <dc:type | ||||
|            rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> | ||||
|         <dc:title>81230A28-D944-4572-B5DB-C03CAA2B1FCA</dc:title> | ||||
|       </cc:Work> | ||||
|     </rdf:RDF> | ||||
|   </metadata> | ||||
|   <sodipodi:namedview | ||||
|      pagecolor="#ffffff" | ||||
|      bordercolor="#666666" | ||||
|      borderopacity="1" | ||||
|      objecttolerance="10" | ||||
|      gridtolerance="10" | ||||
|      guidetolerance="10" | ||||
|      inkscape:pageopacity="0" | ||||
|      inkscape:pageshadow="2" | ||||
|      inkscape:window-width="1013" | ||||
|      inkscape:window-height="777" | ||||
|      id="namedview4518" | ||||
|      showgrid="false" | ||||
|      fit-margin-top="0" | ||||
|      fit-margin-left="0" | ||||
|      fit-margin-right="0" | ||||
|      fit-margin-bottom="0" | ||||
|      inkscape:zoom="24.48" | ||||
|      inkscape:cx="4.9078557" | ||||
|      inkscape:cy="9.7756405" | ||||
|      inkscape:window-x="495" | ||||
|      inkscape:window-y="175" | ||||
|      inkscape:window-maximized="0" | ||||
|      inkscape:current-layer="icons_people_svg" /> | ||||
|   <!-- Generator: sketchtool 39.1 (31720) - http://www.bohemiancoding.com/sketch --> | ||||
|   <title | ||||
|      id="title4502">81230A28-D944-4572-B5DB-C03CAA2B1FCA</title> | ||||
|   <desc | ||||
|      id="desc4504">Created with sketchtool.</desc> | ||||
|   <defs | ||||
|      id="defs4506" /> | ||||
|   <g | ||||
|      style="fill:none;fill-rule:evenodd;stroke:none;stroke-width:1" | ||||
|      id="g4511" | ||||
|      transform="translate(-56.999768,-730.5)"> | ||||
|     <g | ||||
|        transform="translate(50,725)" | ||||
|        id="icons_people"> | ||||
|       <g | ||||
|          style="stroke:#00000f;stroke-opacity:0.94117647" | ||||
|          transform="translate(7,6)" | ||||
|          id="icons_people_svg"> | ||||
|         <path | ||||
|            style="stroke:#cecece;stroke-linecap:round;stroke-linejoin:round;stroke-opacity:1" | ||||
|            inkscape:connector-curvature="0" | ||||
|            id="Oval-40" | ||||
|            d="m 10.5,12 c 0,-2.7614237 0,-5 -5,-5 -5.0000002,0 -5,2.2385763 -5,5 3.4756747,0 5.5712891,0 10,0 z" /> | ||||
|         <circle | ||||
|            r="2.75" | ||||
|            cy="2.75" | ||||
|            cx="5.5" | ||||
|            id="Oval" | ||||
|            style="stroke:#cecece;stroke-opacity:1" /> | ||||
|       </g> | ||||
|     </g> | ||||
|   </g> | ||||
| </svg> | ||||
| After Width: | Height: | Size: 2.6 KiB | 
|  | @ -0,0 +1,85 @@ | |||
| <?xml version="1.0" encoding="UTF-8" standalone="no"?> | ||||
| <svg | ||||
|    xmlns:dc="http://purl.org/dc/elements/1.1/" | ||||
|    xmlns:cc="http://creativecommons.org/ns#" | ||||
|    xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" | ||||
|    xmlns:svg="http://www.w3.org/2000/svg" | ||||
|    xmlns="http://www.w3.org/2000/svg" | ||||
|    xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" | ||||
|    xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" | ||||
|    width="11.000464" | ||||
|    height="13" | ||||
|    viewBox="0 0 11.000464 13" | ||||
|    version="1.1" | ||||
|    id="svg4500" | ||||
|    inkscape:version="0.91 r13725" | ||||
|    sodipodi:docname="icon_context_person_on.svg"> | ||||
|   <metadata | ||||
|      id="metadata4520"> | ||||
|     <rdf:RDF> | ||||
|       <cc:Work | ||||
|          rdf:about=""> | ||||
|         <dc:format>image/svg+xml</dc:format> | ||||
|         <dc:type | ||||
|            rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> | ||||
|         <dc:title>81230A28-D944-4572-B5DB-C03CAA2B1FCA</dc:title> | ||||
|       </cc:Work> | ||||
|     </rdf:RDF> | ||||
|   </metadata> | ||||
|   <sodipodi:namedview | ||||
|      pagecolor="#ffffff" | ||||
|      bordercolor="#666666" | ||||
|      borderopacity="1" | ||||
|      objecttolerance="10" | ||||
|      gridtolerance="10" | ||||
|      guidetolerance="10" | ||||
|      inkscape:pageopacity="0" | ||||
|      inkscape:pageshadow="2" | ||||
|      inkscape:window-width="1013" | ||||
|      inkscape:window-height="777" | ||||
|      id="namedview4518" | ||||
|      showgrid="false" | ||||
|      fit-margin-top="0" | ||||
|      fit-margin-left="0" | ||||
|      fit-margin-right="0" | ||||
|      fit-margin-bottom="0" | ||||
|      inkscape:zoom="24.48" | ||||
|      inkscape:cx="4.9078557" | ||||
|      inkscape:cy="9.7756405" | ||||
|      inkscape:window-x="495" | ||||
|      inkscape:window-y="175" | ||||
|      inkscape:window-maximized="0" | ||||
|      inkscape:current-layer="icons_people_svg" /> | ||||
|   <!-- Generator: sketchtool 39.1 (31720) - http://www.bohemiancoding.com/sketch --> | ||||
|   <title | ||||
|      id="title4502">81230A28-D944-4572-B5DB-C03CAA2B1FCA</title> | ||||
|   <desc | ||||
|      id="desc4504">Created with sketchtool.</desc> | ||||
|   <defs | ||||
|      id="defs4506" /> | ||||
|   <g | ||||
|      style="fill:none;fill-rule:evenodd;stroke:none;stroke-width:1" | ||||
|      id="g4511" | ||||
|      transform="translate(-56.999768,-730.5)"> | ||||
|     <g | ||||
|        transform="translate(50,725)" | ||||
|        id="icons_people"> | ||||
|       <g | ||||
|          style="stroke:#00000f;stroke-opacity:0.94117647" | ||||
|          transform="translate(7,6)" | ||||
|          id="icons_people_svg"> | ||||
|         <path | ||||
|            style="stroke:#4a4a4a;stroke-linecap:round;stroke-linejoin:round;stroke-opacity:1;fill:#4a4a4a;fill-opacity:1" | ||||
|            inkscape:connector-curvature="0" | ||||
|            id="Oval-40" | ||||
|            d="m 10.5,12 c 0,-2.7614237 0,-5 -5,-5 -5.0000002,0 -5,2.2385763 -5,5 3.4756747,0 5.5712891,0 10,0 z" /> | ||||
|         <circle | ||||
|            r="2.75" | ||||
|            cy="2.75" | ||||
|            cx="5.5" | ||||
|            id="Oval" | ||||
|            style="stroke:#4a4a4a;stroke-opacity:1;fill:#4a4a4a;fill-opacity:1" /> | ||||
|       </g> | ||||
|     </g> | ||||
|   </g> | ||||
| </svg> | ||||
| After Width: | Height: | Size: 2.7 KiB | 
|  | @ -1,9 +0,0 @@ | |||
| <?xml version="1.0" encoding="UTF-8"?> | ||||
| <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> | ||||
| <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="25" height="25" viewBox="0, 0, 25, 25"> | ||||
|   <g id="Symbols"> | ||||
|     <path d="M12.5,25 C19.404,25 25,19.404 25,12.5 C25,5.596 19.404,0 12.5,0 C5.596,0 0,5.596 0,12.5 C0,19.404 5.596,25 12.5,25 z" fill="#76CFA6" id="Oval-1-Copy-7"/> | ||||
|     <path d="M12.5,11.439 C13.881,11.439 15,10.32 15,8.939 C15,7.558 13.881,6.439 12.5,6.439 C11.119,6.439 10,7.558 10,8.939 C10,10.32 11.119,11.439 12.5,11.439 z" fill-opacity="0" stroke="#FFFFFF" stroke-width="1" id="path-1" opacity="0.8"/> | ||||
|     <path d="M17.89,19 C17.89,15.134 17.89,12 12.445,12 C6.999,12 6.999,15.134 6.999,19 C10.785,19 13.067,19 17.89,19 z" fill-opacity="0" stroke="#FFFFFF" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" id="path-3" opacity="0.8"/> | ||||
|   </g> | ||||
| </svg> | ||||
| Before Width: | Height: | Size: 984 B | 
		Loading…
	
		Reference in New Issue
	
	 David Baker
						David Baker