Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

[DE mobile] Correct content controls

Browse source
This commit is contained in:
SergeyEzhin 2021-09-24 16:16:20 +03:00
parent 95c56cde77
commit ee5dab8cb0
4 changed files with 46 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
apps/documenteditor/mobile/locale/en.json
View file

@ -326,7 +326,8 @@
"textSeptember": "September", "textSeptember": "September",
"textOctober": "October", "textOctober": "October",
"textNovember": "November", "textNovember": "November",
"textDecember": "December" "textDecember": "December",
"textEmpty": "Empty"
}, },
"Error": { "Error": {
"convertationTimeoutText": "Conversion timeout exceeded.", "convertationTimeoutText": "Conversion timeout exceeded.",

42
apps/documenteditor/mobile/src/controller/DropdownList.jsx
View file

@ -1,6 +1,7 @@
import React, { Component } from 'react'; import React, { Component } from 'react';
import { Device } from '../../../../common/mobile/utils/device'; import { Device } from '../../../../common/mobile/utils/device';
import { f7 } from "framework7-react"; import { f7 } from "framework7-react";
import { withTranslation } from "react-i18next";
import DropdownList from "../view/DropdownList"; import DropdownList from "../view/DropdownList";
class DropdownListController extends Component { class DropdownListController extends Component {
@ -12,19 +13,17 @@ class DropdownListController extends Component {
isOpen: false isOpen: false
}; };
Common.Notifications.on('openDropdownList', (obj, x, y) => { Common.Notifications.on('openDropdownList', obj => {
this.initDropdownList(obj, x, y); this.initDropdownList(obj);
}); });
} }
initDropdownList(obj, x, y) { initDropdownList(obj) {
let type = obj.type; let type = obj.type;
this.left = x; this.propsObj = obj.pr;
this.top = y; this.specProps = (type == Asc.c_oAscContentControlSpecificType.ComboBox) ? this.propsObj.get_ComboBoxPr() : this.propsObj.get_DropDownListPr();
this.props = obj.pr; this.isForm = !!this.propsObj.get_FormPr();
this.specProps = (type == Asc.c_oAscContentControlSpecificType.ComboBox) ? this.props.get_ComboBoxPr() : this.props.get_DropDownListPr();
this.isForm = !!this.props.get_FormPr();
this.listItems = []; this.listItems = [];
this.initListItems(); this.initListItems();
@ -35,7 +34,17 @@ class DropdownListController extends Component {
} }
initListItems() { initListItems() {
let count = this.specProps.get_ItemsCount(); const { t } = this.props;
const count = this.specProps.get_ItemsCount();
if(this.isForm) {
let text = this.propsObj.get_PlaceholderText();
this.listItems.push({
caption: text.trim() !== '' ? text : t('Edit.textEmpty'),
value: ''
});
}
for (let i = 0; i < count; i++) { for (let i = 0; i < count; i++) {
if(this.specProps.get_ItemValue(i) || !this.isForm) { if(this.specProps.get_ItemValue(i) || !this.isForm) {
@ -45,11 +54,18 @@ class DropdownListController extends Component {
}); });
} }
} }
if (!this.isForm && this.listItems.length < 1) {
this.listItems.push({
caption: t('Edit.textEmpty'),
value: -1
});
}
} }
closeModal() { closeModal() {
if(Device.isPhone) { if(Device.isPhone) {
f7.popup.close('#dropdown-list-popup', true); f7.sheet.close('#dropdown-list-sheet', true);
} else { } else {
f7.popover.close('#dropdown-list-popover', true); f7.popover.close('#dropdown-list-popover', true);
} }
@ -59,10 +75,10 @@ class DropdownListController extends Component {
onChangeItemList(value) { onChangeItemList(value) {
const api = Common.EditorApi.get(); const api = Common.EditorApi.get();
// const internalId = this.props.get_InternalId; // const internalId = this.propsObj.get_InternalId;
if(value !== -1) { if(value !== -1) {
this.closeModal() this.closeModal();
api.asc_SelectContentControlListItem(value); api.asc_SelectContentControlListItem(value);
} }
} }
@ -79,4 +95,4 @@ class DropdownListController extends Component {
} }
} }
export default DropdownListController; export default withTranslation()(DropdownListController);

