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

fix editing visuals on groupview header

Browse source
This commit is contained in:
Matthew Hodgson 2017-10-18 17:32:46 +01:00
parent 9160b70e12
commit 1087b36597
1 changed files with 30 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

45
src/components/structures/GroupView.js
View file

@ -490,15 +490,15 @@ export default React.createClass({
});
},
_onNameChange: function(e) {
const newProfileForm = Object.assign(this.state.profileForm, { name: e.target.value });
_onNameChange: function(value) {
const newProfileForm = Object.assign(this.state.profileForm, { name: value });
this.setState({
profileForm: newProfileForm,
});
},
_onShortDescChange: function(e) {
const newProfileForm = Object.assign(this.state.profileForm, { short_description: e.target.value });
_onShortDescChange: function(value) {
const newProfileForm = Object.assign(this.state.profileForm, { short_description: value });
this.setState({
profileForm: newProfileForm,
});
@ -878,18 +878,29 @@ export default React.createClass({
</div>
</div>
);
nameNode = <input type="text"
value={this.state.profileForm.name}
onChange={this._onNameChange}
placeholder={_t('Group Name')}
const EditableText = sdk.getComponent("elements.EditableText");
nameNode = <EditableText ref="nameEditor"
className="mx_GroupView_editable"
placeholderClassName="mx_GroupView_placeholder"
placeholder={_t("Group Name")}
blurToCancel={false}
initialValue={this.state.profileForm.name}
onValueChanged={this._onNameChange}
tabIndex="1"
/>;
shortDescNode = <input type="text"
value={this.state.profileForm.short_description}
onChange={this._onShortDescChange}
placeholder={_t('Description')}
dir="auto" />;
shortDescNode = <EditableText ref="descriptionEditor"
className="mx_GroupView_editable"
placeholderClassName="mx_GroupView_placeholder"
placeholder={_t("Description")}
blurToCancel={false}
initialValue={this.state.profileForm.short_description}
onValueChanged={this._onShortDescChange}
tabIndex="2"
/>;
dir="auto" />
rightButtons.push(
<AccessibleButton className="mx_GroupView_textButton mx_RoomHeader_textButton"
onClick={this._onSaveClick} key="_saveButton"
@ -911,17 +922,17 @@ export default React.createClass({
width={48} height={48}
/>;
if (summary.profile && summary.profile.name) {
nameNode = <div>
nameNode = <div onClick={this._onEditClick}>
<span>{ summary.profile.name }</span>
<span className="mx_GroupView_header_groupid">
({ this.props.groupId })
</span>
</div>;
} else {
nameNode = <span>{ this.props.groupId }</span>;
nameNode = <span onClick={this._onEditClick}>{ this.props.groupId }</span>;
}
if (summary.profile && summary.profile.short_description) {
shortDescNode = <span>{ summary.profile.short_description }</span>;
shortDescNode = <span onClick={this._onEditClick}>{ summary.profile.short_description }</span>;
}
rightButtons.push(
<AccessibleButton className="mx_GroupHeader_button"