Mariage

Tried out the possibility of generating all CSS from an XML colour-definition file, but it proved too complicated and more messy than having a separate CSS file for each style. Set up a system whereby the style links on the menu are all pointing at files on Greg's account, so he can edit styles while I work on the rest of the stuff.

I also fixed an annoying bug in the search page, where the drop-down list of dates was not being populated.

Still working through my list:

• FIXED, as far as I can tell (it all goes too fast to see the progress bar, but the messages appear): There is no progress-bar functionality when doing a search. Should there be? Is it broken?
• FIXED: Multiple search results from the same annotation each get a copy of the image segment; they should be grouped under one copy of the image segment, to reduce clutter.
• FIXED: (Opera): text link for an image doesn't work. Should it? If so, what should it show? If not, should the link be removed?
• FIXED: "Corpus entier comme texte" returns text with huge amounts of whitespace at the beginning. Clean that up.
• FIXED in original (not yet carried over to new site): [Bug in document markup]: There's a rogue annotation category "objet" in Dame recevant un billet doux.
• FIXED (size and superscripting); colours are for CSS/Greg. (IE, Opera): Note links are just normal-sized numbers in the text, so they're very difficult to see. They should be larger, superscripted, padded, and colour-reversed.

Still outstanding:

• (Opera): Note display in text documents is the old-fashioned jump to the bottom of the page. Presumably the :target pseudo-class is not supported. Check this.
• When jumping to an image segment/annotation, the correct one is selected, scrollIntoView() works vertically, but not horizontally, so an image segment off to the right is unseen; also, the segment pops up behind the annotation menu sometimes, which is disconcerting. Should the menu move when it's covering an annotation area?
• (IE, Opera): Site title renders badly; is this because of font choice, or fallback sequence, or small-caps? How can we remedy it?
• (Opera): In Complet, clicking on an IMT document shows the teaser, but then trying a text document will not switch the teaser over; it looks as though the image teaser appears on top of the other one, and hides it. This now looks as though it's just an Opera painting bug, but there may be a way around it by refreshing something.
• [Content]: The Équipe page is out of date. Update the list to include H, and remove Eric because the schemas he researched are no longer used.
• (IE): Hoverbox images are lower in the z-order than the other components of the page. Can this be fixed, or is it just an IE bug? It's just cosmetic.
• (IE): When areas are selected on the image, the act of selecting the corresponding item in the annotation menu causes the image to jump around, presumably because some layout thing is being recalculated. This might be impossible to fix, but we should have a go at it.
• (IE): Z-order is REALLY screwed on IE; despite explicit settings in the stylesheet, the annotation menu goes behind the site menu. Perhaps we need to set a lower value on the site menu explicitly.

Working through my list:

• FIXED: Front page image is not yet random. Added JS code, and an auto-generated array of images created from Cocoon's directory generator and some XSLT, so any thumbnail image available will automatically be used.
• FIXED: Front page image is not cursor: pointer.
• FIXED: Annotation menu expands, but its container does not, so content shows below the container. Cosmetic only, but weird. Actually my fault, and various XSLT and JS fixes have been made. The menu now expands appropriately, based on the window size and the image size, so it's never taller than the largest of those.
• FIXED: Popup of full-size segment is hidden behind annotation and menu panels. Now bringing it to the front with z-index.
• FIXED: Clicking on the Type sort header in a page showing a subset of the documents (e.g. prose or vers) causes the page to retrieve all the documents, instead of a sorted version of the subset. This needed quite a lot of work in XQuery, XSLT and CSS.
• FIXED: CSS error: color: transparent in imt_p5.css.
• FIXED: JS error: Line 102 of utilities.js has ThisTeaser instead of thisTeaser. Various other camelBack errors fixed too, but the AJAX file still needs a thorough going-over.
• FIXED: (Opera): Site page headings are not big enough. Changed <h3>s to <h2>s, and so on up.
• FIXED: (IE, Opera): Site instructions page has odd numbering problems. On IE, the headings are numbered but without any space between the number and the text, and both numbers are "1".; on Opera, there are two numbers, one as above, and another which looks correct. Numbers are now hard-coded, and list is a <ul> with no bullets.
• FIXED: (IE, Opera): Annotation menu max-height (or height?) is being explicitly set so it's never taller than the image. This is wrong; the user may have a small image view set, and the menu then scrolls when it doesn't need to. Make it, instead, the height of the page less the top offset.

