ruby-on-rails - Rendering Pagedown Markdown in Rails 4

Question

I have a properly working pagedown editor in a rails 4 application, but I believe I'm missing something simple to render the pagedown data at a later point in my application.

Here's the gem (and initialization) I'm using: https://github.com/hughevans/pagedown-bootstrap-rails

Any ideas on how to render that data with the already-used gems?

EDIT: I think the root of my problem is it's not storing the data as the HTML version, so it doesn't render it when I display the data again. It's missing the converter step when the form gets saved, but I don't see any specific instruction on how to do that, so I assumed it was default part of these gems.

EDIT2: I've since taken the approach to convert the Markdown on each page load, with the following code:

Unfortunately, it doesn't use all the Pagedown Markdown, but it's at least handling new lines properly:

Any ideas?

Thanks!

Answer 1

So the answer to this question is two fold. Either you can convert the MD to HTML and store it in the database, or leave it as MD in the DB and convert it to HTML every time you want to render it. Note that you'll need to convert it back to MD (I'm not sure if this is entirely easy or not) if you want that field to be editable in the original MD.

Since this app doesn't care about performance, I decided to store it as MD and render it. The results I was getting above stemmed from HAML's whitespace rendering that it does, so I had to use a little HAML filters to work around that.

The HAML ended up looking like:

.wmd-output><
  :preserve
    #{@object.attribute}

The second challenge was actually pretty straightforward, just not explicitly stated anywhere in the Markdown documentation. So I just wrote some javascript that automatically converts any .wmd-output class into it's proper Markdown on page load:

$(function() {
  $('.wmd-output').each(function(i) {
    var converter = new Markdown.Converter();
    var content = $(this).html();
    $(this).html(converter.makeHtml(content));
  });
});

I hope this helps other people in the future.

Answer 2

This line of haml referenced should be what you need to render it:

= f.input :description, :as => :pagedown, :input_html => { :preview => true }