From 0a36021498362784d846600c2d765a82dcf33a07 Mon Sep 17 00:00:00 2001 From: SergeyEzhin Date: Fri, 26 Feb 2021 21:06:07 +0300 Subject: [PATCH] [PE mobile] Corrected Link Settings and Presentation Settings --- .../mobile/src/controller/edit/EditLink.jsx | 68 ++++++++++- .../settings/PresentationSettings.jsx | 11 +- .../mobile/src/store/linkSettings.js | 64 ---------- .../mobile/src/store/presentationSettings.js | 20 ++-- .../mobile/src/view/edit/EditLink.jsx | 111 +++++++++--------- .../view/settings/PresentationSettings.jsx | 12 +- 6 files changed, 147 insertions(+), 139 deletions(-) diff --git a/apps/presentationeditor/mobile/src/controller/edit/EditLink.jsx b/apps/presentationeditor/mobile/src/controller/edit/EditLink.jsx index 953e0f2f4..6139aca40 100644 --- a/apps/presentationeditor/mobile/src/controller/edit/EditLink.jsx +++ b/apps/presentationeditor/mobile/src/controller/edit/EditLink.jsx @@ -9,8 +9,14 @@ import { EditLink } from '../../view/edit/EditLink'; class EditLinkController extends Component { constructor (props) { super(props); + + const api = Common.EditorApi.get(); + this.onEditLink = this.onEditLink.bind(this); this.onRemoveLink = this.onRemoveLink.bind(this); + this.initLink = this.initLink.bind(this); + this.slidesCount = api.getCountPages(); + this.initLink(); } closeModal () { @@ -21,6 +27,58 @@ class EditLinkController extends Component { } } + initLink() { + const api = Common.EditorApi.get(); + const linkObject = this.props.storeFocusObjects.linkObject; + const url = linkObject.get_Value(); + const tooltip = linkObject.get_ToolTip(); + const display = linkObject.get_Text(); + + this.url = url; + this.tooltip = tooltip; + this.display = display; + this.slideLink = 0; + this.slideNum = 0; + + let indAction; + let slidesCount; + let slideNum; + + if(url === null || url === undefined || url === '') { + this.typeLink = 1; + } + else { + indAction = url.indexOf("ppaction://hlink"); + if(0 == indAction) { + if (url == "ppaction://hlinkshowjump?jump=firstslide") { + this.slideLink = 2; + } else if (url == "ppaction://hlinkshowjump?jump=lastslide") { + this.slideLink = 3; + } + else if (url == "ppaction://hlinkshowjump?jump=nextslide") { + this.slideLink = 0; + } + else if (url == "ppaction://hlinkshowjump?jump=previousslide") { + this.slideLink = 1; + } + else { + this.slideLink = 4; + slidesCount = api.getCountPages(); + let mask = "ppaction://hlinksldjumpslide", + indSlide = url.indexOf(mask); + if (0 == indSlide) { + slideNum = parseInt(url.substring(mask.length)); + if (slideNum < 0) this.slideNum = 0; + if (slideNum >= slidesCount) this.slideNum = slidesCount - 1; + } else this.slideNum = 0; + } + this.typeLink = 0 + } else { + this.typeLink = 1; + } + } + } + onEditLink(type, linkInfo) { const api = Common.EditorApi.get(); const { t } = this.props; @@ -102,13 +160,21 @@ class EditLinkController extends Component { render () { return ( ) } } -const EditLinkWithTranslation = withTranslation()(EditLinkController); +const EditLinkWithTranslation = inject("storeFocusObjects")(observer(withTranslation()(EditLinkController))); export {EditLinkWithTranslation as EditLinkController}; \ No newline at end of file diff --git a/apps/presentationeditor/mobile/src/controller/settings/PresentationSettings.jsx b/apps/presentationeditor/mobile/src/controller/settings/PresentationSettings.jsx index 1a1099035..184fec041 100644 --- a/apps/presentationeditor/mobile/src/controller/settings/PresentationSettings.jsx +++ b/apps/presentationeditor/mobile/src/controller/settings/PresentationSettings.jsx @@ -6,6 +6,7 @@ class PresentationSettingsController extends Component { constructor(props) { super(props); this.initSlideSize = this.initSlideSize.bind(this); + this.onSlideSize = this.onSlideSize.bind(this); } initSlideSize() { @@ -18,7 +19,15 @@ class PresentationSettingsController extends Component { onSlideSize(slideSizeArr) { const api = Common.EditorApi.get(); - api.changeSlideSize(slideSizeArr[0], slideSizeArr[1]); + + let ratio = slideSizeArr[1] / slideSizeArr[0]; + let currentHeight = this.props.storePresentationSettings.currentPageSize.height; + let currentPageSize = { + width: (currentHeight || slideSizeArr[1]) / ratio, + height: currentHeight + }; + // api.changeSlideSize(slideSizeArr[0], slideSizeArr[1], slideSizeArr[2]); + api.changeSlideSize(currentPageSize.width, currentPageSize.height, slideSizeArr[2]); } // Color Schemes diff --git a/apps/presentationeditor/mobile/src/store/linkSettings.js b/apps/presentationeditor/mobile/src/store/linkSettings.js index a6d935ad7..2eabdba1e 100644 --- a/apps/presentationeditor/mobile/src/store/linkSettings.js +++ b/apps/presentationeditor/mobile/src/store/linkSettings.js @@ -5,68 +5,4 @@ export class storeLinkSettings { @action canAddHyperlink (value) { this.canAddLink = value; } - - @observable typeLink; - @action changeLinkType(value) { - this.typeLink = value; - } - - @observable slideLink; - @action changeSlideLink(value) { - this.slideLink = value; - } - - @observable slideNum; - @action changeSlideNum(value) { - this.slideNum = value; - } - - @observable slideName; - @action changeSlideName(value) { - this.slideName = value; - } - - initCategory(linkObject) { - const url = linkObject.get_Value(); - const api = Common.EditorApi.get(); - - let indAction; - let slidesCount; - let slideNum; - - if(url === null || url === undefined || url === '') { - this.changeLinkType(1); - } - else { - indAction = url.indexOf("ppaction://hlink"); - if(0 == indAction) { - if (url == "ppaction://hlinkshowjump?jump=firstslide") { - this.changeSlideLink(2); - } else if (url == "ppaction://hlinkshowjump?jump=lastslide") { - this.changeSlideLink(3); - } - else if (url == "ppaction://hlinkshowjump?jump=nextslide") { - this.changeSlideLink(0); - } - else if (url == "ppaction://hlinkshowjump?jump=previousslide") { - this.changeSlideLink(1); - } - else { - this.changeSlideLink(4); - slidesCount = api.getCountPages(); - let mask = "ppaction://hlinksldjumpslide", - indSlide = url.indexOf(mask); - if (0 == indSlide) { - slideNum = parseInt(url.substring(mask.length)); - if (slideNum < 0) this.changeSlideNum(0); - if (slideNum >= slidesCount) this.changeSlideNum(slidesCount - 1); - } else this.changeSlideNum(0); - } - this.changeLinkType(0); - } else { - this.changeLinkType(1); - } - } - } - } diff --git a/apps/presentationeditor/mobile/src/store/presentationSettings.js b/apps/presentationeditor/mobile/src/store/presentationSettings.js index 6ae95de51..566af4936 100644 --- a/apps/presentationeditor/mobile/src/store/presentationSettings.js +++ b/apps/presentationeditor/mobile/src/store/presentationSettings.js @@ -1,19 +1,23 @@ import {action, observable} from 'mobx'; export class storePresentationSettings { - slideSize = [[254, 190.5], [254, 143]]; + @observable slideSizes = [ + [9144000, 6858000, Asc.c_oAscSlideSZType.SzScreen4x3], + [12192000, 6858000, Asc.c_oAscSlideSZType.SzCustom] + ]; + + @observable currentPageSize; @observable slideSizeIndex; - get getSlideSizes() { - return this.slideSize; - } - @action changeSizeIndex(width, height) { - this.slideSize.forEach((array, index) => { - if(Math.abs(array[0] - width) < 0.001 && Math.abs((array[1] - height)) < 0.001) { + this.currentPageSize = {width, height}; + let ratio = height / width; + + this.slideSizes.forEach((array, index) => { + if(Math.abs(array[1] / array[0] - ratio) < 0.001) { this.slideSizeIndex = index; } - }) + }); } // Color Schemes diff --git a/apps/presentationeditor/mobile/src/view/edit/EditLink.jsx b/apps/presentationeditor/mobile/src/view/edit/EditLink.jsx index 95edad25e..e7e0b80e9 100644 --- a/apps/presentationeditor/mobile/src/view/edit/EditLink.jsx +++ b/apps/presentationeditor/mobile/src/view/edit/EditLink.jsx @@ -7,15 +7,14 @@ import {Device} from "../../../../../common/mobile/utils/device"; const PageTypeLink = props => { const { t } = useTranslation(); const _t = t('View.Edit', {returnObjects: true}); - const storeLinkSettings = props.storeLinkSettings; - const typeLink = storeLinkSettings.typeLink; + const [typeLink, setTypeLink] = useState(props.curType); return ( - {storeLinkSettings.changeLinkType(1);}}> - {storeLinkSettings.changeLinkType(0);}}> + {setTypeLink(1); props.changeType(1); props.initLink();}}> + {setTypeLink(0); props.changeType(0); props.initLink();}}> ) @@ -25,23 +24,18 @@ const PageLinkTo = props => { const isAndroid = Device.android; const { t } = useTranslation(); const _t = t('View.Edit', {returnObjects: true}); - const api = Common.EditorApi.get(); - const slidesCount = api.getCountPages(); - const storeLinkSettings = props.storeLinkSettings; - const slideLink = storeLinkSettings.slideLink; - // console.log(slideLink); - // const slideNum = storeLinkSettings.slideNum; - // const [stateTypeTo, setTypeTo] = useState(props.curTo); + const slidesCount = props.slidesCount; + const [stateTypeTo, setTypeTo] = useState(props.curTo); const changeTypeTo = (type) => { - storeLinkSettings.changeSlideLink(type); + setTypeTo(type); props.changeTo(type); }; const [stateNumberTo, setNumberTo] = useState(0); const changeNumber = (curNumber, isDecrement) => { - storeLinkSettings.changeSlideLink(4); + setTypeTo(4); let value; if (isDecrement) { @@ -51,7 +45,6 @@ const PageLinkTo = props => { } setNumberTo(value); - storeLinkSettings.changeSlideNum(value); props.changeTo(4, value); }; @@ -59,10 +52,10 @@ const PageLinkTo = props => { - {changeTypeTo(0)}}> - {changeTypeTo(1)}}> - {changeTypeTo(2)}}> - {changeTypeTo(3)}}> + {changeTypeTo(0)}}> + {changeTypeTo(1)}}> + {changeTypeTo(2)}}> + {changeTypeTo(3)}}> {!isAndroid &&
{stateNumberTo + 1}
}
@@ -85,42 +78,44 @@ const PageLinkTo = props => { const PageLink = props => { const { t } = useTranslation(); const _t = t('View.Edit', {returnObjects: true}); - const storeFocusObjects = props.storeFocusObjects; - const storeLinkSettings = props.storeLinkSettings; - const linkObject = storeFocusObjects.linkObject; - - useEffect(() => { - storeLinkSettings.initCategory(linkObject); - }, [linkObject]); + const url = props.url; + const tooltip = props.tooltip; + const display = props.display; + const slideNum = props.slideNum; + const slideLink = props.slideLink; + const valueTypeLink = props.typeLink; - const url = linkObject.get_Value(); - const tooltip = linkObject.get_ToolTip(); - const display = linkObject.get_Text(); - const slideNum = storeLinkSettings.slideNum; - const slideLink = storeLinkSettings.slideLink; - const typeLink = storeLinkSettings.typeLink; - - if(typeLink === 1) { - storeLinkSettings.changeSlideName(_t.textNextSlide); - storeLinkSettings.changeSlideLink(0); - } + const typesDisplayTo = { + 0: `${_t.textNextSlide}`, + 1: `${_t.textPreviousSlide}`, + 2: `${_t.textFirstSlide}`, + 3: `${_t.textLastSlide}`, + 4: `${_t.textSlide} ${slideNum + 1}` + }; + const [typeLink, setTypeLink] = useState(valueTypeLink); const textType = typeLink === 1 ? _t.textExternalLink : _t.textSlideInThisPresentation; + + const changeType = (newType) => { + setTypeLink(newType); + }; + const [link, setLink] = useState(typeLink !== 0 ? url : ''); + const [linkTo, setLinkTo] = useState(slideLink); + const [displayTo, setDisplayTo] = useState(typesDisplayTo[slideLink]); + const [numberTo, setNumberTo] = useState(slideNum); - const changeTo = (slideLink, number) => { - switch (slideLink) { - case 0 : storeLinkSettings.changeSlideName(_t.textNextSlide); break; - case 1 : storeLinkSettings.changeSlideName(_t.textPreviousSlide); break; - case 2 : storeLinkSettings.changeSlideName(_t.textFirstSlide); break; - case 3 : storeLinkSettings.changeSlideName(_t.textLastSlide); break; - case 4 : storeLinkSettings.changeSlideName(`${_t.textSlide} ${number + 1}`); storeLinkSettings.changeSlideNum(number); + const changeTo = (type, number) => { + setLinkTo(type); + switch (type) { + case 0 : setDisplayTo(_t.textNextSlide); break; + case 1 : setDisplayTo(_t.textPreviousSlide); break; + case 2 : setDisplayTo(_t.textFirstSlide); break; + case 3 : setDisplayTo(_t.textLastSlide); break; + case 4 : setDisplayTo(`${_t.textSlide} ${number + 1}`); setNumberTo(number); break; } - } + }; - changeTo(slideLink, slideNum); - - const slideName = storeLinkSettings.slideName; const [screenTip, setScreenTip] = useState(tooltip); const displayDisabled = display !== false && display === null; const [stateDisplay, setDisplay] = useState(display !== false ? ((display !== null) ? display : _t.textDefault) : ""); @@ -130,7 +125,9 @@ const PageLink = props => { {typeLink !== 0 ? { value={link} onChange={(event) => {setLink(event.target.value)}} /> : - } { onClick={() => { props.onEditLink(typeLink, (typeLink === 1 ? {url: link, display: stateDisplay, tip: screenTip, displayDisabled: displayDisabled } : - {linkTo: slideLink, numberTo: slideNum, display: stateDisplay, tip: screenTip, displayDisabled: displayDisabled})); + {linkTo: linkTo, numberTo: numberTo, display: stateDisplay, tip: screenTip, displayDisabled: displayDisabled})); }} /> { ) }; -const EditLink = inject("storeFocusObjects", "storeLinkSettings")(observer(PageLink)); -const LinkTo = inject("storeFocusObjects", "storeLinkSettings")(observer(PageLinkTo)); -const TypeLink = inject("storeFocusObjects", "storeLinkSettings")(observer(PageTypeLink)); - -export {EditLink, - LinkTo as PageLinkTo, - TypeLink as PageTypeLink} \ No newline at end of file +export {PageLink as EditLink, + PageLinkTo, + PageTypeLink} \ No newline at end of file diff --git a/apps/presentationeditor/mobile/src/view/settings/PresentationSettings.jsx b/apps/presentationeditor/mobile/src/view/settings/PresentationSettings.jsx index e6da2e822..7288657df 100644 --- a/apps/presentationeditor/mobile/src/view/settings/PresentationSettings.jsx +++ b/apps/presentationeditor/mobile/src/view/settings/PresentationSettings.jsx @@ -7,14 +7,13 @@ const PagePresentationSettings = props => { const { t } = useTranslation(); const _t = t("View.Settings", { returnObjects: true }); props.initSlideSize(); - const store = props.storePresentationSettings; - const slideSizeArr = store.getSlideSizes; - const slideSizeIndex = store.slideSizeIndex; + const storePresentationSettings = props.storePresentationSettings; + const slideSizeArr = storePresentationSettings.slideSizes; + const slideSizeIndex = storePresentationSettings.slideSizeIndex; return ( - {_t.textSlideSize} { props.onSlideSize(slideSizeArr[1])} title={_t.mniSlideWide}> - { const curScheme = props.initPageColorSchemes(); const [stateScheme, setScheme] = useState(curScheme); const _t = t('View.Settings', {returnObjects: true}); - const store = props.storePresentationSettings; - const allSchemes = store.allSchemes; + const storePresentationSettings = props.storePresentationSettings; + const allSchemes = storePresentationSettings.allSchemes; return (