KG - Datepicker Modifications

Gemfile

@@ -10,7 +10,7 @@ gem 'autoprefixer-rails'
 gem 'axlsx_rails'
 gem 'bootstrap-sass'
 gem 'bootstrap-select-rails'
-gem 'bootstrap3-datetimepicker-rails', '~> 4.0.0'
+gem 'bootstrap3-datetimepicker-rails', '~> 4.17.37'
 gem 'coffee-rails', '~> 4.0.0'
 gem 'daemons'
 gem 'delayed_job_active_record'
@@ -23,7 +23,7 @@ gem 'haml-rails'
 gem 'hashie-forbidden_attributes'
 gem 'jquery-rails'
 gem 'jbuilder', '~> 2.0'
-gem 'momentjs-rails', '>= 2.8.1'
+gem 'momentjs-rails', '>= 2.9.0'
 gem 'mysql2'
 gem 'net-ldap'
 gem 'omniauth'

Gemfile.lock

@@ -68,7 +68,7 @@ GEM
       autoprefixer-rails (>= 5.0.0.1)
       sass (>= 3.2.19)
     bootstrap-select-rails (1.6.3)
-    bootstrap3-datetimepicker-rails (4.0.0)
+    bootstrap3-datetimepicker-rails (4.17.37)
       momentjs-rails (>= 2.8.1)
     builder (3.2.2)
     capistrano (3.4.0)
@@ -420,7 +420,7 @@ DEPENDENCIES
   axlsx_rails
   bootstrap-sass
   bootstrap-select-rails
-  bootstrap3-datetimepicker-rails (~> 4.0.0)
+  bootstrap3-datetimepicker-rails (~> 4.17.37)
   capistrano (~> 3.0)
   capistrano-passenger
   capistrano-rails (~> 1.1)
@@ -445,7 +445,7 @@ DEPENDENCIES
   jbuilder (~> 2.0)
   jquery-rails
   launchy
-  momentjs-rails (>= 2.8.1)
+  momentjs-rails (>= 2.9.0)
   mysql2
   net-ldap
   omniauth

app/assets/javascripts/appointments.js.coffee

@@ -106,10 +106,9 @@ $ ->
           url: "/appointments/#{appointment_id}.js"
 
   # Procedure buttons
-
   $(document).on 'dp.hide', ".completed_date_field", ->
     procedure_id = $(this).parents(".procedure").data("id")
-    completed_date = $(this).children("input").val()
+    completed_date = $(this).val()
     data = procedure:
             completed_date: completed_date
     $.ajax
@@ -118,8 +117,8 @@ $ ->
       data: data
 
   $(document).on 'dp.hide', ".followup_procedure_datepicker", ->
-    task_id = $(this).children("input").data("taskId")
-    due_at = $(this).children("input").val()
+    task_id = $(this).data("taskId")
+    due_at = $(this).val()
     data = task:
             due_at: due_at
     $.ajax
@@ -295,7 +294,9 @@ $ ->
       url: "/procedures/#{procedure_id}.js"
 
   window.start_date_init = (date) ->
-    $('#start_date').datetimepicker(defaultDate: date)
+    $('#start_date').datetimepicker
+      defaultDate: date
+      ignoreReadonly: true
     $('#start_date').on 'dp.hide', (e) ->
       appointment_id = $(this).parents('.row.appointment').data('id')
       data = appointment: start_date: e.date.toDate().toUTCString()
@@ -308,7 +309,9 @@ $ ->
             $('#completed_date').data("DateTimePicker").minDate(e.date)
 
   window.completed_date_init = (date) ->
-    $('#completed_date').datetimepicker(defaultDate: date)
+    $('#completed_date').datetimepicker
+      defaultDate: date
+      ignoreReadonly: true
     $('#start_date').data("DateTimePicker").maxDate($('#completed_date').data("DateTimePicker").date())
     $('#completed_date').data("DateTimePicker").minDate($('#start_date').data("DateTimePicker").date())
     $('#completed_date').on 'dp.hide', (e) ->

