Project

General

Profile

Actions

task #5083

closed

Alternative image viewer for dataportal

Added by Andreas Kohlbecker over 8 years ago. Updated about 3 years ago.

Status:
Closed
Priority:
Highest
Category:
cdm-dataportal
Target version:
Start date:
Due date:
% Done:

100%

Estimated time:
Severity:
normal
Tags:

Description

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

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

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

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 and highly customisable user interface, therefore it has a nice integration of metadata: http://universalviewer.io/examples/

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 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 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 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 grunt@~0.4.0 webpack@^4.0.0
  • 6. Build with grunt
grunt build --dev

or for minified files

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:


Open problems

  • the universalviewer gallery does not work with druapl clean urls (ui-config.json is not found) DONE
  • manifest url still hard coded for testing, refactor and reuse function _load_media_for_taxon($taxon) DONE

related tickets:

  • #4582 (may become obsolte)
  • #5106 specimen table images

Files

iiif-test.tar.gz (1.32 KB) iiif-test.tar.gz Andreas Kohlbecker, 06/24/2016 01:52 PM

Related issues

Related to EDIT - bug #6282: FSI image viewer not working with httpsRejectedAndreas Kohlbecker

Actions
Related to EDIT - feature request #8028: Better representation of web app media in the image galleryClosedAndreas Kohlbecker

Actions
Related to EDIT - feature request #8867: media list services as iiif manifest serviceClosedAndreas Kohlbecker

Actions
Related to EDIT - feature request #8888: responsive width for universal viewerClosedAndreas Kohlbecker

Actions
Related to EDIT - feature request #9137: IPTC Keywords (and maybe other information) is not shown in Universal Viewer yet ClosedAndreas Müller

Actions
Related to EDIT - bug #9463: UniversalViewer causes jQuery version conflict and breaks maps In ProgressKatja Luther

Actions
Actions #1

Updated by Andreas Kohlbecker over 8 years ago

Collection of responses on photobox

Schick ! (a.mueller)

Hallo Andreas,

find ich optisch sehr ansprechend und erlaubt sogar Zoomen.

Frage mich nur, ob sich auch in IPTC gespeicherte Bildmetadaten darstellen lassen

Schöne Grüße,

Norbert

Actions #2

Updated by Andreas Kohlbecker over 8 years ago

To all

please test both viewers with mobile devices. Are both suitable for touch displays?

Andreas

Actions #3

Updated by Norbert Kilian over 8 years ago

Do not have a mobile device.

Noticed that MfN uses OpenSeadragon in its project Zoosphere: http://www.zoosphere.net/. I find this convincing.

Norbert

Actions #4

Updated by Andreas Kohlbecker almost 8 years ago

  • Target version changed from Reviewed Next Major Release to Release 4.2
Actions #5

Updated by Andreas Kohlbecker almost 8 years ago

Replying to a.kohlbecker:

To all

please test both viewers with mobile devices. Are both suitable for touch displays?

Andreas

I now tested them:

Universal Viewer and OpenSeadragon can both be used on mobile devices.

The user interaction in each of them is a bit fiddly but it works.

Andreas

Actions #6

Updated by Andreas Müller over 7 years ago

  • Target version changed from Release 4.2 to Release 4.3
Actions #7

Updated by Andreas Müller over 7 years ago

  • Target version changed from Release 4.3 to Release 4.4
Actions #9

Updated by Andreas Kohlbecker over 7 years ago

  • Description updated (diff)
  • Category deleted (cdm-dataportal)
  • Private changed from Yes to No
Actions #10

Updated by Andreas Kohlbecker over 7 years ago

  • Category set to Import
Actions #11

Updated by Andreas Kohlbecker over 7 years ago

Ralf Hand wrote:

Hallo Andreas,

danke für den Link. Wir als sehr fotoorientiertes Projekt sind nicht uneingeschränkt begeistert von dem neuen Viewer. Ich muss nochmals mit der Fullscreen-Problematik nerven. Schau Dir einfach mal ein paar Bilder im heutigen und im geplanten Viewer an.

