Improvements to the /__middleman/ metadata pages.

Includes formatting/styling changes to clarify the data being presented as well as align styling with middlemanapp.com. Also adds features and fixes to the sitemap view to show ignored files differently, hide redundant information, print data/options as a hash instead of as array pairs, and to list out available locals defined on a page.

CHANGELOG.md

@@ -4,6 +4,7 @@ master
 * Update Padrino to 0.12.0. Introduces BREAKING CHANGE for Haml. Helpers which take blocks used to require `-` instead of `=` to work correctly. Now, all helpers which output content should use `=`. See: http://www.padrinorb.com/blog/upgrading-padrino-from-0-11-x-to-0-12-0-guide
 * Depend on Erubis and remove support for specifying another ERb engine.
 * Removed the ability to set the `sass_cache_path`.
+* Improved /__middleman/ meta pages. For example, sitemap view now calls out ignored resources, prints data/options better, and shows which special locals are available on a page.
 
 3.2.2
 ===

middleman-core/lib/middleman-core/meta_pages/assets/config.css

@@ -25,6 +25,7 @@
 
 .value {
     color: #002B36;
+    white-space: pre-wrap;
 }
 
 .description {
@@ -33,4 +34,16 @@
 
 .extensions .settings {
     margin-left: 1em;
+}
+
+.inactive {
+    color: #999999;
+}
+
+.inactive:after {
+    content: "Inactive";
+    font-weight: bold;
+    color: #999999;
+    margin-left: 10px;
+    font-size: .7em;
 }

middleman-core/lib/middleman-core/meta_pages/assets/meta.css

@@ -168,6 +168,7 @@ body {
     padding-right: 1em;
     position: relative;
     margin-top: 2em;
+    margin-bottom: 2em;
 }
 .container:after {
     clear: both;
@@ -355,14 +356,29 @@ pre .tex .formula {
 #main {
     display: inline;
     float: left;
-    font-size: 120%;
+    font-size: 100%;
     margin-left: 0;
     margin-right: 1.20482%;
     width: 100%;
 }
 #main h1 {
-    font-size: 2em;
+    font-size: 3em;
+    font-weight: bold;
+    margin-bottom: .5em;
 }
 #main h2 {
-    font-size: 1.5em;
+    font-size: 2em;
+    line-height: 1.2;
+    margin-bottom: 0.75em;
 }
+
+.nav-list {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+}
+
+.nav-list a {
+    font-size: 1.4em;
+    font-weight: bold;
+}

middleman-core/lib/middleman-core/meta_pages/assets/sitemap.css