Still outstanding:

• (Opera): Note display in text documents is the old-fashioned jump to the bottom of the page. Presumably the :target pseudo-class is not supported. Check this.
• There is no progress-bar functionality when doing a search. Should there be? Is it broken?
• Multiple search results from the same annotation each get a copy of the image segment; they should be grouped under one copy of the image segment, to reduce clutter.
• When jumping to an image segment/annotation, the correct one is selected, scrollIntoView() works vertically, but not horizontally, so an image segment off to the right is unseen; also, the segment pops up behind the annotation menu sometimes, which is disconcerting. Should the menu move when it's covering an annotation area?
• (Opera): text link for an image doesn't work. Should it? If so, what should it show? If not, should the link be removed?
• (IE, Opera): Site title renders badly; is this because of font choice, or fallback sequence, or small-caps? How can we remedy it?
• "Corpus entier comme texte" returns text with huge amounts of whitespace at the beginning. Clean that up.
• (Opera): In Complet, clicking on an IMT document shows the teaser, but then trying a text document will not switch the teaser over; it looks as though the image teaser appears on top of the other one, and hides it. There should only be one teaser element. This might be caused by the JS error above.
• [Bug in document markup]: There's a rogue annotation category "objet" in Dame recevant un billet doux.
• [Content]: The Équipe page is out of date. Update the list to include H, and remove Eric because the schemas he researched are no longer used.
• (IE): Hoverbox images are lower in the z-order than the other components of the page. Can this be fixed, or is it just an IE bug? It's just cosmetic.
• (IE): When areas are selected on the image, the act of selecting the corresponding item in the annotation menu causes the image to jump around, presumably because some layout thing is being recalculated. This might be impossible to fix, but we should have a go at it.
• (IE): Z-order is REALLY screwed on IE; despite explicit settings in the stylesheet, the annotation menu goes behind the site menu. Perhaps we need to set a lower value on the site menu explicitly.
• (IE, Opera): Note links are just normal-sized numbers in the text, so they're very difficult to see. They should be larger, superscripted, padded, and colour-reversed.

These are my notes from testing the site appearance and functionality across various browsers/setups:

• Front page image is not yet random.
• (Opera): Front page image is not cursor: pointer.
• (Opera): Annotation menu expands, but its container does not, so content shows below the container. Cosmetic only, but weird.
• Popup of full-size segment is hidden behind annotation and menu panels. Should it be? Should it be at the front instead?
• Clicking on the Type sort header in a page showing a subset of the documents (e.g. prose or vers) causes the page to retrieve all the documents, instead of a sorted version of the subset.
• (Opera): Note display in text documents is the old-fashioned jump to the bottom of the page. Presumably the :target pseudo-class is not supported. Check this.
• CSS error: color: transparent in imt_p5.css.
• JS error: Line 102 of utilities.js has ThisTeaser instead of thisTeaser.
• There is no progress-bar functionality when doing a search. Should there be? Is it broken?
• Multiple search results from the same annotation each get a copy of the image segment; they should be grouped under one copy of the image segment, to reduce clutter.
• When jumping to an image segment/annotation, the correct one is selected, scrollIntoView() works vertically, but not horizontally, so an image segment off to the right is unseen; also, the segment pops up behind the annotation menu sometimes, which is disconcerting. Should the menu move when it's covering an annotation area?
• (Opera): text link for an image doesn't work. Should it? If so, what should it show? If not, should the link be removed?
• (IE, Opera): Site title renders badly; is this because of font choice, or fallback sequence, or small-caps? How can we remedy it?
• (Opera): Site page headings are not big enough.
• (IE, Opera): Site instructions page has odd numbering problems. On IE, the headings are numbered but without any space between the number and the text, and both numbers are "1".; on Opera, there are two numbers, one as above, and another which looks correct.
• "Corpus entier comme texte" returns text with huge amounts of whitespace at the beginning. Clean that up.
• (Opera): In Complet, clicking on an IMT document shows the teaser, but then trying a text document will not switch the teaser over; it looks as though the image teaser appears on top of the other one, and hides it. There should only be one teaser element. This might be caused by the JS error above.
• [Bug in document markup]: There's a rogue annotation category "objet" in Dame recevant un billet doux.
• [Content]: The Équipe page is out of date. Update the list to include H, and remove Eric because the schemas he researched are no longer used.
• (IE): Hoverbox images are lower in the z-order than the other components of the page. Can this be fixed, or is it just an IE bug? It's just cosmetic.
• (IE): When areas are selected on the image, the act of selecting the corresponding item in the annotation menu causes the image to jump around, presumably because some layout thing is being recalculated. This might be impossible to fix, but we should have a go at it.
• (IE): Z-order is REALLY screwed on IE; despite explicit settings in the stylesheet, the annotation menu goes behind the site menu. Perhaps we need to set a lower value on the site menu explicitly.
• (IE, Opera): Annotation menu max-height (or height?) is being explicitly set so it's never taller than the image. This is wrong; the user may have a small image view set, and the menu then scrolls when it doesn't need to. Make it, instead, the height of the page less the top offset.
• (IE, Opera): Note links are just normal-sized numbers in the text, so they're very difficult to see. They should be larger, superscripted, padded, and colour-reversed.

