@web-atoms/web-controls 2.6.5 → 2.6.6

package/dist-esm/basic/UploadEvent.js

@@ -6,194 +6,227 @@ import { AtomControl } from "@web-atoms/core/dist/web/controls/AtomControl.js";
 import PopupService from "@web-atoms/core/dist/web/services/PopupService.js";
 import { toFileSize } from "../NumberFormats.js";
 const acceptCache = {};
-export const isFileType = (acceptType) => {
-    function isFileTypeFactory(accept) {
-        if (!accept || accept === "*/*") {
-            return () => true;
-        }
-        const types = accept.split(/\,/g).map((x) => {
-            x = x.trim();
-            if (x.startsWith(".")) {
-                return (file) => file.name.endsWith(x);
-            }
-            if (x.endsWith("/*")) {
-                const prefix = x.substring(0, x.length - 1);
-                return (file) => file.type.startsWith(prefix);
-            }
-            return (file) => file.type === x;
-        });
-        return (file) => {
-            for (const iterator of types) {
-                if (iterator(file)) {
-                    return true;
-                }
-            }
-            return false;
-        };
+export const isFileType = acceptType => {
+  function isFileTypeFactory(accept) {
+    if (!accept || accept === "*/*") {
+      return () => true;
     }
-    return acceptCache[acceptType] ??= isFileTypeFactory(acceptType);
+    const types = accept.split(/\,/g).map(x => {
+      x = x.trim();
+      if (x.startsWith(".")) {
+        return file => file.name.endsWith(x);
+      }
+      if (x.endsWith("/*")) {
+        const prefix = x.substring(0, x.length - 1);
+        return file => file.type.startsWith(prefix);
+      }
+      return file => file.type === x;
+    });
+    return file => {
+      for (const iterator of types) {
+        if (iterator(file)) {
+          return true;
+        }
+      }
+      return false;
+    };
+  }
+  return acceptCache[acceptType] ??= isFileTypeFactory(acceptType);
 };
 let previousFile;
 const uploadCommand = Command.create({
-    name: "upload-command"
+  name: "upload-command"
 });
-const requestUpload = ({ element, multiple, authorize, extra, convert, upload, folder, stream, maxStreamSize, uploadEvent }) => {
-    if (authorize) {
-        if (!App.authorize()) {
-            return;
-        }
+const requestUpload = ({
+  element,
+  multiple,
+  authorize,
+  extra,
+  convert,
+  upload,
+  folder,
+  stream,
+  maxStreamSize,
+  uploadEvent
+}) => {
+  if (authorize) {
+    if (!App.authorize()) {
+      return;
     }
-    const chain = [];
-    let start = element;
-    while (start) {
-        chain.push(start);
-        start = start.parentElement;
-    }
-    previousFile?.remove();
-    const file = document.createElement("input");
-    file.type = "file";
-    file.multiple = multiple;
-    if (folder) {
-        file.webkitdirectory = folder;
-    }
-    const accept = element.getAttribute("data-accept") || "*/*";
-    file.accept = accept;
-    const capture = element.getAttribute("data-capture");
-    if (capture) {
-        file.capture = capture;
+  }
+  const chain = [];
+  let start = element;
+  while (start) {
+    chain.push(start);
+    start = start.parentElement;
+  }
+  previousFile?.remove();
+  const file = document.createElement("input");
+  file.type = "file";
+  file.multiple = multiple;
+  if (folder) {
+    file.webkitdirectory = folder;
+  }
+  const accept = element.getAttribute("data-accept") || "*/*";
+  file.accept = accept;
+  const capture = element.getAttribute("data-capture");
+  if (capture) {
+    file.capture = capture;
+  }
+  file.style.position = "absolute";
+  file.style.left = "-1000px";
+  file.style.top = "-1000px";
+  document.body.append(file);
+  previousFile = file;
+  const maxSize = parseInt(element.getAttribute("data-max-size") || "0", 10);
+  stream ||= element.getAttribute("data-stream") === "true";
+  maxStreamSize ??= parseInt(element.getAttribute("data-max-stream-size") || "0", 10);
+  const forceType = element.getAttribute("data-force-type") === "true";
+  file.addEventListener("change", () => {
+    let files = Array.from(file.files);
+    let msgItems = [];
+    if (forceType || maxSize) {
+      const validated = [];
+      const checkFileType = isFileType(accept);
+      for (const iterator of files) {
+        if (forceType) {
+          if (!checkFileType(iterator)) {
+            msgItems.push(`${iterator.name} is invalid file.`, XNode.create("br", null));
+            continue;
+          }
+        }
+        if (stream) {
+          if (iterator.size > maxStreamSize) {
+            msgItems.push(`Size of ${iterator.name} is more than ${toFileSize(maxStreamSize)}.`, XNode.create("br", null));
+            continue;
+          }
+          validated.push(iterator);
+          continue;
+        }
+        if (!convert && maxSize && iterator.size > maxSize) {
+          msgItems.push(`Size of ${iterator.name} is more than ${toFileSize(maxSize)}.`, XNode.create("br", null));
+          continue;
+        }
+        validated.push(iterator);
+      }
+      files = validated;
     }
-    file.style.position = "absolute";
-    file.style.left = "-1000px";
-    file.style.top = "-1000px";
-    document.body.append(file);
-    previousFile = file;
-    const maxSize = parseInt(element.getAttribute("data-max-size") || "0", 10);
-    stream ||= element.getAttribute("data-stream") === "true";
-    maxStreamSize ??= parseInt(element.getAttribute("data-max-stream-size") || "0", 10);
-    const forceType = element.getAttribute("data-force-type") === "true";
-    file.addEventListener("change", () => {
-        let files = Array.from(file.files);
-        let msgItems = [];
-        if (forceType || maxSize) {
-            const validated = [];
-            const checkFileType = isFileType(accept);
-            for (const iterator of files) {
-                if (forceType) {
-                    if (!checkFileType(iterator)) {
-                        msgItems.push(`${iterator.name} is invalid file.`, XNode.create("br", null));
-                        continue;
-                    }
-                }
-                if (stream) {
-                    if (iterator.size > maxStreamSize) {
-                        msgItems.push(`Size of ${iterator.name} is more than ${toFileSize(maxStreamSize)}.`, XNode.create("br", null));
-                        continue;
-                    }
-                    validated.push(iterator);
-                    continue;
-                }
-                if (!convert && maxSize && iterator.size > maxSize) {
-                    msgItems.push(`Size of ${iterator.name} is more than ${toFileSize(maxSize)}.`, XNode.create("br", null));
-                    continue;
-                }
-                validated.push(iterator);
-            }
-            files = validated;
+    file.remove();
+    previousFile = null;
+    chain.reverse();
+    while (chain.length) {
+      const root = chain.pop();
+      if (root.isConnected) {
+        const control = AtomControl.from(root);
+        if (msgItems.length) {
+          const msg = XNode.create("p", null, ...msgItems);
+          control.app.runAsync(() => PopupService.alert({
+            message: msg
+          }));
+          if (files.length === 0) {
+            return;
+          }
         }
-        file.remove();
-        previousFile = null;
-        chain.reverse();
-        while (chain.length) {
-            const root = chain.pop();
-            if (root.isConnected) {
-                const control = AtomControl.from(root);
-                if (msgItems.length) {
-                    const msg = XNode.create("p", null, ...msgItems);
-                    control.app.runAsync(() => PopupService.alert({ message: msg }));
-                    if (files.length === 0) {
-                        return;
-                    }
-                }
-                if (upload) {
-                    const doUploadEvent = new CustomEvent("uploadRequested", {
-                        detail: {
-                            files,
-                            extra,
-                            convert,
-                            stream,
-                            maxStreamSize,
-                            maxSize,
-                            uploadEvent
-                        },
-                        bubbles: true,
-                        cancelable: true
-                    });
-                    root.dispatchEvent(doUploadEvent);
-                    if (doUploadEvent.defaultPrevented) {
-                        return;
-                    }
-                }
-                root.dispatchEvent(new CustomEvent(uploadEvent, { detail: {
-                        files,
-                        extra
-                    }, bubbles: true }));
-                break;
-            }
+        if (upload) {
+          const doUploadEvent = new CustomEvent("uploadRequested", {
+            detail: {
+              files,
+              extra,
+              convert,
+              stream,
+              maxStreamSize,
+              maxSize,
+              uploadEvent
+            },
+            bubbles: true,
+            cancelable: true
+          });
+          root.dispatchEvent(doUploadEvent);
+          if (doUploadEvent.defaultPrevented) {
+            return;
+          }
         }
-    });
-    setTimeout(() => {
-        file.dispatchEvent(new MouseEvent("click"));
-    });
-};
-window.addEventListener(uploadCommand.eventName, (ce) => {
-    if (ce.defaultPrevented) {
-        return;
+        root.dispatchEvent(new CustomEvent(uploadEvent, {
+          detail: {
+            files,
+            extra
+          },
+          bubbles: true
+        }));
+        break;
+      }
     }
-    const element = ce.target;
-    const authorize = element.getAttribute("data-authorize") === "true";
-    const multiple = element.getAttribute("data-multiple") === "true";
-    const extra = element.extra ?? element.getAttribute("data-extra");
-    const upload = element.getAttribute("data-upload") === "true";
-    const folder = element.hasAttribute("data-folder");
-    const convert = element.getAttribute("data-convert") === "true";
-    const stream = element.getAttribute("data-stream") === "true";
-    const maxStreamSize = parseInt(element.getAttribute("data-max-stream-size") ?? "0", 10);
-    const uploadEvent = StringHelper.fromHyphenToCamel(element.getAttribute("data-upload-event"));
-    requestUpload({
-        element,
-        authorize,
-        multiple,
-        extra,
-        convert,
-        upload,
-        folder,
-        stream,
-        maxStreamSize,
-        uploadEvent
-    });
+  });
+  setTimeout(() => {
+    file.dispatchEvent(new MouseEvent("click"));
+  });
+};
+window.addEventListener(uploadCommand.eventName, ce => {
+  if (ce.defaultPrevented) {
+    return;
+  }
+  const element = ce.target;
+  const authorize = element.getAttribute("data-authorize") === "true";
+  const multiple = element.getAttribute("data-multiple") === "true";
+  const extra = element.extra ?? element.getAttribute("data-extra");
+  const upload = element.getAttribute("data-upload") === "true";
+  const folder = element.hasAttribute("data-folder");
+  const convert = element.getAttribute("data-convert") === "true";
+  const stream = element.getAttribute("data-stream") === "true";
+  const maxStreamSize = parseInt(element.getAttribute("data-max-stream-size") ?? "0", 10);
+  const uploadEvent = StringHelper.fromHyphenToCamel(element.getAttribute("data-upload-event"));
+  requestUpload({
+    element,
+    authorize,
+    multiple,
+    extra,
+    convert,
+    upload,
+    folder,
+    stream,
+    maxStreamSize,
+    uploadEvent
+  });
 });
 let id = 1;
 export default class UploadEvent {
-    static { this.requestUpload = requestUpload; }
-    static AttachUploadAction({ uploadEvent = "filesAvailable", accept = "*/*", capture, multiple = false, forceType = true, maxSize = 524288000, maxStreamSize = 100 * 1024 * 1024, stream = false, extra, convert = false, upload = true, authorize = true, ariaLabel = "Upload", folder = false, ...others }) {
-        return {
-            ...others,
-            "data-folder": folder ? "true" : void 0,
-            "data-click-command": uploadCommand.name,
-            "data-upload-event": uploadEvent,
-            "data-accept": accept,
-            "data-multiple": multiple ? "true" : "false",
-            "data-capture": capture,
-            "data-convert": convert,
-            "data-stream": stream ? "true" : "false",
-            "data-max-stream-size": maxStreamSize ? maxStreamSize.toString() : undefined,
-            "data-upload": upload ? "true" : "false",
-            "data-force-type": forceType ? "true" : "false",
-            "data-max-size": maxSize ? maxSize.toString() : undefined,
-            "data-authorize": authorize.toString(),
-            "aria-label": ariaLabel,
-            extra,
-        };
-    }
-}
-//# sourceMappingURL=UploadEvent.js.map
+  static {
+    this.requestUpload = requestUpload;
+  }
+  static AttachUploadAction({
+    uploadEvent = "filesAvailable",
+    accept = "*/*",
+    capture,
+    multiple = false,
+    forceType = true,
+    maxSize = 524288000,
+    maxStreamSize = 100 * 1024 * 1024,
+    stream = false,
+    extra,
+    convert = false,
+    upload = true,
+    authorize = true,
+    ariaLabel = "Upload",
+    folder = false,
+    ...others
+  }) {
+    return {
+      ...others,
+      "data-folder": folder ? "true" : void 0,
+      "data-click-command": uploadCommand.name,
+      "data-upload-event": uploadEvent,
+      "data-accept": accept,
+      "data-multiple": multiple ? "true" : "false",
+      "data-capture": capture,
+      "data-convert": convert,
+      "data-stream": stream ? "true" : "false",
+      "data-max-stream-size": maxStreamSize ? maxStreamSize.toString() : undefined,
+      "data-upload": upload ? "true" : "false",
+      "data-force-type": forceType ? "true" : "false",
+      "data-max-size": maxSize ? maxSize.toString() : undefined,
+      "data-authorize": authorize.toString(),
+      "aria-label": ariaLabel,
+      extra
+    };
+  }
+}