@@ -9,7 +9,7 @@ details > details {
 }
 
 details.resource > summary {
-    
+
 }
 
 .resource-details {
@@ -27,6 +27,7 @@ summary > i {
 
 .resource-details th, .resource-details td {
     padding: 0;
+    vertical-align: top;
 }
 
 .resource-details th {
@@ -40,6 +41,22 @@ summary > i {
     font-family: "Arvo","andale mono","lucida console",monospace;
 }
 
+.ignored > summary {
+    color: #999999;
+}
+
+.ignored i {
+    opacity: 0.4;
+}
+
+.ignored > summary:after {
+    content: "Ignored";
+    font-weight: bold;
+    color: #999999;
+    margin-left: 10px;
+    font-size: .7em;
+}
+
 details > summary:before {
     content: "" !important;
     display: inline-block;

middleman-core/lib/middleman-core/meta_pages/config_setting.rb

@@ -1,3 +1,5 @@
+require 'pp'
+
 module Middleman
   module MetaPages
     # View class for a config entry
@@ -13,22 +15,18 @@ module Middleman
         content = ''
         key_classes = ['key']
         key_classes << 'modified' if @setting.value_set?
-        content << content_tag(:span, @setting.key.inspect, :class => key_classes.join(' '))
+        content << content_tag(:span, @setting.key.pretty_inspect.strip, :class => key_classes.join(' '))
         content << ' = '
-        content << content_tag(:span, @setting.value.inspect, :class => 'value')
+        content << content_tag(:span, @setting.value.pretty_inspect.strip, :class => 'value')
-        if @setting.default
+        if @setting.default && @setting.value_set? && @setting.default != @setting.value
           content << content_tag(:span, :class => 'default') do
-            if @setting.value_set?
+            "(Default: #{@setting.default.inspect})"
-              "Default: #{@setting.default.inspect}"
-            else
-              '(Default)'
-            end
           end
         end
 
         if @setting.description
           content << content_tag(:p, :class => 'description') do
-            CGI::escapeHTML(@setting.description)
+            @setting.description
           end
         end
 

middleman-core/lib/middleman-core/meta_pages/sitemap_resource.rb

@@ -15,7 +15,9 @@ module Middleman
       end
 
       def render
-        content_tag :div, :class => 'resource-details' do
+        classes = 'resource-details'
+        classes << ' ignored' if @resource.ignored?
+        content_tag :div, :class => classes do
           content_tag :table do
             content = ''
             resource_properties.each do |label, value|
@@ -33,24 +35,34 @@ module Middleman
 
       # A hash of label to value for all the properties we want to display
       def resource_properties
-        props = {
+        props = {}
-          'Path' => @resource.path,
+        props['Path'] = @resource.path
-          'Build Path' => @resource.destination_path,
+
-          'URL' => content_tag(:a, @resource.url, :href => @resource.url),
+        build_path = @resource.destination_path
-          'Source File' => @resource.source_file,
+        build_path = 'Not built' if ignored?
-        }
+        props['Build Path'] = build_path if @resource.path != build_path
+        props['URL'] = content_tag(:a, @resource.url, :href => @resource.url) unless ignored?
+        props['Source File'] = @resource.source_file.sub(/^#{Regexp.escape(ENV['MM_ROOT'] + '/')}/, '')
 
         data = @resource.data
-        props['Data'] = data unless data.empty?
+        props['Data'] = data.inspect unless data.empty?
 
-        options = @resource.metadata[:options]
+        meta = @resource.metadata
-        props['Options'] = options unless options.empty?
+        options = meta[:options]
+        props['Options'] = options.inspect unless options.empty?
+
+        locals = meta[:locals].keys
+        props['Locals'] = locals.join(', ') unless locals.empty?
 
         props
       end
 
+      def ignored?
+        @resource.ignored?
+      end
+
       def css_classes
-        ['resource']
+        ['resource'].concat(ignored? ? ['ignored'] : [])
       end
     end
   end

middleman-core/lib/middleman-core/meta_pages/sitemap_tree.rb

@@ -45,7 +45,11 @@ module Middleman
       end
 
       def css_classes
-        ['tree']
+        ['tree'].concat(ignored? ? ['ignored'] : [])
+      end
+
+      def ignored?
+        @children.values.all?(&:ignored?)
       end
 
       protected

middleman-core/lib/middleman-core/meta_pages/templates/config.html.erb

@@ -13,7 +13,7 @@
     <a href="/__middleman/">&laquo; back</a>
     <h1>Middleman Configuration</h1>
 
-    <p>This page shows the current configuration of your Middleman application.</p>
+    <p>This page shows the current configuration of your Middleman application. <a href="http://middlemanapp.com/advanced/configuration/">Read more about configuring Middleman.</a></p>
 
     <p>
       <a href="#core">Core configuration</a>
@@ -48,7 +48,7 @@
       <% end %>
 
       <% registered_extensions.keys.each do |ext_name| %>
-      <li><span class="extension"><%= ext_name.inspect %></span> (Inactive)</li>
+      <li><span class="extension inactive"><%= ext_name.inspect %></span></li>
       <% end %>
     </ul>
     </article>

middleman-core/lib/middleman-core/meta_pages/templates/index.html.erb

@@ -5,17 +5,27 @@
     <title>Middleman Info</title>
     <link type="text/css" rel="stylesheet" href="/__middleman/assets/meta.css">
   </head>
-  
+
   <body>
     <div class="container">
-      <h1>Middleman Information</h1>
+      <article id="main">
+        <h1>Middleman Information</h1>
 
-      <ul>
+        <ul class="nav-list">
-        <li><a href="/__middleman/sitemap/">Sitemap</a></li>
+          <li>
-        <li><a href="/__middleman/config/">Configuration</a></li>
+            <a href="/__middleman/sitemap/">Sitemap</a>
-        <li><a href="http://middlemanapp.com">Middleman Guides</a></li>
+            <p>The structure of your site as understood by Middleman.</p>
-      </ul>
+          </li>
+          <li>
+            <a href="/__middleman/config/">Configuration</a>
+            <p>All available configuration options and their current values.</p>
+          </li>
+          <li>
+            <a href="http://middlemanapp.com">Middleman Guides</a>
+            <p>Documentation about Middleman's features.</p>
+          </li>
+        </ul>
+      </article>
     </div>
   </body>
 </html>
-    

middleman-core/lib/middleman-core/meta_pages/templates/sitemap.html.erb

@@ -2,17 +2,17 @@
 <html>
   <head>
     <meta charset="utf-8">
-        
+
     <title>Middleman Sitemap</title>
 
-    
+
     <link type="text/css" rel="stylesheet" href="/__middleman/assets/meta.css">
     <link type="text/css" rel="stylesheet" href="/__middleman/assets/sitemap.css">
     <script src="/__middleman/assets/jquery-1.8.2.min.js"></script>
     <script src="/__middleman/assets/jquery.details-1.6.min.js"></script>
     <script src="/__middleman/assets/sitemap.js"></script>
   </head>
-  
+
   <body>
     <div class="container">
       <article id="main">
@@ -20,7 +20,7 @@
         <h1>Middleman Sitemap</h1>
 
         <p>This page shows all of the pages in
-        the <a href="http://middlemanapp.com/advanced/sitemap/">sitemap</a>,
+        <a href="http://middlemanapp.com/advanced/sitemap/">the sitemap</a>,
         Middleman's view of your site.</p>
 
         <%= sitemap_tree.render %>
@@ -28,4 +28,3 @@
     </div>
   </body>
 </html>
-