Merge pull request #6359 from carlosgaldino/add-html5-inputs

Add HTML5 color and date/time inputs

8 files changed, 248 insertions, 0 deletions

diff --git a/actionpack/lib/action_view/helpers/form_helper.rb b/actionpack/lib/action_view/helpers/form_helper.rb
index 6510610034..ad8885b708 100644
--- a/actionpack/lib/action_view/helpers/form_helper.rb
+++ b/actionpack/lib/action_view/helpers/form_helper.rb
@@ -939,6 +939,15 @@ module ActionView
         Tags::RadioButton.new(object_name, method, self, tag_value, options).render
       end
 
+      # Returns a text_field of type "color".
+      #
+      #   color_field("car", "color")
+      #   # => <input id="car_color" name="car[color]" type="color" value="#000000" />
+      #
+      def color_field(object_name, method, options = {})
+        Tags::ColorField.new(object_name, method, self, options).render
+      end
+
       # Returns an input of type "search" for accessing a specified attribute (identified by +method+) on an object
       # assigned to the template (identified by +object_name+). Inputs of type "search" may be styled differently by
       # some browsers.
@@ -1007,6 +1016,74 @@ module ActionView
         Tags::TimeField.new(object_name, method, self, options).render
       end
 
+      # Returns a text_field of type "datetime".
+      #
+      #   datetime_field("user", "born_on")
+      #   # => <input id="user_born_on" name="user[born_on]" type="datetime" />
+      #
+      # The default value is generated by trying to call +strftime+ with "%Y-%m-%dT%T.%L%z"
+      # on the object's value, which makes it behave as expected for instances
+      # of DateTime and ActiveSupport::TimeWithZone.
+      #
+      #   @user.born_on = Date.new(1984, 1, 12)
+      #   datetime_field("user", "born_on")
+      #   # => <input id="user_born_on" name="user[born_on]" type="datetime" value="1984-01-12T00:00:00.000+0000" />
+      #
+      def datetime_field(object_name, method, options = {})
+        Tags::DatetimeField.new(object_name, method, self, options).render
+      end
+
+      # Returns a text_field of type "datetime-local".
+      #
+      #   datetime_local_field("user", "born_on")
+      #   # => <input id="user_born_on" name="user[born_on]" type="datetime-local" />
+      #
+      # The default value is generated by trying to call +strftime+ with "%Y-%m-%dT%T"
+      # on the object's value, which makes it behave as expected for instances
+      # of DateTime and ActiveSupport::TimeWithZone.
+      #
+      #   @user.born_on = Date.new(1984, 1, 12)
+      #   datetime_local_field("user", "born_on")
+      #   # => <input id="user_born_on" name="user[born_on]" type="datetime-local" value="1984-01-12T00:00:00" />
+      #
+      def datetime_local_field(object_name, method, options = {})
+        Tags::DatetimeLocalField.new(object_name, method, self, options).render
+      end
+
+      # Returns a text_field of type "month".
+      #
+      #   month_field("user", "born_on")
+      #   # => <input id="user_born_on" name="user[born_on]" type="month" />
+      #
+      # The default value is generated by trying to call +strftime+ with "%Y-%m"
+      # on the object's value, which makes it behave as expected for instances
+      # of DateTime and ActiveSupport::TimeWithZone.
+      #
+      #   @user.born_on = Date.new(1984, 1, 27)
+      #   month_field("user", "born_on")
+      #   # => <input id="user_born_on" name="user[born_on]" type="date" value="1984-01" />
+      #
+      def month_field(object_name, method, options = {})
+        Tags::MonthField.new(object_name, method, self, options).render
+      end
+
+      # Returns a text_field of type "week".
+      #
+      #   week_field("user", "born_on")
+      #   # => <input id="user_born_on" name="user[born_on]" type="week" />
+      #
+      # The default value is generated by trying to call +strftime+ with "%Y-W%W"
+      # on the object's value, which makes it behave as expected for instances
+      # of DateTime and ActiveSupport::TimeWithZone.
+      #
+      #   @user.born_on = Date.new(1984, 5, 12)
+      #   week_field("user", "born_on")
+      #   # => <input id="user_born_on" name="user[born_on]" type="date" value="1984-W19" />
+      #
+      def week_field(object_name, method, options = {})
+        Tags::WeekField.new(object_name, method, self, options).render
+      end
+
       # Returns a text_field of type "url".
       #
       #   url_field("user", "homepage")
