binda 0.1.5 → 0.1.6

data/app/views/binda/fieldable/_form_item_selections.html.erb

@@ -10,7 +10,7 @@
 		<% else %>
 			<div class="form-group">
 		    <p class="control-label">
-	        <%= field_setting.name.capitalize %>    
+	        <%= field_setting.name %>    
 		    </p>
 		    <p>
 					<%= t('binda.no_available_choice') %>

data/app/views/binda/fieldable/_form_item_string.html.erb

@@ -1,17 +1,10 @@
 <div id="standard-form--string-<%= field_setting.id %>" class="standard-form--string form-item">
 	
-	<% if @instance.has_string( field_setting.slug ) %>
-			<%= ff.input :content, 
-						input_html: { value: @instance.get_string( field_setting.slug ) }, 
-						as: :string, 
-						hint: field_setting.description, 
-						label: field_setting.name.capitalize %>
-	<% else %>
-			<%= ff.input :content, 
-						as: :string, 
-						hint: field_setting.description, 
-						label: field_setting.name.capitalize  %>
-	<% end %>
+	<%= ff.input :content, 
+				input_html: { value: ff.object.content }, 
+				as: :string,
+				hint: field_setting.description,
+				label: field_setting.name %>
 
 	<%= ff.input :field_setting_id, as: :hidden, input_html: { value: field_setting.id } %>
 	<%= ff.input :id, as: :hidden, input_html: { value: ff.object.id } %>

data/app/views/binda/fieldable/_form_item_text.html.erb

@@ -1,18 +1,10 @@
 <div id="standard-form--text-<%= field_setting.id %>" class="standard-form--text form-item">
 
-	<% if @instance.has_text( field_setting.slug ) %>
-			<%= ff.input :content, 
-						input_html: { value: @instance.get_text( field_setting.slug ), class: 'tinymce' }, 
-						as: :text,
-						hint: field_setting.description,
-						label: field_setting.name.capitalize %>
-	<% else %>
-			<%= ff.input :content, 
-						input_html: { class: 'tinymce' }, 
-						as: :text,
-						hint: field_setting.description,
-						label: field_setting.name.capitalize %>
-	<% end %>
+	<%= ff.input :content, 
+				input_html: { value: ff.object.content, class: 'tinymce' }, 
+				as: :text,
+				hint: field_setting.description,
+				label: field_setting.name %>
 
 	<%= ff.input :field_setting_id, as: :hidden, input_html: { value: field_setting.id } %>
 	<%= ff.input :id, as: :hidden, input_html: { value: ff.object.id } %>

data/app/views/binda/fieldable/_form_item_video.html.erb

@@ -4,7 +4,7 @@
     data-message="<%= t('binda.upload_loading_message') %>"
     data-error="<%= t('binda.upload_error_message')%>">
 
-    <p class="control-label"><%= field_setting.name.capitalize %></p>
+    <p class="control-label"><%= field_setting.name %></p>
 
     <div class="fileupload--dashboard">
 

data/app/views/binda/fieldable/_form_section.html.erb

@@ -4,7 +4,7 @@
 <% if field_setting.field_type == 'text' %>
   <% current = @instance.find_or_create_a_field_by( field_setting.id, 'text' ) %>
   <%= f.simple_fields_for "texts_attributes[]", current do |ff| %>
-    <%= render 'binda/fieldable/form_item_text', ff: ff, field_setting: field_setting %>
+    <%= render 'binda/fieldable/form_item_text', f: f, ff: ff, field_setting: field_setting %>
   <% end %>
 
 
@@ -14,7 +14,7 @@
 <% elsif field_setting.field_type == 'string' %>
   <% current = @instance.find_or_create_a_field_by( field_setting.id, 'string' ) %>
   <%= f.simple_fields_for "strings_attributes[]", current do |ff| %>
-    <%= render 'binda/fieldable/form_item_string', ff: ff, field_setting: field_setting %>
+    <%= render 'binda/fieldable/form_item_string', f: f, ff: ff, field_setting: field_setting %>
   <% end %>
 
 
@@ -48,14 +48,6 @@
   <% end %>
 
 
-<%# - - - - - - - - - - - - %>
-<%# REPEATER                %>
-<%# - - - - - - - - - - - - %>
-<% elsif field_setting.field_type == 'repeater' %>
-  <% repeaters = @instance.repeaters.where( field_setting: field_setting ).order('position DESC') %>
-  <%= render 'binda/fieldable/form_item_repeater', f: f, repeater_setting: field_setting, repeaters: repeaters %>
-
-
 <%# - - - - - - - - - - - - %>
 <%# RELATED_FIELD           %>
 <%# - - - - - - - - - - - - %>
