Skip to content

Instantly share code, notes, and snippets.

@mnstrspeed
Last active August 29, 2015 14:14
Show Gist options
  • Save mnstrspeed/e4cdf2d70242d345d034 to your computer and use it in GitHub Desktop.
Save mnstrspeed/e4cdf2d70242d345d034 to your computer and use it in GitHub Desktop.
Fancy inline comments
<html>
<head>
<style type="text/css">
ol {
color: #eee;
font-family: monospace;
}
pre {
margin: 0;
}
ol .code {
color: #000;
}
ol .comment {
position: relative;
left: -0.5em;
padding: 0.5em;
margin: 1em 0;
background-color: rgb(0, 148, 255);
color: #fff;
font-family: sans-serif;
}
ol .comment:before {
content: '';
position: absolute;
width: 0;
height: 0;
left: 0.5em;
top: -1em;
border: 0.5em solid;
border-color: transparent transparent rgb(0, 148, 255) transparent;
}
</style>
</head>
<body>
<ol></li><li><pre><code class="code">#!/bin/python</code></pre></li><li><pre><code class="code">import sys</code></pre></li><li><pre><code class="code">from os.path import join, dirname, basename</code></pre></li><li><pre><code class="code"></code></pre></li><li><pre><code class="code">COMMENT_TAG = &quot;#&gt;&quot;</code></pre></li><li><pre><code class="code"></code></pre></li><li><pre><code class="code">def output_path(path):</code></pre></li><li><pre><code class="code"> return join(dirname(path), &apos;Commentaar bij &apos; + basename(path) + &apos;.html&apos;)</code></pre><p class="comment">Wow. How hard can it be to create a proper file path
</p></li><li><pre><code class="code">def has_comment(line):</code></pre></li><li><pre><code class="code"> return line.lstrip().startswith(COMMENT_TAG)</code></pre></li><li><pre><code class="code">def get_comment(line):</code></pre></li><li><pre><code class="code"> return line.lstrip()[len(COMMENT_TAG)+1:]</code></pre><p class="comment">Functions for one-liners. Go kill yourself.
</p></li><li><pre><code class="code"></code></pre></li><li><pre><code class="code">html_escape_table = {</code></pre></li><li><pre><code class="code"> &quot;&amp;&quot;: &quot;&amp;amp;&quot;,</code></pre></li><li><pre><code class="code"> &apos;&quot;&apos;: &quot;&amp;quot;&quot;,</code></pre></li><li><pre><code class="code"> &quot;&apos;&quot;: &quot;&amp;apos;&quot;,</code></pre></li><li><pre><code class="code"> &quot;&gt;&quot;: &quot;&amp;gt;&quot;,</code></pre></li><li><pre><code class="code"> &quot;&lt;&quot;: &quot;&amp;lt;&quot;,</code></pre></li><li><pre><code class="code">}</code></pre></li><li><pre><code class="code"></code></pre></li><li><pre><code class="code">def html_escape(text):</code></pre></li><li><pre><code class="code"> return &quot;&quot;.join(html_escape_table.get(c,c) for c in text)</code></pre></li><li><pre><code class="code"></code></pre></li><li><pre><code class="code">for path in sys.argv[1:]:</code></pre><p class="comment">Call with ./inline.py *.py and it'll give you .html files
</p></li><li><pre><code class="code"> with open(path) as input, open(output_path(path), &apos;w&apos;) as output:</code></pre></li><li><pre><code class="code"> output.write(&quot;&quot;&quot;</code></pre></li><li><pre><code class="code">&lt;html&gt;</code></pre></li><li><pre><code class="code"> &lt;head&gt;</code></pre></li><li><pre><code class="code"> &lt;style type=&quot;text/css&quot;&gt;</code></pre></li><li><pre><code class="code"> ol { </code></pre></li><li><pre><code class="code"> color: #eee; </code></pre></li><li><pre><code class="code"> font-family: monospace; </code></pre></li><li><pre><code class="code"> } </code></pre></li><li><pre><code class="code"> pre {</code></pre></li><li><pre><code class="code"> margin: 0;</code></pre></li><li><pre><code class="code"> }</code></pre></li><li><pre><code class="code"> ol .code { </code></pre></li><li><pre><code class="code"> color: #000; </code></pre></li><li><pre><code class="code"> } </code></pre></li><li><pre><code class="code"> ol .comment { </code></pre></li><li><pre><code class="code"> position: relative; </code></pre></li><li><pre><code class="code"> left: -0.5em; </code></pre></li><li><pre><code class="code"> padding: 0.5em; </code></pre></li><li><pre><code class="code"> margin: 1em 0; </code></pre></li><li><pre><code class="code"> background-color: rgb(0, 148, 255); </code></pre></li><li><pre><code class="code"> color: #fff; </code></pre></li><li><pre><code class="code"> font-family: sans-serif; </code></pre></li><li><pre><code class="code"> } </code></pre></li><li><pre><code class="code"> ol .comment:before { </code></pre></li><li><pre><code class="code"> content: &apos;&apos;; </code></pre></li><li><pre><code class="code"> position: absolute; </code></pre></li><li><pre><code class="code"> width: 0; </code></pre></li><li><pre><code class="code"> height: 0; </code></pre></li><li><pre><code class="code"> left: 0.5em; </code></pre></li><li><pre><code class="code"> top: -1em; </code></pre></li><li><pre><code class="code"> border: 0.5em solid; </code></pre></li><li><pre><code class="code"> border-color: transparent transparent rgb(0, 148, 255) transparent; </code></pre></li><li><pre><code class="code"> }</code></pre></li><li><pre><code class="code"> &lt;/style&gt;</code></pre></li><li><pre><code class="code"> &lt;/head&gt;</code></pre></li><li><pre><code class="code"> &lt;body&gt;</code></pre></li><li><pre><code class="code"> &lt;ol&gt;&quot;&quot;&quot;)</code></pre><p class="comment">Fuck HTML/CSS
</p></li><li><pre><code class="code"></code></pre></li><li><pre><code class="code"> in_comment = False</code></pre></li><li><pre><code class="code"> for line in input:</code></pre></li><li><pre><code class="code"></code></pre></li><li><pre><code class="code"> if has_comment(line):</code></pre></li><li><pre><code class="code"> if not in_comment:</code></pre></li><li><pre><code class="code"> output.write(&apos;&lt;p class=&quot;comment&quot;&gt;&apos;) </code></pre></li><li><pre><code class="code"> output.write(get_comment(line))</code></pre></li><li><pre><code class="code"> in_comment = True</code></pre></li><li><pre><code class="code"> else:</code></pre></li><li><pre><code class="code"> if in_comment:</code></pre></li><li><pre><code class="code"> output.write(&apos;&lt;/p&gt;&apos;)</code></pre></li><li><pre><code class="code"> output.write(&apos;&lt;/li&gt;&apos;)</code></pre></li><li><pre><code class="code"> in_comment = False</code></pre><p class="comment">Nice, but who needs multi-line comments anyway.
</p></li><li><pre><code class="code"> </code></pre></li><li><pre><code class="code"> if not in_comment:</code></pre></li><li><pre><code class="code"> output.write(&apos;&lt;li&gt;&apos;)</code></pre></li><li><pre><code class="code"> output.write(&apos;&lt;pre&gt;&lt;code class=&quot;code&quot;&gt;&apos; + html_escape(line.rstrip(&apos;\n&apos;)) + &apos;&lt;/code&gt;&lt;/pre&gt;&apos;)</code></pre><p class="comment">Well that was easy
</p></li><li><pre><code class="code"></code></pre></li><li><pre><code class="code"> output.write(&apos;&lt;/ol&gt;&lt;/body&gt;&lt;/html&gt;&apos;) </code></pre></ol></body></html>
#!/bin/python
import sys
from os.path import join, dirname, basename
COMMENT_TAG = "#>"
def output_path(path):
return join(dirname(path), 'Commentaar bij ' + basename(path) + '.html')
#> Wow. How hard can it be to create a proper file path
def has_comment(line):
return line.lstrip().startswith(COMMENT_TAG)
def get_comment(line):
return line.lstrip()[len(COMMENT_TAG)+1:]
#> Functions for one-liners. Go kill yourself.
html_escape_table = {
"&": "&amp;",
'"': "&quot;",
"'": "&apos;",
">": "&gt;",
"<": "&lt;",
}
def html_escape(text):
return "".join(html_escape_table.get(c,c) for c in text)
for path in sys.argv[1:]:
#> Call with ./inline.py *.py and it'll give you .html files
with open(path) as input, open(output_path(path), 'w') as output:
output.write("""
<html>
<head>
<style type="text/css">
ol {
color: #eee;
font-family: monospace;
}
pre {
margin: 0;
}
ol .code {
color: #000;
}
ol .comment {
position: relative;
left: -0.5em;
padding: 0.5em;
margin: 1em 0;
background-color: rgb(0, 148, 255);
color: #fff;
font-family: sans-serif;
}
ol .comment:before {
content: '';
position: absolute;
width: 0;
height: 0;
left: 0.5em;
top: -1em;
border: 0.5em solid;
border-color: transparent transparent rgb(0, 148, 255) transparent;
}
</style>
</head>
<body>
<ol>""")
#> Fuck HTML/CSS
in_comment = False
for line in input:
if has_comment(line):
if not in_comment:
output.write('<p class="comment">')
output.write(get_comment(line))
in_comment = True
else:
if in_comment:
output.write('</p>')
output.write('</li>')
in_comment = False
#> Nice, but who needs multi-line comments anyway.
if not in_comment:
output.write('<li>')
output.write('<pre><code class="code">' + html_escape(line.rstrip('\n')) + '</code></pre>')
#> Well that was easy
output.write('</ol></body></html>')
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment