From 7d6f4dbd8c6895757ef794b2a9a217459c5ef5b8 Mon Sep 17 00:00:00 2001 From: SergeyEzhin Date: Tue, 23 Aug 2022 21:38:23 +0300 Subject: [PATCH 1/6] [DE mobile] Add snackbar for android --- apps/documenteditor/mobile/locale/en.json | 4 +- .../src/components/Snackbar/Snackbar.jsx | 13 ++++++ .../mobile/src/controller/Toolbar.jsx | 1 + .../src/controller/settings/Settings.jsx | 4 -- .../mobile/src/less/app-ios.less | 1 - .../mobile/src/less/app-material.less | 43 +++++++++++++++++++ apps/documenteditor/mobile/src/page/main.jsx | 33 +++++++++++--- .../mobile/src/view/Toolbar.jsx | 10 ++++- .../mobile/src/view/settings/Settings.jsx | 11 +++-- vendor/framework7-react/package.json | 1 + 10 files changed, 105 insertions(+), 16 deletions(-) create mode 100644 apps/documenteditor/mobile/src/components/Snackbar/Snackbar.jsx diff --git a/apps/documenteditor/mobile/locale/en.json b/apps/documenteditor/mobile/locale/en.json index c88d8d898..695f8ec8c 100644 --- a/apps/documenteditor/mobile/locale/en.json +++ b/apps/documenteditor/mobile/locale/en.json @@ -677,6 +677,8 @@ "dlgLeaveTitleText": "You leave the application", "leaveButtonText": "Leave this Page", "stayButtonText": "Stay on this page", - "textOk": "OK" + "textOk": "OK", + "textSwitchedMobileView": "Switched to Mobile view", + "textSwitchedStandardView": "Switched to Standard view" } } \ No newline at end of file diff --git a/apps/documenteditor/mobile/src/components/Snackbar/Snackbar.jsx b/apps/documenteditor/mobile/src/components/Snackbar/Snackbar.jsx new file mode 100644 index 000000000..ae94a2109 --- /dev/null +++ b/apps/documenteditor/mobile/src/components/Snackbar/Snackbar.jsx @@ -0,0 +1,13 @@ +import React from 'react'; + +const Snackbar = props => { + return ( +
+
+

{props.text}

+
+
+ ) +} + +export default Snackbar; \ No newline at end of file diff --git a/apps/documenteditor/mobile/src/controller/Toolbar.jsx b/apps/documenteditor/mobile/src/controller/Toolbar.jsx index f5f688d75..be71a2cdf 100644 --- a/apps/documenteditor/mobile/src/controller/Toolbar.jsx +++ b/apps/documenteditor/mobile/src/controller/Toolbar.jsx @@ -151,6 +151,7 @@ const ToolbarController = inject('storeAppOptions', 'users', 'storeReview', 'sto return ( { appOptions.changeMobileView(); api.ChangeReaderMode(); - - if (Device.phone) { - closeModal(); - } } return } + { + + + + } {appOptions.isDocReady && } ) } } -export default inject("storeAppOptions")(observer(MainPage)); \ No newline at end of file +export default inject("storeAppOptions")(observer(withTranslation()(MainPage))); \ No newline at end of file diff --git a/apps/documenteditor/mobile/src/view/Toolbar.jsx b/apps/documenteditor/mobile/src/view/Toolbar.jsx index 2c35d3f64..3d6916ec3 100644 --- a/apps/documenteditor/mobile/src/view/Toolbar.jsx +++ b/apps/documenteditor/mobile/src/view/Toolbar.jsx @@ -2,7 +2,7 @@ import React, {Fragment} from 'react'; import { useTranslation } from 'react-i18next'; import {NavLeft, NavRight, NavTitle, Link, Icon} from 'framework7-react'; import { Device } from '../../../../common/mobile/utils/device'; -import EditorUIController from '../lib/patch' +import EditorUIController from '../lib/patch'; const ToolbarView = props => { const { t } = useTranslation(); @@ -44,7 +44,13 @@ const ToolbarView = props => { onUndoClick: props.onUndo, onRedoClick: props.onRedo })} - {(isViewer || !Device.phone) && props.changeMobileView()}>} + {(isViewer || !Device.phone) && { + props.changeMobileView(); + props.openOptions('snackbar'); + setTimeout(() => { + props.closeOptions('snackbar'); + }, 500); + }}>} {(props.showEditDocument && !isViewer) && } diff --git a/apps/documenteditor/mobile/src/view/settings/Settings.jsx b/apps/documenteditor/mobile/src/view/settings/Settings.jsx index 79d869d76..850e916e7 100644 --- a/apps/documenteditor/mobile/src/view/settings/Settings.jsx +++ b/apps/documenteditor/mobile/src/view/settings/Settings.jsx @@ -163,7 +163,12 @@ const SettingsList = inject("storeAppOptions", "storeReview")(observer(props => {!isViewer && Device.phone && - props.onChangeMobileView()} /> + { + // props.onclosed(); + props.onChangeMobileView(); + props.openOptions('snackbar'); + // if(Device.phone) closeModal(); + }} /> } {(_isEdit && !isViewer) && @@ -231,10 +236,10 @@ class SettingsView extends Component { return ( show_popover ? this.props.onclosed()}> - + : this.props.onclosed()}> - + ) } diff --git a/vendor/framework7-react/package.json b/vendor/framework7-react/package.json index 960e46be6..f7ad68807 100644 --- a/vendor/framework7-react/package.json +++ b/vendor/framework7-react/package.json @@ -38,6 +38,7 @@ "react": "^18.1.0", "react-dom": "^18.1.0", "react-i18next": "^11.8.5", + "react-transition-group": "^4.4.5", "swiper": "^8.2.4", "template7": "^1.4.2" }, From 63d942c2386ceee3398cc51942df97f3e8d831eb Mon Sep 17 00:00:00 2001 From: SergeyEzhin Date: Wed, 24 Aug 2022 17:29:39 +0300 Subject: [PATCH 2/6] [DE mobile] Turned on mobile view in start --- apps/documenteditor/mobile/src/controller/Main.jsx | 4 ++-- .../mobile/src/controller/settings/Settings.jsx | 7 ++++++- apps/documenteditor/mobile/src/page/main.jsx | 3 ++- apps/documenteditor/mobile/src/store/appOptions.js | 2 +- .../mobile/src/view/settings/Settings.jsx | 13 +++++++------ 5 files changed, 18 insertions(+), 11 deletions(-) diff --git a/apps/documenteditor/mobile/src/controller/Main.jsx b/apps/documenteditor/mobile/src/controller/Main.jsx index 74fd40e3e..de7abebe4 100644 --- a/apps/documenteditor/mobile/src/controller/Main.jsx +++ b/apps/documenteditor/mobile/src/controller/Main.jsx @@ -124,7 +124,7 @@ class MainController extends Component { docInfo = new Asc.asc_CDocInfo(); docInfo.put_Id(data.doc.key); docInfo.put_Url(data.doc.url); - // docInfo.put_DirectUrl(data.doc.directUrl); + docInfo.put_DirectUrl(data.doc.directUrl); docInfo.put_Title(data.doc.title); docInfo.put_Format(data.doc.fileType); docInfo.put_VKey(data.doc.vkey); @@ -273,7 +273,7 @@ class MainController extends Component { this.api.Resize(); this.api.zoomFitToWidth(); this.api.asc_GetDefaultTableStyles && setTimeout(() => {this.api.asc_GetDefaultTableStyles()}, 1); - + this.api.ChangeReaderMode(); this.applyLicense(); Common.Notifications.trigger('document:ready'); diff --git a/apps/documenteditor/mobile/src/controller/settings/Settings.jsx b/apps/documenteditor/mobile/src/controller/settings/Settings.jsx index b4dfc7086..202a24362 100644 --- a/apps/documenteditor/mobile/src/controller/settings/Settings.jsx +++ b/apps/documenteditor/mobile/src/controller/settings/Settings.jsx @@ -87,11 +87,16 @@ const Settings = props => { appOptions.changeMobileView(); api.ChangeReaderMode(); + + if(Device.phone) { + closeModal(); + } } return } + {/*onclosed={this.handleOptionsViewClosed.bind(this, 'settings')}*/} { !this.state.settingsVisible ? null : - + } { !this.state.collaborationVisible ? null : diff --git a/apps/documenteditor/mobile/src/store/appOptions.js b/apps/documenteditor/mobile/src/store/appOptions.js index 096c60834..b71e1ccce 100644 --- a/apps/documenteditor/mobile/src/store/appOptions.js +++ b/apps/documenteditor/mobile/src/store/appOptions.js @@ -35,7 +35,7 @@ export class storeAppOptions { isEdit = false; - isMobileView = false; + isMobileView = true; changeMobileView() { this.isMobileView = !this.isMobileView; } diff --git a/apps/documenteditor/mobile/src/view/settings/Settings.jsx b/apps/documenteditor/mobile/src/view/settings/Settings.jsx index 850e916e7..4b263f1e7 100644 --- a/apps/documenteditor/mobile/src/view/settings/Settings.jsx +++ b/apps/documenteditor/mobile/src/view/settings/Settings.jsx @@ -164,10 +164,11 @@ const SettingsList = inject("storeAppOptions", "storeReview")(observer(props => { - // props.onclosed(); props.onChangeMobileView(); props.openOptions('snackbar'); - // if(Device.phone) closeModal(); + setTimeout( () => { + props.closeOptions('snackbar'); + }, 1000); }} /> } @@ -235,11 +236,11 @@ class SettingsView extends Component { const show_popover = this.props.usePopover; return ( show_popover ? - this.props.onclosed()}> - + this.props.closeOptions('settings')}> + : - this.props.onclosed()}> - + this.props.closeOptions('settings')}> + ) } From 158cd48e0b11de1611432cb0d63050df88661c4d Mon Sep 17 00:00:00 2001 From: SergeyEzhin Date: Wed, 24 Aug 2022 17:36:14 +0300 Subject: [PATCH 3/6] [DE mobile] Fix Bug 58665 --- .../lib/view/collaboration/Comments.jsx | 68 +++++++++---------- 1 file changed, 34 insertions(+), 34 deletions(-) diff --git a/apps/common/mobile/lib/view/collaboration/Comments.jsx b/apps/common/mobile/lib/view/collaboration/Comments.jsx index 4525329bc..4ccb89031 100644 --- a/apps/common/mobile/lib/view/collaboration/Comments.jsx +++ b/apps/common/mobile/lib/view/collaboration/Comments.jsx @@ -677,7 +677,7 @@ const ViewComments = inject("storeComments", "storeAppOptions", "storeReview")(o {isEdit && !viewMode &&
- {(comment.editable && displayMode === 'markup' && !wsProps?.Objects) &&
{!isViewer && onResolveComment(comment);}}>
} + {(comment.editable && displayMode === 'markup' && !wsProps?.Objects && !isViewer) &&
{onResolveComment(comment);}}>
} {(displayMode === 'markup' && !wsProps?.Objects && !isViewer) &&
{setComment(comment); openActionComment(true);}}> @@ -808,7 +808,7 @@ const CommentList = inject("storeComments", "storeAppOptions", "storeReview")(ob
{isEdit && !viewMode &&
- {(comment.editable && displayMode === 'markup' && !wsProps?.Objects) &&
{!isViewer && onResolveComment(comment);}}>
} + {(comment.editable && displayMode === 'markup' && !wsProps?.Objects && !isViewer) &&
{onResolveComment(comment);}}>
} {(displayMode === 'markup' && !wsProps?.Objects && !isViewer) &&
{openActionComment(true);}}> @@ -822,43 +822,43 @@ const CommentList = inject("storeComments", "storeAppOptions", "storeReview")(ob {comment.quote &&
{sliceQuote(comment.quote)}
} 
{pickLink(comment.comment)}
{comment.replies.length > 0 && -
    - {comment.replies.map((reply, indexReply) => { - return ( -
  • -
    -
    -
    -
    -
    - {isAndroid &&
    {reply.userInitials}
    } -
    -
    {reply.parsedName}
    -
    {reply.date}
    -
    -
    - {isEdit && !viewMode && reply.editable && !isViewer && -
    -
    {setReply(reply); openActionReply(true);}} - > - +
      + {comment.replies.map((reply, indexReply) => { + return ( +
    • +
      +
      +
      +
      +
      + {isAndroid &&
      {reply.userInitials}
      } +
      +
      {reply.parsedName}
      +
      {reply.date}
      - } -
      -
      - 
      {pickLink(reply.reply)}
      + {isEdit && !viewMode && reply.editable && !isViewer && +
      +
      {setReply(reply); openActionReply(true);}} + > + +
      +
      + } +
      +
      + 
      {pickLink(reply.reply)}
      +
      -
    -
    • - ) - })} -
+ + ) + })} + }
From f11da151d72b4711aa56dbf48f417cae1d8e9234 Mon Sep 17 00:00:00 2001 From: SergeyEzhin Date: Wed, 24 Aug 2022 17:59:49 +0300 Subject: [PATCH 4/6] [DE mobile] Fix Bug 58673 --- apps/documenteditor/mobile/src/controller/Toolbar.jsx | 2 ++ apps/documenteditor/mobile/src/view/Toolbar.jsx | 6 ++++-- 2 files changed, 6 insertions(+), 2 deletions(-) diff --git a/apps/documenteditor/mobile/src/controller/Toolbar.jsx b/apps/documenteditor/mobile/src/controller/Toolbar.jsx index be71a2cdf..93e6a4dda 100644 --- a/apps/documenteditor/mobile/src/controller/Toolbar.jsx +++ b/apps/documenteditor/mobile/src/controller/Toolbar.jsx @@ -29,6 +29,7 @@ const ToolbarController = inject('storeAppOptions', 'users', 'storeReview', 'sto const showEditDocument = !appOptions.isEdit && appOptions.canEdit && appOptions.canRequestEditRights; const docInfo = props.storeDocumentInfo; + const docExt = docInfo.dataDoc ? docInfo.dataDoc.fileType : ''; const docTitle = docInfo.dataDoc ? docInfo.dataDoc.title : ''; useEffect(() => { @@ -154,6 +155,7 @@ const ToolbarController = inject('storeAppOptions', 'users', 'storeReview', 'sto closeOptions={props.closeOptions} isEdit={appOptions.isEdit} docTitle={docTitle} + docExt={docExt} isShowBack={isShowBack} onBack={onBack} isCanUndo={isCanUndo} diff --git a/apps/documenteditor/mobile/src/view/Toolbar.jsx b/apps/documenteditor/mobile/src/view/Toolbar.jsx index 3d6916ec3..c36c0cef1 100644 --- a/apps/documenteditor/mobile/src/view/Toolbar.jsx +++ b/apps/documenteditor/mobile/src/view/Toolbar.jsx @@ -7,6 +7,8 @@ import EditorUIController from '../lib/patch'; const ToolbarView = props => { const { t } = useTranslation(); const isDisconnected = props.isDisconnected; + const docExt = props.docExt; + const isAvailableExt = docExt && docExt !== 'djvu' && docExt !== 'pdf' && docExt !== 'xps'; const disableEditBtn = props.isObjectLocked || props.stateDisplayMode || props.disabledEditControls || isDisconnected; const isViewer = props.isViewer; const isMobileView = props.isMobileView; @@ -54,12 +56,12 @@ const ToolbarView = props => { {(props.showEditDocument && !isViewer) && } - {props.isEdit && !isViewer && EditorUIController.getToolbarOptions && EditorUIController.getToolbarOptions({ + {props.isEdit && isAvailableExt && !isViewer && EditorUIController.getToolbarOptions && EditorUIController.getToolbarOptions({ disabled: disableEditBtn || props.disabledControls, onEditClick: e => props.openOptions('edit'), onAddClick: e => props.openOptions('add') })} - {isViewer && props.turnOffViewerMode()}>} + {isViewer && isAvailableExt && props.turnOffViewerMode()}>} {Device.phone ? null : } {props.displayCollaboration && window.matchMedia("(min-width: 360px)").matches ? props.openOptions('coauth')}> : null} props.openOptions('settings')}> From 1c0465e27d6947074c8b548aa0558aa9ce9934b3 Mon Sep 17 00:00:00 2001 From: SergeyEzhin Date: Thu, 25 Aug 2022 16:17:10 +0300 Subject: [PATCH 5/6] [DE mobile] Fix Bug 58657 --- .../mobile/src/less/app-ios.less | 31 +++++++++++++++++ .../mobile/src/less/app-material.less | 33 ++++++++----------- apps/documenteditor/mobile/src/less/app.less | 16 +++++++++ apps/documenteditor/mobile/src/page/main.jsx | 6 +--- 4 files changed, 62 insertions(+), 24 deletions(-) diff --git a/apps/documenteditor/mobile/src/less/app-ios.less b/apps/documenteditor/mobile/src/less/app-ios.less index 3646f7c25..a2a201667 100644 --- a/apps/documenteditor/mobile/src/less/app-ios.less +++ b/apps/documenteditor/mobile/src/less/app-ios.less @@ -57,5 +57,36 @@ .back-reader-mode { margin-left: 10px; } + + // Snackbar + .snackbar { + max-width: 195px; + max-height: 48px; + position: absolute; + bottom: 24px; + left: calc(50% - 195px / 2); + background: rgba(0, 0, 0, .9); + border-radius: 4px; + z-index: 1000000; + &__content { + padding: 15px 16.5px; + } + &__text { + margin: 0; + font-style: normal; + font-weight: 400; + font-size: 13px; + line-height: 18px; + letter-spacing: -0.078px; + color: @fill-white; + text-align: center; + } + } + + @media(max-width: 450px) { + .snackbar { + bottom: 50px; + } + } } diff --git a/apps/documenteditor/mobile/src/less/app-material.less b/apps/documenteditor/mobile/src/less/app-material.less index 417487ff0..da45b41bd 100644 --- a/apps/documenteditor/mobile/src/less/app-material.less +++ b/apps/documenteditor/mobile/src/less/app-material.less @@ -110,9 +110,8 @@ .snackbar { position: absolute; width: 344px; - max-width: 344px; - height: 48px; - left: 8px; + max-height: 48px; + left: calc(50% - 344px / 2); bottom: 16px; background: #333333; border-radius: 4px; @@ -128,24 +127,20 @@ font-size: 14px; line-height: 20px; letter-spacing: 0.25px; + text-align: center; } } - .snackbar-enter { - opacity: 0; - } - - .snackbar-enter-active { - opacity: 1; - transition: opacity 200ms; - } - - .snackbar-exit { - opacity: 1; - } - - .snackbar-exit-active { - opacity: 0; - transition: opacity 200ms; + @media(max-width: 450px) { + .snackbar { + width: auto; + max-width: 100%; + left: 16px; + right: 16px; + bottom: 8px; + &__text { + text-align: left; + } + } } } \ No newline at end of file diff --git a/apps/documenteditor/mobile/src/less/app.less b/apps/documenteditor/mobile/src/less/app.less index d7e78e983..4158cf180 100644 --- a/apps/documenteditor/mobile/src/less/app.less +++ b/apps/documenteditor/mobile/src/less/app.less @@ -328,3 +328,19 @@ } } +// Snackbar animation +.snackbar-enter { + opacity: 0; +} +.snackbar-enter-active { + opacity: 1; + transition: opacity 300ms; +} +.snackbar-exit { + opacity: 1; +} +.snackbar-exit-active { + opacity: 0; + transition: opacity 300ms; +} + diff --git a/apps/documenteditor/mobile/src/page/main.jsx b/apps/documenteditor/mobile/src/page/main.jsx index cd948f8df..6f4c36713 100644 --- a/apps/documenteditor/mobile/src/page/main.jsx +++ b/apps/documenteditor/mobile/src/page/main.jsx @@ -189,11 +189,7 @@ class MainPage extends Component { { Date: Thu, 25 Aug 2022 18:28:40 +0300 Subject: [PATCH 6/6] [DE mobile] Fix Bug 58668 --- apps/documenteditor/mobile/src/view/Toolbar.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/documenteditor/mobile/src/view/Toolbar.jsx b/apps/documenteditor/mobile/src/view/Toolbar.jsx index c36c0cef1..fc5a4dc29 100644 --- a/apps/documenteditor/mobile/src/view/Toolbar.jsx +++ b/apps/documenteditor/mobile/src/view/Toolbar.jsx @@ -46,7 +46,7 @@ const ToolbarView = props => { onUndoClick: props.onUndo, onRedoClick: props.onRedo })} - {(isViewer || !Device.phone) && { + {(isViewer || !Device.phone) && isAvailableExt && { props.changeMobileView(); props.openOptions('snackbar'); setTimeout(() => {