Andy Rails Toolbox

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

1. Fork it ( https://github.com/ChouAndy/andy_rails_toolbox/fork )
2. Create your feature branch (git checkout -b my-new-feature)
3. Commit your changes (git commit -am 'Add some feature')
4. Push to the branch (git push origin my-new-feature)
5. Create a new Pull Request