Skip to content
Browse files

Output routes in :html format

By formatting routes for different media (txt/html) we can apply optimizations based on the format. We can include meta-data in the HTML to allow a rich experience while rendering and viewing the routes. This PR shows route helpers as they are used with the `_path` extension, it also has a javascript toggle on the top to switch to `_url`. This way the developer can see the exact named route helper they can use instead of having to modify a base. 

This is one example of an optimization that could be applied. Eventually we can link out to guides for the different columns to better explain what helper, HTTP Verb, Path, and Controller#action indicate. We could even add a route search box that could allow developers to input a given route and see all of the routes that match it. These are stand alone features and should be delivered separately.
  • Loading branch information...
1 parent d4333ed commit 08d7b186fde6ec1e7779349a6ff00e34b30f294d @schneems schneems committed
View
31 actionpack/lib/action_dispatch/routing/inspector.rb
@@ -67,15 +67,19 @@ def initialize
@engines = Hash.new
end
- def format(all_routes, filter = nil)
+ def format(all_routes, filter = nil, format = :txt)
if filter
all_routes = all_routes.select{ |route| route.defaults[:controller] == filter }
end
routes = collect_routes(all_routes)
- formatted_routes(routes) +
- formatted_routes_for_engines
+ routes = formatted_routes(routes, format) + formatted_routes_for_engines(format)
+ if format == :html
+ routes.join('')
+ else
+ routes
+ end
end
def collect_routes(routes)
@@ -101,19 +105,32 @@ def collect_engine_routes(route)
end
end
- def formatted_routes_for_engines
+ def formatted_routes_for_engines(format)
@engines.map do |name, routes|
- ["\nRoutes for #{name}:"] + formatted_routes(routes)
+ ["\nRoutes for #{name}:"] + formatted_routes(routes, format)
end.flatten
end
- def formatted_routes(routes)
+ def formatted_routes(routes, format)
name_width = routes.map{ |r| r[:name].length }.max
verb_width = routes.map{ |r| r[:verb].length }.max
path_width = routes.map{ |r| r[:path].length }.max
routes.map do |r|
- "#{r[:name].rjust(name_width)} #{r[:verb].ljust(verb_width)} #{r[:path].ljust(path_width)} #{r[:reqs]}"
+ if format == :txt
+ "#{r[:name].rjust(name_width)} " +
+ "#{r[:verb].ljust(verb_width)} " +
+ "#{r[:path].ljust(path_width)} " +
+ "#{r[:reqs]}"
+ elsif format == :html
+ route = r
+ "<tr class='route-row' data-helper='path' #{[:name, :verb, :path, :reqs].each {|key| "data-#{key}='#{route[key]}'"} } >" +
+ "<td class='route-name'>#{route[:name] + "<span class='helper'>_path</span>" if route[:name].present?}</td>" +
+ "<td class='route-verb'>#{route[:verb]}</td>" +
+ "<td class='route-path'>#{route[:path]}</td>" +
+ "<td class='route-reqs'>#{route[:reqs]}</td>" +
+ "</tr>"
+ end
end
end
end
View
2 railties/lib/rails/info_controller.rb
@@ -16,7 +16,7 @@ def properties
def routes
inspector = ActionDispatch::Routing::RoutesInspector.new
- @info = inspector.format(_routes.routes).join("\n")
+ @info = inspector.format(_routes.routes, nil, :html)
end
protected
View
27 railties/lib/rails/templates/rails/info/routes.html.erb
@@ -1,3 +1,7 @@
+<style>
+.route-row td {padding: 0 30px;}
+.routeTable {margin: 0 auto 0;}
+</style>
<h2>
Routes
</h2>
@@ -6,4 +10,25 @@
Routes match in priority from top to bottom
</p>
-<p><pre><%= @info %></pre></p>
+<table id='routeTable' class='routeTable'>
+ <th>Helper<br />
+ <%= link_to "Path", "#", 'data-route-helper' => 'path',
+ title: "Returns a relative path (without the http or domain)" %> /
+ <%= link_to "Url", "#", 'data-route-helper' => 'url',
+ title: "Returns an absolute url (with the http and domain)" %>
+ </th>
+ <th>HTTP Verb</th>
+ <th>Path</th>
+ <th>Controller#Action</th>
+ <%= @info.html_safe %>
+</table>
+
+<script type='text/javascript'>
+ $(document).ready(function (){
+ $("#routeTable [data-route-helper]").on('click', function(){
+ routeHelper = $(this).data("route-helper");
+ $('.route-name span.helper').html("_" + routeHelper);
+ return false;
+ })
+ })
+</script>

0 comments on commit 08d7b18

Please sign in to comment.
Something went wrong with that request. Please try again.