html5forms-rails 0.1.3

data/CHANGELOG.md

@@ -0,0 +1,5 @@
+## Changelog
+
+*0.1.0*
+
+* Initial version (needs testing)

data/Gemfile

@@ -0,0 +1,11 @@
+source :rubygems
+
+# Add dependencies to develop your gem here.
+# Include everything needed to run rake, tests, features, etc.
+group :development do
+  gem "rspec", 		">= 2.8.0"
+  gem "rdoc", 		">= 3.12"
+  gem "bundler", 	">= 1.0.0"
+  gem "jeweler", 	">= 1.8.3"
+  gem "simplecov",">= 0.5"
+end

data/README.md

@@ -0,0 +1,208 @@
+# HTML 5 forms for Rails
+
+A collection of Polyfills for using HTML 5 forms with the Rails asset pipeline.
+
+All credits, copyright etc. belong to the original authors of each polyfill library.
+
+[HTML5-Cross-Browser-Polyfills](https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills)
+
+The following polyfill libraries are currently included:
+
+* [HTML5Forms.js](https://github.com/zoltan-dulac/html5Forms.js)
+* [H5F](https://github.com/ryanseddon/H5F)
+* [HTML5-Form-Shim](https://github.com/dsheiko/HTML5-Form-Shim)
+* [jQuery HTML5 form](http://www.matiasmancini.com.ar/jquery-plugin-ajax-form-validation-html5.html)
+
+Components from the article [how-to-build-cross-browser-html5-forms](http://net.tutsplus.com/tutorials/html-css-techniques/how-to-build-cross-browser-html5-forms/) are also included as _html5forms.fallback_
+
+Even [webforms2](https://github.com/westonruter/webforms2) is now included and should work with html5Widgets to display native javascript widgets ;)
+
+### Install
+
+Simply add to Gemfile and bundle:
+
+`gem 'html5forms-rails'`
+
+If the polyfill library uses modernizr to detect HTML 5 feature availability:
+
+`gem 'modernizr-rails'`
+
+See [modernizr-rails](https://github.com/kristianmandrup/modernizr-rails)
+
+## html5forms.fallback
+
+See [how-to-build-cross-browser-html5-forms](http://net.tutsplus.com/tutorials/html-css-techniques/how-to-build-cross-browser-html5-forms/)
+
+* colorpicker
+* spinner
+* placeholder
+
+To use the _jQuery UI_ components as fallback, please use the [jquery-ui-rails](https://github.com/joliss/jquery-ui-rails) gem ;)
+
+### Configuration
+
+```text
+//= require html5forms.fallback
+//= require ui.spinner
+//= require jquery.placehold
+//= require colorpicker
+```
+
+`*.min` versions are also included ;)
+
+In your asset `application.css` manifest file:
+
+```css
+*/
+ * require colorpicker
+ * require ui.spinner
+*/
+```
+
+## HTML5Forms.js
+
+[HTML5Forms.js](https://github.com/zoltan-dulac/html5Forms.js) is a JavaScript polyfill that implements a subset of the HTML5
+Forms module in all browsers.  The script will only add support for the
+different parts of the module when there doesn't exist a native
+implementation.  HTML5Forms supports the following HTML5 input types:
+
+* range
+* date
+* datetime
+* datetime-local
+* week
+* color
+
+It also supports:
+
+* form validation (via "required" and "pattern" attributes)
+* the autofocus attribute (i.e. focusing on a particular form element onload)
+* the placeholder attribute (i.e. descriptive text of what should be in a form
+  field)
+* the output tag (solves equations of form elements)
+* CSS styling of form validation states (simulates :invalid and :valid in 
+  unsupported browsers like IE9 and lower)
+* CSS styling of form elements that are not included in the CSS3 UI 
+  specification, but I think are useful for developers:
+  
+  - .wf2_isBlank, .wf2_notBlank – these classes are applied to form field when 
+     a form element is blank/not blank repectively.
+  - .wf2_lostFocus -this class is applied to a form element when a form field 
+     loses focus.
+  - .wf2_submitAttempted – this class is applied to a <form> tag when a form 
+     submission is attempted.
+
+
+More information about how this works is available at:
+
+[cross-browser-html](http://www.useragentman.com/blog/2010/07/27/cross-browser-html5-forms-using-modernizr-webforms2-and-html5widgets/)
+[cross-browser-html-old-browsers](http://www.useragentman.com/blog/2012/05/14/cross-browser-styling-of-html5-forms-even-in-older-browsers/)
+
+Note that this package was originally released in 2010 as html5Widgets, 
+and was renamed to a more accurate and descriptive name.  Also note that
+the version of webforms2 that is included in this package does not 
+include support for the depricated repetition module -- it will be 
+put back in as a separate module at a later date.
+
+### Configuration
+
+You can choose to use either the minified js:
+
+```text
+//= require html5forms/html5Forms.min
+```
+
+Or the development version (easier to read/debug etc.). 
+
+```text
+//= require html5forms/dev/html5Forms
+```
+
+#### Notes
+
+* _jscalendar_ and _modernizr_ have been removed from html5forms in order to keep the filecount down.
+
+* Html5forms for Rails has not yet been tested. 
+
+I have so far done a search and replace on `html5Forms.js`, substituting `../shared/js/` with `html5forms` but not sure how it resolves with respect to the asset pipeline. Please help debug and fix this!
+
+In your asset `application.css` manifest file, include the styles you need:
+
+```css
+*/
+ * require html5forms/slider
+ * ...
+*/
+```
+
+## H5F
+
+See [H5F](https://github.com/ryanseddon/H5F)
+
+### Configuration
+
+You can choose to use either the minified js:
+
+```text
+//= require h5f.min
+```
+
+Or the development version (easier to read/debug etc.). 
+
+```text
+//= require h5f
+```
+
+In your asset `application.css` manifest file, include the styles you need:
+
+```css
+*/
+ * require h5f
+*/
+```
+
+## jQuery HTML5 form
+
+[jQuery HTML5 form](http://www.matiasmancini.com.ar/jquery-plugin-ajax-form-validation-html5.html)
+
+```text
+//= require jquery.html5form.min
+```
+
+
+## HTML5-Form-Shim
+
+See [HTML5-Form-Shim](https://github.com/dsheiko/HTML5-Form-Shim)
+
+## Configuration
+
+In your `application.js` manifest:
+
+```text
+//= require jquery.html5form-shim
+```
+
+In your asset `application.css` manifest file:
+
+```css
+*/
+ * require html5form-shim
+* ...
+*/
+```
+
+## Contributing to html5forms-rails
+ 
+* Check out the latest master to make sure the feature hasn't been implemented or the bug hasn't been fixed yet.
+* Check out the issue tracker to make sure someone already hasn't requested it and/or contributed it.
+* Fork the project.
+* Start a feature/bugfix branch.
+* Commit and push until you are happy with your contribution.
+* Make sure to add tests for it. This is important so I don't break it in a future version unintentionally.
+* Please try not to mess with the Rakefile, version, or history. If you want to have your own version, or is otherwise necessary, that is fine, but please isolate to its own commit so I can cherry-pick around it.
+
+## Copyright
+
+Copyright (c) 2012 Kristian Mandrup. See LICENSE.txt for
+further details.
+

data/Rakefile

@@ -0,0 +1,49 @@
+# encoding: utf-8
+
+require 'rubygems'
+require 'bundler'
+begin
+  Bundler.setup(:default, :development)
+rescue Bundler::BundlerError => e
+  $stderr.puts e.message
+  $stderr.puts "Run `bundle install` to install missing gems"
+  exit e.status_code
+end
+require 'rake'
+
+require 'jeweler'
+Jeweler::Tasks.new do |gem|
+  # gem is a Gem::Specification... see http://docs.rubygems.org/read/chapter/20 for more options
+  gem.name = "html5forms-rails"
+  gem.homepage = "http://github.com/kristianmandrup/jqtools-rails"
+  gem.license = "MIT"
+  gem.summary = %Q{HTML5forms packages for Rails asset pipeline}
+  gem.description = %Q{Use the power of html5 forms even in old browsers using polyfills :)}
+  gem.email = "kmandrup@gmail.com"
+  gem.authors = ["Kristian Mandrup"]
+  # dependencies defined in Gemfile
+end
+Jeweler::RubygemsDotOrgTasks.new
+
+require 'rspec/core'
+require 'rspec/core/rake_task'
+RSpec::Core::RakeTask.new(:spec) do |spec|
+  spec.pattern = FileList['spec/**/*_spec.rb']
+end
+
+RSpec::Core::RakeTask.new(:rcov) do |spec|
+  spec.pattern = 'spec/**/*_spec.rb'
+  spec.rcov = true
+end
+
+task :default => :spec
+
+require 'rdoc/task'
+Rake::RDocTask.new do |rdoc|
+  version = File.exist?('VERSION') ? File.read('VERSION') : ""
+
+  rdoc.rdoc_dir = 'rdoc'
+  rdoc.title = "html5forms-rails #{version}"
+  rdoc.rdoc_files.include('README*')
+  rdoc.rdoc_files.include('lib/**/*.rb')
+end

data/VERSION

@@ -0,0 +1 @@
+0.1.3

data/demos/html5-form-demo.html

@@ -0,0 +1,79 @@
+<!doctype html>
+<html lang="en">
+<head>
+	<meta charset="utf-8" />	
+	<title>Building cross-browser HTML5 forms, with jQuery UI - Demo Page</title>	
+	<!-- HTML5 Shim, IE8 and bellow recognize HTML5 elements -->
+	<!--[if lt IE 9]><script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->		
+	<!-- Modernizr -->
+	<script src="js/modernizr-1.5.min.js"></script>
+	<!-- Webforms2 -->
+	<script src="webforms2/webforms2-p.js"></script>	
+	<!-- jQuery and jQuery UI -->
+	<link rel="stylesheet" href="ui-themes/aristo/jquery.ui.all.css"> 
+	<script src="js/jquery-1.4.3.min.js"></script>
+	<script src="js/jquery-ui-1.8.5.min.js"></script>
+	<!-- jQuery Numeric Spinner -->	
+	<link rel="stylesheet" href="components/spinner/ui.spinner.css"> 
+	<script src="components/spinner/ui.spinner.js"></script>
+	<!-- jQuery Color Picker -->
+	<link rel="stylesheet" href="components/colorpicker/colorpicker.css">
+	<script src="components/colorpicker/colorpicker.js"></script>
+	<!-- jQuery Placehol -->
+	<script src="components/placeholder/jquery.placehold-0.2.min.js"></script>
+
+	<!-- Demo page layout -->
+	<link rel="stylesheet" href="css/html5forms.layout.css">
+	<script src="js/html5forms.js"></script>
+	<script src="js/html5forms.fallback.js"></script>	
+	
+</head>
+<body>
+	
+	<h1>
+		Cross-browser HTML5 forms
+		<span>with <a href="http://code.google.com/p/webforms2/">Webforms2</a>, <a href="http://www.modernizr.com/">Modernizr</a>, <a href="http://jqueryui.com/">jQuery UI</a> and other jQuery Plugins. </span>
+	</h1>
+	
+	<form>
+		<label for="range-slider">Slider</label>
+		<input type="range" name="range-slider" id="range-slider" class="slider" min="0" max="20" step="1" value="0">
+	
+		<label for="numeric-spinner">Numeric spinner</label>
+		<input type="number" name="numeric-spinner" id="numeric-spinner" value="2">
+	
+		<label for="date-picker">Date picker</label>
+		<input type="date" name="date-picker" id="date-picker" value="2010-10-06">
+		
+		<label for="color-picker">Color picker</label>
+		<input type="color" name="color-picker" id="color-picker" value="ff0000">
+	
+		<label for="text-field">Text field with placeholder</label>
+		<input type="text" name="text-field" id="text-field" placeholder="Insert your text here">
+	
+		<label for="url-field">Url field</label>
+		<input type="url" id="url-field" name="url-field" placeholder="http://net.tutsplus.com/" required>
+	
+		<label for="email-field">Email field</label>
+		<input type="email" id="email-field" name="email-field" placeholder="contact@ghinda.net" required>
+		
+		<button type="submit" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button" aria-disabled="false">
+			<span class="ui-button-text">Submit form</span>
+		</button>
+		<div class="clearfix"></div>
+	</form>
+	
+	<footer>
+		<p><a href="http://www.eyecon.ro/colorpicker/">Color Picker</a> plugin by <a href="http://www.eyecon.ro/">Stefan Petre</a></p>
+		<p>Numeric spinner by <a href="http://btburnett.com/">Brant Burnett</a></p>
+		<p><a href="http://www.viget.com/inspire/a-jquery-placeholder-enabling-plugin/">Placehold</a> by <a href="http://www.viget.com/inspire/">Viget Labs</a></p>
+		
+		<p class="author">
+			Cross-browser HTML5 Forms by <a href="http://ghinda.net">Cristian Colceriu</a> 
+			<br>
+			<a href="http://twitter.com/ghindas">Twitter</a> - <a href="mailto:cristian@ghinda.net">Email</a>
+		</p>
+	</footer>
+	
+</body>
+</html>

data/html5forms-rails.gemspec

@@ -0,0 +1,142 @@
+# Generated by jeweler
+# DO NOT EDIT THIS FILE DIRECTLY
+# Instead, edit Jeweler::Tasks in Rakefile, and run 'rake gemspec'
+# -*- encoding: utf-8 -*-
+
+Gem::Specification.new do |s|
+  s.name = "html5forms-rails"
+  s.version = "0.1.3"
+
+  s.required_rubygems_version = Gem::Requirement.new(">= 0") if s.respond_to? :required_rubygems_version=
+  s.authors = ["Kristian Mandrup"]
+  s.date = "2012-08-27"
+  s.description = "Use the power of html5 forms even in old browsers using polyfills :)"
+  s.email = "kmandrup@gmail.com"
+  s.extra_rdoc_files = [
+    "README.md"
+  ]
+  s.files = [
+    "CHANGELOG.md",
+    "Gemfile",
+    "README.md",
+    "Rakefile",
+    "VERSION",
+    "demos/html5-form-demo.html",
+    "html5forms-rails.gemspec",
+    "lib/html5forms.rb",
+    "vendor/assets/images/colorpicker/blank.gif",
+    "vendor/assets/images/colorpicker/colorpicker_background.png",
+    "vendor/assets/images/colorpicker/colorpicker_hex.png",
+    "vendor/assets/images/colorpicker/colorpicker_hsb_b.png",
+    "vendor/assets/images/colorpicker/colorpicker_hsb_h.png",
+    "vendor/assets/images/colorpicker/colorpicker_hsb_s.png",
+    "vendor/assets/images/colorpicker/colorpicker_indic.gif",
+    "vendor/assets/images/colorpicker/colorpicker_overlay.png",
+    "vendor/assets/images/colorpicker/colorpicker_rgb_b.png",
+    "vendor/assets/images/colorpicker/colorpicker_rgb_g.png",
+    "vendor/assets/images/colorpicker/colorpicker_rgb_r.png",
+    "vendor/assets/images/colorpicker/colorpicker_select.gif",
+    "vendor/assets/images/colorpicker/colorpicker_submit.png",
+    "vendor/assets/images/colorpicker/custom_background.png",
+    "vendor/assets/images/colorpicker/custom_hex.png",
+    "vendor/assets/images/colorpicker/custom_hsb_b.png",
+    "vendor/assets/images/colorpicker/custom_hsb_h.png",
+    "vendor/assets/images/colorpicker/custom_hsb_s.png",
+    "vendor/assets/images/colorpicker/custom_indic.gif",
+    "vendor/assets/images/colorpicker/custom_rgb_b.png",
+    "vendor/assets/images/colorpicker/custom_rgb_g.png",
+    "vendor/assets/images/colorpicker/custom_rgb_r.png",
+    "vendor/assets/images/colorpicker/custom_submit.png",
+    "vendor/assets/images/colorpicker/select.png",
+    "vendor/assets/images/colorpicker/select2.png",
+    "vendor/assets/images/colorpicker/slider.png",
+    "vendor/assets/images/h5f/form_validation.png",
+    "vendor/assets/images/html5form-shim/asterisk.png",
+    "vendor/assets/images/html5form-shim/down.png",
+    "vendor/assets/images/html5form-shim/fail.png",
+    "vendor/assets/images/html5form-shim/ok.png",
+    "vendor/assets/images/html5forms/jscolor/arrow.gif",
+    "vendor/assets/images/html5forms/jscolor/cross.gif",
+    "vendor/assets/images/html5forms/jscolor/hs.png",
+    "vendor/assets/images/html5forms/jscolor/hv.png",
+    "vendor/assets/images/html5forms/slider/slider-1.png",
+    "vendor/assets/images/html5forms/slider/slider-disabled-1.png",
+    "vendor/assets/images/html5forms/slider/slider-disabled.png",
+    "vendor/assets/images/html5forms/slider/slider.png",
+    "vendor/assets/javascripts/colorpicker.js",
+    "vendor/assets/javascripts/colorpicker.min.js",
+    "vendor/assets/javascripts/h5f.js",
+    "vendor/assets/javascripts/h5f.min.js",
+    "vendor/assets/javascripts/html5forms.fallback.js",
+    "vendor/assets/javascripts/html5forms.fallback.min.js",
+    "vendor/assets/javascripts/html5forms/EventHelpers.min.js",
+    "vendor/assets/javascripts/html5forms/autocomplete.min.js",
+    "vendor/assets/javascripts/html5forms/cssQuery-p.min.js",
+    "vendor/assets/javascripts/html5forms/dev/EventHelpers.js",
+    "vendor/assets/javascripts/html5forms/dev/autocomplete.js",
+    "vendor/assets/javascripts/html5forms/dev/cssQuery-p.js",
+    "vendor/assets/javascripts/html5forms/dev/html5.js",
+    "vendor/assets/javascripts/html5forms/dev/html5Forms.js",
+    "vendor/assets/javascripts/html5forms/dev/html5Widgets.js",
+    "vendor/assets/javascripts/html5forms/dev/jscolor.js",
+    "vendor/assets/javascripts/html5forms/dev/slider.js",
+    "vendor/assets/javascripts/html5forms/dev/timer.js",
+    "vendor/assets/javascripts/html5forms/dev/visibleIf.js",
+    "vendor/assets/javascripts/html5forms/html5.min.js",
+    "vendor/assets/javascripts/html5forms/html5Forms.min.js",
+    "vendor/assets/javascripts/html5forms/html5Widgets.min.js",
+    "vendor/assets/javascripts/html5forms/jscolor.min.js",
+    "vendor/assets/javascripts/html5forms/slider.min.js",
+    "vendor/assets/javascripts/html5forms/timer.min.js",
+    "vendor/assets/javascripts/html5forms/visibleIf.min.js",
+    "vendor/assets/javascripts/jquery.html5form-shim.js",
+    "vendor/assets/javascripts/jquery.html5form.min.js",
+    "vendor/assets/javascripts/jquery.placehold.min.js",
+    "vendor/assets/javascripts/ui.spinner.js",
+    "vendor/assets/javascripts/ui.spinner.min.js",
+    "vendor/assets/javascripts/webforms2/webforms2-msie.js",
+    "vendor/assets/javascripts/webforms2/webforms2-p.js",
+    "vendor/assets/javascripts/webforms2/webforms2.js",
+    "vendor/assets/javascripts/webforms2/webforms2_src.js",
+    "vendor/assets/stylesheets/colorpicker.css",
+    "vendor/assets/stylesheets/h5f.css",
+    "vendor/assets/stylesheets/html5form-shim.css",
+    "vendor/assets/stylesheets/html5forms.layout.css",
+    "vendor/assets/stylesheets/html5forms/number.css",
+    "vendor/assets/stylesheets/html5forms/slider.css",
+    "vendor/assets/stylesheets/html5forms/slider_ie.css",
+    "vendor/assets/stylesheets/html5forms/visibleIf.css",
+    "vendor/assets/stylesheets/ui.spinner.css",
+    "vendor/assets/stylesheets/webforms2.css"
+  ]
+  s.homepage = "http://github.com/kristianmandrup/jqtools-rails"
+  s.licenses = ["MIT"]
+  s.require_paths = ["lib"]
+  s.rubygems_version = "1.8.24"
+  s.summary = "HTML5forms packages for Rails asset pipeline"
+
+  if s.respond_to? :specification_version then
+    s.specification_version = 3
+
+    if Gem::Version.new(Gem::VERSION) >= Gem::Version.new('1.2.0') then
+      s.add_development_dependency(%q<rspec>, [">= 2.8.0"])
+      s.add_development_dependency(%q<rdoc>, [">= 3.12"])
+      s.add_development_dependency(%q<bundler>, [">= 1.0.0"])
+      s.add_development_dependency(%q<jeweler>, [">= 1.8.3"])
+      s.add_development_dependency(%q<simplecov>, [">= 0.5"])
+    else
+      s.add_dependency(%q<rspec>, [">= 2.8.0"])
+      s.add_dependency(%q<rdoc>, [">= 3.12"])
+      s.add_dependency(%q<bundler>, [">= 1.0.0"])
+      s.add_dependency(%q<jeweler>, [">= 1.8.3"])
+      s.add_dependency(%q<simplecov>, [">= 0.5"])
+    end
+  else
+    s.add_dependency(%q<rspec>, [">= 2.8.0"])
+    s.add_dependency(%q<rdoc>, [">= 3.12"])
+    s.add_dependency(%q<bundler>, [">= 1.0.0"])
+    s.add_dependency(%q<jeweler>, [">= 1.8.3"])
+    s.add_dependency(%q<simplecov>, [">= 0.5"])
+  end
+end
+

data/lib/html5forms.rb

@@ -0,0 +1,6 @@
+module Html5Forms
+  module Rails
+    class Engine < ::Rails::Engine
+    end
+  end
+end