<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Schadenfreude &#187; bluecloth</title>
	<atom:link href="http://www.ralree.com/tag/bluecloth/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.ralree.com</link>
	<description>Malicious enjoyment derived from observing someone else's misfortune</description>
	<lastBuildDate>Thu, 09 Feb 2012 01:49:15 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>Photoslice in Bluecloth and Mephisto</title>
		<link>http://www.ralree.com/2008/01/05/photoslice-in-bluecloth-and-mephisto/</link>
		<comments>http://www.ralree.com/2008/01/05/photoslice-in-bluecloth-and-mephisto/#comments</comments>
		<pubDate>Sat, 05 Jan 2008 21:49:00 +0000</pubDate>
		<dc:creator>Erik</dc:creator>
				<category><![CDATA[Uncategorized]]></category>
		<category><![CDATA[bluecloth]]></category>
		<category><![CDATA[images]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[lightbox]]></category>
		<category><![CDATA[markdown]]></category>
		<category><![CDATA[mephisto]]></category>
		<category><![CDATA[rails]]></category>
		<category><![CDATA[ruby]]></category>

		<guid isPermaLink="false">http://www.ralree.info/2008/01/06/photoslice-in-bluecloth-and-mephisto</guid>
		<description><![CDATA[So, I found this today, and it is awesome. I wanted it in Bluecloth so I could use it in Mephisto. Here&#8217;s how. First, I needed to make it so I could still do normal images, but turn on coolness if I want. Here&#8217;s the goal I came up with for the grammar: [![](thumburl.jpg)](imageurl.jpg "Scrolly Text at top" "photoslice") Here&#8217;s the first test, with a single image: And now a set with a namespace: I did it by simply modifying [...]]]></description>
			<content:encoded><![CDATA[<p>So, I found <a href="http://www.photoslice.net/guide/">this</a> today, and it is awesome.  I wanted it in Bluecloth so I could use it in Mephisto.  Here&#8217;s how.</p>
<p>First, I needed to make it so I could still do normal images, but turn on coolness if I want.  Here&#8217;s the goal I came up with for the grammar:</p>
<pre><code>
[![](thumburl.jpg)](imageurl.jpg "Scrolly Text at top" "photoslice")
</code></pre>
<p>Here&#8217;s the first test, with a single image:</p>
<p><a href="http://ralree.com/assets/2008/1/5/foshizzlepowell.jpg" title="Colin Powell Loves you" rel="photoslice"><img src="http://ralree.com/assets/2008/1/5/foshizzlepowell_thumb.jpg" alt=""/></a></p>
<p>And now a set with a namespace:</p>
<p><a href="http://ralree.com/assets/2008/1/5/ninjabeg.jpg" title="Ninjas killed his family.  Poor guy..." rel="photoslice.bluecloth"><img src="http://ralree.com/assets/2008/1/5/ninjabeg_thumb.jpg" alt=""/></a><br />
<a href="http://ralree.com/assets/2008/1/5/South_Park_Zach.jpg" title="Zach used to look like this." rel="photoslice.bluecloth"><img src="http://ralree.com/assets/2008/1/5/South_Park_Zach_thumb.jpg" alt=""/></a><br />
<a href="http://ralree.com/assets/2008/1/5/South_Park_Hank.jpg" title="I used to look like this." rel="photoslice.bluecloth"><img src="http://ralree.com/assets/2008/1/5/South_Park_Hank_thumb.jpg" alt=""/></a></p>
<p>I did it by simply modifying the regex and image url parsing function in BlueCloth like so:</p>
<div class="CodeRay">
<div class="code">
<pre>
  <span class="co">InlineLinkRegex</span> = <span class="rx"><span class="dl">%r{</span><span class="k">
    </span><span class="ch">\(</span><span class="k">            # Literal paren
      [ ]*        # Zero or more spaces
      &lt;?(.+?)&gt;?     # URI = $1
      [ ]*        # Zero or more spaces

      (?:         # title
        ([</span><span class="ch">\&quot;</span><span class="ch">\'</span><span class="k">])    # Opening quote char = $2
        (.*?)     # Title = $3
        </span><span class="ch">\2</span><span class="k">        # Matching quote char
      )?          # Title is optional
      [ ]*        # Zero or more spaces
      (?:         # rel
        ([</span><span class="ch">\&quot;</span><span class="ch">\'</span><span class="k">])    # Opening quote char = $2
        (.*?)     # rel = $5
        </span><span class="ch">\4</span><span class="k">        # Matching quote char
      )?          # rel is optional
    </span><span class="ch">\)</span><span class="k">
    </span><span class="dl">}</span><span class="mod">x</span></span>

    <span class="c"># and later...</span>

        <span class="c"># ...or for an inline style second part</span>
        <span class="r">elsif</span> <span class="iv">@scanner</span>.scan( <span class="co">InlineLinkRegex</span> )
          url = <span class="iv">@scanner</span>[<span class="i">1</span>]
          title = <span class="iv">@scanner</span>[<span class="i">3</span>]
          rel = <span class="iv">@scanner</span>[<span class="i">5</span>]
          <span class="iv">@log</span>.debug <span class="s"><span class="dl">&quot;</span><span class="k">  Found an inline link to %p</span><span class="dl">&quot;</span></span> % url

          text += <span class="s"><span class="dl">%{</span><span class="k">&lt;a href=&quot;%s&quot;</span><span class="dl">}</span></span> % escape_md( url )
          <span class="r">if</span> title
            title.gsub!( <span class="rx"><span class="dl">/</span><span class="k">&quot;</span><span class="dl">/</span></span>, <span class="s"><span class="dl">&quot;</span><span class="k">&amp;quot;</span><span class="dl">&quot;</span></span> )
            text += <span class="s"><span class="dl">%{</span><span class="k"> title=&quot;%s&quot;</span><span class="dl">}</span></span> % escape_md( title )
          <span class="r">end</span>
          <span class="r">if</span> rel
            rel.gsub!( <span class="rx"><span class="dl">/</span><span class="k">&quot;</span><span class="dl">/</span></span>, <span class="s"><span class="dl">&quot;</span><span class="k">&amp;quot;</span><span class="dl">&quot;</span></span> )
            text += <span class="s"><span class="dl">%{</span><span class="k"> rel=&quot;%s&quot;</span><span class="dl">}</span></span> % escape_md( rel )
          <span class="r">end</span>
</pre>
</div>
</div>
<p>I also added the following to my Mephisto theme layout, in the head section:</p>
<pre><code>
   &lt;!-- Photoslice --&gt;
   &lt;link rel="stylesheet" type="text/css" href="/javascripts/photoslice/style.css" /&gt;
   {{ "photoslice/functions.js" | javascript }}
</code></pre>
<p>Once again, Ruby is awesome.  And so is Markdown.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.ralree.com/2008/01/05/photoslice-in-bluecloth-and-mephisto/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

