Hint: to save to a file, copy (using ctrl-c or cmd-c) this content and paste it into your favorite text editor.
Html version ...
Edits? ||
|
|
|
|
|
|
|
|
|
xxx
Text to HTML Assistant (textToHtmlAssistant)
textToHtmlAssistant will convert text files to HTML.
That means trying to figure out what kinds of HTML markup to insert into the text file to make it pretty.
In particular, if your text file follows a certain natural syntax, textToHtmlAssistant can add a variety of markup: including
lists, text highlighting, internal and external links, and simple tables
While far from perfect, and not particularly elegant, textToHtmlAssistant can do a credible job.
textToHtmlAssistant is especially useful for converting text files with lots of HTML tags -- the tags are displayed
as they are.
For more details: click on the
Text to HTML Assistant (textToHtmlAssistant)
textToHtmlAssistant is a javascript program that will convert text files to HTML.
That means trying to figure out what kinds of HTML markup to insert into the text file to make it pretty.
While far from perfect, and not particularly elegant, textToHtmlAssistant can do a credible job.
textToHtmlAssistant is especially useful for converting text files with lots of HTML tags -- the tags are displayed
as they are.
If your text file follows a certain natural syntax, textToHtmlAssistant can add a variety of markup, including:
Automatic conversion of html tags
Empty lines as new lines
Bold and monospacing of text
Creation of ordered and unordered list, with optional side header
Creation of 2 column tables
Creation of non-marked up examles (<pre> style)
Creation of external links
Creation of a linked table of contents, and section headers
Adding to the text area
The text in the text area will be converted. You can type in text, or you can cut and paste from a document.
Or, if your browser is even a bit modern (if it has HTML5 support), you can directly load the contents of a file
into this textarea.
Once you have text in this textarea, you can edit -- adding, removing, and moving text around. In addition,
you can select blocks of text for special formatting: literal and html.
literal blocks of text will be retained as is, and embedded in a <div> with <pre> styling.
html blocks of text will be treated as html, hence the tags will be retained (and html formatting will be displayed)
Note that this works by putting special codes in the text, that instruct htmlToTextAssistant on where to suspend auto formatting.
For more details on how this works, see the descriptions of === and <: in the Auto formatting options.
Note that you can undo recent changes, or reset your text back to the original contents (i.e.; the contents read from a file).
Auto formatting
There are a number of options that control what kinds of
formatting is automatically done. These are chosen using buttons in the
green bar at the top of the screen. The following describes what each of these buttons does.
Converting and display
Once you have loaded & modified your text , and chosen your auto-formatting options, you can then convert text to html! To do this,
just click on the button. The resulting HTML will be displayed.
You can do several things with this display:
You can make some minor edits, such as bolding and changing back ground color of portions of your
document. Just click on the Edits check box. You will see a set of radio buttons, each one corresponding to an effect (such as
i). Chose the effect you want, and then highlight (in the html text) what you want modified.
This is a convenient way to apply the same formatting to many different blocks of text within the HTML document
You can display the HTML in a new window. Just click the
button.
It would be convenient to save this document to a .html file; but that is often tricky -- FireFox will not save the displayed code; instead
it saves the textToHtmlAassistant.htm code!
Instead, you can copy the HTML to your buffer ...
textToHtmlAssistant auto formatting options: choose what special character sequences are recognized as formatting commands
The option
Description
What to do with empty lines: replace with <p>,replace with <br>, or leave as is.
Create lists (<ol> and <ul>), or Table of Contents entries and section headers
(TOC entries embody a link that jumps to a corresponding setion header)
The first words in a line can signal that the line is part of a list (a <ul> or <ol>), or is a Table of Contents (TOC) entry or a section header.
For several types of first words, you can control the interpretation: is the line a list item, or is it TOC/Section header.
By default, the following first words are recognized. Note that:
In all cases, these must be the first words in a line (words are seperated by spaces, not by commas).
Trailing and leading spaces matter!
The
button can be used to change these defaults. For example, you can specify that I. be used as a list item, rather than a TOC entry. Or,
you can disable: say, you can specify that a. entries not be treated as list items.
Specify a list.
*
A row in a <ul>
1.
A row in a <ol type="1">
a.
A row in a <ol type="a">
i.
A row in a <ol type="i">
---
Signals the end of a list
Notes on lists.
The line must begin with at least two spaces (otherwise, it is treated as a normal line of text)
The first occurrence of a list word (i.e.; a * or a 1. ) signals the beginning of the list
(i.e.; a <ul>)
Later occurences signal a new list row (i.e.; a <li>)
A --- (by itself, anywhere on the line) signals end of list
(i.e.; a </ul>)
Alternatively, two empty lines can be used. This means
you can have single empty lines within the list (but not multiple adjacent empty lines).
We recommend using the ---method to signal the end of a list.
You can mix types of list! For example, in a list of * , you can
include a list of a. .
Specify a TOC entry, or a section header
1.a)
A TOC row (with link)
1.a)
A header row
I.)
A TOC row (with link)
I.
A header row
A.)
A TOC row (with link)
A.)
A header row
Notes on TOC & section headers.
For TOC entries, the line must begin with at least two spaces
For section headers, the line must be flush left (no leading spaces)
To reiterate: there can be no spaces in the first word. So 1.a) is okay but 1. a) is not)
The different kinds of TOC & and section header words (i.e.; 1.a) and I.) can be freely mixed --
unlike list items, there is no special ordering amongst the different kinds of TOC & section header first words.
TOC items should match a similar section header (if they don't the link won't work!)
A TOC item (or section header) word can have different levels: where levels are determined by
periods. For example:
The number of levels controls:
Examples of lists
Examples of lists ...
Hello world
a. Turn oven on
b. Open the can
and get a clean pot
c. Pour contents of can into pot
---
Can you do that?
Good, now
1. Put pot on oven
2. turn on timer
3. wait!
---
Be patient
will yield
Hello world
Turn oven on
Open the can
and get a clean pot
Pour contents of can into pot
Can you do that?
Good, now
Put pot on oven
turn on timer
wait!
Be patient
My pets
* cat
and no mice!
* dog
* gerbil (in a cage)
---
I like them all
will yield
My pets
cat
and no mice!
dog
gerbil (in a cage)
I like them all
My pets
* cat
* dogs
a. Fido
b. Rover
c. Spot
1. Spot senior
2. Spot junior
---
d. Ralph
---
* gerbil (in a cage)
---
I like them all
will yield
My pets
cat
dogs
Fido
Rover
Spot
Spot senior
Spot junior
Ralph
gerbil (in a cage)
I like them all
Examples of TOC & section headers
Examples of table of contents with links to internal section headers.
TOC entries are displayed on seperate rows, starting with the label (i.e.; 1.a))
and followed by an indented link (using stuff on the line after the label as the text of the link).
Clicking on these links allows you to navigate within the document. The section headers are displayed in a highlighted line, with font size that
depends on the depth of dotted label -- how many periods does it contain. Similarly, the indentation of the link depends on this depth.
Examples
The contents
1a) section 1
2.b) section 2
2.b.i) Some notes
3) Last section
Stuff here ...
1a) My section 1
here is some 1a stuff
2.b) And the 2b stuff is here
Almost done
2.b.i) 2b i ....
Geting close
3) The last section
Good bye
Note: the return to TOC link should be a ←, but when saved to a text file under FireFox, it
seems to be converted to a ?
Create a single row 2 column table.
When the first line before a list (such as a * or a. )
ends with : or a ..., then a 1-row, 2-column table will be created.
Note that there can not be a space preceding the : (or the ...).
For example: Note:
Example
The first column contains the content before this : or a ...
The second colunmn contains the list
Actually, you can have a blank line between this Note: and the start of the list.
Example:
My pets:
* cat
and no mice!
* dog
* gerbil (in a cage)
---
I like them all
yields
My pets:
cat
and no mice!
dog
gerbil (in a cage)
I like them all
Create a horizontal rule (a <hr>)
A sequence of more than three underscore (_) characters, and nothing else, on a line will create a <hr>
The more _ the wider the line. The pct width of the line =35 + # of _ (min of 39%, max of 100%)
Examples:
________________
will yield
<hr width="51%" >
which appears as
____________ ____________
will yield
<hr width="60%" >
which appears as
Note that you can embed spaces, but no other characters.
Indent a line
When a line start with a minimum of 3 dots (...), a new line is created (a <div> is created) with an indentation.
Just three dots is a 3% indentation, with every additional dot another 3%.
Note that characters before the ..., and between the ... and next non-space character, are ignored.
Example:
div class="exampleDiv">
My mother said
.... please come to dinner Saturday
but I said
... Not this week, got a date!
But maybe Sunday?
which yields
My mother said
please come to dinner saturday
but I said
Not this week, got a date!
But maybe Sunday?
Notes:
the ... indent is only for the line it is on.
A ... with nothing else means ignore this line. This is a way of forcing a line break.
Put line break (<br>) at end of this line.
Any line that ends with a . will have a line break added.
Italicize a word at an end of a line
The word must be at the end of a line, and there must not be a space between the : and the word.
Example:
This is where
we show emphasis:
when needed
But this is not: italicized
willl yield
This is where
we show emphasis: when needed
But this is not: italicized
Note: technically, a <span class="colonClass">aword:</span> is used
Bold and enlarge the text
A set of 3 asterisks (***) both before and after text (on a single line) causes that text to be bolded.
Example:
This is *** how we bold some text *** on a line.
yields
This is how we bold some text on a line.
Note: technically, a <span class="astClass"> stuff between *** </span> is used
Bold a word
If a word is all capitals, it will be bolded.
Example:
This where my CAPITALIZED word appears.
yields
This where my CAPITALIZED word appears.
Note: technically, a <span class="capsClass"> AWORD </span> is used
Monospace the text
A reverse single quote (`) placed both before and after text (on a single line) causes that text to be mono spaced.
Example:
This where `where we monospace some text ` but not all text
yields
This where where we monospace some text but not all text
Notes:
technically, a <span class="quoteClass"> stuff between `s </span> is used
If there is only one ` on a line, it will not be changed.
Thus, to display two ` on line of the display, use two lines.
Example:
this `should be monospace` now
yields:
this should be monospace now
this `will not
be monospace` now
yields:
this `will not be monospace` now
Empahasize the text
Two reverse single quote (``) placed both before the text, with two regular single quotes ''
after text (on a single line) causes that text to be emphasize.
Example:
This where `` where we emphasize some text '' but not all text
yields
This where where we emphasize some text but not all text
Notes:
technically, a <span class="emphasisClass"> stuff between `` and '' </span> is used
If there is only the `` on a line (there is no ''
after the ``), it will not be changed.
Underline the text
A set of 3 underscores (___) both before and after text (on a single line) causes that text to be underlined.
Example:
This is ___ how we underline some text ___ on a line.
yields
This is how we underline some text on a line
Note: technically, a <span class="underlineClass"> stuff between *** </span> is used
Highlight <tags>
You can not highlight, highlight just the tags, or highlight a begin-end tag and stuff in between (if on the same line).
Clicking the button cycles through 3 options.
Example, using the following example: This is a <loneTag> and this is a <matchedTag> tag2 stuff </matchedTag> also
Highlight a <tag> stuff here </tag> :
This is a <loneTag> ; and this is a <matchedTag> with some contents</matchedTag> also
Highlight a <tag> (and its attributes):
This is a <loneTag> ; and this is a <matchedTag> with some contents</matchedTag> also
Do not highlight tags (just display them verbatim):
This is a <loneTag> and this is a <matchedTag> with some contents </matchedTag> also
Create multi-row, 2 column table using vertically aligned : as a column divider
If your text contains a visual column divider consisting of a
: ), then a table-like structure will be created.
The rules
There must be at least one space before and after : Otherwise, the : is treated as a normal (displayable) character
The :s must be vertially aligned.
There must be at least two lines in a row with vertically aligned :
Given the above, : delimits a new column.
Blank lines, or lines where the first non-space character is after the location of the : (on the line(s) above)
are treated as continuation lines (of the preceding line with a : ).
The table ends with a non blank character that does NOT have a : in the proper vertical alignment.
Example:
*** The field test results ***
Test1 : May sample
Test2 : June sample.
These are incomplete!
Test3 : Final results
More results as they become available!
The field test results
Test1
May sample
Test2
June sample.
These are incomplete!
Test3
Final results
More results as they become available!
Notes:
You can try nesting lists, etc inside of these, but they may not display well.
Convert a http://a.b.c/adir/zstuff type of string to an active link.
This will create an active (clickable) link to a url. The displayed content of the link will be either the first 15 character sof the selector
(the zstuff), or the url if there is no selector (the a.b.c).
Create a two cell table. The first column is keyword, the second is a literal block of content (that will be displayed
using <pre> style).
This is meant to display verbatim text; such as an example, or the syntax of a command.
The block of text starts with a line that contains a keyword
this keyword must be the only word on a line, and it must exactly match one of the defined keywords.
By default, the keywords include:
Example: and Syntax: and Yields:
Note that if you want the keyword to end with a : you must explicitily include it.
The next several lines of content (the literal block) can be whatever you want, it will be shown literally (without any processing)
Similar to list specification, a literal block ends with a line that just has ---, or two empty lines in a row (similar to how lists are closed)
Example:
The special instructions are easy to specify.
Syntax:
* size = 100
* weight = 35
and
color = red
And you can create your own specs!
---
When done, send them in?
Yields
The special instructions are easy to specify.
Syntax:
* size = 100
* weight = 35
and
color = red
And you can create your own specs!
When done, send them in?
The list of keywords that signal to create a [PRE] table. These should be entered in a comma seperate values list exactly
how they will be used in the document. Note that defaults (Syntax: ,Example: , Examples:, Yield: ,Yields:,Example...)
Create a multi-row, two column more options table. The first column contains a one word option,
the second column a long description.
The more options table is specifed using
The table starts with a keyword
this keyword must be the only word on a line, and it must exactly match one of the defined keywords.
By default, Where: and Options:
(note that the keyword must end with one space).
The next lines are used as a header for the table
A new row is signaled by a option: string -- a word that ends in a :.
This must be the first word on a line, but it does not have to be the only word
Caution: the use of this option: syntax to signal new row can conflict with
the use of aword: in the two column, 1 row table with a list, and in the specify a literal
automatic formatting options. Thus, to specify these formats, use aword... (instead of aword:).
Everything after this option:, until the next option: is used in the 2nd column of the row.
The table is completed when a line starts with an indentation less than the first line of the table!
That is, the --- method is not used! Instead, the extent of indentation
is used to signal the end of the table.
This means that indentation is important --
the start of the table (and the first row after the end of the table) all being indented less than the lines defining
the content of the table (including the option: lines).
Example
You can do any of the following actions.
But only one!
Options: Choose one or more of the options
opt1: The first option
opt2: The second one.
The choices include
* color
* weight
* size
---
opt3: last one
---
Chose well!
Yields
You can do any of the following actions.
But only one!
Options: Choose one or more of the options
opt1
The first option
opt2
The second one.
The choices include
color
weight
size
opt3
last one
Chose well!
The list of keywords that signal to create a moreTable table. These should be entered in a comma seperate values list exactly
how they will be used in the document. Note that defaults (Where:,where:,options:,Options:)
Display a block of text literally -- with no html formatting
Blocks of text will be found, and will not be processed for implicit HTML formatting. That is, all the text
within this block will be displayed as is -- tags displayed in <pre> format (actually, using the literalClass style).
To identify these blocks:
Start with === -- flush left. You can have other = or spaces after the ===, but no other characters
(of other characters are found, this is treated as a normal line).
Each line starts with a = (flush left)
The block ends at a line whose first character is not an =
Example:
=== =======
= This is my sample of literal text
= I can include
= and a n y kind of sp a c ing !
=
Will be displayed as
This is my sample of literal text
I can include <tags>
and a n y kind of sp a c ing !
Notes:
The leading = is stripped out (and the === first line is dropped)
You can embed these literal blocks in lists, etc -- but be careful, it may fail for odd reasons (i.e.; there are multiple blank lines)
Display a block of text using html formatting. That is: treat the block of text as html, not as plain text.
Blocks of text will be found, and will displayed using them.. That is, all the text is displayed as if it was in an HTML file.
In particular, tags are used as html formatting (they are not displayed).
To identify these blocks:
Start with <: flush left (nothing else on the line).