<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
lang="en" xml:lang="en">
<head>
<title>EMACS ORG-INFO.JS</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<meta name="generator" content="Org-mode"/>
<meta name="generated" content="2009-06-22 05:13:57 CEST"/>
<meta name="author" content="Sebastian Rose"/>
<meta name="description" content=""/>
<meta name="keywords" content=""/>
<style type="text/css">
<!--/*--><![CDATA[/*><!--*/
html { font-family: Times, serif; font-size: 12pt; }
.title { text-align: center; }
.todo { color: red; }
.done { color: green; }
.tag { background-color: #add8e6; font-weight:normal }
.target { }
.timestamp { color: #bebebe; }
.timestamp-kwd { color: #5f9ea0; }
p.verse { margin-left: 3% }
pre {
border: 1pt solid #AEBDCC;
background-color: #F3F5F7;
padding: 5pt;
font-family: courier, monospace;
font-size: 90%;
overflow:auto;
}
table { border-collapse: collapse; }
td, th { vertical-align: top; }
dt { font-weight: bold; }
div.figure { padding: 0.5em; }
div.figure p { text-align: center; }
.linenr { font-size:smaller }
.code-highlighted {background-color:#ffff00;}
.org-info-js_info-navigation { border-style:none; }
#org-info-js_console-label { font-size:10px; font-weight:bold;
white-space:nowrap; }
.org-info-js_search-highlight {background-color:#ffff00; color:#000000;
font-weight:bold; }
/*]]>*/-->
</style><style type="text/css"></style>
<link rel="stylesheet" type="text/css" href="stylesheet.css" />
<script type="text/javascript" src="org-info.js"></script>
<script type="text/javascript" >
<!--/*--><![CDATA[/*><!--*/
org_html_manager.set("TOC_DEPTH", "3");
org_html_manager.set("LINK_HOME", "http://orgmode.org");
org_html_manager.set("LINK_UP", "http://orgmode.org/worg/");
org_html_manager.set("LOCAL_TOC", "above");
org_html_manager.set("VIEW_BUTTONS", "0");
org_html_manager.set("MOUSE_HINT", "underline");
org_html_manager.set("FIXED_TOC", "0");
org_html_manager.set("TOC", "0");
org_html_manager.set("VIEW", "info");
org_html_manager.setup(); // activate after the parameters are set
/*]]>*///-->
</script>
<script type="text/javascript">
<!--/*--><![CDATA[/*><!--*/
function CodeHighlightOn(elem, id)
{
var target = document.getElementById(id);
if(null != target) {
elem.cacheClassElem = elem.className;
elem.cacheClassTarget = target.className;
target.className = "code-highlighted";
elem.className = "code-highlighted";
}
}
function CodeHighlightOff(elem, id)
{
var target = document.getElementById(id);
if(elem.cacheClassElem)
elem.className = elem.cacheClassElem;
if(elem.cacheClassTarget)
target.className = elem.cacheClassTarget;
}
/*]]>*///-->
</script>
</head>
<body>
<div id="content">
<h1 id="title">EMACS ORG-INFO.JS</h1>
<div id="table-of-contents">
<h2>Table of Contents</h2>
<div id="text-table-of-contents">
<ul>
<li><a href="#sec-1">1 The Name of the Game </a>
<ul>
<li><a href="#sec-1.1">1.1 Download </a></li>
<li><a href="#sec-1.2">1.2 Terms used throughout this Document </a></li>
</ul>
</li>
<li><a href="#sec-2">2 Features </a>
<ul>
<li><a href="#sec-2.1">2.1 Appearance </a></li>
<li><a href="#sec-2.2">2.2 Keyboard navigation </a></li>
<li><a href="#sec-2.3">2.3 Searching </a></li>
<li><a href="#sec-2.4">2.4 Miscelaneous </a></li>
</ul>
</li>
<li><a href="#shortcuts">3 Shortcuts </a></li>
<li><a href="#setup">4 Setup </a>
<ul>
<li><a href="#the-new-way">4.1 Export-Setup - the new Way </a>
<ul>
<li><a href="#sec-4.1.1">4.1.1 Using customize </a></li>
<li><a href="#sec-4.1.2">4.1.2 Per File Basis: #+INFOJS_OPT </a></li>
</ul>
</li>
<li><a href="#the-old-way">4.2 Export-Setup - the old Way </a>
<ul>
<li><a href="#sec-4.2.1">4.2.1 Using a special * COMMENT Section </a></li>
<li><a href="#sec-4.2.2">4.2.2 Using customize </a></li>
<li><a href="#sec-4.2.3">4.2.3 Export-Setup per Project </a></li>
</ul></li>
</ul>
</li>
<li><a href="#sec-5">5 Linking to Files using the Script </a></li>
<li><a href="#sec-6">6 CSS </a></li>
<li><a href="#sec-7">7 Supported Browsers </a>
<ul>
<li><a href="#sec-7.1">7.1 People reported it works in </a></li>
</ul>
</li>
<li><a href="#sec-8">8 Why Do I Need a T.O.C? </a></li>
<li><a href="#xhtml">9 The XHTML </a>
<ul>
<li><a href="#using-set">9.1 Using Set() </a></li>
</ul>
</li>
<li><a href="#sec-10">10 How it works </a></li>
<li><a href="#sec-11">11 Presentations with org-info.js </a></li>
<li><a href="#sec-12">12 History </a></li>
<li><a href="#sec-13">13 Thanks </a></li>
<li><a href="#sec-14">14 License </a></li>
<li><a href="#sec-15">15 THE END </a></li>
</ul>
</div>
</div>
<div id="outline-container-1" class="outline-2">
<h2 id="sec-1"><span class="section-number-2">1</span> The Name of the Game </h2>
<div class="outline-text-2" id="text-1">
<p>
org-info-js (subsequently called <i>the script</i>) implements part of Emacs Org-mode
in it's XHTML-exported files, allowing them to be rendered and browsed in a
linuxdoc/texinfo style.
</p>
<p>
This documentation is one XHTML file, exported from one *.org file using a
single keyboard shortcut. No additional postprocessing was done. There are no
external dependencies and the script is small and fast, even for large files.
It is used on the <a href="http://orgmode.org/Changes.html">org-mode site</a> to display <code>ORGWEBPAGE/Changes.org</code> which
consists of more than 220 sections.
</p>
<p>
If you don't mind using it despite the <i>health warnings</i> we wish you good luck
and hope the fun will outweigh your effort.
</p>
<p>
There are some drawbacks though. It is currently not possible to
open internal links in another tab (e.g. using middle click in
Firefox) due my poor JavaScript knowledge. This is not very high on
my TODO list since the history mechanism of the script is a good
alternative to tab usage.
</p>
<p>
Go to the next section by pressing '<code>n</code>'.
</p>
<p>
Find out about shortcuts in section <a href="#shortcuts">Shortcuts</a> (and come back here
pressing '<code>b</code>'). In addition, '<code>?</code>' will show all shortcuts available.
</p>
</div>
<div id="outline-container-1.1" class="outline-3">
<h3 id="sec-1.1"><span class="section-number-3">1.1</span> <span class="target">Download</span> </h3>
<div class="outline-text-3" id="text-1.1">
<ul>
<li>
A list of Changes can be found <a href="changes.html">here</a> (separat file).
</li>
<li>
<a href="#sec-1.1">Download</a> the <a href="org-info.js">minified version</a> or the <a href="org-info-src.js">sourc code</a>.
</li>
<li>
Create the minified versions from the sources using the <a href="Makefile">Makefile</a> and a
little <a href="sed.txt">sed script</a>.
</li>
</ul>
<p>Development of the script takes place on github
(<a href="http://github.com/SebastianRose/org-info-js/tree/master">http://github.com/SebastianRose/org-info-js/tree/master</a>), but every working
release is published here on Worg synchronously. That said, you can follow
the development by tracking the Worg repo as well, available at
<a href="http://repo.or.cz/w/Worg.git">http://repo.or.cz/w/Worg.git</a>.
</p>
</div>
</div>
<div id="outline-container-1.2" class="outline-3">
<h3 id="sec-1.2"><span class="section-number-3">1.2</span> <span class="target">Terms used throughout this Document</span> </h3>
<div class="outline-text-3" id="text-1.2">
<p>
The script knows three different so called <i>view modes</i>. One may toggle the
view mode by pressing '<code>m</code>' or click the <i>toggle view</i> link the script adds to
your pages. Currently three view modes exist:
</p>
<dl>
<dt><b>info view mode</b></dt><dd>
<p>
This mode displays the sections one by one, paged like the typical
linuxdoc or texinfo files. This is the view mode you should face when
first visiting this documentation.
</p>
</dd>
<dt><b>plain view mode</b></dt><dd>
<p>
This mode displays the entire file. In this mode the sections are foldable
by clicking the headlines or pressing '<code>f</code>' (fold). The entire structure
of the document my be (un-)folded using '<code>F</code>'. You may determin what's
visible on pageload.
</p>
</dd>
<dt><b>presentation mode</b></dt><dd>
<p>
This mode displays sections one by as slides. Still
very rustic and experimental. Rick Moynihan embarked and we plan a separat
tool for presentations, but…
</p>
</dd>
</dl>
<p>The table of contents (<b>TOC</b>) is required, albeit it may be hidden (CSS). The TOC may
be visited using '<code>i</code>' (index) regardless of its visibility.
</p>
<p>
A <b>section</b> is everything with a headline.
</p>
</div>
</div>
</div>
<div id="outline-container-2" class="outline-2">
<h2 id="sec-2"><span class="section-number-2">2</span> <span class="target">Features</span> </h2>
<div class="outline-text-2" id="text-2">
</div>
<div id="outline-container-2.1" class="outline-3">
<h3 id="sec-2.1"><span class="section-number-3">2.1</span> Appearance </h3>
<div class="outline-text-3" id="text-2.1">
<dl>
<dt><b>Toggle plain view, info view and presentation</b></dt><dd>
<p>
One can click the script-generated links in info view mode to read through
the whole file page by page. By clicking on '<i>toggle view</i>' (or pressing
`m´) you can switch between info and plain view mode. The presentation mode
is very rudimentary and just a quick hack realy. Press 'x' to see it.
</p></dd>
<dt><b>Keep place in file when toggling</b></dt><dd>
<p>
When changing the view mode via the '<i>toggle view</i>' links, the reader gets
the same part of the document presented after the view change as he saw
before.
</p></dd>
<dt><b>Cut the TOC</b></dt><dd>
<p>
You may cut the table of contents to a certain depth. The splitting of the
document is not affected by this option. Hence you might set the level of
headlines to 4, but cut the TOC to show only the first two levels.
</p></dd>
<dt><b>Optional subindexes</b></dt><dd>
<p>
The script optionally creates subindexes under the headline of a section
containing subsections not exceeding <code>org-export-headline-levels</code>. This
was done to get a more texinfo/linuxdoc kind of feel and a better
orientaton.
</p></dd>
<dt><b>Startupview customizable</b></dt><dd>
<p>
Choose how to display the document on load. Info-like or plain and more.
</p></dd>
<dt><b>Toggle links everywhere / only on top</b></dt><dd>
<p>
You may choose to display the '<i>toggle view</i>' links above every headline
or just next the current sections headline.
</p></dd>
<dt><b>Numbered pages</b></dt><dd>
<p>
In info view mode every page gets a page number starting from one.
</p></dd>
<dt><b>Markright alike headings</b></dt><dd>
<p>
Info view mode only. Similar to the <code>\markright</code> command in LaTeX
the Title of the current sections parent appears on top of each page. In
subsections this heading can be use as link up to start of the parent
section (see top of this page when you're in info view mode). You can move
to the parent section by pressing `u´ (up).
</p></dd>
<dt><b>Tooltips</b></dt><dd>
<p>
Moving the mouse on the navigation links shows a tooltip with name of
next/previous section.
</p></dd>
<dt><b>Hide TOC</b></dt><dd>
<p>
The TOC can be hidden completly. Hitting '<code>i</code>' still will show it. When
showing the TOC hitting '<code>i</code>' any navigation command ('<code>n</code>', '<code>p</code>',
'<code>s</code>'…) will trigger an history-back. Thus the TOC will not get in your
way when navigating the history later on.
</p>
</dd>
</dl>
</div>
</div>
<div id="outline-container-2.2" class="outline-3">
<h3 id="sec-2.2"><span class="section-number-3">2.2</span> Keyboard navigation </h3>
<div class="outline-text-3" id="text-2.2">
<dl>
<dt><b>Easy keyboard navigation</b></dt><dd>
<p>
See Section <a href="#shortcuts">Shortcuts</a> for a list of shortcuts.
</p></dd>
<dt>Navigation history</dt><dd>
<p>
Navigating a file through the keyboard shortcuts is recorded in an internal
history. You may go back and forth in this history. Once an end is reached,
org-info.js tries to go back/forth in the browsers history. If you move
back to a previous visited file that uses the script, you will return to
the place you left the file. Thus following links in published files feels
like following footnotes.
</p></dd>
<dt><b>Customizable features</b></dt><dd>
<p>
All features are customizable simply by setting up your export options
template (see <a href="#setup">Setup</a>).
</p></dd>
<dt><b>Folding</b></dt><dd>
<p>
Emulates the way of folding in emacs Org-mode. Mouse supported.
</p>
</dd>
</dl>
</div>
</div>
<div id="outline-container-2.3" class="outline-3">
<h3 id="sec-2.3"><span class="section-number-3">2.3</span> Searching </h3>
<div class="outline-text-3" id="text-2.3">
<dl>
<dt><b>Full text-search with highlighting</b></dt><dd>
<p>
Search forward, backwards, repeated search… This is still experimental.
</p></dd>
<dt><b>Occur mode</b></dt><dd>
<p>
As experimental as the text-search, but I love this one. You may link to a
file using this script like this: <code>index.html?OCCUR=java</code>
</p></dd>
<dt><b>Tags index</b></dt><dd>
<p>
'<code>C</code>' shows a table of contents based on tags. Inherited tags are not
supported yet. This was an <a href="http://lists.gnu.org/archive/html/emacs-orgmode/2008-07/msg00434.html">idea of Rick Moynihan</a>.
</p>
</dd>
</dl>
</div>
</div>
<div id="outline-container-2.4" class="outline-3">
<h3 id="sec-2.4"><span class="section-number-3">2.4</span> Miscelaneous </h3>
<div class="outline-text-3" id="text-2.4">
<dl>
<dt><b>Inter-linking</b></dt><dd>
<p>
The exported pages can be linked to the homepage and an directory index or
some other sort of parent file.
</p></dd>
<dt><b>Adjusted internal links</b></dt><dd>
<p>
Internal links to section headings are automatically adjusted to work with
this script. When following such internal links, one may go back again
using '<code>b</code>'.
</p></dd>
<dt><b>Detect the target in the URL</b></dt><dd>
<p>
If the URL is suffixed by '<code>#sec-x.y.z</code>' that section will be displayed
after startup.
</p></dd>
<dt><b>Structure is taken from export preferences</b></dt><dd>
<p>
The paging is done according to your setting of
<code>org-export-headline-levels</code>. Scanning the TOC is a good way to get
around browser detection. An option to hide the TOC exists.
</p></dd>
<dt><b>Startup information</b></dt><dd>
<p>
Show a little message on page load to tell the visitor about the script
usage.
</p></dd>
<dt><b>Wrap text before first headline</b></dt><dd>
This is a temporary fix for the missing
<code><p></code> element around the text before the first headline, available since
version 0.0.7.3a (fixed in current Org-mode versions). If you export with
<code>skip:nil</code>, you may add this to your stylesheet:
<pre class="example">
#text-before-first-headline {color:red;font-weight:bold;}
</pre>
</dd>
</dl>
</div>
</div>
</div>
<div id="outline-container-shortcuts" class="outline-2">
<h2 id="shortcuts"><a name="sec-3" id="sec-3"></a><span class="section-number-2">3</span> Shortcuts </h2>
<div class="outline-text-2" id="text-shortcuts">
<p>
The visitor of this file (and every XHTML-exported org file that includes the
script) may use the mouse or the following keys to navigate. '<code>?</code>' should give
you a list of shortcuts.
</p>
<p>
The script always tries to keep the last selected section visible. This is
somewhat strange when scrolling, but really helpfull for keyboard navigation.
</p>
<p>
The TOC is handled specially, when hidden. If you press '<code>i</code>', the TOC is
displayed. Any subsequent key press goes back to where you've been before. The
TOC does not show up the history. Same applies to the keyboard help.
</p>
<table border="0" cellspacing="0" cellpadding="6" rules="groups" frame="hsides">
<caption></caption>
<colgroup><col align="left" /><col align="left" /></colgroup>
<thead>
<tr><th scope="col">Key</th><th scope="col">Function</th></tr>
</thead>
<tbody>
<tr><td>? / ¿</td><td>show this help screen</td></tr>
</tbody>
<tbody>
<tr><td></td><td><b>Moving around</b></td></tr>
<tr><td>n / p</td><td>goto the next / previous section</td></tr>
<tr><td>N / P</td><td>goto the next / previous sibling</td></tr>
<tr><td>t / E</td><td>goto the first / last section</td></tr>
<tr><td>g</td><td>goto section…</td></tr>
<tr><td>u</td><td>go one level up (parent section)</td></tr>
<tr><td>i / C</td><td>show table of contents / tags index</td></tr>
<tr><td>b / B</td><td>go back to last / forward to next visited section.</td></tr>
<tr><td>h / H</td><td>go to main index in this directory / link HOME page</td></tr>
</tbody>
<tbody>
<tr><td></td><td><b>View</b></td></tr>
<tr><td>m / x</td><td>toggle the view mode between info and plain / slides</td></tr>
<tr><td>f / F</td><td>fold current section / whole document (plain view only)</td></tr>
</tbody>
<tbody>
<tr><td></td><td><b>Searching</b></td></tr>
<tr><td>s / r</td><td>search forward / backward….</td></tr>
<tr><td>S / R</td><td>search again forward / backward</td></tr>
<tr><td>o</td><td>occur-mode</td></tr>
<tr><td>c</td><td>clear search-highlight</td></tr>
</tbody>
<tbody>
<tr><td></td><td><b>Misc</b></td></tr>
<tr><td>l / L / U</td><td>display HTML link / Org link / Plain-URL</td></tr>
<tr><td>v / V</td><td>scroll down / up</td></tr>
</tbody>
</table>
<p>
Thanks Carsten, for this beautifull table!
</p>
</div>
</div>
<div id="outline-container-setup" class="outline-2">
<h2 id="setup"><a name="sec-4" id="sec-4"></a><span class="section-number-2">4</span> Setup </h2>
<div class="outline-text-2" id="text-setup">
<p>
This section describes how to setup your org files to use the
script. <a href="#the-new-way">Export-Setup - the new Way</a> covers setting up org XHTML
export with Org-mode version >= 6.02. For those using an older
Org-mode version < 6.02 the next section (<a href="#sec-4.2">Export-Setup - the old Way</a>)
remains. <a href="#using-set">Using Set()</a> contains a list of all supported options for adjusting
the <code>org_html_manager</code> to suit your needs.
</p>
<p>
See the <a href="#sec-1.1">Download</a> section on how to obtain a version of the script.
</p>
<p>
The first version of this document was created with the new XHTML exporter
which was revised by Carsten Dominik in March 2008 (in Org-mode v5.23a+) to
better support <code>XML</code>. You can use <code>M-x org-version</code> to see which version of
Org-mode you have installed.
</p>
</div>
<div id="outline-container-the-new-way" class="outline-3">
<h3 id="the-new-way"><a name="sec-4.1" id="sec-4.1"></a><span class="section-number-3">4.1</span> Export-Setup - the new Way </h3>
<div class="outline-text-3" id="text-the-new-way">
<p>
The modern way of org export setup provides extra options to include and
configure the script, as well as an emacs customize interface for this very
purpose. Options set in customize may be overwritten on a per-file basis
using one or more special <code>#+INFOJS_OPT:</code> lines in the head of your org file.
</p>
<p>
As an example, the head of this org file looks like:
</p>
<pre class="src src-org">
<span class="org-meta-line">#+INFOJS_OPT: path:org-info.js</span>
<span class="org-meta-line">#+INFOJS_OPT: toc:nil localtoc:t view:info mouse:underline buttons:nil</span>
<span class="org-meta-line">#+INFOJS_OPT: up:http://orgmode.org/worg/</span>
<span class="org-meta-line">#+INFOJS_OPT: home:http://orgmode.org</span>
</pre>
</div>
<div id="outline-container-4.1.1" class="outline-4">
<h4 id="sec-4.1.1"><span class="section-number-4">4.1.1</span> Using customize </h4>
<div class="outline-text-4" id="text-4.1.1">
<p>
To use customize type
</p><pre class="example">
M-x customize-group RET org-export-html RET
</pre>
<p>scroll to the bottom and click <code>Org Export HTML INFOJS</code>.
</p>
<p>
On this page three main options may be configured. <i>Org Export Html Use Infojs</i> is very good documented and <i>Org Infojs Template</i> should be
perfect by default. So I'll concentrate on <i>Org Infojs Options</i> here.
</p>
<dl>
<dt><code>path</code></dt><dd>
<p>
Absolute or relative URL to the script as used in in XHTML
links. '<code>org-info.js</code>' will find the file in the current
directory. Keep in mind that this will be the directory of the
exported file, eventually a directory on a server.
</p>
</dd>
<dt><code>view</code></dt><dd>
<p>
What kind of view mode should the script enter on startup? Possible
values are
</p><ul>
<li>
<code>info</code> — info view mode,
</li>
<li>
<code>overview</code> — plain view mode, only first level headlines visible,
</li>
<li>
<code>content</code> — plain view mode, all headlines visible,
</li>
<li>
<code>showall</code> — plain view mode showing the entire document.
</li>
</ul>
</dd>
<dt><code>toc</code></dt><dd>
<p>
Show the table of contents? <br/>
Possible values:
</p><ul>
<li>
<code>t</code> — show the toc,
</li>
<li>
<code>nil</code> — hide the toc (only show when '<code>i</code>' is pressed),
</li>
<li>
<code>Publishing/Export property</code> — derivate this setting from another
property like <code>org-export-with-toc</code>.
</li>
</ul>
</dd>
<dt><code>localtoc</code></dt><dd>
<p>
Should the script insert a local table of contents below the headings
of sections containing subsections? The default is no.<br/>
Possible values:
</p><ul>
<li>
<code>t</code> — show the local toc below the first text in a section,
</li>
<li>
<code>nil</code> — hide the toc (only show when '<code>i</code>' is pressed). This is
the default, if this option is omitted.
</li>
<li>
<code>above</code> — sho the toc directly under the sections heading.
</li>
</ul>
</dd>
<dt><code>mouse</code></dt><dd>
<p>
Highlight the headline under the mouse in plain view mode?
</p><ul>
<li>
<code>underline</code> — underline the headline under mouse,
</li>
<li>
<code>#dddddd</code> — or any valid XHTML/CSS color value like <code>red</code> to draw a
colored background for the headline under the mouse.
</li>
</ul>
</dd>
<dt><code>runs</code></dt><dd>
<p>
<b>Obsolete</b>.
Number of attempts to scan the document. It's no risk to set this to a
higher value than the default. The <code>org_html_manager</code> will stop as
soon as the entire document is scanned.
</p>
</dd>
<dt><code>buttons</code></dt><dd>
<p>
Affects plain view mode only. If '<code>t</code>', display the little
<i>Up|HOME|HELP|Toggle view</i> links next to <span style="text-decoration:underline;">each</span> headline in plain view
mode.
</p>
</dd>
</dl>
</div>
</div>
<div id="outline-container-4.1.2" class="outline-4">
<h4 id="sec-4.1.2"><span class="section-number-4">4.1.2</span> Per File Basis: #+INFOJS_OPT </h4>
<div class="outline-text-4" id="text-4.1.2">
<p>
A single file may overwrite the global options using a line like this:
</p>
<pre class="src src-org">
<span class="org-meta-line">#+INFOJS_OPT: view:info mouse:underline up:index.html home:http://www.mydomain.tpl toc:t</span>
</pre>
<p>
Possible options are the same as in the previous section. Additional (?)
options include:
</p>
<dl>
<dt><code>home</code></dt><dd>
<p>
An URL to link to the homepage. The text displayed is <code>HOME</code>.
</p></dd>
<dt><code>up</code></dt><dd>
<p>
An URL pointing to some main page. The text displayed is <code>Up</code>.
</p>
</dd>
</dl>
</div>
</div>
</div>
<div id="outline-container-the-old-way" class="outline-3">
<h3 id="the-old-way"><a name="sec-4.2" id="sec-4.2"></a><span class="section-number-3">4.2</span> Export-Setup - the old Way </h3>
<div class="outline-text-3" id="text-the-old-way">
<p>
This section describes the old way to setup the script using the
<code>org-export-html-style</code> configuration. If you own a current version (6.00
++) of Org-mode you should better use <a href="#the-new-way">Export-Setup - the new Way</a> of setting
up the export for script usage. You might want to read the sections <a href="#xhtml">The XHTML</a>
for more information. <a href="#using-set">Using Set()</a> contains a list of all supported options
recognised by the script.
</p>
</div>
<div id="outline-container-4.2.1" class="outline-4">
<h4 id="sec-4.2.1"><span class="section-number-4">4.2.1</span> Using a special * COMMENT Section </h4>
<div class="outline-text-4" id="text-4.2.1">
<p>
The second possibility to include the script is to add a special section
to the end of your org file (multiple lines possible):
</p>
<pre class="src src-org">
<span class="org-level-1">* </span><span class="org-special-keyword">COMMENT</span><span class="org-level-1"> html style specifications</span>
<span class="comment"># Local Variables:</span>
<span class="comment"># org-export-html-style: "<link rel=\"stylesheet\"</span>
<span class="comment"># type=\"text/css\" href=\"styles.css\" /></span>
<span class="comment"># <script type=\"text/javascript\" src=\"org-info.js\"></span>
<span class="comment"># </script></span>
<span class="comment"># <script type=\"text/javascript\"></span>
<span class="comment"># * <![CDATA[ *</span>
<span class="comment"># org_html_manager.set(\"LOCAL_TOC\", 1);</span>
<span class="comment"># org_html_manager.set(\"VIEW_BUTTONS\", \"true\");</span>
<span class="comment"># org_html_manager.set(\"MOUSE_HINT\", \"underline\");</span>
<span class="comment"># org_html_manager.setup ();</span>
<span class="comment"># * ]]> *</span>
<span class="comment"># </script>"</span>
<span class="comment"># End:</span>
</pre>
<p>
Ensure to precede all the verbatim double quotes with a backslash and
include the whole value of <code>org-export-html-style</code> into double quotes
itself.
</p>
</div>
</div>
<div id="outline-container-4.2.2" class="outline-4">
<h4 id="sec-4.2.2"><span class="section-number-4">4.2.2</span> Using customize </h4>
<div class="outline-text-4" id="text-4.2.2">
<p>
One could customize the option '<code>org-export-html-style</code>' globaly by
:M-x cuomize-variable RET org-export-html-style RET
and set it there.
</p>
<pre class="src src-html">
<<span class="function-name">script</span> <span class="variable-name">type</span>=<span class="string">"text/javascript"</span> <span class="variable-name">src</span>=<span class="string">"org-info.js"</span>></<span class="function-name">script</span>>
<<span class="function-name">script</span> <span class="variable-name">type</span>=<span class="string">"text/javascript"</span>>
/* <![CDATA[ */
org_html_manager.set(<span class="string">"LOCAL_TOC"</span>, 1);
org_html_manager.set(<span class="string">"VIEW_BUTTONS"</span>, <span class="string">"true"</span>);
org_html_manager.set(<span class="string">"MOUSE_HINT"</span>, <span class="string">"underline"</span>);
org_html_manager.setup ();
/* ]]> */
</<span class="function-name">script</span>>
</pre>
<p>
This way all your files will be exported using the script in the
future. If you publish entire directories, supply an absolute URI to the
<code>src</code> attribute of the first script tag above.
</p>
</div>
</div>
<div id="outline-container-4.2.3" class="outline-4">
<h4 id="sec-4.2.3"><span class="section-number-4">4.2.3</span> Export-Setup per Project </h4>
<div class="outline-text-4" id="text-4.2.3">
<p>
Last but not least and very handy is the possibility to setup the usage of
the script per project. This is a taylor made passage of the org manual:
</p>
<pre class="src src-emacs-lisp">
(setq org-publish-project-alist
’((<span class="string">"org"</span>
<span class="builtin">:base-directory</span> <span class="string">"~/org/"</span>
<span class="builtin">:publishing-directory</span> <span class="string">"~/public_html"</span>
<span class="builtin">:section-numbers</span> nil
<span class="builtin">:table-of-contents</span> nil
<span class="builtin">:style</span> <span class="string">"<link rel=stylesheet href=\"../other/mystyle.css\"
type=\"text/css\">
<script type=\"text/javascript\" src=\"org-info.js\"></script>
<script type=\"text/javascript\">
/* <![CDATA[ */
org_html_manager.setup ();
/* ]]> */
</script>"</span>)))
</pre>
<p>
Don't forget to add an export target for the script itself ;-)
</p>
</div>
</div>
</div>
</div>
<div id="outline-container-5" class="outline-2">
<h2 id="sec-5"><span class="section-number-2">5</span> <span class="target">Linking to Files using the Script</span> </h2>
<div class="outline-text-2" id="text-5">
<p>
Just use the ordinary link syntax to link to files that use the script. Append
the section to the URL if neccessary:
</p>
<pre class="example">
http://www.domain.tld/path/to/org.html#sec-3.4
</pre>
<p>
One may overwrite the author's settings using special suffixes appended to the
URL of the script. Here are some examples linking to this section and changing
the intial view mode. Currently only the '<i>internal</i>' options are used (see
<a href="#using-set">Using set()</a> for a list).
</p>
<ul>
<li>
<a href="index.html?TOC=1&VIEW=info#sec-5"><code>index.html?TOC=1&VIEW=info#sec-5</code></a>
</li>
<li>
<a href="index.html?TOC=0&VIEW=overview#sec-5"><code>index.html?TOC=0&VIEW=overview#sec-5</code></a>
</li>
<li>
<a href="index.html?VIEW=content&TOC_DEPTH=1#sec-5"><code>index.html?VIEW=content&TOC_DEPTH=1#sec-5</code></a>
</li>
<li>
<a href="index.html?VIEW=showall&MOUSE_HINT=rgb(255,133,0)#sec-5"><code>index.html?VIEW=showall&MOUSE_HINT=rgb(255,133,0)#sec-5</code></a>
</li>
<li>
<a href="index.html?OCCUR=java"><code><b>index.html?OCCUR=java</b></code></a>
</li>
</ul>
<p>
<b>Note</b> that it is not possible to change the '<i>HOME</i>' and '<i>Up</i>' links.
</p>
<p>
<b>Note</b> also that everything but <code>[0-9a-zA-Z\.-_]</code> should be URL encoded if used
as an options value.
</p>
</div>
</div>
<div id="outline-container-6" class="outline-2">
<h2 id="sec-6"><span class="section-number-2">6</span> <span class="target">CSS</span> </h2>
<div class="outline-text-2" id="text-6">
<p>
Here is an excerpt from the stylesheet for this file. Be carful not to mess
things up when trying to position the console.
</p>
<pre class="src src-css">
<span class="comment-delimiter">/* </span><span class="comment">Styles for org-info.js </span><span class="comment-delimiter">*/</span>
<span class="css-selector">.org-info-js_info-navigation</span>
{
<span class="css-property">border-style</span>:none;
}
<span class="css-selector">#org-info-js_console</span>
{
<span class="css-property">color</span>:#333333;
<span class="css-property">margin</span>:0px;
<span class="css-property">background-color</span>:#ffffff;
}
<span class="css-selector">#org-info-js_console-input</span>
{
<span class="css-property">background-color</span>:#ffffff;
<span class="css-property">border-style</span>:none;
<span class="css-property">color</span>:#333333;
<span class="css-property">padding-left</span>:10px;
<span class="css-property">vertical-align</span>:middle;
}
<span class="css-selector">#org-info-js_console-label</span>
{
<span class="css-property">font-size</span>:11px;
<span class="css-property">font-weight</span>:bold;
<span class="css-property">padding-left</span>:10px;
<span class="css-property">font-family</span>:Verdana,Arial,sans-serif;
<span class="css-property">vertical-align</span>:middle;
}
<span class="css-selector">.org-info-js_console-label-warning</span>
{
<span class="css-property">color</span>:#cc0000;
}
<span class="css-selector">#org-info-js_console-container</span>
{
<span class="css-property">border</span>:1px solid #cccccc;
}
<span class="css-selector">.org-info-js_search-highlight</span>
{
<span class="css-property">background-color</span>:#adefef; <span class="comment-delimiter">/* </span><span class="comment">emacs default </span><span class="comment-delimiter">*/</span>
<span class="css-property">color</span>:#000000;
<span class="css-property">font-weight</span>:bold;
}
<span class="comment-delimiter">/* </span><span class="comment">END STYLES FOR org-info.js </span><span class="comment-delimiter">*/</span>
</pre>
</div>
</div>
<div id="outline-container-7" class="outline-2">
<h2 id="sec-7"><span class="section-number-2">7</span> <span class="target">Supported Browsers</span> </h2>
<div class="outline-text-2" id="text-7">
<p>
The functionality of the script is based on <code>DOM</code>. This leads to some
incompatibility with legacy browsers. But hey, it's 2009, isn't it?
</p>
<p>
So what browsers are supported then? Well - I don't know for
sure. JavaScript™ 1.4 plus <code>DOM</code> should make
</p><ul>
<li>
Netscape 6.0 and higher
</li>
<li>
Internet Explorer 5.0 and up
</li>
<li>
Firefox 1.0 ++ - 2.0.0.12 and 3.0 Beta tested
</li>
<li>
Opera 7.0 and higher - v.9.26 tested.
</li>
<li>
Safari 1.0
</li>
</ul>
<p>I try to test the script before each release in Firefox 3.x.x and Opera 10 on
Linux, and in FF 3, IE 6 and Safari on windows. Because of the number of
features and browsers, some bugs might remain undiscovered. Please report bugs
to the emacs-orgmode mailing list. In most cases we manage to fix them within
the next 24 hours.
</p>
</div>
<div id="outline-container-7.1" class="outline-3">
<h3 id="sec-7.1"><span class="section-number-3">7.1</span> <span class="target">People reported it works in</span> </h3>
<div class="outline-text-3" id="text-7.1">
<p>
So let's gather the tested Browsers here. Problems are only listed, if they
are Browser specific. Let me say it again: we don't wont to support legacy
browsers, do we?
</p>
<table border="0" cellspacing="0" cellpadding="6" rules="groups" frame="hsides">
<caption></caption>
<colgroup><col align="left" /><col align="right" /></colgroup>
<thead>
<tr><th scope="col">Browser</th><th scope="col">Version</th></tr>
</thead>
<tbody>
<tr><td>Opera</td><td>9.26+</td></tr>
<tr><td>Firefox/Iceweasel</td><td>2.0.0.12</td></tr>
<tr><td>Firefox/Iceweasel</td><td>3.0.2 Beta</td></tr>
<tr><td>IE</td><td>5.5</td></tr>
<tr><td>IE</td><td>6</td></tr>
</tbody>
</table>
<p>
If you manage to get this thingy working in any browser please let us know, so
we can update the above table.
</p>
</div>
</div>
</div>
<div id="outline-container-8" class="outline-2">
<h2 id="sec-8"><span class="section-number-2">8</span> <span class="target">Why Do I Need a T.O.C?</span> </h2>
<div class="outline-text-2" id="text-8">
<p>
Currently the script depends on the table of contents in the resulting
XHTML. The TOC can be hidden though.
</p>
<p>
The main reason is the behaviour of browsers. There is no safe way to detect
if the entire document is loaded at a certain point in time. Opera for example
returns <code>true</code> if we ask it <code>if(document.body)</code>. The <code>init()</code> function of the
<code>OrgHtmlManager</code> is aware of the possibility, that not even the TOC might
be loaded when this function is called. Hence it should work for slow
connections too.
</p>
</div>
</div>
<div id="outline-container-xhtml" class="outline-2">
<h2 id="xhtml"><a name="sec-9" id="sec-9"></a><span class="section-number-2">9</span> The XHTML </h2>
<div class="outline-text-2" id="text-xhtml">
<p>
End users may consider this section obsolete as of org version 6.00-pre-3,
since there is a new configuration interface in org now to setup the script
without dealing with JavaScript. It is still here to show the desired look
of the head section of the XHTML. Also someone might be interested to use the
script for XHTML files not exported from org.
</p>
<p>
The script has to be included in the header of the resulting XHTML files. The
document structure has to be exactly the one produced by the current XHTML
export of emacs Org-mode.
You may pass options to the <code>org_html_manager</code> by utilising its <code>set()</code>
method. For a list of options see section <a href="#using-set">Using Set()</a>. This is what the
head section should look like:
</p>
<pre class="src src-html">
<<span class="function-name">script</span> <span class="variable-name">type</span>=<span class="string">"text/javascript"</span> <span class="variable-name">src</span>=<span class="string">"org-info.js"</span>></<span class="function-name">script</span>>
<<span class="function-name">script</span> <span class="variable-name">type</span>=<span class="string">"text/javascript"</span>>
/* <![CDATA[ */
org_html_manager.set(<span class="string">"LOCAL_TOC"</span>, 1);
org_html_manager.set(<span class="string">"TOC"</span>, 1);
org_html_manager.set(<span class="string">"VIEW_BUTTONS"</span>, <span class="string">"1"</span>);
org_html_manager.set(<span class="string">"MOUSE_HINT"</span>, <span class="string">"underline"</span>); // or background-color like '#eeeeee'
org_html_manager.setup ();
/* ]]> */
</<span class="function-name">script</span>>
</pre>
<p>
To just use the script with the defaults put this into the head section of the
XHTML files:
</p>
<pre class="src src-html">
<<span class="function-name">script</span> <span class="variable-name">type</span>=<span class="string">"text/javascript"</span> <span class="variable-name">src</span>=<span class="string">"org-info.js"</span>></<span class="function-name">script</span>>
<<span class="function-name">script</span> <span class="variable-name">type</span>=<span class="string">"text/javascript"</span>>
/* <![CDATA[ */
org_html_manager.setup ();
/* ]]> */
</<span class="function-name">script</span>>
</pre>
<p>
I recommend the use of
</p>
<pre class="src src-html">
<<span class="function-name">script</span> <span class="variable-name">type</span>=<span class="string">"text/javascript"</span> <span class="variable-name">src</span>=<span class="string">"org-info.js"</span>></<span class="function-name">script</span>>
</pre>
<p>
instead of
</p>
<pre class="src src-html">
<<span class="function-name">script</span> <span class="variable-name">type</span>=<span class="string">"text/javascript"</span> <span class="variable-name">src</span>=<span class="string">"org-info.js"</span> />
</pre>
<p>
which is valid XHTML but not understood by all browsers. I'll use the first
version throughout this document where ever the space allows to do so.
</p>
</div>
<div id="outline-container-using-set" class="outline-3">
<h3 id="using-set"><a name="sec-9.1" id="sec-9.1"></a><span class="section-number-3">9.1</span> Using Set() </h3>
<div class="outline-text-3" id="text-using-set">
<p>
Before calling
</p><pre class="example">
org_html_manager.setup ();
</pre>
<p>one may configure the script by using the <code>org_html_manager</code>'s function
<code>set(key, val)</code>. There is one important rule for all of these options. If
you set a string value containing single quotes, do it this way:
</p><pre class="example">
org_html_manager.set("key", "value with \\'single quotes\\'");
</pre>
<dl>
<dt><code>VIEW</code></dt><dd>
Set to a true value to start in textinfo kind of view. Note: you
could also use <code>org_html_manager.INFO_VIEW</code>,
<code>org_html_manager.PRESENTATION_VIEW</code> or
<code>org_html_manager.PLAIN_VIEW</code>. Defaults to plain view mode.
</dd>
<dt><code>HIDE_TOC</code></dt><dd>
<p>
If <code>1</code>, hide the table of contents.
</p></dd>
<dt><code>SUB_INDEXES</code></dt><dd>
<p>
If set to a <code>true</code> (<code>1</code> or not empty string) value, create subindexes
for sections containing subsections. See sections 1 2, or 3.1 of this
document. The index below the headline (under 'Contents:') is generated
by the script. This one is off by default.
</p></dd>
<dt><code>VIEW_BUTTONS</code></dt><dd>
<p>
If <code>true</code>, include the small '<i>toggle view</i>' link above every headline in
plain view too. The visitor can toggle the view every where in the file
then. If <code>false</code>, only at the top of the file such a link is displayed
when in plain view. Default is <code>false</code>.
</p></dd>
<dt><code>MOUSE_HINT</code></dt><dd>
<p>
Highlight the heading under the mouse. This can be a background color
(like '<code>#ff0000</code>', '<code>red</code>' or '<code>rgb(230,230,230)</code>') or the keyword
'<code>underline</code>'.
</p></dd>
<dt><code>LINK_UP</code></dt><dd>
<p>
May be set, to link to an other file, preferably the main index page of a
subdirectory. You might consider using an absolute URL here. This link will be
displayed as
</p><pre class="example">
<a href="LINK_UP">Up</a>
</pre>
<p>This way we can link files into a tree, if all subdirectories in the
project follow the same conventions. The '<code>h</code>' shortcut will
bring you there as well.
</p></dd>
<dt><code>LINK_HOME</code></dt><dd>
<p>
May be set, to link to an other file, preferably the main home page. This
link will be displayed as
</p><pre class="example">
<a href="LINK_HOME">Up</a>
</pre>
<p>The '<code>H</code>' shortcut will trigger this action.
</p></dd>
<dt><code>TOC_DEPTH</code></dt><dd>
<p>
Cut the TOC at a certain level. This was done to support big big
files and was requested by Carsten Dominik. If '<code>0</code>' or not provided at
all the TOC will not be cut. If set to a number greater than '<code>0</code>',
the TOC will cut to only show headlines down to that very level.
</p></dd>
<dt><code>HELP</code></dt><dd>
<p>
Display a little message on page load? Defaults to no message. Set to <code>1</code>
to display the startup message.
</p>
</dd>
</dl>
</div>
</div>
</div>
<div id="outline-container-10" class="outline-2">
<h2 id="sec-10"><span class="section-number-2">10</span> How it works </h2>
<div class="outline-text-2" id="text-10">
<p>
First of all the script is included in the header as described in <a href="#setup">Setup</a>. The
document has to be exported with TOC since the script depends on it (See
<a href="#sec-8">Why Do I Need a T.O.C?</a>).
</p>
<p>
When included, it creates a global JavaScript™ variable named
<code>org_html_manager</code>.
</p>
<p>
The <code>org_html_manager::setup()</code> function, that you will have to call
yourself (see examples in <a href="#setup">Setup</a>), sets up a timeout function calling it's
<code>init()</code> function after 50ms. After those 50 ms The <code>init()</code> function starts
it's first attempt to scan the document, using the TOC as a guide. During
this scan the <code>org_html_manager</code> builds a tree of nodes, each caching some
data for later use. Once an element of the document is scanned it is marked by
setting a property <code>scanned_for_org</code> to <code>1</code>. This way it will not be scanned
a second time in subsquent runs (it will be checked though, but no work will
be done for it).
</p>
<p>
If the document (or the TOC) is not entirely loaded, <code>org_html_manager</code>
stops scanning, sets the timeout again to start an other scan 50 ms
later. Once the entire document is loaded and scanned no new timeout will be
set, and the document is displayed in the desired way (hopefully).
</p>
<p>
Once the number of attempts to scan the the document was configurable. This
was dropped, since we can not know in advance how fast the document will be
loaded on the client side.
</p>
<p>
The <code>org_html_manager</code> also changes the document a bit to make it react on
certain input events and follow your wishes. The old '<i>event handling</i>' was
entirely based on the normal link functions using so called <code>accesskeys</code>. This
has changed long ago, but the accesskeys will stay cause there is no reason to
remove them.
</p>
</div>
</div>
<div id="outline-container-11" class="outline-2">
<h2 id="sec-11"><span class="section-number-2">11</span> Presentations with org-info.js </h2>
<div class="outline-text-2" id="text-11">
<p>
The script can handle all the sections as single slides. Press '<code>x</code>' to switch
to the presentation mode. In this mode you may navigate the sections using the
mouse. Currently a single click moves forward and a doubleclick backwards
(will change this to right mouse button for backwards movement).
</p>
<p>
The first plain list (i.e. an <ul> element) in a section is special. The items
will be shown one by one when moving forward.
</p>
<p>
If you're at the end of the presentation, a click does not trigger a
warning. Same applies to a doubleclick when in the first section.
</p>
<p>
There is no plan to extend this feature very much. A better plan might be to
write a separate tool to handle slides.
</p>
</div>
</div>
<div id="outline-container-12" class="outline-2">
<h2 id="sec-12"><span class="section-number-2">12</span> History </h2>
<div class="outline-text-2" id="text-12">
<p>
The aim of this little script was to implement a part of emacs Org-mode
facilities of folding. Oh, no - not originaly.
</p>
<p>
My first idea was to view some of my larger org files without scrolling. I
wanted to have them paged just like texinfo or linuxdoc files. In February
2008 I came across Carsten Dominiks <i>ideas</i> page
<a href="http://orgmode.org/todo.html">http://orgmode.org/todo.html</a>. And I could not resist to write him some of my
thoughts about this great emacs mode including some little ideas and
drawbacks. I don't know how, but it somehow these guys made me, lazy bone that
I am, write this little script as an apetizer of <i>web 3.0 in Org-mode</i> (Phil
Jackson).
</p>
<p>
I did and since some people really liked it, worked a bit more on it and added
features. Bastien Guerry was so kind to publish it on
<a href="http://www.legito.net/org-info-js/">http://www.legito.net/org-info-js/</a> the first months. Thanks Bastien.
</p>
<p>
In the first days of April Carsten Dominik added code to Org-mode to support
the usage of this script. Hence the script may now be configured in a similar way
to the other export options. Since then it is even possible to configure this
script through customize.
</p>
</div>
</div>
<div id="outline-container-13" class="outline-2">
<h2 id="sec-13"><span class="section-number-2">13</span> Thanks </h2>
<div class="outline-text-2" id="text-13">
<p>
Very special thanks to Carsten Dominik, Bastien Guerry and Phil Jackson who
have encouraged me to write and publish this little piece of (unfinished) work
and all the hundrets of hours they spent on this fantastic emacs mode called
Org-mode and the export modules.
</p>
<p>
Org is a new working experience for me and there is nothing comparable to
working with emacs AND Org-mode.
</p>
<p>
An other big kiss to Gabi (<a href="http://www.emma-stil.de">www.emma-stil.de</a>) for being so patient while I was
not working on our projects but playing with emacs.
</p>
<p>
Thanks to Tobias Prinz for listening to my stupid JavaScript questions and all
the usefull tips. Espacially the negative margin trick and key input.
</p>
<p>
And again big thanks to Carsten Dominik for making the inclusion and
configuration of the script so easy for the users, all the inspired ideas and
the great org radio table trick. A lot of the power of the final make up is
your merit! We all love to read the Org-mode mailing lists because of the
kind and relaxed tone that is yours.
</p>
<p>
Thanks a lot for OrgMode!
</p>
</div>
</div>
<div id="outline-container-14" class="outline-2">
<h2 id="sec-14"><span class="section-number-2">14</span> License </h2>
<div class="outline-text-2" id="text-14">
<p>
What I think about licenses? Well - I think licences and patents are not far
from each other. Poor people (and poor countries!!!) stay poor because of both
of them. But since I know where I live, in a world made of licenses and
patents, I have to apply some license to my work to protect it and stay
unprotected.
</p>
<p>
Hence the script was originally licensed under GPL 2. Since v.0.1.1.6 the
license was changed to <a href="http://www.gnu.org/licenses/old-licenses/gpl-2.0.html">GPL version 3</a>. This document is subject to <a href="http://www.fsf.org/licensing/licenses/fdl.txt">GFDL</a>.
</p>
</div>
</div>
<div id="outline-container-15" class="outline-2">
<h2 id="sec-15"><span class="section-number-2">15</span> THE END </h2>
<div class="outline-text-2" id="text-15">
<p>
The original version of this document was written in emacs23 with Org-mode
v. 5.22a+. The visibilty of the contents of a individual section or
subsection can be toggled by clicking the stars in front of the headlines or
moving there and hitting <code>TAB</code>. The visibility of the entire document structure
can be changed by pressing <code>SHIFT+TAB</code> anywhere. When on a headline, pressing
<code>ALT+UP/DOWN</code> moves the entire subtree to different location in the tree,
keeping it's level of indentation. <code>ALT+LEFT/RIGHT</code> promotes and demotes the
subtree.
</p>
<div class="figure">
<p><img src="img/emacs23-org.js.org.png" alt="img/emacs23-org.js.org.png" /></p>
</div>
</div>
</div>
<div id="postamble">
<p class="author"> Author: Sebastian Rose
<a href="mailto:sebastian_rose@gmx.de"><sebastian_rose@gmx.de></a>
</p>
<p class="date"> Date: 2009-06-22 05:13:57 CEST</p>
<p class="creator">HTML generated by org-mode 6.27trans in emacs 23</p>
</div>
</div>
</body>
</html>
