rondo_form 0.1.0 → 0.2.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: ab7c415b1a97a538742b84ffd41f05acb28e60dc6bb5721d059670c4b69e5e91
-  data.tar.gz: e953952e1955dd4a8194b96ea28aff09aa6e0990ce5113648f4d94f846f55335
+  metadata.gz: c3d9a9ef19130de5f6aa92adf1139711bd5faaae4ef20155579e6865f291b7d9
+  data.tar.gz: 791d1fff3244853568a449b8b3c7a151dec19b45d2c3e2e79dd77cdec47ad891
 SHA512:
-  metadata.gz: 680cb74e9d615f9e1d3444363796a2cc8ec8d25dbc3caf2504bcee3188cb88c4001b911259cb256bb236d6bbaf6e0238edc71570fee7894996fd68ffc08cfe6b
-  data.tar.gz: 1331fec9838d555ba6742f28aa74259644acbe7a019716a99118413eecb069fd69926f31a21db89e78a9d710e080caa2a0a62f56cd570344ff1e0194c4dbc96c
+  metadata.gz: e511697842f4cebf817bf61108e0556281e0702b7acd9cb6b75c0ba62d18ae7ef33b3e2665ec240a595955d0d80c77d6297bd882a7de5148552997b1020e77d5
+  data.tar.gz: b9d9ef124e278eef3de87275295783874535207bd4785cac54a84059f28cd350e96f6b301399a1080e3ac63ab855370983c8b3793a86daf7fdd75a1c083929c2

data/README.md

@@ -8,24 +8,62 @@ Install the gem and add to the application's Gemfile by executing:
 
     $ bundle add rondo_form
 
-If bundler is not being used to manage dependencies, install the gem by executing:
+Or inside the Gemfile add the following
 
-    $ gem install rondo_form
+    $ gem 'rondo_form', '~> 0.2.0'
 
 Run the installation task:
 
-    $ rails g rondo_form:install
+    $ rails g rondo_form:install 
 
 ## Usage
 
