reworked api from md to html

_includes/api-member.html

@@ -1,87 +1,218 @@
 {% if include.data.borrows.size > 0 %}
-## Extends
-{% for item in include.data.borrows %}
-[{{ item }}]({{ site.baseurl }}/api/{{ item | api_url }})
-{% endfor %}
+  <a class="anchor" id="extends"></a>
+  <h2><a class="anchorable" href="#extends">Extends</a></h2>
+  {% for item in include.data.borrows %}
+    <a href="{{ site.baseurl }}/api/{{ item | api_url }}">{{ item }}</a>
+  {% endfor %}
+{% endif %}
+
+{% if include.data.examples.size > 0 %}
+  <h2>Examples</h2>
+
+  {% for example in include.data.examples %}
+    <pre class="prettyprint"><code class="js" data-lang="js">{{example.content | filter_code}}</code></pre>
+  {% endfor %}
+{% endif %}
+
+{% if include.data.settings.size > 0 %}
+  <a class="anchor" id="settings"></a>
+  <h2><a class="anchorable" href="#settings">Settings</a></h2>
+
+  <table class="settings">
+    <thead>
+      <tr>
+        <th>name</th>
+        <th>type</th>
+        <th>summary</th>
+        <th class="defined-by">defined by</th>
+      </tr>
+    </thead>
+    <tbody>
+      {% for item in include.data.settings %}
+        <tr>
+          <td>{{ item.name }}</td>
+          <td>
+            {% if item.dataTypes[0] contains 'tinymce' %}
+              <a href="{{ site.baseurl }}/api/{{ item.dataTypes[0] | api_url }}">{{ item.dataTypes[0] }}</a>
+            {% else %}
+              {{ item.dataTypes[0] }}
+            {% endif %}
+          </td>
+          <td>{{ item.desc | no_nl }}</td>
+          <td class="defined-by">
+            <a href="{{ site.baseurl }}/api/{{ item.definedBy | api_url }}">{{ item.definedBy }}</a>
+          </td>
+        </tr>
+      {% endfor %}
+    </tbody>
+  </table>
 {% endif %}
 
 {% if include.data.properties.size > 0 %}
-## Properties
-name | type | summary | defined by
---- | --- | --- | ---
-{% for item in include.data.properties %}{{ item.name }} | {% if item.dataTypes[0] contains 'tinymce' %}[`{{ item.dataTypes[0] }}`]({{ site.baseurl }}/api/{{ item.dataTypes[0] | api_url }}){% else %}`{{ item.dataTypes[0] }}`{% endif %}| {{ item.desc | no_nl }} | [{{ item.definedBy }}]({{ site.baseurl }}/api/{{ item.definedBy | api_url }})
-{% endfor %}
+  <a class="anchor" id="properties"></a>
+  <h2><a class="anchorable" href="#properties">Properties</a></h2>
+
+  <table class="properties">
+    <thead>
+      <tr>
+        <th>name</th>
+        <th>type</th>
+        <th>summary</th>
+        <th class="defined-by">defined by</th>
+      </tr>
+    </thead>
+    <tbody>
+      {% for item in include.data.properties %}
+        <tr>
+          <td>{{ item.name }}</td>
+          <td>
+            {% if item.dataTypes[0] contains 'tinymce' %}
+              <a href="{{ site.baseurl }}/api/{{ item.dataTypes[0] | api_url }}">{{ item.dataTypes[0] }}</a>
+            {% else %}
+              {{ item.dataTypes[0] }}
+            {% endif %}
+          </td>
+          <td>{{ item.desc | no_nl }}</td>
+          <td class="defined-by">
+            <a href="{{ site.baseurl }}/api/{{ item.definedBy | api_url }}">{{ item.definedBy }}</a>
+          </td>
+        </tr>
+      {% endfor %}
+    </tbody>
+  </table>
 {% endif %}
 
 {% if include.data.methods.size > 0 %}
