Better logic for adding handlers.

package.json

@@ -1,6 +1,6 @@
 {
   "name": "django-s3direct",
-  "version": "2.0.2",
+  "version": "2.0.3",
   "description": "Add direct uploads to S3 functionality with a progress bar to file input fields.",
   "directories": {
     "example": "example"
@@ -12,6 +12,7 @@
     "spark-md5": "^3.0.2"
   },
   "devDependencies": {
+    "buffer": "^6.0.3",
     "parcel": "^2.6.0",
     "prettier": "^2.7.1"
   },

src/css/bootstrap-progress.css

@@ -8,7 +8,7 @@
  * Designed and built with all the love in the world @twitter by @mdo and @fat.
  */
 .clearfix {
-  *zoom: 1;
+  /* *zoom: 1; */
 }
 .clearfix:before,
 .clearfix:after {

src/index.js

@@ -266,6 +266,8 @@ const removeUpload = (e) => {
 
 const addHandlers = (el) => {
   const url = el.querySelector(".file-url");
+  if (url.name.includes("__prefix__")) return false;
+
   const input = el.querySelector(".file-input");
   const remove = el.querySelector(".file-remove");
   const status = url.value === "" ? "form" : "link";
@@ -275,10 +277,16 @@ const addHandlers = (el) => {
   input.addEventListener("change", checkFileAndInitiateUpload, false);
 };
 
+const findAndAddHandlers = () => {
+  document
+    .querySelectorAll(".s3direct:not(.form-active, .link-active)")
+    .forEach(addHandlers);
+};
+
 document.addEventListener("DOMContentLoaded", (event) => {
-  const observer = new MutationObserver(function (m) {
-    [].forEach.call(document.querySelectorAll(".s3direct"), addHandlers);
-  });
-  const observer_config = { childList: true, subtree: true };
-  observer.observe(document.body, observer_config);
+  findAndAddHandlers();
+
+  const observer = new MutationObserver(() => findAndAddHandlers());
+
+  observer.observe(document.body, { childList: true, subtree: true });
 });