image-exporter 1.1.0 → 1.1.1

package/README.md

@@ -1,4 +1,4 @@
-# image-exporter [v1.0.9]
+# image-exporter [v1.1.0]
 
 image-exporter is a client-side javascript tool that downloads DOM elements as images. It can be imported using your favorite package manager or used directly the window.
 

package/dist/image-exporter.es.js

@@ -4083,12 +4083,30 @@ function requireJszip_min() {
 }
 var jszip_minExports = requireJszip_min();
 const JSZip = /* @__PURE__ */ getDefaultExportFromCjs(jszip_minExports);
-async function downloadImages(images, config) {
-  if (images.length === 1) {
-    const image = images[0];
+const defaultImageOptions = {
+  label: "image",
+  format: "jpg",
+  scale: 1,
+  quality: 1,
+  includeScaleInLabel: false
+};
+const defaultConfig = {
+  ...defaultImageOptions,
+  downloadImages: true,
+  defaultImageLabel: "image",
+  zipLabel: "images",
+  corsProxyBaseUrl: "",
+  enableWindowLogging: true,
+  loggingLevel: "none"
+};
+async function downloadImages(images, userConfig = defaultConfig) {
+  const config = userConfig ? { ...defaultConfig, ...userConfig } : defaultConfig;
+  const uniqueImages = ensureUniqueFileNames(images);
+  if (uniqueImages.length === 1) {
+    const image = uniqueImages[0];
     await download(image.dataURL, image.fileName);
-  } else if (images.length > 1) {
-    const imagesBlob = await zipUpImages(images);
+  } else if (uniqueImages.length > 1) {
+    const imagesBlob = await zipUpImages(uniqueImages);
     if (imagesBlob) await download(imagesBlob, parseLabel(config));
   }
 }
@@ -4121,6 +4139,26 @@ function parseLabel(config) {
     return "images";
   }
 }
+function ensureUniqueFileNames(images) {
+  const fileNameMap = /* @__PURE__ */ new Map();
+  return images.map((image) => {
+    const { fileName } = image;
+    const lastDotIndex = fileName.lastIndexOf(".");
+    const baseName = lastDotIndex !== -1 ? fileName.substring(0, lastDotIndex) : fileName;
+    const extension = lastDotIndex !== -1 ? fileName.substring(lastDotIndex) : "";
+    if (!fileNameMap.has(fileName)) {
+      fileNameMap.set(fileName, 1);
+      return image;
+    }
+    const count = fileNameMap.get(fileName) + 1;
+    fileNameMap.set(fileName, count);
+    const newFileName = `${baseName}-${count}${extension}`;
+    return {
+      ...image,
+      fileName: newFileName
+    };
+  });
+}
 const log = {
   info: (...messages) => logAction(messages, "info"),
   error: (...messages) => logAction(messages, "error"),
@@ -4393,22 +4431,6 @@ async function getImageOptions(element, config) {
     }
   }
 }
-const defaultImageOptions = {
-  label: "image",
-  format: "jpg",
-  scale: 1,
-  quality: 1,
-  includeScaleInLabel: false
-};
-const defaultConfig = {
-  ...defaultImageOptions,
-  downloadImages: true,
-  defaultImageLabel: "image",
-  zipLabel: "images",
-  corsProxyBaseUrl: "",
-  enableWindowLogging: true,
-  loggingLevel: "none"
-};
 function removeHiddenElements(elements) {
   elements = Array.from(elements);
   return elements.filter((element) => isVisible(element));
@@ -4502,7 +4524,9 @@ async function capture(elements, userConfig = defaultConfig) {
 }
 if (typeof window !== "undefined") {
   window.imageExporter = capture;
+  window.imageExporterDownload = downloadImages;
 }
 export {
-  capture
+  capture,
+  downloadImages
 };

package/dist/image-exporter.umd.js

@@ -4088,12 +4088,30 @@
   }
   var jszip_minExports = requireJszip_min();
   const JSZip = /* @__PURE__ */ getDefaultExportFromCjs(jszip_minExports);
-  async function downloadImages(images, config) {
-    if (images.length === 1) {
-      const image = images[0];
+  const defaultImageOptions = {
+    label: "image",
+    format: "jpg",
+    scale: 1,
+    quality: 1,
+    includeScaleInLabel: false
+  };
+  const defaultConfig = {
+    ...defaultImageOptions,
+    downloadImages: true,
+    defaultImageLabel: "image",
+    zipLabel: "images",
+    corsProxyBaseUrl: "",
+    enableWindowLogging: true,
+    loggingLevel: "none"
+  };
+  async function downloadImages(images, userConfig = defaultConfig) {
+    const config = userConfig ? { ...defaultConfig, ...userConfig } : defaultConfig;
+    const uniqueImages = ensureUniqueFileNames(images);
+    if (uniqueImages.length === 1) {
+      const image = uniqueImages[0];
       await download(image.dataURL, image.fileName);
-    } else if (images.length > 1) {
-      const imagesBlob = await zipUpImages(images);
+    } else if (uniqueImages.length > 1) {
+      const imagesBlob = await zipUpImages(uniqueImages);
       if (imagesBlob) await download(imagesBlob, parseLabel(config));
     }
   }
@@ -4126,6 +4144,26 @@
       return "images";
     }
   }
