consul/consul

View on GitHub
app/assets/javascripts/datepicker.js

Summary

Maintainability
A
0 mins
Test Coverage
// Based on code by Javan Makhmali
// https://github.com/turbolinks/turbolinks/issues/253#issuecomment-289101048
// The jQuery UI date picker widget appends a shared element to the
// body which it expects will never leave the page, but Turbolinks
// removes that shared element when it rerenders. We satisfy that
// expectation by removing the shared element from the page before
// Turbolinks caches the page, and appending it again before
// Turbolinks swaps the new body in during rendering.
//
// Additionally, returning to the cached version of a page that
// previously had date picker elements would result in those date
// pickers not being initialized again. We fix this issue by finding
// all initialized date picker inputs on the page and calling the
// date picker's destroy method before Turbolinks caches the page.
(function() {
  "use strict";
  App.Datepicker = {
    initialize: function() {
      var locale;
      locale = document.documentElement.lang;
      $(".js-calendar").datepicker({
        maxDate: "+0d"
      });
      $(".js-calendar-full").datepicker();

      if (!App.Datepicker.browser_supports_datetime_local_field()) {
        if (App.Datepicker.browser_supports_date_field()) {
          $("input[type='datetime-local']").prop("type", "text")
            .val(App.Datepicker.datetime_to_date)
            .prop("type", "date");
        } else {
          $("input[type='datetime-local']").val(App.Datepicker.datetime_to_date).datepicker();
        }
      }

      if (!App.Datepicker.browser_supports_date_field()) {
        $("input[type='date']").datepicker();
      }

      $.datepicker.setDefaults($.datepicker.regional[locale]);
      $.datepicker.setDefaults({ dateFormat: "dd/mm/yy" });
    },
    destroy: function() {
      $.datepicker.dpDiv.remove();

      document.querySelectorAll("input.hasDatepicker").forEach(function(input) {
        $(input).datepicker("hide");
        $(input).datepicker("destroy");
      });
    },
    browser_supports_date_field: function() {
      return App.Datepicker.browser_supports_field_with_type("date");
    },
    browser_supports_datetime_local_field: function() {
      return App.Datepicker.browser_supports_field_with_type("datetime-local");
    },
    browser_supports_field_with_type: function(field_type) {
      var field;

      field = document.createElement("input");
      field.setAttribute("type", field_type);
      return field.type === field_type;
    },
    datetime_to_date: function(index, value) {
      return value.split("T")[0];
    }
  };

  document.addEventListener("turbolinks:before-render", function(event) {
    $.datepicker.dpDiv.appendTo(event.data.newBody);
  });
}).call(this);