vanilla_nested 1.6.0 → 1.7.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 7164d9ce14876a0445fc8d3b30d14c18e5caca9771313e0f53034266d99363af
-  data.tar.gz: f49863e8b1d520de26f2ea5088753f89d228ce63a90f46fa0410655b5fe6c1f7
+  metadata.gz: 689fd14c5a2ab6ceafb0b30c3e4b38df746f9a6a2dae2d4b01b01bdbb5c70a9d
+  data.tar.gz: 45d3c2365ee778b388aea76105c9d1ae55eb12695f3858caa1b6af1db8dcdfea
 SHA512:
-  metadata.gz: 1ccd4bdf78c71155a3fde6bb26c250244b382868c3a74fb395463c76d55f8b7c7f318ef1b586d93ce191c8fc86fea0239ef8e301c257fe5753003cd3de04d85f
-  data.tar.gz: 9d3d0c45b8d9e7bcd8e456b8d4a7beacc05f97a46b677079add599b2741d03f48e25e3d826be600499ede979a6af414e9ed42af474e6b023c1d772579c20ba5e
+  metadata.gz: aa4051da66403dd8c93e21d907d4c8e97031dd2d9a9f3ddfd0782b748241f6e2249ffae5dd23f86dd9a99ae5063cf7941d55862e18c6e9157465b1f3dc822a32
+  data.tar.gz: 19862c814bc73fef0b19c8cb1da65761f0d64f164ed23475752ce49ba0c2ecf9014724dd6a7dec5764129226dc9e129d6d7a34e7bd60fd350f639ed104e71621

data/app/assets/javascripts/vanilla_nested.js

@@ -1,10 +1,7 @@
 (function(){
   // Get the html from the data attribute and insert the new fields on the container
   // "event" is the click event of the link created by the rails helper
-  window.addVanillaNestedFields = function(event) {
-    event.preventDefault();
-
-    let element = event.target;
+  window.addVanillaNestedFields = function(element) {
     if (!element.classList.contains('vanilla-nested-add'))
       element = element.closest('.vanilla-nested-add')
 
@@ -30,10 +27,6 @@
 
     _dispatchEvent(container, 'vanilla-nested:fields-added', element, {added: inserted})
 
-    let removeLink = inserted.querySelector('.vanilla-nested-remove');
-    if (removeLink)
-      removeLink.addEventListener('click', removeVanillaNestedFields, true);
-
     // dispatch an event if we reached the limit configured on the model
     if (data.limit) {
       let nestedElements = container.querySelectorAll('[name$="[_destroy]"][value="0"]').length;
@@ -44,10 +37,7 @@
 
   // Removes the fields or hides them until the undo timer times out
   // "event" is the click event of the link created by the rails helper
-  window.removeVanillaNestedFields = function(event) {
-    event.preventDefault();
-
-    let element = event.target;
+  window.removeVanillaNestedFields = function(element) {
     if (!element.classList.contains('vanilla-nested-remove'))
       element = element.closest('.vanilla-nested-remove')
 
@@ -82,14 +72,28 @@
   // Unhides the children given a fields wrapper
   // "wrapper" is the wrapper of the link to remove fields
   function unhideFields(wrapper) {
-    [...wrapper.children].forEach(child => child.style.display = 'initial');
+    [...wrapper.children].forEach(child => {
+      if (child.dataset.hasAttributeStyle) {
+        child.style.display = child.dataset.originalDisplay;
+      } else {
+        child.removeAttribute("style");
+      }
+    });
   }
 
   // Hides an element and adds an "undo" link to unhide it
   // "wrapper" is the wrapper to hide
   // "element" is the link to remove the wrapper
   function hideFieldsWithUndo(wrapper, element) {
-    [...wrapper.children].forEach(child => child.style.display = 'none');
+    [...wrapper.children].forEach(child => {
+      // store original style for after undo
+      if (child.getAttribute("style")) {
+        child.dataset.hasAttributeStyle = true;
+        child.dataset.originalDisplay = child.style.display;
+      }
+
+      child.style.display = 'none';
+    });
 
     // add the 'undo' link with it's callback
     const undoLink = _createUndoWithElementsData(element.dataset);
@@ -140,27 +144,42 @@
   }
 
   function initVanillaNested() {
-    document.querySelectorAll('.vanilla-nested-add').forEach(el => {
-      el.addEventListener('click', addVanillaNestedFields, true);
+    document.addEventListener('click', ev => {
+      const addVanillaNested =
+        ev.target.classList.contains('vanilla-nested-add') ||
+        ev.target.closest('.vanilla-nested-add');
+
+      if (addVanillaNested) {
+        ev.preventDefault();
+        addVanillaNestedFields(ev.target);
+      }
     })
 
-    document.querySelectorAll('.vanilla-nested-remove').forEach(el => {
-      el.addEventListener('click', removeVanillaNestedFields, true);
+    document.addEventListener('click', ev => {
+      const removeVanillaNested =
+        ev.target.classList.contains('vanilla-nested-remove') ||
+        ev.target.closest('.vanilla-nested-remove');
+
+      if (removeVanillaNested) {
+        ev.preventDefault();
+        removeVanillaNestedFields(ev.target);
+      }
     })
   }
 
-  document.addEventListener('DOMContentLoaded', function(){
-    initVanillaNested();
-  })
-
-  // Don't run turbolinks/turbo event callback for first load, we already do it with DOMContentLoaded
-  const notEmpty = (obj) => Object.keys(obj).length;
-
-  document.addEventListener('turbolinks:load', function(e){
-    if (notEmpty(e.data.timing)) initVanillaNested();
-  })
+  let vanillaNestedInitialized = false
+  const initOnce = () => {
+    if (!vanillaNestedInitialized) {
+      vanillaNestedInitialized = true
+      initVanillaNested()
+    }
+  }
 
-  document.addEventListener('turbo:load', function(e){
-    if (notEmpty(e.detail.timing)) initVanillaNested();
-  })
+  if (["complete", "interactive"].includes(document.readyState)) {
+    // if DOMContentLoaded was already fired
+    initOnce()
+  } else {
+    // else wait for it
+    document.addEventListener("DOMContentLoaded", () => initOnce())
+  }
 })()

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: vanilla_nested
 version: !ruby/object:Gem::Version
-  version: 1.6.0
+  version: 1.7.0
 platform: ruby
 authors:
 - Ariel Juodziukynas <arieljuod@gmail.com>
@@ -38,7 +38,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.2.22
+rubygems_version: 3.0.9
 signing_key: 
 specification_version: 4
 summary: Dynamic nested forms using vanilla javascript