Lenya and OpenOffice

Christian Egli <[email protected]> 19 Mar 2003 18:41:09 +0100
Newsgroups gmane.comp.cms.wyona.devel,gmane.comp.cms.wyona.user
Message-ID <[email protected]>
--=-=-=


Hi all

As you might know we were at the OSCOM sprint in Zuerich last
week. Felix and I worked on the integration of OpenOffice and
Lenya. This has been made possible due to the fact that OpenOffice
uses XML as its native file format. IMHO we were quite successful.
After two days we were able to:

* drop an OpenOffice document in a webfolder on the desktop

* from where it was handed to the web server via WebDAV and served
  back via Lenya and Tomcat.

* and have it show up in a web browser including the layout of the
  original document (headings, fonts, etc), tables, etc. all nicely
  aggregated with the navigation, header and footer of the existing
  site.

This setup is extremely flexible. We have used a standard XSLT which
transforms the OpenOffice content into fairly plain html. Of course
any other transformation could be applied to suit your particular needs

This can be used if you like to edit your content on the desktop with
a familiar desktop application (e.g. for an intranet) or also for
migration purposes if you have lots of word documents that need to be
published.

This setup could perceivably also be used for Microsoft Office 11
(which also uses XML as a document format). We'll have to see about
that when we see the XML that is produced by it.

Attached is a description on how to reproduce this.

If there is enough interest I will integrate it into Lenya.


--=-=-=
Content-Type: text/html
Content-Disposition: attachment; filename=openoffice.html
Content-Description: OpenOffice and Lenya

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<META http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>OpenOffice Documents with Lenya</title>
<link type="text/css" href="skin/page.css" rel="stylesheet">
</head>
<body text="#000000" bgcolor="#FFFFFF">
<!--================= start Navigation Path ==================-->
<table summary="navigation path" width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td nowrap="nowrap" valign="middle" bgcolor="#CFDCED" height="20"><img height="1" width="5" alt="" border="0" src="skin/images/spacer.gif"><!--===== breadcrumb trail (javascript-generated) ====--><font size="2" face="Arial, Helvetica, Sans-serif"><script src="skin/breadcrumbs.js" language="JavaScript" type="text/javascript"></script></font></td>
</tr>
<tr>
<td bgcolor="#4C6C8F" height="2"><img height="2" width="2" alt="" border="0" src="skin/images/spacer.gif"></td>
</tr>
</table>
<!--================= end Navigation Path ==================-->
<!--================= start Banner ==================-->
<table summary="header with logos" width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<!--================= start Group Logo ==================-->
<td bgcolor="#294563"><a href="http://www.wyona.org/"><img border="0" class="logoImage" alt="Wyona.org" src="images/wyona_org.gif"></a></td>
<!--================= end Group Logo ==================-->
<!--================= start Project Logo ==================--><td width="100%" align="center" bgcolor="#294563"><a href="http://www.wyona.org/"><img border="0" class="logoImage" alt="Wyona.org" src="images/project-logo.gif"></a></td>
<!--================= end Project Logo ==================-->
<!--================= start Search ==================--><td valign="top" rowspan="2" bgcolor="#294563">
<form target="_blank" action="http://www.google.com/search" method="get">
<table summary="search" border="0" cellspacing="0" cellpadding="0" bgcolor="#4C6C8F">
<tr>
<td colspan="3"><img height="10" width="1" alt="" src="skin/images/spacer.gif"></td>
</tr>
<tr>
<td><img height="1" width="1" alt="" src="skin/images/spacer.gif"></td><td nowrap="nowrap"><input value="www.wyona.org" name="sitesearch" type="hidden"><input size="15" name="q" id="query" type="text"><img height="1" width="5" alt="" src="skin/images/spacer.gif"><input name="Search" value="Search" type="submit">
<br>
<font face="Arial, Helvetica, Sans-serif" size="2" color="white">
                      the Wyona.org site
                      
                      
                    </font></td><td><img height="1" width="1" alt="" src="skin/images/spacer.gif"></td>
