Recipe #229: Behavior with Ranges

_includes/links.md

@@ -53,6 +53,7 @@
 
 [0232]: {{ site.cookbook_url | absolute_url }}/recipe/0232-image-thumbnail-canvas/ "Implementation discussion: Thumbnails on Canvases"
 [0219]: {{ site.cookbook_url | absolute_url }}/recipe/0219-using-caption-file/ "Using Caption and Subtitle Files with Video Content"
+[0229]: {{ site.cookbook_url | absolute_url }}/recipe/0229-behavior-ranges/ "Two Uses of Behavior with Ranges"
 [0230]: {{ site.cookbook_url | absolute_url }}/recipe/0230-navdate/ "Navigation by Chronology"
 [0231]: {{ site.cookbook_url | absolute_url }}/recipe/0231-transcript-meta-recipe/ "Transcripts, Captions, and Subtitles - General Considerations"
 

index.md

@@ -100,6 +100,7 @@ _(leading on to segmentation examples later)_
 * [Table of Contents for Book Chapters][0024]
 * table of contents (ranges) - articles in a newspaper
 * [Table of contents for A/V content][0026] (26)
+* [Two Uses of Behavior with Ranges][0229]
 * Alternative Sequence (via `sequence` Range) (20,22,23)
 * `sequence` Range with partial canvases
 

recipe/0229-behavior-ranges/index.md

