LayMeOut

Provides the common layout and assets for all PayrollHero apps. LayMeOut requires the asset pipeline to automatically include stylesheets.

Installation

Add this line to your application's Gemfile:

gem 'lay_me_out'

And then execute:

$ bundle

Or install it yourself as:

$ gem install lay_me_out

Usage

Add this line to your app's ApplicationController:

include LayMeOut::Layout

then require LayMeOut in your application.css file:

*= require self
*= require lay_me_out

and in your application.js file:

//= require jquery
//= require lay_me_out

and you are all hooked up!

Simple Layout

Lay-Me-Out comes with two different types of layouts - the default layout, and a basic layout. If you would like to use the basic layout, simply add the following line after the include in your controller:

use_simple_layout

User Profile

The user profile partial expects a method called #current_user_details to be available from the current controller. It should return a LayMeOut::UserDetails object that responds to the following:

  • #name - Returns a string representing the user's name
  • #position - Returns a string representing the user's job position
  • #links - Returns a hash representing the links to appear in the user profile drop down. The key should be the link title, the value should be the link itself.
  • #profile_picture - Returns a url to the user's profile picture.
def current_user_details
  LayMeOut::UserDetails.new(
    :name => "Bruce Wayne",
    :position => "Caped Crusader",
    :links => { "Bruce Wayne" => "http://localhost:3000", "Profile Settings" => "http://localhost:3000/profile", "Logout" => "http://localhost:3000/logout" },
    :profile_picture => "https://example.com/profile.png"
  )
end

The only required field is name.

The navigation bar expects a method called #navigation_links to be available from the current controller. It should return a hash where the keys are the link title, and the value is either the path or a nested hash. E.g.

{
  "Dashboards" => root_path,
  "My Clock" => {
    "My Clock" => "/my_clock",
    "Time Card & Accruals" => "/time_card"
  },
  "Scheduling" => "/scheduling",
  "Analytics" => "/analytics",
  "Developer" => {
    "Biometric Verification" => "/verification",
  }
}

Flash Messages

Flash messages are built in to the layout gem. If it is a flash message displayed through a normal page reload, then they will automatically work. If you want to display the messages through an AJAX request, you can currently do so by calling the following function in your Javascript:

var flash = LayMeOut.Utils.FlashMessage.getInstance({
  containerId: 'flash',
  messageClass: 'message',
  messageTemplateId: 'flash-message-template',
  interval: 5000
});

Then you can show a message using:

flash.showFlashMessages({ type: "error", content: "You did something bad!"});

Or multiple messages using:

flash.showFlashMessages([ { type: "error", content: "You did something bad!"},
                          { type: "warning", content: "Meh, whatever"},
                          { type: "success", content: "You did something good!"},
                          { type: "success", content: "And another thing too!"}
                        ]);

Currently supported flash message types are error, warning and success.

LayMeOut uses breadcrumbs_on_rails to display breadcrumbs. The basic way to add breadcrumbs is like this:

class MyController < ApplicationController
  add_breadcrumb "home", :root_path
  add_breadcrumb "my", :my_path

  def index
    # ...

    add_breadcrumb "index", index_path
  end
end

Please see the breadcrumbs_on_rails docs for further usage.

Styleguide

Add this line to your app's config/routes.rb:

mount LayMeOut::Engine => "/lay_me_out"

Then go to localhost:3000/lay_me_out on your app to see the style guide.

Segment.io Support

LayMeOut provides client-side support for Segment.io. In order to configure it, simply provide an initializer file in config/initializers with the Segment.io secret as follows:

#config/initializers/segment_io.rb
SegmentIO.configure do |config|
  config.api_key = 'abcd123456' #replace with your segment.io API key
end

Segment.io will only be applied when Rails is using the production environment. If you want server-side support, you will need to include the analytics-ruby gem and set it up with your web server

Layout Hooks

There are two yields in both layouts in case you need to insert content such as css and javascript include tags in the head tag or the footer div. In your view, for the header use:

- content_for :header_content do
  #content to insert

And for the footer use:

- content_for :footer_content do
  #content to insert