</tr>
<tr>
<td><img alt="" border="0" height="10" width="9" src="skin/images/search-left.gif"></td><td><img height="1" width="1" alt="" src="skin/images/spacer.gif"></td><td><img alt="" border="0" height="10" width="9" src="skin/images/search-right.gif"></td>
</tr>
</table>
</form>
</td>
<!--================= start Search ==================--><td bgcolor="#294563"><img height="10" width="10" alt="" src="skin/images/spacer.gif"></td>
</tr>
<tr>
<td valign="bottom" bgcolor="#294563" colspan="2">
<!--================= start Tabs ==================-->
<div class="tab">
<table summary="tab bar" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="8"><img alt="" height="8" width="8" src="skin/images/spacer.gif"></td><td valign="bottom">
<table summary="selected tab" style="height: 1.7em" border="0" cellpadding="0" cellspacing="0">
<tr>
<td valign="top" width="5" bgcolor="#4C6C8F"><img height="5" width="5" alt="" src="skin/images/tabSel-left.gif"></td><td valign="middle" bgcolor="#4C6C8F"><font color="#ffffff" size="2" face="Arial, Helvetica, Sans-serif"><b><a href="index.html"><font color="#000000">Home</font></a></b></font></td><td valign="top" width="5" bgcolor="#4C6C8F"><img height="5" width="5" alt="" src="skin/images/tabSel-right.gif"></td>
</tr>
</table>
</td><td width="8"><img alt="" height="8" width="8" src="skin/images/spacer.gif"></td><td valign="bottom">
<table summary="non selected tab" style="height: 1.6em" border="0" cellpadding="0" cellspacing="0">
<tr>
<td valign="top" width="5" bgcolor="#B2C4E0"><img height="5" width="5" alt="" src="skin/images/tab-left.gif"></td><td valign="middle" bgcolor="#B2C4E0"><a href="nzz/index.html"><font face="Arial, Helvetica, Sans-serif">NZZ</font></a></td><td valign="top" width="5" bgcolor="#B2C4E0"><img height="5" width="5" alt="" src="skin/images/tab-right.gif"></td>
</tr>
</table>
</td>
</tr>
</table>
</div>
<!--================= end Tabs ==================-->
</td><td bgcolor="#294563"><img alt="" width="1" height="1" src="skin/images/spacer.gif"></td>
</tr>
<tr>
<td bgcolor="#4C6C8F" colspan="4"><img width="1" height="10" alt="" src="skin/images/spacer.gif"></td>
</tr>
</table>
<!--================= end Banner ==================-->
<!--================= start Menu, NavBar, Content ==================-->
<table summary="page content" bgcolor="#ffffff" width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td valign="top">
<table summary="menu" border="0" cellspacing="0" cellpadding="0">
<tr>
<!--================= start left top NavBar ==================-->
<td rowspan="3" valign="top">
<table summary="blue line" border="0" cellpadding="0" cellspacing="0">
<tr>
<td bgcolor="#294563"><img width="10" height="1" alt="" src="skin/images/spacer.gif"></td>
</tr>
<tr>
<td bgcolor="#CFDCED"><font color="#4C6C8F" size="4" face="Arial, Helvetica, Sans-serif">&nbsp;</font></td>
</tr>
<tr>
<td bgcolor="#294563"><img width="10" height="1" alt="" src="skin/images/spacer.gif"></td>
</tr>
</table>
</td>
<!--================= end left top NavBar ==================--><td bgcolor="#294563"><img width="1" height="1" alt="" src="skin/images/spacer.gif"></td><td valign="bottom" bgcolor="#4C6C8F"><img width="10" height="10" alt="" src="skin/images/spacer.gif"></td><td nowrap="nowrap" valign="top" bgcolor="#4C6C8F">
<!--================= start Menu items ==================-->
<div class="menu">
<ul>
<li>
<font color="#CFDCED">About</font>
<ul>
    
<li>
<a href="index.html">Index</a>
</li>
    
<li>
<a href="pageEnvelope.html">Page Envelope</a>
</li>
    
<li>
<a href="standardURI.html">Standard URI Scheme</a>
</li>
    
<li>
<span class="sel"><font color="#ffcc00">OpenOffice Integration</font></span>
</li>
    
<li>
<a href="changes.html">Changes</a>
</li>
    
<li>
<a href="todo.html">Todo</a>
</li>
  
