Wrapping HTML in templates

[timeless]

Christian Robottom Reis wrote:

> Jouni's giving me a hard time because I'm reluctant to wrap HTML in
> templates. I'm trying to figure out what the right way to do this is; it
> isn't as trivial as it seems. This may pass as ironical to people who
> know me for being a strict 72-char wrapper; I just don't think this rule
> applies very well to the whitespace-intolerant nature of HTML, in
> particular, HTML links.
> 
> So here's a public cry for help that others may enjoy as well:
> 
>     a) How does one wrap a long link which isn't broken by template
>        statements?
> 
>         <p><a href=query.cgi>Skip all this nonsense, and go back to the query page</a>\n";

<p>
<a
href=query.cgi
 >Skip all this nonsense, and go back to the query page
</a>
";
> 
>     b) How does one wrap a long link which *is* broken by template
>        statements?
> 
>        <a href="[% INCLUDE diffurl attachid=attachid %]&headers=[% headers FILTER html %]&context=file">File</a> / 

<a
href="[%
INCLUDE diffurl attachid=attachid
%]&headers=[%
headers FILTER html
%]&context=file"
 >File
</a> /

>     c) How does one wrap a long HTML statement that includes <a> tags
>        (and therefore doesn't like spurious spacing here and there) such
>        as:
> 
>        <table class="file_table"><thead><tr><td class="file_head" colspan="2"><a href="#" onclick="return twisty_click(this)">[% collapsed ? '(+)' : '(-)' %]</a><input type="checkbox" name="[% file.filename FILTER html %]"[% collapsed ? '' : ' checked' %] style="display: none"> 

<table
class="file_table"
 ><thead
 ><tr
 ><td
class="file_head"
colspan="2"
 ><a
href="#"
onclick="return twisty_click(this)"
 >[%
collapsed ? '(+)' : '(-)'
%]</a><input
type="checkbox"
name="[%
file.filename FILTER html
%]"[%
collapsed ? '' : ' checked'
%]
style="display: none"
 >

> Yes, this last one is horrible. Yes, parts of it could be broken into
> separate lines. The question is: is it worth it if parts of it won't be
> wrappable anyway? Here's a try:
>        
>        <table class="file_table">
>          <thead>
>            <tr>
>              <td class="file_head" colspan="2"><a href="#" onclick="return twisty_click(this)">[% collapsed ? '(+)' : '(-)' %]</a><input type="checkbox" name="[% file.filename FILTER html %]"[% collapsed ? '' : ' checked' %] style="display: none"> 
>              [...]
>              </td>
>            </td>
>          </thead>
>         </table>
> 
> Is it really that much better? 
> 
> I've tended to use the policy: if a large portion of the line isn't
> wrappable, don't bother with wrapping smaller parts of it unless it
> makes things a lot better. Is that a bad policy?
> 
> Note that one alternative is wrapping *inside* tags and TT statements.
> Something like unfolding the above td into:
>              
>          <td class="file_head" colspan="2"><a href="#" 
>             onclick="return twisty_click(this)">[% 
>                 collapsed ? '(+)' : '(-)' %]</a><input 
>                     type="checkbox" name="[% file.filename FILTER html %]"[% 
>                          collapsed ? '' : ' checked' %] style="display: none"> 

           <td class="file_head"
               colspan="2"
           ><a href="#"
               onclick="return twisty_click(this)"
            >[% collapsed ? '(+)' : '(-)' %]</a
            ><input type="checkbox"
                    name="[% file.filename FILTER html %]"
                    [% collapsed ? '' : ' checked' %]
                    style="display: none"
             >

> I really think that's evil and makes the code much harder to follow, but
> I may be convinced otherwise. Note that we can't simply break around the
> <a> because the link text expands to cover whitespace in many cases.
> 
> Nothing convinces me that wrapping HTML makes it easier to read so far.

the reason to wrap is to own blame for as few characters as possible :).

> I'd be really happy if some consensus is reached; I'm really not a
> newbie to Bugzilla or to development, and I don't know what to do in
> most of these cases (that is, if I'm actually doing something wrong
> <wink>), so it's probable that either I'm being clueless or it's really
> not such a trivial matter.