app/views/appointments/_followup_calendar.html.haml

@@ -1,8 +1,6 @@
 - if procedure.task.present?
-  .input-group.date.followup_procedure_datepicker
-    %input{type: "text", class: "form-control", value: format_date(procedure.task.due_at), id: "follow_up_datepicker_#{procedure.id}", data:{task_id: procedure.task.id}}
-    %span.input-group-addon
-      %span.glyphicon.glyphicon-calendar
+  .input-group.date
+    %input{type: "text", class: "form-control followup_procedure_datepicker", value: format_date(procedure.task.due_at), id: "follow_up_datepicker_#{procedure.id}", readonly: true, data:{task_id: procedure.task.id}}
 - else
   -# div used for capturing click events when button is disabled
   .btn-group{class: "#{ procedure.appt_started? ? '' : 'pre_start_disabled' }"}

app/views/appointments/_procedure.html.haml

@@ -12,10 +12,8 @@
   %td.followup{id: "follow_up_#{procedure.id}"}
     = render partial: "/appointments/followup_calendar", locals: { procedure: procedure }
   %td.completed-date
-    .input-group.date.completed_date_field
-      %input.datetimepicker{type: "text", class: "form-control", disabled: !(procedure.appt_started? && procedure.complete?), value: format_date(procedure.completed_date)}
-      %span.input-group-addon{ class: "#{ procedure.appt_started? ? '' : 'pre_start_disabled' }" }
-        %span.glyphicon.glyphicon-calendar
+    .input-group.date
+      %input.datetimepicker{type: "text", class: "form-control completed_date_field", disabled: !(procedure.appt_started? && procedure.complete?), value: format_date(procedure.completed_date), readonly: true}
   %td.performed-by
     = select_tag "performed-by-#{procedure.id}", options_for_select(procedure.performable_by, procedure.performer_id), include_blank: "N/A", class: "performed-by-dropdown selectpicker", data: { width: '125px' }, 'showIcon' => false
   %td.notes

app/views/appointments/_start_complete_buttons.html.haml

@@ -3,7 +3,8 @@
     %form.form-horizontal
       .form-group
         %label.col-xs-1.control-label#start-date-label{for: 'start_date'}= t(:appointment)[:start_date]
-        .col-xs-6= text_field_tag 'start_date', '', class: 'form-control'
+        .col-xs-6
+          = text_field_tag 'start_date', '', class: 'form-control', readonly: true
         .col-xs-1.reset_button
           %button.btn.btn-warning.reset_visit{type: "button"}= t(:appointment)[:reset_visit]
 
@@ -15,7 +16,8 @@
     %form.form-horizontal
       .form-group
         %label.col-xs-1.control-label#completed-date-label{for: 'completed_date'}= t(:appointment)[:completed_date]
-        .col-xs-6= text_field_tag 'completed_date', '', class: 'form-control'
+        .col-xs-6
+          = text_field_tag 'completed_date', '', class: 'form-control', readonly: true
         .col-xs-1#remove_completed_date_button
           %button.btn.btn-danger.uncomplete_visit{type: "button"}
             %span.glyphicon.glyphicon-remove

app/views/appointments/show.js.coffee

@@ -21,7 +21,12 @@ statuses[statuses.length] =  "<%= status %>"
 $('#appointment_indications').selectpicker()
 $('#appointment_indications').selectpicker('val', statuses)
 
-$(".followup_procedure_datepicker").datetimepicker(format: 'MM-DD-YYYY')
-$(".completed_date_field").datetimepicker(format: 'MM-DD-YYYY')
+$(".followup_procedure_datepicker").datetimepicker
+  format: 'MM-DD-YYYY'
+  ignoreReadonly: true
+
+$(".completed_date_field").datetimepicker
+  format: 'MM-DD-YYYY'
+  ignoreReadonly: true
 
 $('.row.appointment [data-toggle="tooltip"]').tooltip()

app/views/fulfillments/edit.js.coffee

