mad-star-studio/element-web
2
0
Fork 0
Code Pull requests Activity

Use directory search box component

Browse source
This commit is contained in:
David Baker 2016-09-23 13:48:44 +01:00
parent 16c22e07b8
commit 2e77b0a3c7
4 changed files with 67 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

29
src/components/structures/RoomDirectory.js
View file

@ -68,6 +68,7 @@ module.exports = React.createClass({
this.filterString = null;
this.filterTimeout = null;
this.scrollPanel = null;
this.searchBox = null;
// dis.dispatch({
// action: 'ui_opacity',
@ -212,9 +213,7 @@ module.exports = React.createClass({
return this.getMoreRooms();
},
onFilterChange: function(ev) {
const alias = ev.target.value;
onFilterChange: function(alias) {
this.filterString = alias || null;
// don't send the request for a little bit,
@ -230,10 +229,22 @@ module.exports = React.createClass({
}, 300);
},
onFilterKeyUp: function(ev) {
if (ev.key == "Enter") {
this.showRoomAlias(ev.target.value);
onFilterChange: function() {
this.filterString = null;
if (this.filterTimeout) {
clearTimeout(this.filterTimeout);
}
// update immediately
this.refreshRoomList();
},
onJoinClick: function(alias) {
this.showRoomAlias(alias);
},
collectSearchBox: function(e) {
this.searchBox = e;
},
showRoomAlias: function(alias) {
@ -393,13 +404,15 @@ module.exports = React.createClass({
const SimpleRoomHeader = sdk.getComponent('rooms.SimpleRoomHeader');
const NetworkDropdown = sdk.getComponent('directory.NetworkDropdown');
const DirectorySearchBox = sdk.getComponent('elements.DirectorySearchBox');
return (
<div className="mx_RoomDirectory">
<SimpleRoomHeader title="Directory" />
<div className="mx_RoomDirectory_list">
<div className="mx_RoomDirectory_listheader">
<input type="text" placeholder="Find a room by keyword or room ID (#foo:matrix.org)"
className="mx_RoomDirectory_input" size="64" onChange={this.onFilterChange} onKeyUp={this.onFilterKeyUp}
<DirectorySearchBox
className="mx_RoomDirectory_searchbox" ref={this.collectSearchBox}
onChange={this.onFilterChange} onClear={this.onFilterClear} onJoinClick={this.onJoinClick}
/>
<NetworkDropdown config={this.props.config} onNetworkChange={this.onNetworkChange} />
</div>