</ul>
</li>
</ul>
</div>
<!--================= end Menu items ==================-->
</td><td valign="bottom" bgcolor="#4C6C8F"><img width="10" height="10" alt="" src="skin/images/spacer.gif"></td><td bgcolor="#294563"><img width="1" height="1" alt="" src="skin/images/spacer.gif"></td>
</tr>
<tr>
<td valign="bottom" align="left" colspan="2" rowspan="2" bgcolor="#4C6C8F"><img height="10" width="10" border="0" alt="" src="skin/images/menu-left.gif"></td><td bgcolor="#4C6C8F"><img height="10" width="10" border="0" alt="" src="skin/images/spacer.gif"></td><td valign="bottom" align="right" colspan="2" rowspan="2" bgcolor="#4C6C8F"><img height="10" width="10" border="0" alt="" src="skin/images/menu-right.gif"></td>
</tr>
<tr>
<td height="1" bgcolor="#294563"><img width="1" height="1" alt="" src="skin/images/spacer.gif"></td>
</tr>
</table>
</td><td valign="top" width="100%">
<table summary="content" width="100%" border="0" cellpadding="0" cellspacing="0">
<!--================= start middle NavBar ==================-->
<tr>
<td colspan="4" bgcolor="#294563"><img width="10" height="1" alt="" src="skin/images/spacer.gif"></td>
</tr>
<tr>
<td align="left" width="10" bgcolor="#CFDCED"><img width="10" height="1" alt="" src="skin/images/spacer.gif"></td><td align="left" width="50%" bgcolor="#CFDCED"><font color="#4C6C8F" size="3" face="Arial, Helvetica, Sans-serif">
                &nbsp;
                
                </font><img width="10" height="8" alt="" src="skin/images/spacer.gif"></td><td align="right" width="50%" bgcolor="#CFDCED"><font color="#4C6C8F" size="3" face="Arial, Helvetica, Sans-serif">
                &nbsp;
                
                </font><img width="10" height="8" alt="" src="skin/images/spacer.gif"></td><td width="10" bgcolor="#CFDCED"><img width="10" height="1" alt="" src="skin/images/spacer.gif"></td>
</tr>
<tr>
<td colspan="4" bgcolor="#294563"><img width="10" height="1" alt="" src="skin/images/spacer.gif"></td>
</tr>
<!--================= end middle NavBar ==================-->
<!--================= start Content==================-->
<tr>
<td align="left" width="10"><img width="10" height="1" alt="" src="skin/images/spacer.gif"></td><td align="left" width="100%">
<div class="content">
<table class="title" summary="">
<tr>
<td valign="middle">
<h1>OpenOffice Documents with Lenya</h1>
</td><td nowrap="nowrap" width="80" align="center"><a class="dida" href="openoffice.pdf"><img alt="printer" src="skin/images/printer.gif" border="0"><br>
          print-friendly<br>
          PDF</a></td>
</tr>
</table>
<p>
<font size="-2">by&nbsp;Christian Egli</font>
</p>
<ul class="minitoc">
<li>
<a href="#Goals">Goals</a>
</li>
<li>
<a href="#Prerequisites">Prerequisites</a>
<ul class="minitoc">
<li>
<a href="#OpenOffice+DTD">OpenOffice DTD</a>
</li>
<li>
<a href="#XML+Catalog">XML Catalog</a>
</li>
<li>
<a href="#OpenOffice2HTML+XSTL">OpenOffice2HTML XSTL</a>
</li>
<li>
<a href="#Slide">Slide</a>
</li>
</ul>
</li>
<li>
<a href="#Pipelines">Pipelines</a>
<ul class="minitoc">
<li>
<a href="#Read+the+zip%2Fjar+file">Read the zip/jar file</a>
</li>
<li>
<a href="#Unpack+zip+file+and+transform+the+OO+xml+to+xhtml">Unpack zip file and transform the OO xml to xhtml</a>
</li>
<li>
<a href="#Aggregate+with+navigation">Aggregate with navigation</a>
</li>
</ul>
</li>
<li>
<a href="#Problems">Problems</a>
</li>
<li>
<a href="#To+do%27s">To do's</a>
</li>
</ul> 

    
<a name="N101CF"></a><a name="Goals"></a>
<h3>Goals</h3>
<div style="margin-left: 0 ; border: 2px">
<p>This document describes the integration of Openoffice with Lenya
	CMS. The integration is guided by the following goals:</p>
<ul>
	
<li>Use OpenOffice as a content editor for static web
	pages</li>

	
<li>Migrate OpenOffice document to a custom xml format</li>
      