@@ -1,4 +1,6 @@
 $("#modal_area").html("<%= escape_javascript(render(:partial =>'study_level_activities/fulfillment_form', locals: {line_item: @line_item, fulfillment: @fulfillment, clinical_providers: @clinical_providers, header_text: 'Edit Fulfillment'})) %>");
 $("#modal_place").modal 'show'
-$("#date_fulfilled_field").datetimepicker(format: 'MM-DD-YYYY')
+$("#date_fulfilled_field").datetimepicker
+  format: 'MM-DD-YYYY'
+  ignoreReadonly: true
 $(".selectpicker").selectpicker()

app/views/fulfillments/new.js.coffee

@@ -1,4 +1,6 @@
 $("#modal_area").html("<%= escape_javascript(render(:partial =>'study_level_activities/fulfillment_form', locals: {line_item: @line_item, fulfillment: @fulfillment, component: @component, clinical_providers: @clinical_providers, header_text: 'Create New Fulfillment'})) %>");
 $("#modal_place").modal 'show'
-$("#date_fulfilled_field").datetimepicker(format: 'MM-DD-YYYY')
+$("#date_fulfilled_field").datetimepicker
+  format: 'MM-DD-YYYY'
+  ignoreReadonly: true
 $(".selectpicker").selectpicker()

app/views/line_items/edit.js.coffee

@@ -1,6 +1,8 @@
 <% if @otf %> # study level activities line item edit
 $("#modal_area").html("<%= escape_javascript(render(:partial =>'study_level_activities/study_level_activity_form', locals: {protocol: @protocol, line_item: @line_item, header_text: t(:line_item)[:edit]})) %>");
-$("#date_started_field").datetimepicker(format: 'MM-DD-YYYY')
+$("#date_started_field").datetimepicker
+  format: 'MM-DD-YYYY'
+  ignoreReadonly: true
 <% else %> # study schedule line item edit
 $("#modal_area").html("<%= escape_javascript(render(:partial =>'study_schedule/management/manage_services/change_service_form', locals: {line_item: @line_item})) %>");
 <% end %>

app/views/line_items/new.js.coffee

@@ -1,4 +1,6 @@
 $("#modal_area").html("<%= escape_javascript(render(:partial =>'study_level_activities/study_level_activity_form', locals: {protocol: @protocol, line_item: @line_item, header_text: t(:line_item)[(is_protocol_type_study?(@protocol)) ? :create : :create_project]})) %>");
 $("#modal_place").modal 'show'
-$("#date_started_field").datetimepicker(format: 'MM-DD-YYYY')
+$("#date_started_field").datetimepicker
+  format: 'MM-DD-YYYY'
+  ignoreReadonly: true
 $(".selectpicker").selectpicker()

app/views/participants/_participant_form.html.haml

@@ -34,10 +34,7 @@
             .form-group
               = p.label "date_of_birth", t(:participant)[:dob]+t(:actions)[:required], class: "col-sm-4 control-label "
               .col-sm-7
-                .input-group#dob_time_picker
-                  = p.text_field "date_of_birth", {class: 'form-control datetimepicker', value: format_date(participant.date_of_birth)}
-                  %span.input-group-addon
-                    %span.glyphicon.glyphicon-calendar
+                = p.text_field "date_of_birth", {id: 'dob_time_picker', class: 'form-control datetimepicker', value: format_date(participant.date_of_birth), readonly: true}
             .form-group
               = p.label "gender", t(:participant)[:gender]+t(:actions)[:required], class: "col-sm-4 control-label"
               .col-sm-7= p.select "gender", Participant::GENDER_OPTIONS, {include_blank: true}, :class => "form-control selectpicker"

app/views/participants/edit.js.coffee

@@ -1,5 +1,8 @@
 $("#modal_area").html("<%= escape_javascript(render(:partial =>'participants/participant_form', locals: {protocol: @protocol, participant: @participant, header_text: 'Edit Participant'})) %>");
 $("#modal_place").modal 'show'
