Andy Rails Toolbox includes many useful helpers for rails development.
Installation
Add this line to your application's Gemfile:
gem 'andy_rails_toolbox'
And then execute:
$ bundle
Or install it yourself as:
$ gem install andy_rails_toolbox
Usage
BootstrapHelper
Bootstrap Homepage: http://getbootstrap.com/
Add below codes to layout app/views/layout/application.html.erb
...
<%= stylesheet_link_tag '//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css' %>
...
<%= javascript_include_tag '//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js' %>
...
Examples
ICONS
bs_icon 'user'
# => <span class="glyphicon glyphicon-user"></span>
LINK BUTTONS
link_button 'link_label', '/'
# => <a class="btn btn-default" href="/">link_label</a>
link_button 'link_label', '/', color: 'primary'
# => <a class="btn btn-primary" href="/">link_label</a>
link_button 'link_label', '/', size: 'sm'
# => <a class="btn btn-default btn-sm" href="/">link_label</a>
link_button 'link_label', '/', block: true
# => <a class="btn btn-default btn-block" href="/">link_label</a>
link_button 'link_label', '/', active: true
# => <a class="btn btn-default active" href="/">link_label</a>
link_button 'link_label', '/', disabled: true
# => <a class="btn btn-default disabled" href="/">link_label</a>
link_button 'link-button', '/', class: 'preset-class'
# => <a class="btn btn-default preset-class" href="/">link_label</a>
link_button 'link-button', '/', label_hidden: 'xs'
# => <a class="btn btn-default" href="/"><span class="hidden-xs">link_label</span></a>
link_button 'link_label', '/', icon: 'user'
# => <a class="btn btn-default" href="/"><i class="fa fa-user"></i> link_label</a>
BUTTONS
button 'button'
# => <button name="button" type="button" class="btn btn-default">button</button>
submit_button 'submit'
# => <button name="submit" type="submit" class="btn btn-primary"><i class="fa fa-check"></i> submit</button>
reset_button 'reset'
# => <button name="reset" type="reset" class="btn btn-default"><i class="fa fa-eraser"></i> reset</button>
RADIO BUTTONS GROUP
= radio_buttons_group name: 'sex' do |radios|
- radios << { label: 'Male', value: 'male', active: params[:sex] == 'male', icon: 'male' }
- radios << { label: 'Female', value: 'female', active: params[:sex] == 'female', icon: 'female' }
# => <div data-toggle="buttons" class="btn-group">
# => <label class="btn btn-default" for="male">
# => <input type="radio" name="sex" id="sex_male" value="male" />
# => <i class="fa fa-male"></i> Male
# => </label>
# => <label class="btn btn-default" for="female">
# => <input type="radio" name="sex" id="sex_female" value="female" />
# => <i class="fa fa-female"></i> Female
# => </label>
# => </div>
IMAGES
image_responsive 'pic.png'
# => <img class="img-responsive" src="/images/pic.png" alt="Pic" />
image_rounded 'pic.png'
# => <img class="img-rounded" src="/images/pic.png" alt="Pic" />
image_circle 'pic.png'
# => <img class="img-circle" src="/images/pic.png" alt="Pic" />
image_thumbnail 'pic.png'
# => <img class="img-thumbnail" src="/images/pic.png" alt="Pic" />
MarkdownHelper
New a css erb file app/assets/stylesheets/pygments.css.erb
for pygments color style
<%= Pygments.css(style: "igor") %>
All styles:
$ rails c
# => Loading development environment (Rails 4.2.0)
irb(main):001:0> require 'pygments.rb'
# => true
irb(main):002:0> Pygments.styles
# => ["manni", "igor", "xcode", "vim", "autumn", "vs", "rrt", "native", "perldoc", "borland", "tango", "emacs", "friendly", "monokai", "paraiso-dark", "colorful", "murphy", "bw", "pastie", "paraiso-light", "trac", "default", "fruity"]
Examples
markdown '# h1'
# => <h1>h1</h1>
markdown '## h2'
# => <h2>h2</h2>
markdown '[an example](http://example.com/)'
# => <p><a href="http://example.com/">an example</a></p>
markdown @post.content
# => transform markdown code to html codes and payments highlighter
QrcodeHelper Examples
qrcode 'Hello world!'
QRCode options parameters: Here
qrcode 'Hello world!', width: '300', output_encoding: 'Shift_JIS', error_correction_level: 'H', margin: '10'
FontAwesomeHelper
Font Awesome icons Homepage: http://fortawesome.github.io/Font-Awesome/
In your application.css
, include the css file:
/*
*= require font-awesome
*/
Then restart your webserver if it was previously running
Examples
fa_icon "user"
# => <i class="fa fa-user"></i>
fa_icon "user", text: "Login"
# => <i class="fa fa-user"></i> Login
fa_icon "user", text: "Login", right: true
# => Login <i class="fa fa-user"></i>
fa_icon "user 4x"
# => <i class="fa fa-user fa-4x"></i>
TimeagoHelper
Add below codes to file app/assets/javascripts/application.js
...
//= require jquery.timeago
//= require jquery.timeago.zh-TW
//= require jquery.timeago.load
...
Use in View
timeago '2014-11-21 09:38:27.256503'
# => '2εζδΉε'
Contributing
- Fork it ( https://github.com/ChouAndy/andy_rails_toolbox/fork )
- Create your feature branch (
git checkout -b my-new-feature
) - Commit your changes (
git commit -am 'Add some feature'
) - Push to the branch (
git push origin my-new-feature
) - Create a new Pull Request