+  function ensureUniqueFileNames(images) {
+    const fileNameMap = /* @__PURE__ */ new Map();
+    return images.map((image) => {
+      const { fileName } = image;
+      const lastDotIndex = fileName.lastIndexOf(".");
+      const baseName = lastDotIndex !== -1 ? fileName.substring(0, lastDotIndex) : fileName;
+      const extension = lastDotIndex !== -1 ? fileName.substring(lastDotIndex) : "";
+      if (!fileNameMap.has(fileName)) {
+        fileNameMap.set(fileName, 1);
+        return image;
+      }
+      const count = fileNameMap.get(fileName) + 1;
+      fileNameMap.set(fileName, count);
+      const newFileName = `${baseName}-${count}${extension}`;
+      return {
+        ...image,
+        fileName: newFileName
+      };
+    });
+  }
   const log = {
     info: (...messages) => logAction(messages, "info"),
     error: (...messages) => logAction(messages, "error"),
@@ -4398,22 +4436,6 @@
       }
     }
   }
-  const defaultImageOptions = {
-    label: "image",
-    format: "jpg",
-    scale: 1,
-    quality: 1,
-    includeScaleInLabel: false
-  };
-  const defaultConfig = {
-    ...defaultImageOptions,
-    downloadImages: true,
-    defaultImageLabel: "image",
-    zipLabel: "images",
-    corsProxyBaseUrl: "",
-    enableWindowLogging: true,
-    loggingLevel: "none"
-  };
   function removeHiddenElements(elements) {
     elements = Array.from(elements);
     return elements.filter((element) => isVisible(element));
@@ -4507,8 +4529,10 @@
   }
   if (typeof window !== "undefined") {
     window.imageExporter = capture;
+    window.imageExporterDownload = downloadImages;
   }
   exports2.capture = capture;
+  exports2.downloadImages = downloadImages;
   Object.defineProperty(exports2, Symbol.toStringTag, { value: "Module" });
 });
 })()

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "image-exporter",
-  "version": "1.1.0",
+  "version": "1.1.1",
   "description": "Easily download one or more DOM elements as images",
   "main": "src/index.ts",
   "type": "module",

package/src/capture/download-images.ts

@@ -1,6 +1,7 @@
 import { Config, Image, Label } from "../types";
 import download from "downloadjs";
 import JSZip from "jszip";
+import { defaultConfig } from "../config";
 
 /**
  * downloadImages
@@ -9,13 +10,20 @@ import JSZip from "jszip";
  *
  * If multiple images are provided, they will be zipped and downloaded as a file.
  */
-export async function downloadImages(images: Image[], config: Config) {
-  if (images.length === 1) {
-    const image = images[0];
+export async function downloadImages(
+  images: Image[],
+  userConfig: Config = defaultConfig
+) {
+  const config = userConfig ? { ...defaultConfig, ...userConfig } : defaultConfig;
 
+  // Ensure unique filenames before downloading
+  const uniqueImages = ensureUniqueFileNames(images);
+
+  if (uniqueImages.length === 1) {
+    const image = uniqueImages[0];
     await download(image.dataURL, image.fileName);
-  } else if (images.length > 1) {
-    const imagesBlob = await zipUpImages(images);
+  } else if (uniqueImages.length > 1) {
+    const imagesBlob = await zipUpImages(uniqueImages);
     if (imagesBlob) await download(imagesBlob, parseLabel(config));
   }
 }
@@ -67,3 +75,41 @@ function parseLabel(config: Config): Label {
     return "images";
   }
 }
+
+/**
+ * ensureUniqueFileNames
+ *
+ * Ensures all image filenames are unique by adding -2, -3, etc. to duplicates
+ * before the file extension.
+ */
+function ensureUniqueFileNames(images: Image[]): Image[] {
+  const fileNameMap = new Map<string, number>();
+
+  return images.map((image) => {
+    const { fileName } = image;
+
+    // Split the filename into base and extension
+    const lastDotIndex = fileName.lastIndexOf(".");
+    const baseName = lastDotIndex !== -1 ? fileName.substring(0, lastDotIndex) : fileName;
+    const extension = lastDotIndex !== -1 ? fileName.substring(lastDotIndex) : "";
+
+    // Check if this base filename has been seen before
+    if (!fileNameMap.has(fileName)) {
+      fileNameMap.set(fileName, 1);
+      return image;
+    }
+
+    // If it's a duplicate, increment the counter and create a new filename
+    const count = fileNameMap.get(fileName)! + 1;
+    fileNameMap.set(fileName, count);
+
+    // Create new filename with -2, -3, etc. before the extension
+    const newFileName = `${baseName}-${count}${extension}`;
+
+    // Return a new image object with the updated filename
+    return {
+      ...image,
+      fileName: newFileName,
+    };
+  });
+}

package/src/index.ts

@@ -4,11 +4,13 @@
 /*                            by briantuckerdesign                            */
 /* -------------------------------------------------------------------------- */
 import { capture } from "./capture";
+import { downloadImages } from "./capture/download-images";
 
 /** Exports for use in browser */
 if (typeof window !== "undefined") {
   (window as any).imageExporter = capture;
+  (window as any).imageExporterDownload = downloadImages;
 }
 
 /** Exports for use as an imported package */
-export { capture };
+export { capture, downloadImages };