-$("#dob_time_picker").datetimepicker(format: 'MM-DD-YYYY', viewMode: 'years')
+$("#dob_time_picker").datetimepicker
+  format: 'MM-DD-YYYY'
+  ignoreReadonly: true
+  viewMode: 'years'
 $(".selectpicker").selectpicker()
 

app/views/participants/new.js.coffee

@@ -1,4 +1,7 @@
 $("#modal_area").html("<%= escape_javascript(render(:partial =>'participants/participant_form', locals: {protocol: @protocol, participant: @participant, header_text: 'Create New Participant'})) %>");
 $("#modal_place").modal 'show'
-$("#dob_time_picker").datetimepicker(format: 'MM-DD-YYYY', viewMode: 'years')
+$("#dob_time_picker").datetimepicker
+  format: 'MM-DD-YYYY'
+  ignoreReadonly: true
+  viewMode: 'years'
 $(".selectpicker").selectpicker()

app/views/procedures/_edit.html.haml

@@ -18,10 +18,7 @@
         .form-group
           = form.label "due_at", t(:procedure)[:follow_up_date], class: "col-sm-3 control-label"
           .col-sm-8
-            .input-group.date#follow_up_procedure_datepicker
-              = form.text_field :due_at, {class: 'form-control'}
-              %span.input-group-addon
-                %span.glyphicon.glyphicon-calendar
+            = form.text_field :due_at, {class: 'form-control datetimepicker', id: "follow_up_procedure_datepicker", readonly: true}
         .form-group
           = form.fields_for :notes, Note.new do |notes_form|
             = notes_form.hidden_field :notable_type, value: 'Procedure'

app/views/procedures/create.js.coffee

@@ -1,12 +1,14 @@
 core = $(".core[data-core-id='<%= @procedures.first.sparc_core_id %>']")
 
-$(".completed_date_field").datetimepicker(format: 'MM-DD-YYYY')
-
 if core.length == 0
   $(".row.calendar .col-xs-12").append("<%= escape_javascript(render partial: 'appointments/core', locals: {core_id: @procedures.first.sparc_core_id, procedures: @procedures, appointment: @appointment}) %>")
 else
   core.find("tbody").append("<%= escape_javascript(render partial: 'appointments/procedure', collection: @procedures, as: :procedure) %>")
 
 $(".selectpicker").selectpicker()
 
+$(".completed_date_field").datetimepicker
+  format: 'MM-DD-YYYY'
+  ignoreReadonly: true
+
 update_complete_visit_button(<%= @appointment.can_finish? %>)

app/views/procedures/edit.js.coffee

@@ -1,5 +1,7 @@
 $("#modal_area").html("<%= escape_javascript(render(partial: 'edit', locals: { procedure: @procedure, task: @task, clinical_providers: @clinical_providers})) %>")
-$("#follow_up_procedure_datepicker").datetimepicker(format: 'MM-DD-YYYY')
+$("#follow_up_procedure_datepicker").datetimepicker
+  format: 'MM-DD-YYYY'
+  ignoreReadonly: true
 $("#modal_place").modal 'show'
 
 $(".selectpicker").selectpicker()

app/views/reports/_auditing_report.html.haml

@@ -17,10 +17,12 @@
               .col-sm-9= text_field_tag "title", title, class: "form-control"
             .form-group
               = label_tag "start_date", t(:reports)[:start_date], class: "col-sm-3 control-label"
-              .col-sm-9= text_field_tag "start_date", nil, class: "datepicker form-control"
+              .col-sm-9
+                = text_field_tag "start_date", nil, class: "datepicker form-control", readonly: true
             .form-group
               = label_tag "end_date", t(:reports)[:end_date], class: "col-sm-3 control-label"
-              .col-sm-9= text_field_tag "end_date", nil, class: "datepicker form-control"
+              .col-sm-9
+                = text_field_tag "end_date", nil, class: "datepicker form-control", readonly: true
             .form-group
               = label_tag "protocol", t(:reports)[:protocols], class: "col-sm-3 control-label"
               .col-sm-9

app/views/reports/_invoice_report.html.haml