diff --git a/actionpack/lib/action_view/helpers/form_tag_helper.rb b/actionpack/lib/action_view/helpers/form_tag_helper.rb
index e65b4e3e95..1a0019a48c 100644
--- a/actionpack/lib/action_view/helpers/form_tag_helper.rb
+++ b/actionpack/lib/action_view/helpers/form_tag_helper.rb
@@ -524,6 +524,14 @@ module ActionView
         output.safe_concat("</fieldset>")
       end
 
+      # Creates a text field of type "color".
+      #
+      # ==== Options
+      # * Accepts the same options as text_field_tag.
+      def color_field_tag(name, value = nil, options = {})
+        text_field_tag(name, value, options.stringify_keys.update("type" => "color"))
+      end
+
       # Creates a text field of type "search".
       #
       # ==== Options
@@ -560,6 +568,50 @@ module ActionView
         text_field_tag(name, value, options.stringify_keys.update("type" => "time"))
       end
 
+      # Creates a text field of type "datetime".
+      #
+      # === Options
+      # * <tt>:min</tt> - The minimum acceptable value.
+      # * <tt>:max</tt> - The maximum acceptable value.
+      # * <tt>:step</tt> - The acceptable value granularity.
+      # * Otherwise accepts the same options as text_field_tag.
+      def datetime_field_tag(name, value = nil, options = {})
+        text_field_tag(name, value, options.stringify_keys.update("type" => "datetime"))
+      end
+
+      # Creates a text field of type "datetime-local".
+      #
+      # === Options
+      # * <tt>:min</tt> - The minimum acceptable value.
+      # * <tt>:max</tt> - The maximum acceptable value.
+      # * <tt>:step</tt> - The acceptable value granularity.
+      # * Otherwise accepts the same options as text_field_tag.
+      def datetime_local_field_tag(name, value = nil, options = {})
+        text_field_tag(name, value, options.stringify_keys.update("type" => "datetime-local"))
+      end
+
+      # Creates a text field of type "month".
+      #
+      # === Options
+      # * <tt>:min</tt> - The minimum acceptable value.
+      # * <tt>:max</tt> - The maximum acceptable value.
+      # * <tt>:step</tt> - The acceptable value granularity.
+      # * Otherwise accepts the same options as text_field_tag.
+      def month_field_tag(name, value = nil, options = {})
+        text_field_tag(name, value, options.stringify_keys.update("type" => "month"))
+      end
+
+      # Creates a text field of type "week".
+      #
+      # === Options
+      # * <tt>:min</tt> - The minimum acceptable value.
+      # * <tt>:max</tt> - The maximum acceptable value.
+      # * <tt>:step</tt> - The acceptable value granularity.
+      # * Otherwise accepts the same options as text_field_tag.
+      def week_field_tag(name, value = nil, options = {})
+        text_field_tag(name, value, options.stringify_keys.update("type" => "week"))
+      end
+
       # Creates a text field of type "url".
       #
       # ==== Options
diff --git a/actionpack/lib/action_view/helpers/tags.rb b/actionpack/lib/action_view/helpers/tags.rb
index 5cd77c8ec3..a05e16979a 100644
--- a/actionpack/lib/action_view/helpers/tags.rb
+++ b/actionpack/lib/action_view/helpers/tags.rb
@@ -8,14 +8,18 @@ module ActionView
       autoload :CollectionCheckBoxes
       autoload :CollectionRadioButtons
       autoload :CollectionSelect
+      autoload :ColorField
       autoload :DateField
       autoload :DateSelect
+      autoload :DatetimeField
+      autoload :DatetimeLocalField
       autoload :DatetimeSelect
       autoload :EmailField
       autoload :FileField
       autoload :GroupedCollectionSelect
       autoload :HiddenField
       autoload :Label
+      autoload :MonthField
       autoload :NumberField
       autoload :PasswordField
       autoload :RadioButton
@@ -29,6 +33,7 @@ module ActionView
       autoload :TimeSelect
       autoload :TimeZoneSelect
       autoload :UrlField
+      autoload :WeekField
     end
   end
 end
