Basic text documents are now rendering readably, but there's still a lot to do on the text docs. I've managed to simplify and standardize the system by which site content written directly in XHTML is rendered (or, actually, copied to the output). It's now enclosed in a <div class="htmlContainer" xmlns="http://www.w3.org/1999/xhtml">
, and this XSLT catches it and copies it to the output:
<xsl:template match="xhtml:div[@class='htmlContainer']" mode="#all"> <xsl:copy-of select="./*" /> </xsl:template>
I've been struggling a bit with the CSS that came over from Greg's site design, because it depends on a root setting of font-size: 62.5%
on the <body>
element; I find myself having to override that all over the place, to get readable text, but I don't want to mess with it because the layout of the menu depends on it. We'll have to rationalize that at some point; we probably shouldn't be setting a base font size so low.
The XSLT for the last version of the site had grown slowly by accretion, and it was overly complicated; basic page setup was handled in three different places, depending on whether the document was an Image Markup doc, a text doc from the collection, or a site information page; and there was a lot of unnecessary code carried over from other projects.
Since we're now doing a redesign, this is an opportune time to rewrite all this code, so I've been making a start. The first thing to do is to centralize the code which handles the basic page layout (title, menu, any footer, etc.), and the head tag with all its CSS and JavaScript file links. I've centralized all of this in index.xsl
, so all XHTML rendering now calls this file.
The main XSL file then imports six others, and lays out the page; then it branches based on the type of document that's being rendered, calling special functions that will handle a text (prose/verse) document, or an IMT document. I'm also making some use of the @mode
attribute to provide different templates to handle the same TEI element depending on whether it's part of a site document, or a collection doc.
Uploaded FL's changed files into the db after validating them. Then I went on to look at H's report of missing functionality in the text rendering of Sermon des Cocus. I added handling for CSS code in @rend
attributes, and this worked fine for the text indents, but wasn't working for the text-align: center
setting in headers. Going back to the markup, I found that H had used:
rend="text-align:centre;"
instead of:
rend="text-align:center;"
Much as I wish it were not so, US spelling is required in CSS property names and values. I've fixed the file in the db and in the editing folder on the server, and the titles are now appearing centred.
Finished updating the search system so that it handles the new file format, implements the new quick-search function directly from the site menu, and displays something readable (in the grey.css theme at least).
The idea of the new quick-search is that, in addition to having a link to "Recherche" on the menu, which takes you to the search page, there's also a little text box right on the menu. You can type into that text box and press return, and you'll be taken to the search page, then the page will use that text for a basic search operation immediately. It passes the search via the url string. This also enables bookmarking of simple searches, which might be handy. Because the main search uses AJAX, it's hard to bookmark a complex search.
There are 3 tags not functioning in Sermon des Cocus.
The tags <head> and <p> have a rend attribute expressed in CSS:
<p rend="text-indent:3em;"> or <p rend="text-indent:2em;">
This should indent the first line of a paragraph by 2 or 3 ems.
<head rend="text-align:center;">
This should center the text.
Also, <choice> <reg>[normalized text]</reg> and <orig>[original text]</orig> should differentiate normalized text from the original text. This isn't functioning at the moment.
I've completed the following stuff on the new version of the site:
- Stylesheet switching from the menu. For this, I used my own code rather than Greg's, but I also managed to learn something new about the Cookie Selector in Cocoon which enabled me to streamline it considerably. I can now pass the value of a cookie directly into an XSLT transformation as a parameter, like this:
<map:select type="cookie-selector"> <map:parameter name="cookie-name" value="PageStyle"/> <map:when test=""> <map:transform type="saxon" src="xsl/index2.xsl"> <map:parameter name="PageStyle" value="grey" /> </map:transform> </map:when> <map:otherwise> <map:transform type="saxon" src="xsl/index2.xsl"> <map:parameter name="PageStyle" value="{request:cookieMap/PageStyle/value}" /> </map:transform> </map:otherwise> </map:select>
This is well worth remembering. Previously I was doing a complicatedwhen
statement, because I didn't know how to use thecookieMap
. - Document listings filtered by type (prose, verse, engravings, or all). This is now achieved by passing a parameter into the XQuery in the URL. Eventually, the engravings link will go to a special page which uses the gallery layout, but for now it just works as a list like the other pages.
- Readable text everywhere. In some of the stylesheets, text was not readable against its background, for various reasons. This is now fixed.
- Teaser popup functionality and layout. This is all working, but the background image/colour (it's a combination of both) is not quite right yet, and also needs differentiating across the styles.
- Teaser links are buttons. Previously they were text links, but now we've made them into actual buttons, which makes them easier to lay out and style.
- Various fixes to code taken from Greg's site (such as removing
href="#"
attributes, which add an unnecessary hash to the page URL).
Next to be done, in order of ease and practicality:
- Text document output
- Search page
- Menu-based search functionality
- Gallery view of engravings
- Actual image markup output (needs some careful rethinking, and has to be completely rewritten because we've abandoned SVG)
Managed to get the basic site pages ported over to Greg's design, with the accordion menu working. One limitation of the accordion menu emerged immediately: it always opens the first submenu, even if you've just landed on a page from the second one. I've had to write some JavaScript that decides which submenu to open by comparing the current path to a list of filenames from each submenu category. A bit hacky, but it works.
Next is integrating my original style-switching code (JS and Cocoon sitemap switching based on cookies) so that Greg's style submenu works.
We want to leave the existing Mariage site fully functional while we convert to the new site, so I've set up a temporary project site where we can work on integrating the new look.
It has, of course, no CSS. The XQuery and some of the XSLT has been converted so that most of the pages more or less work, with the exception of the actual document display. In the process of editing the XQuery I've been able to dispense with a lot of prefixes, now we no longer need to distinguish between SVG and TEI elements. It also strikes me that we should be able to dispense with the old <html_block>
pseudo-tag I was using to insert verbatim blocks of XHTML code into documents; instead, we should perhaps use pure XHTML in the correct namespace, with a mechanism that looks like this:
<div class="blockContainer" xmlns="http://www.w3.org/1999/xhtml"> <p>A paragraph...</p> <img...></img> </div>
with matchers that work like this:
<xsl:template match="xhtml:div[@class='blockContainer']"> <xsl:copy-of select="*" /> </xsl:template>
I haven't tested this yet, but I'm sure it can be made to work OK, which should simplify things and remove the proprietary container tag I'm currently using.
Once that's done, and the core XSLT has been refined a bit, I need to make sure the search is working (its AJAX functionality will need checking). After that, we'll be ready to start integrating the new look CSS.