@@ -71,4 +63,13 @@
 <% elsif ['radio', 'selection', 'checkbox'].include? field_setting.field_type %>
   <%= render 'binda/fieldable/form_item_selections', f: f, field_setting: field_setting %>
 
+
+<%# - - - - - - - - - - - - %>
+<%# REPEATER                %>
+<%# - - - - - - - - - - - - %>
+<% elsif field_setting.field_type == 'repeater' %>
+  <% repeaters = @instance.repeaters.where( field_setting: field_setting ).order('position ASC') %>
+  <%= render 'binda/fieldable/form_item_repeater', f: f, repeater_setting: field_setting, repeaters: repeaters %>
+
+
 <% end %>

data/app/views/binda/fieldable/_form_section_repeater.html.erb

@@ -4,7 +4,7 @@
 <% if repeater_setting_child.field_type == 'text' %>
   <% current = @instance.repeaters.select{|r| r.id == f.object.id}.first.find_or_create_a_field_by( repeater_setting_child.id, 'text' ) %>
   <%= f.simple_fields_for "texts_attributes[]", current do |ff| %>
-    <%= render 'binda/fieldable/form_item_text', ff: ff, field_setting: repeater_setting_child %>
+    <%= render 'binda/fieldable/form_item_text', f: f, ff: ff, field_setting: repeater_setting_child %>
   <% end %>
 
 
@@ -14,7 +14,7 @@
 <% elsif repeater_setting_child.field_type == 'string' %>
   <% current = @instance.repeaters.select{|r| r.id == f.object.id}.first.find_or_create_a_field_by( repeater_setting_child.id, 'string' ) %>
   <%= f.simple_fields_for "strings_attributes[]", current do |ff| %>
-    <%= render 'binda/fieldable/form_item_string', ff: ff, field_setting: repeater_setting_child %>
+    <%= render 'binda/fieldable/form_item_string', f: f, ff: ff, field_setting: repeater_setting_child %>
   <% end %>
 
 
@@ -48,7 +48,6 @@
   <% end %>
 
 
-
 <%# - - - - - - - - - - - - %>
 <%# RELATED_FIELD           %>
 <%# - - - - - - - - - - - - %>

data/app/views/binda/fieldable/form_item_repeater/_form_item_repeater_header.html.erb

@@ -0,0 +1,32 @@
+<div>
+	<a class="b-btn b-btn-primary sortable--toggle b-btn-settings" 
+		href="#" 
+		data-sortable-target-id="form--list-<%= repeater_setting.id %>"
+		test-hook="sortable--toggle-<%= repeater_setting.id %>">
+		<span class="sortable--toggle-text">
+			<i class="fa fa-check" aria-hidden="true"></i> 
+			<%= t'binda.done' %>
+		</span>
+		<span class="sortable--toggle-text">
+			<i class="fa fa-random" aria-hidden="true"></i> 
+			<%= t'binda.sort_items' %>
+		</span>
+	</a>
+	<a id="form-item--repeater-<%= repeater_setting.id %>--add-new-button" 
+		class="form--add-list-item main-header--link b-btn b-btn-primary b-btn-settings" 
+		href="#" 
+		data-url="<%= url_for([@structure, @instance, :new_repeater]) %>" 
+		data-id="<%= repeater_setting.id %>"
+		data-params="repeater_setting_id=<%= repeater_setting.id %>">
+	  <i class="fas fa-plus"></i> 
+	  <%= t('binda.new_item_in_repeater', arg1: repeater_setting.name ) %>
+	</a>
+	<p class="control-label clearfix">
+		<%= repeater_setting.name %>
+	</p>
+	<% unless repeater_setting.description.blank? %>
+		<p class="help-block">
+			<%= repeater_setting.description %>
+		</p>
+	<% end %>
+</div>

data/app/views/binda/fieldable/form_item_repeater/_form_item_repeater_list.html.erb

@@ -0,0 +1,19 @@
+<ul id="form--list-<%= repeater_setting.id %>" 
+	class="sortable sortable--disabled form--list" 
+	data-update-url="<%= url_for([@structure, @instance, :sort_repeaters]) %>" 
+	data-message="<%= t 'binda.sort_items_loader', { arg1: t('binda.field_setting.plural').downcase } %>"
+>
+	<% if repeaters.size == 0 %>
+		<%= render 'binda/fieldable/form_item_repeater/form_item_repeater_list_item', 
+			repeater: @instance.find_or_create_a_field_by( repeater_setting.id, 'repeater' ),
+			repeater_setting: repeater_setting, 
+			f: f %>
+	<% else %>
+		<% repeaters.each do |repeater| %>
+			<%= render 'binda/fieldable/form_item_repeater/form_item_repeater_list_item', 
+				repeater: repeater,
+				repeater_setting: repeater_setting, 
+				f: f %>
+		<% end %>
+	<% end %>
+</ul>

