cleanup

IIIF · May 29, 2024 · 2406f48 · 2406f48
1 parent e67f886
commit 2406f48
Show file tree

Hide file tree

Showing 8 changed files with 76 additions and 49 deletions.
diff --git a/dhsi/SUMMARY.md b/dhsi/SUMMARY.md
@@ -55,6 +55,7 @@
    3. [Annona](day-two/annona.md)
    4. [Clover](day-two/clover.md)
    5. [Navplace viewer](day-two/navplace.md)
+   6. [OpenSeadragon](day-two/openseadragon.md)
 2. [Work Period]((day-two/configuring-viewers.md#work-period))
 
 ## Wednesday, Session 7: 9:00am-10:15am

diff --git a/dhsi/day-one/image-hosting.md b/dhsi/day-one/image-hosting.md
@@ -6,9 +6,9 @@ Please make sure you have a [GitHub account](https://github.com) created.
 
 ## Methods for Image Hosting
 
-1. [IIIF workbench](day-one/workbench.html)
-2. [Level 0 Static](day-one/level-0-static.html)
-3. [Cantaloupe](day-one/cantaloupe.html)
+1. [IIIF workbench](workbench.html)
+2. [Level 0 Static](level-0-static.html)
+3. [Cantaloupe](cantaloupe.html)
 
 ## Exercise
 

diff --git a/dhsi/day-three/annotorious-embed.html b/dhsi/day-three/annotorious-embed.html
@@ -0,0 +1,31 @@
+
+<!-- CSS stylesheet -->
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@recogito/[email protected]/dist/annotorious.min.css">
+
+<!-- JS -->
+<script src="https://cdnjs.cloudflare.com/ajax/libs/openseadragon/4.1.1/openseadragon.min.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/@recogito/[email protected]/dist/openseadragon-annotorious.min.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/@recogito/geotagging-widget@latest"></script>
+<script src="https://cdn.jsdelivr.net/npm/@recogito/annotorious-toolbar@latest/dist/annotorious-toolbar.min.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/@recogito/annotorious-selector-pack@latest/dist/annotorious-selector-pack.min.js"></script>
+<div id="my-toolbar-container"></div>
+<div id="openseadragon1" style="height: 500px"></div>
+
+<script>
+  window.onload = function() {
+    var viewer = OpenSeadragon({
+      id: "openseadragon1",
+      prefixUrl: "https://cdnjs.cloudflare.com/ajax/libs/openseadragon/4.1.1/images/",
+      tileSources: [
+        "https://stacks.stanford.edu/image/iiif/cg881nm5421/cg881nm5421_0001/info.json"
+      ]
+    });
+
+    var config = {widgets:  [{widget: 'COMMENT', editable: 'MINE_ONLY', purposeSelector: true},
+            {widget: 'TAG', vocabulary: ['example', 'list', 'tags']},
+            {widget: recogito.GeoTagging({defaultOrigin: [ 48, 16 ]})}], allowEmpty: true};
+    var anno = OpenSeadragon.Annotorious(viewer, config);
+    Annotorious.SelectorPack(anno);
+    Annotorious.Toolbar(anno, document.getElementById('my-toolbar-container'), {'withMouse': true});
+  }
+</script>
diff --git a/dhsi/day-three/annotorious.md b/dhsi/day-three/annotorious.md
@@ -4,35 +4,7 @@ Annotorious is a JS library you can easily build into a browser. Slightly differ
 ## Using Annotorious
 This view is making use of three plugins (toolbar, georeference and extended shapes beyond polygon and rectangle). Configuration is VERY well documented for the [out of the box Annotorious](https://annotorious.github.io/api-docs/osd-plugin/) including configuration and custom events and the [plugins](https://annotorious.github.io/plugins/). 
 
-<!-- CSS stylesheet -->
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@recogito/[email protected]/dist/annotorious.min.css">
-
-<!-- JS -->
-<script src="https://cdnjs.cloudflare.com/ajax/libs/openseadragon/4.1.1/openseadragon.min.js"></script>
-<script src="https://cdn.jsdelivr.net/npm/@recogito/[email protected]/dist/openseadragon-annotorious.min.js"></script>
-<script src="https://cdn.jsdelivr.net/npm/@recogito/geotagging-widget@latest"></script>
-<script src="https://cdn.jsdelivr.net/npm/@recogito/annotorious-toolbar@latest/dist/annotorious-toolbar.min.js"></script>
-<script src="https://cdn.jsdelivr.net/npm/@recogito/annotorious-selector-pack@latest/dist/annotorious-selector-pack.min.js"></script>
-<div id="my-toolbar-container"></div>
-<div id="openseadragon1" style="height: 600px"></div>
-
-<script>
-  var viewer = OpenSeadragon({
-    id: "openseadragon1",
-    prefixUrl: "https://cdnjs.cloudflare.com/ajax/libs/openseadragon/4.1.1/images/",
-    tileSources: [
-      "https://stacks.stanford.edu/image/iiif/cg881nm5421/cg881nm5421_0001/info.json"
-    ]
-  });
-
-  var config = {widgets:  [{widget: 'COMMENT', editable: 'MINE_ONLY', purposeSelector: true},
-          {widget: 'TAG', vocabulary: ['example', 'list', 'tags']},
-          {widget: recogito.GeoTagging({defaultOrigin: [ 48, 16 ]})}], allowEmpty: true};
-  var anno = OpenSeadragon.Annotorious(viewer, config);
-  Annotorious.SelectorPack(anno);
-  Annotorious.Toolbar(anno, document.getElementById('my-toolbar-container'), {'withMouse': true});
-</script>
-
+<iframe src="annotorious-embed.html" style="width: 100%; height: 600px">
 
 ```
 
@@ -49,19 +21,21 @@ This view is making use of three plugins (toolbar, georeference and extended sha
 <div id="openseadragon1" style="height: 600px"></div>
 
 <script>
-  var viewer = OpenSeadragon({
-    id: "openseadragon1",
-    prefixUrl: "https://cdnjs.cloudflare.com/ajax/libs/openseadragon/4.1.1/images/",
-    tileSources: [
-      "https://stacks.stanford.edu/image/iiif/cg881nm5421/cg881nm5421_0001/info.json"
-    ]
-  });
-
-  var config = {widgets:  [{widget: 'COMMENT', editable: 'MINE_ONLY', purposeSelector: true},
-          {widget: 'TAG', vocabulary: ['example', 'list', 'tags']},
-          {widget: recogito.GeoTagging({defaultOrigin: [ 48, 16 ]})}], allowEmpty: true};
-  var anno = OpenSeadragon.Annotorious(viewer, config);
-  Annotorious.SelectorPack(anno);
-  Annotorious.Toolbar(anno, document.getElementById('my-toolbar-container'), {'withMouse': true});
+  window.onload = function() {
+    var viewer = OpenSeadragon({
+      id: "openseadragon1",
+      prefixUrl: "https://cdnjs.cloudflare.com/ajax/libs/openseadragon/4.1.1/images/",
+      tileSources: [
+        "https://stacks.stanford.edu/image/iiif/cg881nm5421/cg881nm5421_0001/info.json"
+      ]
+    });
+
+    var config = {widgets:  [{widget: 'COMMENT', editable: 'MINE_ONLY', purposeSelector: true},
+            {widget: 'TAG', vocabulary: ['example', 'list', 'tags']},
+            {widget: recogito.GeoTagging({defaultOrigin: [ 48, 16 ]})}], allowEmpty: true};
+    var anno = OpenSeadragon.Annotorious(viewer, config);
+    Annotorious.SelectorPack(anno);
+    Annotorious.Toolbar(anno, document.getElementById('my-toolbar-container'), {'withMouse': true});
+  }
 </script>
 ```
diff --git a/dhsi/day-two/annona.md b/dhsi/day-two/annona.md
@@ -55,4 +55,8 @@ Annona only works with images. It also works with IIIF collections and annotatio
 
 <iiif-storyboard url='https://iiif.bodleian.ox.ac.uk/iiif/manifest/748a9d50-5a3a-440e-ab9d-567dd68b6abb.json' styling='startCanvas: 47;toggleoverlay: true;perpage: 1;continousboard: true;index: 0;fit: vertical;overlaycolor: #2ad222;activecolor: #FFFF00;textposition: right;'></iiif-storyboard>
 
+## String Manifests
+Annona allows you to enter your manifests or annotations in [base64 encoded data uri or as raw json.](https://ncsu-libraries.github.io/annona/nourls/)
+
+Additionally the tag builder will take your raw JSON entered into the form element with the value `Annotation JSON to be used instead of annotation URL; Will convert to data URI.` and will take your raw JSON and convert it into base64 encoded dataURI.
 
diff --git a/dhsi/day-two/clover.md b/dhsi/day-two/clover.md
@@ -1,6 +1,7 @@
 # Clover
 
 ## Embedding clover
+Clover isn't particularly configurable using Vanilla JS. If you would like more customizable options you will have to use it with React. [https://samvera-labs.github.io/clover-iiif](https://samvera-labs.github.io/clover-iiif) has all the options avaliable for Clover with React.
 
 ```
 <html>
@@ -16,4 +17,10 @@
     />
   </body>
 </html>
-```
+```
+
+<script src="https://www.unpkg.com/@samvera/clover-iiif@latest/dist/web-components/index.umd.js"></script>
+
+<clover-viewer
+  id="https://api.dc.library.northwestern.edu/api/v2/works/8a833741-74a8-40dc-bd1d-c416a3b1bb38?as=iiif" 
+/>
diff --git a/dhsi/day-two/navplace.md b/dhsi/day-two/navplace.md
@@ -3,7 +3,7 @@ The Navplace viewer requires a navPlace variable in your manifest or canvas(es).
 
 ## NavPlace
 ```
-https://map.rerum.io/?iiif-content=[your_manifest_url]
+<iframe style="width: 100%; min-height: 600px" src="https://map.rerum.io/?iiif-content=[your_manifest_url]"></iframe>
 ```
 
 <iframe style="width: 100%; min-height: 600px" src="https://map.rerum.io/?iiif-content=https://iiif.io/api/cookbook/recipe/0240-navPlace-on-canvases/manifest.json"></iframe>
diff --git a/dhsi/day-two/publishing-manifests.md b/dhsi/day-two/publishing-manifests.md
@@ -1 +1,11 @@
-placeholder
+# Publishing IIIF Manifest
+The next section is going to go over three ways of making a manifest visible via a web url.
+
+## Methods for publishing
+
+1. [Local Server](visual_studio_setup)
+2. [Level 0 Static](workbench)
+3. [Cantaloupe](github-publishing.html)
+
+# Exercise
+Chose one of the methods for publishing your manifest.