All posts in Hacking

Hacked By GeNErAL

Hacked By GeNErAL

I18n power tool: stylesheet_flipper for rails’ asset pipeline

Spice up your localization toolbox with stylesheet_flipper: Make you left-to-right (LTR) designed css stylesheets support right-to-left (RTL) locales with a snap (and vice versa).

For the impatient: All this ended up as a gem, that you can find on rubygems and on github.

Background
In my most recent startup, monibuds, we recently saw an opertunity to enter the Israeli market after having built our app for english and danish locales. But maintaining two sets of stylesheets, one for LTR and one for RTL seemed like a mess, so I started looking for better solutions. I wanted, using rails’ asset pipeline (sprockets), to enable right-to-left locales as well as left-to-right, but I only wanted to maintain a single set of stylesheets.

Solution
By building a railtie that registers a sprockets bundle_processor, you can hook into the asset pipeline and process any asset both on-the-fly (development) and during assets:precompile (production). Like this:

module StylesheetFlipper
  class Railtie < Rails::Railtie
    initializer "stylesheet_flipper.initialize_rails", :group => :assets do |app|
      app.assets.register_bundle_processor 'text/css', :stylesheet_flipper do |context, data|
        if context.logical_path.include?('-flipped')
          R2.r2 data
        else
          data
        end
      end
    end
  end
end

Then you only need to serve the stylesheet with the ‘-flipped’ postfix when you want to flip it. To do that takes a few steps:

app/assets/stylesheets/application-flipped.css

/*
 *= require application
*/

app/helpers/application_helper.rb

def stylesheet_flipper
  if [:ar, :he].include? I18n.locale
    "application-flipped"
  else
    "application"
  end
end

app/views/layouts/application.html.erb

<%= stylesheet_link_tag stylesheet_flipper %>

config/environments/development.rb

# for flipped versions to work, we need to bundle
# the stylesheet in dev mode as well
config.assets.debug = false

config/environments/production.rb

config.assets.precompile += %w( application-flipped.css )

Oh, and dont forget to add a direction to you body tag if you don’t have one
app/assets/stylesheets/application.css

body {
  direction: ltr;
}

Et voila. Happy flipping!

Compiling assets during slug compilation on heroku cedar stack with rails 3.1

Trying to deploy a rails 3.1 app to heroku, I got the following error during slug compilation:

path/to/image.png isn’t precompiled

Precompiling assets failed, enabling runtime asset compilation

Turns out it is a rails 3.1.0 bug and upgrading rails to 3.1.1 (3.1.1.rc1 as of the time of this writing) solves the problem.

My first open source contribution

Today, trying to kill the pains of my personal world, I found a bug and decided to submit a patch for the open source project postfixadmin. Below is this memorable, first contribution to the open source community:

Hi,

Couldn’t find anywhere to post this, the svn-repos seems to be down and the bugtraq as well, so here it is in a mail – hope it’s usable!
I had problems connecting to a mysql 5.0.33 on another machine (via TCP) until i did this hack (don’t mind the file date stamps!):
[code lang=”diff”]
— functions.inc.php.orig Wed Mar 21 12:30:33 2007
+++ functions.inc.php Wed Mar 21 12:23:16 2007
@@ -128,8 +128,9 @@ function escape_string ($string)
global $CONF;
if (get_magic_quotes_gpc () == 0)
{
+ $link = db_connect();
if ($CONF[‘database_type’] == “mysql”) $escaped_string = mysql_real_escape_string ($string);
– if ($CONF[‘database_type’] == “mysqli”) $escaped_string = mysqli_real_escape_string ($string);
+ if ($CONF[‘database_type’] == “mysqli”) $escaped_string = mysqli_real_escape_string ($link, $string);
if ($CONF[‘database_type’] == “pgsql”) $escaped_string = pg_escape_string ($string);
}
else
[/code]