data/app/views/binda/fieldable/form_item_repeater/_form_item_repeater_list_item.html.erb

@@ -0,0 +1,42 @@
+<li id="form--list-item-<%= repeater.id %>" 
+	class="form-item--repeater form-item--collapsable form-item--collapsed">
+	<div class="form-item--header">
+		<a class="form-item--collapse-btn" href="#">
+			<span>
+				<i class="fas fa-angle-up"></i> 
+				<%= t('binda.collapse') %>
+			</span>
+			<span>
+				<i class="fas fa-angle-down"></i> 
+				<%= t('binda.expand') %>
+			</span>
+		</a>
+		<a class="form--delete-list-item" 
+			href="<%= repeater_path( id: repeater.id ) %>" 
+			data-id="<%= repeater.id %>" 
+			data-confirm="<%= t 'binda.confirm_delete' %>">
+			<i class="far fa-trash-alt"></i> 
+			<%= t('binda.delete').capitalize %>
+		</a>
+		<p>
+			<%= repeater.field_setting.name %> 
+			<%= t('binda.item') %> 
+			#<%= repeater.id %>	
+		</p>
+	</div>
+	<div class="form-item--repeater-fields form-item--collapsable-stack">
+    <%= f.simple_fields_for "repeaters_attributes[]", repeater do |ff| %>
+    	<%= ff.input :field_setting_id, as: :hidden, input_html: { value: ff.object.field_setting.id } %>
+			<%= ff.input :id, as: :hidden, input_html: { value: ff.object.id } %>
+			<%= ff.input :fieldable_id, as: :hidden %>
+			<%= ff.input :fieldable_type, as: :hidden %>
+			<%# DON'T USE ff.input :position otherwise it will override the order set by rails via ajax when adding a new item %>
+			<% ff.object.field_setting.children.order( :position, :id ).each do |repeater_setting_child| %>
+			  <%= render "binda/fieldable/form_section_repeater", 
+			  	f: ff, 
+			  	repeater_setting_child: repeater_setting_child, 
+			  	repeater: repeater %>
+		  <% end %>
+	  <% end %>
+	</div>
+</li>

data/app/views/binda/structures/_form_field_group_item.html.erb

@@ -0,0 +1,5 @@
+<li id="form--list-item-<%= ff.object.id %>"
+  class="form-item form-item--collapsable form-item--collapsed">
+	<%= render 'binda/structures/form_field_group_item/form_field_group_item_header', f: f, ff: ff %>
+	<%= render 'binda/structures/form_field_group_item/form_field_group_item_editor', f: f, ff: ff %>
+</li>

data/app/views/binda/structures/_form_new_field_group_item.html.erb

@@ -0,0 +1,8 @@
+<%= simple_form_for @structure, defaults: { label: false }, html: { multipart: true }  do |f| %>
+<!-- SPLIT -->
+	<%# see https://stackoverflow.com/questions/32984498/rails-4-adding-child-index-to-dynamically-added-nested-form-fields-with-cocoo %>
+	<%= f.simple_fields_for :field_groups, @field_group, child_index: (Time.now.to_i * rand(10000)) do |ff| %>
+		<%= render 'form_field_group_item', f: f, ff: ff %>
+	<% end %>
+<!-- SPLIT -->
+<% end %>

data/app/views/binda/structures/_form_section.html.erb

