diff --git a/css/base.css b/css/base.css index 22c0b714..a3239c4e 100644 --- a/css/base.css +++ b/css/base.css @@ -821,6 +821,15 @@ i.search { height: 7rem; } +.avatar-upload .avatar-box > .material-icons { + position: relative; + width: 7rem; + height: 7rem; + font-size: 4rem; + line-height: 7rem; + vertical-align: middle; +} + /* Clearfix */ .avatar-upload:after { content: "."; @@ -1588,6 +1597,9 @@ ul.tabbar li.active > a:after { #self-avatar.material-icons, .avatar-box .material-icons { font-size: 2.4rem; + width: 3rem; + height: 3rem; + line-height: 3rem; } .avatar-box .material-icons { color: rgba(250, 250, 250, 0.8); /* #fafafa, gray 50 */ diff --git a/src/webapp.jsx b/src/webapp.jsx index be0ca933..211085d6 100644 --- a/src/webapp.jsx +++ b/src/webapp.jsx @@ -1849,7 +1849,7 @@ class SidepanelView extends React.Component { messageSounds={this.props.messageSounds} desktopAlerts={this.props.desktopAlerts} desktopAlertsEnabled={this.props.desktopAlertsEnabled} - onSubmit={this.props.onUpdateAccount} + onUpdateAccount={this.props.onUpdateAccount} onUpdateTags={this.props.onUpdateAccountTags} onTogglePushNotifications={this.props.onTogglePushNotifications} onToggleMessageSounds={this.props.onToggleMessageSounds} @@ -1947,6 +1947,7 @@ class EditAccountView extends React.Component { auth: defacs ? defacs.auth : null, anon: defacs ? defacs.anon : null, tags: fnd.tags(), + showPermissionEditorFor: undefined, previousOnTags: fnd.onTagsUpdated }; @@ -1955,6 +1956,9 @@ class EditAccountView extends React.Component { this.handlePasswordUpdate = this.handlePasswordUpdate.bind(this); this.handleImageChanged = this.handleImageChanged.bind(this); this.handleCheckboxClick = this.handleCheckboxClick.bind(this); + this.handleLaunchPermissionsEditor = this.handleLaunchPermissionsEditor.bind(this); + this.handleHidePermissionsEditor = this.handleHidePermissionsEditor.bind(this); + this.handlePermissionsChanged = this.handlePermissionsChanged.bind(this); this.handleTagsUpdated = this.handleTagsUpdated.bind(this); } @@ -1979,17 +1983,17 @@ class EditAccountView extends React.Component { handleFullNameUpdate(fn) { this.setState({fullName: fn}); - this.props.onSubmit(null, vcard(fn, this.state.avatar)); + this.props.onUpdateAccount(undefined, vcard(fn, this.state.avatar)); } handlePasswordUpdate(pwd) { this.setState({password: pwd}); - this.props.onSubmit(pwd, null); + this.props.onUpdateAccount(pwd); } handleImageChanged(img) { this.setState({avatar: img}); - this.props.onSubmit(null, vcard(this.state.fullName, img)); + this.props.onUpdateAccount(undefined, vcard(this.state.fullName, img)); } handleCheckboxClick(what, checked) { @@ -2000,6 +2004,27 @@ class EditAccountView extends React.Component { } } + handleLaunchPermissionsEditor(which) { + this.setState({ + showPermissionEditorFor: which, + editedPermissions: this.state[which] + }); + } + + handleHidePermissionsEditor() { + this.setState({showPermissionEditorFor: undefined}); + } + + handlePermissionsChanged(perm) { + let defacs = {}; + defacs[this.state.showPermissionEditorFor] = perm; + this.props.onUpdateAccount(undefined, undefined, defacs); + + let newState = {showPermissionEditorFor: undefined}; + newState[this.state.showPermissionEditorFor] = perm; + this.setState(newState); + } + handleTagsUpdated(tags) { // Check if tags have actually changed. if (arrayEqual(this.state.tags.slice(0), tags.slice(0))) { @@ -2017,68 +2042,78 @@ class EditAccountView extends React.Component { tags = No tags defined. Add some.; } return ( -