Keeping a set of environment variables in rails and javascript

Question

essentially, we want to keep a set of constants to be used across the rails app and javascript code. For example:

{A:3
B:4
C:5}

We try not to embed rails code in javascript, and we do not want 2 copies of constants.

Thanks!

Answer 1

put it in JSON file and parse it in your ruby file and same in your javascript file.

Answer 2

To avoid defining your constants twice, I would use Rails to generate JS that contains your constants. I understand wanting to avoid using Rails in JS, but proper code separation should cover any such worries.

First, define your constants in Ruby, such as in config/environment.rb or in a custom initializer:

CONST_A = 3
CONST_B = 4
CONST_C = 5

Then, create a new controller with a single action, whose sole purpose is to read Ruby values and output them as JavaScript. For example:

class JavascriptsController < ApplicationController
  caches_page :constants

  def constants
    render :template => 'constants.js.erb'
  end
end

Note that the action is page-cached to avoid unnecessary hits to the Rails stack.

Now create the view app/views/javascripts/constants.js.erb, in which you output Ruby values as a JavaScript object:

var constants = {
  a: <%= CONST_A %>,
  b: <%= CONST_B %>,
  c: <%= CONST_C %>
};

Hook up a simple route in config/routes.rb for connecting to JavascriptsController actions:

map.connect '/javascripts/:action.js', :controller => 'javascripts'

Lastly, include this JS in your layout before any other JS:

<%= javascript_include_tag 'constants' %>

That should do it. This line requests /javascripts/constants.js, which then defines the JS object constants. While this JS is generated with Rails, it remains separate from any other JS files in the app, and avoids duplicate definitions of your constants.

As mentioned before, you should cache the JavascriptsController#constants action. Also consider minifying constants.js (i.e., stripping unneeded characters), and concatenating it with other JavaScript files to reduce HTTP requests. I use the AssetHat gem (disclaimer: I wrote it), which has successfully sped up CSS and JS on some high-profile sites.

Answer 3

I've done something similiar.

class Constants
  DUCK = "Quack"
  CAT = "Meow"
  PROGRAMMER = "Tap,tap,tap."

  def self.make_javascript
    output = ""
    self.constants.each do |c|
      output += "var #{c} = \"#{self.send(c)}\";\n"
    end
    return output
  end
end

Then in your layout file, somewhere in the head write:

<script type='text/javascript'>
  <%= Constants.make_javascript %>
</script>

That makes it so adding a constant to the class will automatically add it to the javascript.

As written, my code only deals with string constants. You can put in a check for the type of the constant and adjust the output accordingly.