@@ -1,80 +1,18 @@
-<div class="standard-form--header">
-  <small>
-  	<%= "#{ t :field_group }".pluralize %>
-  </small>
-</div>
-<%= f.simple_fields_for :field_groups, f.object.field_groups.order( :position, :name ) do |ff| %>
-  <div id="form-item-<%= ff.object.id %>" class="form-item">
-		<%= ff.input :structure_id, as: :hidden %>
-		<%= ff.input :id, as: :hidden %>
-		<div class="standard-form--secondary-header form-item--header form-item--repeater-header">
-			<% if ff.object.slug.nil? %>
-				<a class="form-item--delete-repeater-item form-item--remove-item-with-js"
-			     data-confirm="This operation will delete this setting and all related component content. Are you ok with that?">
-					<i class="far fa-trash-alt"></i> 
-					<%= t('binda.delete').capitalize %>
-			  </a>
-			  <p>
-			  	<%= t('binda.new_item_in_repeater', { arg1: '' })%>		
-			  </p>
-			<% else %>
-				<a href="<%= structure_field_group_path( @structure.slug, ff.object.slug ) %>"
-					class="form-item--edit-item">
-					<i class="fas fa-pencil-alt"></i>
-					<%= t('binda.edit') %>
-				</a>
-				<a href="<%= structure_field_group_path( @structure.slug, ff.object.slug ) %>"
-					class="form-item--delete-repeater-item"
-					data-confirm="<%= t('binda.confirm_delete') %>"
-					data-method="delete">
-					<i class="far fa-trash-alt"></i> 
-					<%= t('binda.delete').capitalize %>
-				</a>
-	      <p><%= ff.object.name %></p>
-			<% end %>
-	  </div>
-		<%= ff.input :name, 
-			label: "#{ t :name }".capitalize, 
-			wrapper_html: { class: "form-item--half-size" }  
-		%>
-    <%= ff.input :slug, 
-    	wrapper_html: { class: "form-item--half-size" } 
-    %>
+<div id="form-section--structure-<%= @structure.id %>" 
+  class="form-section--wide-container standard-form--structure">
+	<div class="standard-form--header">
+	  <small>
+	  	<%= t('binda.field_group.plural') %>
+	  </small>
 	</div>
-<% end %>
-<%= f.simple_fields_for 'new_field_groups[]', @structure.field_groups.build() do |ff| %>
-  <div id="field-group-<%= f.object.id %>--new-form-item" class="form-item form-item--new">
-		<div class="standard-form--secondary-header form-item--header form-item--repeater-header">
-			<a class="form-item--delete-repeater-item form-item--remove-item-with-js"
-		     data-confirm="<%= t('binda.structure.confirm_delete') %>">
-				<i class="far fa-trash-alt"></i> 
-				<%= t('binda.delete').capitalize %>
-		  </a>
-		  <p>
-		  	<%= t('binda.new_item_in_repeater', { arg1: '' })%>
-	  	</p>
-	  </div>
-		<div class="form-item--editor">
-			<%= ff.input :structure_id, as: :hidden %>
-			<%= ff.input :id, as: :hidden %>
-			<%= ff.input :name, label: "#{ t :name }".capitalize, wrapper_html: { class: "form-item--half-size" } %>
-      <%= ff.input :slug, wrapper_html: { class: "form-item--half-size" } %>
+	<% if section.slug.nil? %>
+	  <p class="standard-form--suggestion">
+	  	<%= t( :hint_create_parent_before_child, arg1: "#{ t :structure }", arg2: "#{ t :field_group }" ) %>
+		</p>
+	<% else %>
+    <div class="form-group">
+    	<%= render 'binda/structures/form_section/form_section_header', f: f %>
+    	<%= render 'binda/structures/form_section/form_section_list', f: f %>
 		</div>
-	</div>
-<% end %>
-<% if section.slug.nil? %>
-  <p class="standard-form--suggestion">
-  	<%= t( :hint_create_parent_before_child, arg1: "#{ t :structure }", arg2: "#{ t :field_group }" ).capitalize %>
-	</p>
-<% else %>
-	<div class="standard-form--main-actions">		
-	  <a id="form-item--field-group-<%= f.object.id %>--add-new" 
-	  	class="form-item--add-new main-header--link b-btn b-btn-primary b-btn-settings" 
-	  	href="<%= new_structure_field_group_path( @structure.slug ) %>" 
-	  	data-new-form-item-id="field-group-<%= f.object.id %>--new-form-item">
-    	<i class="fa fa-plus" aria-hidden="true"></i>
-    	<%= t('binda.new') %>
-    	<%= t('binda.field_group.singular') %>	
-	  </a>
-	</div>
-<% end %>
+	<% end %>
+</div>

data/app/views/binda/structures/_form_sidebar.html.erb

@@ -10,14 +10,15 @@
             include_blank: false,
             label_method: -> (x){ "<span class=\"standard-form--input-box\"></span>#{x}".html_safe }%>
 </div>
