To combine what the other answers suggested and other sources on the web advised, it seems like the best answer to this situation is to do the following:
Create subdirectories in the assets/javascripts
and assets/stylesheets
directories as well as maps.js
and maps.css
files. In my example above you'd have
app/
assets/
javascripts/
application.js
maps.js
maps/
site/
stylesheets/
application.css
maps.css
maps/
site/
Create any needed page-specific javascripts / stylesheets in those directories.
The maps.js
file would look like:
//= require_tree ./maps
which will include all items in the maps directory / subdirectories.
The application.js
is the same but includes the "main" site resources as well as any site-specific items:
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require bootstrap
//= require_tree ./site
Create a maps layout file called views/layouts/maps.html.erb
, and in the layout file, use the javascript_include_tag
to change which js / css file gets parsed for includes:
views/layouts/maps.html.erb:
<%= stylesheet_link_tag "maps", media: "all", "data-turbolinks-track" => true %>
<%= javascript_include_tag "maps", "data-turbolinks-track" => true %>
views/layouts/application.html.erb:
<%= stylesheet_link_tag "application", media: "all", "data-turbolinks-track" => true %>
<%= javascript_include_tag "application", "data-turbolinks-track" => true %>
Make sure the MapsController
specifies the maps layout!
class MapsController < ApplicationController
layout "maps"