[DE PE SSE mobile] Corrected display collaboration

This commit is contained in:
SergeyEzhin 2021-04-28 01:15:16 +03:00
parent 1d51be59a6
commit 072f84a27c
13 changed files with 59 additions and 26 deletions

View file

@ -336,7 +336,8 @@
"textHighlightResults": "Highlight Results",
"textSearch": "Search",
"textMarginsW": "Left and right margins are too high for a given page width",
"textMarginsH": "Top and bottom margins are too high for a given page height"
"textMarginsH": "Top and bottom margins are too high for a given page height",
"textCollaboration": "Collaboration"
},
"Edit": {
"textClose": "Close",

View file

@ -71,7 +71,7 @@ const Settings = props => {
window.open(url, "_blank");
};
return <SettingsView usePopover={!Device.phone} onclosed={onviewclosed} onReaderMode={onReaderMode} onPrint={onPrint} showHelp={showHelp}/>
return <SettingsView usePopover={!Device.phone} openOptions={props.openOptions} onclosed={onviewclosed} onReaderMode={onReaderMode} onPrint={onPrint} showHelp={showHelp}/>
};
export default inject("storeAppOptions")(observer(Settings));

View file

@ -93,7 +93,7 @@ class MainPage extends Component {
}
{
!this.state.settingsVisible ? null :
<Settings onclosed={this.handleOptionsViewClosed.bind(this, 'settings')} />
<Settings openOptions={this.handleClickToOpenOptions} onclosed={this.handleOptionsViewClosed.bind(this, 'settings')} />
}
{
!this.state.collaborationVisible ? null :

View file

@ -24,7 +24,7 @@ const ToolbarView = props => {
onAddClick: e => props.openOptions('add')
})}
{ Device.phone ? null : <Link className={(props.disabledControls || props.readerMode) && 'disabled'} icon='icon-search' searchbarEnable='.searchbar' href={false}></Link> }
{props.displayCollaboration && <Link className={props.disabledControls && 'disabled'} id='btn-coauth' href={false} icon='icon-collaboration' onClick={e => props.openOptions('coauth')}></Link>}
{props.displayCollaboration && window.matchMedia("(min-width: 390px)").matches ? <Link className={props.disabledControls && 'disabled'} id='btn-coauth' href={false} icon='icon-collaboration' onClick={e => props.openOptions('coauth')}></Link> : null}
<Link className={(props.disabledSettings || props.disabledControls) && 'disabled'} id='btn-settings' icon='icon-settings' href={false} onClick={e => props.openOptions('settings')}></Link>
</NavRight>
</Fragment>

View file

