Custom Javascript Rails Admin

Question

I want to add the JS from Google Analytics embed API into my rails application and only for Rails Admin (not needed anywhere else).

We have overwritten the Rails Admin Dashboard and now we are struggling with the custom JS.

I found here: https://groups.google.com/forum/#!topic/rails_admin/KgUl3gF5kTg that it needs to be placed in app/assets/javascripts/rails_admin/custom/ui.js.

So I've placed all the .js files and the .js.map files in the directory:

.
└── custom
    ├── active-users.js
    ├── chart.js
    ├── datepicker.js
    ├── moment.js
    ├── platform.js
    ├── platform.js.map
    ├── polymer.js
    ├── polymer.js.map
    ├── promise.js
    ├── ui.js
    └── viewpicker.js

And I've added //= require_tree . in the ui.js file but in rails_admin I still receive:

Uncaught ReferenceError: Polymer is not defined 

This means that the .JS file isn't loaded.

Thanks to this link for finding the above link: Rails Admin: add javascript library to custom action

Edit 1: Using Rails Admin in a Rails 3 env.

Edit 2:

So for testing reasons I removed all the custom JS/HTML etc.

I've set this in the ui.js:

//=require_tree .

I've set this in leecher.js:

$(document).ready(function() { document.MY_SIMPLE_VARIABLE = 2; } );

When I restart the server I go to rails admin, log out, restart the server again, log in. Go to console in chrome and type:

document.MY_SIMPLE_VARIABLE

And I receive the following:

For testing reasons I've added an:

alert("hello world");

But still no trigger.

The location of the ui.js and leecher.js is:

app/assets/javascripts/rails_admin/custom/

And this my current Gemfile:

http://pastie.org/private/zrrzjpbx5jq7enpeknsa

Edit 3: If I put the JS code into the ui.js it shows an alert! So they are problems with the includes (//= require tree .)

Edit 4: All the JS files I'm using: https://gist.github.com/YOUConsulting/243397c31ea28d217367

Simple example that doesn't work: https://gist.github.com/YOUConsulting/571e785d6b6c1ed06d6b

Simple example that does work: https://gist.github.com/YOUConsulting/52de78aa043239aae707

Raeannraeburn

The problem is not with ui.js,its with the file before it...try putting ui.js at the first place by renaming it...i think the extension with .map can be an issue.try removing it. – Lanciform

@Lanciform the ui.js is need for Rails admin I think, so I think renaming is not an option. – Raeannraeburn

Are you using ActiveAdmin for Rails, or your own admin area implementation? – Greenway

@RichPeck I'm using Rails Admin Sir. – Raeannraeburn

Thanks! Let me check it out :) – Greenway

Hi @RichPeck any luck? – Raeannraeburn

Not yet - let me see! – Greenway

Answer 1

I've rewritten my answer to describe the complete solution in case other people need this in the future.

app/assets/javascripts/rails_admin/custom/ui.js works like a manifest file in the Rails asset pipeline, thus it supports these directives.

In order to include all .js files under custom, add

//= require_tree .

at the top of the file. If that does not work right out of the box, running

rake tmp:clear

will solve the problem ;)

Cheers!

Marella

Hi! I've done what you ask of me, please notice edit 2. Where I explain what I've done and the result. Versions: Rails 3.2.18 / Rails Admin 0.4.9 / Ruby 1.9.3p484. – Raeannraeburn

AHAH! If I put the JS code into the ui.js it shows an alert! So they are problems with the includes (//= require tree. – Raeannraeburn

uhmmm then can you edit the question to include the content of ui.js? or a link to it? – Marella

Much appreciated @Marella for this simple but clearly best answer. – Raeannraeburn

Answer 2

After talking more to Cec on this topic. He found that a simple rake tmp:clear, was the correct answer. See answer above or below.

Raeannraeburn