-<div class="standard-form--radio">
-  <%= f.input :has_preview,
-              label: "<span class=\"standard-form--input-box\"></span>#{ t('binda.has_preview')}".html_safe,
-              as: :boolean,
-              include_blank: false,
-              hint: "#{t('binda.preview_path_warning')}:<br /> #{binda.root_path}#{@structure.slug}/:slug".html_safe %>
-</div>
-
+<% if !@structure.new_record? %>
+  <div class="standard-form--radio">
+    <%= f.input :has_preview,
+                label: "<span class=\"standard-form--input-box\"></span>#{ t('binda.has_preview')}".html_safe,
+                as: :boolean,
+                include_blank: false,
+                hint: "#{t('binda.preview_path_warning')}:<br /> #{binda.root_path}#{@structure.slug}/:slug".html_safe %>
+  </div>
+<% end %>
 <% if !@structure.new_record? && @structure.instance_type == 'component' %>
   <div class="standard-form--radio">
     <%= f.input :has_categories,

data/app/views/binda/structures/form_field_group_item/_form_field_group_item_editor.html.erb

@@ -0,0 +1,18 @@
+<div class="form-item--editor form-item--collapsable-stack">
+	<div class="form-item--half-size">
+		<%= ff.input :name, as: :string, input_html: { class: "form-item--default-input", "test-hook": "structure_field_groups_name" } %>
+	</div>
+	<div class="form-item--half-size">
+		<%= ff.input :slug, as: :string, input_html: { class: "form-item--input" } %>
+	</div>
+	<div class="form-item--full-size">
+		<%= ff.input :description, input_html: { class: "form-item--input tinymce" } %>
+	</div>
+	<%= ff.input :structure_id, as: :hidden %>
+	<%= ff.input :id, as: :hidden %>
+	<%# DON'T USE ff.input :position otherwise it will override the order set by Binda via ajax when adding a new item %>
+	<div class="clearfix"></div>
+	<% if ff.object.field_settings.any? %>
+		<%= render 'binda/structures/form_field_group_item/form_field_group_item_field_settings', ff: ff %>
+	<% end %>
+</div>

data/app/views/binda/structures/form_field_group_item/_form_field_group_item_field_setting_form.html.erb

@@ -0,0 +1,12 @@
+<div class="form-item--half-size">
+	<%= fff.input :name, 
+		label: false,
+		as: :string, 
+		input_html: { class: "form-item--default-input" } %>
+</div>
+<div class="form-item--half-size">
+	<%= fff.input :slug, 
+		label: false,
+		as: :string, 
+		input_html: { class: "form-item--input" } %>
+</div>

data/app/views/binda/structures/form_field_group_item/_form_field_group_item_field_settings.html.erb

@@ -0,0 +1,18 @@
+<div class="standard-form--fields-list">	
+	<div class="form-group">
+		<p class="control-label clearfix">
+			<%= t('binda.field_setting.plural') %>
+		</p>
+		<p class="help-block">
+			<%= t('binda.fields_list_hint') %>
+		</p>
+	</div>
+	<%= ff.simple_fields_for :field_settings, ff.object.field_settings.where(ancestry: nil).order(:position, :name) do |fff| %>
+		<%= render 'binda/structures/form_field_group_item/form_field_group_item_field_setting_form', fff: fff %>
+		<% if fff.object.has_children? %>
+			<%= ff.simple_fields_for :field_settings, fff.object.children.order(:position, :name) do |fff| %>
+				<%= render 'binda/structures/form_field_group_item/form_field_group_item_field_setting_form', fff: fff %>
+			<% end %>
+		<% end %>
+	<% end %>
+</div>

data/app/views/binda/structures/form_field_group_item/_form_field_group_item_header.html.erb

@@ -0,0 +1,29 @@
+<div class="standard-form--secondary-header form-item--header">
+	<a class="form-item--collapse-btn" 
+		href="#"
+		data-sortable-target-id="form--list-<%= ff.object.id %>">
+		<span>
+			<i class="fas fa-angle-up"></i> 
+			<%= t('binda.collapse') %>
+		</span>
+		<span>
+			<i class="fas fa-angle-down"></i> 
+			<%= t('binda.expand') %>
+		</span>
+	</a>
+	<a href="<%= structure_field_group_path( @structure, ff.object ) %>"
+		class="form-item--edit-item">
+		<i class="fas fa-pencil-alt"></i>
+		<%= t('binda.edit') %>
+	</a>
+	<a href="<%= structure_field_group_path( @structure, ff.object ) %>"
+		class="form--delete-list-item"
+		data-id="<%= ff.object.id %>"
+		data-confirm="<%= t('binda.confirm_delete') %>">
+		<i class="far fa-trash-alt"></i> 
+		<%= t('binda.delete').capitalize %>
+	</a>
+  <p>
+  	<%= ff.object.name %>
+  </p>
+</div>