+For example, we have `Project` model, which has `has_many` relationship with `Task` model:
+```
+rails g scaffold Project name:string description:string
+rails g model Task description:string done:boolean project:belongs_to
+```
+
+### Sample with SimpleForm
+In your `projects/_form` partial:
+``` erb
+<%= simple_form_for(@project) do |f| %>
+
+  <div class="form-inputs">
+    <%= f.input :name %>
+    <%= f.input :description %>
+  </div>
+
+  <h3 class="text-xl mt-4">Tasks</h3>
+  <div class="my-2" data-controller="cocoon">
+    <%= f.simple_fields_for :tasks do |task| %>
+      <%= render "task_fields", f: task %>
+    <% end %>
+    <div class="links">
+      <%= link_to_add_association "Add Task", f, :tasks %>
+    </div>
+  </div>
+
+  <div class="form-actions mt-4">
+    <%= f.button :submit %>
+  </div>
+<% end %>
+
+```
+
+In your `_task_fields` partial:
+``` erb
+<div class="nested-fields">
+  <%= f.input :description %>
+  <%= f.input :done, as: :boolean %>
+  <%= link_to_remove_association "Remove Task", f %>
+</div>
+
+```
+
+_Note_: You must add `data-controller="cocoon"`  to an element, that wraps `fields_for` and `link_to_add_association` helper.
 
 
-## Development
-
-After checking out the repo, run `bin/setup` to install dependencies. Then, run `rake spec` to run the tests. You can also run `bin/console` for an interactive prompt that will allow you to experiment.
-
-To install this gem onto your local machine, run `bundle exec rake install`. To release a new version, update the version number in `version.rb`, and then run `bundle exec rake release`, which will create a git tag for the version, push git commits and the created tag, and push the `.gem` file to [rubygems.org](https://rubygems.org).
-
 ## Contributing
 
 Bug reports and pull requests are welcome on GitHub at https://github.com/hungle00/rondo_form.

data/lib/generators/rondo_form/install_generator.rb

@@ -5,10 +5,10 @@ module RondoForm
       desc "This generator installs the javascript needed for rondo_form"
 
       def copy_the_javascript
-        copy_file "cocoon_controller.js", "app/javascript/controllers/cocoon_controller.js", force: true
+        copy_file "nested_rondo_controller.js", "app/javascript/controllers/nested_rondo_controller.js", force: true
         if (Rails.root.join("app/javascript/controllers/index.js")).exist?
           append_to_file "app/javascript/controllers/index.js", 
-            %(import CocoonController from "./cocoon_controller"\napplication.register("cocoon", CocoonController)\n)
+            %(import NestedRondoController from "./nested_rondo_controller"\napplication.register("nested-rondo", NestedRondoController)\n)
         else
           say %(Couldn't find "app/javascript/controllers/index.js".), :red
         end

data/lib/generators/rondo_form/templates/nested_rondo_controller.js

@@ -0,0 +1,41 @@
+import { Controller } from "@hotwired/stimulus"
+
+export default class extends Controller {
+  static targets = ["template"]
+
+  addField(e) {
+    e.preventDefault();
+
+    let assoc = e.target.dataset.association;
+    let newField = this.buildNewAssociation(assoc);
+    let insertionNode = this.templateTarget.parentElement;
+    insertionNode.insertAdjacentHTML("beforebegin", newField);
+  }
+
+  removeField(e) {
+    e.preventDefault();
+
+    let wrapperClass = this.data.get("wrapperClass") || "nested-fields";
+    let wrapperField = e.target.closest("." + wrapperClass);
+    if(e.target.matches('.dynamic')) {
+      wrapperField.remove();
+    } else {
+      wrapperField.querySelector("input[name*='_destroy']").value = 1;
+      wrapperField.style.display = "none";
+    }
+  }
+
+  buildNewAssociation(assoc) {
+    let content  = this.templateTarget.innerHTML;
+    let regexpBraced = new RegExp('\\[new_' + assoc + '\\]', 'g');
+    let newId  = new Date().getTime();
+    let newContent = content.replace(regexpBraced, '[' + newId + ']');
+
+    if (newContent == content) {
+      // assoc can be singular or plural 
+      regexpBraced = new RegExp('\\[new_' + assoc + 's\\]', 'g');
+      newContent = content.replace(regexpBraced, '[' + newId + ']');
+    }
+    return newContent;
+  }
+}

data/lib/rondo_form/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module RondoForm
-  VERSION = "0.1.0"
+  VERSION = "0.2.1"
 end

data/lib/rondo_form/view_helpers.rb

@@ -1,5 +1,6 @@
 module RondoForm
   module ViewHelpers
+
     # this will show a link to remove the current association. This should be placed inside the partial.
     # either you give
     # - *name* : the text of the link
@@ -18,55 +19,51 @@ module RondoForm
         name         = capture(&block)
         link_to_remove_association(name, f, html_options)
       else
-        name         = args[0]
-        f            = args[1]
-        html_options = args[2] || {}
+        name, f, html_options = *args
+        html_options ||= {}
 
         is_dynamic = f.object.new_record?
         html_options[:class] = [html_options[:class], "remove_fields #{is_dynamic ? 'dynamic' : 'existing'}"].compact.join(' ')
-        html_options[:'data-action'] = "click->cocoon#removeField"
+        html_options[:'data-action'] = "click->nested-rondo#removeField"
         f.hidden_field(:_destroy) + link_to(name, '', html_options)
       end
     end
 
-    # :nodoc:
-    def render_association(association, f, new_object)
-      f.fields_for(association, new_object, :child_index => "new_#{association}") do |builder|
-        render(association.to_s.singularize + "_fields", :f => builder, :dynamic => true)
-      end
-    end
-
     # shows a link that will allow to dynamically add a new associated object.
     #
     # - *name* :         the text to show in the link
-    # - *f* :            the form this should come in (the formtastic form)
+    # - *f* :            the form this should come in
     # - *association* :  the associated objects, e.g. :tasks, this should be the name of the <tt>has_many</tt> relation.
     # - *html_options*:  html options to be passed to <tt>link_to</tt> (see <tt>link_to</tt>)
     # - *&block*:        see <tt>link_to</tt>
 
     def link_to_add_association(*args, &block)
       if block_given?
-        f            = args[0]
-        association  = args[1]
-        html_options = args[2] || {}
+        f, association, html_options = *args
+        html_options ||= {}
         link_to_add_association(capture(&block), f, association, html_options)
       else
-        name         = args[0]
-        f            = args[1]
-        association  = args[2]
-        html_options = args[3] || {}
+        name, f, association, html_options = *args
+        html_options ||= {}
 
         html_options[:class] = [html_options[:class], "add_fields"].compact.join(' ')
         html_options[:'data-association'] = association.to_s.singularize
-        html_options[:'data-action'] = "click->cocoon#addField"
+        html_options[:'data-action'] = "click->nested-rondo#addField"
 
         new_object = f.object.class.reflect_on_association(association).klass.new
         model_name = new_object.class.name.underscore
-        hidden_div = content_tag("template", id: "#{model_name}_fields_template", data: {cocoon_target: 'template'}) do
+        hidden_div = content_tag("template", id: "#{model_name}_fields_template", data: {'nested-rondo_target': 'template'}) do
           render_association(association, f, new_object)
         end
       end
       hidden_div.html_safe + link_to(name, '', html_options )
     end
+
+    # :nodoc:
+    def render_association(association, f, new_object)
+      f.fields_for(association, new_object, :child_index => "new_#{association}") do |builder|
+        render(association.to_s.singularize + "_fields", :f => builder, :dynamic => true)
+      end
+    end
   end
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: rondo_form
 version: !ruby/object:Gem::Version
-  version: 0.1.0
+  version: 0.2.1
 platform: ruby
 authors:
 - hungle00
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2023-06-13 00:00:00.000000000 Z
+date: 2023-06-17 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: railties
@@ -78,7 +78,7 @@ files:
 - README.md
 - Rakefile
 - lib/generators/rondo_form/install_generator.rb
-- lib/generators/rondo_form/templates/cocoon_controller.js
+- lib/generators/rondo_form/templates/nested_rondo_controller.js
 - lib/rondo_form.rb
 - lib/rondo_form/version.rb
 - lib/rondo_form/view_helpers.rb

data/lib/generators/rondo_form/templates/cocoon_controller.js

@@ -1,35 +0,0 @@
-import { Controller } from "@hotwired/stimulus"
-
-export default class extends Controller {
-  static targets = ["template"]
-
-  addField(e) {
-    e.preventDefault()
-    let assoc = e.target.dataset.association
-    let newField = this.buildNewAssociation(assoc)
-    let insertionNode = this.templateTarget.parentElement
-    insertionNode.insertAdjacentHTML("beforebegin", newField)
-  }
-
-  removeField(e) {
-    e.preventDefault()
-    let closestField = e.target.closest(".nested-fields")
-    if(e.target.matches('.dynamic')) {
-      closestField.remove()
-    } else {
-      closestField.style.display = "none"
-    }
-  }
-
-  buildNewAssociation(assoc) {
-    let content  = this.templateTarget.innerHTML;
-    let regexp_braced = new RegExp('\\[new_' + assoc + '\\]', 'g');
-    let new_id  = new Date().getTime();
-    let new_content = content.replace(regexp_braced, '[' + new_id + ']');
-    if (new_content == content) {
-      regexp_braced = new RegExp('\\[new_' + assoc + 's\\]', 'g');
-      new_content = content.replace(regexp_braced, '[' + new_id + ']');
-    }
-    return new_content
-  }
-}