Tinderbox User-to-User Forum (for formal tech support please email: info@eastgate.com)
http://www.eastgate.com/Tinderbox/forum//YaBB.cgi
Tinderbox Users >> Exporting from Tinderbox >> very basic formatting of simple HTML outlines?
http://www.eastgate.com/Tinderbox/forum//YaBB.cgi?num=1224234946

Message started by Rob Forsyth on Oct 17th, 2008, 5:15am

Title: very basic formatting of simple HTML outlines?
Post by Rob Forsyth on Oct 17th, 2008, 5:15am

I am exporting quite complex outlines using recursive HTML templates based on the SimpleOutline examples in Tinderbox way and all is fine except that the only formatting that survives this step is outline position.

I'd like the exported outline to preserve some other basic formatting properties of the outline in Tinderbox (particularly the note title font colour, but style (italic etc) and font would be helpful) as many of these are set by agents and are salient.

I suspect this is trivial to someone who understands CSS, but can we have a very basic guide?!

Thanks

Title: Re: very basic formatting of simple HTML outlines?
Post by Rob Forsyth on Oct 17th, 2008, 5:42am

Sorry - should have added by way of background that I am emailing the exported single HTML file to colleagues as a way of summarising our discussions and agreements as represented by the TBX outline. I presume this would suggest a solution that "hard codes" font colours etc into the actual HTML rather than relying on separate style sheets would be preferrable

Title: Re: very basic formatting of simple HTML outlines?
Post by Mark Anderson on Oct 17th, 2008, 6:45am

Taking the last first.  There's no reason you can't use an inline <style> element in the <head> of the main HTML page to avoid needing an external CSS file.

So, assuming you're using the Tinderbox Way method from around pages 136-137 you're getting code like:

Code:
<ol>
  <li><p>Outline</p>
     <ol>
        <li><p>Public Services</p>
           <ol>
              <li><p>Streets</p>
              </li>
           </ol>
        <li>
     </ol>
  </li>
</ol>

...but want...

Code:
<ol>
  <li><p class="level_1">Outline</p>
     <ol>
        <li><p class="level_2">Public Services</p>
           <ol>
              <li><p class="level_3">Streets</p>
              </li>
           </ol>
        <li>
     </ol>
  </li>
</ol>

...using style in the HTML page headead like so:

Code:
<head>
  <style>
  .level_1{/* CSS style info goes here }
  .level_2{/* CSS style info goes here }
...etc.


Make a rule or action that sets this action code:

Code:
HTMLFirstParagraphStart='<p class="level_' + $OutlineDepth + '">';
HTMLParagraphStart='<p class="level_' + $OutlineDepth + '">';


Note! In Tinderbox we normally use double quotes (") to enclose string literals (i.e. actual text) in actions but here we need to include some as part of the HTML that will be the attribute value we're creating and you can't escape a double quote in this manner: "class =\"level_". The workaround comes from the fact that as long as the quote types match TB - like the command line - allows string quoted in either single or double form. So, here we use single quotes allowing double quotes to be treated as text rather than the delimiters of the text.

Title: Re: very basic formatting of simple HTML outlines?
Post by Rob Forsyth on Oct 17th, 2008, 9:56am

It's very possible I'm misunderstanding this, but isn't this a way to assign styles to different levels of the outline (akin to a Microsoft Word style sheet)? What I want to be able to do entails individual notes at the same level in the outline having different colours (say), preserving/inheriting the format attributes of the original note in the TBX file as these reflect the actions of agents on the notes

Thanks again!

Rob

Title: Re: very basic formatting of simple HTML outlines?
Post by Mark Anderson on Oct 17th, 2008, 11:23am

Fine, instead of using OutlineDepth simply either hard code the desired style, (e.g. 'mystylename') in the rule:

Code:
HTMLFirstParagraphStart='<p class="mystylename">';
HTMLParagraphStart='<p class="mystylename">';

... or put the style name in a user attribute and use that where I used OutlineDepth. We use attribute StyleName to hold a value "mystylename" and use the rule:

Code:
HTMLFirstParagraphStart='<p class="' + $StyleName + '">';
HTMLParagraphStart='<p class="' + $StyleName + '">';

If that's still not right, it may be quicker for you to simply code up an HTML page as you want it to look, put in online and let use reverse engineer it back into TB form. I suggest this as it seems you're clearer about how you want the end result to look than you are about how to get there.  :)

Title: Re: very basic formatting of simple HTML outlines?
Post by Rob Forsyth on Oct 18th, 2008, 6:41am

I'm probably making this more complicated than I need. I'd settle for the SimpleOutline output:

<li>^title^</li>
^if(^get(ChildCount))
<ol>
^justChildren(SimpleOutline)
</ol>
^endif

modified so that Title reflects the colour of the particular note in the TBX outline

Thanks again

Title: Re: very basic formatting of simple HTML outlines?
Post by Mark Anderson on Oct 18th, 2008, 8:27am

OK, that's even easier:

Code:
<li style="color:^get(Color)^;">^title^</li>

or

Code:
<li><span style="color:^get(Color)^;">^title^</span></li>


[Tested in v4.5.2]

Title: Re: very basic formatting of simple HTML outlines?
Post by Rob Forsyth on Oct 20th, 2008, 2:21am

That's great. Thank you

Title: Re: very basic formatting of simple HTML outlines?
Post by Rafter T. Sass on Nov 10th, 2008, 10:34pm

I know this thread has died down a bit, but just in case anyone is still paying attention:

Is there anyway to use fairly simple statements, like those offered latest in the thread, to have the title of each item also reflect the bold a/o italic of the note?

Title: Re: very basic formatting of simple HTML outlines?
Post by Mark Anderson on Nov 11th, 2008, 6:35am

Titles are bold if NameBold is true. They are only in italic if they are aliases. As far as I know you can't set Bold or Italic via the font  - unless you chose a font by name that is by typeface design either both bold or italic.

Happily, bolding & italics via NameBold & alias state can be captured. Here's some code:


Code:
<html>
<head>
<title>^title^</title>
</head>
<body>
<ul>
^if(NameBold)^
 ^if(Alias)^
 <!-- Bold and Italics -->
 <li style="color:^get(Color)^;"><b><i>^title^</i><b></li>
 ^else^
   <!-- Bold only -->
   <li style="color:^get(Color)^;"><b>^title^</b></li>
 ^endIf^
^else^
 ^if(Alias)^
   <!-- Italics only -->
   <li style="color:^get(Color)^;"><i>^title^</i></li>
 ^else^
   <!-- Neither bold nor italics -->
   <li style="color:^get(Color)^;">^title^</li>
 ^endIf^
^endIf^
</ul>
</body>
</html>


IMPORTANT: Alias is a hidden internal attribute in TB and you won't see the correct export code in HTML view for aliases but they will export correctly.

Note that TB doesn't have an 'else if' conditional syntax so you must nest put each successive test in the 'else' fork of the previous test, remembering to close all tests when done.




Tinderbox User-to-User Forum (for formal tech support please email: info@eastgate.com) » Powered by YaBB 2.2.1!
YaBB © 2000-2008. All Rights Reserved.