@ -71,12 +71,17 @@ const SettingsList = inject("storeAppOptions")(observer(props => {
const closeModal = () => {
if (Device.phone) {
f7.sheet.close('.settings-popup', true);
f7.sheet.close('.settings-popup', false);
} else {
f7.popover.close('#settings-popover');
f7.popover.close('#settings-popover', false);
}
};
const onOpenCollaboration = async () => {
await closeModal();
await props.openOptions('coauth');
}
useEffect(() => {
});
@ -117,6 +122,11 @@ const SettingsList = inject("storeAppOptions")(observer(props => {
<Icon slot="media" icon="icon-search"></Icon>
</ListItem>
}
{window.matchMedia("(max-width: 389px)").matches ?
<ListItem title={_t.textCollaboration} link="#" onClick={onOpenCollaboration}>
<Icon slot="media" icon="icon-collaboration"></Icon>
</ListItem>
: null}
{_canReader &&
<ListItem title={_t.textReaderMode}> {/*ToDo*/}
<Icon slot="media" icon="icon-reader"></Icon>
@ -182,10 +192,10 @@ class SettingsView extends Component {
return (
show_popover ?
<Popover id="settings-popover" className="popover__titled" onPopoverClosed={() => this.props.onclosed()}>
<SettingsList inPopover={true} onOptionClick={this.onoptionclick} style={{height: '410px'}} onReaderMode={this.props.onReaderMode} onPrint={this.props.onPrint} showHelp={this.props.showHelp}/>
<SettingsList inPopover={true} onOptionClick={this.onoptionclick} openOptions={this.props.openOptions} style={{height: '410px'}} onReaderMode={this.props.onReaderMode} onPrint={this.props.onPrint} showHelp={this.props.showHelp}/>
</Popover> :
<Popup className="settings-popup" onPopupClosed={() => this.props.onclosed()}>
<SettingsList onOptionClick={this.onoptionclick} onReaderMode={this.props.onReaderMode} onPrint={this.props.onPrint} showHelp={this.props.showHelp}/>
<SettingsList onOptionClick={this.onoptionclick} openOptions={this.props.openOptions} onReaderMode={this.props.onReaderMode} onPrint={this.props.onPrint} showHelp={this.props.showHelp}/>
</Popup>
)
}

View file

@ -200,7 +200,8 @@
"textCaseSensitive": "Case Sensitive",
"textHighlight": "Highlight Results",
"textReplace": "Replace",
"textNoTextFound": "Text not Found"
"textNoTextFound": "Text not Found",
"textCollaboration": "Collaboration"
},
"Add": {
"textSlide": "Slide",

View file

@ -95,7 +95,7 @@ class MainPage extends Component {
}
{
!this.state.settingsVisible ? null :
<Settings onclosed={this.handleOptionsViewClosed.bind(this, 'settings')} />
<Settings openOptions={this.handleClickToOpenOptions} onclosed={this.handleOptionsViewClosed.bind(this, 'settings')} />
}
{
!this.state.collaborationVisible ? null :

View file

@ -25,7 +25,7 @@ const ToolbarView = props => {
onAddClick: () => props.openOptions('add')
})}
{ Device.phone ? null : <Link className={props.disabledControls && 'disabled'} icon='icon-search' searchbarEnable='.searchbar' href={false}></Link> }
{props.displayCollaboration && <Link className={props.disabledControls && 'disabled'} id='btn-coauth' href={false} icon='icon-collaboration' onClick={() => props.openOptions('coauth')}></Link>}
{props.displayCollaboration && window.matchMedia("(min-width: 390px)").matches ? <Link className={props.disabledControls && 'disabled'} id='btn-coauth' href={false} icon='icon-collaboration' onClick={() => props.openOptions('coauth')}></Link> : null}
<Link className={(props.disabledSettings || props.disabledControls) && 'disabled'} id='btn-settings' icon='icon-settings' href={false} onClick={() => props.openOptions('settings')}></Link>
</NavRight>
</Fragment>

View file

@ -70,12 +70,17 @@ const SettingsList = withTranslation()(props => {
const closeModal = () => {
if (Device.phone) {
f7.sheet.close('.settings-popup', true);
f7.sheet.close('.settings-popup', false);
} else {
f7.popover.close('#settings-popover');
f7.popover.close('#settings-popover', false);
}
};
const onOpenCollaboration = async () => {
await closeModal();
await props.openOptions('coauth');
}
const onPrint = () => {
closeModal();
const api = Common.EditorApi.get();
@ -112,6 +117,11 @@ const SettingsList = withTranslation()(props => {
<Icon slot="media" icon="icon-search"></Icon>
</ListItem>
}
{window.matchMedia("(max-width: 389px)").matches ?
<ListItem title={_t.textCollaboration} link="#" onClick={onOpenCollaboration}>
<Icon slot="media" icon="icon-collaboration"></Icon>
</ListItem>
: null}
<ListItem link="#" title={_t.textPresentationSettings} onClick={onoptionclick.bind(this, '/presentation-settings/')}>
<Icon slot="media" icon="icon-setup"></Icon>
</ListItem>
@ -152,13 +162,14 @@ class SettingsView extends Component {
render() {
const show_popover = this.props.usePopover;
return (
show_popover ?
<Popover id="settings-popover" className="popover__titled" onPopoverClosed={() => this.props.onclosed()}>
<SettingsList inPopover={true} onOptionClick={this.onoptionclick} style={{height: '410px'}} />
<SettingsList inPopover={true} openOptions={this.props.openOptions} onOptionClick={this.onoptionclick} style={{height: '410px'}} />
</Popover> :
<Popup className="settings-popup" onPopupClosed={() => this.props.onclosed()}>
<SettingsList onOptionClick={this.onoptionclick} />
<SettingsList onOptionClick={this.onoptionclick} openOptions={this.props.openOptions} />
</Popup>
)
}
@ -174,13 +185,12 @@ const Settings = props => {
}
});
const onviewclosed = () => {
if ( props.onclosed )
if (props.onclosed)
props.onclosed();
};
return <SettingsView usePopover={!Device.phone} onclosed={onviewclosed} />
return <SettingsView usePopover={!Device.phone} onclosed={onviewclosed} openOptions={props.openOptions} />
};
export default Settings;

View file

@ -490,7 +490,8 @@
"textFormulas": "Formulas",
"textValues": "Values",
"textNoTextFound": "Text not found",
"textReplaceAll": "Replace All"
"textReplaceAll": "Replace All",
"textCollaboration": "Collaboration"
}
},
"Statusbar": {

View file

@ -88,7 +88,7 @@ class MainPage extends Component {
}
{
!this.state.settingsVisible ? null :
<Settings onclosed={this.handleOptionsViewClosed.bind(this, 'settings')} />
<Settings openOptions={this.handleClickToOpenOptions} onclosed={this.handleOptionsViewClosed.bind(this, 'settings')} />
}
{
!this.state.collaborationVisible ? null :

View file

@ -23,7 +23,7 @@ const ToolbarView = props => {
onAddClick: () => props.openOptions('add')
})}
{ Device.phone ? null : <Link className={props.disabledControls && 'disabled'} icon='icon-search' searchbarEnable='.searchbar' href={false}></Link> }
{props.displayCollaboration && <Link className={props.disabledControls && 'disabled'} id='btn-coauth' href={false} icon='icon-collaboration' onClick={() => props.openOptions('coauth')}></Link>}
{props.displayCollaboration && window.matchMedia("(min-width: 390px)").matches ? <Link className={props.disabledControls && 'disabled'} id='btn-coauth' href={false} icon='icon-collaboration' onClick={() => props.openOptions('coauth')}></Link> : null}
<Link className={(props.disabledSettings || props.disabledControls) && 'disabled'} id='btn-settings' icon='icon-settings' href={false} onClick={() => props.openOptions('settings')}></Link>
</NavRight>
</Fragment>

View file

@ -78,12 +78,17 @@ const SettingsList = withTranslation()(props => {
const closeModal = () => {
if (Device.phone) {
f7.sheet.close('.settings-popup', true);
f7.sheet.close('.settings-popup', false);
} else {
f7.popover.close('#settings-popover');
f7.popover.close('#settings-popover', false);
}
};
const onOpenCollaboration = async () => {
await closeModal();
await props.openOptions('coauth');
}
const onPrint = () => {
closeModal();
const api = Common.EditorApi.get();
@ -121,6 +126,11 @@ const SettingsList = withTranslation()(props => {
<Icon slot="media" icon="icon-search"></Icon>
</ListItem>
}
{window.matchMedia("(max-width: 389px)").matches ?
<ListItem title={_t.textCollaboration} link="#" onClick={onOpenCollaboration}>
<Icon slot="media" icon="icon-collaboration"></Icon>
</ListItem>
: null}
<ListItem link="#" title={_t.textSpreadsheetSettings} onClick={onoptionclick.bind(this, '/spreadsheet-settings/')}>
<Icon slot="media" icon="icon-table-settings"></Icon>
</ListItem>
@ -164,10 +174,10 @@ class SettingsView extends Component {
return (
show_popover ?
<Popover id="settings-popover" className="popover__titled" onPopoverClosed={() => this.props.onclosed()}>
<SettingsList inPopover={true} onOptionClick={this.onoptionclick} style={{height: '410px'}} />
<SettingsList inPopover={true} openOptions={this.props.openOptions} onOptionClick={this.onoptionclick} style={{height: '410px'}} />
</Popover> :
<Popup className="settings-popup" onPopupClosed={() => this.props.onclosed()}>
<SettingsList onOptionClick={this.onoptionclick} />
<SettingsList onOptionClick={this.onoptionclick} openOptions={this.props.openOptions} />
</Popup>
)
}
@ -189,7 +199,7 @@ const Settings = props => {
props.onclosed();
};
return <SettingsView usePopover={!Device.phone} onclosed={onviewclosed} />
return <SettingsView usePopover={!Device.phone} onclosed={onviewclosed} openOptions={props.openOptions} />
};
export default Settings;