@@ -19,11 +19,11 @@
             .form-group
               = label_tag "start_date", t(:reports)[:start_date], class: "col-sm-3 control-label"
               .col-sm-9
-                = text_field_tag "start_date", nil, class: "datepicker form-control"
+                = text_field_tag "start_date", nil, class: "datepicker form-control", readonly: true
             .form-group
               = label_tag "end_date", t(:reports)[:end_date], class: "col-sm-3 control-label"
               .col-sm-9
-                = text_field_tag "end_date", nil, class: "datepicker form-control"
+                = text_field_tag "end_date", nil, class: "datepicker form-control", readonly: true
             .form-group
               = label_tag "protocol", t(:reports)[:protocols], class: "col-sm-3 control-label"
               .col-sm-9

app/views/reports/_project_summary_report.html.haml

@@ -17,10 +17,12 @@
               .col-sm-9= text_field_tag "title", title, class: "form-control"
             .form-group
               = label_tag "start_date", t(:reports)[:start_date], class: "col-sm-3 control-label"
-              .col-sm-9= text_field_tag "start_date", nil, class: "datepicker form-control"
+              .col-sm-9
+                = text_field_tag "start_date", nil, class: "datepicker form-control", readonly: true
             .form-group
               = label_tag "end_date", t(:reports)[:end_date], class: "col-sm-3 control-label"
-              .col-sm-9= text_field_tag "end_date", nil, class: "datepicker form-control"
+              .col-sm-9
+                = text_field_tag "end_date", nil, class: "datepicker form-control", readonly: true
             .form-group
               = label_tag "protocol", t(:reports)[:protocol], class: "col-sm-3 control-label"
               .col-sm-9

app/views/reports/new.js.coffee

@@ -1,5 +1,9 @@
 $("#modal_area").html("<%= escape_javascript(render(partial: @report_type, locals: { title: @title, report_type: @report_type, time_zone: @time_zone })) %>")
 $("#modal_place").modal('show')
-$('#start_date').datetimepicker(format: 'MM-DD-YYYY')
-$('#end_date').datetimepicker(format: 'MM-DD-YYYY')
+$('#start_date').datetimepicker
+  format: 'MM-DD-YYYY'
+  ignoreReadonly: true
+$('#end_date').datetimepicker
+  format: 'MM-DD-YYYY'
+  ignoreReadonly: true
 $(".modal-content .selectpicker").selectpicker()

app/views/study_level_activities/_fulfillment_form.html.haml

@@ -15,7 +15,7 @@
             .form-group
               = form.label "fulfilled_at", t(:fulfillment)[:fulfillment_date]+t(:actions)[:required], class: "col-sm-4 control-label"
               .col-sm-7
-                = form.text_field "fulfilled_at", {class: 'form-control datetimepicker', id: 'date_fulfilled_field', value: format_date(fulfillment.fulfilled_at)}
+                = form.text_field "fulfilled_at", {class: 'form-control datetimepicker', id: 'date_fulfilled_field', value: format_date(fulfillment.fulfilled_at), readonly: true}
             .form-group
               = form.label "quantity", t(:fulfillment)[:quantity]+t(:actions)[:required], class: "col-sm-4 control-label"
               .col-sm-7

app/views/study_level_activities/_study_level_activity_form.html.haml

@@ -22,7 +22,7 @@
             .form-group
               = form.label "started_at", t(:line_item)[:started], class: "col-sm-4 control-label "
               .col-sm-7
-                = form.text_field "started_at", {class: 'form-control datetimepicker', id: 'date_started_field', value: format_date(line_item.started_at)}
+                = form.text_field "started_at", {class: 'form-control datetimepicker', id: 'date_started_field', value: format_date(line_item.started_at), readonly: true}
             .form-group
               = form.label "account_number", t(:line_item)[:account_number], class: "col-sm-4 control-label"
               .col-sm-7

app/views/tasks/_form.html.haml

@@ -16,17 +16,15 @@
             .form-group
               = f.label "assignee_id", t(:task)[:assignee_name]+t(:actions)[:required], class: "col-sm-4 control-label"
               .col-sm-7