Keine Ahnung, ob man beispielsweise dieses „düstere Umfeld“ im neuen Viewer anpassen kann (also die eher dunklen Hintergründe im Vergleich zum heutigen Viewer). Die Thumbnails zum weiteren Angebot lassen sich auch nicht so schön klein halten wie heute, sondern nur komplett anzeigen oder komplett einblenden.

Manche Elemente hingegen sind intuitiver als bisher.

Viele Grüße
Ralf


Hallo Andreas,

wenn sich die Farbgebung des Hintergrundes anpassen lässt, die Größe der Seitenleiste konfigurierbar ist und die Thumbnail-Größe anpassbar ist, dann passt das schon. Man kann nicht alles haben, und mir ist auch wichtig, dass die Portale auf diesen ganzen mobilen Dingern endlich richtig laufen.

Ich finde es beim Vorhandensein sehr vieler Bilder pro Taxon schon recht komfortabel, dass man bisher sehr kleine Thumbnails in größerer Anzahl anzeigen lassen kann. Man kann dann sehr rasch beispielsweise Blüten- oder Samenfotos rauspicken, ohne dass man scrollen muss (siehe Beispiel) wie in dem neuen Modell.

Du hast geschickterweise ein Hochkantfoto als Gegenargument genommen. Ich präsentiere unten mal ein schönes Querformat, wie es sich bisher ohne Zoomen gleich öffnet. Unterschiede gibt es schon ...

Viele Grüße

Ralf

Actions #12

Updated by Andreas Kohlbecker over 7 years ago

The Universalviewer has now commonly accepted, even if there are concerns, but it is so far the best solution we have.

We are currently a bit blocked by the fact that Universalviewer is not supporting plain image sources.
The according universalviewer issue 78 (see issue description) has been removed from the milestone for the next release, so we should not hope that this is going to be fixed soon. We are thus left with the following options:

  1. Wait
  2. Fix issue 78 by ourself
  3. Avoid plain image sources by delivering all our images through a IIIF compliant server
  4. Use the Universalviewer only for images from compliant sources and use OpenSeadeargon direclty for plain image sources
Actions #13

Updated by Andreas Müller over 7 years ago

  • Target version changed from Release 4.4 to Release 4.5
Actions #14

Updated by Andreas Müller about 7 years ago

  • Target version changed from Release 4.5 to Release 4.6
Actions #15

Updated by Andreas Müller about 7 years ago

  • Target version changed from Release 4.6 to Release 4.7
Actions #16

Updated by Andreas Müller almost 7 years ago

  • Target version changed from Release 4.7 to Release 4.8
Actions #17

Updated by Andreas Müller over 6 years ago

  • Target version changed from Release 4.8 to Release 4.9
Actions #18

Updated by Andreas Müller over 6 years ago

  • Target version changed from Release 4.9 to Release 4.10
Actions #19

Updated by Andreas Müller over 6 years ago

  • Target version changed from Release 4.10 to Release 4.12
Actions #20

Updated by Andreas Kohlbecker over 6 years ago

  • Description updated (diff)
  • Priority changed from Priority13 to Priority14

The issue 78 in Universal viewer has been fixed now! This fix ins included in version 3.0, so we can start now to use the UniversalViewer also for plain image sources.

Actions #21

Updated by Andreas Müller over 6 years ago

  • Target version changed from Release 4.12 to Release 4.13
Actions #22

Updated by Andreas Müller about 6 years ago

  • Target version changed from Release 4.13 to Release 4.14
Actions #23

Updated by Andreas Müller about 6 years ago

  • Target version changed from Release 4.14 to Release 5.0
Actions #24

Updated by Andreas Kohlbecker almost 6 years ago

  • Target version changed from Release 5.0 to Release 5.1
Actions #25

