support for subclasses + switch to yaml frontmatter

_layouts/default.html

@@ -89,6 +89,18 @@
       .main .page-header {
         margin-top: 0;
       }
+
+      /*
+       * Property table
+       */
+
+      .table .read-only {
+        color: #888;
+      }
+
+      .table .return strong {
+        color: #9c393c;
+      }
     </style>
 
     <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
@@ -188,7 +200,68 @@
         </div>
         <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
           {% capture package_name %}{{ page.categories | join: '.' }}{% endcapture %}
-          <h1 class="page-header">{% unless package_name == '' %}<small>{{ package_name }}.</small>{% endunless %}{{ page.title }}</h1>
+          <div class="page-header">
+            <h1>{% unless package_name == '' %}<small>{{ package_name }}.</small>{% endunless %}{{ page.title }}</h1>
+            {% if page.parent %}
+              {% capture parentName %}{{ page.parent | split: '.' | last}}{% endcapture %}
+              {% capture parentURL %}{{ page.parent | replace: '.', '/' }}{% endcapture %}
+              <h6>subclass of <a href="{{ site.baseurl}}/{{parentURL }}.html">{{ parentName }}</a></h6>{% endif %}
+          </div>
+          <p>{{ page.description }}</p>
+          {% if page.properties %}
+            <h3>Properties</h3>
+            <table class="table table-striped">
+              <thead>
+                <tr>
+                  <th>Property</th>
+                  <th>Description</th>
+                </tr>
+              </thead>
+              <tbody>
+                {% for prop in page.properties %}
+                   <tr class="{{ prop.access }}">
+                     <td><a href="#{{prop.name}}">{{ prop.name }}</a> : {{ prop.type }}{% if prop.default %} = {{ prop.default }}{% endif %}</td>
+                     <td>{% unless prop.access == 'public' or prop.access == null %}[{{ prop.access }}] {% endunless %}{{ prop.description }}</td>
+                   </tr>
+                {% endfor %}
+              </tbody>
+            </table>
+          {% endif %}
+          {% if page.methods %}
+            <h3>Methods</h3>
+            <table class="table table-striped">
+              <thead>
+                <tr>
+                  <th>Method</th>
+                  <th>Description</th>
+                </tr>
+              </thead>
+              <tbody>
+                {% for method in page.methods %}
+                  <tr class="{{ method.access }}">
+                    <td><a href="#{{method.name}}">{{ method.name }}({% for arg in method.arguments %}{{ arg.name }}:{{ arg.type }}{% if arg.default %} = {{ arg.default }}{% endif %}{% unless forloop.last %}, {% endunless %}{% endfor %})</a> : {% if method.returns %}{{ method.returns }}{% else %}void{% endif %}</td>
+                    <td>{% unless method.access == 'public' or method.access == null %}[{{ method.access }}] {% endunless %}{{ method.description }}</td>
+                  </tr>
+                  {% if method.arguments %}
+                    {% for arg in method.arguments %}
+                      <tr>
+                        <td colspan="2">
+                          <small style="padding-left: 20px"><strong>{{ arg.name }} : {{ arg.type }}</strong><div style="display: inline-block; width: 10px"></div>{{ arg.description }}</small>
+                        </td>
+                      </tr>
+                    {% endfor %}
+                  {% endif %}
+                  {% if method.returns %}
+                    <tr>
+                      <td colspan="2" class="return">
+                        <small style="padding-left: 20px"><strong>returns {{ method.returns }}</strong>{% if method.returnDescription %}<div style="display: inline-block; width: 10px"></div>{{ method.returnDescription }}{% endif %}</small>
+                      </td>
+                    </tr>
+                  {% endif %}                
+                {% endfor %}
+              </tbody>
+            </table>
+          {% endif %}
           {{ content }}
         </div>
       </div>

net/flashpunk/_posts/2014-04-03-Entity.md

@@ -1,6 +1,7 @@
 ---
 title: Entity
 layout: default
+parent: net.flashpunk.Tweener
 ---
 
 Main game Entity class updated by World.

net/flashpunk/graphics/_posts/2014-04-24-Image.md

@@ -1,42 +1,54 @@
 ---
 title: Image
 layout: default
----
+parent: net.flashpunk.Graphic
+description: Performance-optimized non-animated image.
+properties:
+  - name: alpha
+    type: Number
+    description: "Change the opacity of the Image, a value from 0 to 1."
+
+  - name: angle
+    type: Number
+    description: "Rotation of the image, in degrees."
+
+  - name: blend
+    type: String
+    description: "Optional blend mode to use when drawing this image."
 
-Performance-optimized non-animated image.
-
-### Public Properties
-
-<table class="table table-striped">
-  <thead>
-    <tr>
-      <th>Property</th>
-      <th>Description</th>
-    </tr>
-  </thead>
-  <tbody>
-    <tr>
-      <td><a href="#alpha">alpha</a> : Number</td>
-      <td>Change the opacity of the Image, a value from 0 to 1.</td>
-    </tr>
-    <tr>
-      <td><a href="#">angle</a> : Number = 0</td>
-      <td>Rotation of the image, in degrees.</td>
-    </tr>
-    <tr>
-      <td><a href="#">blend</a> : String</td>
-      <td>Optional blend mode to use when drawing this image.</td>
-    </tr>
-    <tr>
-      <td><a href="#">clipRect</a> : Rectangle</td>
-      <td>[read-only] Clipping rectangle for the image.</td>
-    </tr>
-    <tr>
-      <td><a href="#">color</a> : uint</td>
-      <td>The tinted color of the Image.</td>
-    </tr>
-  </tbody>
-</table>
+  - name: clipRect
+    type: Rectangle
+    description: "Clipping rectangle for the image."
+    access: read-only
+
+  - name: color
+    type: uint
+    description: "The tinted color of the Image."
+methods:
+  - name: createRect
+    arguments:
+      - name: width
+        type: uint
+        description: "Width of the rectangle."
+      - name: height
+        type: uint
+        description: "Height of the rectangle."
+      - name: color
+        type: uint
+        default: "0xffffff"
+        description: "Color of the rectangle."
+      - name: alpha
+        type: Number
+        default: 1
+        description: "Opacity of the rectangle."
+    returns: Image
+    returnDescription: A new Image object.
+    description: "Creates a new rectangle Image."
+    access: static
+
+  - name: centerOO
+    description: "Centers the Image's originX/Y to its center."
+---
 
 ### Property Detail
 
@@ -50,4 +62,4 @@ var redSquare:Image = new Image(new BitmapData(50, 50, true, 0xffff0000));
 
 // Make the red square 50% transparent.
 redSquare.alpha = 0.5;
-{% endhighlight %}
+{% endhighlight %}