0

I have a Ruby on Rails site on Heroku which uses both Fancybox for images and Gmaps4Rails for showing a map with marker. Locally everything works fine, but on Heroku both Fancybox and Gmaps4Rails don't work, here is an example: http://mygroundhops.herokuapp.com/visits/204

Because both different javascript libraries are not working, my guess would be that there is something wrong with the asset pipeline. Any suggestions? Thanks!

JFK
  • 40,963
  • 31
  • 133
  • 306
John
  • 6,404
  • 14
  • 54
  • 106
  • you seems to be using fancyBox v2.1.0 and that version doesn't work with jQuery v1.9.1 check http://stackoverflow.com/q/14344289/1055987 for reference. Upgrade (both js and css files) to v2.1.4 and that will fix the fancybox part .... or downgrade jQuery to v1.8.3 whatever works better for you (just wonder if Gmaps4Rails has the same issue, but I am not a rails expert though) – JFK Apr 29 '13 at 18:13
  • a second look at your js file, it uses some deprecated methods in jQuery v1.9+ (`$.browser` for instance) so if you don't want to patch all your js scripts, your best bet is to downgrade to jQuery v1.8.3 for testing purposes. – JFK Apr 29 '13 at 18:27
  • I downgraded jQuery back to 1.8.3, but no difference: working fine locally, not working on Heroku. I would guess it would also not be working locally if fancybox and jQuery versions were incompatible? – John Apr 29 '13 at 18:41
  • hmm I would bet my 13K reputation that fancybox v2.1.0 (out of the box) doesn't work with jQuery 1.9+ ....neither locally, server or cloud environment. Is mygroundhops.herokuapp.com your demo site? I can still see jQuery v1.9.1 http://mygroundhops.herokuapp.com/assets/application-b82aec9052149ded8e20aaf40e52f7cb.js – JFK Apr 29 '13 at 18:48
  • After emptying the cache and precompiling the assets, the FancyBox issue seems to have gone, but the Maps issue is still there. – John Apr 30 '13 at 07:43

1 Answers1

1

Well, it turned out that using 

//= require_tree .

made a mess of the order of all the javascript files. Probably the gmaps4rails files were loaded before jquery. By explicitly setting the order the issue was solved:

//= require jquery
//= require jquery_ujs
//= require jquery.fancybox
//= require jquery.fancybox.pack
//= require bootstrap
//= require bootstrap-dropdown
//= require gmaps4rails.base
//= require gmaps4rails.googlemaps
John
  • 6,404
  • 14
  • 54
  • 106