List of Compass Mixins

Since we are migrating from our homegrown mixins.sass and helpers.sass to Compass, here is a list of all the mixins provided by Compass.

Compiling Javascript template functions with the asset pipeline

The asset pipeline (which is actually backed by sprockets) has a nice feature where templates ending in .jst are compiled into Javascript template functions. These templates can be rendered by calling JST['path/to/template'](template: 'variables'):

<!-- templates/hello.jst.ejs -->
<div>Hello, <span><%= name %></span>!</div>

// application.js
//= require templates/hello
$("#hello").html(JST["templates/hello"]({ name: "Sam" }));

Whatever is in the <% ... %> is evaluated in Javascript...

Getting rid of space between inline-block elements

When two elements with display: inline-block are sitting next to each other, whitespace between becomes a space character.

Solutions, in decreasing order of awesomeness:

  1. Don't have whitespace between two elements! See Whitespace Removal in Haml if you're using Haml.
  2. Don't use inline-block. Use floating elements instead (don't forget to clear them!).
  3. Try to compensate for the space with a negative margin. Unfortunately you will never be able to negate ...

Font Awesome: List of Unicode glyphs and HTML entities

A list of FontAwesome icons in the form of copyable Unicode characters or HTML entities.

You might prefer to use FontAwesome by simply typing out these characters instead of using CSS classes. Of course you need to then give the containing element as style:

font-family: FontAwesome

Nested controller routes (Rails 2 and 3)

In order to keep the controllers directory tidy, we recently started to namespace controllers. With the :controller option you can tell Rails which controller to use for a path or resource. For nested resources, Rails will determine the view path from this option, too.

That means the following code in routes.rb

resources :users do
  resource :profile, controller: 'users/profiles' #[1]
end

… makes Rails expect the following directory structure:

app/
  controllers/
    users/
      profiles_controller.rb
    users_control...

Rails: Output helpers for migrations

When you're writing migrations that do more than changing tables (like, modify many records) you may want some output. In Rails > 3.1 you have two methods at hand: announce and say_with_time.

In the migration:

class AddUserToken < ActiveRecord::Migration

  class User < ActiveRecod::Base; end

  def up
    add_column :users, :token, :string
    
    announce "now generating tokens"
    User.find_in_batches do |users|
      say_with_time "For users ##{users.first.id} to ##{users.last.id}" do
        users.each do |user|
        ...

Font sizing with rem - Snook.ca

CSS3 comes with new unit rem. It works like em but it is always relative to the <html> element instead of the parent element.

rem units are supported by all browsers and IE9+.

Git & Mac: Working with Unicode filenames

I had some problems with Git and the file spec/fixtures/ČeskýÁČĎÉĚÍŇÓŘŠŤÚŮÝŽáčďéěíňóřšťúůýž. After pulling the latest commits, it would show that file as untracked, but adding and committing it would throw error: pathspec 'check in unicode fixture file once again' did not match any file(s) known to git.

Solution

Install Git version > 1.8.2 using homebrew and set

git config --global core.precomposeunicode true

Done.

Reason

According to the linked Stackoverflow post ...

... the cause is the different im...

Testing shared traits or modules without repeating yourself

When two classes implement the same behavior (methods, callbacks, etc.), you should extract that behavior into a trait or module. This card describes how to test that extracted behavior without repeating yourself.

Note that the examples below use Modularity traits to extract shared behavior. This is simply because we like to do it that way at makandra. The same techniques apply for modules and overriding self.included.

Example
---...

Render a view from a model in Rails

In Rails 5 you can say:

ApplicationController.render(
  :template => 'users/index',
  :layout => 'my_layout',
  :assigns => { users: @users }
)

If a Request Environment is needed you can set attributes default attributes or initialize a new renderer in an explicit way (e.g. if you want to use users_url in the template):

ApplicationController.renderer.defaults # =>
{
  http_host: 'example.org',
  https:      false,
  ...
}
...

Rails: Disable options of a select field

Simply give the select helper an option :disabled, passing either a single value or an array. You need to specify the option's value, not its text.

= form.select :country, Address.countries_for_select, :include_blank => true, :disabled => ['disabled-value1', 'disabled-value-2']

Also see Cucumber: Check if a select field contains a disabled option on how to test this.

exception_notification 3.0.0+ lets you send errors as HTML e-mails

