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

[DE mobile] fix context menu close

Browse source
This commit is contained in:
Maxim Kadushkin 2021-02-16 20:31:27 +03:00
parent 0b4deb6e01
commit d6c6bc389b
4 changed files with 17 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
apps/common/mobile/lib/controller/ContextMenu.jsx
View file

@ -2,7 +2,9 @@ import React, { Component } from 'react';
import { f7 } from 'framework7-react';
import { Device } from '../../../../common/mobile/utils/device'
import ContextMenuView from '../view/ContextMenu';
import ContextMenuView, { idContextMenuElement } from '../view/ContextMenu';
const idCntextMenuTargetElement = '#idx-context-menu-target';
class ContextMenuController extends Component {
constructor(props) {
@ -19,10 +21,10 @@ class ContextMenuController extends Component {
}
onDocumentReady() {
this.$targetEl = $$('#idx-context-menu-target');
this.$targetEl = $$(idCntextMenuTargetElement);
if ( !this.$targetEl.length ) {
// this.$targetEl = $$('<div id="idx-context-menu-target" style="position:absolute;width:15px;height:15px;background-color:green;z-index:1;"></div>');
this.$targetEl = $$('<div id="idx-context-menu-target" style="position:absolute;"></div>');
this.$targetEl = $$(`<div id="${idCntextMenuTargetElement} style="position:absolute;"></div>`);
this.$targetEl.css({left: '-10000px', top: '-10000px'});
$$('#editor_sdk').append(this.$targetEl);
@ -93,7 +95,7 @@ class ContextMenuController extends Component {
onApiOpenContextMenu(x, y) {
if ( !this.state.opened ) {
this.$targetEl.css({left: `${x}px`, top: `${y}px`});
const popover = f7.popover.open('#idx-context-menu-popover', '#idx-context-menu-target');
const popover = f7.popover.open(idContextMenuElement, idCntextMenuTargetElement);
if ( Device.android )
this.offsetPopoverTop(popover);
@ -106,7 +108,7 @@ class ContextMenuController extends Component {
onApiHideContextMenu() {
if ( this.state.opened ) {
f7.popover.close('#idx-context-menu-popover');
f7.popover.close(idContextMenuElement);
this.$targetEl.css({left: '-10000px', top: '-10000px'});
this.setState({opened: false});

6
apps/common/mobile/lib/view/ContextMenu.jsx
View file

@ -2,6 +2,8 @@ import React, { Component } from 'react';
import { Popover, List, ListItem, ListButton, Link, Icon } from 'framework7-react';
import { f7 } from 'framework7-react';
const idContextMenuElement = "idx-context-menu-popover";
class ContextMenuView extends Component {
constructor(props) {
super(props);
@ -15,7 +17,7 @@ class ContextMenuView extends Component {
const buttons = this.props.items || {};
return (
<Popover id="idx-context-menu-popover"
<Popover id={idContextMenuElement}
className="document-menu"
backdrop={false}
closeByBackdropClick={false}
@ -36,4 +38,4 @@ class ContextMenuView extends Component {
}
}
export default ContextMenuView;
export {ContextMenuView as default, idContextMenuElement};

3
apps/documenteditor/mobile/src/controller/ContextMenu.jsx
View file

@ -1,6 +1,7 @@
import React from 'react';
import { f7 } from 'framework7-react';
import ContextMenuController from '../../../../common/mobile/lib/controller/ContextMenu';
import { idContextMenuElement } from '../../../../common/mobile/lib/view/ContextMenu';
class ContextMenu extends ContextMenuController {
constructor(props) {
@ -35,4 +36,4 @@ class ContextMenu extends ContextMenuController {
}
}
export { ContextMenu };
export { ContextMenu, idContextMenuElement };

5
apps/documenteditor/mobile/src/page/main.jsx
View file

@ -1,4 +1,5 @@
import React, { Component } from 'react';
import { f7 } from 'framework7-react';
import { Page, View, Navbar, NavLeft, NavRight, Link, Icon } from 'framework7-react';
import EditOptions from '../view/edit/Edit';
@ -7,7 +8,7 @@ import Settings from '../view/settings/Settings';
import Collaboration from '../../../../common/mobile/lib/view/collaboration/Collaboration.jsx'
import { Device } from '../../../../common/mobile/utils/device'
import { Search, SearchSettings } from '../controller/Search';
import { ContextMenu } from '../controller/ContextMenu';
import { ContextMenu, idContextMenuElement } from '../controller/ContextMenu';
export default class MainPage extends Component {
constructor(props) {
@ -21,6 +22,8 @@ export default class MainPage extends Component {
}
handleClickToOpenOptions = opts => {
f7.popover.close(idContextMenuElement, false);
this.setState(state => {
if ( opts == 'edit' )
return {editOptionsVisible: true};