ui_datepicker-rails3 1.0.0
Sign up to get free protection for your applications and to get access to all the features.
- data/MIT-LICENSE +20 -0
- data/README.mdown +200 -0
- data/Rakefile +18 -0
- data/init.rb +2 -0
- data/lib/active_admin/inputs/ui_date_picker_input.rb +11 -0
- data/lib/active_admin/inputs/ui_date_time_picker_input.rb +13 -0
- data/lib/active_admin/inputs_ext.rb +2 -0
- data/lib/date_util/localize.rb +18 -0
- data/lib/formtastic/inputs/ui_date_picker_input.rb +33 -0
- data/lib/formtastic/inputs/ui_date_time_picker_input.rb +12 -0
- data/lib/formtastic/inputs_ext.rb +2 -0
- data/lib/simple_form/inputs/ui_date_picker_input.rb +25 -0
- data/lib/simple_form/inputs/ui_date_time_picker_input.rb +11 -0
- data/lib/simple_form/inputs_ext.rb +2 -0
- data/lib/ui_datepicker-rails3.rb +41 -0
- data/spec/base_helper.rb +26 -0
- data/spec/configure_spec.rb +36 -0
- data/spec/spec_helper.rb +316 -0
- data/spec/support/custom_macros.rb +520 -0
- data/spec/support/output_buffer.rb +6 -0
- data/spec/ui_datepicker-rails3_spec.rb +78 -0
- data/spec/use_in_rails_spec.rb +6 -0
- metadata +76 -0
data/MIT-LICENSE
ADDED
@@ -0,0 +1,20 @@
|
|
1
|
+
Copyright (c) 2010 [name of plugin creator]
|
2
|
+
|
3
|
+
Permission is hereby granted, free of charge, to any person obtaining
|
4
|
+
a copy of this software and associated documentation files (the
|
5
|
+
"Software"), to deal in the Software without restriction, including
|
6
|
+
without limitation the rights to use, copy, modify, merge, publish,
|
7
|
+
distribute, sublicense, and/or sell copies of the Software, and to
|
8
|
+
permit persons to whom the Software is furnished to do so, subject to
|
9
|
+
the following conditions:
|
10
|
+
|
11
|
+
The above copyright notice and this permission notice shall be
|
12
|
+
included in all copies or substantial portions of the Software.
|
13
|
+
|
14
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
15
|
+
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
16
|
+
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
17
|
+
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
18
|
+
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
19
|
+
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
20
|
+
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
data/README.mdown
ADDED
@@ -0,0 +1,200 @@
|
|
1
|
+
# jQuery UI Datepicker for Rails 3.x
|
2
|
+
|
3
|
+
This gem adds support for jQuery UI Date and DateTime picker for Rails 3.x form builders, including:
|
4
|
+
|
5
|
+
* Formtastic 2.x
|
6
|
+
* SimpleForm
|
7
|
+
|
8
|
+
Feel free to provide patches/extensions to support other form builders.
|
9
|
+
|
10
|
+
## Install
|
11
|
+
|
12
|
+
Insert into Gemfile:
|
13
|
+
|
14
|
+
`gem 'ui_datepicker-rails3'`
|
15
|
+
|
16
|
+
Activate it like this:
|
17
|
+
|
18
|
+
`UiDatePickerRails3.activate :simple_form`
|
19
|
+
|
20
|
+
This can be done fx from inside an initializer. You can pass either :simple_form, :formtastic or :active_admin to the `#activate` method.
|
21
|
+
|
22
|
+
## jQuery UI Configuration
|
23
|
+
|
24
|
+
For basic Rails form builder support, please see ["jquery_datepicker"](https://github.com/albertopq/jquery_datepicker)
|
25
|
+
|
26
|
+
In Gemfile, insert:
|
27
|
+
|
28
|
+
`gem 'jquery-rails'`
|
29
|
+
|
30
|
+
Then install jquery with UI, by executing the following command from console:
|
31
|
+
|
32
|
+
`rails generate jquery:install --ui`
|
33
|
+
|
34
|
+
In Rails 3.1 when using the asset pipeline, this generator is deprecated, so you’ll need to add a line to your `app/assets/javascripts/application.js` file:
|
35
|
+
|
36
|
+
`//= require jquery-ui`
|
37
|
+
|
38
|
+
### Formtastic
|
39
|
+
|
40
|
+
This gem requires Formtastic 2.0. For a version that supports Formtastic < 2.0, see [formtastic_datepicker]:(https://github.com/kristianmandrup/formtastic_datepicker)
|
41
|
+
|
42
|
+
### ActiveAdmin
|
43
|
+
|
44
|
+
The ActiveAdmin extension should work with ActiveAdmin _0.3.4_ (where Formtastic >= 2.0)
|
45
|
+
|
46
|
+
Note: As of Nov 25, 2011 The `active_admin/gregbell` _master_ branch is compatible with Formtastic 2.x.
|
47
|
+
|
48
|
+
ActiveAdmin _0.3.5+_ will likely support Formtastic 2.x ;)
|
49
|
+
|
50
|
+
## Formtastic (by justinfrench)
|
51
|
+
|
52
|
+
The gem adds a couple of new form inputs to Formtastic that can be used like this:
|
53
|
+
|
54
|
+
```ruby
|
55
|
+
<% semantic_form_for @person do |f| -%>
|
56
|
+
<% f.inputs do -%>
|
57
|
+
<%= f.input :name %>
|
58
|
+
<%= f.input :born, :as => :ui_date_picker %>
|
59
|
+
<% end -%>
|
60
|
+
<%= f.buttons %>
|
61
|
+
<% end -%>
|
62
|
+
```
|
63
|
+
|
64
|
+
The Formtastic Input class adds `class='ui-date-picker'` to the text input, which can the be matched by jQuery and converted to the date picker widget.
|
65
|
+
|
66
|
+
```ruby
|
67
|
+
<% semantic_form_for @person do |f| -%>
|
68
|
+
<% f.inputs do -%>
|
69
|
+
<%= f.input :name %>
|
70
|
+
<%= f.input :born, :as => :ui_date_time_picker %>
|
71
|
+
<% end -%>
|
72
|
+
<%= f.buttons %>
|
73
|
+
<% end -%>
|
74
|
+
```
|
75
|
+
|
76
|
+
The Formtastic Input class adds `class='ui-datetime-picker'` to the text input, which can the be matched by jQuery and converted to the date-time picker widget.
|
77
|
+
|
78
|
+
## SimpleForm (by plataformatec)
|
79
|
+
|
80
|
+
The gem adds a couple of new form inputs to SimpleForm that can be used like this:
|
81
|
+
|
82
|
+
```ruby
|
83
|
+
<% simple_form_for @person do |f| -%>
|
84
|
+
<%= f.input :name %>
|
85
|
+
<%= f.input :born, :as => :date_picker %>
|
86
|
+
<% end -%>
|
87
|
+
```
|
88
|
+
|
89
|
+
The SimpleForm Input class adds `class='ui-date-picker'` to the text input, which can the be matched by jQuery and converted to the date picker widget.
|
90
|
+
|
91
|
+
```ruby
|
92
|
+
<% simple_form_for @person do |f| -%>
|
93
|
+
<%= f.input :name %>
|
94
|
+
<%= f.input :born, :as => :date_time_picker %>
|
95
|
+
<% end -%>
|
96
|
+
```
|
97
|
+
|
98
|
+
The SimpleForm Input class adds `class='ui-datetime-picker'` to the text input, which can the be matched by jQuery and converted to the date-time picker widget.
|
99
|
+
|
100
|
+
## Configuration
|
101
|
+
|
102
|
+
These configuration tips are only appropriate for a static datepicker, i.e one with a fixed set of options and a given language. Handling a more dynamic configuration is left as an exercise.
|
103
|
+
|
104
|
+
When the gem has been installed the datepicker should be configured as follows
|
105
|
+
|
106
|
+
Install the jquery-ui CSS. You can get a bundle to match your site from ThemeRoller. From your theme bundle, extract the CSS directory and place it somewhere under app/assets/stylesheets/.
|
107
|
+
|
108
|
+
Activate datepicker on all matching input elements in one of your javascript (or coffee script) files, fx `datepicker.js` or `datepicker.js.coffee`.
|
109
|
+
|
110
|
+
```javascript
|
111
|
+
$(document).ready(function(){
|
112
|
+
$('input.ui-date-picker').datepicker();
|
113
|
+
$('input.ui-datetime-picker').datepicker();
|
114
|
+
});
|
115
|
+
```
|
116
|
+
|
117
|
+
The same in coffescript:
|
118
|
+
|
119
|
+
```coffeescript
|
120
|
+
$->
|
121
|
+
$('input.ui-date-picker').datepicker
|
122
|
+
$('input.ui-datetime-picker').datepicker
|
123
|
+
```
|
124
|
+
|
125
|
+
## Localization (optional)
|
126
|
+
|
127
|
+
To add localization, you can additionally add localization options to the `datepicker()` call.
|
128
|
+
|
129
|
+
Example: Using the swedish localization:
|
130
|
+
|
131
|
+
```javascript
|
132
|
+
$(document).ready(function(){
|
133
|
+
$('input.ui-date-picker').datepicker('option', 'sv' );
|
134
|
+
});
|
135
|
+
```
|
136
|
+
|
137
|
+
The same in coffescript:
|
138
|
+
|
139
|
+
```coffeescript
|
140
|
+
$->
|
141
|
+
$('input.ui-date-picker').datepicker('option', 'sv')
|
142
|
+
```
|
143
|
+
|
144
|
+
|
145
|
+
For any other language exchange the local 'sv' to the appropriate (localized) country code.
|
146
|
+
|
147
|
+
Copy the appropriate localization file from ["jQuery-UI i18n"](http://jquery-ui.googlecode.com/svn/trunk/ui/i18n/) to your js asset folder, fx at: `app/assets/javascripts/i18n/jquery.ui.datepicker-sv.js`
|
148
|
+
|
149
|
+
Then make sure a reference to the locale file is added in the manifest file.
|
150
|
+
|
151
|
+
`//= require 'i18n/jquery.ui.datepicker-sv.js'` to your js manifest file.
|
152
|
+
|
153
|
+
You can also use the included datepicker locale files as a base (see vendor/assets of this gem).
|
154
|
+
This gem includes a helper method `#ui_localizers` that can be used like this (fx in your Rails layout file or similar):
|
155
|
+
|
156
|
+
```ruby
|
157
|
+
<%= javascript_include_tag UiDatePickerRails3.ui_localizers :ar, :ca, :da %>
|
158
|
+
```
|
159
|
+
|
160
|
+
It will generate strings of the form "ui/i18n/jquery.ui.datepicker-#{country_code}"
|
161
|
+
|
162
|
+
## Styling (optional)
|
163
|
+
|
164
|
+
Style the datepicker by adding a `datepicker.css` file to your css assets.
|
165
|
+
|
166
|
+
You can use the *Themeroller* (http://jqueryui.com/themeroller/) to define and download an appropriate css file and the pictures needed. Add the downloaded Themeroller css file to the css assets and add the Themeroller images to the image assets. Edit the datepicker css and change all image references by removing all the "images/" prefixes e.g from `url(images/ui-icons_222222_256x240.png)` to `url(ui-icons_222222_256x240.png)`
|
167
|
+
|
168
|
+
Note: It is also possible to load only the js needed for the datepicker widget by using the js files that are downloaded from Themeroller.
|
169
|
+
|
170
|
+
A 'smoothness' theme is included with this gem. Simply do:
|
171
|
+
|
172
|
+
```ruby
|
173
|
+
<%= stylesheet_link_tag UiDatePickerRails3.ui_theme :smoothness %>
|
174
|
+
```
|
175
|
+
|
176
|
+
## Advanced configuration
|
177
|
+
|
178
|
+
Add any additional datepicker options as defined in the ["Datepicker"](http://docs.jquery.com/UI/Datepicker) docs.
|
179
|
+
|
180
|
+
Example: add option for displaying week number and displaying a drop-down of months:
|
181
|
+
|
182
|
+
```javascript
|
183
|
+
$(document).ready(function(){
|
184
|
+
var datepicker_widgets = $('input.ui-date-picker');
|
185
|
+
|
186
|
+
datepicker_widgets.datepicker( 'option', 'showWeek', true);
|
187
|
+
datepicker_widgets.datepicker( 'option', 'changeMonth', true );
|
188
|
+
});
|
189
|
+
```
|
190
|
+
|
191
|
+
## ActiveAdmin integration
|
192
|
+
|
193
|
+
In the Gemfile add this gem after _ActiveAdmin_ (`gem 'active_admin'`) to make sure it loads after and overrides/extends ActiveAdmin appropriately.
|
194
|
+
|
195
|
+
```text
|
196
|
+
gem 'active_admin'
|
197
|
+
gem 'ui_datepicker_rails3'
|
198
|
+
```
|
199
|
+
|
200
|
+
Note: To configure css and js files with ActiveAdmin you can use the config DSL in the ActiveAdmin initializer.
|
data/Rakefile
ADDED
@@ -0,0 +1,18 @@
|
|
1
|
+
require 'rubygems'
|
2
|
+
require 'bundler'
|
3
|
+
begin
|
4
|
+
Bundler.setup(:default, :development)
|
5
|
+
rescue Bundler::BundlerError => e
|
6
|
+
$stderr.puts e.message
|
7
|
+
$stderr.puts "Run `bundle install` to install missing gems"
|
8
|
+
exit e.status_code
|
9
|
+
end
|
10
|
+
require 'rake'
|
11
|
+
|
12
|
+
require 'rspec/core'
|
13
|
+
require 'rspec/core/rake_task'
|
14
|
+
RSpec::Core::RakeTask.new(:spec) do |spec|
|
15
|
+
spec.pattern = FileList['spec/**/*_spec.rb']
|
16
|
+
end
|
17
|
+
|
18
|
+
task :default => :spec
|
data/init.rb
ADDED
@@ -0,0 +1,13 @@
|
|
1
|
+
require 'active_admin/inputs/ui_date_picker_input'
|
2
|
+
|
3
|
+
module ActiveAdmin
|
4
|
+
module Inputs
|
5
|
+
class UiDateTimePickerInput < UiDatePickerInput
|
6
|
+
def input_html_options
|
7
|
+
options = super
|
8
|
+
options[:class] = [options[:class], "ui-datetime-picker"].compact.join(' ')
|
9
|
+
options
|
10
|
+
end
|
11
|
+
end
|
12
|
+
end
|
13
|
+
end
|
@@ -0,0 +1,18 @@
|
|
1
|
+
module DateUtil
|
2
|
+
module Localize
|
3
|
+
# http://stackoverflow.com/questions/7580238/how-do-i-parse-non-english-dates-with-datetime-strptime-in-ruby
|
4
|
+
# value.nil? ? nil : I18n.localize(value)
|
5
|
+
def localized value
|
6
|
+
value
|
7
|
+
end
|
8
|
+
|
9
|
+
def to_english_date(date_string, country_code = :sv)
|
10
|
+
case country_code.to_sym
|
11
|
+
when :sv
|
12
|
+
date_string.gsub(/may|okt/, 'may' => 'May', 'okt' => 'Oct')
|
13
|
+
else
|
14
|
+
raise ArgumentError, "Country code #{sw} not currently supported, please extend DateUtil::Localize"
|
15
|
+
end
|
16
|
+
end
|
17
|
+
end
|
18
|
+
end
|
@@ -0,0 +1,33 @@
|
|
1
|
+
require 'formtastic/inputs/ui_date_picker_input'
|
2
|
+
|
3
|
+
module Formtastic::Inputs
|
4
|
+
class UiDatePickerInput < Formtastic::Inputs::StringInput
|
5
|
+
def to_html
|
6
|
+
input_wrapping do
|
7
|
+
label_html <<
|
8
|
+
builder.text_field(input_name, input_html_options)
|
9
|
+
end
|
10
|
+
end
|
11
|
+
|
12
|
+
def format
|
13
|
+
input_options[:format] || '%d %b %Y'
|
14
|
+
end
|
15
|
+
|
16
|
+
def value
|
17
|
+
input_options[:value] || object.send(method).try(:strftime, format)
|
18
|
+
end
|
19
|
+
|
20
|
+
def css_class
|
21
|
+
"ui-date-picker"
|
22
|
+
end
|
23
|
+
|
24
|
+
def input_html_options
|
25
|
+
new_class = [super[:class], css_class].compact.join(" ")
|
26
|
+
super.update(:class => new_class, :value => localized(value))
|
27
|
+
end
|
28
|
+
|
29
|
+
def localized value
|
30
|
+
value.nil? ? nil : I18n.localize(value)
|
31
|
+
end
|
32
|
+
end
|
33
|
+
end
|
@@ -0,0 +1,25 @@
|
|
1
|
+
module SimpleForm
|
2
|
+
module Inputs
|
3
|
+
class UiDatePickerInput < Base
|
4
|
+
def input
|
5
|
+
@builder.text_field(attribute_name, input_html_options)
|
6
|
+
end
|
7
|
+
|
8
|
+
protected
|
9
|
+
|
10
|
+
include DateUtil::Localize
|
11
|
+
|
12
|
+
def input_html_options
|
13
|
+
super.merge(date_picker_options(object.send(attribute_name)))
|
14
|
+
end
|
15
|
+
|
16
|
+
def date_picker_options(value = nil)
|
17
|
+
{:value => localized(value), :class => css_class}
|
18
|
+
end
|
19
|
+
|
20
|
+
def css_class
|
21
|
+
"ui-date-picker"
|
22
|
+
end
|
23
|
+
end
|
24
|
+
end
|
25
|
+
end
|
@@ -0,0 +1,41 @@
|
|
1
|
+
require 'date_util/localize'
|
2
|
+
|
3
|
+
module UiDatePickerRails3
|
4
|
+
module ClassMethods
|
5
|
+
def activate *names
|
6
|
+
names = names.flatten
|
7
|
+
names.each {|name| activate_one name }
|
8
|
+
end
|
9
|
+
|
10
|
+
def activate_one name
|
11
|
+
valid_framework? name
|
12
|
+
load_extension name
|
13
|
+
end
|
14
|
+
|
15
|
+
def load_extension name
|
16
|
+
require "#{name}/inputs_ext"
|
17
|
+
rescue Exception => e
|
18
|
+
raise NotImplementedError, "Unsupported Formbuilder or framework: #{name} - #{e}"
|
19
|
+
end
|
20
|
+
|
21
|
+
def valid_framework? name
|
22
|
+
case name.to_sym
|
23
|
+
when :simple_form
|
24
|
+
raise ArgumentError, "SimpleForm not defined" unless defined?(SimpleForm)
|
25
|
+
when :formtastic
|
26
|
+
raise ArgumentError, "Formtastic not defined" unless defined?(Formtastic)
|
27
|
+
when :active_admin
|
28
|
+
raise ArgumentError, "ActiveAdmin not defined" unless defined?(ActiveAdmin)
|
29
|
+
end
|
30
|
+
end
|
31
|
+
|
32
|
+
def ui_theme theme
|
33
|
+
"ui/#{theme}/jquery-ui-theme"
|
34
|
+
end
|
35
|
+
|
36
|
+
def ui_localizers *country_codes
|
37
|
+
country_codes.map {|cc| "ui/i18n/jquery.ui.datepicker-#{cc}" }
|
38
|
+
end
|
39
|
+
end
|
40
|
+
extend ClassMethods
|
41
|
+
end
|
data/spec/base_helper.rb
ADDED
@@ -0,0 +1,26 @@
|
|
1
|
+
require 'rubygems'
|
2
|
+
require 'bundler'
|
3
|
+
Bundler.setup
|
4
|
+
|
5
|
+
$LOAD_PATH.unshift(File.join(File.dirname(__FILE__), '..', 'lib'))
|
6
|
+
$LOAD_PATH.unshift(File.dirname(__FILE__))
|
7
|
+
require 'rspec'
|
8
|
+
|
9
|
+
require 'active_support'
|
10
|
+
require 'action_pack'
|
11
|
+
require 'action_view'
|
12
|
+
require 'action_controller'
|
13
|
+
require 'formtastic'
|
14
|
+
require 'rspec_tag_matchers'
|
15
|
+
|
16
|
+
# Requires supporting files with custom matchers and macros, etc,
|
17
|
+
# in ./support/ and its subdirectories.
|
18
|
+
Dir["#{File.dirname(__FILE__)}/support/**/*.rb"].each {|f| require f}
|
19
|
+
|
20
|
+
require 'ui_datepicker-rails3'
|
21
|
+
|
22
|
+
RSpec.configure do |config|
|
23
|
+
config.include RspecTagMatchers
|
24
|
+
config.include CustomMacros
|
25
|
+
config.mock_with :rspec
|
26
|
+
end
|