-## Methods
-name | summary | defined by
---- | --- | ---
-{% for item in include.data.methods %}[{{ item.name }}()](#{{ item.name | anchor }}) | {{ item.desc | no_nl }} | [{{ item.definedBy }}]({{ site.baseurl }}/api/{{ item.definedBy | api_url }})
-{% endfor %}
+  <a class="anchor" id="methods"></a>
+  <h2><a class="anchorable" href="#methods">Methods</a></h2>
+
+  <table class="methods">
+    <thead>
+      <tr>
+        <th>name</th>
+        <th>summary</th>
+        <th class="defined-by">defined by</th>
+      </tr>
+    </thead>
+    <tbody>
+      {% for item in include.data.methods %}
+        <tr>
+          <td><a href="#{{ item.name | anchor }}">{{ item.name }}()</a></td>
+          <td>{{ item.desc | no_nl }}</td>
+          <td class="defined-by">
+            <a href="{{ site.baseurl }}/api/{{ item.definedBy | api_url }}">{{ item.definedBy }}</a>
+          </td>
+        </tr>
+      {% endfor %}
+    </tbody>
+  </table>
 {% endif %}
 
 {% if include.data.events.size > 0 %}
-## Events
-name | summary | defined by
---- | --- | ---
-{% for item in include.data.events %}[{{ item.name }}](#{{ item.name | anchor }}) | {{ item.desc | no_nl }} | [{{ item.definedBy }}]({{ site.baseurl }}/api/{{ item.definedBy | api_url }})
-{% endfor %}
+  <a class="anchor" id="events"></a>
+  <h2><a class="anchorable" href="#events">Events</a></h2>
+
+  <table class="events">
+    <thead>
+      <tr>
+        <th>name</th>
+        <th>summary</th>
+        <th class="defined-by">defined by</th>
+      </tr>
+    </thead>
+    <tbody>
+      {% for item in include.data.events %}
+        <tr>
+          <td><a href="#{{ item.name | anchor }}">{{ item.name }}</a></td>
+          <td>{{ item.desc | no_nl }}</td>
+          <td class="defined-by">
+            <a href="{{ site.baseurl }}/api/{{ item.definedBy | api_url }}">{{ item.definedBy }}</a>
+          </td>
+        </tr>
+      {% endfor %}
+    </tbody>
+  </table>
 {% endif %}
 
 {% if include.data.methods.size > 0 %}
-## Methods
-{% for item in include.data.methods %}
+  <h2>Methods</h2>
 
-### {{ item.name }}()
-```js
-{{ include.data.name }}#{{ item.signature }}
-```
+  {% for item in include.data.methods %}
+    <a class="anchor" id="{{ item.name | anchor }}"></a>
+    <h3><a class="anchorable" href="#{{ item.name | anchor }}">{{ item.name }}</a></h3>
+    <div class="signature">{{ item.signature }}</div>
 
-{{ item.desc | no_nl }}
+    <p>{{ item.desc | no_nl }}</p>
 
-{% if item.examples.size > 0 %}
-##### Examples
+    {% if item.examples.size > 0 %}
+      <h5>Examples</h5>
 
-{% for example in item.examples %}
-```js
-{{example.content}}
-```
-{% endfor %}
-{% endif %}
+      {% for example in item.examples %}
+        <pre class="prettyprint"><code class="js" data-lang="js">{{example.content | filter_code}}</code></pre>
+      {% endfor %}
+    {% endif %}
 
-{% if item.params.size > 0 %}
-##### Parameters
+    {% if item.params.size > 0 %}
+      <h5>Parameters</h5>
 
-{% for param in item.params %}* `{{ param.name }}` ({% if param.types[0] contains 'tinymce' %}[{{ param.types[0] }}]({{ site.baseurl }}/api/{{ param.types[0] | api_url }}){% else %}`{{ param.types[0] }}`{% endif %}) - {{ param.desc | no_nl }}
-{% endfor %}
-{% endif %}
+      <ul>
+        {% for param in item.params %}
+            <li>
+              <span class="param-name">{{ param.name }}</span>
+              {% if param.types[0] contains 'tinymce' %}
+                <a href="{{ site.baseurl }}/api/{{ param.types[0] | api_url }}"><span class="param-type">({{ param.types[0] }})</span></a>
+              {% else %}
+                <span class="param-type">({{ param.types[0] }})</span>
+              {% endif %}
+              - {{ param.desc | no_nl }}
+            </li>
+        {% endfor %}
+      </ul>
+    {% endif %}
 
-{% if item.return.types.size > 0 %}
-##### Return value
+    {% if item.return.types.size > 0 %}
+      <h5>Return value</h5>
 
-{% for type in item.return.types %}* {% if type contains 'tinymce' %}[`{{ type }}`]({{ site.baseurl }}/api/{{ type | api_url }}){% else %}`{{ type }}`{% endif %} - {{ item.return.desc | no_nl }}
-{% endfor %}
-{% endif %}
-
-{% endfor %}
+      <ul>
+        {% for type in item.return.types %}
+            <li>
+              {% if type contains 'tinymce' %}
+                <a href="{{ site.baseurl }}/api/{{ type | api_url }}"><span class="return-type">{{ type }}</span></a>
+              {% else %}
+                <span class="return-type">{{ type }}</span>
+              {% endif %}
+              - {{ item.return.desc | no_nl }}
+            </li>
+        {% endfor %}
+      </ul>
+    {% endif %}
+  {% endfor %}
 {% endif %}
 
 {% if include.data.events.size > 0 %}
-## Events
+  <h2>Events</h2>
 
-{% for item in include.data.events %}
-### {{ item.name }}
-{{ item.desc | no_nl }}
+  {% for item in include.data.events %}
+    <a class="anchor" id="{{ item.name | anchor }}"></a>
+    <h3><a class="anchorable" href="#{{ item.name | anchor }}">{{ item.name }}</a></h3>
+    <p>{{ item.desc | no_nl }}</p>
 
-{% if item.params.size > 0 %}
-##### Parameters
+    {% if item.params.size > 0 %}
+      <h5>Parameters</h5>
 
-name | type | description
---- | --- | ---
-{% for param in item.params %}{{ param.name }} | {% if param.types[0] contains 'tinymce' %}[`{{ param.types[0] }}`]({{ site.baseurl }}/api/{{ param.types[0] | api_url }}){% else %}`{{ param.types[0] }}`{% endif %} | {{ param.desc | no_nl }}
-{% endfor %}
-{% endif %}
-
-{% endfor %}
+      <ul>
+        {% for param in item.params %}
+            <li>
+              <span class="param-name">{{ param.name }}</span>
+              {% if param.types[0] contains 'tinymce' %}
+                <a href="{{ site.baseurl }}/api/{{ param.types[0] | api_url }}"><span class="param-type">({{ param.types[0] }})</span></a>
+              {% else %}
+                <span class="param-type">({{ param.types[0] }})</span>
+              {% endif %}
+              - {{ param.desc | no_nl }}
+            </li>
+        {% endfor %}
+      </ul>
+    {% endif %}
+  {% endfor %}
 {% endif %}

_plugins/filter_code.rb

@@ -0,0 +1,11 @@
+require 'cgi'
+
+module Jekyll
+  module FilterCode
+    def filter_code(input)
+      CGI.escapeHTML(input.gsub(/\t/, "  ")) if !input.nil?
+    end
+  end
+end
+
+Liquid::Template.register_filter(Jekyll::FilterCode)