An HTML5 range input that degrades gracefully

degrading_html5_range_helper.rb

# The goal is to create a "rating" tag. It should use the <input type='range'>
# tag from HTML5 if available, but degrade to something usable if not.
#
# An alternative to this would be some sort of Javascript-based
# progressive-enhancement. I think that might actually be preferable,
# but I can't quite envision it yet. Perhaps you'd like to fork this Gist and
# add a JS version?
def range_tag(name, range, options = {})
  if browser_supports_html5_range?
    options.reverse_merge!({
      :type => 'range', :name => name,
      :min => range.min, :max => range.max })
    tag :input, options
  else
    options_tags = options_for_select(range.to_a, options.delete(:value))
    select_tag(name, options_tags, options)
  end
end

# So far, just WebKit (all versions) and Presto (≥ 2.0)
# support the range input. This will change with time.
BROWSERS_THAT_SUPPORT_HTML5_RANGE = /(WebKit)|(Presto\/[2-9])/

def browser_supports_html5_range?
  request.user_agent =~ BROWSERS_THAT_SUPPORT_HTML5_RANGE
end