From 079cecc529cbd253a0ac82efea6683f3638c55be Mon Sep 17 00:00:00 2001 From: Mackenzie Morgan Date: Thu, 26 May 2016 16:53:46 -0400 Subject: [PATCH] Swap over to having "(Optional)" (or translation) after optional form elements rather than using placeholder text Fixes #848 --- app/views/gardens/_form.html.haml | 15 ++++++--- app/views/harvests/_form.html.haml | 16 +++++++--- app/views/plantings/_form.html.haml | 32 ++++++++++++++----- app/views/seeds/_form.html.haml | 31 +++++++++++------- config/locales/en.yml | 16 ++++++++++ spec/features/gardens/adding_gardens_spec.rb | 8 ++--- .../harvests/harvesting_a_crop_spec.rb | 6 ++-- .../plantings/planting_a_crop_spec.rb | 12 +++---- spec/features/seeds/adding_seeds_spec.rb | 10 +++--- 9 files changed, 99 insertions(+), 47 deletions(-) diff --git a/app/views/gardens/_form.html.haml b/app/views/gardens/_form.html.haml index 74b33249d..a4ec53331 100644 --- a/app/views/gardens/_form.html.haml +++ b/app/views/gardens/_form.html.haml @@ -16,15 +16,18 @@ .form-group = f.label :description, :class => 'control-label col-md-2' .col-md-8 - = f.text_area :description, :rows => 6, :class => 'form-control', :placeholder => 'optional' + = f.text_area :description, :rows => 6, :class => 'form-control' + %span.help-block.optional + = I18n.t 'optional', :scope => 'forms' .form-group = f.label :location, :class => 'control-label col-md-2' .col-md-8 - = f.text_field :location, :value => @garden.location || current_member.location, :class => 'form-control', :placeholder => 'optional', :maxlength => 255 + = f.text_field :location, :value => @garden.location || current_member.location, :class => 'form-control', :maxlength => 255 + %span.help-block.optional + = I18n.t 'optional', :scope => 'forms' %span.help-block - If you have a location set in your profile, it will be used when - you create a new garden. + = t('.location_helper') - if current_member.location.blank? =link_to "Set your location now.", edit_member_registration_path - else @@ -33,7 +36,9 @@ .form-group = f.label :area, :class => 'control-label col-md-2' .col-md-2 - = f.number_field :area, :class => 'input-small form-control', :placeholder => 'optional' + = f.number_field :area, :class => 'input-small form-control' + %span.help-block.optional + = I18n.t 'optional', :scope => 'forms' .col-md-2 = f.select(:area_unit, Garden::AREA_UNITS_VALUES, {:include_blank => false}, :class => 'form-control') diff --git a/app/views/harvests/_form.html.haml b/app/views/harvests/_form.html.haml index 4dc28c7be..bef3e7dfa 100644 --- a/app/views/harvests/_form.html.haml +++ b/app/views/harvests/_form.html.haml @@ -19,9 +19,11 @@ = link_to "Request new crops.", new_crop_path .form-group - = f.label :harvested_at, 'When?', :class => 'control-label col-md-2', :placeholder => 'optional' + = f.label :harvested_at, 'When?', :class => 'control-label col-md-2' .col-md-2 = f.text_field :harvested_at, :value => @harvest.harvested_at ? @harvest.harvested_at.to_s(:ymd) : '', :class => 'add-datepicker form-control' + %span.help-block.optional + = I18n.t 'optional', :scope => 'forms' .form-group = f.label :quantity, 'How many?', :class => 'control-label col-md-2' @@ -29,20 +31,26 @@ -# Some browsers (eg Firefox for Android) assume "number" means -# "integer" unless you specify step="any": -# http://blog.isotoma.com/2012/03/html5-input-typenumber-and-decimalsfloats-in-chrome/ - = f.number_field :quantity, :class => 'input-small form-control', :step => 'any', :placeholder => 'optional' + = f.number_field :quantity, :class => 'input-small form-control', :step => 'any' + %span.help-block.optional + = I18n.t 'optional', :scope => 'forms' .col-md-2 = f.select(:unit, Harvest::UNITS_VALUES, {:include_blank => false}, :class => 'input-medium form-control') .form-group = f.label :weight_quantity, 'Weighing (in total):', :class => 'control-label col-md-2' .col-md-2 - = f.number_field :weight_quantity, :class => 'input-small form-control', :step => 'any', :placeholder => 'optional' + = f.number_field :weight_quantity, :class => 'input-small form-control', :step => 'any' + %span.help-block.optional + = I18n.t 'optional', :scope => 'forms' .col-md-2 = f.select(:weight_unit, Harvest::WEIGHT_UNITS_VALUES, {:include_blank => false}, :class => 'form-control') .form-group = f.label :description, 'Notes', :class => 'control-label col-md-2' .col-md-8 - = f.text_area :description, :rows => 6, :class => 'form-control', :placeholder => 'optional' + = f.text_area :description, :rows => 6, :class => 'form-control' + %span.help-block.optional + = I18n.t 'optional', :scope => 'forms' .form-group .form-actions.col-md-offset-2.col-md-8 diff --git a/app/views/plantings/_form.html.haml b/app/views/plantings/_form.html.haml index 1e347b35e..7b1b4f690 100644 --- a/app/views/plantings/_form.html.haml +++ b/app/views/plantings/_form.html.haml @@ -23,32 +23,48 @@ = link_to "Add a garden.", new_garden_path .form-group = f.label :planted_at, 'When?', :class => 'control-label col-md-2' - .col-md-2= f.text_field :planted_at, :value => @planting.planted_at ? @planting.planted_at.to_s(:ymd) : '', :class => 'add-datepicker form-control', :placeholder => 'optional' + .col-md-2 + = f.text_field :planted_at, :value => @planting.planted_at ? @planting.planted_at.to_s(:ymd) : '', :class => 'add-datepicker form-control' + %span.help-block.optional + = I18n.t 'optional', :scope => 'forms' .form-group = f.label :quantity, 'How many?', :class => 'control-label col-md-2' .col-md-2 - = f.number_field :quantity, :class => 'form-control', :placeholder => 'optional' + = f.number_field :quantity, :class => 'form-control' + %span.help-block.optional + = I18n.t 'optional', :scope => 'forms' .form-group = f.label :planted_from, 'Planted from:', :class => 'control-label col-md-2' .col-md-8 - = f.select(:planted_from, Planting::PLANTED_FROM_VALUES, {:include_blank => 'optional'}, :class => 'form-control') + = f.select(:planted_from, Planting::PLANTED_FROM_VALUES, {:include_blank => ''}, :class => 'form-control') + %span.help-block.optional + = I18n.t 'optional', :scope => 'forms' .form-group = f.label :sunniness, 'Sun or shade?', :class => 'control-label col-md-2' .col-md-8 - = f.select(:sunniness, Planting::SUNNINESS_VALUES, {:include_blank => 'optional'}, :class => 'form-control') + = f.select(:sunniness, Planting::SUNNINESS_VALUES, {:include_blank => ''}, :class => 'form-control') + %span.help-block.optional + = I18n.t 'optional', :scope => 'forms' .form-group = f.label :description, 'Tell us more about it', :class => 'control-label col-md-2' - .col-md-8= f.text_area :description, :rows => 6, :class => 'form-control', :placeholder => 'optional' + .col-md-8 + = f.text_area :description, :rows => 6, :class => 'form-control' + %span.help-block.optional + = I18n.t 'optional', :scope => 'forms' .form-group = f.label :finished, 'Mark as finished', :class => 'control-label col-md-2' .col-md-8 = f.check_box :finished - %span.help-block - A planting is finished when you've harvested all of the crop, or it dies, or it's otherwise no longer growing in your garden. + %span.help-block.optional + = I18n.t 'optional', :scope => 'forms' + = t('.finish_helper') + .form-group - = f.label :finished_at, 'Finished date', { :class => 'control-label col-md-2', :placeholder => 'optional' } + = f.label :finished_at, 'Finished date', { :class => 'control-label col-md-2' } .col-md-2 = f.text_field :finished_at, :value => @planting.finished_at ? @planting.finished_at.to_s(:ymd) : '', :class => 'add-datepicker form-control', :placeholder => 'optional' + %span.help-block.optional + = I18n.t 'optional', :scope => 'forms' .form-group .form-actions.col-md-offset-2.col-md-8 = f.submit 'Save', :class => 'btn btn-primary' diff --git a/app/views/seeds/_form.html.haml b/app/views/seeds/_form.html.haml index e4682c862..82a169bd9 100644 --- a/app/views/seeds/_form.html.haml +++ b/app/views/seeds/_form.html.haml @@ -16,24 +16,33 @@ Can't find what you're looking for? = link_to "Request new crops.", new_crop_path .form-group - = f.label :quantity, 'Quantity:', :class => 'control-label col-md-2', :placeholder => 'optional' + = f.label :quantity, 'Quantity:', :class => 'control-label col-md-2' .col-md-2 - = f.number_field :quantity, :class => 'form-control', placeholder: 'optional' + = f.number_field :quantity, :class => 'form-control' + %span.help-block.optional + = I18n.t 'optional', :scope => 'forms' .form-group = f.label :plant_before, 'Plant before:', :class => 'control-label col-md-2' .col-md-2 - = f.text_field :plant_before, :class => 'add-datepicker form-control', :value => @seed.plant_before ? @seed.plant_before.to_s(:ymd) : '', placeholder: 'optional' + = f.text_field :plant_before, :class => 'add-datepicker form-control', :value => @seed.plant_before ? @seed.plant_before.to_s(:ymd) : '' + %span.help-block.optional + = I18n.t 'optional', :scope => 'forms' .form-group - = f.label :days_until_maturity_min, 'Days until maturity:', :class => 'control-label col-md-2', :placeholder => 'optional' + = f.label :days_until_maturity_min, 'Days until maturity:', :class => 'control-label col-md-2' %fieldset .col-md-2 - = f.number_field :days_until_maturity_min, :class => 'form-control', placeholder: 'optional' + = f.number_field :days_until_maturity_min, :class => 'form-control' + %span.help-block.optional + = I18n.t 'optional', :scope => 'forms' .col-md-1 = f.label :days_until_maturity_max, 'to', :class => 'control-label' .col-md-2 - = f.number_field :days_until_maturity_max, :class => 'form-control', placeholder: 'optional' + = f.number_field :days_until_maturity_max, :class => 'form-control' + %span.help-block.optional + = I18n.t 'optional', :scope => 'forms' .col-md-1 = f.label :dummy, 'days', :class => 'control-label' + .form-group.required = f.label :organic, 'Organic?', :class => 'control-label col-md-2' .col-md-8 @@ -49,15 +58,13 @@ .form-group = f.label :description, 'Description:', :class => 'control-label col-md-2' .col-md-8 - = f.text_area :description, :rows => 6, :class => 'form-control', :placeholder => 'optional' + = f.text_area :description, :rows => 6, :class => 'form-control' + %span.help-block.optional + = I18n.t 'optional', :scope => 'forms' .form-group .col-md-offset-2.col-md-8 %span.help-block - Are you interested in trading or swapping seeds with other - #{ENV['GROWSTUFF_SITE_NAME']} members? If you - list your seeds as available for trade, other members can - contact you to request seeds. You can list any conditions or - other information in the description, above. + = t('.trade_help', :site_name => ENV['GROWSTUFF_SITE_NAME']) .form-group.required = f.label :tradable_to, 'Will trade:', :class => 'control-label col-md-2' .col-md-8 diff --git a/config/locales/en.yml b/config/locales/en.yml index 480db0e0c..aa3d52424 100644 --- a/config/locales/en.yml +++ b/config/locales/en.yml @@ -2,6 +2,8 @@ # See https://github.com/svenfuchs/rails-i18n/tree/master/rails%2Flocale for starting points. en: + forms: + optional: "(Optional)" unauthorized: read: notification: "You must be signed in to view notifications." @@ -40,12 +42,23 @@ en: title: *browse_crops subtitle: "%{crops_size} total" + gardens: + form: + location_helper: "If you have a location set in your profile, it will be used when + you create a new garden." + seeds: index: title: default: "Everyone's seeds" crop_seeds: "Everyone's %{crop} seeds" owner_seeds: "%{owner} seeds" + form: + trade_help: "Are you interested in trading or swapping seeds with other + %{site_name} members? If you + list your seeds as available for trade, other members can + contact you to request seeds. You can list any conditions or + other information in the description, above." plantings: index: @@ -53,6 +66,9 @@ en: default: "Everyone's plantings" crop_plantings: "Everyone's %{crop} plantings" owner_plantings: "%{owner} plantings" + form: + finish_helper: "A planting is finished when you've harvested all of the crop, or + it dies, or it's otherwise no longer growing in your garden." photos: show: diff --git a/spec/features/gardens/adding_gardens_spec.rb b/spec/features/gardens/adding_gardens_spec.rb index 2f2822c05..14e7db3cd 100644 --- a/spec/features/gardens/adding_gardens_spec.rb +++ b/spec/features/gardens/adding_gardens_spec.rb @@ -14,9 +14,9 @@ feature "Gardens", :js do it "displays required and optional fields properly" do expect(page).to have_selector ".form-group.required", text: "Name" - expect(page).to have_selector 'textarea#garden_description[placeholder="optional"]' - expect(page).to have_selector 'input#garden_location[placeholder="optional"]' - expect(page).to have_selector 'input#garden_area[placeholder="optional"]' + expect(page).to have_selector 'textarea#garden_description + .optional' + expect(page).to have_selector 'input#garden_location + .optional' + expect(page).to have_selector 'input#garden_area + .optional' end scenario "Create new garden" do @@ -34,4 +34,4 @@ feature "Gardens", :js do expect(page).not_to have_content "Garden was successfully created" expect(page).to have_content "Area must be greater than or equal to 0" end -end \ No newline at end of file +end diff --git a/spec/features/harvests/harvesting_a_crop_spec.rb b/spec/features/harvests/harvesting_a_crop_spec.rb index 100bcc98f..c367fd5ea 100644 --- a/spec/features/harvests/harvesting_a_crop_spec.rb +++ b/spec/features/harvests/harvesting_a_crop_spec.rb @@ -19,9 +19,9 @@ feature "Harvesting a crop", :js do it "displays required and optional fields properly" do expect(page).to have_selector ".form-group.required", text: "What did you harvest?" - expect(page).to have_selector 'input#harvest_quantity[placeholder="optional"]' - expect(page).to have_selector 'input#harvest_weight_quantity[placeholder="optional"]' - expect(page).to have_selector 'textarea#harvest_description[placeholder="optional"]' + expect(page).to have_selector 'input#harvest_quantity + .optional' + expect(page).to have_selector 'input#harvest_weight_quantity + .optional' + expect(page).to have_selector 'textarea#harvest_description + .optional' end scenario "Creating a new harvest", :js do diff --git a/spec/features/plantings/planting_a_crop_spec.rb b/spec/features/plantings/planting_a_crop_spec.rb index fc255d313..3bf0813bd 100644 --- a/spec/features/plantings/planting_a_crop_spec.rb +++ b/spec/features/plantings/planting_a_crop_spec.rb @@ -21,12 +21,12 @@ feature "Planting a crop", :js do it "displays required and optional fields properly" do expect(page).to have_selector ".form-group.required", text: "What did you plant?" expect(page).to have_selector ".form-group.required", text: "Where did you plant it?" - expect(page).to have_selector 'input#planting_planted_at[placeholder="optional"]' - expect(page).to have_selector 'input#planting_quantity[placeholder="optional"]' - expect(page).to have_selector 'select#planting_planted_from option', text: 'optional' - expect(page).to have_selector 'select#planting_sunniness option', text: 'optional' - expect(page).to have_selector 'textarea#planting_description[placeholder="optional"]' - expect(page).to have_selector 'input#planting_finished_at[placeholder="optional"]' + expect(page).to have_selector 'input#planting_planted_at + .optional' + expect(page).to have_selector 'input#planting_quantity + .optional' + expect(page).to have_selector 'select#planting_planted_from + .optional' + expect(page).to have_selector 'select#planting_sunniness + .optional' + expect(page).to have_selector 'textarea#planting_description + .optional' + expect(page).to have_selector 'input#planting_finished_at + .optional' end scenario "Creating a new planting" do diff --git a/spec/features/seeds/adding_seeds_spec.rb b/spec/features/seeds/adding_seeds_spec.rb index f3c463b17..95387ade3 100644 --- a/spec/features/seeds/adding_seeds_spec.rb +++ b/spec/features/seeds/adding_seeds_spec.rb @@ -18,14 +18,14 @@ feature "Seeds", :js do it "displays required and optional fields properly" do expect(page).to have_selector ".form-group.required", text: "Crop:" - expect(page).to have_selector 'input#seed_quantity[placeholder="optional"]' - expect(page).to have_selector 'input#seed_plant_before[placeholder="optional"]' - expect(page).to have_selector 'input#seed_days_until_maturity_min[placeholder="optional"]' - expect(page).to have_selector 'input#seed_days_until_maturity_max[placeholder="optional"]' + expect(page).to have_selector 'input#seed_quantity + .optional' + expect(page).to have_selector 'input#seed_plant_before + .optional' + expect(page).to have_selector 'input#seed_days_until_maturity_min + .optional' + expect(page).to have_selector 'input#seed_days_until_maturity_max + .optional' expect(page).to have_selector '.form-group.required', text: 'Organic?' expect(page).to have_selector '.form-group.required', text: 'GMO?' expect(page).to have_selector '.form-group.required', text: 'Heirloom?' - expect(page).to have_selector 'textarea#seed_description[placeholder="optional"]' + expect(page).to have_selector 'textarea#seed_description + .optional' expect(page).to have_selector '.form-group.required', text: 'Will trade:' end