</ul>
</div>

    
<a name="N101E2"></a><a name="Prerequisites"></a>
<h3>Prerequisites</h3>
<div style="margin-left: 0 ; border: 2px">
<p>In order to seamlessly integrate Openoffice into the
publication process of Lenya/Cocoon the following prerequisites need
to be met:</p>
<a name="N101EB"></a><a name="OpenOffice+DTD"></a>
<h4>OpenOffice DTD</h4>
<div style="margin-left: 0 ; border: 2px">
<p>The DTDs for the OpenOffice documents has to be available
on the system.</p>
<p>It's best to get them directly from your OpenOffice
installation. They are located in the share directory of your
installation. Copy the dtd's into your Lenya installation, e.g. as
follows:</p>
<pre class="code">cp ~/Office/share/dtd/* ~/build/jakarta-tomcat-4.1.18-LE-jdk14/webapps/lenya/lenya/resources/dtd/openoffice/</pre>
<div class="frame fixme">
<div class="label">Fixme (
               ce

               )</div>
<div class="content">The DTDs should probably go into
	/usr/share/sgml/openoffice/*</div>
</div>
<div class="frame note">
<div class="label">Note</div>
<div class="content">There's a bug in the xml parser. As a workaround we uncomment
	  all the <span class="codefrag">draw:text-box</span> stuff.</div>
</div>
</div>
<a name="N10206"></a><a name="XML+Catalog"></a>
<h4>XML Catalog</h4>
<div style="margin-left: 0 ; border: 2px">
<p>In order for Lenya/Cocoon to find the DTDs you need to setup an XML
catalog as follows:</p>
<pre class="code">
xmlcatalog --noout --create openoffice.cat
xmlcatalog --noout --add "public" \
  "-//OpenOffice.org//DTD OfficeDocument 1.0//EN" 
  "file:///home/slide/build/jakarta-tomcat-4.1.18-LE-jdk14/webapps/lenya/lenya/resources/dtd/openoffice/officedocument/1_0/office.dtd" \
  openoffice.cat
	</pre>
<p>Alternatively you can simply use the attached catalog.</p>
<p>Store this newly created catalog and edit CatalogManager.properties to
make sure Cocoon finds this catalog and hence the OpenOffice DTDs.</p>
<p>Add the location of the OpenOffice catalog to Cocoon's
CatalogManager.properties (which can be found in
<span class="codefrag">~/build/jakarta-tomcat-4.1.18-LE-jdk14/webapps/lenya/WEB-INF/classes/CatalogManager.properties</span>)
by adding the following lines to this file:</p>
<pre class="code">
#catalogs=/path/to/local/catalog
catalogs=/home/slide/build/jakarta-tomcat-4.1.18-LE-jdk14/webapps/lenya/lenya/resources/dtd/openoffice/catalog.xml
	</pre>
</div>
<a name="N10224"></a><a name="OpenOffice2HTML+XSTL"></a>
<h4>OpenOffice2HTML XSTL</h4>
<div style="margin-left: 0 ; border: 2px">
<p>In order to render the OpenOffice xml as html we need XSLT stylesheets
to provide the necessary transformations.</p>
<p>A very good XSLT which is fairly complete can be fetched
	  from zope.org (<a href="http://www.zope.org/Members/philikon/ZooDocument">http://www.zope.org/Members/philikon/ZooDocument</a>).</p>
</div>
<a name="N10235"></a><a name="Slide"></a>
<h4>Slide</h4>
<div style="margin-left: 0 ; border: 2px">
<p>Slide is an Apache project which offers amongst other things a a
WebDAV access module (implemented as a servlet). This will allow us to
deploy the OpenOffice documents directly via WebDAV.</p>
<p>For a very basic installation the following changes need to be applied
to a file named Domain.xml in the Slide webapp directory:</p>
<ul>
	  
<li>Change permissions</li>
	  
<li>ContentStore: set to parent dir of OpenOffice dir</li>
	  
<li>Replace folder "files" by OpenOffice dir name</li>
	
</ul>
</div>
</div>

    
<a name="N1024F"></a><a name="Pipelines"></a>
<h3>Pipelines</h3>
<div style="margin-left: 0 ; border: 2px">
<p>In order for Lenya/Cocoon to be able to read the content of the
OpenOffice document, a set of pipelines need to be set up.</p>
<a name="N10258"></a><a name="Read+the+zip%2Fjar+file"></a>
<h4>Read the zip/jar file</h4>
<div style="margin-left: 0 ; border: 2px">
<p>To read the OpenOffice documents we need to setup a simple reader
	  which as follows:</p>
<pre class="code">
&lt;map:match pattern="**.sxw"&gt;
  &lt;map:read src="content/{1}.sxw"/&gt;
&lt;/map:match&gt;
	</pre>
</div>
<a name="N10266"></a><a name="Unpack+zip+file+and+transform+the+OO+xml+to+xhtml"></a>
<h4>Unpack zip file and transform the OO xml to xhtml</h4>
<div style="margin-left: 0 ; border: 2px">
<p>OpenOffice documents are actually a zip file containing xml files for
content and style plus other additional files such as jpg etc.</p>
<p>Zip is the same file format as jar. JDK supports jar unpacking
natively with the jar protocol. The pipeline to read a jar file looks
as follows:</p>
<pre class="code">
&lt;map:match pattern="**.oo"&gt;
  &lt;map:generate src="jar:http://localhost:38080/lenya/computerworld/authoring/{1}.sxw!/content.xml"/&gt;
  &lt;map:transform src="../../xslt/openoffice/ooo2html.xsl"/&gt;
  &lt;map:serialize/&gt;
&lt;/map:match&gt;
	</pre>
</div>
<a name="N10277"></a><a name="Aggregate+with+navigation"></a>
<h4>Aggregate with navigation</h4>
<div style="margin-left: 0 ; border: 2px">
<p>Additionaly we want to embed the OpenOffice document in the usual
navigation, header and footer. The following is fairly specific to the
Computerworld publication but can easily be adapted:</p>
<pre class="code">
&lt;map:match pattern="**.html"&gt;
  &lt;map:aggregate element="lenya"&gt;
    &lt;map:part src="cocoon:/menus/static/{1}.html"/&gt;
    &lt;map:part element="cmsbody" src="content/authoring/wrapper.html"/&gt;
    &lt;map:part src="cocoon:/{1}.oo" element="wrapper"/&gt;
    &lt;map:part src="content/authoring/small-preview.xml"/&gt;
    &lt;map:part src="content/authoring/sitetree.xml"/&gt;
    &lt;map:part src="cocoon:/today"/&gt;
  &lt;/map:aggregate&gt;

  &lt;map:transform src="xslt/authoring/wrapper.xsl"&gt;
    &lt;map:parameter name="id" value="/{1}"/&gt;
    &lt;map:parameter name="authoring" value="true"/&gt;
  &lt;/map:transform&gt;
  &lt;map:transform src="xslt/authoring/images.xsl"/&gt;
  &lt;map:serialize type="html"/&gt;
&lt;/map:match&gt;
	</pre>
</div>
</div>

    
<a name="N10286"></a><a name="Problems"></a>
<h3>Problems</h3>
<div style="margin-left: 0 ; border: 2px">
<ul>
	
<li>Caching prevents an update OO file (zip file) from being
	displayed.</li>

	
<li>If you restart tomcat (slide) you lose the NodeContentStore so that
  WebDAV loses the nodes (documents and folders).</li>

	
<li>xml parser cannot handle openoffice dtd's due to a parser bug</li>
      
</ul>
</div>

    
<a name="N10299"></a><a name="To+do%27s"></a>
<h3>To do's</h3>
<div style="margin-left: 0 ; border: 2px">
<ul>
	
<li>Set permissions in tomcat/slide: authorization and autorisation</li>
	
<li>Complete and improve OpenOffice2Html xslt (images, tables, etc.)</li>
	
<li> Add pipelines for other files in zip like images</li>
	
<li> Integration slide and lenya</li>
      
</ul>
</div>
    
  
</div>
</td><td width="10"><img width="10" height="1" alt="" src="skin/images/spacer.gif"></td>
</tr>
<!--================= end Content==================-->
</table>
</td>
</tr>
</table>
<!--================= end Menu, NavBar, Content ==================-->
<!--================= start Footer ==================-->
<table summary="footer" cellspacing="0" cellpadding="0" width="100%" border="0">
<tr>
<td colspan="2" height="1" bgcolor="#4C6C8F"><img height="1" width="1" alt="" src="skin/images/spacer.gif"><a href="skin/images/label.gif"></a><a href="skin/images/page.gif"></a><a href="skin/images/chapter.gif"></a><a href="skin/images/chapter_open.gif"></a><a href="skin/images/current.gif"></a><a href="/favicon.ico"></a></td>
</tr>
<tr>
<td colspan="2" bgcolor="#CFDCED" class="copyright" align="center"><font size="2" face="Arial, Helvetica, Sans-Serif">Copyright &copy;
          2003&nbsp;wyona.org All rights reserved.<script type="text/javascript" language="JavaScript"><!--
              document.write(" - "+"Last Published: " + document.lastModified);
            //  --></script></font></td>
</tr>
<tr>
<td colspan="2" align="left" bgcolor="#CFDCED" class="logos"></td>
</tr>
</table>
<!--================= end Footer ==================-->
</body>
</html>

--=-=-=


-- 
Christian Egli       [email protected]   +41 1 272 9161
                     Wyona AG, Hardstrasse 219, CH-8005 Zurich
Open Source CMS      http://www.wyona.org http://www.wyona.com 

--=-=-=--