epidoc-viewer-react

This project has received funding from the John Fell Fund of the University of Oxford, and from the European Research Council (ERC) under the European Union’s Horizon 2020 research and innovation programme (grant agreement No 885040, “Crossreads”).

Exports a React component, LeidenViewer, that will display rendered Leiden when passed epidoc.

Relies on the convert function of epidoc-viewer-core, but you can also use the convert function directly without React.

Usage

npm install @isicily/epidoc-viewer-react

OR

yarn add @isicily/epidoc-viewer-react

import {LeidenViewer} from ‘@isicily/epidoc-viewer-core’

then use it somewhere...

<LeidenViewer 
		tei={tei} 
		showInterpreted={false} 
		overridingRules={someRules} 
/>

Where:

• ‘tei’ is the epidoc to be transformed to Leiden.
• ‘showInterpreted’ is a boolean
  • true shows interpreted, false shows diplomatic
• ‘overridingRules’ is a list of rules to add to the core set, or to override in the core set.

The rules passed in overridingRules must be an object like so:

const yourRules = {
    'w': node => {
        if (node.getAttribute('part') === 'I') {
            const exChild = node.querySelector('ex')
            if (exChild) {
                exChild.append('-')
            }
        } 
    },
    'ex': node => {
        const cert = node.getAttribute('cert')
        node.prepend('('); 
        if (cert === 'low') node.append('?')
        node.append(')')
    },
    'abbr': node => {
        if (node.parentNode.nodeName !== 'expan') node.append('(- - -)')
    }
}

Only include rules for those tags you wish to add or override. You can see the default rules in these three files:

Interpreted

Diplomatic

Shared

The shared rules are used in both the diplomatic and interpreted modes.

Font

The font used in the running I.Sicily version of this viewer is New Athena Unicode WOFF. If you'd like to use the same font in your app, you'll have to:

1. Add the following font declaration to your css:

@font-face {
  font-family: "NewAthena";
  src: local("NewAthena"),
  url("../fonts/newathu5_7.woff") format("woff");
  font-weight: normal;
}

2. Add the font file to your web app and adjust the 'url' above to point to the location. A copy of the font file is here

Updating this repo in NPM

In project directory:

npm run build
npm version patch -m "Upgrade to %s"
git push
npm publish --access public