diff --git a/app/assets/javascripts/recipes.js b/app/assets/javascripts/recipes.js index b53ab14..cad7acf 100644 --- a/app/assets/javascripts/recipes.js +++ b/app/assets/javascripts/recipes.js @@ -1,25 +1,72 @@ (function($) { function reorder($container) { + console.log($container); $container.find("div.nested-fields").each(function(idx, editor) { var $editor = $(editor); - $editor.find('input.sort-order').val(idx + 1).trigger("changed"); + $editor.find('input.sort_order').val(idx + 1).trigger("changed"); }) } function initializeIngredientEditor($container, ingredientSearchEngine) { - $container.find(".ingredient-typeahead").typeahead({ + // $container is either an element that contains many editors, or a single editor. + var $editors = $container.find(".ingredient-typeahead").closest(".nested-fields"); - }, - { - name: 'ingredients', - source: ingredientSearchEngine, - display: function(datum) { - return datum.name; + $editors.each(function(idx, elem) { + var $editor = $(elem); + var $ingredientId = $editor.find("input.ingredient_id"); + var $customDensity = $editor.find("input.custom_density"); + var $group = $editor.find("div.typeahead-group"); + + $editor.find(".ingredient-typeahead").typeahead({}, + { + name: 'ingredients', + source: ingredientSearchEngine, + display: function(datum) { + return datum.name; + } + }); + + if ($ingredientId.val().length) { + $customDensity.prop('disabled', true); + $group.addClass("has-success"); } }); } + function ingredientItemPicked($typeahead, datum) { + var $container = $typeahead.closest(".nested-fields"); + var $ingredientId = $container.find("input.ingredient_id"); + var $customDensity = $container.find("input.custom_density"); + var $group = $container.find("div.typeahead-group"); + + $ingredientId.val(datum.id); + $typeahead.typeahead('val', datum.name); + $customDensity.val(datum.density).prop('disabled', true); + $group.addClass("has-success"); + } + + function ingredientNameChange($typeahead, ingredientSearchEngine) { + var $container = $typeahead.closest(".nested-fields"); + var $ingredientId = $container.find("input.ingredient_id"); + var $customDensity = $container.find("input.custom_density"); + var $group = $container.find("div.typeahead-group"); + + var id = $ingredientId.val(); + var value = $typeahead.typeahead('val'); + + if (id && id.length) { + var found = ingredientSearchEngine.get([id]); + if (found && found[0] && found[0].name != value) { + // User has chosen something custom + $ingredientId.val(''); + $customDensity.val('').prop('disabled', false); + + $group.removeClass("has-success"); + } + } + } + $(document).on("ready page:load", function() { var ingredientSearchEngine = new Bloodhound({ @@ -66,11 +113,23 @@ $ingredientList .on("cocoon:after-insert", function(e, item) { - reorder($(this)); + reorder($ingredientList); initializeIngredientEditor(item, ingredientSearchEngine); }) .on("cocoon:after-remove", function(e, item) { - reorder($(this)); + reorder($ingredientList); + }) + .on("typeahead:change", function(evt, value) { + console.log("changed"); + ingredientNameChange($(evt.target), ingredientSearchEngine); + }) + .on("typeahead:select", function(evt, value) { + console.log("selected"); + ingredientItemPicked($(evt.target), value); + }) + .on("typeahead:autocomplete", function(evt, value) { + console.log("autocomplete"); + ingredientItemPicked($(evt.target), value); }); }); diff --git a/app/assets/stylesheets/recipes.scss b/app/assets/stylesheets/recipes.scss index 84856d2..55878ba 100644 --- a/app/assets/stylesheets/recipes.scss +++ b/app/assets/stylesheets/recipes.scss @@ -3,7 +3,6 @@ // You can use Sass (SCSS) here: http://sass-lang.com/ @mixin editor { - @extend .panel-body; } div.ingredient-editor { diff --git a/app/controllers/ingredients_controller.rb b/app/controllers/ingredients_controller.rb index 5de893c..dec2aef 100644 --- a/app/controllers/ingredients_controller.rb +++ b/app/controllers/ingredients_controller.rb @@ -1,5 +1,5 @@ class IngredientsController < ApplicationController - before_action :set_ingredient, only: [:show, :edit, :update, :destroy] + before_action :set_ingredient, only: [:edit, :update, :destroy] # GET /ingredients # GET /ingredients.json @@ -7,11 +7,6 @@ class IngredientsController < ApplicationController @ingredients = Ingredient.all.order(:name) end - # GET /ingredients/1 - # GET /ingredients/1.json - def show - end - # GET /ingredients/new def new @ingredient = Ingredient.new diff --git a/app/models/recipe_ingredient.rb b/app/models/recipe_ingredient.rb index c157510..7b58012 100644 --- a/app/models/recipe_ingredient.rb +++ b/app/models/recipe_ingredient.rb @@ -6,4 +6,20 @@ class RecipeIngredient < ActiveRecord::Base validates :sort_order, presence: true validates :custom_density, density: true, allow_blank: true + def custom_name + if self.ingredient_id.present? + self.ingredient.name + else + super + end + end + + def custom_density + if self.ingredient_id.present? + self.ingredient.density + else + super + end + end + end diff --git a/app/views/ingredients/edit.html.erb b/app/views/ingredients/edit.html.erb index 039d4ab..e600543 100644 --- a/app/views/ingredients/edit.html.erb +++ b/app/views/ingredients/edit.html.erb @@ -5,7 +5,6 @@ <%= render 'form' %> - <%= link_to 'Show', @ingredient, class: 'btn btn-primary' %> | <%= link_to 'Back', ingredients_path, class: 'btn btn-primary' %> diff --git a/app/views/ingredients/index.html.erb b/app/views/ingredients/index.html.erb index 70447e7..f1811cb 100644 --- a/app/views/ingredients/index.html.erb +++ b/app/views/ingredients/index.html.erb @@ -16,10 +16,8 @@ <% @ingredients.each do |ingredient| %> - <%= ingredient.name %> + <%= link_to ingredient.name, edit_ingredient_path(ingredient) %> <%= ingredient.density %> - <%= link_to 'Show', ingredient %> - <%= link_to 'Edit', edit_ingredient_path(ingredient) %> <%= link_to 'Destroy', ingredient, method: :delete, data: { confirm: 'Are you sure?' } %> <% end %> diff --git a/app/views/ingredients/show.html.erb b/app/views/ingredients/show.html.erb deleted file mode 100644 index 5fc466c..0000000 --- a/app/views/ingredients/show.html.erb +++ /dev/null @@ -1,13 +0,0 @@ - -
-
- -

<%= @ingredient.name %>

- -

<%= @ingredient.notes %>

- - <%= link_to 'Edit', edit_ingredient_path(@ingredient), class: 'btn btn-default' %> - <%= link_to 'Back', ingredients_path, class: 'btn btn-default' %> - -
-
\ No newline at end of file diff --git a/app/views/ingredients/show.json.jbuilder b/app/views/ingredients/show.json.jbuilder deleted file mode 100644 index bc463f5..0000000 --- a/app/views/ingredients/show.json.jbuilder +++ /dev/null @@ -1 +0,0 @@ -json.extract! @ingredient, :id, :created_at, :updated_at diff --git a/app/views/recipes/editor/_ingredient.html.erb b/app/views/recipes/editor/_ingredient.html.erb index 7d402d0..1493b6e 100644 --- a/app/views/recipes/editor/_ingredient.html.erb +++ b/app/views/recipes/editor/_ingredient.html.erb @@ -1,12 +1,12 @@ -
-
+
+
-
+
<%= f.label :custom_name, "Name" %> - <%= f.text_field :custom_name, class: 'form-control ingredient-typeahead' %> + <%= f.text_field :custom_name, class: 'form-control ingredient-typeahead custom_name' %>
@@ -27,7 +27,7 @@
<%= f.label :custom_density, "Density" %> - <%= f.text_field :custom_density, class: 'form-control' %> + <%= f.text_field :custom_density, class: 'form-control custom_density' %>
@@ -40,6 +40,7 @@
- <%= f.hidden_field :sort_order, class: 'sort-order' %> + <%= f.hidden_field :ingredient_id, class: 'ingredient_id' %> + <%= f.hidden_field :sort_order, class: 'sort_order' %>
\ No newline at end of file diff --git a/app/views/recipes/editor/_step.html.erb b/app/views/recipes/editor/_step.html.erb index 968b765..9554c5b 100644 --- a/app/views/recipes/editor/_step.html.erb +++ b/app/views/recipes/editor/_step.html.erb @@ -19,7 +19,7 @@
- <%= f.hidden_field :sort_order, class: 'sort-order' %> + <%= f.hidden_field :sort_order, class: 'sort_order' %>
\ No newline at end of file diff --git a/config/routes.rb b/config/routes.rb index 70c518e..35fcf0a 100644 --- a/config/routes.rb +++ b/config/routes.rb @@ -1,7 +1,8 @@ Rails.application.routes.draw do resources :recipes - resources :ingredients do + + resources :ingredients, except: [:show] do collection do constraints format: 'json' do get :search diff --git a/db/seeds.rb b/db/seeds.rb index b7e218a..0b4187a 100644 --- a/db/seeds.rb +++ b/db/seeds.rb @@ -10,6 +10,7 @@ puts "Seeding..." Ingredient.create!([ + {name: 'Water', density: '1 g/ml'}, {name: 'Butter, Salted', density: '226 gram/cup'}, {name: 'Butter, Unsalted', density: '226 gram/cup'}, {name: 'Flour, Bleached All Purpose', density: '130 gram/cup'},