From df81b70d06d42733575c4e1a528dc5fb0211e8ff Mon Sep 17 00:00:00 2001 From: SergeyEzhin Date: Fri, 19 Feb 2021 21:09:38 +0300 Subject: [PATCH] [SSE mobile] Corrected Spreadsheet Settings, added Download, Print --- apps/spreadsheeteditor/mobile/locale/en.json | 16 +- .../src/controller/settings/Download.jsx | 168 ++++++++++++++++++ .../settings/SpreadsheetSettings.jsx | 9 +- .../mobile/src/view/settings/Download.jsx | 40 +++++ .../mobile/src/view/settings/Settings.jsx | 45 ++++- .../src/view/settings/SpreadsheetSettings.jsx | 17 +- 6 files changed, 277 insertions(+), 18 deletions(-) create mode 100644 apps/spreadsheeteditor/mobile/src/controller/settings/Download.jsx create mode 100644 apps/spreadsheeteditor/mobile/src/view/settings/Download.jsx diff --git a/apps/spreadsheeteditor/mobile/locale/en.json b/apps/spreadsheeteditor/mobile/locale/en.json index 266f24b3e..beffa0415 100644 --- a/apps/spreadsheeteditor/mobile/locale/en.json +++ b/apps/spreadsheeteditor/mobile/locale/en.json @@ -242,7 +242,21 @@ "textTop": "Top", "textRight": "Right", "textCustomSize": "Custom Size", - "textSpreadsheetFormats": "Spreadsheet Formats" + "textSpreadsheetFormats": "Spreadsheet Formats", + "textDownloadAs": "Download As", + "warnDownloadAs": "If you continue saving in this format all features except the text will be lost.
Are you sure you want to continue?", + "notcriticalErrorTitle": "Warning", + "txtEncoding": "Encoding", + "txtDelimiter": "Delimiter", + "txtSpace": "Space", + "txtTab": "Tab", + "advCSVOptions": "Choose CSV Options", + "advDRMOptions": "Protected File", + "advDRMEnterPassword": "You password please:", + "advDRMPassword": "Password", + "closeButtonText": "Close File", + "txtProtected": "Once you enter the password and open the file, the current password to the file will be reset", + "textCancel": "Cancel" } }, "Common": { diff --git a/apps/spreadsheeteditor/mobile/src/controller/settings/Download.jsx b/apps/spreadsheeteditor/mobile/src/controller/settings/Download.jsx new file mode 100644 index 000000000..2ee98c31d --- /dev/null +++ b/apps/spreadsheeteditor/mobile/src/controller/settings/Download.jsx @@ -0,0 +1,168 @@ +import React, { Component } from "react"; +import Download from "../../view/settings/Download"; +import { Device } from '../../../../../common/mobile/utils/device'; +import { withTranslation, useTranslation } from 'react-i18next'; +import { f7 } from 'framework7-react'; + +class DownloadController extends Component { + constructor(props) { + super(props); + this.onSaveFormat = this.onSaveFormat.bind(this); + } + + closeModal() { + if (Device.phone) { + f7.sheet.close('.settings-popup', true); + } else { + f7.popover.close('#settings-popover'); + } + } + + onSaveFormat(format) { + const api = Common.EditorApi.get(); + const { t } = this.props; + const _t = t("View.Settings", {returnObjects: true}); + + this.closeModal(); + + if (format) { + if (format == Asc.c_oAscFileType.CSV) { + f7.dialog.confirm( + _t.warnDownloadAs, + _t.notcriticalErrorTitle, + function () { + onAdvancedOptions(Asc.c_oAscAdvancedOptionsID.CSV, api.asc_getAdvancedOptions(), 2, new Asc.asc_CDownloadOptions(format), _t) + } + ) + } else { + api.asc_DownloadAs(new Asc.asc_CDownloadOptions(format)); + } + } + } + + render() { + return ( + + ); + } +} + +const DownloadWithTranslation = withTranslation()(DownloadController); + +const onAdvancedOptions = (type, advOptions, mode, formatOptions, _t, canRequestClose) => { + const api = Common.EditorApi.get(); + + if (type == Asc.c_oAscAdvancedOptionsID.CSV) { + let picker; + const pages = []; + const pagesName = []; + + for (let page of advOptions.asc_getCodePages()) { + pages.push(page.asc_getCodePage()); + pagesName.push(page.asc_getCodePageName()); + } + + // me.onLongActionEnd(Asc.c_oAscAsyncActionType.BlockInteraction, LoadingDocument); + + const buttons = []; + + if (mode === 2) { + buttons.push({ + text: _t.textCancel + }); + } + + buttons.push({ + text: 'OK', + bold: true, + onClick: function() { + let encoding = picker.cols[0].value, + delimiter = picker.cols[1].value; + + if (mode == 2) { + formatOptions && formatOptions.asc_setAdvancedOptions(new Asc.asc_CTextOptions(encoding, delimiter)); + api.asc_DownloadAs(formatOptions); + } else { + api.asc_setAdvancedOptions(type, new Asc.asc_CTextOptions(encoding, delimiter)); + } + + //if (!me._isDocReady) { + //me.onLongActionBegin(Asc.c_oAscAsyncActionType['BlockInteraction'], LoadingDocument); + //} + } + }); + + const dialog = f7.dialog.create({ + title: _t.advCSVOptions, + text: '', + content: + '
' + + '
' + + '
' + _t.txtEncoding + '
' + + '
' + _t.txtDelimiter + '
' + + '
' + + '
' + + '
', + buttons: buttons + }).open(); + + const recommendedSettings = advOptions.asc_getRecommendedSettings(); + + dialog.on('opened', () => { + picker = f7.picker.create({ + containerEl: document.getElementById('txt-encoding'), + cols: [{ + textAlign: 'left', + values: pages, + displayValues: pagesName + },{ + textAlign: 'right', + width: 120, + values: [4, 2, 3, 1, 5], + displayValues: [',', ';', ':', _t.txtTab, _t.txtSpace] + }], + toolbar: false, + rotateEffect: true, + value: [ + recommendedSettings && recommendedSettings.asc_getCodePage(), + (recommendedSettings && recommendedSettings.asc_getDelimiter()) ? recommendedSettings.asc_getDelimiter() : 4 + ], + }); + }); + + } else if (type == Asc.c_oAscAdvancedOptionsID.DRM) { + //me.onLongActionEnd(Asc.c_oAscAsyncActionType.BlockInteraction, LoadingDocument); + const buttons = [{ + text: 'OK', + bold: true, + onClick: function () { + const password = document.getElementById('modal-password').value; + api.asc_setAdvancedOptions(type, new Asc.asc_CDRMAdvancedOptions(password)); + //if (!me._isDocReady) { + //me.onLongActionBegin(Asc.c_oAscAsyncActionType['BlockInteraction'], LoadingDocument); + //} + } + }]; + + if (canRequestClose) + buttons.push({ + text: _t.closeButtonText, + onClick: function () { + Common.Gateway.requestClose(); + } + }); + + f7.dialog.create({ + title: _t.advDRMOptions, + text: _t.txtProtected, + content: + '
', + buttons: buttons + }).open(); + } +}; + +export { + DownloadWithTranslation, + onAdvancedOptions +} \ No newline at end of file diff --git a/apps/spreadsheeteditor/mobile/src/controller/settings/SpreadsheetSettings.jsx b/apps/spreadsheeteditor/mobile/src/controller/settings/SpreadsheetSettings.jsx index 3ac59f0d2..b1030ab10 100644 --- a/apps/spreadsheeteditor/mobile/src/controller/settings/SpreadsheetSettings.jsx +++ b/apps/spreadsheeteditor/mobile/src/controller/settings/SpreadsheetSettings.jsx @@ -35,10 +35,10 @@ class SpreadsheetSettingsController extends Component { this.localMarginProps = props.asc_getPageMargins(); - let left = parseFloat(Common.Utils.Metric.fnRecalcFromMM(this.localMarginProps.asc_getLeft()).toFixed(2)), - top = parseFloat(Common.Utils.Metric.fnRecalcFromMM(this.localMarginProps.asc_getTop()).toFixed(2)), - right = parseFloat(Common.Utils.Metric.fnRecalcFromMM(this.localMarginProps.asc_getRight()).toFixed(2)), - bottom = parseFloat(Common.Utils.Metric.fnRecalcFromMM(this.localMarginProps.asc_getBottom()).toFixed(2)); + let left = this.localMarginProps.asc_getLeft(), + top = this.localMarginProps.asc_getTop(), + right = this.localMarginProps.asc_getRight(), + bottom = this.localMarginProps.asc_getBottom(); return {left, top, right, bottom}; } @@ -60,7 +60,6 @@ class SpreadsheetSettingsController extends Component { } api.asc_changePageMargins(changeProps.asc_getLeft(), changeProps.asc_getRight(), changeProps.asc_getTop(), changeProps.asc_getBottom(), api.asc_getActiveWorksheetIndex()); - // this.initSpreadsheetMargins(); } onOrientationChange(value) { diff --git a/apps/spreadsheeteditor/mobile/src/view/settings/Download.jsx b/apps/spreadsheeteditor/mobile/src/view/settings/Download.jsx new file mode 100644 index 000000000..19e114966 --- /dev/null +++ b/apps/spreadsheeteditor/mobile/src/view/settings/Download.jsx @@ -0,0 +1,40 @@ +import React from 'react'; +import { Page, Navbar, List, ListItem, BlockTitle, Icon } from "framework7-react"; +import { useTranslation } from "react-i18next"; + +const Download = props => { + const { t } = useTranslation(); + const _t = t("View.Settings", { returnObjects: true }); + + return ( + + + {_t.textDownloadAs} + + props.onSaveFormat(Asc.c_oAscFileType.XLSX)}> + + + props.onSaveFormat(Asc.c_oAscFileType.PDF)}> + + + props.onSaveFormat(Asc.c_oAscFileType.PDFA)}> + + + props.onSaveFormat(Asc.c_oAscFileType.ODS)}> + + + props.onSaveFormat(Asc.c_oAscFileType.CSV)}> + + + props.onSaveFormat(Asc.c_oAscFileType.XLTX)}> + + + props.onSaveFormat(Asc.c_oAscFileType.OTS)}> + + + + + ) +} + +export default Download; \ No newline at end of file diff --git a/apps/spreadsheeteditor/mobile/src/view/settings/Settings.jsx b/apps/spreadsheeteditor/mobile/src/view/settings/Settings.jsx index d0940cae1..7b25b93cf 100644 --- a/apps/spreadsheeteditor/mobile/src/view/settings/Settings.jsx +++ b/apps/spreadsheeteditor/mobile/src/view/settings/Settings.jsx @@ -4,6 +4,7 @@ import { withTranslation } from 'react-i18next'; import {f7} from 'framework7-react'; import {Device} from '../../../../../common/mobile/utils/device'; import SpreadsheetSettingsController from '../../controller/settings/SpreadsheetSettings.jsx'; +import {DownloadWithTranslation} from '../../controller/settings/Download.jsx'; import {SpreadsheetColorSchemes, SpreadsheetFormats, SpreadsheetMargins} from './SpreadsheetSettings.jsx'; const routes = [ @@ -26,6 +27,10 @@ const routes = [ { path: '/margins/', component: SpreadsheetMargins + }, + { + path: '/download/', + component: DownloadWithTranslation } ]; @@ -42,6 +47,40 @@ const SettingsList = withTranslation()(props => { props.onOptionClick(page) }; + const closeModal = () => { + if (Device.phone) { + f7.sheet.close('.settings-popup', true); + } else { + f7.popover.close('#settings-popover'); + } + }; + + const onPrint = () => { + closeModal(); + const api = Common.EditorApi.get(); + api.asc_Print(); + }; + + const showHelp = () => { + // let url = '{{HELP_URL}}'; + let url = 'https://helpcenter.onlyoffice.com'; + + if (url.charAt(url.length-1) !== '/') { + url += '/'; + } + + if (Device.sailfish || Device.android) { + url+='mobile-applications/documents/mobile-web-editors/android/index.aspx'; + } + else { + url+='mobile-applications/documents/mobile-web-editors/ios/index.aspx'; + } + + closeModal(); + window.open(url, "_blank"); + }; + + return ( @@ -58,16 +97,16 @@ const SettingsList = withTranslation()(props => { - + - + - + diff --git a/apps/spreadsheeteditor/mobile/src/view/settings/SpreadsheetSettings.jsx b/apps/spreadsheeteditor/mobile/src/view/settings/SpreadsheetSettings.jsx index 461b37081..a39e95f2b 100644 --- a/apps/spreadsheeteditor/mobile/src/view/settings/SpreadsheetSettings.jsx +++ b/apps/spreadsheeteditor/mobile/src/view/settings/SpreadsheetSettings.jsx @@ -85,7 +85,6 @@ const PageSpreadsheetMargins = props => { const _t = t('View.Settings', {returnObjects: true}); const metricText = Common.Utils.Metric.getMetricName(Common.Utils.Metric.getCurrentMetric()); const margins = props.initSpreadsheetMargins(); - console.log(margins); const [stateTop, setTop] = useState(margins.top); const [stateBottom, setBottom] = useState(margins.bottom); @@ -128,13 +127,13 @@ const PageSpreadsheetMargins = props => { - {!isAndroid &&
{parseFloat(stateTop.toFixed(2)) + ' ' + metricText}
} + {!isAndroid &&
{parseFloat(Common.Utils.Metric.fnRecalcFromMM(stateTop).toFixed(2)) + ' ' + metricText}
}
- {isAndroid && } + {isAndroid && } @@ -142,13 +141,13 @@ const PageSpreadsheetMargins = props => {
- {!isAndroid &&
{parseFloat(stateBottom.toFixed(2)) + ' ' + metricText}
} + {!isAndroid &&
{parseFloat(Common.Utils.Metric.fnRecalcFromMM(stateBottom).toFixed(2)) + ' ' + metricText}
}
- {isAndroid && } + {isAndroid && } @@ -156,13 +155,13 @@ const PageSpreadsheetMargins = props => {
- {!isAndroid &&
{parseFloat(stateLeft.toFixed(2)) + ' ' + metricText}
} + {!isAndroid &&
{parseFloat(Common.Utils.Metric.fnRecalcFromMM(stateLeft).toFixed(2)) + ' ' + metricText}
}
- {isAndroid && } + {isAndroid && } @@ -170,13 +169,13 @@ const PageSpreadsheetMargins = props => {
- {!isAndroid &&
{parseFloat(stateRight.toFixed(2)) + ' ' + metricText}
} + {!isAndroid &&
{parseFloat(Common.Utils.Metric.fnRecalcFromMM(stateRight).toFixed(2)) + ' ' + metricText}
}
- {isAndroid && } + {isAndroid && }