22
apps/documenteditor/mobile/src/controller/Main.jsx
View file

@ -562,10 +562,6 @@ class MainController extends Component {
} }
}); });
this.api.asc_registerCallback('asc_onHideContentControlsActions', () => {
console.log(true);
});
// text settings // text settings
const storeTextSettings = this.props.storeTextSettings; const storeTextSettings = this.props.storeTextSettings;
storeTextSettings.resetFontsRecent(LocalStorage.getItem('dde-settings-recent-fonts')); storeTextSettings.resetFontsRecent(LocalStorage.getItem('dde-settings-recent-fonts'));
@ -722,16 +718,18 @@ class MainController extends Component {
onShowListActions(obj, x, y) { onShowListActions(obj, x, y) {
this.dropdownListTarget = this.boxSdk.find('#dropdown-list-target'); if(!Device.isPhone) {
this.dropdownListTarget = this.boxSdk.find('#dropdown-list-target');
if (this.dropdownListTarget.length < 1) {
this.dropdownListTarget = $$('<div id="dropdown-list-target" style="position: absolute;"></div>'); if (this.dropdownListTarget.length < 1) {
this.boxSdk.append(this.dropdownListTarget); this.dropdownListTarget = $$('<div id="dropdown-list-target" style="position: absolute;"></div>');
this.boxSdk.append(this.dropdownListTarget);
}
this.dropdownListTarget.css({left: `${x}px`, top: `${y}px`});
} }
this.dropdownListTarget.css({left: `${x}px`, top: `${y}px`}); Common.Notifications.trigger('openDropdownList', obj);
Common.Notifications.trigger('openDropdownList', obj, x, y);
} }
onProcessSaveResult (data) { onProcessSaveResult (data) {

12
apps/documenteditor/mobile/src/view/DropdownList.jsx
View file

@ -1,6 +1,5 @@
import React, {Component, useEffect, useState} from 'react'; import React, {Component, useEffect, useState} from 'react';
import { f7, Page, Navbar, List, ListItem, BlockTitle, ListButton, Popover, Popup, View, Link, Actions, ActionsGroup } from "framework7-react"; import { f7, Page, Navbar, List, ListItem, BlockTitle, ListButton, Popover, Popup, View, Link, Sheet } from "framework7-react";
import { useTranslation } from "react-i18next";
import { Device } from '../../../../common/mobile/utils/device'; import { Device } from '../../../../common/mobile/utils/device';
const PageDropdownList = props => { const PageDropdownList = props => {
@ -27,16 +26,15 @@ class DropdownListView extends Component {
render() { render() {
return ( return (
Device.isPhone ? Device.isPhone ?
<Popup id="dropdown-list-popup" style={{height: '410px'}}> <Sheet id="dropdown-list-sheet" closeByOutsideClick={true} backdrop={false} closeByBackdropClick={false} swipeToStep={true} swipeToClose={true}>
<PageDropdownList <PageDropdownList
listItems={this.props.listItems} listItems={this.props.listItems}
onChangeItemList={this.props.onChangeItemList} onChangeItemList={this.props.onChangeItemList}
closeModal={this.props.closeModal} closeModal={this.props.closeModal}
style={{height: '100%'}}
/> />
</Popup> </Sheet>
: :
<Popover id="dropdown-list-popover" closeByOutsideClick={false} closeByBackdropClick={false}> <Popover id="dropdown-list-popover" className="popover__titled" closeByOutsideClick={false}>
<PageDropdownList <PageDropdownList
listItems={this.props.listItems} listItems={this.props.listItems}
onChangeItemList={this.props.onChangeItemList} onChangeItemList={this.props.onChangeItemList}
@ -53,7 +51,7 @@ class DropdownListView extends Component {
const DropdownList = props => { const DropdownList = props => {
useEffect(() => { useEffect(() => {
if(Device.isPhone) { if(Device.isPhone) {
f7.popup.open('#dropdown-list-popup', true); f7.sheet.open('#dropdown-list-sheet', true);
} else { } else {
f7.popover.open('#dropdown-list-popover', '#dropdown-list-target'); f7.popover.open('#dropdown-list-popover', '#dropdown-list-target');
} }