task #5083
Updated by Andreas Kohlbecker about 4 years ago
The default image gallery and viewer which is currently implemented in the dataportal is quite basic, limited in capabilities. The new viewer should cover all functionality which is currently provided by the fsi viewer. Requirements: * suitable for mobile devices (touch) * display of IPTC/EXIM metadata (provided by the cdm serber) and metadata offered by the erez server (see email conversation with dominik) * Overview on all images in 'gallery' These are alternatives: **photobox** * http://dropthebit.com/demos/photobox/ * https://github.com/yairEO/photobox scheint mir auf den ersten Blick alles zu erfüllen was für die Dataportals benötigt wird. und ist auch Mobiles geeignet. In der Demo läuft sie als Overlay, lässt sich mit Sicherheit auch anders verwenden. Metadaten lassen sich anzeigen, ... **OpenSeadragon** * http://openseadragon.github.io/ Excellent viewer which reminds very much by to the FSI viewer (http://openseadragon.github.io/examples/ui-reference-strip/, ). The MfN is using this viewer for [ZooSphere](http://www.zoosphere.net/) **Universal Viewer** The https://github.com/UniversalViewer/universalviewer provides an extension (uv-seadragon-extension) by which it can use OpenSeadragon as centerPanel ([seadragonCenterPanel"). This viewer is dedicated to enable cultural heritage institutions to present their digital artifacts in a "IIIF-compliant](http://iiif.io/) and highly customisable user interface, therefore it has a nice integration of metadata: http://universalviewer.io/examples/ * Supports "IxIF" out of the box, allowing 3D, audio, **video*, and *pdf** viewing experiences. * Is extensible: https://universalviewer.gitbooks.io/custom-extensions/content/ Currently it is required to use an IIIF compliant Image server (http://iiif.io/apps-demos/): * There is a IIIF adaptor for FSI server! * Loris * IIPImage Server * Djakota * ... ## universalviewer ~~Once the [universalviewer issue 78](https://github.com/UniversalViewer/universalviewer/issues/78) is solved, it will become possible to use the viewer with plain image servers like apache. This feature is planned to be included in v2.0 of the viewer.~~ [universalviewer issue 78](https://github.com/UniversalViewer/universalviewer/issues/78) is fixed now for version 3.0! A test manifest for this use case is a available at http://cybertaxonomy.eu/download/tmp/iiif-test/manifest (the iiif-test folder is also attached to this ticket as attachment:iiif-test.tar.gz **setting up universalviewer dev environment:** - 1. install npm: ~~~ # nodejs and npm # (see https://github.com/nodesource/distributions/blob/master/README.md#debinstall) curl -sL https://deb.nodesource.com/setup_13.x | sudo -E bash - sudo apt-get install -y nodejs ~~~ - 2. install grunt ~~~ npm install -g grunt-cli ~~~ - 3. set the required node version At current universalviewer is not compatible with node 10, it is being developed using node 8.x.x (https://github.com/UniversalViewer/universalviewer/issues/690). Therefor it is recommended to install node 8.16.1 using this recipe: ~~~ sudo npm cache clean -f sudo npm install -g n sudo n 8.16.1 ~~~ - 4. clone the universalviewer github repo now we basically follow https://github.com/UniversalViewer/universalviewer/blob/master/CONTRIBUTING.md#fork-repository ~~~ git clone https://github.com/UniversalViewer/universalviewer.git --recursive cd universalviewer ~~~ - 5. run `npm install` As this requires also installation of peer dependencies, it requires some addtional steps (https://stackoverflow.com/questions/46053414/npm-warn-requires-a-peer-of-but-none-is-installed-you-must-install-peer#49188160)[] ~~~ npm install ~~~ now check the output for lines starting with `npm WARN ... requires a peer of ...` and install all missing peers, at current these are: ~~~ npm install --save-dev ajv@^6.0.0 npm install --save-dev grunt@~0.4.0 npm install --save-dev webpack@^4.0.0 ~~~ - 6. Build with grunt ~~~ grunt build ~~~ or ~~~ grunt build --dist ~~~ Grunt should complete without errors The distribution files are found in ./dist copy the `dist/` folder as `uv/` into `cdm-dataportal/modules/cdm_dataportal/js/universalviewer/` **integrating the uv in the dataportal module:** (Note: universal viewer uses a recent version of jQuery (3.3.1) which could conflict with the version of Drupal 7. Solutions: https://www.drupal.org/node/1058168) ## IIIF: * [IIIF Presentation API](https://iiif.io/api/presentation/2.1/#resource-structure) (specs for the manifest file) * Manifest Validator: http://iiif.io/api/presentation/validator/ * [Repono](https://github.com/sdellis/repono) is a RESTful API and datastore for creating and editing IIIF Presentation Manifests. Useful for development. ---- **Open problems** * ~~the the universalviewer gallery does not work with druapl clean urls (ui-config.json is not found)~~ **DONE** found) * ~~manifest manifest url still hard coded for testing, refactor and reuse `function _load_media_for_taxon($taxon)`~~ **DONE** _load_media_for_taxon($taxon)` ---- related tickets: * #4582 (may become obsolte) * #5106 specimen table images