<?xml version="1.0"?>
<xsl:stylesheet version="1.0"
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    xmlns:g="http://gramps-project.org/xml/1.4.0/"
    xmlns:ex="http://simile.mit.edu/2006/11/exhibit#"
    xmlns="http://www.w3.org/1999/xhtml">
 <!--
 *  (c) Copyright M.D. Nauta 2010. All rights reserved.
 *      m dot d period nauta at hetnet in the NetherLands
 *
 * Redistribution and use in source and binary forms, with or without
 * modification, are permitted provided that the following conditions
 * are met:
 *
 * 1. Redistributions of source code must retain the above copyright
 *    notice, this list of conditions and the following disclaimer.
 * 
 * 2. Redistributions in binary form must reproduce the above copyright
 *    notice, this list of conditions and the following disclaimer in the
 *    documentation and/or other materials provided with the distribution.
 * 
 * 3. The name of the author may not be used to endorse or promote products
 *    derived from this software without specific prior written permission.
 *
 * THIS SOFTWARE IS PROVIDED BY THE AUTHOR ``AS IS'' AND ANY EXPRESS OR
 * IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES
 * OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED.
 * IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY DIRECT, INDIRECT,
 * INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT
 * NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
 * DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
 * THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
 * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF
 * THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
 *
 -->


    <!-- add following line to a .htaccess file for cross-origin xml-stylesheet
    HEADER set Access-Control-Allow-Origin "*"
    -->

    <!-- I have tried to run this, but failed. Somehow my own javascript
         files won't load, so the error message is: documentLoaded is not
         defined. Main problem is probably that Exhibit uses createElement
         instead of createElementNS. If method="html" things are OK. -->
<!--
<xsl:output method="xml"
    doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
    doctype-public="-//W3C//DTD XHTML 1.0 Transitional//EN"/>
-->
<xsl:output method="html"
    doctype-system="http://www.w3.org/TR/html4/loose.dtd"
    doctype-public="-//W3C//DTD HTML 4.01 Transitional//EN"/>

<xsl:template match="text()"></xsl:template>