Updated by Andreas Müller almost 6 years ago

  • Target version changed from Release 5.1 to Release 5.2
Actions #26

Updated by Andreas Kohlbecker over 5 years ago

  • Blocks bug #6282: FSI image viewer not working with https added
Actions #27

Updated by Andreas Kohlbecker over 5 years ago

  • Blocks deleted (bug #6282: FSI image viewer not working with https)
Actions #29

Updated by Andreas Kohlbecker over 5 years ago

  • Target version changed from Release 5.2 to Release 5.3
Actions #30

Updated by Andreas Kohlbecker over 5 years ago

  • Target version changed from Release 5.3 to Release 5.4
Actions #31

Updated by Andreas Kohlbecker over 5 years ago

  • Target version changed from Release 5.4 to Release 5.5
Actions #32

Updated by Andreas Kohlbecker about 5 years ago

  • Target version changed from Release 5.5 to Release 5.6
Actions #33

Updated by Andreas Kohlbecker about 5 years ago

  • Target version changed from Release 5.6 to Reviewed Next Major Release
Actions #34

Updated by Andreas Kohlbecker over 4 years ago

  • Related to bug #6282: FSI image viewer not working with https added
Actions #35

Updated by Andreas Kohlbecker over 4 years ago

Actions #36

Updated by Andreas Kohlbecker about 4 years ago

  • Priority changed from Priority14 to Highest
  • Target version changed from Reviewed Next Major Release to Release 5.13
Actions #37

Updated by Andreas Kohlbecker about 4 years ago

  • Subject changed from Alternative image viewer for dataportal [DISUSS] to Alternative image viewer for dataportal
Actions #38

Updated by Andreas Kohlbecker about 4 years ago

  • Description updated (diff)
Actions #39

Updated by Andreas Kohlbecker about 4 years ago

  • Description updated (diff)
Actions #40

Updated by Andreas Kohlbecker about 4 years ago

  • Status changed from New to In Progress
Actions #41

Updated by Andreas Kohlbecker about 4 years ago

  • Description updated (diff)
Actions #42

Updated by Andreas Kohlbecker about 4 years ago

  • Description updated (diff)
Actions #43

Updated by Andreas Kohlbecker about 4 years ago

  • Description updated (diff)
Actions #44

Updated by Andreas Kohlbecker about 4 years ago

  • Description updated (diff)
Actions #45

Updated by Andreas Kohlbecker about 4 years ago

  • Description updated (diff)
Actions #46

Updated by Andreas Kohlbecker about 4 years ago

Actions #47

Updated by Andreas Kohlbecker about 4 years ago

  • Description updated (diff)
Actions #48

Updated by Andreas Kohlbecker about 4 years ago

  • % Done changed from 0 to 40

last remaining problem:

  • the universalviewer gallery does not work with drupal clean urls (ui-config.json is not found)
Actions #49

Updated by Andreas Kohlbecker about 4 years ago

  • Status changed from In Progress to Resolved
  • % Done changed from 40 to 50

clean urls problem solved, the universalviewer is now ready to be used in the data portal

Actions #50

Updated by Andreas Kohlbecker about 4 years ago

Actions #51

Updated by Andreas Kohlbecker about 4 years ago

  • Description updated (diff)
  • Status changed from Resolved to Closed
  • % Done changed from 50 to 100

All remaning open issues solved.

Furhter tasks related to the UV will be handled in a separate ticket.

Actions #53

Updated by Andreas Müller over 3 years ago

  • Related to feature request #9137: IPTC Keywords (and maybe other information) is not shown in Universal Viewer yet added
Actions #54

Updated by Andreas Kohlbecker about 3 years ago

  • Description updated (diff)
Actions #55

Updated by Andreas Kohlbecker about 3 years ago

  • Description updated (diff)
Actions #56

Updated by Andreas Kohlbecker about 3 years ago

  • Related to bug #9463: UniversalViewer causes jQuery version conflict and breaks maps added
Actions

Also available in: Atom PDF