[DE mobile] Fix Bug 56312

This commit is contained in:
SergeyEzhin 2022-03-28 16:42:51 +04:00
parent c9424d153d
commit 782d64f079

View file

@ -1,15 +1,15 @@
import React, { useContext } from 'react'; import React, { useContext } from "react";
import { f7 } from 'framework7-react'; import { f7 } from "framework7-react";
import { inject, observer } from "mobx-react"; import { inject, observer } from "mobx-react";
import { withTranslation} from 'react-i18next'; import { withTranslation } from "react-i18next";
import { LocalStorage } from '../../../../common/mobile/utils/LocalStorage'; import { LocalStorage } from "../../../../common/mobile/utils/LocalStorage";
import ContextMenuController from '../../../../common/mobile/lib/controller/ContextMenu'; import ContextMenuController from "../../../../common/mobile/lib/controller/ContextMenu";
import { idContextMenuElement } from '../../../../common/mobile/lib/view/ContextMenu'; import { idContextMenuElement } from "../../../../common/mobile/lib/view/ContextMenu";
import { Device } from '../../../../common/mobile/utils/device'; import { Device } from "../../../../common/mobile/utils/device";
import EditorUIController from '../lib/patch'; import EditorUIController from "../lib/patch";
@inject ( stores => ({ @inject((stores) => ({
isEdit: stores.storeAppOptions.isEdit, isEdit: stores.storeAppOptions.isEdit,
canComments: stores.storeAppOptions.canComments, canComments: stores.storeAppOptions.canComments,
canViewComments: stores.storeAppOptions.canViewComments, canViewComments: stores.storeAppOptions.canViewComments,
@ -19,7 +19,7 @@ import EditorUIController from '../lib/patch';
users: stores.users, users: stores.users,
isDisconnected: stores.users.isDisconnected, isDisconnected: stores.users.isDisconnected,
displayMode: stores.storeReview.displayMode, displayMode: stores.storeReview.displayMode,
dataDoc: stores.storeDocumentInfo.dataDoc dataDoc: stores.storeDocumentInfo.dataDoc,
})) }))
class ContextMenu extends ContextMenuController { class ContextMenu extends ContextMenuController {
constructor(props) { constructor(props) {
@ -45,23 +45,30 @@ class ContextMenu extends ContextMenuController {
isUserVisible(id) { isUserVisible(id) {
const user = this.props.users.searchUserByCurrentId(id); const user = this.props.users.searchUserByCurrentId(id);
return user ? (user.asc_getIdOriginal()===this.props.users.currentUser.asc_getIdOriginal() || AscCommon.UserInfoParser.isUserVisible(user.asc_getUserName())) : true; return user
? user.asc_getIdOriginal() ===
this.props.users.currentUser.asc_getIdOriginal() ||
AscCommon.UserInfoParser.isUserVisible(user.asc_getUserName())
: true;
} }
componentWillUnmount() { componentWillUnmount() {
super.componentWillUnmount(); super.componentWillUnmount();
const api = Common.EditorApi.get(); const api = Common.EditorApi.get();
api.asc_unregisterCallback('asc_onShowComment', this.onApiShowComment); api.asc_unregisterCallback("asc_onShowComment", this.onApiShowComment);
api.asc_unregisterCallback('asc_onHideComment', this.onApiHideComment); api.asc_unregisterCallback("asc_onHideComment", this.onApiHideComment);
api.asc_unregisterCallback('asc_onShowRevisionsChange', this.onApiShowChange); api.asc_unregisterCallback(
Common.Notifications.off('showSplitModal', this.ShowModal); "asc_onShowRevisionsChange",
this.onApiShowChange
);
Common.Notifications.off("showSplitModal", this.ShowModal);
} }
ShowModal() { ShowModal() {
this.showSplitModal() this.showSplitModal();
} }
onApiShowComment(comments) { onApiShowComment(comments) {
this.isComments = comments && comments.length > 0; this.isComments = comments && comments.length > 0;
} }
@ -71,7 +78,7 @@ class ContextMenu extends ContextMenuController {
} }
onApiShowChange(sdkchange, isShow) { onApiShowChange(sdkchange, isShow) {
this.inRevisionChange = isShow && sdkchange && sdkchange.length>0; this.inRevisionChange = isShow && sdkchange && sdkchange.length > 0;
} }
// onMenuClosed() { // onMenuClosed() {
@ -81,44 +88,53 @@ class ContextMenu extends ContextMenuController {
onMenuItemClick(action) { onMenuItemClick(action) {
super.onMenuItemClick(action); super.onMenuItemClick(action);
if ( EditorUIController.ContextMenu && EditorUIController.ContextMenu.handleMenuItemClick(this, action) ) if (
EditorUIController.ContextMenu &&
EditorUIController.ContextMenu.handleMenuItemClick(this, action)
)
return; return;
const api = Common.EditorApi.get(); const api = Common.EditorApi.get();
switch (action) { switch (action) {
case 'cut': case "cut":
if ( !LocalStorage.getBool("de-hide-copy-cut-paste-warning") ) if (!LocalStorage.getBool("de-hide-copy-cut-paste-warning"))
this.showCopyCutPasteModal(); this.showCopyCutPasteModal();
break; break;
case 'copy': case "copy":
if (!api.Copy() && !LocalStorage.getBool("de-hide-copy-cut-paste-warning") ) if (
!api.Copy() &&
!LocalStorage.getBool("de-hide-copy-cut-paste-warning")
)
this.showCopyCutPasteModal(); this.showCopyCutPasteModal();
break; break;
case 'paste': case "paste":
if ( !LocalStorage.getBool("de-hide-copy-cut-paste-warning") ) if (!LocalStorage.getBool("de-hide-copy-cut-paste-warning"))
this.showCopyCutPasteModal(); this.showCopyCutPasteModal();
break; break;
case 'viewcomment': case "viewcomment":
Common.Notifications.trigger('viewcomment'); Common.Notifications.trigger("viewcomment");
break; break;
case 'openlink': case "openlink":
const stack = api.getSelectedElements(); const stack = api.getSelectedElements();
let value; let value;
stack.forEach((item) => { stack.forEach((item) => {
if (item.get_ObjectType() == Asc.c_oAscTypeSelectElement.Hyperlink) { if (
item.get_ObjectType() ==
Asc.c_oAscTypeSelectElement.Hyperlink
) {
value = item.get_ObjectValue().get_Value(); value = item.get_ObjectValue().get_Value();
} }
}); });
value && this.openLink(value); value && this.openLink(value);
break; break;
case 'review': case "review":
setTimeout(() => { setTimeout(() => {
this.props.openOptions('coauth', 'cm-review'); this.props.openOptions("coauth", "cm-review");
}, 400); }, 400);
break; break;
case 'reviewchange': case "reviewchange":
setTimeout(() => { setTimeout(() => {
this.props.openOptions('coauth', 'cm-review-change'); this.props.openOptions("coauth", "cm-review-change");
}, 400); }, 400);
break; break;
} }
@ -127,81 +143,97 @@ class ContextMenu extends ContextMenuController {
showCopyCutPasteModal() { showCopyCutPasteModal() {
const { t } = this.props; const { t } = this.props;
const _t = t("ContextMenu", { returnObjects: true }); const _t = t("ContextMenu", { returnObjects: true });
f7.dialog.create({ f7.dialog
title: _t.textCopyCutPasteActions, .create({
text: _t.errorCopyCutPaste, title: _t.textCopyCutPasteActions,
content: `<div class="checkbox-in-modal"> text: _t.errorCopyCutPaste,
content: `<div class="checkbox-in-modal">
<label class="checkbox"> <label class="checkbox">
<input type="checkbox" name="checkbox-show" /> <input type="checkbox" name="checkbox-show" />
<i class="icon-checkbox"></i> <i class="icon-checkbox"></i>
</label> </label>
<span class="right-text">${_t.textDoNotShowAgain}</span> <span class="right-text">${_t.textDoNotShowAgain}</span>
</div>`, </div>`,
buttons: [{ buttons: [
text: 'OK', {
onClick: () => { text: "OK",
const dontShow = $$('input[name="checkbox-show"]').prop('checked'); onClick: () => {
if (dontShow) LocalStorage.setItem("de-hide-copy-cut-paste-warning", 1); const dontShow = $$(
} 'input[name="checkbox-show"]'
}] ).prop("checked");
}).open(); if (dontShow)
LocalStorage.setItem(
"de-hide-copy-cut-paste-warning",
1
);
},
},
],
})
.open();
} }
showSplitModal() { showSplitModal() {
const { t } = this.props; const { t } = this.props;
const _t = t("ContextMenu", { returnObjects: true }); const _t = t("ContextMenu", { returnObjects: true });
let picker; let picker;
const dialog = f7.dialog.create({ const dialog = f7.dialog
title: _t.menuSplit, .create({
text: '', title: _t.menuSplit,
content: `<div class="content-block"> text: "",
content: `<div class="content-block">
<div class="row"> <div class="row">
<div class="col-50">${_t.textColumns}</div> <div class="col-50">${_t.textColumns}</div>
<div class="col-50">${_t.textRows}</div> <div class="col-50">${_t.textRows}</div>
</div> </div>
<div id="picker-split-size"></div> <div id="picker-split-size"></div>
</div>`, </div>`,
buttons: [ buttons: [
{ {
text: _t.menuCancel text: _t.menuCancel,
},
{
text: "OK",
bold: true,
onClick: function () {
const size = picker.value;
Common.EditorApi.get().SplitCell(
parseInt(size[0]),
parseInt(size[1])
);
},
},
],
on: {
open: () => {
picker = f7.picker.create({
containerEl:
document.getElementById("picker-split-size"),
cols: [
{
textAlign: "center",
width: "100%",
values: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
},
{
textAlign: "center",
width: "100%",
values: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
},
],
toolbar: false,
rotateEffect: true,
value: [3, 3],
});
},
}, },
{ })
text: 'OK', .open();
bold: true,
onClick: function () {
const size = picker.value;
Common.EditorApi.get().SplitCell(parseInt(size[0]), parseInt(size[1]));
}
}
],
on: {
open: () => {
picker = f7.picker.create({
containerEl: document.getElementById('picker-split-size'),
cols: [
{
textAlign: 'center',
width: '100%',
values: [1,2,3,4,5,6,7,8,9,10]
},
{
textAlign: 'center',
width: '100%',
values: [1,2,3,4,5,6,7,8,9,10]
}
],
toolbar: false,
rotateEffect: true,
value: [3, 3]
});
}
}
}).open();
} }
openLink(url) { openLink(url) {
if (Common.EditorApi.get().asc_getUrlType(url) > 0) { if (Common.EditorApi.get().asc_getUrlType(url) > 0) {
const newDocumentPage = window.open(url, '_blank'); const newDocumentPage = window.open(url, "_blank");
if (newDocumentPage) { if (newDocumentPage) {
newDocumentPage.focus(); newDocumentPage.focus();
} }
@ -212,21 +244,24 @@ class ContextMenu extends ContextMenuController {
super.onDocumentReady(); super.onDocumentReady();
const api = Common.EditorApi.get(); const api = Common.EditorApi.get();
api.asc_registerCallback('asc_onShowComment', this.onApiShowComment); api.asc_registerCallback("asc_onShowComment", this.onApiShowComment);
api.asc_registerCallback('asc_onHideComment', this.onApiHideComment); api.asc_registerCallback("asc_onHideComment", this.onApiHideComment);
api.asc_registerCallback('asc_onShowRevisionsChange', this.onApiShowChange); api.asc_registerCallback(
Common.Notifications.on('showSplitModal', this.ShowModal); "asc_onShowRevisionsChange",
this.onApiShowChange
);
Common.Notifications.on("showSplitModal", this.ShowModal);
} }
initMenuItems() { initMenuItems() {
if ( !Common.EditorApi ) return []; if (!Common.EditorApi) return [];
const { isEdit, canFillForms, isDisconnected } = this.props; const { isEdit, canFillForms, isDisconnected, dataDoc } = this.props;
if (isEdit && EditorUIController.ContextMenu) { if (isEdit && EditorUIController.ContextMenu) {
return EditorUIController.ContextMenu.mapMenuItems(this); return EditorUIController.ContextMenu.mapMenuItems(this);
} else { } else {
const { t } = this.props; const { t } = this.props;
const _t = t("ContextMenu", {returnObjects: true}); const _t = t("ContextMenu", { returnObjects: true });
const { canViewComments, canCoAuthoring, canComments } = this.props; const { canViewComments, canCoAuthoring, canComments } = this.props;
const api = Common.EditorApi.get(); const api = Common.EditorApi.get();
@ -238,20 +273,25 @@ class ContextMenu extends ContextMenuController {
isLink = false, isLink = false,
locked = false; locked = false;
stack.forEach(item => { stack.forEach((item) => {
const objectType = item.get_ObjectType(), const objectType = item.get_ObjectType(),
objectValue = item.get_ObjectValue(); objectValue = item.get_ObjectValue();
if ( objectType == Asc.c_oAscTypeSelectElement.Header ) { if (objectType == Asc.c_oAscTypeSelectElement.Header) {
locked = objectValue.get_Locked(); locked = objectValue.get_Locked();
} else } else if (
if ( objectType == Asc.c_oAscTypeSelectElement.Paragraph ) { objectType == Asc.c_oAscTypeSelectElement.Paragraph
) {
locked = objectValue.get_Locked(); locked = objectValue.get_Locked();
isText = true; isText = true;
} else } else if (
if ( objectType == Asc.c_oAscTypeSelectElement.Image || objectType == Asc.c_oAscTypeSelectElement.Table) { objectType == Asc.c_oAscTypeSelectElement.Image ||
objectType == Asc.c_oAscTypeSelectElement.Table
) {
locked = objectValue.get_Locked(); locked = objectValue.get_Locked();
isObject = true; isObject = true;
} else if ( objectType == Asc.c_oAscTypeSelectElement.Hyperlink ) { } else if (
objectType == Asc.c_oAscTypeSelectElement.Hyperlink
) {
isLink = true; isLink = true;
} }
}); });
@ -259,47 +299,53 @@ class ContextMenu extends ContextMenuController {
let itemsIcon = [], let itemsIcon = [],
itemsText = []; itemsText = [];
if ( canCopy ) { if (canCopy) {
itemsIcon.push({ itemsIcon.push({
event: 'copy', event: "copy",
icon: 'icon-copy' icon: "icon-copy",
}); });
} }
if(!isDisconnected) { if (!isDisconnected) {
if ( canFillForms && canCopy && !locked ) { if (canFillForms && canCopy && !locked) {
itemsIcon.push({ itemsIcon.push({
event: 'cut', event: "cut",
icon: 'icon-cut' icon: "icon-cut",
}); });
} }
if ( canFillForms && dataDoc.fileType !== 'oform' && !locked ) { if (canFillForms && dataDoc.fileType !== "oform" && !locked) {
itemsIcon.push({ itemsIcon.push({
event: 'paste', event: "paste",
icon: 'icon-paste' icon: "icon-paste",
}); });
} }
if ( canViewComments && this.isComments ) { if (canViewComments && this.isComments) {
itemsText.push({ itemsText.push({
caption: _t.menuViewComment, caption: _t.menuViewComment,
event: 'viewcomment' event: "viewcomment",
}); });
} }
if (api.can_AddQuotedComment() !== false && canCoAuthoring && canComments && !locked && !(!isText && isObject)) { if (
api.can_AddQuotedComment() !== false &&
canCoAuthoring &&
canComments &&
!locked &&
!(!isText && isObject)
) {
itemsText.push({ itemsText.push({
caption: _t.menuAddComment, caption: _t.menuAddComment,
event: 'addcomment' event: "addcomment",
}); });
} }
} }
if ( isLink ) { if (isLink) {
itemsText.push({ itemsText.push({
caption: _t.menuOpenLink, caption: _t.menuOpenLink,
event: 'openlink' event: "openlink",
}); });
} }
@ -307,11 +353,13 @@ class ContextMenu extends ContextMenuController {
} }
} }
initExtraItems () { initExtraItems() {
return (this.extraItems && this.extraItems.length > 0 ? this.extraItems : []); return this.extraItems && this.extraItems.length > 0
? this.extraItems
: [];
} }
} }
const _ContextMenu = withTranslation()(ContextMenu); const _ContextMenu = withTranslation()(ContextMenu);
_ContextMenu.closeContextMenu = ContextMenu.closeContextMenu; _ContextMenu.closeContextMenu = ContextMenu.closeContextMenu;
export { _ContextMenu as default }; export { _ContextMenu as default };