@@ -0,0 +1,49 @@
+---
+title: Two Uses of Behavior with Ranges
+id: 229
+layout: recipe
+tags: structure
+summary: "tbc"
+viewers:
+ - Annona
+ - Theseus
+ - Aviary
+ - Ramp
+topic: 
+ - structure
+---
+
+## Use Case
+
+In watching a single-file IIIF video resource you will display in a client, visitors could benefit from the ability to navigation within it visually, a bit like having thumbnail scrubbing. You're not able to segment the video, and you prefer visual navigation to a textual table of contents.
+
+## Implementation Notes
+
+The cookbook discusses elsewhere ways to use the `behavior` property for determining paging in a book ([simple book][0009] and [book `behavior` variations][0011]), [viewing direction for a visual resource][0010], [visibility of `tagging` Annotations][0021], tables of contents ([chapters][0024], [an opera on one canvas][0064], and [an opera on multiple canvases][0065]), [collection structure of a multi-volume work][0030], and how to indicate [an alternate view of book contents][0035] such as for a foldout.
+
+This recipe shows two ways that `behavior` can serve in a Range to tell clients how navigation should work. (For a fuller discussion of Ranges, see [the Presentation API Range section][prezi3-range].) 
+
+One of the present ways to influence navigation behavior is to use the `no-nav` value, telling a client explicitly to not include a portion of the resource in navigation. When this value appears, whatever Canvases or portions of Canvases are used in the `items` part of the Range should not appear in the interface's navigation. The `id` of a Canvas in the `items` section indicates a Canvas from the Manifest's own `items` section or can be such an `id` with a bounding fragment for AV resources.
+
+The other value used in this recipe is the `thumbnail-nav` value, which directs the consuming client to present an alternate, visual navigation structure using the thumbnail(s) with this `behavior` value. The API is quite clear that a traditional table of contents is not the place to put this visual navigation. Something more akin to thumbnail scrubbing is the metaphor to aim for. This can work with AV resources, where thumbnails might be put along a timeline to represent key moments a viewer might want to use in navigation. It can also be used with still images, where thumbnails might be employed usefully to navigate very large images (long, tall, or both dimensions). For those large still images, thumbnail based navigation — independent of the manifest's Canvases' thumbnails — may be arranged in any way that presents a helpful experience.
+
+Note that `behavior` values are inherited. In order to determine the behaviors governing a particular resource, [there are four inheritance rules to observe](https://iiif.io/api/presentation/3.0/#behavior), two of which apply to Ranges:
++ Canvases inherit behaviors from their referencing Manifest, but DO NOT inherit behaviors from any referencing Ranges, as there might be several with different behaviors.
++ Ranges inherit behaviors from any referencing Range and referencing Manifest.
+
+## Restrictions
+
+None known.
+
+## Example
+
+This example uses a video (roughly 55 minutes long) of a live opera performance. The first nine seconds of the video are marked, in the first subsidiary Range, with `no-nav` because they contain no meaningful video and audio. Subsequent peer Ranges divide the video into ten segments, each assigned a `thumbnail` property and a thumbnail image. While in an authentic environment these might be created from moments that are structurally, semantically, pedagogically, or otherwise significant, here they are merely an equal amount of running time except for the final one.
+
+{% include manifest_links.html manifest="manifest.json" %}
+
+{% include jsonviewer.html src="manifest.json" config='data-line="78,83"'%}
+
+## Related Recipes
+
+{% include links.md %}
+

recipe/0229-behavior-ranges/manifest.json

@@ -0,0 +1,271 @@
+{
+    "@context": [ "http://iiif.io/api/presentation/3/context.json" ],
+    "id": "{{ id.url }} ",
+    "type": "Manifest",
+    "label": { 
+        "en": ["Video navigation with thumbnails in a Range"]
+    },
+  "metadata": [
+    {
+      "label": { "en": ["Date Issued"] },
+      "value": { "en": ["2019"] }
+    },
+    {
+      "label": { "en": ["Publisher"] },
+      "value": { "en": ["Indiana University Jacobs School of Music"] }
+    }
+  ],
+  "items": [
+    {
+      "id": "{{ id.path }}/canvas/1",
+      "type": "Canvas",
+      "height": 1080,
+      "width": 1920,
+      "duration": 3307.22,
+      "items": [
+        {
+          "id": "{{ id.path }}/canvas/1/annotation_page/1",
+          "type": "AnnotationPage",
+          "items": [
+            {
+              "id": "{{ id.path }}/canvas/1/annotation_page/1/annotation/2",
+              "type": "Annotation",
+              "motivation": "painting",
+              "body": {
+                "id": "https://fixtures.iiif.io/video/indiana/donizetti-elixir/vae0637_accessH264_low_act_2.mp4",
+                "type": "Video",
+                "format": "video/mp4",
+                "height": 1080,
+                "width": 1920,
+                "duration": 3307.22
+              },
+              "target": "{{ id.path }}/canvas/1"
+            }
+          ]
+        }
+      ]
+    }
+  ],
+  "structures": [
+    {
+      "id": "{{ id.path }}/range/1",
+      "type": "Range",
+      "label": { "en": [ "Alternate Thumbnail Navigation" ] },
+      "behavior": "thumbnail-nav",
+      "items": [
+        {
+          "type": "Range",
+          "id": "{{ id.path }}/range/1.1",
+          "behavior": "no-nav",
+          "items": [
+            {
+              "type": "Canvas",
+              "id": "{{ id.path }}/canvas/1#t=0,9"
+            }
+          ]
+        },
+        {
+          "type": "Range",
+          "id": "{{ id.path }}/range/2",
+          "label": { "en": [ "Start – 305s" ] },
+          "items": [
+            {
+              "type": "Canvas",
+              "id": "{{ id.path }}/canvas/1#t=9,305"
+            }
+          ],
+		  "thumbnail": [
+			{
+			  "id": "https://fixtures.iiif.io/video/indiana/donizetti-elixir/thumbnails/thumb-nav-01.png",
+			  "type": "Image",
+			  "format": "image/png",
+			  "width": 2250,
+			  "height": 1266
+			}
+		  ]
+        },
+        {
+          "type": "Range",
+          "id": "{{ id.path }}/range/3",
+          "label": { "en": [ "305s – 610s" ] },
+          "items": [
+            {
+              "type": "Canvas",
+              "id": "{{ id.path }}/canvas/1#t=305,610"
+            }
+          ],
+		  "thumbnail": [
+			{
+			  "id": "https://fixtures.iiif.io/video/indiana/donizetti-elixir/thumbnails/thumb-nav-02.png",
+			  "type": "Image",
+			  "format": "image/png",
+			  "width": 2250,
+			  "height": 1266
+			}
+		  ]
+        },
+        {
+          "type": "Range",
+          "id": "{{ id.path }}/range/4",
+          "label": { "en": [ "610s – 915s" ] },
+          "items": [
+            {
+              "type": "Canvas",
+              "id": "{{ id.path }}/canvas/1#t=610,915"
+            }
+          ],
+		  "thumbnail": [
+			{
+			  "id": "https://fixtures.iiif.io/video/indiana/donizetti-elixir/thumbnails/thumb-nav-03.png",
+			  "type": "Image",
+			  "format": "image/png",
+			  "width": 2250,
+			  "height": 1266
+			}
+		  ]
+        },
+        {
+          "type": "Range",
+          "id": "{{ id.path }}/range/5",
+          "label": { "en": [ "915s – 1220s" ] },
+          "items": [
+            {
+              "type": "Canvas",
+              "id": "{{ id.path }}/canvas/1#t=915,1220"
+            }
+          ],
+		  "thumbnail": [
+			{
+			  "id": "https://fixtures.iiif.io/video/indiana/donizetti-elixir/thumbnails/thumb-nav-04.png",
+			  "type": "Image",
+			  "format": "image/png",
+			  "width": 2250,
+			  "height": 1266
+			}
+		  ]
+        },
+        {
+          "type": "Range",
+          "id": "{{ id.path }}/range/6",
+          "label": { "en": [ "1220s – 1525s" ] },
+          "items": [
+            {
+              "type": "Canvas",
+              "id": "{{ id.path }}/canvas/1#t=1220,1525"
+            }
+          ],
+		  "thumbnail": [
+			{
+			  "id": "https://fixtures.iiif.io/video/indiana/donizetti-elixir/thumbnails/thumb-nav-05.png",
+			  "type": "Image",
+			  "format": "image/png",
+			  "width": 2250,
+			  "height": 1266
+			}
+		  ]
+        },
+        {
+          "type": "Range",
+          "id": "{{ id.path }}/range/7",
+          "label": { "en": [ "1525s – 1830s" ] },
+          "items": [
+            {
+              "type": "Canvas",
+              "id": "{{ id.path }}/canvas/1#t=1525,1830"
+            }
+          ],
+		  "thumbnail": [
+			{
+			  "id": "https://fixtures.iiif.io/video/indiana/donizetti-elixir/thumbnails/thumb-nav-06.png",
+			  "type": "Image",
+			  "format": "image/png",
+			  "width": 2250,
+			  "height": 1266
+			}
+		  ]
+        },
+        {
+          "type": "Range",
+          "id": "{{ id.path }}/range/8",
+          "label": { "en": [ "1830s – 2135s" ] },
+          "items": [
+            {
+              "type": "Canvas",
+              "id": "{{ id.path }}/canvas/1#t=1830,2135"
+            }
+          ],
+		  "thumbnail": [
+			{
+			  "id": "https://fixtures.iiif.io/video/indiana/donizetti-elixir/thumbnails/thumb-nav-07.png",
+			  "type": "Image",
+			  "format": "image/png",
+			  "width": 2250,
+			  "height": 1266
+
+			}
+		  ]
+        },
+        {
+          "type": "Range",
+          "id": "{{ id.path }}/range/9",
+          "label": { "en": [ "2135s – 2440s" ] },
+          "items": [
+            {
+              "type": "Canvas",
+              "id": "{{ id.path }}/canvas/1#t=2135,2440"
+            }
+          ],
+		  "thumbnail": [
+			{
+			  "id": "https://fixtures.iiif.io/video/indiana/donizetti-elixir/thumbnails/thumb-nav-08.png",
+			  "type": "Image",
+			  "format": "image/png",
+			  "width": 2250,
+			  "height": 1266
+			}
+		  ]
+        },
+        {
+          "type": "Range",
+          "id": "{{ id.path }}/range/10",
+          "label": { "en": [ "2440s – 2745s" ] },
+          "items": [
+            {
+              "type": "Canvas",
+              "id": "{{ id.path }}/canvas/1#t=2440,2745"
+            }
+          ],
+		  "thumbnail": [
+			{
+			  "id": "https://fixtures.iiif.io/video/indiana/donizetti-elixir/thumbnails/thumb-nav-09.png",
+			  "type": "Image",
+			  "format": "image/png",
+			  "width": 2250,
+			  "height": 1266
+			}
+		  ]
+        },
+        {
+          "type": "Range",
+          "id": "{{ id.path }}/range/11",
+          "label": { "en": [ "2745s – end" ] },
+          "items": [
+            {
+              "type": "Canvas",
+              "id": "{{ id.path }}/canvas/1#t=2745,3307.22"
+            }
+          ],
+		  "thumbnail": [
+			{
+			  "id": "https://fixtures.iiif.io/video/indiana/donizetti-elixir/thumbnails/thumb-nav-10.png",
+			  "type": "Image",
+			  "format": "image/png",
+			  "width": 2250,
+			  "height": 1266
+			}
+		  ]
+        }
+      ]
+    }
+  ]
+}