Photoslice in Bluecloth and Mephisto

Posted by hank, Sat Jan 05 21:49:00 UTC 2008

So, I found this today, and it is awesome. I wanted it in Bluecloth so I could use it in Mephisto. Here’s how.

First, I needed to make it so I could still do normal images, but turn on coolness if I want. Here’s the goal I came up with for the grammar:


[![](thumburl.jpg)](imageurl.jpg "Scrolly Text at top" "photoslice")

Here’s the first test, with a single image:

And now a set with a namespace:

I did it by simply modifying the regex and image url parsing function in BlueCloth like so:

  InlineLinkRegex = %r{
    \(            # Literal paren
      [ ]*        # Zero or more spaces
      <?(.+?)>?     # URI = $1
      [ ]*        # Zero or more spaces

      (?:         # title
        ([\"\'])    # Opening quote char = $2
        (.*?)     # Title = $3
        \2        # Matching quote char
      )?          # Title is optional
      [ ]*        # Zero or more spaces
      (?:         # rel
        ([\"\'])    # Opening quote char = $2
        (.*?)     # rel = $5
        \4        # Matching quote char
      )?          # rel is optional
    \)
    }x

    # and later...

        # ...or for an inline style second part
        elsif @scanner.scan( InlineLinkRegex )
          url = @scanner[1]
          title = @scanner[3]
          rel = @scanner[5]
          @log.debug "  Found an inline link to %p" % url

          text += %{<a href="%s"} % escape_md( url )
          if title
            title.gsub!( /"/, "&quot;" )
            text += %{ title="%s"} % escape_md( title )
          end
          if rel
            rel.gsub!( /"/, "&quot;" )
            text += %{ rel="%s"} % escape_md( rel )
          end

I also added the following to my Mephisto theme layout, in the head section:


   <!-- Photoslice -->
   <link rel="stylesheet" type="text/css" href="/javascripts/photoslice/style.css" />
   {{ "photoslice/functions.js" | javascript }}

Once again, Ruby is awesome. And so is Markdown.

Tags: bluecloth images javascript lightbox markdown mephisto rails ruby