Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

unicode support

  • Loading branch information...
commit 0807aac5f3b64d0a53d98c9e3ad4048871b0f154 1 parent 5edd8cf
@thejefflarson thejefflarson authored
Showing with 47 additions and 48 deletions.
  1. +4 −3 docco.coffee
  2. +42 −44 index.html
  3. +1 −1  resources/docco.css
View
7 docco.coffee
@@ -34,9 +34,9 @@
# up into comment/code sections, highlighting them for the appropriate language,
# and merging them into an HTML template.
generate_documentation = (source, callback) ->
- fs.readFile source, (error, code) ->
+ fs.readFile source, "utf-8", (error, code) ->
throw error if error
- sections = parse source, code.toString()
+ sections = parse source, code
highlight source, sections, ->
generate_html source, sections
callback()
@@ -82,7 +82,7 @@ parse = (source, code) ->
# wherever our markers occur.
highlight = (source, sections, callback) ->
language = get_language source
- pygments = spawn 'pygmentize', ['-l', language.name, '-f', 'html']
+ pygments = spawn 'pygmentize', ['-l', language.name, '-f', 'html', '-O', 'encoding=utf-8']
output = ''
pygments.stderr.addListener 'data', (error) ->
puts error if error
@@ -192,3 +192,4 @@ if sources.length
files = sources.slice(0)
next_file = -> generate_documentation files.shift(), next_file if files.length
next_file()
+
View
86 index.html
@@ -30,10 +30,10 @@
your speed, take a look at <a href="http://github.com/fitzgen">Nick Fitzgerald</a>'s
<a href="http://fitzgen.github.com/pycco/">Pycco</a>.</p> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-2">#</a> </div> <h3>Main Documentation Generation Functions</h3> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-3">#</a> </div> <p>Generate the documentation for a source file by reading it in, splitting it
up into comment/code sections, highlighting them for the appropriate language,
-and merging them into an HTML template.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nv">generate_documentation = </span><span class="p">(</span><span class="nx">source</span><span class="p">,</span> <span class="nx">callback</span><span class="p">)</span> <span class="o">-&gt;</span>
- <span class="nx">fs</span><span class="p">.</span><span class="nx">readFile</span> <span class="nx">source</span><span class="p">,</span> <span class="p">(</span><span class="nx">error</span><span class="p">,</span> <span class="nx">code</span><span class="p">)</span> <span class="o">-&gt;</span>
+and merging them into an HTML template.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">generate_documentation</span> <span class="o">=</span> <span class="p">(</span><span class="nx">source</span><span class="p">,</span> <span class="nx">callback</span><span class="p">)</span> <span class="o">-&gt;</span>
+ <span class="nx">fs</span><span class="p">.</span><span class="nx">readFile</span> <span class="nx">source</span><span class="p">,</span> <span class="s2">&quot;utf-8&quot;</span><span class="p">,</span> <span class="p">(</span><span class="nx">error</span><span class="p">,</span> <span class="nx">code</span><span class="p">)</span> <span class="o">-&gt;</span>
<span class="k">throw</span> <span class="nx">error</span> <span class="k">if</span> <span class="nx">error</span>
- <span class="nv">sections = </span><span class="nx">parse</span> <span class="nx">source</span><span class="p">,</span> <span class="nx">code</span><span class="p">.</span><span class="nx">toString</span><span class="p">()</span>
+ <span class="nx">sections</span> <span class="o">=</span> <span class="nx">parse</span> <span class="nx">source</span><span class="p">,</span> <span class="nx">code</span><span class="c1">#.toString()</span>
<span class="nx">highlight</span> <span class="nx">source</span><span class="p">,</span> <span class="nx">sections</span><span class="p">,</span> <span class="o">-&gt;</span>
<span class="nx">generate_html</span> <span class="nx">source</span><span class="p">,</span> <span class="nx">sections</span>
<span class="nx">callback</span><span class="p">()</span></pre></div> </td> </tr> <tr id="section-4"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-4">#</a> </div> <p>Given a string of source code, parse out each comment and the code that
@@ -46,23 +46,23 @@
code_text: ...
code_html: ...
}
-</code></pre> </td> <td class="code"> <div class="highlight"><pre><span class="nv">parse = </span><span class="p">(</span><span class="nx">source</span><span class="p">,</span> <span class="nx">code</span><span class="p">)</span> <span class="o">-&gt;</span>
- <span class="nv">lines = </span><span class="nx">code</span><span class="p">.</span><span class="nx">split</span> <span class="s1">&#39;\n&#39;</span>
- <span class="nv">sections = </span><span class="p">[]</span>
- <span class="nv">language = </span><span class="nx">get_language</span> <span class="nx">source</span>
- <span class="nv">has_code = docs_text = code_text = </span><span class="s1">&#39;&#39;</span>
+</code></pre> </td> <td class="code"> <div class="highlight"><pre><span class="nx">parse</span> <span class="o">=</span> <span class="p">(</span><span class="nx">source</span><span class="p">,</span> <span class="nx">code</span><span class="p">)</span> <span class="o">-&gt;</span>
+ <span class="nx">lines</span> <span class="o">=</span> <span class="nx">code</span><span class="p">.</span><span class="nx">split</span> <span class="s1">&#39;\n&#39;</span>
+ <span class="nx">sections</span> <span class="o">=</span> <span class="p">[]</span>
+ <span class="nx">language</span> <span class="o">=</span> <span class="nx">get_language</span> <span class="nx">source</span>
+ <span class="nx">has_code</span> <span class="o">=</span> <span class="nx">docs_text</span> <span class="o">=</span> <span class="nx">code_text</span> <span class="o">=</span> <span class="s1">&#39;&#39;</span>
- <span class="nv">save = </span><span class="p">(</span><span class="nx">docs</span><span class="p">,</span> <span class="nx">code</span><span class="p">)</span> <span class="o">-&gt;</span>
- <span class="nx">sections</span><span class="p">.</span><span class="nx">push</span> <span class="nx">docs_text</span><span class="o">:</span> <span class="nx">docs</span><span class="p">,</span> <span class="nx">code_text</span><span class="o">:</span> <span class="nx">code</span>
+ <span class="nx">save</span> <span class="o">=</span> <span class="p">(</span><span class="nx">docs</span><span class="p">,</span> <span class="nx">code</span><span class="p">)</span> <span class="o">-&gt;</span>
+ <span class="nx">sections</span><span class="p">.</span><span class="nx">push</span> <span class="nv">docs_text: </span><span class="nx">docs</span><span class="p">,</span> <span class="nv">code_text: </span><span class="nx">code</span>
<span class="k">for</span> <span class="nx">line</span> <span class="k">in</span> <span class="nx">lines</span>
<span class="k">if</span> <span class="nx">line</span><span class="p">.</span><span class="nx">match</span> <span class="nx">language</span><span class="p">.</span><span class="nx">comment_matcher</span>
<span class="k">if</span> <span class="nx">has_code</span>
<span class="nx">save</span> <span class="nx">docs_text</span><span class="p">,</span> <span class="nx">code_text</span>
- <span class="nv">has_code = docs_text = code_text = </span><span class="s1">&#39;&#39;</span>
+ <span class="nx">has_code</span> <span class="o">=</span> <span class="nx">docs_text</span> <span class="o">=</span> <span class="nx">code_text</span> <span class="o">=</span> <span class="s1">&#39;&#39;</span>
<span class="nx">docs_text</span> <span class="o">+=</span> <span class="nx">line</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="nx">language</span><span class="p">.</span><span class="nx">comment_matcher</span><span class="p">,</span> <span class="s1">&#39;&#39;</span><span class="p">)</span> <span class="o">+</span> <span class="s1">&#39;\n&#39;</span>
<span class="k">else</span>
- <span class="nv">has_code = </span><span class="kc">yes</span>
+ <span class="nx">has_code</span> <span class="o">=</span> <span class="kc">yes</span>
<span class="nx">code_text</span> <span class="o">+=</span> <span class="nx">line</span> <span class="o">+</span> <span class="s1">&#39;\n&#39;</span>
<span class="nx">save</span> <span class="nx">docs_text</span><span class="p">,</span> <span class="nx">code_text</span>
<span class="nx">sections</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-5">#</a> </div> <p>Highlights a single chunk of CoffeeScript code, using <strong>Pygments</strong> over stdio,
@@ -71,50 +71,50 @@
<p>We process the entire file in a single call to Pygments by inserting little
marker comments between each section and then splitting the result string
-wherever our markers occur.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nv">highlight = </span><span class="p">(</span><span class="nx">source</span><span class="p">,</span> <span class="nx">sections</span><span class="p">,</span> <span class="nx">callback</span><span class="p">)</span> <span class="o">-&gt;</span>
- <span class="nv">language = </span><span class="nx">get_language</span> <span class="nx">source</span>
- <span class="nv">pygments = </span><span class="nx">spawn</span> <span class="s1">&#39;pygmentize&#39;</span><span class="p">,</span> <span class="p">[</span><span class="s1">&#39;-l&#39;</span><span class="p">,</span> <span class="nx">language</span><span class="p">.</span><span class="nx">name</span><span class="p">,</span> <span class="s1">&#39;-f&#39;</span><span class="p">,</span> <span class="s1">&#39;html&#39;</span><span class="p">]</span>
- <span class="nv">output = </span><span class="s1">&#39;&#39;</span>
+wherever our markers occur.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">highlight</span> <span class="o">=</span> <span class="p">(</span><span class="nx">source</span><span class="p">,</span> <span class="nx">sections</span><span class="p">,</span> <span class="nx">callback</span><span class="p">)</span> <span class="o">-&gt;</span>
+ <span class="nx">language</span> <span class="o">=</span> <span class="nx">get_language</span> <span class="nx">source</span>
+ <span class="nx">pygments</span> <span class="o">=</span> <span class="nx">spawn</span> <span class="s1">&#39;pygmentize&#39;</span><span class="p">,</span> <span class="p">[</span><span class="s1">&#39;-l&#39;</span><span class="p">,</span> <span class="nx">language</span><span class="p">.</span><span class="nx">name</span><span class="p">,</span> <span class="s1">&#39;-f&#39;</span><span class="p">,</span> <span class="s1">&#39;html&#39;</span><span class="p">,</span> <span class="s1">&#39;-O&#39;</span><span class="p">,</span> <span class="s1">&#39;encoding=utf-8&#39;</span><span class="p">]</span>
+ <span class="nx">output</span> <span class="o">=</span> <span class="s1">&#39;&#39;</span>
<span class="nx">pygments</span><span class="p">.</span><span class="nx">stderr</span><span class="p">.</span><span class="nx">addListener</span> <span class="s1">&#39;data&#39;</span><span class="p">,</span> <span class="p">(</span><span class="nx">error</span><span class="p">)</span> <span class="o">-&gt;</span>
<span class="nx">puts</span> <span class="nx">error</span> <span class="k">if</span> <span class="nx">error</span>
<span class="nx">pygments</span><span class="p">.</span><span class="nx">stdout</span><span class="p">.</span><span class="nx">addListener</span> <span class="s1">&#39;data&#39;</span><span class="p">,</span> <span class="p">(</span><span class="nx">result</span><span class="p">)</span> <span class="o">-&gt;</span>
<span class="nx">output</span> <span class="o">+=</span> <span class="nx">result</span> <span class="k">if</span> <span class="nx">result</span>
<span class="nx">pygments</span><span class="p">.</span><span class="nx">addListener</span> <span class="s1">&#39;exit&#39;</span><span class="p">,</span> <span class="o">-&gt;</span>
- <span class="nv">output = </span><span class="nx">output</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="nx">highlight_start</span><span class="p">,</span> <span class="s1">&#39;&#39;</span><span class="p">).</span><span class="nx">replace</span><span class="p">(</span><span class="nx">highlight_end</span><span class="p">,</span> <span class="s1">&#39;&#39;</span><span class="p">)</span>
- <span class="nv">fragments = </span><span class="nx">output</span><span class="p">.</span><span class="nx">split</span> <span class="nx">language</span><span class="p">.</span><span class="nx">divider_html</span>
+ <span class="nx">output</span> <span class="o">=</span> <span class="nx">output</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="nx">highlight_start</span><span class="p">,</span> <span class="s1">&#39;&#39;</span><span class="p">).</span><span class="nx">replace</span><span class="p">(</span><span class="nx">highlight_end</span><span class="p">,</span> <span class="s1">&#39;&#39;</span><span class="p">)</span>
+ <span class="nx">fragments</span> <span class="o">=</span> <span class="nx">output</span><span class="p">.</span><span class="nx">split</span> <span class="nx">language</span><span class="p">.</span><span class="nx">divider_html</span>
<span class="k">for</span> <span class="nx">section</span><span class="p">,</span> <span class="nx">i</span> <span class="k">in</span> <span class="nx">sections</span>
- <span class="nv">section.code_html = </span><span class="nx">highlight_start</span> <span class="o">+</span> <span class="nx">fragments</span><span class="p">[</span><span class="nx">i</span><span class="p">]</span> <span class="o">+</span> <span class="nx">highlight_end</span>
- <span class="nv">section.docs_html = </span><span class="nx">showdown</span><span class="p">.</span><span class="nx">makeHtml</span> <span class="nx">section</span><span class="p">.</span><span class="nx">docs_text</span>
+ <span class="nx">section</span><span class="p">.</span><span class="nx">code_html</span> <span class="o">=</span> <span class="nx">highlight_start</span> <span class="o">+</span> <span class="nx">fragments</span><span class="p">[</span><span class="nx">i</span><span class="p">]</span> <span class="o">+</span> <span class="nx">highlight_end</span>
+ <span class="nx">section</span><span class="p">.</span><span class="nx">docs_html</span> <span class="o">=</span> <span class="nx">showdown</span><span class="p">.</span><span class="nx">makeHtml</span> <span class="nx">section</span><span class="p">.</span><span class="nx">docs_text</span>
<span class="nx">callback</span><span class="p">()</span>
<span class="nx">pygments</span><span class="p">.</span><span class="nx">stdin</span><span class="p">.</span><span class="nx">write</span><span class="p">((</span><span class="nx">section</span><span class="p">.</span><span class="nx">code_text</span> <span class="k">for</span> <span class="nx">section</span> <span class="k">in</span> <span class="nx">sections</span><span class="p">).</span><span class="nx">join</span><span class="p">(</span><span class="nx">language</span><span class="p">.</span><span class="nx">divider_text</span><span class="p">))</span>
<span class="nx">pygments</span><span class="p">.</span><span class="nx">stdin</span><span class="p">.</span><span class="nx">end</span><span class="p">()</span></pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-6">#</a> </div> <p>Once all of the code is finished highlighting, we can generate the HTML file
and write out the documentation. Pass the completed sections into the template
-found in <code>resources/docco.jst</code></p> </td> <td class="code"> <div class="highlight"><pre><span class="nv">generate_html = </span><span class="p">(</span><span class="nx">source</span><span class="p">,</span> <span class="nx">sections</span><span class="p">)</span> <span class="o">-&gt;</span>
- <span class="nv">title = </span><span class="nx">path</span><span class="p">.</span><span class="nx">basename</span> <span class="nx">source</span>
- <span class="nv">dest = </span><span class="nx">destination</span> <span class="nx">source</span>
- <span class="nv">html = </span><span class="nx">docco_template</span> <span class="p">{</span>
- <span class="nx">title</span><span class="o">:</span> <span class="nx">title</span><span class="p">,</span> <span class="nx">sections</span><span class="o">:</span> <span class="nx">sections</span><span class="p">,</span> <span class="nx">sources</span><span class="o">:</span> <span class="nx">sources</span><span class="p">,</span> <span class="nx">path</span><span class="o">:</span> <span class="nx">path</span><span class="p">,</span> <span class="nx">destination</span><span class="o">:</span> <span class="nx">destination</span>
+found in <code>resources/docco.jst</code></p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">generate_html</span> <span class="o">=</span> <span class="p">(</span><span class="nx">source</span><span class="p">,</span> <span class="nx">sections</span><span class="p">)</span> <span class="o">-&gt;</span>
+ <span class="nx">title</span> <span class="o">=</span> <span class="nx">path</span><span class="p">.</span><span class="nx">basename</span> <span class="nx">source</span>
+ <span class="nx">dest</span> <span class="o">=</span> <span class="nx">destination</span> <span class="nx">source</span>
+ <span class="nx">html</span> <span class="o">=</span> <span class="nx">docco_template</span> <span class="p">{</span>
+ <span class="nv">title: </span><span class="nx">title</span><span class="p">,</span> <span class="nv">sections: </span><span class="nx">sections</span><span class="p">,</span> <span class="nv">sources: </span><span class="nx">sources</span><span class="p">,</span> <span class="nv">path: </span><span class="nx">path</span><span class="p">,</span> <span class="nv">destination: </span><span class="nx">destination</span>
<span class="p">}</span>
<span class="nx">puts</span> <span class="s2">&quot;docco: $source -&gt; $dest&quot;</span>
<span class="nx">fs</span><span class="p">.</span><span class="nx">writeFile</span> <span class="nx">dest</span><span class="p">,</span> <span class="nx">html</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-7">#</a> </div> <h3>Helpers &amp; Setup</h3> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id="section-8"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-8">#</a> </div> <p>Require our external dependencies, including <strong>Showdown.js</strong>
-(the JavaScript implementation of Markdown).</p> </td> <td class="code"> <div class="highlight"><pre><span class="nv">fs = </span><span class="nx">require</span> <span class="s1">&#39;fs&#39;</span>
-<span class="nv">path = </span><span class="nx">require</span> <span class="s1">&#39;path&#39;</span>
-<span class="nv">showdown = </span><span class="nx">require</span><span class="p">(</span><span class="s1">&#39;./vendor/showdown&#39;</span><span class="p">).</span><span class="nx">Showdown</span>
+(the JavaScript implementation of Markdown).</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">fs</span> <span class="o">=</span> <span class="nx">require</span> <span class="s1">&#39;fs&#39;</span>
+<span class="nx">path</span> <span class="o">=</span> <span class="nx">require</span> <span class="s1">&#39;path&#39;</span>
+<span class="nx">showdown</span> <span class="o">=</span> <span class="nx">require</span><span class="p">(</span><span class="s1">&#39;./vendor/showdown&#39;</span><span class="p">).</span><span class="nx">Showdown</span>
<span class="p">{</span><span class="nx">spawn</span><span class="p">,</span> <span class="nx">exec</span><span class="p">}</span> <span class="o">=</span> <span class="nx">require</span> <span class="s1">&#39;child_process&#39;</span></pre></div> </td> </tr> <tr id="section-9"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-9">#</a> </div> <p>A list of the languages that Docco supports, mapping the file extension to
the name of the Pygments lexer and the symbol that indicates a comment. To
-add another language to Docco's repertoire, add it here.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nv">languages =</span>
+add another language to Docco's repertoire, add it here.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">languages</span> <span class="o">=</span>
<span class="s1">&#39;.coffee&#39;</span><span class="o">:</span>
- <span class="nx">name</span><span class="o">:</span> <span class="s1">&#39;coffee-script&#39;</span><span class="p">,</span> <span class="nx">symbol</span><span class="o">:</span> <span class="s1">&#39;#&#39;</span>
+ <span class="nv">name: </span><span class="s1">&#39;coffee-script&#39;</span><span class="p">,</span> <span class="nv">symbol: </span><span class="s1">&#39;#&#39;</span>
<span class="s1">&#39;.js&#39;</span><span class="o">:</span>
- <span class="nx">name</span><span class="o">:</span> <span class="s1">&#39;javascript&#39;</span><span class="p">,</span> <span class="nx">symbol</span><span class="o">:</span> <span class="s1">&#39;//&#39;</span>
+ <span class="nv">name: </span><span class="s1">&#39;javascript&#39;</span><span class="p">,</span> <span class="nv">symbol: </span><span class="s1">&#39;//&#39;</span>
<span class="s1">&#39;.rb&#39;</span><span class="o">:</span>
- <span class="nx">name</span><span class="o">:</span> <span class="s1">&#39;ruby&#39;</span><span class="p">,</span> <span class="nx">symbol</span><span class="o">:</span> <span class="s1">&#39;#&#39;</span></pre></div> </td> </tr> <tr id="section-10"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-10">#</a> </div> <p>Build out the appropriate matchers and delimiters for each language.</p> </td> <td class="code"> <div class="highlight"><pre><span class="k">for</span> <span class="nx">ext</span><span class="p">,</span> <span class="nx">l</span> <span class="k">of</span> <span class="nx">languages</span></pre></div> </td> </tr> <tr id="section-11"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-11">#</a> </div> <p>Does the line begin with a comment?</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nv">l.comment_matcher = </span><span class="k">new</span> <span class="nb">RegExp</span><span class="p">(</span><span class="s1">&#39;^\\s*&#39;</span> <span class="o">+</span> <span class="nx">l</span><span class="p">.</span><span class="nx">symbol</span> <span class="o">+</span> <span class="s1">&#39;\\s?&#39;</span><span class="p">)</span></pre></div> </td> </tr> <tr id="section-12"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-12">#</a> </div> <p>The dividing token we feed into Pygments, to delimit the boundaries between
-sections.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nv">l.divider_text = </span><span class="s1">&#39;\n&#39;</span> <span class="o">+</span> <span class="nx">l</span><span class="p">.</span><span class="nx">symbol</span> <span class="o">+</span> <span class="s1">&#39;DIVIDER\n&#39;</span></pre></div> </td> </tr> <tr id="section-13"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-13">#</a> </div> <p>The mirror of <code>divider_text</code> that we expect Pygments to return. We can split
-on this to recover the original sections.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nv">l.divider_html = </span><span class="k">new</span> <span class="nb">RegExp</span><span class="p">(</span><span class="s1">&#39;\\n*&lt;span class=&quot;c1&quot;&gt;&#39;</span> <span class="o">+</span> <span class="nx">l</span><span class="p">.</span><span class="nx">symbol</span> <span class="o">+</span> <span class="s1">&#39;DIVIDER&lt;\\/span&gt;\\n*&#39;</span><span class="p">)</span></pre></div> </td> </tr> <tr id="section-14"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-14">#</a> </div> <p>Get the current language we're documenting, based on the extension.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nv">get_language = </span><span class="p">(</span><span class="nx">source</span><span class="p">)</span> <span class="o">-&gt;</span> <span class="nx">languages</span><span class="p">[</span><span class="nx">path</span><span class="p">.</span><span class="nx">extname</span><span class="p">(</span><span class="nx">source</span><span class="p">)]</span></pre></div> </td> </tr> <tr id="section-15"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-15">#</a> </div> <p>Compute the destination HTML path for an input source file path. If the source
-is <code>lib/example.coffee</code>, the HTML will be at <code>docs/example.html</code></p> </td> <td class="code"> <div class="highlight"><pre><span class="nv">destination = </span><span class="p">(</span><span class="nx">filepath</span><span class="p">)</span> <span class="o">-&gt;</span>
- <span class="s1">&#39;docs/&#39;</span> <span class="o">+</span> <span class="nx">path</span><span class="p">.</span><span class="nx">basename</span><span class="p">(</span><span class="nx">filepath</span><span class="p">,</span> <span class="nx">path</span><span class="p">.</span><span class="nx">extname</span><span class="p">(</span><span class="nx">filepath</span><span class="p">))</span> <span class="o">+</span> <span class="s1">&#39;.html&#39;</span></pre></div> </td> </tr> <tr id="section-16"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-16">#</a> </div> <p>Ensure that the destination directory exists.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nv">ensure_directory = </span><span class="p">(</span><span class="nx">callback</span><span class="p">)</span> <span class="o">-&gt;</span>
+ <span class="nv">name: </span><span class="s1">&#39;ruby&#39;</span><span class="p">,</span> <span class="nv">symbol: </span><span class="s1">&#39;#&#39;</span></pre></div> </td> </tr> <tr id="section-10"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-10">#</a> </div> <p>Build out the appropriate matchers and delimiters for each language.</p> </td> <td class="code"> <div class="highlight"><pre><span class="k">for</span> <span class="nx">ext</span><span class="p">,</span> <span class="nx">l</span> <span class="k">of</span> <span class="nx">languages</span></pre></div> </td> </tr> <tr id="section-11"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-11">#</a> </div> <p>Does the line begin with a comment?</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">l</span><span class="p">.</span><span class="nx">comment_matcher</span> <span class="o">=</span> <span class="k">new</span> <span class="nb">RegExp</span><span class="p">(</span><span class="s1">&#39;^\\s*&#39;</span> <span class="o">+</span> <span class="nx">l</span><span class="p">.</span><span class="nx">symbol</span> <span class="o">+</span> <span class="s1">&#39;\\s?&#39;</span><span class="p">)</span></pre></div> </td> </tr> <tr id="section-12"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-12">#</a> </div> <p>The dividing token we feed into Pygments, to delimit the boundaries between
+sections.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">l</span><span class="p">.</span><span class="nx">divider_text</span> <span class="o">=</span> <span class="s1">&#39;\n&#39;</span> <span class="o">+</span> <span class="nx">l</span><span class="p">.</span><span class="nx">symbol</span> <span class="o">+</span> <span class="s1">&#39;DIVIDER\n&#39;</span></pre></div> </td> </tr> <tr id="section-13"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-13">#</a> </div> <p>The mirror of <code>divider_text</code> that we expect Pygments to return. We can split
+on this to recover the original sections.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">l</span><span class="p">.</span><span class="nx">divider_html</span> <span class="o">=</span> <span class="k">new</span> <span class="nb">RegExp</span><span class="p">(</span><span class="s1">&#39;\\n*&lt;span class=&quot;c1&quot;&gt;&#39;</span> <span class="o">+</span> <span class="nx">l</span><span class="p">.</span><span class="nx">symbol</span> <span class="o">+</span> <span class="s1">&#39;DIVIDER&lt;\\/span&gt;\\n*&#39;</span><span class="p">)</span></pre></div> </td> </tr> <tr id="section-14"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-14">#</a> </div> <p>Get the current language we're documenting, based on the extension.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">get_language</span> <span class="o">=</span> <span class="p">(</span><span class="nx">source</span><span class="p">)</span> <span class="o">-&gt;</span> <span class="nx">languages</span><span class="p">[</span><span class="nx">path</span><span class="p">.</span><span class="nx">extname</span><span class="p">(</span><span class="nx">source</span><span class="p">)]</span></pre></div> </td> </tr> <tr id="section-15"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-15">#</a> </div> <p>Compute the destination HTML path for an input source file path. If the source
+is <code>lib/example.coffee</code>, the HTML will be at <code>docs/example.html</code></p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">destination</span> <span class="o">=</span> <span class="p">(</span><span class="nx">filepath</span><span class="p">)</span> <span class="o">-&gt;</span>
+ <span class="s1">&#39;docs/&#39;</span> <span class="o">+</span> <span class="nx">path</span><span class="p">.</span><span class="nx">basename</span><span class="p">(</span><span class="nx">filepath</span><span class="p">,</span> <span class="nx">path</span><span class="p">.</span><span class="nx">extname</span><span class="p">(</span><span class="nx">filepath</span><span class="p">))</span> <span class="o">+</span> <span class="s1">&#39;.html&#39;</span></pre></div> </td> </tr> <tr id="section-16"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-16">#</a> </div> <p>Ensure that the destination directory exists.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">ensure_directory</span> <span class="o">=</span> <span class="p">(</span><span class="nx">callback</span><span class="p">)</span> <span class="o">-&gt;</span>
<span class="nx">exec</span> <span class="s1">&#39;mkdir -p docs&#39;</span><span class="p">,</span> <span class="o">-&gt;</span> <span class="nx">callback</span><span class="p">()</span></pre></div> </td> </tr> <tr id="section-17"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-17">#</a> </div> <p>Micro-templating, originally by John Resig, borrowed by way of
-<a href="http://documentcloud.github.com/underscore/">Underscore.js</a>.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nv">template = </span><span class="p">(</span><span class="nx">str</span><span class="p">)</span> <span class="o">-&gt;</span>
+<a href="http://documentcloud.github.com/underscore/">Underscore.js</a>.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">template</span> <span class="o">=</span> <span class="p">(</span><span class="nx">str</span><span class="p">)</span> <span class="o">-&gt;</span>
<span class="k">new</span> <span class="nb">Function</span> <span class="s1">&#39;obj&#39;</span><span class="p">,</span>
<span class="s1">&#39;var p=[],print=function(){p.push.apply(p,arguments);};&#39;</span> <span class="o">+</span>
<span class="s1">&#39;with(obj){p.push(\&#39;&#39;</span> <span class="o">+</span>
@@ -125,13 +125,11 @@
<span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="sr">/&lt;%=(.+?)%&gt;/g</span><span class="p">,</span> <span class="s2">&quot;&#39;,$1,&#39;&quot;</span><span class="p">)</span>
<span class="p">.</span><span class="nx">split</span><span class="p">(</span><span class="s1">&#39;&lt;%&#39;</span><span class="p">).</span><span class="nx">join</span><span class="p">(</span><span class="s2">&quot;&#39;);&quot;</span><span class="p">)</span>
<span class="p">.</span><span class="nx">split</span><span class="p">(</span><span class="s1">&#39;%&gt;&#39;</span><span class="p">).</span><span class="nx">join</span><span class="p">(</span><span class="s2">&quot;p.push(&#39;&quot;</span><span class="p">)</span> <span class="o">+</span>
- <span class="s2">&quot;&#39;);}return p.join(&#39;&#39;);&quot;</span></pre></div> </td> </tr> <tr id="section-18"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-18">#</a> </div> <p>Create the template that we will use to generate the Docco HTML page.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nv">docco_template = </span><span class="nx">template</span> <span class="nx">fs</span><span class="p">.</span><span class="nx">readFileSync</span><span class="p">(</span><span class="nx">__dirname</span> <span class="o">+</span> <span class="s1">&#39;/resources/docco.jst&#39;</span><span class="p">).</span><span class="nx">toString</span><span class="p">()</span></pre></div> </td> </tr> <tr id="section-19"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-19">#</a> </div> <p>The CSS styles we'd like to apply to the documentation.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nv">docco_styles = </span><span class="nx">fs</span><span class="p">.</span><span class="nx">readFileSync</span><span class="p">(</span><span class="nx">__dirname</span> <span class="o">+</span> <span class="s1">&#39;/resources/resources/docco.css&#39;</span><span class="p">).</span><span class="nx">toString</span><span class="p">()</span></pre></div> </td> </tr> <tr id="section-20"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-20">#</a> </div> <p>The start of each Pygments highlight block.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nv">highlight_start = </span><span class="s1">&#39;&lt;div class=&quot;highlight&quot;&gt;&lt;pre&gt;&#39;</span></pre></div> </td> </tr> <tr id="section-21"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-21">#</a> </div> <p>The end of each Pygments highlight block.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nv">highlight_end = </span><span class="s1">&#39;&lt;/pre&gt;&lt;/div&gt;&#39;</span></pre></div> </td> </tr> <tr id="section-22"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-22">#</a> </div> <p>Run the script.
-For each source file passed in as an argument, generate the documentation.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nv">sources = </span><span class="nx">process</span><span class="p">.</span><span class="nx">ARGV</span><span class="p">.</span><span class="nx">sort</span><span class="p">()</span>
+ <span class="s2">&quot;&#39;);}return p.join(&#39;&#39;);&quot;</span></pre></div> </td> </tr> <tr id="section-18"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-18">#</a> </div> <p>Create the template that we will use to generate the Docco HTML page.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">docco_template</span> <span class="o">=</span> <span class="nx">template</span> <span class="nx">fs</span><span class="p">.</span><span class="nx">readFileSync</span><span class="p">(</span><span class="nx">__dirname</span> <span class="o">+</span> <span class="s1">&#39;/resources/docco.jst&#39;</span><span class="p">).</span><span class="nx">toString</span><span class="p">()</span></pre></div> </td> </tr> <tr id="section-19"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-19">#</a> </div> <p>The CSS styles we'd like to apply to the documentation.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">docco_styles</span> <span class="o">=</span> <span class="nx">fs</span><span class="p">.</span><span class="nx">readFileSync</span><span class="p">(</span><span class="nx">__dirname</span> <span class="o">+</span> <span class="s1">&#39;/resources/resources/docco.css&#39;</span><span class="p">).</span><span class="nx">toString</span><span class="p">()</span></pre></div> </td> </tr> <tr id="section-20"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-20">#</a> </div> <p>The start of each Pygments highlight block.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">highlight_start</span> <span class="o">=</span> <span class="s1">&#39;&lt;div class=&quot;highlight&quot;&gt;&lt;pre&gt;&#39;</span></pre></div> </td> </tr> <tr id="section-21"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-21">#</a> </div> <p>The end of each Pygments highlight block.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">highlight_end</span> <span class="o">=</span> <span class="s1">&#39;&lt;/pre&gt;&lt;/div&gt;&#39;</span></pre></div> </td> </tr> <tr id="section-22"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-22">#</a> </div> <p>Run the script.
+For each source file passed in as an argument, generate the documentation.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">sources</span> <span class="o">=</span> <span class="nx">process</span><span class="p">.</span><span class="nx">ARGV</span><span class="p">.</span><span class="nx">sort</span><span class="p">()</span>
<span class="k">if</span> <span class="nx">sources</span><span class="p">.</span><span class="nx">length</span>
<span class="nx">ensure_directory</span> <span class="o">-&gt;</span>
<span class="nx">fs</span><span class="p">.</span><span class="nx">writeFile</span> <span class="s1">&#39;docs/resources/docco.css&#39;</span><span class="p">,</span> <span class="nx">docco_styles</span>
- <span class="nv">files = </span><span class="nx">sources</span><span class="p">.</span><span class="nx">slice</span><span class="p">(</span><span class="mi">0</span><span class="p">)</span>
- <span class="nv">next_file = </span><span class="o">-&gt;</span> <span class="nx">generate_documentation</span> <span class="nx">files</span><span class="p">.</span><span class="nx">shift</span><span class="p">(),</span> <span class="nx">next_file</span> <span class="k">if</span> <span class="nx">files</span><span class="p">.</span><span class="nx">length</span>
- <span class="nx">next_file</span><span class="p">()</span>
-
-</pre></div> </td> </tr> </tbody> </table> </div> </body> </html>
+ <span class="nx">files</span> <span class="o">=</span> <span class="nx">sources</span><span class="p">.</span><span class="nx">slice</span><span class="p">(</span><span class="mi">0</span><span class="p">)</span>
+ <span class="nx">next_file</span> <span class="o">=</span> <span class="o">-&gt;</span> <span class="nx">generate_documentation</span> <span class="nx">files</span><span class="p">.</span><span class="nx">shift</span><span class="p">(),</span> <span class="nx">next_file</span> <span class="k">if</span> <span class="nx">files</span><span class="p">.</span><span class="nx">length</span>
+ <span class="nx">next_file</span><span class="p">()</span></pre></div> </td> </tr> <tr id="section-23"> <td class="docs"> <div class="octowrap"> <a class="octothorpe" href="#section-23">#</a> </div> <p>☃</p> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> </tbody> </table> </div> </body> </html>
View
2  resources/docco.css
@@ -26,7 +26,7 @@ h1, h2, h3, h4, h5, h6 {
}
#background {
position: fixed;
- top: 0; left: 580px; right: 0; bottom: 0;
+ top: 0; left: 575px; right: 0; bottom: 0;
background: #f5f5ff;
border-left: 1px solid #e5e5ee;
z-index: -1;
Please sign in to comment.
Something went wrong with that request. Please try again.