PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Buttonified almost everything. Stylesheet is broken.

Browse source
This commit is contained in:
Jani Mustonen 2017-01-06 22:01:37 +02:00
parent 8d79716421
commit d2ff2715ce
3 changed files with 33 additions and 21 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
src/components/views/avatars/BaseAvatar.js
View file

@ -138,7 +138,7 @@ module.exports = React.createClass({
const {
name, idName, title, url, urls, width, height, resizeMethod,
defaultToInitialLetter,
defaultToInitialLetter, onClick,
...otherProps
} = this.props;
@ -156,12 +156,24 @@ module.exports = React.createClass({
</span>
);
}
return (
<img className="mx_BaseAvatar mx_BaseAvatar_image" src={imageUrl}
onError={this.onError}
width={width} height={height}
title={title} alt=""
{...otherProps} />
);
if (onClick != null) {
return (
<button className="mx_BaseAvatar" onClick={onClick}>
<img className="mx_BaseAvatar_image" src={imageUrl}
onError={this.onError}
width={width} height={height}
title={title} alt=""
{...otherProps} />
</button>
);
} else {
return (
<img className="mx_BaseAvatar mx_BaseAvatar_image" src={imageUrl}
onError={this.onError}
width={width} height={height}
title={title} alt=""
{...otherProps} />
);
}
}
});

4
src/components/views/rooms/EntityTile.js
View file

@ -152,7 +152,7 @@ module.exports = React.createClass({
var av = this.props.avatarJsx || <BaseAvatar name={this.props.name} width={36} height={36} />;
return (
<div className={mainClassName} title={ this.props.title }
<button className={mainClassName} title={ this.props.title }
onClick={ this.props.onClick } onMouseEnter={ this.mouseEnter }
onMouseLeave={ this.mouseLeave }>
<div className="mx_EntityTile_avatar">
@ -161,7 +161,7 @@ module.exports = React.createClass({
</div>
{ nameEl }
{ inviteButton }
</div>
</button>
);
}
});

22
src/components/views/rooms/MemberInfo.js
View file

@ -612,7 +612,7 @@ module.exports = WithMatrixClient(React.createClass({
mx_MemberInfo_createRoom_label: true,
mx_RoomTile_name: true,
});
const startNewChat = <div
const startNewChat = <button
className="mx_MemberInfo_createRoom"
onClick={this.onNewDMClick}
>
@ -620,7 +620,7 @@ module.exports = WithMatrixClient(React.createClass({
<img src="img/create-big.svg" width="26" height="26" />
</div>
<div className={labelClasses}><i>Start new chat</i></div>
</div>
</button>
startChat = <div>
<h3>Direct chats</h3>
@ -635,26 +635,26 @@ module.exports = WithMatrixClient(React.createClass({
}
if (this.state.can.kick) {
kickButton = <div className="mx_MemberInfo_field" onClick={this.onKick}>
kickButton = <button className="mx_MemberInfo_field" onClick={this.onKick}>
{ this.props.member.membership === "invite" ? "Disinvite" : "Kick" }
</div>;
</button>;
}
if (this.state.can.ban) {
banButton = <div className="mx_MemberInfo_field" onClick={this.onBan}>
banButton = <button className="mx_MemberInfo_field" onClick={this.onBan}>
Ban
</div>;
</button>;
}
if (this.state.can.mute) {
var muteLabel = this.state.muted ? "Unmute" : "Mute";
muteButton = <div className="mx_MemberInfo_field" onClick={this.onMuteToggle}>
muteButton = <button className="mx_MemberInfo_field" onClick={this.onMuteToggle}>
{muteLabel}
</div>;
</button>;
}
if (this.state.can.toggleMod) {
var giveOpLabel = this.state.isTargetMod ? "Revoke Moderator" : "Make Moderator";
giveModButton = <div className="mx_MemberInfo_field" onClick={this.onModToggle}>
giveModButton = <button className="mx_MemberInfo_field" onClick={this.onModToggle}>
{giveOpLabel}
</div>
</button>
}
// TODO: we should have an invite button if this MemberInfo is showing a user who isn't actually in the current room yet
@ -682,7 +682,7 @@ module.exports = WithMatrixClient(React.createClass({
const EmojiText = sdk.getComponent('elements.EmojiText');
return (
<div className="mx_MemberInfo">
<img className="mx_MemberInfo_cancel" src="img/cancel.svg" width="18" height="18" onClick={this.onCancel}/>
<button className="mx_MemberInfo_cancel" onClick={this.onCancel}> <img src="img/cancel.svg" width="18" height="18"/></button>
<div className="mx_MemberInfo_avatar">
<MemberAvatar onClick={this.onMemberAvatarClick} member={this.props.member} width={48} height={48} />
</div>