-                = f.select :assignee_id, options_from_collection_for_select(clinical_providers.map(&:identity), 'id', 'full_name'), { include_blank: true }, :class => "form-control selectpicker"
+                = f.select :assignee_id, options_from_collection_for_select(clinical_providers.map(&:identity), 'id', 'full_name'), { include_blank: true }, class: "form-control selectpicker"
             .form-group
               = f.label "follow_up_date", t(:task)[:due_at]+t(:actions)[:required], class: "col-sm-4 control-label"
               .col-sm-7
-                .input-group.date#follow_up_datepicker
-                  = f.text_field :due_at, {class: 'form-control'}
-                  %span.input-group-addon
-                    %span.glyphicon.glyphicon-calendar
+                = f.text_field :due_at, {id: 'follow_up_datepicker', class: 'form-control', readonly: true}
             .form-group
               = f.label "task_body", t(:task)[:object], class: "col-sm-4 control-label"
-              .col-sm-7= f.text_area :body, { class: "form-control", rows: 4 }
+              .col-sm-7
+                = f.text_area :body, { class: "form-control", rows: 4 }
       .modal-footer
         .center-block
           %button.btn.btn-default{type: 'button', data: {dismiss: 'modal'}}

app/views/tasks/_task_reschedule_modal.html.haml

@@ -10,10 +10,7 @@
         .form-group
           = t.label "due_at", t(:task)[:due_at], class: "col-sm-4 control-label"
           .col-sm-7
-            .input-group.date#reschedule_datepicker
-              = t.text_field "due_at", {class: 'form-control datetimepicker', value: format_date(task.due_at)}
-              %span.input-group-addon
-                %span.glyphicon.glyphicon-calendar
+            = t.text_field "due_at", {id: 'reschedule_datepicker', class: 'form-control datetimepicker', value: format_date(task.due_at), readonly: true}
       .modal-footer
         .center-block
           %button.btn.btn-default{type: 'button', data: {dismiss: 'modal'}}= t(:actions)[:close]

app/views/tasks/create.js.coffee

@@ -11,5 +11,7 @@ $("#modal_place").modal 'hide'
 $("#follow_up_<%= @procedure.id %>").html("<%= escape_javascript(render(:partial =>'appointments/followup_calendar', locals: {procedure: @procedure})) %>")
 update_complete_visit_button(<%= @procedure.appointment.can_finish? %>)
 <% end %>
-$(".followup_procedure_datepicker").datetimepicker(format: 'MM-DD-YYYY')
+$(".followup_procedure_datepicker").datetimepicker
+  format: 'MM-DD-YYYY'
+  ignoreReadonly: true
 <% end %>

app/views/tasks/new.js.coffee

@@ -1,4 +1,6 @@
 $("#modal_area").html("<%= escape_javascript(render(partial: 'form', locals: {task: @task, clinical_providers: @clinical_providers})) %>")
 $("#modal_place").modal 'show'
-$("#follow_up_datepicker").datetimepicker(format: 'MM-DD-YYYY')
+$("#follow_up_datepicker").datetimepicker
+  format: 'MM-DD-YYYY'
+  ignoreReadonly: true
 $(".selectpicker").selectpicker()

app/views/tasks/task_reschedule.js.coffee

@@ -1,5 +1,7 @@
 $("#modal_area").html("<%= escape_javascript(render(:partial =>'task_reschedule_modal', locals: {task: @task})) %>");
-$("#reschedule_datepicker").datetimepicker(format: 'MM-DD-YYYY')
+$("#reschedule_datepicker").datetimepicker
+  format: 'MM-DD-YYYY'
+  ignoreReadonly: true
 $("#modal_place").modal 'show'
 
 $(".selectpicker").selectpicker()

db/schema.rb

@@ -13,7 +13,6 @@
 
 ActiveRecord::Schema.define(version: 20160120150958) do
 
-
   create_table "appointment_statuses", force: :cascade do |t|
     t.string   "status",         limit: 255
     t.datetime "created_at"