Exception notifications contain a lot of information: Backtraces, HTTP headers, etc. exception_notification tries its best to format this wall of information using ASCII art, but you can also make it send those notification as simple HTML e-mails that have some simple formatting for clarity, but no images etc. To do so, activate this option:

:email_format => :html

Those HTML notifications are still delivered with a text-only version, so if you are using a console cli...

Speed up your websites: Put JavaScripts at bottom

For websites that don't do JavaScript rendering on the client, it's best practice to put script tags at the bottom of the HTML. This way, the page can start to render before scripts have been loaded and run.

The caveat is that you also have to move all other script tags from your views to the bottom of the page. This can be done with helpers.

How to implement

  1. Add the attached javascript_helper to your app.
  2. Move your `javascript_i...

Sprites with Compass

Using CSS sprites for background images is a technique for optimizing page load time by combining smaller images into a larger image sprite.

There are ongoing arguments on how useful this still is, as modern browsers become more comfortable to load images in parallel. However, many major websites still use them, for example amazon, [facebook](...

iOS 5 "position: fixed" and virtual keyboard issues

The ipad onscreen keyboard changes position:fixed style to position:static that misplaces those elements and you'll have problems on each page with a form, e.g. search field.

There are several workarounds/hacks but no straight forward fix yet. Expect additional expense.

Live CSS / view reloading

Next time you have to do more than trivial CSS changes on a project, you probably want to have live CSS reloading, so every time you safe your css, the browser updates automatically. It's pretty easy to set up and will safe you a lot of time in the long run. It will also instantly reload changes to your html views.

Simply follow the instructions below, taken from blog.55minutes.com.

Install CSS live reload (only once per project)

  1. Add th...

Common mistakes when storing file uploads with Rails

1. Saving files to a directory that is not shared between deploys or servers

If you save your uploads to a made up directory like "RAILS_ROOT/uploads", this directory goes away after every deploy (since every release gets a new). Also this directory is not shared between multiple application servers, so your uploads are randomly saved to one local filesystem or another. Fixing this afterwards is a lot of fun.

Only two folders are, by default, shared between our application servers and deployments: "RAILS_ROOT/storage" and `"RAILS...

Help me, there is a zombie process!

Here is a good explanation for zombie processes.

Quote:

If you have zombie processes it means those zombies have not been waited for by their parent (look at PPID displayed by ps -l). 
You have three choices: Fix the parent process (make it wait); kill the parent; or live with it.
Remember that living with it is not so hard because zombies take up little more than one extra line in the output of ps.

On a server I want to get informed if there are zombie processes and track them wi...

Clean up application servers when deploying

Our development process makes us deploy very often. As the number of releases grows, junk clogs up the hard drive of our application servers:

  • Old release code
  • Old tmp folders with compiled view templates etc.
  • Precompiled assets (Javascripts, images...) that no longer exist. When using the asset pipeline, Capistrano will symlink the public/assets directory to shared/assets. This is cool since we can still serve previous assets after a new release, in the window where browser caches might still have references to old assets. But i...

How to remap keys in Ubuntu

Good article that tells you how to change behavior of certain keys via xmodmap (with the help of exv if you need to find out the keycode).

Redactor WYSIWYG html editor

New WYSIWYG editor that claims to be lighter and prettier than TinyMCE and CKEditor. Has some Rails integration, too.

Ruby Scripts: Select the Ruby version in the shebang

As Bill Dueber has on his blog, you can call rvm in the shebang to select a Ruby version like this:

 #!/usr/bin/env rvm 1.9 do ruby

Standard arguments to do apply, see $> rvm help do.

How to: Build a "generic observer" widget for the awesome window manager

If you want a widget for awesome that runs a command regularly (every X seconds) and puts the output into your awesome panel, this is for you.

Put the code below into your ~/.config/awesome/rc.lua. It supplies two methods:

  • execute_command will run a command and return its output. Multiple lines will be joined into one line. The code is from the awesome wiki.
  • widget_with_timeout is a method that takes a command to run and a timeout in secon...

Inherit without Single-Table-Inheritance (STI) in ActiveRecord

You have multiple options:

  1. Just don't have a type column. All STI magic will be disabled automatically.
  2. If you have a type column but want to use it for something else (WAT?), you can set self.inheritance_column = :_non_existing_column in the class definition
  3. (Untested) In the parent class, set self.abstract_class = true

This technique is useful to implement form models / presenters, where you want all the goodness of Ac...