self-hosted/joplin
1
0
Fork 0
mirror of https://github.com/laurent22/joplin.git synced 2025-10-31 00:07:48 +02:00
Code Issues Releases Activity

Refactored multi-state button

Browse Source
This commit is contained in:
Laurent Cozic
2017-07-15 19:21:39 +01:00
parent 93791f1e46
commit 0100c2fff5
2 changed files with 14 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
ReactNativeClient/lib/components/action-button.js
View File

@@ -19,13 +19,13 @@ class ActionButtonComponent extends React.Component {
constructor() {
super();
this.state = {
toggled: false,
buttonIndex: 0,
};
}
componentWillReceiveProps(newProps) {
if ('toggled' in newProps) {
this.setState({ toggled: newProps.toggled });
if ('buttonIndex' in newProps) {
this.setState({ buttonIndex: newProps.buttonIndex });
}
}
@@ -104,18 +104,16 @@ class ActionButtonComponent extends React.Component {
let mainButton = this.props.mainButton ? this.props.mainButton : {};
let mainIcon = mainButton.icon ? <Icon name={mainButton.icon} style={styles.actionButtonIcon} /> : <Text style={{fontSize: 20, color:"#ffffff"}}>+</Text>;
if (this.props.isToggle) {
if (!this.props.buttons || this.props.buttons.length != 2) throw new Error('Toggle state requires two buttons');
let button = this.props.buttons[this.state.toggled ? 1 : 0];
if (this.props.multiStates) {
if (!this.props.buttons || !this.props.buttons.length) throw new Error('Multi-state button requires at least one state');
if (this.state.buttonIndex < 0 || this.state.buttonIndex >= this.props.buttons.length) throw new Error('Button index out of bounds');
let button = this.props.buttons[this.state.buttonIndex];
let mainIcon = <Icon name={button.icon} style={styles.actionButtonIcon} />
return (
<ReactNativeActionButton
icon={mainIcon}
buttonColor="rgba(231,76,60,1)"
onPress={() => {
let doToggle = button.onPress(this.state.toggled);
if (doToggle !== false) this.setState({ toggled: !this.state.toggled });
}}
onPress={() => { button.onPress() }}
/>
);
} else {

9
ReactNativeClient/lib/components/screens/note.js
View File

@@ -46,7 +46,10 @@ class NoteScreenComponent extends BaseScreenComponent {
}
if (this.state.mode == 'edit') {
this.setState({ mode: 'view' });
this.setState({
note: Object.assign({}, this.state.lastSavedNote),
mode: 'view',
});
return true;
}
@@ -298,9 +301,9 @@ class NoteScreenComponent extends BaseScreenComponent {
if (this.state.mode == 'edit' && !this.isModified()) return <ActionButton style={{display:'none'}}/>;
let toggled = this.state.mode == 'edit';
let buttonIndex = this.state.mode == 'view' ? 0 : 1;
return <ActionButton isToggle={true} buttons={buttons} toggled={toggled} />
return <ActionButton multiStates={true} buttons={buttons} buttonIndex={buttonIndex} />
}
const actionButtonComp = renderActionButton();