fix: fix download image

ImageMarkup · Sep 8, 2023 · 5f7f922 · 5f7f922
1 parent 5231f60
commit 5f7f922
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 3 deletions.
diff --git a/index.html b/index.html
@@ -65,6 +65,16 @@
 		<circle cx="6" cy="12" r="3" fill="#212b36"/>
 		<circle cx="18" cy="18" r="3" fill="#212b36"/>
 	</symbol>
+	<symbol viewBox="0 0 24 24" id="download-icon">
+		<!--		<path d="M13.5 1a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3zM11 2.5a2.5 2.5 0 1 1 .603 1.628l-6.718 3.12a2.499 2.499 0 0 1 0 1.504l6.718 3.12a2.5 2.5 0 1 1-.488.876l-6.718-3.12a2.5 2.5 0 1 1 0-3.256l6.718-3.12A2.5 2.5 0 0 1 11 2.5zm-8.5 4a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3zm11 5.5a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3z"/>-->
+		<path
+				d="M6 21H18M12 3V17M12 17L17 12M12 17L7 12"
+				stroke="#000000"
+				stroke-width="2"
+				stroke-linecap="round"
+				stroke-linejoin="round"
+		/>
+	</symbol>
 </svg>
 
 <!-- Google tag (gtag.js) -->

diff --git a/sources/services/ajaxActions.js b/sources/services/ajaxActions.js
@@ -238,7 +238,8 @@ class AjaxActions {
 	downloadImage(url, name) {
 		if (util.isiPhone()) {
 			const title = `Download image ${name}`;
-			util.shareUrl(title, url);
+			const blob = webix.ajax().response("blob").get(`${url}`);
+			util.shareFile(title, blob, name);
 		}
 		else if (url) {
 			return webix.ajax().response("blob").get(`${url}`, (text, blob) => {

diff --git a/sources/utils/util.js b/sources/utils/util.js
@@ -508,6 +508,19 @@ function shareUrl(title, url) {
 	}
 }
 
+async function shareFile(title, data, fileName) {
+		const file = new File(data, fileName, {type: "image/png"});
+		try {
+				await navigator.share({
+						title: title,
+						files: [file]
+				})
+		}
+		catch (err) {
+				console.error("Download failed:", err.message);
+		}
+}
+
 function isPortrait() {
 	return window.matchMedia("(orientation: portrait)").matches;
 }
@@ -549,6 +562,7 @@ export default {
 	isiPhone,
 	isMobilePhone,
 	shareUrl,
-	isPortrait
+	isPortrait,
+	shareFile
 };
 
diff --git a/sources/views/subviews/gallery/galleryMobile.js b/sources/views/subviews/gallery/galleryMobile.js
@@ -254,7 +254,7 @@ export default class GalleryMobileView extends JetView {
 						? `<div class="gallery-images-button-elem tooltip-container tooltip-gallery-images" style="width: ${imageIconDimensions[0].width}px; height: ${imageIconDimensions[0].height}px;">
 									<span class="gallery-images-button download-icon tooltip-title">
 										<svg viewBox="0 0 26 26" class="gallery-icon-svg" style="width: ${imageIconDimensions[1].width}px; height: ${imageIconDimensions[1].height}px;">
-											<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#batch-icon" class="gallery-icon-use"></use>
+											<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#download-icon" class="gallery-icon-use"></use>
 										</svg>
 									</span>
 									<span class="tooltip-block tooltip-block-top">Download</span>