-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathdragdrop.html
57 lines (49 loc) · 3.05 KB
/
dragdrop.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>IIIF Drag-n-drop demo -- Source</title>
<link rel="stylesheet" href="css/main.css"/>
</head>
<body>
<h1>IIIF Drag-n-drop demo -- Source</h1>
<p>See also <a href="http://zimeon.github.io/iiif-dragndrop/">notes on proposed drag and drop pattern</a>.</p>
<h3>e-codices manifest</h3>
<p>Imagine the following icon embedded in <a href="http://www.e-codices.unifr.ch/en/searchresult/list/one/kba/0003">http://www.e-codices.unifr.ch/en/searchresult/list/one/kba/0003</a>. The icon is linked to a page which might explain the use of the IIIF drag-and-drop icon, the data used when the icon is dragged to an IIIF viewer is encoded as dummy query parameters:</p>
<ul>
<li><code>manifest</code> - URI of the manifest</li>
<li><code>canvas</code> - canvas id of the canvas to focus on (optional)</li>
</ul>
<p>
<a href="e-codices-help.html?manifest=http://www.e-codices.unifr.ch/metadata/iiif/kba-0003/manifest.json">
<img src="iiif-dragndrop-100px.png" alt="IIIF Drag-n-drop"/><br />
(no <code>canvas</code> setting)
</a>
</p>
<p>
<a href="e-codices-help.html?manifest=http://www.e-codices.unifr.ch/metadata/iiif/kba-0003/manifest.json&canvas=http://www.e-codices.unifr.ch/metadata/iiif/kba-0003/canvas/kba-0003_002r.json">
<img src="iiif-dragndrop-100px.png" alt="IIIF Drag-n-drop"/><br />
(<code>canvas</code> = <code>.../kba-0003_002r.json</code>)
</a>
</p>
<h3>Simgle image</h3>
<p>Imagine the following icon embedded in a splash page for the Van Gogh's "Self-Portrait Dedicated to Paul Gauguin" image. The icon is linked to a page which might explain the use of the IIIF drag-and-drop icon, the data used when the icon is dragged to an IIIF viewer is encoded as a dummy query parameter:</p>
<ul>
<li><code>image</code> - URI of the IIIF Image API <code>info.json</code></li>
</ul>
<p>
<a href="http://iiif.io/?image=https://images.harvardx.harvard.edu/ids/iiif/43182083/info.json">
<img src="iiif-dragndrop-100px.png" alt="IIIF Drag-n-drop"/>
</a>
</p>
<h3>Paste to drop</h3>
<p>What should happen if a URI is pasted into an IIIF application? One option would be to look at the content, see whether it is a URI, and if so then see whether it resolves to a manifest or an image information document. Test URIs:</p>
<ul>
<li><code><a href="http://www.e-codices.unifr.ch/metadata/iiif/kba-0003/manifest.json">http://www.e-codices.unifr.ch/metadata/iiif/kba-0003/manifest.json</a></code> - manifest for e-codices example above.</li>
</ul>
<ul>
<li><code><a href="https://images.harvardx.harvard.edu/ids/iiif/43182083/info.json">https://images.harvardx.harvard.edu/ids/iiif/43182083/info.json</a></code> - image information for Van Gogh self-portrait (from HarvardX).</li>
<li><code><a href="http://beta.wdl.org/media/iiif/1,1,1/info.json">http://beta.wdl.org/media/iiif/1,1,1/info.json</a></code> - image information for Lincoln at Antietam (from World Digital Library).</li>
</ul>
</body>
</html>