[racket] [Frog] Code examples in handwritten HTML

From: Joe Gibbs Politz (joe at cs.brown.edu)
Date: Tue Oct 22 09:12:17 EDT 2013

Thanks for the fix!

I meant to say index.md in my earlier message, that was a thinko.

I'm building the static site for Pyret, which will have a blog down
the line, but I want to make a nice index page for it as well, and
it'd be cool to have it all in one place.  The fact that Frog gives me
Rackety templates inside a Bootstrap environment for free made me want
to try it out.  I'll keep you posted on how it goes and if Frog was
the right tool for us.



On Mon, Oct 21, 2013 at 1:29 PM, Greg Hendershott
<greghendershott at gmail.com> wrote:
> Fix pushed, and package catalog updated, so you can get it with:
>
>     raco pkg update markdown
>
> (Eventually I'll bump the version of the markdown pkg, and update
> Frog's deps, but meanwhile the above should get you the fix.)
>
> Let me know if you have any other questions.  Also, if you have things
> you're pretty sure are bugs, you're also welcome to hit
> https://github.com/greghendershott/frog/issues (just that repo is
> fine; don't worry about whether it's likely a bug in Frog or the
> Markdown parser, I can sort that out on my end).
>
>
> On Mon, Oct 21, 2013 at 9:34 AM, Joe Gibbs Politz <joe at cs.brown.edu> wrote:
>> I want to write an index page with some handwritten HTML using Frog,
>> and I want it to include source code.  Two issues.  First, it seems
>> like Frog doesn't respect my <pre> structure.  If I write something
>> like this in _src/index.html:
>>
>> # Index page
>>
>> <div class="container">
>>   <div class="row">
>>   <div class="col-md-4">
>>   Some exciting text!
>>   </div>
>>   <div class="col-md-8">
>> <pre>
>> fun sum(l :: List):
>>   cases(List) l:
>>     | empty => 0
>>     | link(first, rest) => first + sum(rest)
>>   end
>> where:
>>   sum([]) is 0
>>   sum([1, 2, 3]) is 6
>> end
>> </pre>
>>   </div>
>>   </div>
>> </div>
>>
>>
>> And then I build, the generated index looks like this:
>>
>>
>>  <div class="container">
>>   <div class="row">
>>    <div class="col-md-4"> Some exciting text!  </div>
>>    <div class="col-md-8">
>>     <pre> fun sum(l :: List): cases(List) l: | empty => 0 |
>> link(first, rest) => first + sum(rest) end where: sum([]) is 0
>> sum([1, 2, 3]) is 6 end </pre> </div> </div> </div></p>
>>         </div>
>>
>> Which destroys my line breaks.  If I put in <br/>s at the end of each
>> line, breaks *are* preserved, but then there's two line breaks for
>> each line.
>>
>>
>> Next, I tried Pygments using ``` escapes, but I think this is just not
>> the right mixture of Markdown and inline HTML.  Something like:
>>
>> # Index page
>>
>> <div class="container">
>>   <div class="row">
>>   <div class="col-md-4">
>>   Some exciting text!
>>   </div>
>>   <div class="col-md-8">
>> ```python
>> fun sum(l :: List):
>>   cases(List) l:
>>     | empty => 0
>>     | link(first, rest) => first + sum(rest)
>>   end
>> where:
>>   sum([]) is 0
>>   sum([1, 2, 3]) is 6
>> end
>> ```
>>   </div>
>>   </div>
>> </div>
>>
>>
>> Generates HTML that prematurely closes the "row" and "container"
>> <div>s, and treats the "col-md-8" open tag as content that's part of
>> some enclosing div:
>>
>>  <div class="container">
>>   <div class="row">
>>    <div class="col-md-4"> Some exciting text!  </div></div></div>
>> <div class=“col-md-8”> <code>`python fun sum(l ::
>> List): cases(List) l: | empty => 0 | link(first, rest) => first
>> + sum(rest) end where: sum([]) is 0 sum([1, 2, 3]) is 6 end</code>`
>> </p>
>>
>>
>> What's the best way for me to write some code examples?  Is there just
>> a racket function I can escape to and call Pygments directly to get
>> HTML to inline?  Is the <pre> behavior a bug or is there something
>> else I should be doing to make that formatting stick?
>>
>> Thanks,
>> Joe

Posted on the users mailing list.