bootstrap_builder 0.2.2 → 0.2.3
Sign up to get free protection for your applications and to get access to all the features.
- data/README.md +69 -40
- data/VERSION +1 -1
- data/app/assets/javascripts/bootstrap.js +55 -51
- data/app/assets/stylesheets/bootstrap-responsive.css +337 -218
- data/app/assets/stylesheets/bootstrap.css +1022 -397
- data/bootstrap_builder.gemspec +2 -2
- metadata +2 -2
data/README.md
CHANGED
@@ -14,58 +14,69 @@ A Rails form builder that generates [Twitter Bootstrap](http://twitter.github.co
|
|
14
14
|
|
15
15
|
Add gem definition to your Gemfile:
|
16
16
|
|
17
|
-
|
17
|
+
``` ruby
|
18
|
+
gem 'bootstrap_builder'
|
19
|
+
```
|
18
20
|
|
19
21
|
Bundle it:
|
20
22
|
|
21
23
|
bundle install
|
22
24
|
|
23
|
-
Require it in your CSS manifest file:
|
25
|
+
Require it in your CSS manifest file: ('bootstrap-responsive' is optional)
|
24
26
|
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
27
|
+
``` css
|
28
|
+
//= require bootstrap
|
29
|
+
//= require bootstrap-responsive
|
30
|
+
```
|
29
31
|
|
30
|
-
|
32
|
+
Require it in your Javascript manifest file if you want to use Bootstrap's jQuery plugins:
|
31
33
|
|
34
|
+
``` css
|
35
|
+
//= require bootstrap
|
36
|
+
```
|
32
37
|
## Usage (with haml)
|
33
38
|
|
34
39
|
Use `bootstrap_form_for` when you want to render a form with Bootstrap markup.
|
35
40
|
|
36
41
|
### A sample user form
|
37
42
|
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
43
|
+
``` ruby
|
44
|
+
= bootstrap_form_for @user, :url => [:admin, @user] do |f|
|
45
|
+
= f.text_field :name
|
46
|
+
= f.number_field :age, nil, :in => 1...100
|
47
|
+
= f.email_field :email, :prepend => '@'
|
48
|
+
= f.phone_field :phone
|
49
|
+
= f.password_field :password
|
50
|
+
= f.password_field :password_confirmation
|
51
|
+
= f.select :role, User::ROLES
|
52
|
+
= f.time_zone_select :time_zone
|
53
|
+
= f.check_box :reminder, :label => 'Send Daily Reminder?'
|
54
|
+
= f.submit 'Save'
|
55
|
+
```
|
49
56
|
|
50
57
|
### A login form
|
51
58
|
|
52
59
|
Add a class to the form or any field to change the way it is rendered.
|
53
60
|
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
61
|
+
``` ruby
|
62
|
+
= bootstrap_form_for @session_user, :url => login_path, :class => 'form-horizontal' do |f|
|
63
|
+
= f.text_field :email
|
64
|
+
= f.password_field :password
|
65
|
+
= f.check_box :remember_me, :label => 'Remember me when I come back'
|
66
|
+
= f.submit 'Log In'
|
67
|
+
```
|
68
|
+
|
60
69
|
### A search form
|
61
70
|
|
62
71
|
Hide the label by passing `:label => ''` on any field. (Useful for inline search forms)
|
63
72
|
|
64
73
|
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
74
|
+
``` ruby
|
75
|
+
= bootstrap_form_for @search, :url => [:admin, :users], :html => {:method => :get, :class => 'form-search'} do |f|
|
76
|
+
= f.text_field :name_equals, :label => 'Find by', :placeholder => 'Name'
|
77
|
+
= f.select :role_equals, User::ROLES, :label => ''
|
78
|
+
= f.submit 'Search', :class => 'btn-default'
|
79
|
+
```
|
69
80
|
|
70
81
|
*(Example using [MetaSearch](https://github.com/ernie/meta_search) helpers)*
|
71
82
|
|
@@ -73,48 +84,66 @@ Hide the label by passing `:label => ''` on any field. (Useful for inline search
|
|
73
84
|
|
74
85
|
A single checkbox:
|
75
86
|
|
76
|
-
|
87
|
+
``` ruby
|
88
|
+
= f.check_box :send_reminder
|
89
|
+
```
|
77
90
|
|
78
91
|
A group of checkboxes:
|
79
92
|
|
80
|
-
|
93
|
+
``` ruby
|
94
|
+
= f.check_box :colours, :values => [['Red', 1], ['Green', 2], ['Blue', 3]]
|
95
|
+
```
|
81
96
|
|
82
97
|
### Radio buttons
|
83
98
|
|
84
99
|
A single radio button:
|
85
100
|
|
86
|
-
|
101
|
+
``` ruby
|
102
|
+
= f.check_box :role, 'admin'
|
103
|
+
```
|
87
104
|
|
88
105
|
A group of radio buttons:
|
89
106
|
|
90
|
-
|
107
|
+
``` ruby
|
108
|
+
= f.radio_button :role, [['Admin', 1], ['Manager', 2], ['Editor', 3]]
|
109
|
+
```
|
91
110
|
|
92
111
|
### More examples
|
93
112
|
|
94
113
|
Override the autogenerated label by using the `:label` option on any element.
|
95
114
|
|
96
|
-
|
115
|
+
``` ruby
|
116
|
+
= f.text_field :name, :label => 'Full name'
|
117
|
+
```
|
97
118
|
|
98
119
|
Use `:append` and `:prepend` on any field:
|
99
120
|
|
100
|
-
|
101
|
-
|
102
|
-
|
121
|
+
``` ruby
|
122
|
+
= f.text_field :price, :append => '.00'
|
123
|
+
= f.email_field :email, :prepend => '@'
|
124
|
+
```
|
103
125
|
|
104
126
|
Use `:help_block` to provide extra description to a fields:
|
105
127
|
|
106
|
-
|
128
|
+
``` ruby
|
129
|
+
= f.email_field :email, :help_block => 'Please enter your emails address'
|
130
|
+
```
|
107
131
|
|
132
|
+
## Extra functionality
|
108
133
|
|
109
|
-
### Prevent double clicking
|
134
|
+
### Prevent double clicking on submit buttons
|
110
135
|
|
111
136
|
If you add 'bootstrap_builder' to your Javascript manifest you'll be able to add an extra `:change_to_text` option to submit buttons.
|
112
137
|
|
113
|
-
|
138
|
+
``` css
|
139
|
+
//= require bootstrap_builder
|
140
|
+
```
|
114
141
|
|
115
142
|
This will allow you to prevent double clicking by replacing the submit button with a string after the button is clicked:
|
116
143
|
|
117
|
-
|
144
|
+
``` ruby
|
145
|
+
= f.submit 'Log In', :change_to_text => 'Saving ...'
|
146
|
+
```
|
118
147
|
|
119
148
|
|
120
149
|
---
|
data/VERSION
CHANGED
@@ -1 +1 @@
|
|
1
|
-
0.2.
|
1
|
+
0.2.3
|
@@ -1,5 +1,5 @@
|
|
1
1
|
/* ===================================================
|
2
|
-
* bootstrap-transition.js v2.0.
|
2
|
+
* bootstrap-transition.js v2.0.2
|
3
3
|
* http://twitter.github.com/bootstrap/javascript.html#transitions
|
4
4
|
* ===================================================
|
5
5
|
* Copyright 2012 Twitter, Inc.
|
@@ -47,10 +47,9 @@
|
|
47
47
|
})()
|
48
48
|
|
49
49
|
})
|
50
|
-
|
51
|
-
}( window.jQuery )
|
52
|
-
|
53
|
-
* bootstrap-alert.js v2.0.0
|
50
|
+
|
51
|
+
}( window.jQuery );/* ==========================================================
|
52
|
+
* bootstrap-alert.js v2.0.2
|
54
53
|
* http://twitter.github.com/bootstrap/javascript.html#alerts
|
55
54
|
* ==========================================================
|
56
55
|
* Copyright 2012 Twitter, Inc.
|
@@ -102,11 +101,14 @@
|
|
102
101
|
|
103
102
|
$parent.length || ($parent = $this.hasClass('alert') ? $this : $this.parent())
|
104
103
|
|
105
|
-
$parent
|
104
|
+
$parent
|
105
|
+
.trigger('close')
|
106
|
+
.removeClass('in')
|
106
107
|
|
107
108
|
function removeElement() {
|
108
|
-
$parent
|
109
|
-
|
109
|
+
$parent
|
110
|
+
.trigger('closed')
|
111
|
+
.remove()
|
110
112
|
}
|
111
113
|
|
112
114
|
$.support.transition && $parent.hasClass('fade') ?
|
@@ -139,9 +141,8 @@
|
|
139
141
|
$('body').on('click.alert.data-api', dismiss, Alert.prototype.close)
|
140
142
|
})
|
141
143
|
|
142
|
-
}( window.jQuery )
|
143
|
-
|
144
|
-
* bootstrap-button.js v2.0.0
|
144
|
+
}( window.jQuery );/* ============================================================
|
145
|
+
* bootstrap-button.js v2.0.2
|
145
146
|
* http://twitter.github.com/bootstrap/javascript.html#buttons
|
146
147
|
* ============================================================
|
147
148
|
* Copyright 2012 Twitter, Inc.
|
@@ -233,13 +234,14 @@
|
|
233
234
|
|
234
235
|
$(function () {
|
235
236
|
$('body').on('click.button.data-api', '[data-toggle^=button]', function ( e ) {
|
236
|
-
$(e.target)
|
237
|
+
var $btn = $(e.target)
|
238
|
+
if (!$btn.hasClass('btn')) $btn = $btn.closest('.btn')
|
239
|
+
$btn.button('toggle')
|
237
240
|
})
|
238
241
|
})
|
239
242
|
|
240
|
-
}( window.jQuery )
|
241
|
-
|
242
|
-
* bootstrap-carousel.js v2.0.0
|
243
|
+
}( window.jQuery );/* ==========================================================
|
244
|
+
* bootstrap-carousel.js v2.0.2
|
243
245
|
* http://twitter.github.com/bootstrap/javascript.html#carousel
|
244
246
|
* ==========================================================
|
245
247
|
* Copyright 2012 Twitter, Inc.
|
@@ -269,6 +271,9 @@
|
|
269
271
|
this.$element = $(element)
|
270
272
|
this.options = $.extend({}, $.fn.carousel.defaults, options)
|
271
273
|
this.options.slide && this.slide(this.options.slide)
|
274
|
+
this.options.pause == 'hover' && this.$element
|
275
|
+
.on('mouseenter', $.proxy(this.pause, this))
|
276
|
+
.on('mouseleave', $.proxy(this.cycle, this))
|
272
277
|
}
|
273
278
|
|
274
279
|
Carousel.prototype = {
|
@@ -301,6 +306,7 @@
|
|
301
306
|
|
302
307
|
, pause: function () {
|
303
308
|
clearInterval(this.interval)
|
309
|
+
this.interval = null
|
304
310
|
return this
|
305
311
|
}
|
306
312
|
|
@@ -328,6 +334,8 @@
|
|
328
334
|
|
329
335
|
$next = $next.length ? $next : this.$element.find('.item')[fallback]()
|
330
336
|
|
337
|
+
if ($next.hasClass('active')) return
|
338
|
+
|
331
339
|
if (!$.support.transition && this.$element.hasClass('slide')) {
|
332
340
|
this.$element.trigger('slide')
|
333
341
|
$active.removeClass('active')
|
@@ -373,6 +381,7 @@
|
|
373
381
|
|
374
382
|
$.fn.carousel.defaults = {
|
375
383
|
interval: 5000
|
384
|
+
, pause: 'hover'
|
376
385
|
}
|
377
386
|
|
378
387
|
$.fn.carousel.Constructor = Carousel
|
@@ -391,9 +400,8 @@
|
|
391
400
|
})
|
392
401
|
})
|
393
402
|
|
394
|
-
}( window.jQuery )
|
395
|
-
|
396
|
-
* bootstrap-collapse.js v2.0.0
|
403
|
+
}( window.jQuery );/* =============================================================
|
404
|
+
* bootstrap-collapse.js v2.0.2
|
397
405
|
* http://twitter.github.com/bootstrap/javascript.html#collapse
|
398
406
|
* =============================================================
|
399
407
|
* Copyright 2012 Twitter, Inc.
|
@@ -468,7 +476,9 @@
|
|
468
476
|
[dimension](size || 'auto')
|
469
477
|
[0].offsetWidth
|
470
478
|
|
471
|
-
this.$element
|
479
|
+
this.$element[size ? 'addClass' : 'removeClass']('collapse')
|
480
|
+
|
481
|
+
return this
|
472
482
|
}
|
473
483
|
|
474
484
|
, transition: function ( method, startEvent, completeEvent ) {
|
@@ -527,9 +537,8 @@
|
|
527
537
|
})
|
528
538
|
})
|
529
539
|
|
530
|
-
}( window.jQuery )
|
531
|
-
|
532
|
-
* bootstrap-dropdown.js v2.0.0
|
540
|
+
}( window.jQuery );/* ============================================================
|
541
|
+
* bootstrap-dropdown.js v2.0.2
|
533
542
|
* http://twitter.github.com/bootstrap/javascript.html#dropdowns
|
534
543
|
* ============================================================
|
535
544
|
* Copyright 2012 Twitter, Inc.
|
@@ -619,9 +628,8 @@
|
|
619
628
|
$('body').on('click.dropdown.data-api', toggle, Dropdown.prototype.toggle)
|
620
629
|
})
|
621
630
|
|
622
|
-
}( window.jQuery )
|
623
|
-
|
624
|
-
* bootstrap-modal.js v2.0.0
|
631
|
+
}( window.jQuery );/* =========================================================
|
632
|
+
* bootstrap-modal.js v2.0.2
|
625
633
|
* http://twitter.github.com/bootstrap/javascript.html#modals
|
626
634
|
* =========================================================
|
627
635
|
* Copyright 2012 Twitter, Inc.
|
@@ -648,7 +656,7 @@
|
|
648
656
|
* ====================== */
|
649
657
|
|
650
658
|
var Modal = function ( content, options ) {
|
651
|
-
this.options =
|
659
|
+
this.options = options
|
652
660
|
this.$element = $(content)
|
653
661
|
.delegate('[data-dismiss="modal"]', 'click.dismiss.modal', $.proxy(this.hide, this))
|
654
662
|
}
|
@@ -799,16 +807,17 @@
|
|
799
807
|
return this.each(function () {
|
800
808
|
var $this = $(this)
|
801
809
|
, data = $this.data('modal')
|
802
|
-
, options = typeof option == 'object' && option
|
810
|
+
, options = $.extend({}, $.fn.modal.defaults, $this.data(), typeof option == 'object' && option)
|
803
811
|
if (!data) $this.data('modal', (data = new Modal(this, options)))
|
804
812
|
if (typeof option == 'string') data[option]()
|
805
|
-
else data.show()
|
813
|
+
else if (options.show) data.show()
|
806
814
|
})
|
807
815
|
}
|
808
816
|
|
809
817
|
$.fn.modal.defaults = {
|
810
818
|
backdrop: true
|
811
819
|
, keyboard: true
|
820
|
+
, show: true
|
812
821
|
}
|
813
822
|
|
814
823
|
$.fn.modal.Constructor = Modal
|
@@ -828,9 +837,8 @@
|
|
828
837
|
})
|
829
838
|
})
|
830
839
|
|
831
|
-
}( window.jQuery )
|
832
|
-
|
833
|
-
* bootstrap-tooltip.js v2.0.0
|
840
|
+
}( window.jQuery );/* ===========================================================
|
841
|
+
* bootstrap-tooltip.js v2.0.2
|
834
842
|
* http://twitter.github.com/bootstrap/javascript.html#tooltips
|
835
843
|
* Inspired by the original jQuery.tipsy by Jason Frame
|
836
844
|
* ===========================================================
|
@@ -1037,7 +1045,7 @@
|
|
1037
1045
|
title = $e.attr('data-original-title')
|
1038
1046
|
|| (typeof o.title == 'function' ? o.title.call($e[0]) : o.title)
|
1039
1047
|
|
1040
|
-
title = title.toString().replace(/(^\s*|\s*$)/, "")
|
1048
|
+
title = (title || '').toString().replace(/(^\s*|\s*$)/, "")
|
1041
1049
|
|
1042
1050
|
return title
|
1043
1051
|
}
|
@@ -1098,9 +1106,8 @@
|
|
1098
1106
|
, template: '<div class="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>'
|
1099
1107
|
}
|
1100
1108
|
|
1101
|
-
}( window.jQuery )
|
1102
|
-
|
1103
|
-
* bootstrap-popover.js v2.0.0
|
1109
|
+
}( window.jQuery );/* ===========================================================
|
1110
|
+
* bootstrap-popover.js v2.0.2
|
1104
1111
|
* http://twitter.github.com/bootstrap/javascript.html#popovers
|
1105
1112
|
* ===========================================================
|
1106
1113
|
* Copyright 2012 Twitter, Inc.
|
@@ -1193,9 +1200,8 @@
|
|
1193
1200
|
, template: '<div class="popover"><div class="arrow"></div><div class="popover-inner"><h3 class="popover-title"></h3><div class="popover-content"><p></p></div></div></div>'
|
1194
1201
|
})
|
1195
1202
|
|
1196
|
-
}( window.jQuery )
|
1197
|
-
|
1198
|
-
* bootstrap-scrollspy.js v2.0.0
|
1203
|
+
}( window.jQuery );/* =============================================================
|
1204
|
+
* bootstrap-scrollspy.js v2.0.2
|
1199
1205
|
* http://twitter.github.com/bootstrap/javascript.html#scrollspy
|
1200
1206
|
* =============================================================
|
1201
1207
|
* Copyright 2012 Twitter, Inc.
|
@@ -1318,9 +1324,8 @@
|
|
1318
1324
|
})
|
1319
1325
|
})
|
1320
1326
|
|
1321
|
-
}( window.jQuery )
|
1322
|
-
|
1323
|
-
* bootstrap-tab.js v2.0.0
|
1327
|
+
}( window.jQuery );/* ========================================================
|
1328
|
+
* bootstrap-tab.js v2.0.2
|
1324
1329
|
* http://twitter.github.com/bootstrap/javascript.html#tabs
|
1325
1330
|
* ========================================================
|
1326
1331
|
* Copyright 2012 Twitter, Inc.
|
@@ -1448,9 +1453,8 @@
|
|
1448
1453
|
})
|
1449
1454
|
})
|
1450
1455
|
|
1451
|
-
}( window.jQuery )
|
1452
|
-
|
1453
|
-
* bootstrap-typeahead.js v2.0.0
|
1456
|
+
}( window.jQuery );/* =============================================================
|
1457
|
+
* bootstrap-typeahead.js v2.0.2
|
1454
1458
|
* http://twitter.github.com/bootstrap/javascript.html#typeahead
|
1455
1459
|
* =============================================================
|
1456
1460
|
* Copyright 2012 Twitter, Inc.
|
@@ -1491,6 +1495,7 @@
|
|
1491
1495
|
, select: function () {
|
1492
1496
|
var val = this.$menu.find('.active').attr('data-value')
|
1493
1497
|
this.$element.val(val)
|
1498
|
+
this.$element.change();
|
1494
1499
|
return this.hide()
|
1495
1500
|
}
|
1496
1501
|
|
@@ -1616,9 +1621,6 @@
|
|
1616
1621
|
}
|
1617
1622
|
|
1618
1623
|
, keyup: function (e) {
|
1619
|
-
e.stopPropagation()
|
1620
|
-
e.preventDefault()
|
1621
|
-
|
1622
1624
|
switch(e.keyCode) {
|
1623
1625
|
case 40: // down arrow
|
1624
1626
|
case 38: // up arrow
|
@@ -1631,6 +1633,7 @@
|
|
1631
1633
|
break
|
1632
1634
|
|
1633
1635
|
case 27: // escape
|
1636
|
+
if (!this.shown) return
|
1634
1637
|
this.hide()
|
1635
1638
|
break
|
1636
1639
|
|
@@ -1638,10 +1641,11 @@
|
|
1638
1641
|
this.lookup()
|
1639
1642
|
}
|
1640
1643
|
|
1644
|
+
e.stopPropagation()
|
1645
|
+
e.preventDefault()
|
1641
1646
|
}
|
1642
1647
|
|
1643
1648
|
, keypress: function (e) {
|
1644
|
-
e.stopPropagation()
|
1645
1649
|
if (!this.shown) return
|
1646
1650
|
|
1647
1651
|
switch(e.keyCode) {
|
@@ -1661,12 +1665,12 @@
|
|
1661
1665
|
this.next()
|
1662
1666
|
break
|
1663
1667
|
}
|
1668
|
+
|
1669
|
+
e.stopPropagation()
|
1664
1670
|
}
|
1665
1671
|
|
1666
1672
|
, blur: function (e) {
|
1667
1673
|
var that = this
|
1668
|
-
e.stopPropagation()
|
1669
|
-
e.preventDefault()
|
1670
1674
|
setTimeout(function () { that.hide() }, 150)
|
1671
1675
|
}
|
1672
1676
|
|
@@ -1719,4 +1723,4 @@
|
|
1719
1723
|
})
|
1720
1724
|
})
|
1721
1725
|
|
1722
|
-
}( window.jQuery )
|
1726
|
+
}( window.jQuery );
|