diff --git a/actionpack/lib/action_view/helpers/tags/color_field.rb b/actionpack/lib/action_view/helpers/tags/color_field.rb
new file mode 100644
index 0000000000..6f08f8483a
--- /dev/null
+++ b/actionpack/lib/action_view/helpers/tags/color_field.rb
@@ -0,0 +1,25 @@
+module ActionView
+  module Helpers
+    module Tags
+      class ColorField < TextField #:nodoc:
+        def render
+          options = @options.stringify_keys
+          options["value"] = @options.fetch("value") { validate_color_string(value(object)) }
+          @options = options
+          super
+        end
+
+        private
+
+          def validate_color_string(string)
+            regex = /#[0-9a-fA-F]{6}/
+            if regex.match(string)
+              string.downcase
+            else
+              "#000000"
+            end
+          end
+      end
+    end
+  end
+end
diff --git a/actionpack/lib/action_view/helpers/tags/datetime_field.rb b/actionpack/lib/action_view/helpers/tags/datetime_field.rb
new file mode 100644
index 0000000000..11d58744fd
--- /dev/null
+++ b/actionpack/lib/action_view/helpers/tags/datetime_field.rb
@@ -0,0 +1,22 @@
+module ActionView
+  module Helpers
+    module Tags
+      class DatetimeField < TextField #:nodoc:
+        def render
+          options = @options.stringify_keys
+          options["value"] = @options.fetch("value") { format_global_date_time_string(value(object)) }
+          options["min"] = format_global_date_time_string(options["min"])
+          options["max"] = format_global_date_time_string(options["max"])
+          @options = options
+          super
+        end
+
+        private
+
+          def format_global_date_time_string(value)
+            value.try(:strftime, "%Y-%m-%dT%T.%L%z")
+          end
+      end
+    end
+  end
+end
diff --git a/actionpack/lib/action_view/helpers/tags/datetime_local_field.rb b/actionpack/lib/action_view/helpers/tags/datetime_local_field.rb
new file mode 100644
index 0000000000..7593a3c733
--- /dev/null
+++ b/actionpack/lib/action_view/helpers/tags/datetime_local_field.rb
@@ -0,0 +1,23 @@
+module ActionView
+  module Helpers
+    module Tags
+      class DatetimeLocalField < TextField #:nodoc:
+        def render
+          options = @options.stringify_keys
+          options["type"] = "datetime-local"
+          options["value"] = @options.fetch("value") { format_local_date_time_string(value(object)) }
+          options["min"] = format_local_date_time_string(options["min"])
+          options["max"] = format_local_date_time_string(options["max"])
+          @options = options
+          super
+        end
+
+        private
+
+          def format_local_date_time_string(value)
+            value.try(:strftime, "%Y-%m-%dT%T")
+          end
+      end
+    end
+  end
+end
diff --git a/actionpack/lib/action_view/helpers/tags/month_field.rb b/actionpack/lib/action_view/helpers/tags/month_field.rb
new file mode 100644
index 0000000000..56bd85a90b
--- /dev/null
+++ b/actionpack/lib/action_view/helpers/tags/month_field.rb
@@ -0,0 +1,22 @@
+module ActionView
+  module Helpers
+    module Tags
+      class MonthField < TextField #:nodoc:
+        def render
+          options = @options.stringify_keys
+          options["value"] = @options.fetch("value") { format_month_string(value(object)) }
+          options["min"] = format_month_string(options["min"])
+          options["max"] = format_month_string(options["max"])
+          @options = options
+          super
+        end
+
+        private
+
+          def format_month_string(value)
+            value.try(:strftime, "%Y-%m")
+          end
+      end
+    end
+  end
+end
diff --git a/actionpack/lib/action_view/helpers/tags/week_field.rb b/actionpack/lib/action_view/helpers/tags/week_field.rb
new file mode 100644
index 0000000000..a1265d9928
--- /dev/null
+++ b/actionpack/lib/action_view/helpers/tags/week_field.rb
@@ -0,0 +1,22 @@
+module ActionView
+  module Helpers
+    module Tags
+      class WeekField < TextField #:nodoc:
+        def render
+          options = @options.stringify_keys
+          options["value"] = @options.fetch("value") { format_week_string(value(object)) }
+          options["min"] = format_week_string(options["min"])
+          options["max"] = format_week_string(options["max"])
+          @options = options
+          super
+        end
+
+        private
+
+          def format_week_string(value)
+            value.try(:strftime, "%Y-W%W")
+          end
+      end
+    end
+  end
+end