diff --git a/src/content-handlers/iiif/modules/uv-mediaelementcenterpanel-module/MediaElementCenterPanel.ts b/src/content-handlers/iiif/modules/uv-mediaelementcenterpanel-module/MediaElementCenterPanel.ts index d7f19e128..33ed624fb 100644 --- a/src/content-handlers/iiif/modules/uv-mediaelementcenterpanel-module/MediaElementCenterPanel.ts +++ b/src/content-handlers/iiif/modules/uv-mediaelementcenterpanel-module/MediaElementCenterPanel.ts @@ -59,12 +59,32 @@ export class MediaElementCenterPanel extends CenterPanel< }); this.extensionHost.subscribe(IIIFEvents.SET_TARGET, (target: TFragment) => { - let t = target.t; + let t: number | [number, number] = target.t; if (Array.isArray(t)) { - t = t[0]; + if ((t as [number] | [number, number]).length === 1) { + t = t[0]; + } else { + const [startTime, endTime] = t; + + if (endTime <= startTime) { + console.error("endTime must be greater than startTime"); + return; + } + + this.player.setCurrentTime(startTime); + this.player.play(); + + const duration = (endTime - startTime) * 1000; + + setTimeout(() => { + this.player.pause(); + }, duration); + + return; + } } - that.player.setCurrentTime(t); - that.player.play(); + this.player.setCurrentTime(t); + this.player.play(); }); this.extensionHost.subscribe( @@ -107,7 +127,9 @@ export class MediaElementCenterPanel extends CenterPanel< canvas.getRenderings().forEach((rendering: Rendering) => { if (this.isTypeMedia(rendering)) { sources.push({ - label: rendering.getLabel().getValue() ?? rendering.getFormat().toString(), + label: + rendering.getLabel().getValue() ?? + rendering.getFormat().toString(), type: rendering.getFormat().toString(), src: rendering.id, }); @@ -292,10 +314,11 @@ export class MediaElementCenterPanel extends CenterPanel< appendTextTracks(subtitles: Array) { for (const subtitle of subtitles) { this.$media.append( - $(` + $(` `) ); }