Worked all day on the image rendering, and some other aspects of the site:

• All IMT-related JS and XSLT code is converted to camelBack.
• A variety of JS bugs relating to positioning of the annotation menu and popups, and drag-dropping them, have been fixed.
• Image preloading has been added for the main images, so that display of popup full-size views may be a little quicker.
• All colour information has been lifted out of the imt stylesheet and moved to grey.css.
• Font sizing throughout the site has been rationalized, based on a 62.5% font setting on the <body>, with all other sizing in ems or percents. Removal of lots of spurious font size settings has got rid of over-large headings etc.
• Two small CSS files have been completely removed from the set, one having been deleted completely as unnecessary, the other having its small set of rules added into mariage_typeset_layout.css.
• A system for resizing the image display on the fly has been added. This seems to be working pretty well. At sizes at or below 800 width, it uses the smaller 800px version of the image; at any larger sizes it uses the full-scale image.
• Image resize/reload also remembers and restores the annotation you were looking at when you resized.
• Search results rendering has been updated to point correctly to camelBacked id attributes of annotation areas.
• Some preliminary testing has been done on other browsers, with a few fixes added for some obvious IE problems.

Next stages:

• Serious cross-platform cross-browser testing and tweaking.
• Conversion of grey.css code to complete the other alternative stylesheets.

Then we'll be ready to run...

Worked on the IMT interactive image output in XHTML, the last major portion of the site to be converted to the new system. First, I took the IMT's own web_view output code and started from that. The XSLT there expects to create a full page, whereas we're now rendering everything inside a framework created by index.xsl, so I had to abstract the IMT XSL into two named templates, one of which places CSS and JS in the header, the other doing the body content. That was straightforward.

Next was camelBacking all the actual code (XSLT, CSS and JS) to fit our new Mariage standards. That was tedious but not hard.

Finally, conversion involved making customizations to the XSLT to match what's needed on our site.

The result is something which looks monstrous at the moment (the CSS clashes with the core site CSS, and the font size problem is obvious), but it all works, and it shouldn't be too hard to massage it into something that looks good. I reckon about two to four hours should have it working. Then we'll have a fully-functional site using the grey.css file, and we can go on to look at the other optional stylesheets.

The image gallery is now working in the way planned and laid out by Greg. It pages the images in sets of 12. The only remaining issue is the positioning of the Next/Previous buttons (and perhaps their styling).

Next is the rendering of actual interactive image pages.

I've validated the changes to the two image files and two text files, and uploaded them into the database. Everything seems to be working OK, but please take a look to check, especially in the case of the text documents.

I've been working all day on rationalizing and cleaning out the code. I've converted everything to camelBack notation except for a few remaining JavaScript functions (I want to evaluate whether we need those at all, later). I've removed some old XSLT 1.0 utility templates which were easily replaced with custom functions or new XPath functions in XSLT 2.0. I've worked through all the distinct elements used in the text documents and added handlers for them; and I've fixed up the rendering of prose and verse documents so that everything basically seems to be working, including note display.