Merge pull request #1533 from mamhoff/flatpickr

Flatpickr
AlchemyCMS · Jan 23, 2019 · 2816642 · 2816642
2 parents 4386d2b + e1ca720
commit 2816642
Show file tree

Hide file tree

Showing 14 changed files with 36 additions and 669 deletions.
diff --git a/app/assets/javascripts/alchemy/admin.js b/app/assets/javascripts/alchemy/admin.js
@@ -9,6 +9,7 @@
 //= require jquery-ui/widgets/tabs
 //= require tinymce/tinymce.min
 //= require_tree ../../../../vendor/assets/javascripts/jquery_plugins/
+//= require flatpickr/flatpickr.min
 //= require clipboard.min
 //= require keymaster
 //= require requestAnimationFrame

diff --git a/app/assets/javascripts/alchemy/alchemy.datepicker.js.coffee b/app/assets/javascripts/alchemy/alchemy.datepicker.js.coffee
@@ -3,7 +3,6 @@ window.Alchemy = {} if typeof(window.Alchemy) is 'undefined'
 $.extend Alchemy,
 
   Datepicker: (scope) ->
-    $.datetimepicker.setLocale(Alchemy.locale);
     $datepicker_inputs = $('input[data-datepicker-type]', scope)
 
     # Initializes the datepickers on the text inputs and sets the proper type
@@ -15,13 +14,16 @@ $.extend Alchemy,
       $datepicker_inputs.each ->
         type = $(this).data('datepicker-type')
         options =
-          scrollInput: false
-          format: Alchemy.t("formats.#{type}")
-          timepicker: /time/.test(type)
-          datepicker: /date/.test(type)
-          dayOfWeekStart: Alchemy.t('formats.start_of_week')
-          onSelectDate: ->
-            Alchemy.setElementDirty $(this).closest(".element-editor")
-        $(this).datetimepicker(options)
+          # alchemy_i18n supports `zh_CN` etc., but flatpickr only has two-letter codes (`zh`)
+          locale: Alchemy.locale.slice(0, 2)
+          altInput: true
+          altFormat: Alchemy.t("formats.#{type}")
+          altInputClass: ""
+          enableTime: /time/.test(type)
+          noCalendar: type == "time"
+          time_24hr: Alchemy.t("formats.time_24hr")
+          onValueUpdate: (_selectedDates, _dateStr, instance) ->
+            Alchemy.setElementDirty $(instance.element).closest(".element-editor")
+        $(this).flatpickr(options)
 
     return
diff --git a/app/assets/javascripts/alchemy/alchemy.sitemap.js.coffee b/app/assets/javascripts/alchemy/alchemy.sitemap.js.coffee
@@ -1,5 +1,3 @@
-#= require date-formatter
-
 window.Alchemy = {} if typeof(window.Alchemy) is 'undefined'
 
 # The admin sitemap Alchemy module
@@ -111,7 +109,7 @@ Alchemy.Sitemap =
         now = new Date()
         if $checkbox.is(':checked')
           $publication_date_fields.removeClass('hidden')
-          $public_on_field.val Date.format(now, format)
+          $public_on_field[0]._flatpickr.setDate(now)
         else
           $publication_date_fields.addClass('hidden')
           $public_on_field.val('')

diff --git a/app/assets/javascripts/alchemy/alchemy.translations.js.coffee b/app/assets/javascripts/alchemy/alchemy.translations.js.coffee
@@ -26,4 +26,4 @@ Alchemy.translations =
       datetime: "Y-m-d H:i"
       date: "Y-m-d"
       time: "H:i"
-      start_of_week: 0
+      time_24hr: false
diff --git a/app/assets/stylesheets/alchemy/admin.scss b/app/assets/stylesheets/alchemy/admin.scss
@@ -44,4 +44,4 @@
 @import "alchemy/upload";
 @import "alchemy/jquery-ui";
 @import "jquery.Jcrop.min";
-@import "jquery.datetimepicker";
+@import "flatpickr/flatpickr.min";