<xsl:template match="/">
    <html>
    <head>
    <title>Gramps Exhibit</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script type="text/javascript" src="http://gramps-project.org/grampsExhibit/0.0.2/simile-ajax-api.js"></script>
    <script type="text/javascript"
        src="http://trunk.simile-widgets.org/exhibit/api/exhibit-api.js?autoCreate=false"></script>
    <script type="text/javascript"
        src="http://trunk.simile-widgets.org/exhibit/api/extensions/time/time-extension.js"></script>
    <script type="text/javascript"
        src="http://trunk.simile-widgets.org/exhibit/api/extensions/map/map-extension.js?service=openlayers"></script>
    <script type="text/javascript">
        var javascriptFiles = [
            "grampsexhibit.js",
            "exhibit.js",
            "collection.js",
            "controls.js",
            "functions.js",
            "format-parser.js",
            "formatter.js",
            "tabular-view.js",
            "ui.js",
            "view-panel.js",
            "relationship-view.js",
            "timeline-view.js",
            "olmap-view.js",
            "lens.js",
            "slider.js",
            "gramps-xml-exporter.js"
        ];
        var cssFiles = [
            "grampsexhibit.css"
        ];
        var scriptURLs = [];
        var cssURLs = [];
        var GEUrlPrefix = "http://www.gramps-project.org/grampsExhibit/0.0.2/";
        SimileAjax.prefixURLs(scriptURLs, GEUrlPrefix, javascriptFiles);
        SimileAjax.prefixURLs(cssURLs, GEUrlPrefix, cssFiles);
        SimileAjax.includeJavascriptFiles(document, "", scriptURLs);
        SimileAjax.includeCssFiles(document, "", cssURLs);
    </script>
    <script type="text/javascript">
    var o = {
    "types" : { person:{pluralLabel:"persons"}, family:{pluralLabel:"families"},
        event:{pluralLabel:"events"}, placeobj:{pluralLabel:"places"},
        source:{pluralLabel:"sources"}, repository:{pluralLabel:"repositories"},
        object:{pluralLabel:"objects"}, note:{pluralLabel:"notes"},
        eventref:{pluralLabel:"eventrefs"},sourceref:{pluralLabel:"sourcerefs"},
        reporef:{pluralLabel:"reporefs"}, objref:{pluralLabel:"objrefs"},
        noteref:{pluralLabel:"noterefs"} },
    "properties" : { "href":{valueType:"url"}, "hlink":{valueType:"item"},
        "personref":{valueType:"item"}, "childref":{valueType:"item"},
        "childof":{valueType:"item"}, "parentin":{valueType:"item"},
        "eventref":{valueType:"item"}, "sourceref":{valueType:"item"},
        "reporef":{valueType:"item"}, "objref":{valueType:"item"},
        "noteref":{valueType:"item"}, "change":{valueType:"number"},
        "lifestart":{valueType:"item"}, "lifeend":{valueType:"item"} },
    "items" : [
        <xsl:apply-templates select="g:database/g:header"/>
        <xsl:apply-templates select="g:database/g:people/g:person"/>
        <xsl:apply-templates select="g:database/g:families/g:family"/>
        <xsl:apply-templates select="g:database/g:events/g:event"/>
        <xsl:apply-templates select="g:database/g:sources/g:source"/>
        <xsl:apply-templates select="g:database/g:places/g:placeobj"/>
        <xsl:apply-templates select="g:database/g:objects/g:object"/>
        <xsl:apply-templates select="g:database/g:repositories/g:repository"/>
        <xsl:apply-templates select="g:database/g:notes/g:note"/>
        <xsl:apply-templates select="g:database/g:tags/g:tag"/>
        <xsl:apply-templates select="g:database/g:name-formats/g:format"/>
        <xsl:apply-templates select="//g:name|//g:surname|//g:personref|//g:address|//g:childref|//g:location|//g:tag|//g:range|//g:daterange|//g:datespan|//g:dateval|//g:datestr|//g:sourceref|//g:eventref|//g:reporef|//g:noteref|//g:tagref|//g:attribute|//g:url|//g:objref|//g:data_item" mode="item"/>
    ]}
    </script>
    </head>
    <body onload="documentLoaded()">

    <!-- collections needed by the main views -->
    <!-- A space is added as content to foul the XSL-transform of IE8. -->
    <div ex:role="exhibit-collection" id="person-col"
        class="ExhibitCollection" ex:itemTypes="person"> </div>
    <div ex:role="exhibit-collection" id="family-col"
        class="ExhibitCollection" ex:itemTypes="family"> </div>
    <div ex:role="exhibit-collection" id="event-col"
        class="ExhibitCollection" ex:itemTypes="event"> </div>
    <div ex:role="exhibit-collection" id="place-col"
        class="ExhibitCollection" ex:itemTypes="placeobj"> </div>
    <div ex:role="exhibit-collection" id="source-col"
        class="ExhibitCollection" ex:itemTypes="source"> </div>
    <div ex:role="exhibit-collection" id="repository-col"
        class="ExhibitCollection" ex:itemTypes="repository"> </div>
    <div ex:role="exhibit-collection" id="object-col"
        class="ExhibitCollection" ex:itemTypes="object"> </div>
    <div ex:role="exhibit-collection" id="note-col"
        class="ExhibitCollection" ex:itemTypes="note"> </div>
    <!-- collections needed by the lenses -->
    <div ex:role="exhibit-collection" id="name-col"
        class="ExhibitCollection" ex:itemTypes="name"> </div>
    <div ex:role="exhibit-collection" id="address-col"
        class="ExhibitCollection" ex:itemTypes="address"> </div>
    <div ex:role="exhibit-collection" id="attribute-col"
        class="ExhibitCollection" ex:itemTypes="attribute"> </div>
    <div ex:role="exhibit-collection" id="internet-col"
        class="ExhibitCollection" ex:itemTypes="url"> </div>
    <div ex:role="exhibit-collection" id="personref-col"
        class="ExhibitCollection" ex:itemTypes="personref"> </div>
    <div ex:role="exhibit-collection" id="childref-col"
        class="ExhibitCollection" ex:itemTypes="childref"> </div>
    <div ex:role="exhibit-collection" id="eventref-col"
        class="ExhibitCollection" ex:itemTypes="eventref"> </div>
    <div ex:role="exhibit-collection" id="location-col"
        class="ExhibitCollection" ex:itemTypes="location"> </div>
    <div ex:role="exhibit-collection" id="sourceref-col"
        class="ExhibitCollection" ex:itemTypes="sourceref"> </div>
    <div ex:role="exhibit-collection" id="data-col"
        class="ExhibitCollection" ex:itemTypes="data_item"> </div>
    <div ex:role="exhibit-collection" id="reporef-col"
        class="ExhibitCollection" ex:itemTypes="reporef"> </div>
    <div ex:role="exhibit-collection" id="objref-col"
        class="ExhibitCollection" ex:itemTypes="objref"> </div>
    <div ex:role="exhibit-collection" id="noteref-col"
        class="ExhibitCollection" ex:itemTypes="noteref"> </div>
    <div ex:role="exhibit-collection" id="pref-family-cref-col"
        class="ExhibitCollection" ex:itemTypes="personref,family,childref"
        > </div>
    <div ex:role="exhibit-collection" id="active-person"
        class="ExhibitCollection" ex:baseCollectionID="person-col"
        ex:expression="car(value)"> </div>

    <!-- ============== LENSES ===================== -->
    <div class="lens" ex:role="lens" ex:itemTypes="person"
        style="display:none" ex:onshow="onPersonLensShow(this)">
        <h2>Person: <span ex:content=".label"></span></h2>
        <table><tr>
            <td title="preferred name" style="min-width:50ex;"
                        ex:content="car(.name)">
                        <span ex:content=".title"></span>&#160;<span ex:content=".first"></span>&#160;<span ex:content="getSurname(value)"></span>&#160;<span ex:content=".suffix"></span>
            </td>
            <td><span title="gender" style="width:5ex;"
                    ex:content="gender2symbol(.gender)"></span></td>
            <td title="tags" ex:content=".tagref.hlink.label"/>
        </tr></table>
    </div>

    <div class="lens" ex:role="lens" ex:itemTypes="family"
        style="display:none" ex:onshow="onFamilyLensShow(this)">
        <h2>Family: <span ex:content=".label"></span></h2>
        <table>
            <tr><th colspan="2">Father</th><th colspan="2">Mother</th></tr>
            <tr><td>Name:</td><td ex:content="car(.father.name.label)"/>
                <td>Name:</td><td ex:content="car(.mother.name.label)"/></tr>
            <tr><td>Birth:</td><td ex:content="dateAndPlace(.father.lifestart)"/>
                <td>Birth:</td><td ex:content="dateAndPlace(.mother.lifestart)"/></tr>
            <tr><td>Death:</td><td ex:content="dateAndPlace(.father.lifeend)"/>
                <td>Death:</td><td ex:content="dateAndPlace(.mother.lifeend)"/></tr>
        </table>
        <table><tr>
            <td style="min-width:50ex">Relationship Type: <span ex:content=".rel"></span></td>
            <td title="tags" ex:content=".tagref.hlink.label"/>
        </tr></table>
    </div>

    <div class="lens" ex:role="lens" ex:itemTypes="event"
        style="display:none" ex:onshow="onEventLensShow(this)">
        <h2>Event: <span ex:content=".label"></span></h2>
        <table>
            <tr><td>Event type:</td>
                <td style="min-width:40ex" ex:content=".gtype"/>
                <td title="tags" ex:content=".tagref.hlink.label"/></tr>
            <tr><td>Date:</td><td ex:content="dateDisplay(value)"/></tr>
            <tr><td>Place:</td><td ex:content=".place.ptitle"/></tr>
            <tr><td>Description:</td><td ex:content=".description"/></tr>
        </table>
    </div>

    <!-- tags -->
    <div class="lens vcard" ex:role="lens" ex:itemTypes="placeobj"
        style="display:none" ex:onshow="onPlaceLensShow(this)">
        <h2>Place: <span ex:content=".label"></span></h2>
        <table class="geo">
            <tr><td>Place Name:</td><td ex:content=".ptitle" class="fn org"/></tr>
            <tr><td>Latitude:</td><td><abbr ex:content=".lat" ex:title-content="grampsdegrees2dec(.lat)" class="latitude"></abbr></td></tr>
            <tr><td>Longitude:</td><td><abbr ex:content=".long" ex:title-content="grampsdegrees2dec(.long)" class="longitude"></abbr></td></tr>
        </table>
    </div>

    <div class="lens" ex:role="lens" ex:itemTypes="source"
        style="display:none" ex:onshow="onSourceLensShow(this)">
        <h2>Source: <span ex:content=".label"></span></h2>
        <table>
            <tr><td>Title:</td>
                <td style="min-width:40ex;" ex:content=".stitle"/>
                <td title="tags" ex:content=".tagref.hlink.label"/>
            </tr>
            <tr><td>Author:</td><td ex:content=".sauthor"/></tr>
            <tr><td>Abbreviation:</td><td ex:content=".sabbrev"/></tr>
            <tr><td>Publication information:</td><td ex:content=".spubinfo"/></tr>
        </table>
    </div>

    <div class="lens" ex:role="lens" ex:itemTypes="repository"
        style="display:none" ex:onshow="onRepositoryLensShow(this)">
        <h2>Repository: <span ex:content=".label"></span></h2>
        <table>
            <tr><td>Name:</td>
                <td style="min-width:40ex" ex:content=".rname"/>
                <td title="tags" ex:content=".tagref.hlink.label"/>
            </tr>
            <tr><td>Type:</td><td ex:content=".gtype"/></tr>
        </table>
    </div>

    <!-- IE: an object needs a useable type otherwise it is taken out of
         the DOM; adding a type and a type-content is no sollution because
         attributes form a namednodemap i.e. there is no order. IE also needs
         a width/height and is unaware of natural dimensions of an object.
         When an object is created dynamically and a textnode is appended as
         child, IE crashes. There is only one conclusion: IE8 is not ready for
         object elements. -->
    <div class="lens" ex:role="lens" ex:itemTypes="object"
        style="display:none" ex:onshow="onObjectLensShow(this)">
        <h2>Object: <span ex:content=".label"></span></h2>
        <xsl:choose>
        <xsl:when test="system-property('xsl:vendor') = 'Microsoft'">
            <img ex:src-content=".src" ex:alt-content=".label"/>
        </xsl:when>
        <xsl:otherwise>
            <object ex:type-content=".mime" ex:title-content=".label"
                ex:data-content=".src">Unable to display media object</object>
        </xsl:otherwise>
        </xsl:choose>
        <table>
            <tr><td>Title:</td><td ex:content=".description"/></tr>
            <tr><td>Date:</td><td ex:content="dateDisplay(value)"/></tr>
            <tr><td>Path:</td><td ex:content=".src"/></tr>
            <tr><td title="tags" colspan="2" ex:content=".tagref.hlink.label"/></tr>
        </table>
    </div>

    <div class="lens" ex:role="lens" ex:itemTypes="note"
        style="display:none" ex:onshow="onNoteLensShow(this)">
        <h2>Note: <span ex:content=".label"></span></h2>
        <table><tr>
            <td style="min-width:50ex;">Type: <span ex:content=".gtype"></span></td>
            <td title="tags" ex:content=".tagref.hlink.label"/>
        </tr></table>
    </div>

    <div>
        <xsl:attribute name="class">lens</xsl:attribute>
        <xsl:attribute name="ex:role">lens</xsl:attribute>
        <xsl:attribute name="ex:itemTypes">sourceref</xsl:attribute>
        <xsl:attribute name="style">display:none</xsl:attribute>
        <xsl:attribute name="ex:formats">item {title:'default'; inline:'popup'}</xsl:attribute>
        <table ex:content="!sourceref.sourceref">
            <tr>
                <td ex:content=".hlink"/>
                <td title="Source Title" ex:content=".hlink.stitle"/>
                <td title="Source Page" ex:content=".spage"/>
                <!--<td title="Source Date" ex:content=".date"/>-->
                <td title="Source Confidence" ex:content=".conf"/>
            </tr>
        </table>
    </div>

    <div>
        <xsl:attribute name="class">lens</xsl:attribute>
        <xsl:attribute name="ex:role">lens</xsl:attribute>
        <xsl:attribute name="ex:itemTypes">noteref</xsl:attribute>
        <xsl:attribute name="style">display:none</xsl:attribute>
        <xsl:attribute name="ex:formats">item {title:'default'; inline:'popup'}  text {max-length:15}</xsl:attribute>
        <table ex:content="!noteref.noteref">
            <tr><td ex:content=".hlink"/><td ex:content=".hlink.text"/></tr>
        </table>
    </div>

    <div>
        <xsl:attribute name="class">lens</xsl:attribute>
        <xsl:attribute name="ex:role">lens</xsl:attribute>
        <xsl:attribute name="ex:itemTypes">attribute</xsl:attribute>
        <xsl:attribute name="style">display:none</xsl:attribute>
        <xsl:attribute name="ex:formats">item {title:'default'; inline:'popup'}</xsl:attribute>
        <table ex:content="!attribute.attribute">
            <tr>
                <td><span ex:content=".gtype"/>:</td>
                <td ex:content=".value"/>
            </tr>
        </table>
    </div>

    <div>
        <xsl:attribute name="class">lens</xsl:attribute>
        <xsl:attribute name="ex:role">lens</xsl:attribute>
        <xsl:attribute name="ex:itemTypes">surname</xsl:attribute>
        <xsl:attribute name="style">display:none</xsl:attribute>
        <xsl:attribute name="ex:formats">item {title:'default'; inline:'popup'}</xsl:attribute>
        <table ex:content="!surname.surname">
            <tr>
                <td title="Primary" ex:content=".prim"/>
                <td title="Prefix" ex:content=".prefix"/>
                <td title="Surname"  ex:content=".label"/>
                <td title="Connector" ex:content=".connector"/>
                <td title="Derivation" ex:content=".derivation"/>
            </tr>
        </table>
    </div>

    <!-- used by personal timeline and map -->
    <!-- An eventref connects an event to a person/family, but since it is
        only used in relationship-view the person/family is obvious. -->
    <div class="lens" ex:role="lens" ex:itemTypes="eventref"
        style="display:none">
        <h2>Eventref:</h2>
        <table>
            <tr><td>Role:</td><td ex:content=".role"/></tr>
            <tr><td>Event type:</td><td ex:content=".hlink.gtype"/></tr>
            <tr><td>Date:</td><td ex:content="dateDisplay(.hlink)"/></tr>
            <tr><td>Place:</td><td ex:content=".hlink.place.ptitle"/></tr>
            <tr><td>Description:</td><td ex:content=".hlink.description"/></tr>
        </table>
    </div>

    <!-- ================== CODERS ================ -->
    <div ex:role="coder" ex:coderClass="Color" id="birth-colors" style="display:none">
        <span ex:color="#FF0000">Birth</span>
        <span ex:color="#FFA500">Baptism</span>
        <span ex:color="#FF4500">Christening</span>
        <span ex:color="#FF8050" ex:case="others">Any other birth</span>
        <span ex:color="#FF8050" ex:case="mixed">Mixed births</span>
        <span ex:color="#FF8050" ex:case="missing">No birth</span>
    </div>

    <!-- use coder for source confidence and tags-->

    <!-- ================== VIEWS ================ -->
    <div id="facets-wrapper">
        <div id="facet_person_name"
            ex:role="facet"
            ex:collectionID="person-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Name"
            ex:expressions=".name.label"
            style="display:block;"> </div>
        <div id="facet_person_label"
            ex:role="facet"
            ex:collectionID="person-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="ID"
            ex:expressions=".label"
            style="display:block;"> </div>
        <div id="facet_person_gender"
            ex:role="facet"
            ex:collectionID="person-col"
            ex:facetClass="List"
            ex:facetLabel="Gender"
            ex:expression=".gender"
            ex:height="3em"
            style="display:block;"> </div>
        <div id="facet_person_birth"
            ex:role="facet"
            ex:collectionID="person-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Birth date"
            ex:expressions="dateDisplay(.lifestart)"
            style="display:block;"> </div>
        <div id="facet_person_death"
            ex:role="facet"
            ex:collectionID="person-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Death date"
            ex:expressions="dateDisplay(.lifeend)"
            style="display:block;"> </div>
        <div id="facet_person_events"
            ex:role="facet"
            ex:collectionID="person-col"
            ex:facetClass="List"
            ex:facetLabel="Event"
            ex:expression=".eventref.hlink.gtype"
            ex:showMissing="false"
            style="display:block;"> </div>
        <div id="facet_person_tags"
            ex:role="facet"
            ex:collectionID="person-col"
            ex:facetClass="List"
            ex:facetLabel="Tags"
            ex:expression=".tagref.hlink.label"
            ex:showMissing="false"
            ex:height="4em"
            style="display:block;"> </div>
        <div id="facet_person_note"
            ex:role="facet"
            ex:collectionID="person-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Note"
            ex:expression=".noteref.hlink.text"
            style="display:block;"> </div>
        <div id="facet_person_change"
            ex:role="facet"
            ex:collectionID="person-col"
            ex:facetClass="Slider"
            ex:facetLabel="Changed Between"
            ex:expression=".change"
            ex:histogram="true"
            ex:precision="86400"
            ex:valueToDisplay="sec2date"
            ex:displayToValue="date2sec"
            style="display:block;"> </div>

        <div id="facet_family_label"
            ex:role="facet"
            ex:collectionID="family-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="ID"
            ex:expressions=".label"
            style="display:none"> </div>
        <div id="facet_family_father"
            ex:role="facet"
            ex:collectionID="family-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Father"
            ex:expressions=".father.name.label"
            style="display:none"> </div>
        <div id="facet_family_mother"
            ex:role="facet"
            ex:collectionID="family-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Mother"
            ex:expressions=".mother.name.label"
            style="display:none"> </div>
        <div id="facet_family_child"
            ex:role="facet"
            ex:collectionID="family-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Child"
            ex:expressions=".childref.hlink.name.label"
            style="display:none"> </div>
        <div id="facet_family_relationship"
            ex:role="facet"
            ex:collectionID="family-col"
            ex:facetClass="List"
            ex:facetLabel="Relationship"
            ex:expression=".rel"
            ex:showMissing="false"
            style="display:none"> </div>
        <div id="facet_family_event"
            ex:role="facet"
            ex:collectionID="family-col"
            ex:facetClass="List"
            ex:facetLabel="Family Event"
            ex:expression=".eventref.hlink.gtype"
            ex:showMissing="false"
            style="display:none"> </div>
        <div id="facet_family_tags"
            ex:role="facet"
            ex:collectionID="family-col"
            ex:facetClass="List"
            ex:facetLabel="Tags"
            ex:expression=".tagref.hlink.label"
            ex:height="4em"
            style="display:none"> </div>
        <div id="facet_family_note"
            ex:role="facet"
            ex:collectionID="family-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Family Note"
            ex:expressions=".noteref.hlink.text"
            style="display:none"> </div>
        <div id="facet_family_change"
            ex:role="facet"
            ex:collectionID="family-col"
            ex:facetClass="Slider"
            ex:facetLabel="Changed Between"
            ex:expression=".change"
            ex:histogram="true"
            ex:precision="86400"
            ex:valueToDisplay="sec2date"
            ex:displayToValue="date2sec"
            style="display:none;"> </div>

        <div id="facet_event_label"
            ex:role="facet"
            ex:collectionID="event-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="ID"
            ex:expressions=".label"
            style="display:none"> </div>
        <div id="facet_event_description"
            ex:role="facet"
            ex:collectionID="event-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Description"
            ex:expressions=".description"
            style="display:none"> </div>
        <div id="facet_event_type"
            ex:role="facet"
            ex:collectionID="event-col"
            ex:facetClass="List"
            ex:facetLabel="Type"
            ex:expression=".gtype"
            style="display:none"> </div>
        <!-- need a better expression -->
        <div id="facet_event_date"
            ex:role="facet"
            ex:collectionID="event-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Date"
            ex:expressions=".dateval.val,.datespan.start,.datespan.stop,.daterange.start,.daterange.stop,.datestr.val"
            ex:showMissing="false"
            style="display:none"> </div>
        <div id="facet_event_place"
            ex:role="facet"
            ex:collectionID="event-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Place"
            ex:expressions=".place.ptitle"
            style="display:none"> </div>
        <div id="facet_event_note"
            ex:role="facet"
            ex:collectionID="event-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Note"
            ex:expressions=".noteref.hlink.text"
            style="display:none"> </div>
        <div id="facet_event_change"
            ex:role="facet"
            ex:collectionID="event-col"
            ex:facetClass="Slider"
            ex:facetLabel="Changed Between"
            ex:expression=".change"
            ex:histogram="true"
            ex:precision="86400"
            ex:valueToDisplay="sec2date"
            ex:displayToValue="date2sec"
            style="display:none;"> </div>

        <div id="facet_place_label"
            ex:role="facet"
            ex:collectionID="place-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="ID"
            ex:expressions=".label"
            style="display:none"> </div>
        <div id="facet_place_name"
            ex:role="facet"
            ex:collectionID="place-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Place Name"
            ex:expressions=".ptitle"
            style="display:none"> </div>
        <div id="facet_place_street"
            ex:role="facet"
            ex:collectionID="place-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Street"
            ex:expressions=".location.street"
            style="display:none"> </div>
        <div id="facet_place_parish"
            ex:role="facet"
            ex:collectionID="place-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Church Parish"
            ex:expressions=".location.parish"
            style="display:none"> </div>
        <div id="facet_place_postal"
            ex:role="facet"
            ex:collectionID="place-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Zip/Postal Code"
            ex:expressions=".location.postal"
            style="display:none"> </div>
        <div id="facet_place_city"
            ex:role="facet"
            ex:collectionID="place-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="City"
            ex:expressions=".location.city"
            style="display:none"> </div>
        <div id="facet_place_county"
            ex:role="facet"
            ex:collectionID="place-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="County"
            ex:expressions=".location.county"
            style="display:none"> </div>
        <div id="facet_place_state"
            ex:role="facet"
            ex:collectionID="place-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="State"
            ex:expressions=".location.state"
            style="display:none"> </div>
        <div id="facet_place_country"
            ex:role="facet"
            ex:collectionID="place-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Country"
            ex:expressions=".location.country"
            style="display:none"> </div>
        <div id="facet_place_note"
            ex:role="facet"
            ex:collectionID="place-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Note"
            ex:expressions=".noteref.hlink.text"
            style="display:none"> </div>
        <div id="facet_place_change"
            ex:role="facet"
            ex:collectionID="place-col"
            ex:facetClass="Slider"
            ex:facetLabel="Changed Between"
            ex:expression=".change"
            ex:histogram="true"
            ex:precision="86400"
            ex:valueToDisplay="sec2date"
            ex:displayToValue="date2sec"
            style="display:none;"> </div>

        <div id="facet_source_label"
            ex:role="facet"
            ex:collectionID="source-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="ID"
            ex:expressions=".label"
            style="display:none"> </div>
        <div id="facet_source_title"
            ex:role="facet"
            ex:collectionID="source-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Title"
            ex:expressions=".stitle"
            style="display:none"> </div>
        <div id="facet_source_author"
            ex:role="facet"
            ex:collectionID="source-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Author"
            ex:expressions=".sauthor"
            style="display:none"> </div>
        <div id="facet_source_publication"
            ex:role="facet"
            ex:collectionID="source-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Publication"
            ex:expressions=".spubinfo"
            style="display:none"> </div>
        <div id="facet_source_note"
            ex:role="facet"
            ex:collectionID="source-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Note"
            ex:expressions=".noteref.hlink.text"
            style="display:none"> </div>
        <div id="facet_source_reftype"
            ex:role="facet"
            ex:collectionID="source-col"
            ex:facetClass="List"
            ex:facetLabel="Attached To"
            ex:expression="!hlink!sourceref.type"
            style="display:none"> </div>
        <div id="facet_source_change"
            ex:role="facet"
            ex:collectionID="source-col"
            ex:facetClass="Slider"
            ex:facetLabel="Changed Between"
            ex:expression=".change"
            ex:histogram="true"
            ex:precision="86400"
            ex:valueToDisplay="sec2date"
            ex:displayToValue="date2sec"
            style="display:none;"> </div>

        <div id="facet_repo_label"
            ex:role="facet"
            ex:collectionID="repository-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Id"
            ex:expressions=".label"
            style="display:none"> </div>
        <div id="facet_repo_name"
            ex:role="facet"
            ex:collectionID="repository-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Name"
            ex:expressions=".rname"
            style="display:none"> </div>
        <div id="facet_repo_type"
            ex:role="facet"
            ex:collectionID="repository-col"
            ex:facetClass="List"
            ex:facetLabel="Type"
            ex:expression=".gtype"
            ex:showMissing="false"
            style="display:none"> </div>
        <div id="facet_repo_address"
            ex:role="facet"
            ex:collectionID="repository-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Address"
            ex:expressions=".address.street,.address.city,.address.state,.address.country,.address.postal"
            style="display:none"> </div>
        <div id="facet_repo_url"
            ex:role="facet"
            ex:collectionID="repository-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="URL"
            ex:expressions=".url.href"
            style="display:none"> </div>
        <div id="facet_repo_note"
            ex:role="facet"
            ex:collectionID="repository-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Note"
            ex:expressions=".noteref.hlink.note"
            style="display:none"> </div>
        <div id="facet_repo_change"
            ex:role="facet"
            ex:collectionID="repository-col"
            ex:facetClass="Slider"
            ex:facetLabel="Changed Between"
            ex:expression=".change"
            ex:histogram="true"
            ex:precision="86400"
            ex:valueToDisplay="sec2date"
            ex:displayToValue="date2sec"
            style="display:none;"> </div>

        <div id="facet_media_label"
            ex:role="facet"
            ex:collectionID="object-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="ID"
            ex:expressions=".label"
            style="display:none"> </div>
        <div id="facet_media_title"
            ex:role="facet"
            ex:collectionID="object-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Title"
            ex:expressions=".description"
            style="display:none"> </div>
        <div id="facet_media_type"
            ex:role="facet"
            ex:collectionID="object-col"
            ex:facetClass="List"
            ex:facetLabel="Mime-Type"
            ex:expression=".mime"
            style="display:none"> </div>
        <div id="facet_media_path"
            ex:role="facet"
            ex:collectionID="object-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Path"
            ex:expressions=".src"
            style="display:none"> </div>
        <!-- need better expression -->
        <div id="facet_media_date"
            ex:role="facet"
            ex:collectionID="object-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Title"
            ex:expressions=".dateval.val,.datespan.start,.datespan.stop,.daterange.start,.daterange.stop,.datestr.val"
            style="display:none"> </div>
        <div id="facet_media_note"
            ex:role="facet"
            ex:collectionID="object-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Note"
            ex:expressions=".noteref.hlink.text"
            style="display:none"> </div>
        <div id="facet_media_reftype"
            ex:role="facet"
            ex:collectionID="object-col"
            ex:facetClass="List"
            ex:facetLabel="Attached To"
            ex:expression="!hlink!objref.type"
            style="display:none"> </div>
        <div id="facet_media_change"
            ex:role="facet"
            ex:collectionID="object-col"
            ex:facetClass="Slider"
            ex:facetLabel="Changed Between"
            ex:expression=".change"
            ex:histogram="true"
            ex:precision="86400"
            ex:valueToDisplay="sec2date"
            ex:displayToValue="date2sec"
            style="display:none;"> </div>

        <div id="facet_note_label"
            ex:role="facet"
            ex:collectionID="note-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="ID"
            ex:expressions=".label"
            style="display:none"> </div>
        <div id="facet_note_type"
            ex:role="facet"
            ex:collectionID="note-col"
            ex:facetClass="List"
            ex:facetLabel="Type"
            ex:expression=".gtype"
            ex:showMissing="false"
            style="display:none"> </div>
        <div id="facet_note_text"
            ex:role="facet"
            ex:collectionID="note-col"
            ex:facetClass="TextSearch"
            ex:facetLabel="Text"
            ex:expressions=".text"
            style="display:none"> </div>
        <div id="facet_note_reftype"
            ex:role="facet"
            ex:collectionID="note-col"
            ex:facetClass="List"
            ex:facetLabel="Attached To"
            ex:expression="!hlink!noteref.type"
            style="display:none"> </div>
        <div id="facet_note_change"
            ex:role="facet"
            ex:collectionID="note-col"
            ex:facetClass="Slider"
            ex:facetLabel="Changed Between"
            ex:expression=".change"
            ex:histogram="true"
            ex:precision="86400"
            ex:valueToDisplay="sec2date"
            ex:displayToValue="date2sec"
            style="display:none;"> </div>
    </div>

    <!-- space is added a weird places to foul the XSL-transform of IE8 -->
    <div id="theViewPanel" ex:role="viewPanel" ex:initialView="2"
        ex:onviewchange="toggleFacets(newIndex)">
        <div> <!-- XSL interfers with curly braces of Exhibit expressions.-->
            <xsl:attribute name="ex:role">view</xsl:attribute>
            <xsl:attribute name="ex:collectionID">person-col</xsl:attribute>
            <xsl:attribute name="ex:viewClass">Exhibit.TabularView</xsl:attribute>
            <xsl:attribute name="ex:viewLabel">People</xsl:attribute>
            <xsl:attribute name="title">Table giving access to all persons</xsl:attribute>
            <xsl:attribute name="ex:showToolbox">true</xsl:attribute>
            <xsl:attribute name="ex:columns">car(.name.label), value, gender2symbol(.gender),
                .lifestart, .lifeend</xsl:attribute>
            <xsl:attribute name="ex:columnLabels">Name, ID, Gender, Birth,
                Death</xsl:attribute>
            <xsl:attribute name="ex:columnFormats">text, item, text,
                item {title:expression(dateAndPlace(value))},
                item {title:expression(dateAndPlace(value))}</xsl:attribute>
            <xsl:attribute name="ex:columnSortFormats">text, item, text,
                item {title:expression(earliestDate(value))},
                item {title:expression(earliestDate(value))}</xsl:attribute>
            <xsl:attribute name="ex:sortColumn">0</xsl:attribute>
            <xsl:attribute name="ex:border">0</xsl:attribute>
            <xsl:text> </xsl:text>
        </div>

        <div ex:role="view"
            ex:collectionID="active-person"
            ex:viewClass="Exhibit.RelationshipView"
            ex:viewLabel="Relationship"
            title="Show information on active person"> </div>
        <div>
            <xsl:attribute name="ex:role">view</xsl:attribute>
            <xsl:attribute name="ex:collectionID">family-col</xsl:attribute>
            <xsl:attribute name="ex:viewClass">Exhibit.TabularView</xsl:attribute>
            <xsl:attribute name="ex:viewLabel">Families</xsl:attribute>
            <xsl:attribute name="title">Table giving access to all families</xsl:attribute>
            <xsl:attribute name="ex:showToolbox">true</xsl:attribute>
            <xsl:attribute name="ex:columns">value, .father, .mother, .rel,
                filterPrefered(.eventref.hlink, contains(.gtype,'Marriage'),
                contains(.gtype,'Marriage Banns'))</xsl:attribute>
            <xsl:attribute name="ex:columnLabels">ID, Father, Mother, Relationship, Marriage</xsl:attribute>
            <xsl:attribute name="ex:columnFormats">item,
                item {title:expression(.name.label)},
                item {title:expression(.name.label)}, text,
                item {title:expression(dateAndPlace(value))}</xsl:attribute>
            <xsl:attribute name="ex:border">0</xsl:attribute>
            <xsl:text> </xsl:text>
        </div>

        <div>
            <xsl:attribute name="ex:role">view</xsl:attribute>
            <xsl:attribute name="ex:collectionID">event-col</xsl:attribute>
            <xsl:attribute name="ex:viewClass">Exhibit.TabularView</xsl:attribute>
            <xsl:attribute name="ex:viewLabel">Events</xsl:attribute>
            <xsl:attribute name="title">Table giving access to all events</xsl:attribute>
            <xsl:attribute name="ex:showToolbox">true</xsl:attribute>
            <xsl:attribute name="ex:columns">value, .gtype,participants(!hlink),
                value, .place.ptitle, .description</xsl:attribute>
            <xsl:attribute name="ex:columnLabels">ID, Type,
                Principal Participants, Date, Place, Description</xsl:attribute>
            <xsl:attribute name="ex:columnFormats">item, text, text,
                item {title:expression(dateDisplay(value))}, text,
                text</xsl:attribute>
            <xsl:attribute name="ex:columnSortFormats">item, text, text,
                item {title:expression(earliestDate(value))}, text,
                text</xsl:attribute>
            <xsl:attribute name="ex:border">0</xsl:attribute>
            <xsl:text> </xsl:text>
        </div>

        <div ex:role="view"
            ex:collectionID="place-col"
            ex:viewClass="Exhibit.TabularView"
            ex:viewLabel="Places"
            title="Table giving access to all places"
            ex:showToolbox="true"
            ex:columns=".ptitle, value, .location.street, .location.city, .location.state, .location.country"
            ex:columnLabels="Place Name, ID, Street, City, State, Country"
            ex:columnFormats="text, item, text, text, text, text"
            ex:sortColumn="0"
            ex:border="0"> </div>
        <div ex:role="view"
            ex:collectionID="source-col"
            ex:viewClass="Exhibit.TabularView"
            ex:viewLabel="Sources"
            title="Table giving access to all sources"
            ex:showToolbox="true"
            ex:columns=".stitle, value, .sauthor, .spubinfo"
            ex:columnLabels="Title, ID, Author, Publication Information"
            ex:columnFormats="text, item, text, text"
            ex:sortColumn="0"
            ex:border="0"> </div>
        <div ex:role="view"
            ex:collectionID="repository-col"
            ex:viewClass="Exhibit.TabularView"
            ex:viewLabel="Repositories"
            title="Table giving access to all repositories"
            ex:showToolbox="true"
            ex:columns=".rname, value, .gtype"
            ex:columnLabels="Name, ID, Type"
            ex:columnFormats="text, item, text"
            ex:border="0"> </div>

        <div>
            <xsl:attribute name="ex:role">view</xsl:attribute>
            <xsl:attribute name="ex:collectionID">object-col</xsl:attribute>
            <xsl:attribute name="ex:viewClass">Exhibit.TabularView</xsl:attribute>
            <xsl:attribute name="ex:viewLabel">Media</xsl:attribute>
            <xsl:attribute name="title">Table giving access to all media objects</xsl:attribute>
            <xsl:attribute name="ex:showToolbox">true</xsl:attribute>
            <xsl:attribute name="ex:columns">.description, value, .mime, .src,
                value</xsl:attribute>
            <xsl:attribute name="ex:columnLabels">Title, ID, Type, Path, Date
                </xsl:attribute>
            <xsl:attribute name="ex:columnFormats">text, item, text, text,
                item {title:expression(dateDisplay(value))}</xsl:attribute>
            <xsl:attribute name="ex:columnSortFormats">text, item, text, text,
                item {title:expression(earliestDate(value))}</xsl:attribute>
            <xsl:attribute name="ex:border">0</xsl:attribute>
            <xsl:text> </xsl:text>
        </div>

        <div>
            <xsl:attribute name="ex:role">view</xsl:attribute>
            <xsl:attribute name="ex:collectionID">note-col</xsl:attribute>
            <xsl:attribute name="ex:viewClass">Exhibit.TabularView</xsl:attribute>
            <xsl:attribute name="ex:viewLabel">Notes</xsl:attribute>
            <xsl:attribute name="title">Table giving access to all notes</xsl:attribute>
            <xsl:attribute name="ex:showToolbox">true</xsl:attribute>
            <xsl:attribute name="ex:columns">value, .gtype, .text</xsl:attribute>
            <xsl:attribute name="ex:columnLabels">ID, Type, Preview</xsl:attribute>
            <xsl:attribute name="ex:columnFormats">item, text, text {max-length:50} </xsl:attribute>
            <xsl:attribute name="ex:border">0</xsl:attribute>
            <xsl:text> </xsl:text>
        </div>

        <div id="myTimelineView"
            ex:role="view"
            ex:collectionID="person-col"
            ex:viewClass="Timeline"
            ex:viewLabel="Timeline"
            title="Births/Lifespans of all persons"
            ex:showToolbox="false"
            ex:start="earliestDate(.lifestart)"
            ex:latestStart="lastDate(.lifestart)"
            ex:earliestEnd="earliestDate(.lifeend)"
            ex:end="lastDate(.lifeend)"
            ex:eventLabel=".name.label"
            ex:timelineConstructor="allPersonsTimelineConstructor"> </div>
        <div ex:role="view"
            ex:collectionID="person-col"
            ex:viewClass="OLMap"
            ex:viewLabel="Birth Map"
            title="Birth locations of all persons"
            ex:showToolbox="false"
            ex:latlng="if(and(exists(.lifestart.place.lat),exists(.lifestart.place.long)),concat(grampsdegrees2dec(.lifestart.place.lat),',',grampsdegrees2dec(.lifestart.place.long)),empty())"
            ex:type="osm"
            ex:mapHeight="500"
            ex:colorCoder="birth-colors"
            ex:colorKey="filterPrefered(.eventref.hlink.gtype, contains(value,'Birth'), contains(value,'Baptism'), contains(value, 'Christening'))"> </div>
        <!--
        <div ex:role="view"
            ex:collectionID="person-col"
            ex:viewClass="Map"
            ex:viewLabel="Birth Map"
            ex:showToolbox="false"
            ex:latlng="concat(grampsdegrees2dec(.lifestart.place.lat),',',grampsdegrees2dec(.lifestart.place.long))"
            ex:center="52.373025,4.892371"
            ex:zoom="5"
            ex:size="large"
            ex:mapHeight="500"
            ex:colorCoder="birth-colors"
            ex:colorKey="filterPrefered(.eventref.hlink.gtype, contains(value,'Birth'), contains(value,'Baptism'), contains(value, 'Christening'))"/>
        -->
    </div>
    </body>
    </html>
</xsl:template>

<xsl:include href="./grampsxml2json.xsl"/>

</xsl:stylesheet>
