[PE mobile] Added Help

apps/presentationeditor/mobile/src/less/app-ios.less

@@ -51,9 +51,13 @@
 
 .about .logo {
     margin-top: 20px;
+    background-position: center;
+    background-repeat: no-repeat;
+    background-size: contain;
     display: inline-block; 
     width: 100%;
     height: 55px;
+    .encoded-svg-background('<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 290 55"><defs><style>.cls-1,.cls-2,.cls-3{fill-rule:evenodd;}.cls-1{fill:url(#grad_173);}.cls-2{fill:url(#grad_168);}.cls-3{fill:url(#grad_91);}.cls-4{fill:#526484;}.cls-5{fill:#3a4968;}</style><linearGradient id="grad_173" x1="35" y1="63.54" x2="35" y2="24.24" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#d94315" stop-opacity="0.3"/><stop offset="0.88" stop-color="#d9420b"/></linearGradient><linearGradient id="grad_168" x1="35.03" y1="46.52" x2="35.03" y2="20.68" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#8bba24" stop-opacity="0.3"/><stop offset="0.66" stop-color="#8bba25"/></linearGradient><linearGradient id="grad_91" x1="35" y1="35.95" x2="35" y2="1.23" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#28a8e0" stop-opacity="0.3"/><stop offset="1" stop-color="#26a8de"/></linearGradient></defs><path class="cls-1" d="M31.36,53.32L7.5,42.58c-2-.9-2-2.38,0-3.28l8.36-3.77,15.49,7a10.15,10.15,0,0,0,7.28,0l15.49-7L62.5,39.3c2,0.9,2,2.38,0,3.28L38.64,53.32a10.14,10.14,0,0,1-7.28,0h0Z"/><path class="cls-2" d="M31.39,40.14L7.56,29.39c-2-.9-2-2.38,0-3.28l8.1-3.65,15.73,7.09a10.12,10.12,0,0,0,7.28,0L54.4,22.46l8.1,3.65c2,0.9,2,2.38,0,3.28L38.67,40.14a10.12,10.12,0,0,1-7.28,0h0Z"/><path class="cls-3" d="M31.36,27.19L7.5,16.58c-2-.89-2-2.35,0-3.24L31.36,2.74a10.27,10.27,0,0,1,7.28,0L62.5,13.34c2,0.89,2,2.35,0,3.24L38.64,27.19a10.26,10.26,0,0,1-7.28,0h0Z"/><path class="cls-4" d="M72.06,27.86q0-6.86,4-10.31a14.37,14.37,0,0,1,18.68,0q4,3.45,4,10.35t-4,10.31a14.37,14.37,0,0,1-18.68,0q-4-3.45-4-10.31v0h0Zm5.78,0q0,4.74,1.8,7a7.77,7.77,0,0,0,3.9,2.79q0.51,0.12,1,.17a7.12,7.12,0,0,0,.92.06,7.59,7.59,0,0,0,.94-0.06,5.83,5.83,0,0,0,1-.21,7.58,7.58,0,0,0,3.87-2.79Q93,32.56,93,27.89T91.2,21a7.58,7.58,0,0,0-3.87-2.79,5.83,5.83,0,0,0-1-.21,7.76,7.76,0,0,0-.94-0.06,7.27,7.27,0,0,0-.92.06q-0.45.06-1,.17A7.77,7.77,0,0,0,79.64,21q-1.8,2.22-1.8,6.92v0h0Z"/><polygon class="cls-4" points="102 15 109 15 119.89 35 120 35 120 15 125 15 125 41 118 41 107.13 20.96 107.01 20.96 107 41 102 41 102 15 102 15"/><polygon class="cls-4" points="130 15 135 15 135 37 147 37 147 41 130 41 130 15 130 15"/><polygon class="cls-4" points="148 15 155.47 25.98 155.59 25.98 163 15 168.5 15 158 31 158 41 153 41 153 31 142.5 15 148 15"/><path class="cls-5" d="M168,27.94q0-6.77,3.9-10.18a13.88,13.88,0,0,1,18.22,0Q194,21.17,194,28t-3.88,10.18a13.88,13.88,0,0,1-18.22,0Q168,34.75,168,28v0h0Zm5.63,0q0,4.68,1.75,6.87a7.57,7.57,0,0,0,3.81,2.76q0.49,0.11.93,0.17a6.85,6.85,0,0,0,.89.06,7.31,7.31,0,0,0,.91-0.06,5.6,5.6,0,0,0,1-.21,7.39,7.39,0,0,0,3.77-2.76q1.71-2.19,1.71-6.79t-1.71-6.79a7.39,7.39,0,0,0-3.77-2.76,5.61,5.61,0,0,0-1-.21,7.48,7.48,0,0,0-.91-0.06,7,7,0,0,0-.89.06q-0.44.06-.93,0.17a7.57,7.57,0,0,0-3.81,2.76q-1.75,2.19-1.75,6.83v0h0Z"/><polygon class="cls-5" points="197 15 212 15 212 19 202 19 202 26 211 26 211 30 202 30 202 41 197 41 197 15 197 15"/><polygon class="cls-5" points="216 15 231 15 231 19 221 19 221 26 230 26 230 30 221 30 221 41 216 41 216 15 216 15"/><polygon class="cls-5" points="234 41 234 15 239 15 239 41 234 41 234 41"/><path class="cls-5" d="M262,19.88a18.8,18.8,0,0,0-6.3-1c-7,0-8.28,5.64-8.28,9.13,0,2.54.84,9.19,7.67,9.19a17,17,0,0,0,6.57-1.24L262,40.42a42.48,42.48,0,0,1-7.46.81c-5.08,0-12.54-3.1-12.54-13.36,0-9.28,7-13,13-13a24.56,24.56,0,0,1,7,.8v4.25Z"/><polygon class="cls-5" points="266 15 282 15 282 19 271 19 271 26 281 26 281 30 271 30 271 37 282 37 282 41 266 41 266 15 266 15"/></svg>');
 }
 
 .about h3 {

apps/presentationeditor/mobile/src/less/app-material.less

@@ -70,9 +70,13 @@
 
 .about .logo {
     margin-top: 20px;
+    background-position: center;
+    background-repeat: no-repeat;
+    background-size: contain;
     display: inline-block; 
     width: 100%;
     height: 55px;
+    .encoded-svg-background('<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 290 55"><defs><style>.cls-1,.cls-2,.cls-3{fill-rule:evenodd;}.cls-1{fill:url(#grad_173);}.cls-2{fill:url(#grad_168);}.cls-3{fill:url(#grad_91);}.cls-4{fill:#526484;}.cls-5{fill:#3a4968;}</style><linearGradient id="grad_173" x1="35" y1="63.54" x2="35" y2="24.24" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#d94315" stop-opacity="0.3"/><stop offset="0.88" stop-color="#d9420b"/></linearGradient><linearGradient id="grad_168" x1="35.03" y1="46.52" x2="35.03" y2="20.68" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#8bba24" stop-opacity="0.3"/><stop offset="0.66" stop-color="#8bba25"/></linearGradient><linearGradient id="grad_91" x1="35" y1="35.95" x2="35" y2="1.23" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#28a8e0" stop-opacity="0.3"/><stop offset="1" stop-color="#26a8de"/></linearGradient></defs><path class="cls-1" d="M31.36,53.32L7.5,42.58c-2-.9-2-2.38,0-3.28l8.36-3.77,15.49,7a10.15,10.15,0,0,0,7.28,0l15.49-7L62.5,39.3c2,0.9,2,2.38,0,3.28L38.64,53.32a10.14,10.14,0,0,1-7.28,0h0Z"/><path class="cls-2" d="M31.39,40.14L7.56,29.39c-2-.9-2-2.38,0-3.28l8.1-3.65,15.73,7.09a10.12,10.12,0,0,0,7.28,0L54.4,22.46l8.1,3.65c2,0.9,2,2.38,0,3.28L38.67,40.14a10.12,10.12,0,0,1-7.28,0h0Z"/><path class="cls-3" d="M31.36,27.19L7.5,16.58c-2-.89-2-2.35,0-3.24L31.36,2.74a10.27,10.27,0,0,1,7.28,0L62.5,13.34c2,0.89,2,2.35,0,3.24L38.64,27.19a10.26,10.26,0,0,1-7.28,0h0Z"/><path class="cls-4" d="M72.06,27.86q0-6.86,4-10.31a14.37,14.37,0,0,1,18.68,0q4,3.45,4,10.35t-4,10.31a14.37,14.37,0,0,1-18.68,0q-4-3.45-4-10.31v0h0Zm5.78,0q0,4.74,1.8,7a7.77,7.77,0,0,0,3.9,2.79q0.51,0.12,1,.17a7.12,7.12,0,0,0,.92.06,7.59,7.59,0,0,0,.94-0.06,5.83,5.83,0,0,0,1-.21,7.58,7.58,0,0,0,3.87-2.79Q93,32.56,93,27.89T91.2,21a7.58,7.58,0,0,0-3.87-2.79,5.83,5.83,0,0,0-1-.21,7.76,7.76,0,0,0-.94-0.06,7.27,7.27,0,0,0-.92.06q-0.45.06-1,.17A7.77,7.77,0,0,0,79.64,21q-1.8,2.22-1.8,6.92v0h0Z"/><polygon class="cls-4" points="102 15 109 15 119.89 35 120 35 120 15 125 15 125 41 118 41 107.13 20.96 107.01 20.96 107 41 102 41 102 15 102 15"/><polygon class="cls-4" points="130 15 135 15 135 37 147 37 147 41 130 41 130 15 130 15"/><polygon class="cls-4" points="148 15 155.47 25.98 155.59 25.98 163 15 168.5 15 158 31 158 41 153 41 153 31 142.5 15 148 15"/><path class="cls-5" d="M168,27.94q0-6.77,3.9-10.18a13.88,13.88,0,0,1,18.22,0Q194,21.17,194,28t-3.88,10.18a13.88,13.88,0,0,1-18.22,0Q168,34.75,168,28v0h0Zm5.63,0q0,4.68,1.75,6.87a7.57,7.57,0,0,0,3.81,2.76q0.49,0.11.93,0.17a6.85,6.85,0,0,0,.89.06,7.31,7.31,0,0,0,.91-0.06,5.6,5.6,0,0,0,1-.21,7.39,7.39,0,0,0,3.77-2.76q1.71-2.19,1.71-6.79t-1.71-6.79a7.39,7.39,0,0,0-3.77-2.76,5.61,5.61,0,0,0-1-.21,7.48,7.48,0,0,0-.91-0.06,7,7,0,0,0-.89.06q-0.44.06-.93,0.17a7.57,7.57,0,0,0-3.81,2.76q-1.75,2.19-1.75,6.83v0h0Z"/><polygon class="cls-5" points="197 15 212 15 212 19 202 19 202 26 211 26 211 30 202 30 202 41 197 41 197 15 197 15"/><polygon class="cls-5" points="216 15 231 15 231 19 221 19 221 26 230 26 230 30 221 30 221 41 216 41 216 15 216 15"/><polygon class="cls-5" points="234 41 234 15 239 15 239 41 234 41 234 41"/><path class="cls-5" d="M262,19.88a18.8,18.8,0,0,0-6.3-1c-7,0-8.28,5.64-8.28,9.13,0,2.54.84,9.19,7.67,9.19a17,17,0,0,0,6.57-1.24L262,40.42a42.48,42.48,0,0,1-7.46.81c-5.08,0-12.54-3.1-12.54-13.36,0-9.28,7-13,13-13a24.56,24.56,0,0,1,7,.8v4.25Z"/><polygon class="cls-5" points="266 15 282 15 282 19 271 19 271 26 281 26 281 30 271 30 271 37 282 37 282 41 266 41 266 15 266 15"/></svg>');
 }
 
 .about h3 {

apps/presentationeditor/mobile/src/view/settings/PresentationAbout.jsx

@@ -66,7 +66,7 @@ const PagePresentationAbout = props => {
                 {licInfo && typeof licInfo == 'object' && typeof(licInfo.customer)=='object' ? null : (
                     <p>
                         <label>{_t.textTel}</label>
-                        <a id="settings-about-tel" className="external" target="_blank" href="tel:+37163399867>">+371 633-99867</a>
+                        <a id="settings-about-tel" className="external" target="_blank" href="tel:+37163399867">+371 633-99867</a>
                     </p>
                 )}
                 {urlCustomer && urlCustomer.length ? (

apps/presentationeditor/mobile/src/view/settings/Settings.jsx

@@ -73,14 +73,32 @@ const SettingsList = withTranslation()(props => {
         } 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 (
         <View style={props.style} stackPages={true} routes={routes}>
@@ -107,7 +125,7 @@ const SettingsList = withTranslation()(props => {
                     <ListItem title={_t.textPresentationInfo} link="#" onClick={onoptionclick.bind(this, "/presentation-info/")}>
                         <Icon slot="media" icon="icon-info"></Icon>
                     </ListItem>
-                    <ListItem title={_t.textHelp} link="#">
+                    <ListItem title={_t.textHelp} link="#" onClick={showHelp}>
                         <Icon slot="media" icon="icon-help"></Icon>
                     </ListItem>
                     <ListItem title={_t.textAbout} link="#" onClick={onoptionclick.bind(this, "/about/")}>