search

donpark / html2jade

Converts HTML to Jade template. Not perfect but useful enough for non-daily conversions.
MIT License
1.18k stars 156 forks source link

Weird Jade output #41

Open briemens opened 12 years ago

briemens commented 12 years ago

Hi Don! Love your project.

I'm getting some weird output. I'm converting a generated HTML file to JADE.

The source HTML file...

http://share.crafity.com/UQKs

The scrambled JADE output

http://share.crafity.com/PrTN

Any ideas?

PS. Installed html2jade from NPM

donpark commented 12 years ago

Definitely a bug. I'll take a look. thx Bart.

donpark commented 12 years ago

TJ @visionmedia, how would you code the following HTML in Jade?

<pre class="hl"><span class="hl slc">// Generated by CoffeeScript 1.3.3</span>
<span class="hl opt">(</span><span class="hl kwa">function</span><span class="hl opt">() {</span>
</pre>
donpark commented 12 years ago

@briemens I tried to manually convert your PRE example and found it really awkward. What would your expected output Jade file look like?

briemens commented 12 years ago

@donpark I use the command line tool highlight to create a syntax highlighted HTML files from JS files. In this example I converted your html2jade.js file to HTML. The HTML is not nice to look at, but with the right CSS the browser renders it correct.

I would expect the following Jade output based on the HTML above

pre.hl
    span.hl.slc // Generated by CoffeeScript 1.3.3
    span.hl.opt (
    span.hl.kwa function
    span.hl.opt () {
donpark commented 12 years ago

Disabling special handling of pre tag generates exactly that. Problem is blank lines and white spaces have to be inserted awkwardly to break up the lines and indent output correctly to make them render correctly. By 'awkwardly', I mean pretty ugly and arbitrary looking jade which defeats the whole purpose of jade.

I am afraid I'll have to sit on this bug for a while. Maybe TJ will add some syntactic sugar to make pre in Jade actually pretty. :-p