Replace registration-period datepickers with date input

Nowadays all browsers have reasonable date input support...

app/assets/javascripts/osem-datepickers.js

@@ -25,17 +25,6 @@ $(function () {
        format: "YYYY-MM-DD"
    });
 
-   // today <= start_registration <= end_registration <= end_conference
-   var end_conference = $('form').data('end-conference');
-
-   $('#registration-period-start-datepicker').datetimepicker({
-       format: 'YYYY-MM-DD'
-   });
-
-   $('#registration-period-end-datepicker').datetimepicker({
-       format: 'YYYY-MM-DD'
-   });
-
   $("#conference-start-datepicker").on("dp.change",function (e) {
       $('#conference-end-datepicker').data("DateTimePicker").minDate(e.date);
       if (!$('#conference-end-datepicker').val()) {
@@ -55,13 +44,4 @@ $(function () {
       $('#conference-end-datepicker').val()?$('#conference-start-datepicker').data("DateTimePicker").maxDate(e.date):$('#conference-start-datepicker').data("DateTimePicker").maxDate(null);
   });
 
-  $("#registration-period-start-datepicker").on("dp.change",function (e) {
-      $('#registration-period-end-datepicker').data("DateTimePicker").minDate(e.date);
-      if (!$('#registration-period-end-datepicker').val()) {
-         $('#registration-period-end-datepicker').data("DateTimePicker").date(e.date);
-      }
-  });
-  $("#registration-period-end-datepicker").on("dp.change",function (e) {
-      $('#registration-period-start-datepicker').data("DateTimePicker").maxDate(e.date);
-  });
 } );

app/models/cfp.rb

@@ -125,7 +125,7 @@ class Cfp < ApplicationRecord
 
   def start_after_end_date
     errors
-    .add(:start_date, "can't be after the end date") if start_date && end_date && start_date > end_date
+    .add(:start_date, "can't be after the end date") if start_date > end_date
   end
 
   def conference_id

app/models/registration_period.rb

@@ -6,21 +6,32 @@ class RegistrationPeriod < ApplicationRecord
   has_paper_trail ignore: [:updated_at], meta: { conference_id: :conference_id }
 
   validates :start_date, :end_date, presence: true
-  validate :before_end_of_conference
+  validate :start_before_end_of_conference
+  validate :end_before_end_of_conference
   validate :start_date_before_end_date
 
   private
 
-  def before_end_of_conference
-    errors
-    .add(:start_date, "can't be after the conference end date (#{conference.end_date})") if conference&.end_date && start_date && (start_date > conference.end_date)
+  def start_before_end_of_conference
+    return unless conference
+    return unless start_date
 
     errors
-    .add(:end_date, "can't be after the conference end date (#{conference.end_date})") if conference&.end_date && end_date && (end_date > conference.end_date)
+    .add(:start_date, "can't start after the conference end date (#{conference.end_date})") if start_date > conference.end_date
+  end
+
+  def end_before_end_of_conference
+    return unless conference
+    return unless end_date
+
+    errors
+    .add(:end_date, "can't end after the conference end date (#{conference.end_date})") if end_date > conference.end_date
   end
 
   def start_date_before_end_date
+    return unless start_date && end_date
+
     errors
-    .add(:start_date, "can't be after the end date") if start_date && end_date && start_date > end_date
+    .add(:start_date, "can't be after the end date") if start_date > end_date
   end
 end

app/views/admin/cfps/_form.html.haml

@@ -2,10 +2,12 @@
   = f.hidden_field :cfp_type
   .form-group
     = f.label :start_date, "Start Date"
-    = f.text_field :start_date, class: 'form-control', id: 'registration-period-start-datepicker', start_date: @conference.start_date, end_date: @conference.end_date
+    %abbr{title: 'This field is required'} *
+    = f.date_field :start_date, class: 'form-control', required: true
   .form-group
     = f.label :end_date, "End Date"
-    = f.text_field :end_date, class: 'form-control', id: 'registration-period-end-datepicker', start_date: @conference.start_date, end_date: @conference.end_date
+    %abbr{title: 'This field is required'} *
+    = f.date_field :end_date, class: 'form-control', required: true
   .form-group
     = f.label :description, "Description"
     = f.text_area :description, rows: 2, data: { provide: 'markdown' }

app/views/admin/registration_periods/_form.html.haml

@@ -1,11 +1,20 @@
+%p
+  Setup the time frame in which people can registrer to your conference
 = form_for(@registration_period, url: admin_conference_registration_period_path(@conference.short_title)) do |f|
   .form-group
     = f.label :start_date
     %abbr{title: 'This field is required'} *
-    = f.text_field :start_date, required: true, 'data-end-conference': @conference.end_date.to_s, id: 'registration-period-start-datepicker', class: 'form-control'
+    %p.small
+      Must be before conference end (#{@conference.end_date}) and the end date
+      - if @registration_period.end_date
+        (#{@registration_period.end_date})
+      below
+    = f.date_field :start_date, required: true, class: 'form-control', max: @conference.end_date, required: true
   .form-group
     = f.label :end_date
     %abbr{title: 'This field is required'} *
-    = f.text_field :end_date, required: true, id: 'registration-period-end-datepicker', class: 'form-control'
+    %p.small
+      Must be before conference end (#{@conference.end_date})
+    = f.date_field :end_date, required: true, class: 'form-control', max: @conference.end_date, required: true
   %p.text-right
     = f.submit 'Save Registration Period', class: 'btn btn-primary'

app/views/tracks/_form_fields.html.haml

@@ -13,12 +13,12 @@
   = f.color_field :color, size: 6, required: true, class: 'form-control'
 .form-group
   = f.label :start_date, "Start Date"
-  = f.text_field :start_date, id: 'registration-period-start-datepicker', start_date: @conference.start_date, end_date: @conference.end_date, required: @track.self_organized_and_accepted_or_confirmed?, class: 'form-control'
+  = f.date_field :start_date, required: @track.self_organized_and_accepted_or_confirmed?, class: 'form-control'
   - if @track.self_organized_and_accepted_or_confirmed?
     %abbr{title: 'This field is required'} *
 .form-group
   = f.label :end_date, "End Date"
-  = f.text_field :end_date, id: 'registration-period-end-datepicker', required: @track.self_organized_and_accepted_or_confirmed?, class: 'form-control'
+  = f.date_field :end_date, required: @track.self_organized_and_accepted_or_confirmed?, class: 'form-control'
   - if @track.self_organized_and_accepted_or_confirmed?
     %abbr{title: 'This field is required'} *
 - if current_user.is_admin?

spec/features/registration_periods_spec.rb

@@ -16,62 +16,31 @@ feature RegistrationPeriod do
       click_link 'New Registration Period'
     end
 
-    scenario 'requires start date and end date', feature: true do
-      visit admin_conference_registration_period_path(conference_id: conference)
-      click_link 'New Registration Period'
-
-      click_button 'Save Registration Period'
-      page.find('#flash')
-      expect(flash)
-          .to eq('An error prohibited the Registration Period from being saved: ' \
-          "Start date can't be blank. End date can't be blank.")
-    end
-
     context 'with tickets' do
       let!(:registration_ticket) do
         create(:registration_ticket, conference: conference)
       end
 
       it 'creates registration period', feature: true, js: true do
-        page
-            .execute_script("$('#registration-period-start-datepicker').val('" +
-                               "#{start_date.strftime('%d/%m/%Y')}')")
-        page
-            .execute_script("$('#registration-period-end-datepicker').val('" +
-                               "#{end_date.strftime('%d/%m/%Y')}')")
-
+        fill_in 'registration_period_start_date', with: start_date.strftime('%Y/%m/%d')
+        fill_in 'registration_period_end_date', with: end_date.strftime('%Y/%m/%d')
         click_button 'Save Registration Period'
         page.find('#flash')
         expect(flash).to eq('Registration Period successfully updated.')
         expect(current_path).to eq(admin_conference_registration_period_path(conference.short_title))
         expect(page).to have_text("Ticket required?\nYes")
-
-        registration_period = RegistrationPeriod.where(conference_id: conference.id).first
-        registration_period.reload
-        expect(registration_period.start_date).to eq(start_date)
-        expect(registration_period.end_date).to eq(end_date)
       end
     end
 
     context 'without tickets' do
       it 'creates registration period', feature: true, js: true do
-        page
-            .execute_script("$('#registration-period-start-datepicker').val('" +
-                               "#{start_date.strftime('%d/%m/%Y')}')")
-        page
-            .execute_script("$('#registration-period-end-datepicker').val('" +
-                               "#{end_date.strftime('%d/%m/%Y')}')")
-
+        fill_in 'registration_period_start_date', with: start_date.strftime('%Y-%m-%d')
+        fill_in 'registration_period_end_date', with: end_date.strftime('%Y-%m-%d')
         click_button 'Save Registration Period'
         page.find('#flash')
         expect(flash).to eq('Registration Period successfully updated.')
         expect(current_path).to eq(admin_conference_registration_period_path(conference.short_title))
         expect(page).to have_text("Ticket required?\nNo")
-
-        registration_period = RegistrationPeriod.where(conference_id: conference.id).first
-        registration_period.reload
-        expect(registration_period.start_date).to eq(start_date)
-        expect(registration_period.end_date).to eq(end_date)
       end
     end
   end