From 3f3008f180d6530901a96810d31030c02871fe11 Mon Sep 17 00:00:00 2001
From: edsilv <e.silverton@gmail.com>
Date: Thu, 13 Sep 2018 11:37:13 +0100
Subject: [PATCH] added public reset method

---
 dist/iiif-av-component.bundle.js | 4 ++--
 dist/iiif-av-component.d.ts      | 3 ++-
 dist/iiif-av-component.js        | 5 ++++-
 dist/iiif-av-component.min.js    | 6 +++---
 examples/js/iiif-av-component.js | 5 ++++-
 package.json                     | 2 +-
 src/AVComponent.ts               | 4 ++++
 7 files changed, 20 insertions(+), 9 deletions(-)

diff --git a/dist/iiif-av-component.bundle.js b/dist/iiif-av-component.bundle.js
index 9acbf79..434a99d 100644
--- a/dist/iiif-av-component.bundle.js
+++ b/dist/iiif-av-component.bundle.js
@@ -60,5 +60,5 @@ var _Components;
 }).call(this,typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {})
 },{}]},{},[1])(1)
 });
-!function(f){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=f();else if("function"==typeof define&&define.amd)define([],f);else{var g;g="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:this,g.iiifAvComponent=f()}}(function(){return function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c="function"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error("Cannot find module '"+i+"'");throw a.code="MODULE_NOT_FOUND",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u="function"==typeof require&&require,i=0;i<t.length;i++)o(t[i]);return o}return r}()({1:[function(require,module,exports){(function(global){var IIIFComponents,__extends=this&&this.__extends||function(){var extendStatics=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(d,b){d.__proto__=b}||function(d,b){for(var p in b)b.hasOwnProperty(p)&&(d[p]=b[p])};return function(d,b){function __(){this.constructor=d}extendStatics(d,b),d.prototype=null===b?Object.create(b):(__.prototype=b.prototype,new __)}}();!function(IIIFComponents){var AVComponent=function(_super){function AVComponent(options){var _this=_super.call(this,options)||this;return _this._data=_this.data(),_this.canvasInstances=[],_this._readyMedia=0,_this._readyWaveforms=0,_this._posterCanvasWidth=0,_this._posterCanvasHeight=0,_this._posterImageExpanded=!1,_this._init(),_this._resize(),_this}return __extends(AVComponent,_super),AVComponent.prototype._init=function(){var success=_super.prototype._init.call(this);return success||console.error("Component failed to initialise"),success},AVComponent.prototype.data=function(){return{autoPlay:!1,constrainNavigationToRange:!1,defaultAspectRatio:.56,doubleClickMS:350,halveAtWidth:200,limitToRange:!1,posterImageRatio:.3,virtualCanvasEnabled:!0,content:{currentTime:"Current Time",collapse:"Collapse",duration:"Duration",expand:"Expand",mute:"Mute",next:"Next",pause:"Pause",play:"Play",previous:"Previous",unmute:"Unmute"}}},AVComponent.prototype.set=function(data){var _this=this,oldData=Object.assign({},this._data);this._data=Object.assign(this._data,data);var diff=IIIFComponents.AVComponentUtils.Utils.diff(oldData,this._data);if(diff.includes("helper")&&this._reset(),!this._data.helper)return void console.warn("must pass a helper object");if(diff.includes("limitToRange")&&this._data.canvasId&&this.canvasInstances.forEach(function(canvasInstance,index){canvasInstance.set({limitToRange:_this._data.limitToRange})}),diff.includes("constrainNavigationToRange")&&this._data.canvasId&&this.canvasInstances.forEach(function(canvasInstance,index){canvasInstance.set({constrainNavigationToRange:_this._data.constrainNavigationToRange})}),diff.includes("autoSelectRange")&&this._data.canvasId&&this.canvasInstances.forEach(function(canvasInstance,index){canvasInstance.set({autoSelectRange:_this._data.autoSelectRange})}),diff.includes("canvasId")&&this._data.canvasId){var nextCanvasInstance_1=this._getCanvasInstanceById(this._data.canvasId);nextCanvasInstance_1&&this.canvasInstances.forEach(function(canvasInstance){canvasInstance.getCanvasId()!==nextCanvasInstance_1.getCanvasId()?canvasInstance.set({visible:!1}):diff.includes("range")?canvasInstance.set({visible:!0,range:_this._data.range?jQuery.extend(!0,{},_this._data.range):void 0}):canvasInstance.set({visible:!0})})}if(diff.includes("virtualCanvasEnabled")&&(this.set({range:void 0}),this._data.virtualCanvasEnabled&&this.canvasInstances.forEach(function(canvasInstance){canvasInstance.isVirtual()&&_this.set({canvasId:canvasInstance.getCanvasId(),range:void 0})})),diff.includes("range")&&this._data.range){var range=this._data.helper.getRangeById(this._data.range.id);if(range){var canvasId=IIIFComponents.AVComponentUtils.Utils.getFirstTargetedCanvasId(range);if(canvasId){var canvasInstance=this._getCanvasInstanceById(canvasId);if(canvasInstance){if(canvasInstance.isVirtual()&&this._data.virtualCanvasEnabled&&canvasInstance.includesVirtualSubCanvas(canvasId)){canvasId=canvasInstance.getCanvasId();for(var i=0;i<canvasInstance.ranges.length;i++){var r=canvasInstance.ranges[i];if(r.id===range.id){range=r;break}}}this._data.canvasId&&(this._data.canvasId.includes("://")?Manifesto.Utils.normaliseUrl(this._data.canvasId):this._data.canvasId)!==canvasId?this.set({canvasId:canvasId,range:jQuery.extend(!0,{},range)}):canvasInstance.set({range:jQuery.extend(!0,{},range)})}}}else console.warn("range not found")}this._render(),this._resize()},AVComponent.prototype._render=function(){},AVComponent.prototype._reset=function(){var _this=this;if(this.canvasInstances.forEach(function(canvasInstance,index){canvasInstance.destroy()}),this.canvasInstances=[],this._$element.empty(),this._data&&this._data.helper){var behavior=this._data.helper.manifest.getBehavior(),canvases=this._getCanvases();if(behavior&&behavior.toString()===manifesto.Behavior.autoadvance().toString()){var virtualCanvas_1=new IIIFComponents.AVComponentObjects.VirtualCanvas;canvases.forEach(function(canvas){virtualCanvas_1.addCanvas(canvas)}),this._initCanvas(virtualCanvas_1)}canvases.forEach(function(canvas){_this._initCanvas(canvas)}),this.canvasInstances.length>0&&(this._data.canvasId=this.canvasInstances[0].getCanvasId()),this._checkAllMediaReadyInterval=setInterval(this._checkAllMediaReady.bind(this),100),this._checkAllWaveformsReadyInterval=setInterval(this._checkAllWaveformsReady.bind(this),100),this._$posterContainer=$('<div class="poster-container"></div>'),this._$element.append(this._$posterContainer),this._$posterImage=$('<div class="poster-image"></div>'),this._$posterExpandButton=$('\n                    <button class="btn" title="'+(this._data&&this._data.content?this._data.content.expand:"")+'">\n                        <i class="av-icon  av-icon-expand expand" aria-hidden="true"></i><span>'+(this._data&&this._data.content?this._data.content.expand:"")+"</span>\n                    </button>\n                "),this._$posterImage.append(this._$posterExpandButton),this._$posterImage.on("touchstart click",function(e){e.preventDefault();var target=_this._getPosterImageCss(!_this._posterImageExpanded);if(_this._$posterImage.animate(target),_this._posterImageExpanded=!_this._posterImageExpanded,_this._posterImageExpanded){var label=_this.options.data.content.collapse;_this._$posterExpandButton.prop("title",label),_this._$posterExpandButton.find("i").switchClass("expand","collapse")}else{var label=_this.options.data.content.expand;_this._$posterExpandButton.prop("title",label),_this._$posterExpandButton.find("i").switchClass("collapse","expand")}});var posterCanvas=this._data.helper.getPosterCanvas();if(posterCanvas){this._posterCanvasWidth=posterCanvas.getWidth(),this._posterCanvasHeight=posterCanvas.getHeight();var posterImage=this._data.helper.getPosterImage();if(posterImage){this._$posterContainer.append(this._$posterImage);var css=this._getPosterImageCss(this._posterImageExpanded);css=Object.assign({},css,{"background-image":"url("+posterImage+")"}),this._$posterImage.css(css)}}}},AVComponent.prototype._checkAllMediaReady=function(){console.log("loading media"),this._readyMedia===this.canvasInstances.length&&(console.log("all media ready"),clearInterval(this._checkAllMediaReadyInterval),this.fire(AVComponent.Events.MEDIA_READY),this.resize())},AVComponent.prototype._checkAllWaveformsReady=function(){console.log("loading waveforms"),this._readyWaveforms===this._getCanvasInstancesWithWaveforms().length&&(console.log("waveforms ready"),clearInterval(this._checkAllWaveformsReadyInterval),this.fire(AVComponent.Events.WAVEFORMS_READY),this.resize())},AVComponent.prototype._getCanvasInstancesWithWaveforms=function(){return this.canvasInstances.filter(function(c){return c.waveforms.length>0})},AVComponent.prototype._getCanvases=function(){return this._data.helper?this._data.helper.getCanvases():[]},AVComponent.prototype._initCanvas=function(canvas){var _this=this,canvasInstance=new IIIFComponents.CanvasInstance({target:document.createElement("div"),data:Object.assign({},{canvas:canvas},this._data)});canvasInstance.logMessage=this._logMessage.bind(this),this._$element.append(canvasInstance.$playerElement),canvasInstance.init(),this.canvasInstances.push(canvasInstance),canvasInstance.on(AVComponent.Events.MEDIA_READY,function(){_this._readyMedia++},!1),canvasInstance.on(AVComponent.Events.WAVEFORM_READY,function(){_this._readyWaveforms++},!1),canvasInstance.on(IIIFComponents.AVComponentCanvasInstance.Events.PREVIOUS_RANGE,function(){_this._prevRange()},!1),canvasInstance.on(IIIFComponents.AVComponentCanvasInstance.Events.NEXT_RANGE,function(){_this._nextRange()},!1),canvasInstance.on(AVComponent.Events.RANGE_CHANGED,function(rangeId){_this.fire(AVComponent.Events.RANGE_CHANGED,rangeId)},!1),canvasInstance.on(IIIFComponents.AVVolumeControl.Events.VOLUME_CHANGED,function(volume){_this._setCanvasInstanceVolumes(volume),_this.fire(IIIFComponents.AVVolumeControl.Events.VOLUME_CHANGED,volume)},!1)},AVComponent.prototype._prevRange=function(){if(this._data&&this._data.helper){var prevRange=this._data.helper.getPreviousRange();prevRange?this.playRange(prevRange.id):this._rewind()}},AVComponent.prototype._nextRange=function(){if(this._data&&this._data.helper){var nextRange=this._data.helper.getNextRange();nextRange&&this.playRange(nextRange.id)}},AVComponent.prototype._setCanvasInstanceVolumes=function(volume){this.canvasInstances.forEach(function(canvasInstance){canvasInstance.set({volume:volume})})},AVComponent.prototype._getCanvasInstanceById=function(canvasId){if(canvasId=canvasId.includes("://")?Manifesto.Utils.normaliseUrl(canvasId):canvasId,this._data.virtualCanvasEnabled)for(var i=0;i<this.canvasInstances.length;i++){var canvasInstance=this.canvasInstances[i];if(canvasInstance.isVirtual()&&canvasInstance.getCanvasId()===canvasId||canvasInstance.includesVirtualSubCanvas(canvasId))return canvasInstance}else for(var i=0;i<this.canvasInstances.length;i++){var canvasInstance=this.canvasInstances[i],id=canvasInstance.getCanvasId();if(id){var canvasInstanceId=Manifesto.Utils.normaliseUrl(id);if(canvasInstanceId===canvasId)return canvasInstance}}},AVComponent.prototype._getCurrentCanvas=function(){if(this._data.canvasId)return this._getCanvasInstanceById(this._data.canvasId)},AVComponent.prototype._rewind=function(){if(!this._data.limitToRange){var canvasInstance=this._getCurrentCanvas();canvasInstance&&canvasInstance.set({range:void 0})}},AVComponent.prototype.play=function(){var currentCanvas=this._getCurrentCanvas();currentCanvas&&currentCanvas.play()},AVComponent.prototype.pause=function(){var currentCanvas=this._getCurrentCanvas();currentCanvas&&currentCanvas.pause()},AVComponent.prototype.playRange=function(rangeId){if(this._data.helper){var range=this._data.helper.getRangeById(rangeId);range&&this.set({range:jQuery.extend(!0,{},range)})}},AVComponent.prototype.showCanvas=function(canvasId){var currentCanvas=this._getCurrentCanvas();currentCanvas&&currentCanvas.getCanvasId()===canvasId&&!currentCanvas.isVisible()?currentCanvas.set({visible:!0}):this.set({canvasId:canvasId})},AVComponent.prototype._logMessage=function(message){this.fire(AVComponent.Events.LOG,message)},AVComponent.prototype._getPosterImageCss=function(expanded){var currentCanvas=this._getCurrentCanvas();if(currentCanvas){var $options=currentCanvas.$playerElement.find(".options-container"),containerWidth=currentCanvas.$playerElement.parent().width(),containerHeight=currentCanvas.$playerElement.parent().height()-$options.height();if(expanded)return{top:0,left:0,width:containerWidth,height:containerHeight};var ratio=void 0,width=void 0,height=void 0;return this._posterCanvasWidth>this._posterCanvasHeight?(ratio=this._posterCanvasHeight/this._posterCanvasWidth,width=containerWidth*this._data.posterImageRatio,height=width*ratio):(ratio=this._posterCanvasWidth/this._posterCanvasHeight,height=containerHeight*this._data.posterImageRatio,width=height*ratio),{top:0,left:containerWidth-width,width:width,height:height}}return null},AVComponent.prototype.resize=function(){this.canvasInstances.forEach(function(canvasInstance){canvasInstance.resize()});var currentCanvas=this._getCurrentCanvas();currentCanvas&&this._$posterImage&&this._$posterImage.is(":visible")&&(this._posterImageExpanded?this._$posterImage.css(this._getPosterImageCss(!0)):this._$posterImage.css(this._getPosterImageCss(!1)))},AVComponent}(_Components.BaseComponent);IIIFComponents.AVComponent=AVComponent}(IIIFComponents||(IIIFComponents={})),function(IIIFComponents){var AVComponent;!function(AVComponent){var Events=function(){function Events(){}return Events.MEDIA_READY="mediaready",Events.LOG="log",Events.RANGE_CHANGED="rangechanged",Events.WAVEFORM_READY="waveformready",Events.WAVEFORMS_READY="waveformsready",Events}();AVComponent.Events=Events}(AVComponent=IIIFComponents.AVComponent||(IIIFComponents.AVComponent={}))}(IIIFComponents||(IIIFComponents={})),function(g){g.IIIFComponents?g.IIIFComponents.AVComponent=IIIFComponents.AVComponent:g.IIIFComponents=IIIFComponents}(global);var IIIFComponents,__extends=this&&this.__extends||function(){var extendStatics=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(d,b){d.__proto__=b}||function(d,b){for(var p in b)b.hasOwnProperty(p)&&(d[p]=b[p])};return function(d,b){function __(){this.constructor=d}extendStatics(d,b),d.prototype=null===b?Object.create(b):(__.prototype=b.prototype,new __)}}();!function(IIIFComponents){var AVVolumeControl=function(_super){function AVVolumeControl(options){var _this=_super.call(this,options)||this;return _this._lastVolume=1,_this._data={volume:1},_this._init(),_this._resize(),_this}return __extends(AVVolumeControl,_super),AVVolumeControl.prototype._init=function(){var _this=this,success=_super.prototype._init.call(this);success||console.error("Component failed to initialise"),this._$volumeMute=$('\n                                <button class="btn volume-mute" title="'+this.options.data.content.mute+'">\n                                    <i class="av-icon av-icon-mute on" aria-hidden="true"></i>'+this.options.data.content.mute+"\n                                </button>"),this._$volumeSlider=$('<div class="volume-slider"></div>'),this._$element.append(this._$volumeMute,this._$volumeSlider);var that=this;return this._$volumeMute.on("touchstart click",function(e){e.preventDefault(),0!==_this._data.volume?(_this._lastVolume=_this._data.volume,_this._data.volume=0):_this._data.volume=_this._lastVolume,_this.fire(AVVolumeControl.Events.VOLUME_CHANGED,_this._data.volume)}),this._$volumeSlider.slider({value:that._data.volume,step:.1,orientation:"horizontal",range:"min",min:0,max:1,animate:!1,create:function(evt,ui){},slide:function(evt,ui){that._data.volume=ui.value,0===that._data.volume&&(that._lastVolume=0),that.fire(AVVolumeControl.Events.VOLUME_CHANGED,that._data.volume)},stop:function(evt,ui){}}),success},AVVolumeControl.prototype.set=function(data){this._data=Object.assign(this._data,data),this._render()},AVVolumeControl.prototype._render=function(){if(void 0!==this._data.volume)if(this._$volumeSlider.slider({value:this._data.volume}),0===this._data.volume){var label=this.options.data.content.unmute;this._$volumeMute.prop("title",label),this._$volumeMute.find("i").switchClass("on","off")}else{var label=this.options.data.content.mute;this._$volumeMute.prop("title",label),this._$volumeMute.find("i").switchClass("off","on")}},AVVolumeControl.prototype._resize=function(){},AVVolumeControl}(_Components.BaseComponent);IIIFComponents.AVVolumeControl=AVVolumeControl}(IIIFComponents||(IIIFComponents={})),function(IIIFComponents){var AVVolumeControl;!function(AVVolumeControl){var Events=function(){function Events(){}return Events.VOLUME_CHANGED="volumechanged",Events}();AVVolumeControl.Events=Events}(AVVolumeControl=IIIFComponents.AVVolumeControl||(IIIFComponents.AVVolumeControl={}))}(IIIFComponents||(IIIFComponents={}));var IIIFComponents,__extends=this&&this.__extends||function(){var extendStatics=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(d,b){d.__proto__=b}||function(d,b){for(var p in b)b.hasOwnProperty(p)&&(d[p]=b[p])};return function(d,b){function __(){this.constructor=d}extendStatics(d,b),d.prototype=null===b?Object.create(b):(__.prototype=b.prototype,new __)}}();!function(IIIFComponents){var CanvasInstance=function(_super){function CanvasInstance(options){var _this=_super.call(this,options)||this;return _this._canvasClockFrequency=25,_this._canvasClockStartDate=0,_this._canvasClockTime=0,_this._canvasHeight=0,_this._canvasWidth=0,_this._data=_this.data(),_this._highPriorityFrequency=25,_this._isPlaying=!1,_this._isStalled=!1,_this._lowPriorityFrequency=250,_this._mediaSyncMarginSecs=1,_this._rangeSpanPadding=.25,_this._readyMediaCount=0,_this._stallRequestedBy=[],_this._wasPlaying=!1,_this.ranges=[],_this.waveforms=[],_this._scaleY=function(amplitude,height){var range=256;return Math.max(_this._data.waveformBarWidth,amplitude*height/range)},_this._data=_this.options.data,_this.$playerElement=$('<div class="player"></div>'),_this}return __extends(CanvasInstance,_super),CanvasInstance.prototype.init=function(){var _this=this;if(!this._data||!this._data.content||!this._data.canvas)return void console.warn("unable to initialise, missing canvas or content");this._$hoverPreviewTemplate=$('<div class="hover-preview"><div class="label"></div><div class="pointer"><span class="arrow"></span></div></div>'),this._$canvasContainer=$('<div class="canvas-container"></div>'),this._$optionsContainer=$('<div class="options-container"></div>'),this._$rangeTimelineContainer=$('<div class="range-timeline-container"></div>'),this._$canvasTimelineContainer=$('<div class="canvas-timeline-container"></div>'),this._$canvasHoverPreview=this._$hoverPreviewTemplate.clone(),this._$canvasHoverHighlight=$('<div class="hover-highlight"></div>'),this._$rangeHoverPreview=this._$hoverPreviewTemplate.clone(),this._$rangeHoverHighlight=$('<div class="hover-highlight"></div>'),this._$durationHighlight=$('<div class="duration-highlight"></div>'),this._$timelineItemContainer=$('<div class="timeline-item-container"></div>'),this._$controlsContainer=$('<div class="controls-container"></div>'),this._$prevButton=$('\n                                <button class="btn" title="'+this._data.content.previous+'">\n                                    <i class="av-icon av-icon-previous" aria-hidden="true"></i>'+this._data.content.previous+"\n                                </button>"),this._$playButton=$('\n                                <button class="btn" title="'+this._data.content.play+'">\n                                    <i class="av-icon av-icon-play play" aria-hidden="true"></i>'+this._data.content.play+"\n                                </button>"),this._$nextButton=$('\n                                <button class="btn" title="'+this._data.content.next+'">\n                                    <i class="av-icon av-icon-next" aria-hidden="true"></i>'+this._data.content.next+"\n                                </button>"),this._$timeDisplay=$('<div class="time-display"><span class="canvas-time"></span> / <span class="canvas-duration"></span></div>'),this._$canvasTime=this._$timeDisplay.find(".canvas-time"),this._$canvasDuration=this._$timeDisplay.find(".canvas-duration"),this.isVirtual()&&this.$playerElement.addClass("virtual");var $volume=$('<div class="volume"></div>');if(this._volume=new IIIFComponents.AVVolumeControl({target:$volume[0],data:Object.assign({},this._data)}),this._volume.on(IIIFComponents.AVVolumeControl.Events.VOLUME_CHANGED,function(value){_this.fire(IIIFComponents.AVVolumeControl.Events.VOLUME_CHANGED,value)},!1),this._$controlsContainer.append(this._$prevButton,this._$playButton,this._$nextButton,this._$timeDisplay,$volume),this._$canvasTimelineContainer.append(this._$canvasHoverPreview,this._$canvasHoverHighlight,this._$durationHighlight),this._$rangeTimelineContainer.append(this._$rangeHoverPreview,this._$rangeHoverHighlight),this._$optionsContainer.append(this._$canvasTimelineContainer,this._$rangeTimelineContainer,this._$timelineItemContainer,this._$controlsContainer),this.$playerElement.append(this._$canvasContainer,this._$optionsContainer),this._$canvasHoverPreview.hide(),this._$rangeHoverPreview.hide(),this._data&&this._data.helper&&this._data.canvas){var ranges_1=[];this.isVirtual()?this._data.canvas.canvases.forEach(function(canvas){if(_this._data&&_this._data.helper){var r=_this._data.helper.getCanvasRanges(canvas),clonedRanges_1=[];r.forEach(function(range){var clonedRange=jQuery.extend(!0,{},range);if(clonedRanges_1.push(clonedRange),clonedRange.canvases&&clonedRange.canvases.length)for(var i=0;i<clonedRange.canvases.length;i++)clonedRange.canvases[i]=IIIFComponents.AVComponentUtils.Utils.retargetTemporalComponent(_this._data.canvas.canvases,clonedRange.__jsonld.items[i].id)}),ranges_1.push.apply(ranges_1,clonedRanges_1)}}):ranges_1=ranges_1.concat(this._data.helper.getCanvasRanges(this._data.canvas)),ranges_1.forEach(function(range){_this.ranges.push(range)})}var canvasWidth=this._data.canvas.getWidth(),canvasHeight=this._data.canvas.getHeight();canvasWidth?this._canvasWidth=canvasWidth:this._canvasWidth=this.$playerElement.parent().width(),canvasHeight?this._canvasHeight=canvasHeight:this._canvasHeight=this._canvasWidth*this._data.defaultAspectRatio;var that=this,prevClicks=0,prevTimeout=0;this._$prevButton.on("touchstart click",function(e){e.preventDefault(),prevClicks++,1===prevClicks?(_this._previous(!1),prevTimeout=setTimeout(function(){prevClicks=0,prevTimeout=0},_this._data.doubleClickMS)):(_this._previous(!0),clearTimeout(prevTimeout),prevClicks=0,prevTimeout=0)}),this._$playButton.on("touchstart click",function(e){e.preventDefault(),_this._isPlaying?_this.pause():_this.play()}),this._$nextButton.on("touchstart click",function(e){e.preventDefault(),_this._next()}),this._$canvasTimelineContainer.slider({value:0,step:.01,orientation:"horizontal",range:"min",max:that._getDuration(),animate:!1,create:function(evt,ui){},slide:function(evt,ui){that._setCurrentTime(ui.value)},stop:function(evt,ui){}}),this._$canvasTimelineContainer.mouseout(function(){that._$canvasHoverHighlight.width(0),that._$canvasHoverPreview.hide()}),this._$rangeTimelineContainer.mouseout(function(){that._$rangeHoverHighlight.width(0),that._$rangeHoverPreview.hide()}),this._$canvasTimelineContainer.on("mousemove",function(e){_this._updateHoverPreview(e,_this._$canvasTimelineContainer,_this._getDuration())}),this._$rangeTimelineContainer.on("mousemove",function(e){if(_this._data.range){var duration=_this._data.range.getDuration();_this._updateHoverPreview(e,_this._$rangeTimelineContainer,duration?duration.getLength():0)}}),this._contentAnnotations=[];var items=this._data.canvas.getContent();this._$timelineItemContainer.hide();for(var i=0;i<items.length;i++){var item=items[i],mediaSource=void 0,bodies=item.getBody();if(!bodies.length)return void console.warn("item has no body");var body=this._getBody(bodies);if(body){var type=body.getType(),format=body.getFormat();type&&"textualbody"===type.toString()||(mediaSource=body.id.split("#")[0]);var target=item.getTarget();if(!target)return void console.warn("item has no target");var xywh=IIIFComponents.AVComponentUtils.Utils.getSpatialComponent(target),t=Manifesto.Utils.getTemporalComponent(target);xywh||(xywh=[0,0,this._canvasWidth,this._canvasHeight]),t||(t=[0,this._getDuration()]);var positionLeft=parseInt(String(xywh[0])),positionTop=parseInt(String(xywh[1])),mediaWidth=parseInt(String(xywh[2])),mediaHeight=parseInt(String(xywh[3])),startTime=parseInt(String(t[0])),endTime=parseInt(String(t[1])),percentageTop=this._convertToPercentage(positionTop,this._canvasHeight),percentageLeft=this._convertToPercentage(positionLeft,this._canvasWidth),percentageWidth=this._convertToPercentage(mediaWidth,this._canvasWidth),percentageHeight=this._convertToPercentage(mediaHeight,this._canvasHeight),temporalOffsets=/t=([^&]+)/g.exec(body.id),ot=void 0;ot=temporalOffsets&&temporalOffsets[1]?temporalOffsets[1].split(","):[null,null];var offsetStart=ot[0]?parseInt(ot[0]):ot[0],offsetEnd=ot[1]?parseInt(ot[1]):ot[1],itemData={active:!1,end:endTime,endOffset:offsetEnd,format:format,height:percentageHeight,left:percentageLeft,source:mediaSource,start:startTime,startOffset:offsetStart,top:percentageTop,type:type,width:percentageWidth};this._renderMediaElement(itemData);var seeAlso=item.getProperty("seeAlso");if(seeAlso&&seeAlso.length){var dat=seeAlso[0].id;this.waveforms.push(dat)}}else console.warn("unable to find suitable format for",item.id)}this._renderWaveform()},CanvasInstance.prototype._getBody=function(bodies){for(var i=0;i<bodies.length;i++){var body=bodies[i],format=body.getFormat();if(format&&IIIFComponents.AVComponentUtils.Utils.isHLSFormat(format)&&IIIFComponents.AVComponentUtils.Utils.canPlayHls())return body}for(var i=0;i<bodies.length;i++){var body=bodies[i],format=body.getFormat();if(format&&IIIFComponents.AVComponentUtils.Utils.isMpegDashFormat(format)&&!IIIFComponents.AVComponentUtils.Utils.isSafari())return body}for(var i=0;i<bodies.length;i++){var body=bodies[i],format=body.getFormat();if(format&&!IIIFComponents.AVComponentUtils.Utils.isHLSFormat(format)&&!IIIFComponents.AVComponentUtils.Utils.isMpegDashFormat(format))return body}return null},CanvasInstance.prototype._getDuration=function(){return this._data&&this._data.canvas?this._data.canvas.getDuration():0},CanvasInstance.prototype.data=function(){return{waveformColor:"#fff",waveformBarSpacing:4,waveformBarWidth:2,volume:1}},CanvasInstance.prototype.isVirtual=function(){return this._data.canvas instanceof IIIFComponents.AVComponentObjects.VirtualCanvas},CanvasInstance.prototype.isVisible=function(){return!!this._data.visible},CanvasInstance.prototype.includesVirtualSubCanvas=function(canvasId){if(this.isVirtual()&&this._data.canvas&&this._data.canvas.canvases)for(var i=0;i<this._data.canvas.canvases.length;i++){var canvas=this._data.canvas.canvases[i];if(Manifesto.Utils.normaliseUrl(canvas.id)===canvasId)return!0}return!1},CanvasInstance.prototype.set=function(data){var _this=this,oldData=Object.assign({},this._data);this._data=Object.assign(this._data,data);var diff=IIIFComponents.AVComponentUtils.Utils.diff(oldData,this._data);if(diff.includes("visible")&&this._data.canvas&&(this._data.visible?(this._rewind(),this.$playerElement.show()):(this.$playerElement.hide(),this.pause()),this.resize()),diff.includes("range")&&this._data.helper)if(this._data.range){var duration=this._data.range.getDuration();duration&&(this._data.range.autoChanged||this._setCurrentTime(duration.start),this._data.autoPlay&&this.play(),this.fire(IIIFComponents.AVComponent.Events.RANGE_CHANGED,this._data.range.id))}else this.fire(IIIFComponents.AVComponent.Events.RANGE_CHANGED,null);diff.includes("volume")?this._contentAnnotations.forEach(function($mediaElement){$($mediaElement.element).prop("volume",_this._data.volume),_this._volume.set({volume:_this._data.volume})}):this._render(),diff.includes("limitToRange")&&this._render()},CanvasInstance.prototype._hasRangeChanged=function(){var range=this._getRangeForCurrentTime();range&&!this._data.limitToRange&&(!this._data.range||this._data.range&&range.id!==this._data.range.id)&&this.set({range:jQuery.extend(!0,{autoChanged:!0},range)})},CanvasInstance.prototype._getRangeForCurrentTime=function(parentRange){var ranges;ranges=parentRange?parentRange.getRanges():this.ranges;for(var i=0;i<ranges.length;i++){var range=ranges[i];if(this._rangeSpansCurrentTime(range)){if(this._rangeNavigable(range))return range;for(var childRanges=range.getRanges(),i_1=0;i_1<childRanges.length;i_1++){var childRange=childRanges[i_1];if(this._rangeSpansCurrentTime(childRange))return this._getRangeForCurrentTime(childRange)}return range.parentRange}}},CanvasInstance.prototype._rangeSpansCurrentTime=function(range){return!!range.spansTime(Math.ceil(this._canvasClockTime)+this._rangeSpanPadding)},CanvasInstance.prototype._rangeNavigable=function(range){var behavior=range.getBehavior();return!behavior||behavior.toString()!==manifesto.Behavior.nonav().toString()},CanvasInstance.prototype._render=function(){if(this._data.range){var duration=this._data.range.getDuration();if(duration){var totalLength=this._getDuration(),timelineLength=this._$canvasTimelineContainer.width(),ratio=timelineLength/totalLength,start=duration.start*ratio,end=duration.end*ratio;(end>totalLength||end<start)&&(end=totalLength);var width=end-start;this.isVirtual()?(this._$durationHighlight.show(),this._$durationHighlight.css({left:start,width:width})):this._$durationHighlight.hide();var that_1=this;this._$rangeTimelineContainer.slider("destroy"),this._$rangeTimelineContainer.slider({value:duration.start,step:.01,orientation:"horizontal",range:"min",min:duration.start,max:duration.end,animate:!1,create:function(evt,ui){},slide:function(evt,ui){that_1._setCurrentTime(ui.value)},stop:function(evt,ui){}})}}else this._$durationHighlight.hide();this._data.limitToRange&&this._data.range?(this._$canvasTimelineContainer.hide(),this._$rangeTimelineContainer.show()):(this._$canvasTimelineContainer.show(),this._$rangeTimelineContainer.hide()),this._updateCurrentTimeDisplay(),this._updateDurationDisplay(),this._drawWaveform()},CanvasInstance.prototype.getCanvasId=function(){if(this._data&&this._data.canvas)return this._data.canvas.id},CanvasInstance.prototype._updateHoverPreview=function(e,$container,duration){var offset=$container.offset(),x=e.pageX-offset.left,$hoverArrow=$container.find(".arrow"),$hoverHighlight=$container.find(".hover-highlight"),$hoverPreview=$container.find(".hover-preview");$hoverHighlight.width(x);var fullWidth=$container.width(),ratio=x/fullWidth,seconds=Math.min(duration*ratio);$hoverPreview.find(".label").text(IIIFComponents.AVComponentUtils.Utils.formatTime(seconds));var hoverPreviewWidth=$hoverPreview.outerWidth(),hoverPreviewHeight=$hoverPreview.outerHeight(),left=x-.5*hoverPreviewWidth,arrowLeft=.5*hoverPreviewWidth-6;left<0&&(left=0,arrowLeft=x-6),left+hoverPreviewWidth>fullWidth&&(left=fullWidth-hoverPreviewWidth,arrowLeft=hoverPreviewWidth-(fullWidth-x)-6),$hoverPreview.css({left:left,top:hoverPreviewHeight*-1+"px"}).show(),$hoverArrow.css({left:arrowLeft})},CanvasInstance.prototype._previous=function(isDouble){this._data.limitToRange?isDouble?this._isNavigationConstrainedToRange()?this._rewind():this.fire(IIIFComponents.AVComponentCanvasInstance.Events.PREVIOUS_RANGE):this._rewind():this._data.range?isDouble?(this.set({range:void 0}),this._rewind()):this.fire(IIIFComponents.AVComponentCanvasInstance.Events.PREVIOUS_RANGE):this._rewind()},CanvasInstance.prototype._next=function(){this._data.limitToRange&&this._isNavigationConstrainedToRange()?this._fastforward():this.fire(IIIFComponents.AVComponentCanvasInstance.Events.NEXT_RANGE)},CanvasInstance.prototype.destroy=function(){window.clearInterval(this._highPriorityInterval),window.clearInterval(this._lowPriorityInterval),window.clearInterval(this._canvasClockInterval)},CanvasInstance.prototype._convertToPercentage=function(pixelValue,maxValue){var percentage=pixelValue/maxValue*100;return percentage},CanvasInstance.prototype._renderMediaElement=function(data){var $mediaElement,_this=this,type=data.type.toString().toLowerCase();switch(type){case"image":$mediaElement=$('<img class="anno" src="'+data.source+'" />');break;case"video":$mediaElement=$('<video class="anno" />');break;case"audio":$mediaElement=$('<audio class="anno" />');break;case"textualbody":$mediaElement=$('<div class="anno">'+data.source+"</div>");break;default:return}var media=$mediaElement[0];if(data.format&&"application/dash+xml"===data.format.toString()){$mediaElement.attr("data-dashjs-player","");var player=dashjs.MediaPlayer().create();player.initialize(media,data.source);
-}else if(data.format&&"application/vnd.apple.mpegurl"===data.format.toString())if(Hls.isSupported()){var hls=new Hls;hls.loadSource(data.source),hls.attachMedia(media)}else media.canPlayType("application/vnd.apple.mpegurl")&&(media.src=data.source);else $mediaElement.attr("src",data.source);if($mediaElement.css({top:data.top+"%",left:data.left+"%",width:data.width+"%",height:data.height+"%"}).hide(),data.element=$mediaElement,"video"===type||"audio"===type){data.timeout=null;var that_2=this;data.checkForStall=function(){var self=this;this.active?(that_2._checkMediaSynchronization(),this.element.get(0).readyState>0&&!this.outOfSync?that_2._playbackStalled(!1,self):(that_2._playbackStalled(!0,self),this.timeout&&window.clearTimeout(this.timeout),this.timeout=window.setTimeout(function(){self.checkForStall()},1e3))):that_2._playbackStalled(!1,self)}}this._contentAnnotations.push(data),this.$playerElement&&this._$canvasContainer.append($mediaElement),"video"!==type&&"audio"!==type||($mediaElement.on("loadstart",function(){}),$mediaElement.on("waiting",function(){}),$mediaElement.on("seeking",function(){}),$mediaElement.on("loadedmetadata",function(){_this._readyMediaCount++,_this._readyMediaCount===_this._contentAnnotations.length&&(_this._setCurrentTime(0),_this._data.autoPlay&&_this.play(),_this._updateDurationDisplay(),_this.fire(IIIFComponents.AVComponent.Events.MEDIA_READY))}),$mediaElement.attr("preload","auto"),$mediaElement.get(0).load()),this._renderSyncIndicator(data)},CanvasInstance.prototype._getWaveformData=function(url){return new Promise(function(resolve,reject){$.ajax({url:url,type:"GET",dataType:"binary",responseType:"arraybuffer",processData:!1}).done(function(data){resolve(WaveformData.create(data))}).fail(function(err){reject(new Error("Network Error"))})})},CanvasInstance.prototype._renderWaveform=function(){var _this=this;if(this.waveforms.length){var promises=this.waveforms.map(function(url){return _this._getWaveformData(url)});Promise.all(promises).then(function(waveforms){_this._waveformCanvas=document.createElement("canvas"),_this._waveformCanvas.classList.add("waveform"),_this._$canvasContainer.append(_this._waveformCanvas),_this._waveformCtx=_this._waveformCanvas.getContext("2d"),_this._waveformCtx&&(_this._waveformCtx.fillStyle=_this._data.waveformColor,_this._compositeWaveform=new IIIFComponents.AVComponentObjects.CompositeWaveform(waveforms),_this.fire(IIIFComponents.AVComponent.Events.WAVEFORM_READY))})}},CanvasInstance.prototype._drawWaveform=function(){if(this._waveformCtx){var duration,start=0,end=this._compositeWaveform.duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration&&(start=duration.start,end=duration.end);var startpx=start*this._compositeWaveform.pixelsPerSecond,endpx=end*this._compositeWaveform.pixelsPerSecond,canvasWidth=this._waveformCtx.canvas.width,canvasHeight=this._waveformCtx.canvas.height,barSpacing=this._data.waveformBarSpacing,barWidth=this._data.waveformBarWidth,increment=Math.floor((endpx-startpx)/canvasWidth*barSpacing),sampleSpacing=canvasWidth/barSpacing;this._waveformCtx.clearRect(0,0,canvasWidth,canvasHeight),this._waveformCtx.fillStyle=this._data.waveformColor;for(var x=startpx;x<endpx;x+=increment){var maxMin=this._getWaveformMaxAndMin(this._compositeWaveform,x,sampleSpacing),height=this._scaleY(maxMin.max-maxMin.min,canvasHeight),ypos=(canvasHeight-height)/2,xpos=canvasWidth*IIIFComponents.AVComponentUtils.Utils.normalise(x,startpx,endpx);this._waveformCtx.fillRect(xpos,ypos,barWidth,height)}}},CanvasInstance.prototype._getWaveformMaxAndMin=function(waveform,index,sampleSpacing){for(var max=-127,min=128,x=index;x<index+sampleSpacing;x++)waveform.max(x)>max&&(max=waveform.max(x)),waveform.min(x)<min&&(min=waveform.min(x));return{max:max,min:min}},CanvasInstance.prototype._updateCurrentTimeDisplay=function(){var duration;if(this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration){var rangeClockTime=this._canvasClockTime-duration.start;this._$canvasTime.text(IIIFComponents.AVComponentUtils.Utils.formatTime(rangeClockTime))}else this._$canvasTime.text(IIIFComponents.AVComponentUtils.Utils.formatTime(this._canvasClockTime))},CanvasInstance.prototype._updateDurationDisplay=function(){var duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration?this._$canvasDuration.text(IIIFComponents.AVComponentUtils.Utils.formatTime(duration.getLength())):this._$canvasDuration.text(IIIFComponents.AVComponentUtils.Utils.formatTime(this._getDuration()))},CanvasInstance.prototype._renderSyncIndicator=function(mediaElementData){var leftPercent=this._convertToPercentage(mediaElementData.start,this._getDuration()),widthPercent=this._convertToPercentage(mediaElementData.end-mediaElementData.start,this._getDuration()),$timelineItem=$('<div class="timeline-item" title="'+mediaElementData.source+'" data-start="'+mediaElementData.start+'" data-end="'+mediaElementData.end+'"></div>');$timelineItem.css({left:leftPercent+"%",width:widthPercent+"%"});var $lineWrapper=$('<div class="line-wrapper"></div>');$timelineItem.appendTo($lineWrapper),mediaElementData.timelineElement=$timelineItem,this.$playerElement&&this._$timelineItemContainer.append($lineWrapper)},CanvasInstance.prototype._setCurrentTime=function(seconds){this._canvasClockTime=seconds,this._canvasClockStartDate=Date.now()-1e3*this._canvasClockTime,this.logMessage("SET CURRENT TIME to: "+this._canvasClockTime+" seconds."),this._canvasClockUpdater(),this._highPriorityUpdater(),this._lowPriorityUpdater(),this._synchronizeMedia()},CanvasInstance.prototype._rewind=function(withoutUpdate){this.pause();var duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration?this._canvasClockTime=duration.start:this._canvasClockTime=0,this._data.limitToRange||this._data&&this._data.helper&&this.set({range:void 0})},CanvasInstance.prototype._fastforward=function(){var duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration?this._canvasClockTime=duration.end:this._canvasClockTime=this._getDuration(),this.pause()},CanvasInstance.prototype.play=function(withoutUpdate){var _this=this;if(!this._isPlaying){var duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration&&this._canvasClockTime>=duration.end&&(this._canvasClockTime=duration.start),this._canvasClockTime===this._getDuration()&&(this._canvasClockTime=0),this._canvasClockStartDate=Date.now()-1e3*this._canvasClockTime,this._highPriorityInterval=window.setInterval(function(){_this._highPriorityUpdater()},this._highPriorityFrequency),this._lowPriorityInterval=window.setInterval(function(){_this._lowPriorityUpdater()},this._lowPriorityFrequency),this._canvasClockInterval=window.setInterval(function(){_this._canvasClockUpdater()},this._canvasClockFrequency),this._isPlaying=!0,withoutUpdate||this._synchronizeMedia();var label=this._data&&this._data.content?this._data.content.pause:"";this._$playButton.prop("title",label),this._$playButton.find("i").switchClass("play","pause"),this.fire(IIIFComponents.AVComponentCanvasInstance.Events.PLAYCANVAS),this.logMessage("PLAY canvas")}},CanvasInstance.prototype.pause=function(withoutUpdate){window.clearInterval(this._highPriorityInterval),window.clearInterval(this._lowPriorityInterval),window.clearInterval(this._canvasClockInterval),this._isPlaying=!1,withoutUpdate||(this._highPriorityUpdater(),this._lowPriorityUpdater(),this._synchronizeMedia());var label=this._data&&this._data.content?this._data.content.play:"";this._$playButton.prop("title",label),this._$playButton.find("i").switchClass("pause","play"),this.fire(IIIFComponents.AVComponentCanvasInstance.Events.PAUSECANVAS),this.logMessage("PAUSE canvas")},CanvasInstance.prototype._isNavigationConstrainedToRange=function(){return this._data.constrainNavigationToRange},CanvasInstance.prototype._canvasClockUpdater=function(){this._canvasClockTime=(Date.now()-this._canvasClockStartDate)/1e3;var duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration&&this._canvasClockTime>=duration.end&&this.pause(),this._canvasClockTime>=this._getDuration()&&(this._canvasClockTime=this._getDuration(),this.pause())},CanvasInstance.prototype._highPriorityUpdater=function(){this._$rangeTimelineContainer.slider({value:this._canvasClockTime}),this._$canvasTimelineContainer.slider({value:this._canvasClockTime}),this._updateCurrentTimeDisplay(),this._updateDurationDisplay()},CanvasInstance.prototype._lowPriorityUpdater=function(){this._updateMediaActiveStates(),this._isPlaying&&this._data.autoSelectRange&&this.isVirtual()&&this._hasRangeChanged()},CanvasInstance.prototype._updateMediaActiveStates=function(){for(var contentAnnotation,i=0;i<this._contentAnnotations.length;i++){contentAnnotation=this._contentAnnotations[i];var type=contentAnnotation.type.toString().toLowerCase();contentAnnotation.start<=this._canvasClockTime&&contentAnnotation.end>=this._canvasClockTime?(this._checkMediaSynchronization(),contentAnnotation.active||(this._synchronizeMedia(),contentAnnotation.active=!0,contentAnnotation.element.show(),contentAnnotation.timelineElement.addClass("active")),"video"!==type&&"audio"!==type||contentAnnotation.element[0].currentTime>contentAnnotation.element[0].duration-contentAnnotation.endOffset&&this._pauseMedia(contentAnnotation.element[0])):contentAnnotation.active&&(contentAnnotation.active=!1,contentAnnotation.element.hide(),contentAnnotation.timelineElement.removeClass("active"),"video"!==type&&"audio"!==type||this._pauseMedia(contentAnnotation.element[0]))}},CanvasInstance.prototype._pauseMedia=function(media){media.pause()},CanvasInstance.prototype._setMediaCurrentTime=function(media,time){isNaN(media.duration)||(media.currentTime=time)},CanvasInstance.prototype._synchronizeMedia=function(){for(var contentAnnotation,i=0;i<this._contentAnnotations.length;i++){contentAnnotation=this._contentAnnotations[i];var type=contentAnnotation.type.toString().toLowerCase();if("video"===type||"audio"===type){if(this._setMediaCurrentTime(contentAnnotation.element[0],this._canvasClockTime-contentAnnotation.start+contentAnnotation.startOffset),contentAnnotation.start<=this._canvasClockTime&&contentAnnotation.end>=this._canvasClockTime)if(this._isPlaying){if(contentAnnotation.element[0].paused){var promise=contentAnnotation.element[0].play();promise&&promise["catch"](function(){})}}else this._pauseMedia(contentAnnotation.element[0]);else this._pauseMedia(contentAnnotation.element[0]);contentAnnotation.element[0].currentTime>contentAnnotation.element[0].duration-contentAnnotation.endOffset&&this._pauseMedia(contentAnnotation.element[0])}}this.logMessage("SYNC MEDIA at: "+this._canvasClockTime+" seconds.")},CanvasInstance.prototype._checkMediaSynchronization=function(){for(var contentAnnotation,i=0,l=this._contentAnnotations.length;i<l;i++){contentAnnotation=this._contentAnnotations[i];var type=contentAnnotation.type.toString().toLowerCase();if(("video"===type||"audio"===type)&&contentAnnotation.start<=this._canvasClockTime&&contentAnnotation.end>=this._canvasClockTime){var correctTime=this._canvasClockTime-contentAnnotation.start+contentAnnotation.startOffset,factualTime=contentAnnotation.element[0].currentTime;if(Math.abs(factualTime-correctTime)>this._mediaSyncMarginSecs){contentAnnotation.outOfSync=!0;var lag=Math.abs(factualTime-correctTime);this.logMessage("DETECTED synchronization lag: "+Math.abs(lag)),this._setMediaCurrentTime(contentAnnotation.element[0],correctTime)}else contentAnnotation.outOfSync=!1}}},CanvasInstance.prototype._playbackStalled=function(aBoolean,syncMediaRequestingStall){if(aBoolean)this._stallRequestedBy.indexOf(syncMediaRequestingStall)<0&&this._stallRequestedBy.push(syncMediaRequestingStall),this._isStalled||(this.$playerElement,this._wasPlaying=this._isPlaying,this.pause(!0),this._isStalled=aBoolean);else{var idx=this._stallRequestedBy.indexOf(syncMediaRequestingStall);idx>=0&&this._stallRequestedBy.splice(idx,1),0===this._stallRequestedBy.length&&(this._isStalled&&this._wasPlaying&&this.play(!0),this._isStalled=aBoolean)}},CanvasInstance.prototype.resize=function(){if(this.$playerElement){var containerWidth=this._$canvasContainer.width();if(containerWidth){this._$canvasTimelineContainer.width(containerWidth);var $options=this.$playerElement.find(".options-container");void 0!==this._data.halveAtWidth&&this.$playerElement.parent().width()<this._data.halveAtWidth?this._$canvasContainer.height(this.$playerElement.parent().height()/2):this._$canvasContainer.height(this.$playerElement.parent().height()-$options.height())}if(this._waveformCanvas){var canvasWidth=this._$canvasContainer.width(),canvasHeight=this._$canvasContainer.height();this._waveformCanvas.width=this._lastCanvasWidth=canvasWidth,this._waveformCanvas.height=this._lastCanvasHeight=canvasHeight}this._render()}},CanvasInstance}(_Components.BaseComponent);IIIFComponents.CanvasInstance=CanvasInstance}(IIIFComponents||(IIIFComponents={})),function(IIIFComponents){var AVComponentCanvasInstance;!function(AVComponentCanvasInstance){var Events=function(){function Events(){}return Events.NEXT_RANGE="nextrange",Events.PAUSECANVAS="pause",Events.PLAYCANVAS="play",Events.PREVIOUS_RANGE="previousrange",Events}();AVComponentCanvasInstance.Events=Events}(AVComponentCanvasInstance=IIIFComponents.AVComponentCanvasInstance||(IIIFComponents.AVComponentCanvasInstance={}))}(IIIFComponents||(IIIFComponents={}));var IIIFComponents;!function(IIIFComponents){var AVComponentObjects;!function(AVComponentObjects){var CompositeWaveform=function(){function CompositeWaveform(waveforms){var _this=this;this.length=0,this.duration=0,this.pixelsPerSecond=Number.MAX_VALUE,this.secondsPerPixel=Number.MAX_VALUE,this._waveforms=[],waveforms.forEach(function(waveform){_this._waveforms.push({start:_this.length,end:_this.length+waveform.adapter.length,waveform:waveform}),_this.length+=waveform.adapter.length,_this.duration+=waveform.duration,_this.pixelsPerSecond=Math.min(_this.pixelsPerSecond,waveform.pixels_per_second),_this.secondsPerPixel=Math.min(_this.secondsPerPixel,waveform.seconds_per_pixel)})}return CompositeWaveform.prototype.min=function(index){var waveform=this._find(index);return waveform?waveform.waveform.min_sample(index-waveform.start):0},CompositeWaveform.prototype.max=function(index){var waveform=this._find(index);return waveform?waveform.waveform.max_sample(index-waveform.start):0},CompositeWaveform.prototype._find=function(index){var waveforms=this._waveforms.filter(function(waveform){return index>=waveform.start&&index<waveform.end});return waveforms.length>0?waveforms[0]:null},CompositeWaveform}();AVComponentObjects.CompositeWaveform=CompositeWaveform}(AVComponentObjects=IIIFComponents.AVComponentObjects||(IIIFComponents.AVComponentObjects={}))}(IIIFComponents||(IIIFComponents={}));var IIIFComponents;!function(IIIFComponents){var AVComponentUtils;!function(AVComponentUtils){var Utils=function(){function Utils(){}return Utils._compare=function(a,b){var changed=[];return Object.keys(a).forEach(function(p){Object.is(b[p],a[p])||changed.push(p)}),changed},Utils.diff=function(a,b){return Array.from(new Set(Utils._compare(a,b).concat(Utils._compare(b,a))))},Utils.getSpatialComponent=function(target){var spatial=/xywh=([^&]+)/g.exec(target),xywh=null;return spatial&&spatial[1]&&(xywh=spatial[1].split(",")),xywh},Utils.getFirstTargetedCanvasId=function(range){var canvasId;if(range.canvases&&range.canvases.length)canvasId=range.canvases[0];else{var childRanges=range.getRanges();if(childRanges.length)return Utils.getFirstTargetedCanvasId(childRanges[0])}if(void 0!==canvasId)return Manifesto.Utils.normaliseUrl(canvasId)},Utils.getTimestamp=function(){return String((new Date).valueOf())},Utils.retargetTemporalComponent=function(canvases,target){var t=Manifesto.Utils.getTemporalComponent(target);if(t){for(var offset=0,targetWithoutTemporal=target.substr(0,target.indexOf("#")),i=0;i<canvases.length;i++){var canvas=canvases[i];if(canvas.id.includes(targetWithoutTemporal))break;var duration=canvas.getDuration();duration&&(offset+=duration)}return t[0]=Number(t[0])+offset,t[1]=Number(t[1])+offset,targetWithoutTemporal+"#t="+t[0]+","+t[1]}},Utils.formatTime=function(aNumber){var hours,minutes,seconds,hourValue;return seconds=Math.ceil(aNumber),hours=Math.floor(seconds/3600),hours=hours>=10?hours:"0"+hours,minutes=Math.floor(seconds%3600/60),minutes=minutes>=10?minutes:"0"+minutes,seconds=Math.floor(seconds%3600%60),seconds=seconds>=10?seconds:"0"+seconds,hourValue=hours>=1?hours+":":"",hourValue+minutes+":"+seconds},Utils.detectIE=function(){var ua=window.navigator.userAgent,msie=ua.indexOf("MSIE ");if(msie>0)return parseInt(ua.substring(msie+5,ua.indexOf(".",msie)),10);var trident=ua.indexOf("Trident/");if(trident>0){var rv=ua.indexOf("rv:");return parseInt(ua.substring(rv+3,ua.indexOf(".",rv)),10)}var edge=ua.indexOf("Edge/");return edge>0&&parseInt(ua.substring(edge+5,ua.indexOf(".",edge)),10)},Utils.isSafari=function(){var isSafari=/^((?!chrome|android).)*safari/i.test(navigator.userAgent);return console.log("isSafari",isSafari),isSafari},Utils.debounce=function(fn,debounceDuration){return debounceDuration=debounceDuration||100,function(){if(!fn.debouncing){var args=Array.prototype.slice.apply(arguments);fn.lastReturnVal=fn.apply(window,args),fn.debouncing=!0}return clearTimeout(fn.debounceTimeout),fn.debounceTimeout=setTimeout(function(){fn.debouncing=!1},debounceDuration),fn.lastReturnVal}},Utils.normalise=function(num,min,max){return(num-min)/(max-min)},Utils.isHLSFormat=function(format){return this.hlsMimeTypes.includes(format.toString())},Utils.isMpegDashFormat=function(format){return"application/dash+xml"===format.toString()},Utils.canPlayHls=function(){var doc="object"==typeof document&&document,videoelem=doc&&doc.createElement("video"),isvideosupport=Boolean(videoelem&&videoelem.canPlayType);return isvideosupport&&this.hlsMimeTypes.some(function(canItPlay){return/maybe|probably/i.test(videoelem.canPlayType(canItPlay))})},Utils.hlsMimeTypes=["application/vnd.apple.mpegurl","vnd.apple.mpegurl","audio/mpegurl","audio/x-mpegurl","application/x-mpegurl","video/x-mpegurl","video/mpegurl","application/mpegurl"],Utils}();AVComponentUtils.Utils=Utils}(AVComponentUtils=IIIFComponents.AVComponentUtils||(IIIFComponents.AVComponentUtils={}))}(IIIFComponents||(IIIFComponents={}));var IIIFComponents;!function(IIIFComponents){var AVComponentObjects;!function(AVComponentObjects){var VirtualCanvas=function(){function VirtualCanvas(){this.canvases=[],this.id=IIIFComponents.AVComponentUtils.Utils.getTimestamp()}return VirtualCanvas.prototype.addCanvas=function(canvas){this.canvases.push(jQuery.extend(!0,{},canvas))},VirtualCanvas.prototype.getContent=function(){var _this=this,annotations=[];return this.canvases.forEach(function(canvas){var items=canvas.getContent();items.forEach(function(item){var target=item.getTarget();if(target){var t=Manifesto.Utils.getTemporalComponent(target);t||(item.__jsonld.target+="#t=0,"+canvas.getDuration())}}),items.forEach(function(item){var target=item.getTarget();target&&(item.__jsonld.target=IIIFComponents.AVComponentUtils.Utils.retargetTemporalComponent(_this.canvases,target))}),annotations.push.apply(annotations,items)}),annotations},VirtualCanvas.prototype.getDuration=function(){var duration=0;return this.canvases.forEach(function(canvas){var d=canvas.getDuration();d&&(duration+=d)}),duration},VirtualCanvas.prototype.getWidth=function(){return this.canvases.length?this.canvases[0].getWidth():0},VirtualCanvas.prototype.getHeight=function(){return this.canvases.length?this.canvases[0].getHeight():0},VirtualCanvas}();AVComponentObjects.VirtualCanvas=VirtualCanvas}(AVComponentObjects=IIIFComponents.AVComponentObjects||(IIIFComponents.AVComponentObjects={}))}(IIIFComponents||(IIIFComponents={}));var IIIFComponents;!function(IIIFComponents){var AVComponentObjects;!function(AVComponentObjects){var Waveform=function(){function Waveform(){}return Waveform}();AVComponentObjects.Waveform=Waveform}(AVComponentObjects=IIIFComponents.AVComponentObjects||(IIIFComponents.AVComponentObjects={}))}(IIIFComponents||(IIIFComponents={}))}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{}]},{},[1])(1)});
\ No newline at end of file
+!function(f){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=f();else if("function"==typeof define&&define.amd)define([],f);else{var g;g="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:this,g.iiifAvComponent=f()}}(function(){return function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c="function"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error("Cannot find module '"+i+"'");throw a.code="MODULE_NOT_FOUND",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u="function"==typeof require&&require,i=0;i<t.length;i++)o(t[i]);return o}return r}()({1:[function(require,module,exports){(function(global){var IIIFComponents,__extends=this&&this.__extends||function(){var extendStatics=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(d,b){d.__proto__=b}||function(d,b){for(var p in b)b.hasOwnProperty(p)&&(d[p]=b[p])};return function(d,b){function __(){this.constructor=d}extendStatics(d,b),d.prototype=null===b?Object.create(b):(__.prototype=b.prototype,new __)}}();!function(IIIFComponents){var AVComponent=function(_super){function AVComponent(options){var _this=_super.call(this,options)||this;return _this._data=_this.data(),_this.canvasInstances=[],_this._readyMedia=0,_this._readyWaveforms=0,_this._posterCanvasWidth=0,_this._posterCanvasHeight=0,_this._posterImageExpanded=!1,_this._init(),_this._resize(),_this}return __extends(AVComponent,_super),AVComponent.prototype._init=function(){var success=_super.prototype._init.call(this);return success||console.error("Component failed to initialise"),success},AVComponent.prototype.data=function(){return{autoPlay:!1,constrainNavigationToRange:!1,defaultAspectRatio:.56,doubleClickMS:350,halveAtWidth:200,limitToRange:!1,posterImageRatio:.3,virtualCanvasEnabled:!0,content:{currentTime:"Current Time",collapse:"Collapse",duration:"Duration",expand:"Expand",mute:"Mute",next:"Next",pause:"Pause",play:"Play",previous:"Previous",unmute:"Unmute"}}},AVComponent.prototype.set=function(data){var _this=this,oldData=Object.assign({},this._data);this._data=Object.assign(this._data,data);var diff=IIIFComponents.AVComponentUtils.Utils.diff(oldData,this._data);if(diff.includes("helper")&&this._reset(),!this._data.helper)return void console.warn("must pass a helper object");if(diff.includes("limitToRange")&&this._data.canvasId&&this.canvasInstances.forEach(function(canvasInstance,index){canvasInstance.set({limitToRange:_this._data.limitToRange})}),diff.includes("constrainNavigationToRange")&&this._data.canvasId&&this.canvasInstances.forEach(function(canvasInstance,index){canvasInstance.set({constrainNavigationToRange:_this._data.constrainNavigationToRange})}),diff.includes("autoSelectRange")&&this._data.canvasId&&this.canvasInstances.forEach(function(canvasInstance,index){canvasInstance.set({autoSelectRange:_this._data.autoSelectRange})}),diff.includes("canvasId")&&this._data.canvasId){var nextCanvasInstance_1=this._getCanvasInstanceById(this._data.canvasId);nextCanvasInstance_1&&this.canvasInstances.forEach(function(canvasInstance){canvasInstance.getCanvasId()!==nextCanvasInstance_1.getCanvasId()?canvasInstance.set({visible:!1}):diff.includes("range")?canvasInstance.set({visible:!0,range:_this._data.range?jQuery.extend(!0,{},_this._data.range):void 0}):canvasInstance.set({visible:!0})})}if(diff.includes("virtualCanvasEnabled")&&(this.set({range:void 0}),this._data.virtualCanvasEnabled&&this.canvasInstances.forEach(function(canvasInstance){canvasInstance.isVirtual()&&_this.set({canvasId:canvasInstance.getCanvasId(),range:void 0})})),diff.includes("range")&&this._data.range){var range=this._data.helper.getRangeById(this._data.range.id);if(range){var canvasId=IIIFComponents.AVComponentUtils.Utils.getFirstTargetedCanvasId(range);if(canvasId){var canvasInstance=this._getCanvasInstanceById(canvasId);if(canvasInstance){if(canvasInstance.isVirtual()&&this._data.virtualCanvasEnabled&&canvasInstance.includesVirtualSubCanvas(canvasId)){canvasId=canvasInstance.getCanvasId();for(var i=0;i<canvasInstance.ranges.length;i++){var r=canvasInstance.ranges[i];if(r.id===range.id){range=r;break}}}this._data.canvasId&&(this._data.canvasId.includes("://")?Manifesto.Utils.normaliseUrl(this._data.canvasId):this._data.canvasId)!==canvasId?this.set({canvasId:canvasId,range:jQuery.extend(!0,{},range)}):canvasInstance.set({range:jQuery.extend(!0,{},range)})}}}else console.warn("range not found")}this._render(),this._resize()},AVComponent.prototype._render=function(){},AVComponent.prototype.reset=function(){this._reset()},AVComponent.prototype._reset=function(){var _this=this;if(this.canvasInstances.forEach(function(canvasInstance,index){canvasInstance.destroy()}),this.canvasInstances=[],this._$element.empty(),this._data&&this._data.helper){var behavior=this._data.helper.manifest.getBehavior(),canvases=this._getCanvases();if(behavior&&behavior.toString()===manifesto.Behavior.autoadvance().toString()){var virtualCanvas_1=new IIIFComponents.AVComponentObjects.VirtualCanvas;canvases.forEach(function(canvas){virtualCanvas_1.addCanvas(canvas)}),this._initCanvas(virtualCanvas_1)}canvases.forEach(function(canvas){_this._initCanvas(canvas)}),this.canvasInstances.length>0&&(this._data.canvasId=this.canvasInstances[0].getCanvasId()),this._checkAllMediaReadyInterval=setInterval(this._checkAllMediaReady.bind(this),100),this._checkAllWaveformsReadyInterval=setInterval(this._checkAllWaveformsReady.bind(this),100),this._$posterContainer=$('<div class="poster-container"></div>'),this._$element.append(this._$posterContainer),this._$posterImage=$('<div class="poster-image"></div>'),this._$posterExpandButton=$('\n                    <button class="btn" title="'+(this._data&&this._data.content?this._data.content.expand:"")+'">\n                        <i class="av-icon  av-icon-expand expand" aria-hidden="true"></i><span>'+(this._data&&this._data.content?this._data.content.expand:"")+"</span>\n                    </button>\n                "),this._$posterImage.append(this._$posterExpandButton),this._$posterImage.on("touchstart click",function(e){e.preventDefault();var target=_this._getPosterImageCss(!_this._posterImageExpanded);if(_this._$posterImage.animate(target),_this._posterImageExpanded=!_this._posterImageExpanded,_this._posterImageExpanded){var label=_this.options.data.content.collapse;_this._$posterExpandButton.prop("title",label),_this._$posterExpandButton.find("i").switchClass("expand","collapse")}else{var label=_this.options.data.content.expand;_this._$posterExpandButton.prop("title",label),_this._$posterExpandButton.find("i").switchClass("collapse","expand")}});var posterCanvas=this._data.helper.getPosterCanvas();if(posterCanvas){this._posterCanvasWidth=posterCanvas.getWidth(),this._posterCanvasHeight=posterCanvas.getHeight();var posterImage=this._data.helper.getPosterImage();if(posterImage){this._$posterContainer.append(this._$posterImage);var css=this._getPosterImageCss(this._posterImageExpanded);css=Object.assign({},css,{"background-image":"url("+posterImage+")"}),this._$posterImage.css(css)}}}},AVComponent.prototype._checkAllMediaReady=function(){console.log("loading media"),this._readyMedia===this.canvasInstances.length&&(console.log("all media ready"),clearInterval(this._checkAllMediaReadyInterval),this.fire(AVComponent.Events.MEDIA_READY),this.resize())},AVComponent.prototype._checkAllWaveformsReady=function(){console.log("loading waveforms"),this._readyWaveforms===this._getCanvasInstancesWithWaveforms().length&&(console.log("waveforms ready"),clearInterval(this._checkAllWaveformsReadyInterval),this.fire(AVComponent.Events.WAVEFORMS_READY),this.resize())},AVComponent.prototype._getCanvasInstancesWithWaveforms=function(){return this.canvasInstances.filter(function(c){return c.waveforms.length>0})},AVComponent.prototype._getCanvases=function(){return this._data.helper?this._data.helper.getCanvases():[]},AVComponent.prototype._initCanvas=function(canvas){var _this=this,canvasInstance=new IIIFComponents.CanvasInstance({target:document.createElement("div"),data:Object.assign({},{canvas:canvas},this._data)});canvasInstance.logMessage=this._logMessage.bind(this),this._$element.append(canvasInstance.$playerElement),canvasInstance.init(),this.canvasInstances.push(canvasInstance),canvasInstance.on(AVComponent.Events.MEDIA_READY,function(){_this._readyMedia++},!1),canvasInstance.on(AVComponent.Events.WAVEFORM_READY,function(){_this._readyWaveforms++},!1),canvasInstance.on(IIIFComponents.AVComponentCanvasInstance.Events.PREVIOUS_RANGE,function(){_this._prevRange()},!1),canvasInstance.on(IIIFComponents.AVComponentCanvasInstance.Events.NEXT_RANGE,function(){_this._nextRange()},!1),canvasInstance.on(AVComponent.Events.RANGE_CHANGED,function(rangeId){_this.fire(AVComponent.Events.RANGE_CHANGED,rangeId)},!1),canvasInstance.on(IIIFComponents.AVVolumeControl.Events.VOLUME_CHANGED,function(volume){_this._setCanvasInstanceVolumes(volume),_this.fire(IIIFComponents.AVVolumeControl.Events.VOLUME_CHANGED,volume)},!1)},AVComponent.prototype._prevRange=function(){if(this._data&&this._data.helper){var prevRange=this._data.helper.getPreviousRange();prevRange?this.playRange(prevRange.id):this._rewind()}},AVComponent.prototype._nextRange=function(){if(this._data&&this._data.helper){var nextRange=this._data.helper.getNextRange();nextRange&&this.playRange(nextRange.id)}},AVComponent.prototype._setCanvasInstanceVolumes=function(volume){this.canvasInstances.forEach(function(canvasInstance){canvasInstance.set({volume:volume})})},AVComponent.prototype._getCanvasInstanceById=function(canvasId){if(canvasId=canvasId.includes("://")?Manifesto.Utils.normaliseUrl(canvasId):canvasId,this._data.virtualCanvasEnabled)for(var i=0;i<this.canvasInstances.length;i++){var canvasInstance=this.canvasInstances[i];if(canvasInstance.isVirtual()&&canvasInstance.getCanvasId()===canvasId||canvasInstance.includesVirtualSubCanvas(canvasId))return canvasInstance}else for(var i=0;i<this.canvasInstances.length;i++){var canvasInstance=this.canvasInstances[i],id=canvasInstance.getCanvasId();if(id){var canvasInstanceId=Manifesto.Utils.normaliseUrl(id);if(canvasInstanceId===canvasId)return canvasInstance}}},AVComponent.prototype._getCurrentCanvas=function(){if(this._data.canvasId)return this._getCanvasInstanceById(this._data.canvasId)},AVComponent.prototype._rewind=function(){if(!this._data.limitToRange){var canvasInstance=this._getCurrentCanvas();canvasInstance&&canvasInstance.set({range:void 0})}},AVComponent.prototype.play=function(){var currentCanvas=this._getCurrentCanvas();currentCanvas&&currentCanvas.play()},AVComponent.prototype.pause=function(){var currentCanvas=this._getCurrentCanvas();currentCanvas&&currentCanvas.pause()},AVComponent.prototype.playRange=function(rangeId){if(this._data.helper){var range=this._data.helper.getRangeById(rangeId);range&&this.set({range:jQuery.extend(!0,{},range)})}},AVComponent.prototype.showCanvas=function(canvasId){var currentCanvas=this._getCurrentCanvas();currentCanvas&&currentCanvas.getCanvasId()===canvasId&&!currentCanvas.isVisible()?currentCanvas.set({visible:!0}):this.set({canvasId:canvasId})},AVComponent.prototype._logMessage=function(message){this.fire(AVComponent.Events.LOG,message)},AVComponent.prototype._getPosterImageCss=function(expanded){var currentCanvas=this._getCurrentCanvas();if(currentCanvas){var $options=currentCanvas.$playerElement.find(".options-container"),containerWidth=currentCanvas.$playerElement.parent().width(),containerHeight=currentCanvas.$playerElement.parent().height()-$options.height();if(expanded)return{top:0,left:0,width:containerWidth,height:containerHeight};var ratio=void 0,width=void 0,height=void 0;return this._posterCanvasWidth>this._posterCanvasHeight?(ratio=this._posterCanvasHeight/this._posterCanvasWidth,width=containerWidth*this._data.posterImageRatio,height=width*ratio):(ratio=this._posterCanvasWidth/this._posterCanvasHeight,height=containerHeight*this._data.posterImageRatio,width=height*ratio),{top:0,left:containerWidth-width,width:width,height:height}}return null},AVComponent.prototype.resize=function(){this.canvasInstances.forEach(function(canvasInstance){canvasInstance.resize()});var currentCanvas=this._getCurrentCanvas();currentCanvas&&this._$posterImage&&this._$posterImage.is(":visible")&&(this._posterImageExpanded?this._$posterImage.css(this._getPosterImageCss(!0)):this._$posterImage.css(this._getPosterImageCss(!1)))},AVComponent}(_Components.BaseComponent);IIIFComponents.AVComponent=AVComponent}(IIIFComponents||(IIIFComponents={})),function(IIIFComponents){var AVComponent;!function(AVComponent){var Events=function(){function Events(){}return Events.MEDIA_READY="mediaready",Events.LOG="log",Events.RANGE_CHANGED="rangechanged",Events.WAVEFORM_READY="waveformready",Events.WAVEFORMS_READY="waveformsready",Events}();AVComponent.Events=Events}(AVComponent=IIIFComponents.AVComponent||(IIIFComponents.AVComponent={}))}(IIIFComponents||(IIIFComponents={})),function(g){g.IIIFComponents?g.IIIFComponents.AVComponent=IIIFComponents.AVComponent:g.IIIFComponents=IIIFComponents}(global);var IIIFComponents,__extends=this&&this.__extends||function(){var extendStatics=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(d,b){d.__proto__=b}||function(d,b){for(var p in b)b.hasOwnProperty(p)&&(d[p]=b[p])};return function(d,b){function __(){this.constructor=d}extendStatics(d,b),d.prototype=null===b?Object.create(b):(__.prototype=b.prototype,new __)}}();!function(IIIFComponents){var AVVolumeControl=function(_super){function AVVolumeControl(options){var _this=_super.call(this,options)||this;return _this._lastVolume=1,_this._data={volume:1},_this._init(),_this._resize(),_this}return __extends(AVVolumeControl,_super),AVVolumeControl.prototype._init=function(){var _this=this,success=_super.prototype._init.call(this);success||console.error("Component failed to initialise"),this._$volumeMute=$('\n                                <button class="btn volume-mute" title="'+this.options.data.content.mute+'">\n                                    <i class="av-icon av-icon-mute on" aria-hidden="true"></i>'+this.options.data.content.mute+"\n                                </button>"),this._$volumeSlider=$('<div class="volume-slider"></div>'),this._$element.append(this._$volumeMute,this._$volumeSlider);var that=this;return this._$volumeMute.on("touchstart click",function(e){e.preventDefault(),0!==_this._data.volume?(_this._lastVolume=_this._data.volume,_this._data.volume=0):_this._data.volume=_this._lastVolume,_this.fire(AVVolumeControl.Events.VOLUME_CHANGED,_this._data.volume)}),this._$volumeSlider.slider({value:that._data.volume,step:.1,orientation:"horizontal",range:"min",min:0,max:1,animate:!1,create:function(evt,ui){},slide:function(evt,ui){that._data.volume=ui.value,0===that._data.volume&&(that._lastVolume=0),that.fire(AVVolumeControl.Events.VOLUME_CHANGED,that._data.volume)},stop:function(evt,ui){}}),success},AVVolumeControl.prototype.set=function(data){this._data=Object.assign(this._data,data),this._render()},AVVolumeControl.prototype._render=function(){if(void 0!==this._data.volume)if(this._$volumeSlider.slider({value:this._data.volume}),0===this._data.volume){var label=this.options.data.content.unmute;this._$volumeMute.prop("title",label),this._$volumeMute.find("i").switchClass("on","off")}else{var label=this.options.data.content.mute;this._$volumeMute.prop("title",label),this._$volumeMute.find("i").switchClass("off","on")}},AVVolumeControl.prototype._resize=function(){},AVVolumeControl}(_Components.BaseComponent);IIIFComponents.AVVolumeControl=AVVolumeControl}(IIIFComponents||(IIIFComponents={})),function(IIIFComponents){var AVVolumeControl;!function(AVVolumeControl){var Events=function(){function Events(){}return Events.VOLUME_CHANGED="volumechanged",Events}();AVVolumeControl.Events=Events}(AVVolumeControl=IIIFComponents.AVVolumeControl||(IIIFComponents.AVVolumeControl={}))}(IIIFComponents||(IIIFComponents={}));var IIIFComponents,__extends=this&&this.__extends||function(){var extendStatics=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(d,b){d.__proto__=b}||function(d,b){for(var p in b)b.hasOwnProperty(p)&&(d[p]=b[p])};return function(d,b){function __(){this.constructor=d}extendStatics(d,b),d.prototype=null===b?Object.create(b):(__.prototype=b.prototype,new __)}}();!function(IIIFComponents){var CanvasInstance=function(_super){function CanvasInstance(options){var _this=_super.call(this,options)||this;return _this._canvasClockFrequency=25,_this._canvasClockStartDate=0,_this._canvasClockTime=0,_this._canvasHeight=0,_this._canvasWidth=0,_this._data=_this.data(),_this._highPriorityFrequency=25,_this._isPlaying=!1,_this._isStalled=!1,_this._lowPriorityFrequency=250,_this._mediaSyncMarginSecs=1,_this._rangeSpanPadding=.25,_this._readyMediaCount=0,_this._stallRequestedBy=[],_this._wasPlaying=!1,_this.ranges=[],_this.waveforms=[],_this._scaleY=function(amplitude,height){var range=256;return Math.max(_this._data.waveformBarWidth,amplitude*height/range)},_this._data=_this.options.data,_this.$playerElement=$('<div class="player"></div>'),_this}return __extends(CanvasInstance,_super),CanvasInstance.prototype.init=function(){var _this=this;if(!this._data||!this._data.content||!this._data.canvas)return void console.warn("unable to initialise, missing canvas or content");this._$hoverPreviewTemplate=$('<div class="hover-preview"><div class="label"></div><div class="pointer"><span class="arrow"></span></div></div>'),this._$canvasContainer=$('<div class="canvas-container"></div>'),this._$optionsContainer=$('<div class="options-container"></div>'),this._$rangeTimelineContainer=$('<div class="range-timeline-container"></div>'),this._$canvasTimelineContainer=$('<div class="canvas-timeline-container"></div>'),this._$canvasHoverPreview=this._$hoverPreviewTemplate.clone(),this._$canvasHoverHighlight=$('<div class="hover-highlight"></div>'),this._$rangeHoverPreview=this._$hoverPreviewTemplate.clone(),this._$rangeHoverHighlight=$('<div class="hover-highlight"></div>'),this._$durationHighlight=$('<div class="duration-highlight"></div>'),this._$timelineItemContainer=$('<div class="timeline-item-container"></div>'),this._$controlsContainer=$('<div class="controls-container"></div>'),this._$prevButton=$('\n                                <button class="btn" title="'+this._data.content.previous+'">\n                                    <i class="av-icon av-icon-previous" aria-hidden="true"></i>'+this._data.content.previous+"\n                                </button>"),this._$playButton=$('\n                                <button class="btn" title="'+this._data.content.play+'">\n                                    <i class="av-icon av-icon-play play" aria-hidden="true"></i>'+this._data.content.play+"\n                                </button>"),this._$nextButton=$('\n                                <button class="btn" title="'+this._data.content.next+'">\n                                    <i class="av-icon av-icon-next" aria-hidden="true"></i>'+this._data.content.next+"\n                                </button>"),this._$timeDisplay=$('<div class="time-display"><span class="canvas-time"></span> / <span class="canvas-duration"></span></div>'),this._$canvasTime=this._$timeDisplay.find(".canvas-time"),this._$canvasDuration=this._$timeDisplay.find(".canvas-duration"),this.isVirtual()&&this.$playerElement.addClass("virtual");var $volume=$('<div class="volume"></div>');if(this._volume=new IIIFComponents.AVVolumeControl({target:$volume[0],data:Object.assign({},this._data)}),this._volume.on(IIIFComponents.AVVolumeControl.Events.VOLUME_CHANGED,function(value){_this.fire(IIIFComponents.AVVolumeControl.Events.VOLUME_CHANGED,value)},!1),this._$controlsContainer.append(this._$prevButton,this._$playButton,this._$nextButton,this._$timeDisplay,$volume),this._$canvasTimelineContainer.append(this._$canvasHoverPreview,this._$canvasHoverHighlight,this._$durationHighlight),this._$rangeTimelineContainer.append(this._$rangeHoverPreview,this._$rangeHoverHighlight),this._$optionsContainer.append(this._$canvasTimelineContainer,this._$rangeTimelineContainer,this._$timelineItemContainer,this._$controlsContainer),this.$playerElement.append(this._$canvasContainer,this._$optionsContainer),this._$canvasHoverPreview.hide(),this._$rangeHoverPreview.hide(),this._data&&this._data.helper&&this._data.canvas){var ranges_1=[];this.isVirtual()?this._data.canvas.canvases.forEach(function(canvas){if(_this._data&&_this._data.helper){var r=_this._data.helper.getCanvasRanges(canvas),clonedRanges_1=[];r.forEach(function(range){var clonedRange=jQuery.extend(!0,{},range);if(clonedRanges_1.push(clonedRange),clonedRange.canvases&&clonedRange.canvases.length)for(var i=0;i<clonedRange.canvases.length;i++)clonedRange.canvases[i]=IIIFComponents.AVComponentUtils.Utils.retargetTemporalComponent(_this._data.canvas.canvases,clonedRange.__jsonld.items[i].id)}),ranges_1.push.apply(ranges_1,clonedRanges_1)}}):ranges_1=ranges_1.concat(this._data.helper.getCanvasRanges(this._data.canvas)),ranges_1.forEach(function(range){_this.ranges.push(range)})}var canvasWidth=this._data.canvas.getWidth(),canvasHeight=this._data.canvas.getHeight();canvasWidth?this._canvasWidth=canvasWidth:this._canvasWidth=this.$playerElement.parent().width(),canvasHeight?this._canvasHeight=canvasHeight:this._canvasHeight=this._canvasWidth*this._data.defaultAspectRatio;var that=this,prevClicks=0,prevTimeout=0;this._$prevButton.on("touchstart click",function(e){e.preventDefault(),prevClicks++,1===prevClicks?(_this._previous(!1),prevTimeout=setTimeout(function(){prevClicks=0,prevTimeout=0},_this._data.doubleClickMS)):(_this._previous(!0),clearTimeout(prevTimeout),prevClicks=0,prevTimeout=0)}),this._$playButton.on("touchstart click",function(e){e.preventDefault(),_this._isPlaying?_this.pause():_this.play()}),this._$nextButton.on("touchstart click",function(e){e.preventDefault(),_this._next()}),this._$canvasTimelineContainer.slider({value:0,step:.01,orientation:"horizontal",range:"min",max:that._getDuration(),animate:!1,create:function(evt,ui){},slide:function(evt,ui){that._setCurrentTime(ui.value)},stop:function(evt,ui){}}),this._$canvasTimelineContainer.mouseout(function(){that._$canvasHoverHighlight.width(0),that._$canvasHoverPreview.hide()}),this._$rangeTimelineContainer.mouseout(function(){that._$rangeHoverHighlight.width(0),that._$rangeHoverPreview.hide()}),this._$canvasTimelineContainer.on("mousemove",function(e){_this._updateHoverPreview(e,_this._$canvasTimelineContainer,_this._getDuration())}),this._$rangeTimelineContainer.on("mousemove",function(e){if(_this._data.range){var duration=_this._data.range.getDuration();_this._updateHoverPreview(e,_this._$rangeTimelineContainer,duration?duration.getLength():0)}}),this._contentAnnotations=[];var items=this._data.canvas.getContent();this._$timelineItemContainer.hide();for(var i=0;i<items.length;i++){var item=items[i],mediaSource=void 0,bodies=item.getBody();if(!bodies.length)return void console.warn("item has no body");var body=this._getBody(bodies);if(body){var type=body.getType(),format=body.getFormat();type&&"textualbody"===type.toString()||(mediaSource=body.id.split("#")[0]);var target=item.getTarget();if(!target)return void console.warn("item has no target");var xywh=IIIFComponents.AVComponentUtils.Utils.getSpatialComponent(target),t=Manifesto.Utils.getTemporalComponent(target);xywh||(xywh=[0,0,this._canvasWidth,this._canvasHeight]),t||(t=[0,this._getDuration()]);var positionLeft=parseInt(String(xywh[0])),positionTop=parseInt(String(xywh[1])),mediaWidth=parseInt(String(xywh[2])),mediaHeight=parseInt(String(xywh[3])),startTime=parseInt(String(t[0])),endTime=parseInt(String(t[1])),percentageTop=this._convertToPercentage(positionTop,this._canvasHeight),percentageLeft=this._convertToPercentage(positionLeft,this._canvasWidth),percentageWidth=this._convertToPercentage(mediaWidth,this._canvasWidth),percentageHeight=this._convertToPercentage(mediaHeight,this._canvasHeight),temporalOffsets=/t=([^&]+)/g.exec(body.id),ot=void 0;ot=temporalOffsets&&temporalOffsets[1]?temporalOffsets[1].split(","):[null,null];var offsetStart=ot[0]?parseInt(ot[0]):ot[0],offsetEnd=ot[1]?parseInt(ot[1]):ot[1],itemData={active:!1,end:endTime,endOffset:offsetEnd,format:format,height:percentageHeight,left:percentageLeft,source:mediaSource,start:startTime,startOffset:offsetStart,top:percentageTop,type:type,width:percentageWidth};this._renderMediaElement(itemData);var seeAlso=item.getProperty("seeAlso");if(seeAlso&&seeAlso.length){var dat=seeAlso[0].id;this.waveforms.push(dat)}}else console.warn("unable to find suitable format for",item.id)}this._renderWaveform()},CanvasInstance.prototype._getBody=function(bodies){for(var i=0;i<bodies.length;i++){var body=bodies[i],format=body.getFormat();if(format&&IIIFComponents.AVComponentUtils.Utils.isHLSFormat(format)&&IIIFComponents.AVComponentUtils.Utils.canPlayHls())return body}for(var i=0;i<bodies.length;i++){var body=bodies[i],format=body.getFormat();if(format&&IIIFComponents.AVComponentUtils.Utils.isMpegDashFormat(format)&&!IIIFComponents.AVComponentUtils.Utils.isSafari())return body}for(var i=0;i<bodies.length;i++){var body=bodies[i],format=body.getFormat();if(format&&!IIIFComponents.AVComponentUtils.Utils.isHLSFormat(format)&&!IIIFComponents.AVComponentUtils.Utils.isMpegDashFormat(format))return body}return null},CanvasInstance.prototype._getDuration=function(){return this._data&&this._data.canvas?this._data.canvas.getDuration():0},CanvasInstance.prototype.data=function(){return{waveformColor:"#fff",waveformBarSpacing:4,waveformBarWidth:2,volume:1}},CanvasInstance.prototype.isVirtual=function(){return this._data.canvas instanceof IIIFComponents.AVComponentObjects.VirtualCanvas},CanvasInstance.prototype.isVisible=function(){return!!this._data.visible},CanvasInstance.prototype.includesVirtualSubCanvas=function(canvasId){if(this.isVirtual()&&this._data.canvas&&this._data.canvas.canvases)for(var i=0;i<this._data.canvas.canvases.length;i++){var canvas=this._data.canvas.canvases[i];if(Manifesto.Utils.normaliseUrl(canvas.id)===canvasId)return!0}return!1},CanvasInstance.prototype.set=function(data){var _this=this,oldData=Object.assign({},this._data);this._data=Object.assign(this._data,data);var diff=IIIFComponents.AVComponentUtils.Utils.diff(oldData,this._data);if(diff.includes("visible")&&this._data.canvas&&(this._data.visible?(this._rewind(),this.$playerElement.show()):(this.$playerElement.hide(),this.pause()),this.resize()),diff.includes("range")&&this._data.helper)if(this._data.range){var duration=this._data.range.getDuration();duration&&(this._data.range.autoChanged||this._setCurrentTime(duration.start),this._data.autoPlay&&this.play(),this.fire(IIIFComponents.AVComponent.Events.RANGE_CHANGED,this._data.range.id))}else this.fire(IIIFComponents.AVComponent.Events.RANGE_CHANGED,null);diff.includes("volume")?this._contentAnnotations.forEach(function($mediaElement){$($mediaElement.element).prop("volume",_this._data.volume),_this._volume.set({volume:_this._data.volume})}):this._render(),diff.includes("limitToRange")&&this._render()},CanvasInstance.prototype._hasRangeChanged=function(){var range=this._getRangeForCurrentTime();range&&!this._data.limitToRange&&(!this._data.range||this._data.range&&range.id!==this._data.range.id)&&this.set({range:jQuery.extend(!0,{autoChanged:!0},range)})},CanvasInstance.prototype._getRangeForCurrentTime=function(parentRange){var ranges;ranges=parentRange?parentRange.getRanges():this.ranges;for(var i=0;i<ranges.length;i++){var range=ranges[i];if(this._rangeSpansCurrentTime(range)){if(this._rangeNavigable(range))return range;for(var childRanges=range.getRanges(),i_1=0;i_1<childRanges.length;i_1++){var childRange=childRanges[i_1];if(this._rangeSpansCurrentTime(childRange))return this._getRangeForCurrentTime(childRange)}return range.parentRange}}},CanvasInstance.prototype._rangeSpansCurrentTime=function(range){return!!range.spansTime(Math.ceil(this._canvasClockTime)+this._rangeSpanPadding)},CanvasInstance.prototype._rangeNavigable=function(range){var behavior=range.getBehavior();return!behavior||behavior.toString()!==manifesto.Behavior.nonav().toString()},CanvasInstance.prototype._render=function(){if(this._data.range){var duration=this._data.range.getDuration();if(duration){var totalLength=this._getDuration(),timelineLength=this._$canvasTimelineContainer.width(),ratio=timelineLength/totalLength,start=duration.start*ratio,end=duration.end*ratio;(end>totalLength||end<start)&&(end=totalLength);var width=end-start;this.isVirtual()?(this._$durationHighlight.show(),this._$durationHighlight.css({left:start,width:width})):this._$durationHighlight.hide();var that_1=this;this._$rangeTimelineContainer.slider("destroy"),this._$rangeTimelineContainer.slider({value:duration.start,step:.01,orientation:"horizontal",range:"min",min:duration.start,max:duration.end,animate:!1,create:function(evt,ui){},slide:function(evt,ui){that_1._setCurrentTime(ui.value)},stop:function(evt,ui){}})}}else this._$durationHighlight.hide();this._data.limitToRange&&this._data.range?(this._$canvasTimelineContainer.hide(),this._$rangeTimelineContainer.show()):(this._$canvasTimelineContainer.show(),this._$rangeTimelineContainer.hide()),this._updateCurrentTimeDisplay(),this._updateDurationDisplay(),this._drawWaveform()},CanvasInstance.prototype.getCanvasId=function(){if(this._data&&this._data.canvas)return this._data.canvas.id},CanvasInstance.prototype._updateHoverPreview=function(e,$container,duration){var offset=$container.offset(),x=e.pageX-offset.left,$hoverArrow=$container.find(".arrow"),$hoverHighlight=$container.find(".hover-highlight"),$hoverPreview=$container.find(".hover-preview");$hoverHighlight.width(x);var fullWidth=$container.width(),ratio=x/fullWidth,seconds=Math.min(duration*ratio);$hoverPreview.find(".label").text(IIIFComponents.AVComponentUtils.Utils.formatTime(seconds));var hoverPreviewWidth=$hoverPreview.outerWidth(),hoverPreviewHeight=$hoverPreview.outerHeight(),left=x-.5*hoverPreviewWidth,arrowLeft=.5*hoverPreviewWidth-6;left<0&&(left=0,arrowLeft=x-6),left+hoverPreviewWidth>fullWidth&&(left=fullWidth-hoverPreviewWidth,arrowLeft=hoverPreviewWidth-(fullWidth-x)-6),$hoverPreview.css({left:left,top:hoverPreviewHeight*-1+"px"}).show(),$hoverArrow.css({left:arrowLeft})},CanvasInstance.prototype._previous=function(isDouble){this._data.limitToRange?isDouble?this._isNavigationConstrainedToRange()?this._rewind():this.fire(IIIFComponents.AVComponentCanvasInstance.Events.PREVIOUS_RANGE):this._rewind():this._data.range?isDouble?(this.set({range:void 0}),this._rewind()):this.fire(IIIFComponents.AVComponentCanvasInstance.Events.PREVIOUS_RANGE):this._rewind()},CanvasInstance.prototype._next=function(){this._data.limitToRange&&this._isNavigationConstrainedToRange()?this._fastforward():this.fire(IIIFComponents.AVComponentCanvasInstance.Events.NEXT_RANGE)},CanvasInstance.prototype.destroy=function(){window.clearInterval(this._highPriorityInterval),window.clearInterval(this._lowPriorityInterval),window.clearInterval(this._canvasClockInterval)},CanvasInstance.prototype._convertToPercentage=function(pixelValue,maxValue){var percentage=pixelValue/maxValue*100;return percentage},CanvasInstance.prototype._renderMediaElement=function(data){var $mediaElement,_this=this,type=data.type.toString().toLowerCase();switch(type){case"image":$mediaElement=$('<img class="anno" src="'+data.source+'" />');break;case"video":$mediaElement=$('<video class="anno" />');break;case"audio":$mediaElement=$('<audio class="anno" />');break;case"textualbody":$mediaElement=$('<div class="anno">'+data.source+"</div>");break;default:return}var media=$mediaElement[0];if(data.format&&"application/dash+xml"===data.format.toString()){$mediaElement.attr("data-dashjs-player","");
+var player=dashjs.MediaPlayer().create();player.initialize(media,data.source)}else if(data.format&&"application/vnd.apple.mpegurl"===data.format.toString())if(Hls.isSupported()){var hls=new Hls;hls.loadSource(data.source),hls.attachMedia(media)}else media.canPlayType("application/vnd.apple.mpegurl")&&(media.src=data.source);else $mediaElement.attr("src",data.source);if($mediaElement.css({top:data.top+"%",left:data.left+"%",width:data.width+"%",height:data.height+"%"}).hide(),data.element=$mediaElement,"video"===type||"audio"===type){data.timeout=null;var that_2=this;data.checkForStall=function(){var self=this;this.active?(that_2._checkMediaSynchronization(),this.element.get(0).readyState>0&&!this.outOfSync?that_2._playbackStalled(!1,self):(that_2._playbackStalled(!0,self),this.timeout&&window.clearTimeout(this.timeout),this.timeout=window.setTimeout(function(){self.checkForStall()},1e3))):that_2._playbackStalled(!1,self)}}this._contentAnnotations.push(data),this.$playerElement&&this._$canvasContainer.append($mediaElement),"video"!==type&&"audio"!==type||($mediaElement.on("loadstart",function(){}),$mediaElement.on("waiting",function(){}),$mediaElement.on("seeking",function(){}),$mediaElement.on("loadedmetadata",function(){_this._readyMediaCount++,_this._readyMediaCount===_this._contentAnnotations.length&&(_this._setCurrentTime(0),_this._data.autoPlay&&_this.play(),_this._updateDurationDisplay(),_this.fire(IIIFComponents.AVComponent.Events.MEDIA_READY))}),$mediaElement.attr("preload","auto"),$mediaElement.get(0).load()),this._renderSyncIndicator(data)},CanvasInstance.prototype._getWaveformData=function(url){return new Promise(function(resolve,reject){$.ajax({url:url,type:"GET",dataType:"binary",responseType:"arraybuffer",processData:!1}).done(function(data){resolve(WaveformData.create(data))}).fail(function(err){reject(new Error("Network Error"))})})},CanvasInstance.prototype._renderWaveform=function(){var _this=this;if(this.waveforms.length){var promises=this.waveforms.map(function(url){return _this._getWaveformData(url)});Promise.all(promises).then(function(waveforms){_this._waveformCanvas=document.createElement("canvas"),_this._waveformCanvas.classList.add("waveform"),_this._$canvasContainer.append(_this._waveformCanvas),_this._waveformCtx=_this._waveformCanvas.getContext("2d"),_this._waveformCtx&&(_this._waveformCtx.fillStyle=_this._data.waveformColor,_this._compositeWaveform=new IIIFComponents.AVComponentObjects.CompositeWaveform(waveforms),_this.fire(IIIFComponents.AVComponent.Events.WAVEFORM_READY))})}},CanvasInstance.prototype._drawWaveform=function(){if(this._waveformCtx){var duration,start=0,end=this._compositeWaveform.duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration&&(start=duration.start,end=duration.end);var startpx=start*this._compositeWaveform.pixelsPerSecond,endpx=end*this._compositeWaveform.pixelsPerSecond,canvasWidth=this._waveformCtx.canvas.width,canvasHeight=this._waveformCtx.canvas.height,barSpacing=this._data.waveformBarSpacing,barWidth=this._data.waveformBarWidth,increment=Math.floor((endpx-startpx)/canvasWidth*barSpacing),sampleSpacing=canvasWidth/barSpacing;this._waveformCtx.clearRect(0,0,canvasWidth,canvasHeight),this._waveformCtx.fillStyle=this._data.waveformColor;for(var x=startpx;x<endpx;x+=increment){var maxMin=this._getWaveformMaxAndMin(this._compositeWaveform,x,sampleSpacing),height=this._scaleY(maxMin.max-maxMin.min,canvasHeight),ypos=(canvasHeight-height)/2,xpos=canvasWidth*IIIFComponents.AVComponentUtils.Utils.normalise(x,startpx,endpx);this._waveformCtx.fillRect(xpos,ypos,barWidth,height)}}},CanvasInstance.prototype._getWaveformMaxAndMin=function(waveform,index,sampleSpacing){for(var max=-127,min=128,x=index;x<index+sampleSpacing;x++)waveform.max(x)>max&&(max=waveform.max(x)),waveform.min(x)<min&&(min=waveform.min(x));return{max:max,min:min}},CanvasInstance.prototype._updateCurrentTimeDisplay=function(){var duration;if(this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration){var rangeClockTime=this._canvasClockTime-duration.start;this._$canvasTime.text(IIIFComponents.AVComponentUtils.Utils.formatTime(rangeClockTime))}else this._$canvasTime.text(IIIFComponents.AVComponentUtils.Utils.formatTime(this._canvasClockTime))},CanvasInstance.prototype._updateDurationDisplay=function(){var duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration?this._$canvasDuration.text(IIIFComponents.AVComponentUtils.Utils.formatTime(duration.getLength())):this._$canvasDuration.text(IIIFComponents.AVComponentUtils.Utils.formatTime(this._getDuration()))},CanvasInstance.prototype._renderSyncIndicator=function(mediaElementData){var leftPercent=this._convertToPercentage(mediaElementData.start,this._getDuration()),widthPercent=this._convertToPercentage(mediaElementData.end-mediaElementData.start,this._getDuration()),$timelineItem=$('<div class="timeline-item" title="'+mediaElementData.source+'" data-start="'+mediaElementData.start+'" data-end="'+mediaElementData.end+'"></div>');$timelineItem.css({left:leftPercent+"%",width:widthPercent+"%"});var $lineWrapper=$('<div class="line-wrapper"></div>');$timelineItem.appendTo($lineWrapper),mediaElementData.timelineElement=$timelineItem,this.$playerElement&&this._$timelineItemContainer.append($lineWrapper)},CanvasInstance.prototype._setCurrentTime=function(seconds){this._canvasClockTime=seconds,this._canvasClockStartDate=Date.now()-1e3*this._canvasClockTime,this.logMessage("SET CURRENT TIME to: "+this._canvasClockTime+" seconds."),this._canvasClockUpdater(),this._highPriorityUpdater(),this._lowPriorityUpdater(),this._synchronizeMedia()},CanvasInstance.prototype._rewind=function(withoutUpdate){this.pause();var duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration?this._canvasClockTime=duration.start:this._canvasClockTime=0,this._data.limitToRange||this._data&&this._data.helper&&this.set({range:void 0})},CanvasInstance.prototype._fastforward=function(){var duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration?this._canvasClockTime=duration.end:this._canvasClockTime=this._getDuration(),this.pause()},CanvasInstance.prototype.play=function(withoutUpdate){var _this=this;if(!this._isPlaying){var duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration&&this._canvasClockTime>=duration.end&&(this._canvasClockTime=duration.start),this._canvasClockTime===this._getDuration()&&(this._canvasClockTime=0),this._canvasClockStartDate=Date.now()-1e3*this._canvasClockTime,this._highPriorityInterval=window.setInterval(function(){_this._highPriorityUpdater()},this._highPriorityFrequency),this._lowPriorityInterval=window.setInterval(function(){_this._lowPriorityUpdater()},this._lowPriorityFrequency),this._canvasClockInterval=window.setInterval(function(){_this._canvasClockUpdater()},this._canvasClockFrequency),this._isPlaying=!0,withoutUpdate||this._synchronizeMedia();var label=this._data&&this._data.content?this._data.content.pause:"";this._$playButton.prop("title",label),this._$playButton.find("i").switchClass("play","pause"),this.fire(IIIFComponents.AVComponentCanvasInstance.Events.PLAYCANVAS),this.logMessage("PLAY canvas")}},CanvasInstance.prototype.pause=function(withoutUpdate){window.clearInterval(this._highPriorityInterval),window.clearInterval(this._lowPriorityInterval),window.clearInterval(this._canvasClockInterval),this._isPlaying=!1,withoutUpdate||(this._highPriorityUpdater(),this._lowPriorityUpdater(),this._synchronizeMedia());var label=this._data&&this._data.content?this._data.content.play:"";this._$playButton.prop("title",label),this._$playButton.find("i").switchClass("pause","play"),this.fire(IIIFComponents.AVComponentCanvasInstance.Events.PAUSECANVAS),this.logMessage("PAUSE canvas")},CanvasInstance.prototype._isNavigationConstrainedToRange=function(){return this._data.constrainNavigationToRange},CanvasInstance.prototype._canvasClockUpdater=function(){this._canvasClockTime=(Date.now()-this._canvasClockStartDate)/1e3;var duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration&&this._canvasClockTime>=duration.end&&this.pause(),this._canvasClockTime>=this._getDuration()&&(this._canvasClockTime=this._getDuration(),this.pause())},CanvasInstance.prototype._highPriorityUpdater=function(){this._$rangeTimelineContainer.slider({value:this._canvasClockTime}),this._$canvasTimelineContainer.slider({value:this._canvasClockTime}),this._updateCurrentTimeDisplay(),this._updateDurationDisplay()},CanvasInstance.prototype._lowPriorityUpdater=function(){this._updateMediaActiveStates(),this._isPlaying&&this._data.autoSelectRange&&this.isVirtual()&&this._hasRangeChanged()},CanvasInstance.prototype._updateMediaActiveStates=function(){for(var contentAnnotation,i=0;i<this._contentAnnotations.length;i++){contentAnnotation=this._contentAnnotations[i];var type=contentAnnotation.type.toString().toLowerCase();contentAnnotation.start<=this._canvasClockTime&&contentAnnotation.end>=this._canvasClockTime?(this._checkMediaSynchronization(),contentAnnotation.active||(this._synchronizeMedia(),contentAnnotation.active=!0,contentAnnotation.element.show(),contentAnnotation.timelineElement.addClass("active")),"video"!==type&&"audio"!==type||contentAnnotation.element[0].currentTime>contentAnnotation.element[0].duration-contentAnnotation.endOffset&&this._pauseMedia(contentAnnotation.element[0])):contentAnnotation.active&&(contentAnnotation.active=!1,contentAnnotation.element.hide(),contentAnnotation.timelineElement.removeClass("active"),"video"!==type&&"audio"!==type||this._pauseMedia(contentAnnotation.element[0]))}},CanvasInstance.prototype._pauseMedia=function(media){media.pause()},CanvasInstance.prototype._setMediaCurrentTime=function(media,time){isNaN(media.duration)||(media.currentTime=time)},CanvasInstance.prototype._synchronizeMedia=function(){for(var contentAnnotation,i=0;i<this._contentAnnotations.length;i++){contentAnnotation=this._contentAnnotations[i];var type=contentAnnotation.type.toString().toLowerCase();if("video"===type||"audio"===type){if(this._setMediaCurrentTime(contentAnnotation.element[0],this._canvasClockTime-contentAnnotation.start+contentAnnotation.startOffset),contentAnnotation.start<=this._canvasClockTime&&contentAnnotation.end>=this._canvasClockTime)if(this._isPlaying){if(contentAnnotation.element[0].paused){var promise=contentAnnotation.element[0].play();promise&&promise["catch"](function(){})}}else this._pauseMedia(contentAnnotation.element[0]);else this._pauseMedia(contentAnnotation.element[0]);contentAnnotation.element[0].currentTime>contentAnnotation.element[0].duration-contentAnnotation.endOffset&&this._pauseMedia(contentAnnotation.element[0])}}this.logMessage("SYNC MEDIA at: "+this._canvasClockTime+" seconds.")},CanvasInstance.prototype._checkMediaSynchronization=function(){for(var contentAnnotation,i=0,l=this._contentAnnotations.length;i<l;i++){contentAnnotation=this._contentAnnotations[i];var type=contentAnnotation.type.toString().toLowerCase();if(("video"===type||"audio"===type)&&contentAnnotation.start<=this._canvasClockTime&&contentAnnotation.end>=this._canvasClockTime){var correctTime=this._canvasClockTime-contentAnnotation.start+contentAnnotation.startOffset,factualTime=contentAnnotation.element[0].currentTime;if(Math.abs(factualTime-correctTime)>this._mediaSyncMarginSecs){contentAnnotation.outOfSync=!0;var lag=Math.abs(factualTime-correctTime);this.logMessage("DETECTED synchronization lag: "+Math.abs(lag)),this._setMediaCurrentTime(contentAnnotation.element[0],correctTime)}else contentAnnotation.outOfSync=!1}}},CanvasInstance.prototype._playbackStalled=function(aBoolean,syncMediaRequestingStall){if(aBoolean)this._stallRequestedBy.indexOf(syncMediaRequestingStall)<0&&this._stallRequestedBy.push(syncMediaRequestingStall),this._isStalled||(this.$playerElement,this._wasPlaying=this._isPlaying,this.pause(!0),this._isStalled=aBoolean);else{var idx=this._stallRequestedBy.indexOf(syncMediaRequestingStall);idx>=0&&this._stallRequestedBy.splice(idx,1),0===this._stallRequestedBy.length&&(this._isStalled&&this._wasPlaying&&this.play(!0),this._isStalled=aBoolean)}},CanvasInstance.prototype.resize=function(){if(this.$playerElement){var containerWidth=this._$canvasContainer.width();if(containerWidth){this._$canvasTimelineContainer.width(containerWidth);var $options=this.$playerElement.find(".options-container");void 0!==this._data.halveAtWidth&&this.$playerElement.parent().width()<this._data.halveAtWidth?this._$canvasContainer.height(this.$playerElement.parent().height()/2):this._$canvasContainer.height(this.$playerElement.parent().height()-$options.height())}if(this._waveformCanvas){var canvasWidth=this._$canvasContainer.width(),canvasHeight=this._$canvasContainer.height();this._waveformCanvas.width=this._lastCanvasWidth=canvasWidth,this._waveformCanvas.height=this._lastCanvasHeight=canvasHeight}this._render()}},CanvasInstance}(_Components.BaseComponent);IIIFComponents.CanvasInstance=CanvasInstance}(IIIFComponents||(IIIFComponents={})),function(IIIFComponents){var AVComponentCanvasInstance;!function(AVComponentCanvasInstance){var Events=function(){function Events(){}return Events.NEXT_RANGE="nextrange",Events.PAUSECANVAS="pause",Events.PLAYCANVAS="play",Events.PREVIOUS_RANGE="previousrange",Events}();AVComponentCanvasInstance.Events=Events}(AVComponentCanvasInstance=IIIFComponents.AVComponentCanvasInstance||(IIIFComponents.AVComponentCanvasInstance={}))}(IIIFComponents||(IIIFComponents={}));var IIIFComponents;!function(IIIFComponents){var AVComponentObjects;!function(AVComponentObjects){var CompositeWaveform=function(){function CompositeWaveform(waveforms){var _this=this;this.length=0,this.duration=0,this.pixelsPerSecond=Number.MAX_VALUE,this.secondsPerPixel=Number.MAX_VALUE,this._waveforms=[],waveforms.forEach(function(waveform){_this._waveforms.push({start:_this.length,end:_this.length+waveform.adapter.length,waveform:waveform}),_this.length+=waveform.adapter.length,_this.duration+=waveform.duration,_this.pixelsPerSecond=Math.min(_this.pixelsPerSecond,waveform.pixels_per_second),_this.secondsPerPixel=Math.min(_this.secondsPerPixel,waveform.seconds_per_pixel)})}return CompositeWaveform.prototype.min=function(index){var waveform=this._find(index);return waveform?waveform.waveform.min_sample(index-waveform.start):0},CompositeWaveform.prototype.max=function(index){var waveform=this._find(index);return waveform?waveform.waveform.max_sample(index-waveform.start):0},CompositeWaveform.prototype._find=function(index){var waveforms=this._waveforms.filter(function(waveform){return index>=waveform.start&&index<waveform.end});return waveforms.length>0?waveforms[0]:null},CompositeWaveform}();AVComponentObjects.CompositeWaveform=CompositeWaveform}(AVComponentObjects=IIIFComponents.AVComponentObjects||(IIIFComponents.AVComponentObjects={}))}(IIIFComponents||(IIIFComponents={}));var IIIFComponents;!function(IIIFComponents){var AVComponentUtils;!function(AVComponentUtils){var Utils=function(){function Utils(){}return Utils._compare=function(a,b){var changed=[];return Object.keys(a).forEach(function(p){Object.is(b[p],a[p])||changed.push(p)}),changed},Utils.diff=function(a,b){return Array.from(new Set(Utils._compare(a,b).concat(Utils._compare(b,a))))},Utils.getSpatialComponent=function(target){var spatial=/xywh=([^&]+)/g.exec(target),xywh=null;return spatial&&spatial[1]&&(xywh=spatial[1].split(",")),xywh},Utils.getFirstTargetedCanvasId=function(range){var canvasId;if(range.canvases&&range.canvases.length)canvasId=range.canvases[0];else{var childRanges=range.getRanges();if(childRanges.length)return Utils.getFirstTargetedCanvasId(childRanges[0])}if(void 0!==canvasId)return Manifesto.Utils.normaliseUrl(canvasId)},Utils.getTimestamp=function(){return String((new Date).valueOf())},Utils.retargetTemporalComponent=function(canvases,target){var t=Manifesto.Utils.getTemporalComponent(target);if(t){for(var offset=0,targetWithoutTemporal=target.substr(0,target.indexOf("#")),i=0;i<canvases.length;i++){var canvas=canvases[i];if(canvas.id.includes(targetWithoutTemporal))break;var duration=canvas.getDuration();duration&&(offset+=duration)}return t[0]=Number(t[0])+offset,t[1]=Number(t[1])+offset,targetWithoutTemporal+"#t="+t[0]+","+t[1]}},Utils.formatTime=function(aNumber){var hours,minutes,seconds,hourValue;return seconds=Math.ceil(aNumber),hours=Math.floor(seconds/3600),hours=hours>=10?hours:"0"+hours,minutes=Math.floor(seconds%3600/60),minutes=minutes>=10?minutes:"0"+minutes,seconds=Math.floor(seconds%3600%60),seconds=seconds>=10?seconds:"0"+seconds,hourValue=hours>=1?hours+":":"",hourValue+minutes+":"+seconds},Utils.detectIE=function(){var ua=window.navigator.userAgent,msie=ua.indexOf("MSIE ");if(msie>0)return parseInt(ua.substring(msie+5,ua.indexOf(".",msie)),10);var trident=ua.indexOf("Trident/");if(trident>0){var rv=ua.indexOf("rv:");return parseInt(ua.substring(rv+3,ua.indexOf(".",rv)),10)}var edge=ua.indexOf("Edge/");return edge>0&&parseInt(ua.substring(edge+5,ua.indexOf(".",edge)),10)},Utils.isSafari=function(){var isSafari=/^((?!chrome|android).)*safari/i.test(navigator.userAgent);return console.log("isSafari",isSafari),isSafari},Utils.debounce=function(fn,debounceDuration){return debounceDuration=debounceDuration||100,function(){if(!fn.debouncing){var args=Array.prototype.slice.apply(arguments);fn.lastReturnVal=fn.apply(window,args),fn.debouncing=!0}return clearTimeout(fn.debounceTimeout),fn.debounceTimeout=setTimeout(function(){fn.debouncing=!1},debounceDuration),fn.lastReturnVal}},Utils.normalise=function(num,min,max){return(num-min)/(max-min)},Utils.isHLSFormat=function(format){return this.hlsMimeTypes.includes(format.toString())},Utils.isMpegDashFormat=function(format){return"application/dash+xml"===format.toString()},Utils.canPlayHls=function(){var doc="object"==typeof document&&document,videoelem=doc&&doc.createElement("video"),isvideosupport=Boolean(videoelem&&videoelem.canPlayType);return isvideosupport&&this.hlsMimeTypes.some(function(canItPlay){return/maybe|probably/i.test(videoelem.canPlayType(canItPlay))})},Utils.hlsMimeTypes=["application/vnd.apple.mpegurl","vnd.apple.mpegurl","audio/mpegurl","audio/x-mpegurl","application/x-mpegurl","video/x-mpegurl","video/mpegurl","application/mpegurl"],Utils}();AVComponentUtils.Utils=Utils}(AVComponentUtils=IIIFComponents.AVComponentUtils||(IIIFComponents.AVComponentUtils={}))}(IIIFComponents||(IIIFComponents={}));var IIIFComponents;!function(IIIFComponents){var AVComponentObjects;!function(AVComponentObjects){var VirtualCanvas=function(){function VirtualCanvas(){this.canvases=[],this.id=IIIFComponents.AVComponentUtils.Utils.getTimestamp()}return VirtualCanvas.prototype.addCanvas=function(canvas){this.canvases.push(jQuery.extend(!0,{},canvas))},VirtualCanvas.prototype.getContent=function(){var _this=this,annotations=[];return this.canvases.forEach(function(canvas){var items=canvas.getContent();items.forEach(function(item){var target=item.getTarget();if(target){var t=Manifesto.Utils.getTemporalComponent(target);t||(item.__jsonld.target+="#t=0,"+canvas.getDuration())}}),items.forEach(function(item){var target=item.getTarget();target&&(item.__jsonld.target=IIIFComponents.AVComponentUtils.Utils.retargetTemporalComponent(_this.canvases,target))}),annotations.push.apply(annotations,items)}),annotations},VirtualCanvas.prototype.getDuration=function(){var duration=0;return this.canvases.forEach(function(canvas){var d=canvas.getDuration();d&&(duration+=d)}),duration},VirtualCanvas.prototype.getWidth=function(){return this.canvases.length?this.canvases[0].getWidth():0},VirtualCanvas.prototype.getHeight=function(){return this.canvases.length?this.canvases[0].getHeight():0},VirtualCanvas}();AVComponentObjects.VirtualCanvas=VirtualCanvas}(AVComponentObjects=IIIFComponents.AVComponentObjects||(IIIFComponents.AVComponentObjects={}))}(IIIFComponents||(IIIFComponents={}));var IIIFComponents;!function(IIIFComponents){var AVComponentObjects;!function(AVComponentObjects){var Waveform=function(){function Waveform(){}return Waveform}();AVComponentObjects.Waveform=Waveform}(AVComponentObjects=IIIFComponents.AVComponentObjects||(IIIFComponents.AVComponentObjects={}))}(IIIFComponents||(IIIFComponents={}))}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{}]},{},[1])(1)});
\ No newline at end of file
diff --git a/dist/iiif-av-component.d.ts b/dist/iiif-av-component.d.ts
index dbe5197..7516d0c 100644
--- a/dist/iiif-av-component.d.ts
+++ b/dist/iiif-av-component.d.ts
@@ -1,4 +1,4 @@
-// iiif-av-component v0.0.76 https://github.com/iiif-commons/iiif-av-component#readme
+// iiif-av-component v0.0.77 https://github.com/iiif-commons/iiif-av-component#readme
 interface Array<T> {
     /**
      * Determines whether an array includes a certain element, returning true or false as appropriate.
@@ -37,6 +37,7 @@ declare namespace IIIFComponents {
         data(): IAVComponentData;
         set(data: IAVComponentData): void;
         private _render();
+        reset(): void;
         private _reset();
         private _checkAllMediaReady();
         private _checkAllWaveformsReady();
diff --git a/dist/iiif-av-component.js b/dist/iiif-av-component.js
index b2db9a4..e19d9e5 100644
--- a/dist/iiif-av-component.js
+++ b/dist/iiif-av-component.js
@@ -1,4 +1,4 @@
-// iiif-av-component v0.0.76 https://github.com/iiif-commons/iiif-av-component#readme
+// iiif-av-component v0.0.77 https://github.com/iiif-commons/iiif-av-component#readme
 (function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.iiifAvComponent = f()}})(function(){var define,module,exports;return (function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c="function"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error("Cannot find module '"+i+"'");throw a.code="MODULE_NOT_FOUND",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u="function"==typeof require&&require,i=0;i<t.length;i++)o(t[i]);return o}return r})()({1:[function(require,module,exports){
 (function (global){
 
@@ -184,6 +184,9 @@ var IIIFComponents;
         };
         AVComponent.prototype._render = function () {
         };
+        AVComponent.prototype.reset = function () {
+            this._reset();
+        };
         AVComponent.prototype._reset = function () {
             var _this = this;
             this.canvasInstances.forEach(function (canvasInstance, index) {
diff --git a/dist/iiif-av-component.min.js b/dist/iiif-av-component.min.js
index f0ea85a..28d15bc 100644
--- a/dist/iiif-av-component.min.js
+++ b/dist/iiif-av-component.min.js
@@ -1,3 +1,3 @@
-// iiif-av-component v0.0.76 https://github.com/iiif-commons/iiif-av-component#readme
-!function(f){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=f();else if("function"==typeof define&&define.amd)define([],f);else{var g;g="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:this,g.iiifAvComponent=f()}}(function(){return function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c="function"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error("Cannot find module '"+i+"'");throw a.code="MODULE_NOT_FOUND",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u="function"==typeof require&&require,i=0;i<t.length;i++)o(t[i]);return o}return r}()({1:[function(require,module,exports){(function(global){var IIIFComponents,__extends=this&&this.__extends||function(){var extendStatics=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(d,b){d.__proto__=b}||function(d,b){for(var p in b)b.hasOwnProperty(p)&&(d[p]=b[p])};return function(d,b){function __(){this.constructor=d}extendStatics(d,b),d.prototype=null===b?Object.create(b):(__.prototype=b.prototype,new __)}}();!function(IIIFComponents){var AVComponent=function(_super){function AVComponent(options){var _this=_super.call(this,options)||this;return _this._data=_this.data(),_this.canvasInstances=[],_this._readyMedia=0,_this._readyWaveforms=0,_this._posterCanvasWidth=0,_this._posterCanvasHeight=0,_this._posterImageExpanded=!1,_this._init(),_this._resize(),_this}return __extends(AVComponent,_super),AVComponent.prototype._init=function(){var success=_super.prototype._init.call(this);return success||console.error("Component failed to initialise"),success},AVComponent.prototype.data=function(){return{autoPlay:!1,constrainNavigationToRange:!1,defaultAspectRatio:.56,doubleClickMS:350,halveAtWidth:200,limitToRange:!1,posterImageRatio:.3,virtualCanvasEnabled:!0,content:{currentTime:"Current Time",collapse:"Collapse",duration:"Duration",expand:"Expand",mute:"Mute",next:"Next",pause:"Pause",play:"Play",previous:"Previous",unmute:"Unmute"}}},AVComponent.prototype.set=function(data){var _this=this,oldData=Object.assign({},this._data);this._data=Object.assign(this._data,data);var diff=IIIFComponents.AVComponentUtils.Utils.diff(oldData,this._data);if(diff.includes("helper")&&this._reset(),!this._data.helper)return void console.warn("must pass a helper object");if(diff.includes("limitToRange")&&this._data.canvasId&&this.canvasInstances.forEach(function(canvasInstance,index){canvasInstance.set({limitToRange:_this._data.limitToRange})}),diff.includes("constrainNavigationToRange")&&this._data.canvasId&&this.canvasInstances.forEach(function(canvasInstance,index){canvasInstance.set({constrainNavigationToRange:_this._data.constrainNavigationToRange})}),diff.includes("autoSelectRange")&&this._data.canvasId&&this.canvasInstances.forEach(function(canvasInstance,index){canvasInstance.set({autoSelectRange:_this._data.autoSelectRange})}),diff.includes("canvasId")&&this._data.canvasId){var nextCanvasInstance_1=this._getCanvasInstanceById(this._data.canvasId);nextCanvasInstance_1&&this.canvasInstances.forEach(function(canvasInstance){canvasInstance.getCanvasId()!==nextCanvasInstance_1.getCanvasId()?canvasInstance.set({visible:!1}):diff.includes("range")?canvasInstance.set({visible:!0,range:_this._data.range?jQuery.extend(!0,{},_this._data.range):void 0}):canvasInstance.set({visible:!0})})}if(diff.includes("virtualCanvasEnabled")&&(this.set({range:void 0}),this._data.virtualCanvasEnabled&&this.canvasInstances.forEach(function(canvasInstance){canvasInstance.isVirtual()&&_this.set({canvasId:canvasInstance.getCanvasId(),range:void 0})})),diff.includes("range")&&this._data.range){var range=this._data.helper.getRangeById(this._data.range.id);if(range){var canvasId=IIIFComponents.AVComponentUtils.Utils.getFirstTargetedCanvasId(range);if(canvasId){var canvasInstance=this._getCanvasInstanceById(canvasId);if(canvasInstance){if(canvasInstance.isVirtual()&&this._data.virtualCanvasEnabled&&canvasInstance.includesVirtualSubCanvas(canvasId)){canvasId=canvasInstance.getCanvasId();for(var i=0;i<canvasInstance.ranges.length;i++){var r=canvasInstance.ranges[i];if(r.id===range.id){range=r;break}}}this._data.canvasId&&(this._data.canvasId.includes("://")?Manifesto.Utils.normaliseUrl(this._data.canvasId):this._data.canvasId)!==canvasId?this.set({canvasId:canvasId,range:jQuery.extend(!0,{},range)}):canvasInstance.set({range:jQuery.extend(!0,{},range)})}}}else console.warn("range not found")}this._render(),this._resize()},AVComponent.prototype._render=function(){},AVComponent.prototype._reset=function(){var _this=this;if(this.canvasInstances.forEach(function(canvasInstance,index){canvasInstance.destroy()}),this.canvasInstances=[],this._$element.empty(),this._data&&this._data.helper){var behavior=this._data.helper.manifest.getBehavior(),canvases=this._getCanvases();if(behavior&&behavior.toString()===manifesto.Behavior.autoadvance().toString()){var virtualCanvas_1=new IIIFComponents.AVComponentObjects.VirtualCanvas;canvases.forEach(function(canvas){virtualCanvas_1.addCanvas(canvas)}),this._initCanvas(virtualCanvas_1)}canvases.forEach(function(canvas){_this._initCanvas(canvas)}),this.canvasInstances.length>0&&(this._data.canvasId=this.canvasInstances[0].getCanvasId()),this._checkAllMediaReadyInterval=setInterval(this._checkAllMediaReady.bind(this),100),this._checkAllWaveformsReadyInterval=setInterval(this._checkAllWaveformsReady.bind(this),100),this._$posterContainer=$('<div class="poster-container"></div>'),this._$element.append(this._$posterContainer),this._$posterImage=$('<div class="poster-image"></div>'),this._$posterExpandButton=$('\n                    <button class="btn" title="'+(this._data&&this._data.content?this._data.content.expand:"")+'">\n                        <i class="av-icon  av-icon-expand expand" aria-hidden="true"></i><span>'+(this._data&&this._data.content?this._data.content.expand:"")+"</span>\n                    </button>\n                "),this._$posterImage.append(this._$posterExpandButton),this._$posterImage.on("touchstart click",function(e){e.preventDefault();var target=_this._getPosterImageCss(!_this._posterImageExpanded);if(_this._$posterImage.animate(target),_this._posterImageExpanded=!_this._posterImageExpanded,_this._posterImageExpanded){var label=_this.options.data.content.collapse;_this._$posterExpandButton.prop("title",label),_this._$posterExpandButton.find("i").switchClass("expand","collapse")}else{var label=_this.options.data.content.expand;_this._$posterExpandButton.prop("title",label),_this._$posterExpandButton.find("i").switchClass("collapse","expand")}});var posterCanvas=this._data.helper.getPosterCanvas();if(posterCanvas){this._posterCanvasWidth=posterCanvas.getWidth(),this._posterCanvasHeight=posterCanvas.getHeight();var posterImage=this._data.helper.getPosterImage();if(posterImage){this._$posterContainer.append(this._$posterImage);var css=this._getPosterImageCss(this._posterImageExpanded);css=Object.assign({},css,{"background-image":"url("+posterImage+")"}),this._$posterImage.css(css)}}}},AVComponent.prototype._checkAllMediaReady=function(){console.log("loading media"),this._readyMedia===this.canvasInstances.length&&(console.log("all media ready"),clearInterval(this._checkAllMediaReadyInterval),this.fire(AVComponent.Events.MEDIA_READY),this.resize())},AVComponent.prototype._checkAllWaveformsReady=function(){console.log("loading waveforms"),this._readyWaveforms===this._getCanvasInstancesWithWaveforms().length&&(console.log("waveforms ready"),clearInterval(this._checkAllWaveformsReadyInterval),this.fire(AVComponent.Events.WAVEFORMS_READY),this.resize())},AVComponent.prototype._getCanvasInstancesWithWaveforms=function(){return this.canvasInstances.filter(function(c){return c.waveforms.length>0})},AVComponent.prototype._getCanvases=function(){return this._data.helper?this._data.helper.getCanvases():[]},AVComponent.prototype._initCanvas=function(canvas){var _this=this,canvasInstance=new IIIFComponents.CanvasInstance({target:document.createElement("div"),data:Object.assign({},{canvas:canvas},this._data)});canvasInstance.logMessage=this._logMessage.bind(this),this._$element.append(canvasInstance.$playerElement),canvasInstance.init(),this.canvasInstances.push(canvasInstance),canvasInstance.on(AVComponent.Events.MEDIA_READY,function(){_this._readyMedia++},!1),canvasInstance.on(AVComponent.Events.WAVEFORM_READY,function(){_this._readyWaveforms++},!1),canvasInstance.on(IIIFComponents.AVComponentCanvasInstance.Events.PREVIOUS_RANGE,function(){_this._prevRange()},!1),canvasInstance.on(IIIFComponents.AVComponentCanvasInstance.Events.NEXT_RANGE,function(){_this._nextRange()},!1),canvasInstance.on(AVComponent.Events.RANGE_CHANGED,function(rangeId){_this.fire(AVComponent.Events.RANGE_CHANGED,rangeId)},!1),canvasInstance.on(IIIFComponents.AVVolumeControl.Events.VOLUME_CHANGED,function(volume){_this._setCanvasInstanceVolumes(volume),_this.fire(IIIFComponents.AVVolumeControl.Events.VOLUME_CHANGED,volume)},!1)},AVComponent.prototype._prevRange=function(){if(this._data&&this._data.helper){var prevRange=this._data.helper.getPreviousRange();prevRange?this.playRange(prevRange.id):this._rewind()}},AVComponent.prototype._nextRange=function(){if(this._data&&this._data.helper){var nextRange=this._data.helper.getNextRange();nextRange&&this.playRange(nextRange.id)}},AVComponent.prototype._setCanvasInstanceVolumes=function(volume){this.canvasInstances.forEach(function(canvasInstance){canvasInstance.set({volume:volume})})},AVComponent.prototype._getCanvasInstanceById=function(canvasId){if(canvasId=canvasId.includes("://")?Manifesto.Utils.normaliseUrl(canvasId):canvasId,this._data.virtualCanvasEnabled)for(var i=0;i<this.canvasInstances.length;i++){var canvasInstance=this.canvasInstances[i];if(canvasInstance.isVirtual()&&canvasInstance.getCanvasId()===canvasId||canvasInstance.includesVirtualSubCanvas(canvasId))return canvasInstance}else for(var i=0;i<this.canvasInstances.length;i++){var canvasInstance=this.canvasInstances[i],id=canvasInstance.getCanvasId();if(id){var canvasInstanceId=Manifesto.Utils.normaliseUrl(id);if(canvasInstanceId===canvasId)return canvasInstance}}},AVComponent.prototype._getCurrentCanvas=function(){if(this._data.canvasId)return this._getCanvasInstanceById(this._data.canvasId)},AVComponent.prototype._rewind=function(){if(!this._data.limitToRange){var canvasInstance=this._getCurrentCanvas();canvasInstance&&canvasInstance.set({range:void 0})}},AVComponent.prototype.play=function(){var currentCanvas=this._getCurrentCanvas();currentCanvas&&currentCanvas.play()},AVComponent.prototype.pause=function(){var currentCanvas=this._getCurrentCanvas();currentCanvas&&currentCanvas.pause()},AVComponent.prototype.playRange=function(rangeId){if(this._data.helper){var range=this._data.helper.getRangeById(rangeId);range&&this.set({range:jQuery.extend(!0,{},range)})}},AVComponent.prototype.showCanvas=function(canvasId){var currentCanvas=this._getCurrentCanvas();currentCanvas&&currentCanvas.getCanvasId()===canvasId&&!currentCanvas.isVisible()?currentCanvas.set({visible:!0}):this.set({canvasId:canvasId})},AVComponent.prototype._logMessage=function(message){this.fire(AVComponent.Events.LOG,message)},AVComponent.prototype._getPosterImageCss=function(expanded){var currentCanvas=this._getCurrentCanvas();if(currentCanvas){var $options=currentCanvas.$playerElement.find(".options-container"),containerWidth=currentCanvas.$playerElement.parent().width(),containerHeight=currentCanvas.$playerElement.parent().height()-$options.height();if(expanded)return{top:0,left:0,width:containerWidth,height:containerHeight};var ratio=void 0,width=void 0,height=void 0;return this._posterCanvasWidth>this._posterCanvasHeight?(ratio=this._posterCanvasHeight/this._posterCanvasWidth,width=containerWidth*this._data.posterImageRatio,height=width*ratio):(ratio=this._posterCanvasWidth/this._posterCanvasHeight,height=containerHeight*this._data.posterImageRatio,width=height*ratio),{top:0,left:containerWidth-width,width:width,height:height}}return null},AVComponent.prototype.resize=function(){this.canvasInstances.forEach(function(canvasInstance){canvasInstance.resize()});var currentCanvas=this._getCurrentCanvas();currentCanvas&&this._$posterImage&&this._$posterImage.is(":visible")&&(this._posterImageExpanded?this._$posterImage.css(this._getPosterImageCss(!0)):this._$posterImage.css(this._getPosterImageCss(!1)))},AVComponent}(_Components.BaseComponent);IIIFComponents.AVComponent=AVComponent}(IIIFComponents||(IIIFComponents={})),function(IIIFComponents){var AVComponent;!function(AVComponent){var Events=function(){function Events(){}return Events.MEDIA_READY="mediaready",Events.LOG="log",Events.RANGE_CHANGED="rangechanged",Events.WAVEFORM_READY="waveformready",Events.WAVEFORMS_READY="waveformsready",Events}();AVComponent.Events=Events}(AVComponent=IIIFComponents.AVComponent||(IIIFComponents.AVComponent={}))}(IIIFComponents||(IIIFComponents={})),function(g){g.IIIFComponents?g.IIIFComponents.AVComponent=IIIFComponents.AVComponent:g.IIIFComponents=IIIFComponents}(global);var IIIFComponents,__extends=this&&this.__extends||function(){var extendStatics=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(d,b){d.__proto__=b}||function(d,b){for(var p in b)b.hasOwnProperty(p)&&(d[p]=b[p])};return function(d,b){function __(){this.constructor=d}extendStatics(d,b),d.prototype=null===b?Object.create(b):(__.prototype=b.prototype,new __)}}();!function(IIIFComponents){var AVVolumeControl=function(_super){function AVVolumeControl(options){var _this=_super.call(this,options)||this;return _this._lastVolume=1,_this._data={volume:1},_this._init(),_this._resize(),_this}return __extends(AVVolumeControl,_super),AVVolumeControl.prototype._init=function(){var _this=this,success=_super.prototype._init.call(this);success||console.error("Component failed to initialise"),this._$volumeMute=$('\n                                <button class="btn volume-mute" title="'+this.options.data.content.mute+'">\n                                    <i class="av-icon av-icon-mute on" aria-hidden="true"></i>'+this.options.data.content.mute+"\n                                </button>"),this._$volumeSlider=$('<div class="volume-slider"></div>'),this._$element.append(this._$volumeMute,this._$volumeSlider);var that=this;return this._$volumeMute.on("touchstart click",function(e){e.preventDefault(),0!==_this._data.volume?(_this._lastVolume=_this._data.volume,_this._data.volume=0):_this._data.volume=_this._lastVolume,_this.fire(AVVolumeControl.Events.VOLUME_CHANGED,_this._data.volume)}),this._$volumeSlider.slider({value:that._data.volume,step:.1,orientation:"horizontal",range:"min",min:0,max:1,animate:!1,create:function(evt,ui){},slide:function(evt,ui){that._data.volume=ui.value,0===that._data.volume&&(that._lastVolume=0),that.fire(AVVolumeControl.Events.VOLUME_CHANGED,that._data.volume)},stop:function(evt,ui){}}),success},AVVolumeControl.prototype.set=function(data){this._data=Object.assign(this._data,data),this._render()},AVVolumeControl.prototype._render=function(){if(void 0!==this._data.volume)if(this._$volumeSlider.slider({value:this._data.volume}),0===this._data.volume){var label=this.options.data.content.unmute;this._$volumeMute.prop("title",label),this._$volumeMute.find("i").switchClass("on","off")}else{var label=this.options.data.content.mute;this._$volumeMute.prop("title",label),this._$volumeMute.find("i").switchClass("off","on")}},AVVolumeControl.prototype._resize=function(){},AVVolumeControl}(_Components.BaseComponent);IIIFComponents.AVVolumeControl=AVVolumeControl}(IIIFComponents||(IIIFComponents={})),function(IIIFComponents){var AVVolumeControl;!function(AVVolumeControl){var Events=function(){function Events(){}return Events.VOLUME_CHANGED="volumechanged",Events}();AVVolumeControl.Events=Events}(AVVolumeControl=IIIFComponents.AVVolumeControl||(IIIFComponents.AVVolumeControl={}))}(IIIFComponents||(IIIFComponents={}));var IIIFComponents,__extends=this&&this.__extends||function(){var extendStatics=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(d,b){d.__proto__=b}||function(d,b){for(var p in b)b.hasOwnProperty(p)&&(d[p]=b[p])};return function(d,b){function __(){this.constructor=d}extendStatics(d,b),d.prototype=null===b?Object.create(b):(__.prototype=b.prototype,new __)}}();!function(IIIFComponents){var CanvasInstance=function(_super){function CanvasInstance(options){var _this=_super.call(this,options)||this;return _this._canvasClockFrequency=25,_this._canvasClockStartDate=0,_this._canvasClockTime=0,_this._canvasHeight=0,_this._canvasWidth=0,_this._data=_this.data(),_this._highPriorityFrequency=25,_this._isPlaying=!1,_this._isStalled=!1,_this._lowPriorityFrequency=250,_this._mediaSyncMarginSecs=1,_this._rangeSpanPadding=.25,_this._readyMediaCount=0,_this._stallRequestedBy=[],_this._wasPlaying=!1,_this.ranges=[],_this.waveforms=[],_this._scaleY=function(amplitude,height){var range=256;return Math.max(_this._data.waveformBarWidth,amplitude*height/range)},_this._data=_this.options.data,_this.$playerElement=$('<div class="player"></div>'),_this}return __extends(CanvasInstance,_super),CanvasInstance.prototype.init=function(){var _this=this;if(!this._data||!this._data.content||!this._data.canvas)return void console.warn("unable to initialise, missing canvas or content");this._$hoverPreviewTemplate=$('<div class="hover-preview"><div class="label"></div><div class="pointer"><span class="arrow"></span></div></div>'),this._$canvasContainer=$('<div class="canvas-container"></div>'),this._$optionsContainer=$('<div class="options-container"></div>'),this._$rangeTimelineContainer=$('<div class="range-timeline-container"></div>'),this._$canvasTimelineContainer=$('<div class="canvas-timeline-container"></div>'),this._$canvasHoverPreview=this._$hoverPreviewTemplate.clone(),this._$canvasHoverHighlight=$('<div class="hover-highlight"></div>'),this._$rangeHoverPreview=this._$hoverPreviewTemplate.clone(),this._$rangeHoverHighlight=$('<div class="hover-highlight"></div>'),this._$durationHighlight=$('<div class="duration-highlight"></div>'),this._$timelineItemContainer=$('<div class="timeline-item-container"></div>'),this._$controlsContainer=$('<div class="controls-container"></div>'),this._$prevButton=$('\n                                <button class="btn" title="'+this._data.content.previous+'">\n                                    <i class="av-icon av-icon-previous" aria-hidden="true"></i>'+this._data.content.previous+"\n                                </button>"),this._$playButton=$('\n                                <button class="btn" title="'+this._data.content.play+'">\n                                    <i class="av-icon av-icon-play play" aria-hidden="true"></i>'+this._data.content.play+"\n                                </button>"),this._$nextButton=$('\n                                <button class="btn" title="'+this._data.content.next+'">\n                                    <i class="av-icon av-icon-next" aria-hidden="true"></i>'+this._data.content.next+"\n                                </button>"),this._$timeDisplay=$('<div class="time-display"><span class="canvas-time"></span> / <span class="canvas-duration"></span></div>'),this._$canvasTime=this._$timeDisplay.find(".canvas-time"),this._$canvasDuration=this._$timeDisplay.find(".canvas-duration"),this.isVirtual()&&this.$playerElement.addClass("virtual");var $volume=$('<div class="volume"></div>');if(this._volume=new IIIFComponents.AVVolumeControl({target:$volume[0],data:Object.assign({},this._data)}),this._volume.on(IIIFComponents.AVVolumeControl.Events.VOLUME_CHANGED,function(value){_this.fire(IIIFComponents.AVVolumeControl.Events.VOLUME_CHANGED,value)},!1),this._$controlsContainer.append(this._$prevButton,this._$playButton,this._$nextButton,this._$timeDisplay,$volume),this._$canvasTimelineContainer.append(this._$canvasHoverPreview,this._$canvasHoverHighlight,this._$durationHighlight),this._$rangeTimelineContainer.append(this._$rangeHoverPreview,this._$rangeHoverHighlight),this._$optionsContainer.append(this._$canvasTimelineContainer,this._$rangeTimelineContainer,this._$timelineItemContainer,this._$controlsContainer),this.$playerElement.append(this._$canvasContainer,this._$optionsContainer),this._$canvasHoverPreview.hide(),this._$rangeHoverPreview.hide(),this._data&&this._data.helper&&this._data.canvas){var ranges_1=[];this.isVirtual()?this._data.canvas.canvases.forEach(function(canvas){if(_this._data&&_this._data.helper){var r=_this._data.helper.getCanvasRanges(canvas),clonedRanges_1=[];r.forEach(function(range){var clonedRange=jQuery.extend(!0,{},range);if(clonedRanges_1.push(clonedRange),clonedRange.canvases&&clonedRange.canvases.length)for(var i=0;i<clonedRange.canvases.length;i++)clonedRange.canvases[i]=IIIFComponents.AVComponentUtils.Utils.retargetTemporalComponent(_this._data.canvas.canvases,clonedRange.__jsonld.items[i].id)}),ranges_1.push.apply(ranges_1,clonedRanges_1)}}):ranges_1=ranges_1.concat(this._data.helper.getCanvasRanges(this._data.canvas)),ranges_1.forEach(function(range){_this.ranges.push(range)})}var canvasWidth=this._data.canvas.getWidth(),canvasHeight=this._data.canvas.getHeight();canvasWidth?this._canvasWidth=canvasWidth:this._canvasWidth=this.$playerElement.parent().width(),canvasHeight?this._canvasHeight=canvasHeight:this._canvasHeight=this._canvasWidth*this._data.defaultAspectRatio;var that=this,prevClicks=0,prevTimeout=0;this._$prevButton.on("touchstart click",function(e){e.preventDefault(),prevClicks++,1===prevClicks?(_this._previous(!1),prevTimeout=setTimeout(function(){prevClicks=0,prevTimeout=0},_this._data.doubleClickMS)):(_this._previous(!0),clearTimeout(prevTimeout),prevClicks=0,prevTimeout=0)}),this._$playButton.on("touchstart click",function(e){e.preventDefault(),_this._isPlaying?_this.pause():_this.play()}),this._$nextButton.on("touchstart click",function(e){e.preventDefault(),_this._next()}),this._$canvasTimelineContainer.slider({value:0,step:.01,orientation:"horizontal",range:"min",max:that._getDuration(),animate:!1,create:function(evt,ui){},slide:function(evt,ui){that._setCurrentTime(ui.value)},stop:function(evt,ui){}}),this._$canvasTimelineContainer.mouseout(function(){that._$canvasHoverHighlight.width(0),that._$canvasHoverPreview.hide()}),this._$rangeTimelineContainer.mouseout(function(){that._$rangeHoverHighlight.width(0),that._$rangeHoverPreview.hide()}),this._$canvasTimelineContainer.on("mousemove",function(e){_this._updateHoverPreview(e,_this._$canvasTimelineContainer,_this._getDuration())}),this._$rangeTimelineContainer.on("mousemove",function(e){if(_this._data.range){var duration=_this._data.range.getDuration();_this._updateHoverPreview(e,_this._$rangeTimelineContainer,duration?duration.getLength():0)}}),this._contentAnnotations=[];var items=this._data.canvas.getContent();this._$timelineItemContainer.hide();for(var i=0;i<items.length;i++){var item=items[i],mediaSource=void 0,bodies=item.getBody();if(!bodies.length)return void console.warn("item has no body");var body=this._getBody(bodies);if(body){var type=body.getType(),format=body.getFormat();type&&"textualbody"===type.toString()||(mediaSource=body.id.split("#")[0]);var target=item.getTarget();if(!target)return void console.warn("item has no target");var xywh=IIIFComponents.AVComponentUtils.Utils.getSpatialComponent(target),t=Manifesto.Utils.getTemporalComponent(target);xywh||(xywh=[0,0,this._canvasWidth,this._canvasHeight]),t||(t=[0,this._getDuration()]);var positionLeft=parseInt(String(xywh[0])),positionTop=parseInt(String(xywh[1])),mediaWidth=parseInt(String(xywh[2])),mediaHeight=parseInt(String(xywh[3])),startTime=parseInt(String(t[0])),endTime=parseInt(String(t[1])),percentageTop=this._convertToPercentage(positionTop,this._canvasHeight),percentageLeft=this._convertToPercentage(positionLeft,this._canvasWidth),percentageWidth=this._convertToPercentage(mediaWidth,this._canvasWidth),percentageHeight=this._convertToPercentage(mediaHeight,this._canvasHeight),temporalOffsets=/t=([^&]+)/g.exec(body.id),ot=void 0;ot=temporalOffsets&&temporalOffsets[1]?temporalOffsets[1].split(","):[null,null];var offsetStart=ot[0]?parseInt(ot[0]):ot[0],offsetEnd=ot[1]?parseInt(ot[1]):ot[1],itemData={active:!1,end:endTime,endOffset:offsetEnd,format:format,height:percentageHeight,left:percentageLeft,source:mediaSource,start:startTime,startOffset:offsetStart,top:percentageTop,type:type,width:percentageWidth};this._renderMediaElement(itemData);var seeAlso=item.getProperty("seeAlso");if(seeAlso&&seeAlso.length){var dat=seeAlso[0].id;this.waveforms.push(dat)}}else console.warn("unable to find suitable format for",item.id)}this._renderWaveform()},CanvasInstance.prototype._getBody=function(bodies){for(var i=0;i<bodies.length;i++){var body=bodies[i],format=body.getFormat();if(format&&IIIFComponents.AVComponentUtils.Utils.isHLSFormat(format)&&IIIFComponents.AVComponentUtils.Utils.canPlayHls())return body}for(var i=0;i<bodies.length;i++){var body=bodies[i],format=body.getFormat();if(format&&IIIFComponents.AVComponentUtils.Utils.isMpegDashFormat(format)&&!IIIFComponents.AVComponentUtils.Utils.isSafari())return body}for(var i=0;i<bodies.length;i++){var body=bodies[i],format=body.getFormat();if(format&&!IIIFComponents.AVComponentUtils.Utils.isHLSFormat(format)&&!IIIFComponents.AVComponentUtils.Utils.isMpegDashFormat(format))return body}return null},CanvasInstance.prototype._getDuration=function(){return this._data&&this._data.canvas?this._data.canvas.getDuration():0},CanvasInstance.prototype.data=function(){return{waveformColor:"#fff",waveformBarSpacing:4,waveformBarWidth:2,volume:1}},CanvasInstance.prototype.isVirtual=function(){return this._data.canvas instanceof IIIFComponents.AVComponentObjects.VirtualCanvas},CanvasInstance.prototype.isVisible=function(){return!!this._data.visible},CanvasInstance.prototype.includesVirtualSubCanvas=function(canvasId){if(this.isVirtual()&&this._data.canvas&&this._data.canvas.canvases)for(var i=0;i<this._data.canvas.canvases.length;i++){var canvas=this._data.canvas.canvases[i];if(Manifesto.Utils.normaliseUrl(canvas.id)===canvasId)return!0}return!1},CanvasInstance.prototype.set=function(data){var _this=this,oldData=Object.assign({},this._data);this._data=Object.assign(this._data,data);var diff=IIIFComponents.AVComponentUtils.Utils.diff(oldData,this._data);if(diff.includes("visible")&&this._data.canvas&&(this._data.visible?(this._rewind(),this.$playerElement.show()):(this.$playerElement.hide(),this.pause()),this.resize()),diff.includes("range")&&this._data.helper)if(this._data.range){var duration=this._data.range.getDuration();duration&&(this._data.range.autoChanged||this._setCurrentTime(duration.start),this._data.autoPlay&&this.play(),this.fire(IIIFComponents.AVComponent.Events.RANGE_CHANGED,this._data.range.id))}else this.fire(IIIFComponents.AVComponent.Events.RANGE_CHANGED,null);diff.includes("volume")?this._contentAnnotations.forEach(function($mediaElement){$($mediaElement.element).prop("volume",_this._data.volume),_this._volume.set({volume:_this._data.volume})}):this._render(),diff.includes("limitToRange")&&this._render()},CanvasInstance.prototype._hasRangeChanged=function(){var range=this._getRangeForCurrentTime();range&&!this._data.limitToRange&&(!this._data.range||this._data.range&&range.id!==this._data.range.id)&&this.set({range:jQuery.extend(!0,{autoChanged:!0},range)})},CanvasInstance.prototype._getRangeForCurrentTime=function(parentRange){var ranges;ranges=parentRange?parentRange.getRanges():this.ranges;for(var i=0;i<ranges.length;i++){var range=ranges[i];if(this._rangeSpansCurrentTime(range)){if(this._rangeNavigable(range))return range;for(var childRanges=range.getRanges(),i_1=0;i_1<childRanges.length;i_1++){var childRange=childRanges[i_1];if(this._rangeSpansCurrentTime(childRange))return this._getRangeForCurrentTime(childRange)}return range.parentRange}}},CanvasInstance.prototype._rangeSpansCurrentTime=function(range){return!!range.spansTime(Math.ceil(this._canvasClockTime)+this._rangeSpanPadding)},CanvasInstance.prototype._rangeNavigable=function(range){var behavior=range.getBehavior();return!behavior||behavior.toString()!==manifesto.Behavior.nonav().toString()},CanvasInstance.prototype._render=function(){if(this._data.range){var duration=this._data.range.getDuration();if(duration){var totalLength=this._getDuration(),timelineLength=this._$canvasTimelineContainer.width(),ratio=timelineLength/totalLength,start=duration.start*ratio,end=duration.end*ratio;(end>totalLength||end<start)&&(end=totalLength);var width=end-start;this.isVirtual()?(this._$durationHighlight.show(),this._$durationHighlight.css({left:start,width:width})):this._$durationHighlight.hide();var that_1=this;this._$rangeTimelineContainer.slider("destroy"),this._$rangeTimelineContainer.slider({value:duration.start,step:.01,orientation:"horizontal",range:"min",min:duration.start,max:duration.end,animate:!1,create:function(evt,ui){},slide:function(evt,ui){that_1._setCurrentTime(ui.value)},stop:function(evt,ui){}})}}else this._$durationHighlight.hide();this._data.limitToRange&&this._data.range?(this._$canvasTimelineContainer.hide(),this._$rangeTimelineContainer.show()):(this._$canvasTimelineContainer.show(),this._$rangeTimelineContainer.hide()),this._updateCurrentTimeDisplay(),this._updateDurationDisplay(),this._drawWaveform()},CanvasInstance.prototype.getCanvasId=function(){if(this._data&&this._data.canvas)return this._data.canvas.id},CanvasInstance.prototype._updateHoverPreview=function(e,$container,duration){var offset=$container.offset(),x=e.pageX-offset.left,$hoverArrow=$container.find(".arrow"),$hoverHighlight=$container.find(".hover-highlight"),$hoverPreview=$container.find(".hover-preview");$hoverHighlight.width(x);var fullWidth=$container.width(),ratio=x/fullWidth,seconds=Math.min(duration*ratio);$hoverPreview.find(".label").text(IIIFComponents.AVComponentUtils.Utils.formatTime(seconds));var hoverPreviewWidth=$hoverPreview.outerWidth(),hoverPreviewHeight=$hoverPreview.outerHeight(),left=x-.5*hoverPreviewWidth,arrowLeft=.5*hoverPreviewWidth-6;left<0&&(left=0,arrowLeft=x-6),left+hoverPreviewWidth>fullWidth&&(left=fullWidth-hoverPreviewWidth,arrowLeft=hoverPreviewWidth-(fullWidth-x)-6),$hoverPreview.css({left:left,top:hoverPreviewHeight*-1+"px"}).show(),$hoverArrow.css({left:arrowLeft})},CanvasInstance.prototype._previous=function(isDouble){this._data.limitToRange?isDouble?this._isNavigationConstrainedToRange()?this._rewind():this.fire(IIIFComponents.AVComponentCanvasInstance.Events.PREVIOUS_RANGE):this._rewind():this._data.range?isDouble?(this.set({range:void 0}),this._rewind()):this.fire(IIIFComponents.AVComponentCanvasInstance.Events.PREVIOUS_RANGE):this._rewind()},CanvasInstance.prototype._next=function(){this._data.limitToRange&&this._isNavigationConstrainedToRange()?this._fastforward():this.fire(IIIFComponents.AVComponentCanvasInstance.Events.NEXT_RANGE)},CanvasInstance.prototype.destroy=function(){window.clearInterval(this._highPriorityInterval),window.clearInterval(this._lowPriorityInterval),window.clearInterval(this._canvasClockInterval)},CanvasInstance.prototype._convertToPercentage=function(pixelValue,maxValue){var percentage=pixelValue/maxValue*100;return percentage},CanvasInstance.prototype._renderMediaElement=function(data){var $mediaElement,_this=this,type=data.type.toString().toLowerCase();switch(type){case"image":$mediaElement=$('<img class="anno" src="'+data.source+'" />');break;case"video":$mediaElement=$('<video class="anno" />');break;case"audio":$mediaElement=$('<audio class="anno" />');break;case"textualbody":$mediaElement=$('<div class="anno">'+data.source+"</div>");break;default:return}var media=$mediaElement[0];if(data.format&&"application/dash+xml"===data.format.toString()){$mediaElement.attr("data-dashjs-player","");var player=dashjs.MediaPlayer().create();player.initialize(media,data.source);
-}else if(data.format&&"application/vnd.apple.mpegurl"===data.format.toString())if(Hls.isSupported()){var hls=new Hls;hls.loadSource(data.source),hls.attachMedia(media)}else media.canPlayType("application/vnd.apple.mpegurl")&&(media.src=data.source);else $mediaElement.attr("src",data.source);if($mediaElement.css({top:data.top+"%",left:data.left+"%",width:data.width+"%",height:data.height+"%"}).hide(),data.element=$mediaElement,"video"===type||"audio"===type){data.timeout=null;var that_2=this;data.checkForStall=function(){var self=this;this.active?(that_2._checkMediaSynchronization(),this.element.get(0).readyState>0&&!this.outOfSync?that_2._playbackStalled(!1,self):(that_2._playbackStalled(!0,self),this.timeout&&window.clearTimeout(this.timeout),this.timeout=window.setTimeout(function(){self.checkForStall()},1e3))):that_2._playbackStalled(!1,self)}}this._contentAnnotations.push(data),this.$playerElement&&this._$canvasContainer.append($mediaElement),"video"!==type&&"audio"!==type||($mediaElement.on("loadstart",function(){}),$mediaElement.on("waiting",function(){}),$mediaElement.on("seeking",function(){}),$mediaElement.on("loadedmetadata",function(){_this._readyMediaCount++,_this._readyMediaCount===_this._contentAnnotations.length&&(_this._setCurrentTime(0),_this._data.autoPlay&&_this.play(),_this._updateDurationDisplay(),_this.fire(IIIFComponents.AVComponent.Events.MEDIA_READY))}),$mediaElement.attr("preload","auto"),$mediaElement.get(0).load()),this._renderSyncIndicator(data)},CanvasInstance.prototype._getWaveformData=function(url){return new Promise(function(resolve,reject){$.ajax({url:url,type:"GET",dataType:"binary",responseType:"arraybuffer",processData:!1}).done(function(data){resolve(WaveformData.create(data))}).fail(function(err){reject(new Error("Network Error"))})})},CanvasInstance.prototype._renderWaveform=function(){var _this=this;if(this.waveforms.length){var promises=this.waveforms.map(function(url){return _this._getWaveformData(url)});Promise.all(promises).then(function(waveforms){_this._waveformCanvas=document.createElement("canvas"),_this._waveformCanvas.classList.add("waveform"),_this._$canvasContainer.append(_this._waveformCanvas),_this._waveformCtx=_this._waveformCanvas.getContext("2d"),_this._waveformCtx&&(_this._waveformCtx.fillStyle=_this._data.waveformColor,_this._compositeWaveform=new IIIFComponents.AVComponentObjects.CompositeWaveform(waveforms),_this.fire(IIIFComponents.AVComponent.Events.WAVEFORM_READY))})}},CanvasInstance.prototype._drawWaveform=function(){if(this._waveformCtx){var duration,start=0,end=this._compositeWaveform.duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration&&(start=duration.start,end=duration.end);var startpx=start*this._compositeWaveform.pixelsPerSecond,endpx=end*this._compositeWaveform.pixelsPerSecond,canvasWidth=this._waveformCtx.canvas.width,canvasHeight=this._waveformCtx.canvas.height,barSpacing=this._data.waveformBarSpacing,barWidth=this._data.waveformBarWidth,increment=Math.floor((endpx-startpx)/canvasWidth*barSpacing),sampleSpacing=canvasWidth/barSpacing;this._waveformCtx.clearRect(0,0,canvasWidth,canvasHeight),this._waveformCtx.fillStyle=this._data.waveformColor;for(var x=startpx;x<endpx;x+=increment){var maxMin=this._getWaveformMaxAndMin(this._compositeWaveform,x,sampleSpacing),height=this._scaleY(maxMin.max-maxMin.min,canvasHeight),ypos=(canvasHeight-height)/2,xpos=canvasWidth*IIIFComponents.AVComponentUtils.Utils.normalise(x,startpx,endpx);this._waveformCtx.fillRect(xpos,ypos,barWidth,height)}}},CanvasInstance.prototype._getWaveformMaxAndMin=function(waveform,index,sampleSpacing){for(var max=-127,min=128,x=index;x<index+sampleSpacing;x++)waveform.max(x)>max&&(max=waveform.max(x)),waveform.min(x)<min&&(min=waveform.min(x));return{max:max,min:min}},CanvasInstance.prototype._updateCurrentTimeDisplay=function(){var duration;if(this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration){var rangeClockTime=this._canvasClockTime-duration.start;this._$canvasTime.text(IIIFComponents.AVComponentUtils.Utils.formatTime(rangeClockTime))}else this._$canvasTime.text(IIIFComponents.AVComponentUtils.Utils.formatTime(this._canvasClockTime))},CanvasInstance.prototype._updateDurationDisplay=function(){var duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration?this._$canvasDuration.text(IIIFComponents.AVComponentUtils.Utils.formatTime(duration.getLength())):this._$canvasDuration.text(IIIFComponents.AVComponentUtils.Utils.formatTime(this._getDuration()))},CanvasInstance.prototype._renderSyncIndicator=function(mediaElementData){var leftPercent=this._convertToPercentage(mediaElementData.start,this._getDuration()),widthPercent=this._convertToPercentage(mediaElementData.end-mediaElementData.start,this._getDuration()),$timelineItem=$('<div class="timeline-item" title="'+mediaElementData.source+'" data-start="'+mediaElementData.start+'" data-end="'+mediaElementData.end+'"></div>');$timelineItem.css({left:leftPercent+"%",width:widthPercent+"%"});var $lineWrapper=$('<div class="line-wrapper"></div>');$timelineItem.appendTo($lineWrapper),mediaElementData.timelineElement=$timelineItem,this.$playerElement&&this._$timelineItemContainer.append($lineWrapper)},CanvasInstance.prototype._setCurrentTime=function(seconds){this._canvasClockTime=seconds,this._canvasClockStartDate=Date.now()-1e3*this._canvasClockTime,this.logMessage("SET CURRENT TIME to: "+this._canvasClockTime+" seconds."),this._canvasClockUpdater(),this._highPriorityUpdater(),this._lowPriorityUpdater(),this._synchronizeMedia()},CanvasInstance.prototype._rewind=function(withoutUpdate){this.pause();var duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration?this._canvasClockTime=duration.start:this._canvasClockTime=0,this._data.limitToRange||this._data&&this._data.helper&&this.set({range:void 0})},CanvasInstance.prototype._fastforward=function(){var duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration?this._canvasClockTime=duration.end:this._canvasClockTime=this._getDuration(),this.pause()},CanvasInstance.prototype.play=function(withoutUpdate){var _this=this;if(!this._isPlaying){var duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration&&this._canvasClockTime>=duration.end&&(this._canvasClockTime=duration.start),this._canvasClockTime===this._getDuration()&&(this._canvasClockTime=0),this._canvasClockStartDate=Date.now()-1e3*this._canvasClockTime,this._highPriorityInterval=window.setInterval(function(){_this._highPriorityUpdater()},this._highPriorityFrequency),this._lowPriorityInterval=window.setInterval(function(){_this._lowPriorityUpdater()},this._lowPriorityFrequency),this._canvasClockInterval=window.setInterval(function(){_this._canvasClockUpdater()},this._canvasClockFrequency),this._isPlaying=!0,withoutUpdate||this._synchronizeMedia();var label=this._data&&this._data.content?this._data.content.pause:"";this._$playButton.prop("title",label),this._$playButton.find("i").switchClass("play","pause"),this.fire(IIIFComponents.AVComponentCanvasInstance.Events.PLAYCANVAS),this.logMessage("PLAY canvas")}},CanvasInstance.prototype.pause=function(withoutUpdate){window.clearInterval(this._highPriorityInterval),window.clearInterval(this._lowPriorityInterval),window.clearInterval(this._canvasClockInterval),this._isPlaying=!1,withoutUpdate||(this._highPriorityUpdater(),this._lowPriorityUpdater(),this._synchronizeMedia());var label=this._data&&this._data.content?this._data.content.play:"";this._$playButton.prop("title",label),this._$playButton.find("i").switchClass("pause","play"),this.fire(IIIFComponents.AVComponentCanvasInstance.Events.PAUSECANVAS),this.logMessage("PAUSE canvas")},CanvasInstance.prototype._isNavigationConstrainedToRange=function(){return this._data.constrainNavigationToRange},CanvasInstance.prototype._canvasClockUpdater=function(){this._canvasClockTime=(Date.now()-this._canvasClockStartDate)/1e3;var duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration&&this._canvasClockTime>=duration.end&&this.pause(),this._canvasClockTime>=this._getDuration()&&(this._canvasClockTime=this._getDuration(),this.pause())},CanvasInstance.prototype._highPriorityUpdater=function(){this._$rangeTimelineContainer.slider({value:this._canvasClockTime}),this._$canvasTimelineContainer.slider({value:this._canvasClockTime}),this._updateCurrentTimeDisplay(),this._updateDurationDisplay()},CanvasInstance.prototype._lowPriorityUpdater=function(){this._updateMediaActiveStates(),this._isPlaying&&this._data.autoSelectRange&&this.isVirtual()&&this._hasRangeChanged()},CanvasInstance.prototype._updateMediaActiveStates=function(){for(var contentAnnotation,i=0;i<this._contentAnnotations.length;i++){contentAnnotation=this._contentAnnotations[i];var type=contentAnnotation.type.toString().toLowerCase();contentAnnotation.start<=this._canvasClockTime&&contentAnnotation.end>=this._canvasClockTime?(this._checkMediaSynchronization(),contentAnnotation.active||(this._synchronizeMedia(),contentAnnotation.active=!0,contentAnnotation.element.show(),contentAnnotation.timelineElement.addClass("active")),"video"!==type&&"audio"!==type||contentAnnotation.element[0].currentTime>contentAnnotation.element[0].duration-contentAnnotation.endOffset&&this._pauseMedia(contentAnnotation.element[0])):contentAnnotation.active&&(contentAnnotation.active=!1,contentAnnotation.element.hide(),contentAnnotation.timelineElement.removeClass("active"),"video"!==type&&"audio"!==type||this._pauseMedia(contentAnnotation.element[0]))}},CanvasInstance.prototype._pauseMedia=function(media){media.pause()},CanvasInstance.prototype._setMediaCurrentTime=function(media,time){isNaN(media.duration)||(media.currentTime=time)},CanvasInstance.prototype._synchronizeMedia=function(){for(var contentAnnotation,i=0;i<this._contentAnnotations.length;i++){contentAnnotation=this._contentAnnotations[i];var type=contentAnnotation.type.toString().toLowerCase();if("video"===type||"audio"===type){if(this._setMediaCurrentTime(contentAnnotation.element[0],this._canvasClockTime-contentAnnotation.start+contentAnnotation.startOffset),contentAnnotation.start<=this._canvasClockTime&&contentAnnotation.end>=this._canvasClockTime)if(this._isPlaying){if(contentAnnotation.element[0].paused){var promise=contentAnnotation.element[0].play();promise&&promise["catch"](function(){})}}else this._pauseMedia(contentAnnotation.element[0]);else this._pauseMedia(contentAnnotation.element[0]);contentAnnotation.element[0].currentTime>contentAnnotation.element[0].duration-contentAnnotation.endOffset&&this._pauseMedia(contentAnnotation.element[0])}}this.logMessage("SYNC MEDIA at: "+this._canvasClockTime+" seconds.")},CanvasInstance.prototype._checkMediaSynchronization=function(){for(var contentAnnotation,i=0,l=this._contentAnnotations.length;i<l;i++){contentAnnotation=this._contentAnnotations[i];var type=contentAnnotation.type.toString().toLowerCase();if(("video"===type||"audio"===type)&&contentAnnotation.start<=this._canvasClockTime&&contentAnnotation.end>=this._canvasClockTime){var correctTime=this._canvasClockTime-contentAnnotation.start+contentAnnotation.startOffset,factualTime=contentAnnotation.element[0].currentTime;if(Math.abs(factualTime-correctTime)>this._mediaSyncMarginSecs){contentAnnotation.outOfSync=!0;var lag=Math.abs(factualTime-correctTime);this.logMessage("DETECTED synchronization lag: "+Math.abs(lag)),this._setMediaCurrentTime(contentAnnotation.element[0],correctTime)}else contentAnnotation.outOfSync=!1}}},CanvasInstance.prototype._playbackStalled=function(aBoolean,syncMediaRequestingStall){if(aBoolean)this._stallRequestedBy.indexOf(syncMediaRequestingStall)<0&&this._stallRequestedBy.push(syncMediaRequestingStall),this._isStalled||(this.$playerElement,this._wasPlaying=this._isPlaying,this.pause(!0),this._isStalled=aBoolean);else{var idx=this._stallRequestedBy.indexOf(syncMediaRequestingStall);idx>=0&&this._stallRequestedBy.splice(idx,1),0===this._stallRequestedBy.length&&(this._isStalled&&this._wasPlaying&&this.play(!0),this._isStalled=aBoolean)}},CanvasInstance.prototype.resize=function(){if(this.$playerElement){var containerWidth=this._$canvasContainer.width();if(containerWidth){this._$canvasTimelineContainer.width(containerWidth);var $options=this.$playerElement.find(".options-container");void 0!==this._data.halveAtWidth&&this.$playerElement.parent().width()<this._data.halveAtWidth?this._$canvasContainer.height(this.$playerElement.parent().height()/2):this._$canvasContainer.height(this.$playerElement.parent().height()-$options.height())}if(this._waveformCanvas){var canvasWidth=this._$canvasContainer.width(),canvasHeight=this._$canvasContainer.height();this._waveformCanvas.width=this._lastCanvasWidth=canvasWidth,this._waveformCanvas.height=this._lastCanvasHeight=canvasHeight}this._render()}},CanvasInstance}(_Components.BaseComponent);IIIFComponents.CanvasInstance=CanvasInstance}(IIIFComponents||(IIIFComponents={})),function(IIIFComponents){var AVComponentCanvasInstance;!function(AVComponentCanvasInstance){var Events=function(){function Events(){}return Events.NEXT_RANGE="nextrange",Events.PAUSECANVAS="pause",Events.PLAYCANVAS="play",Events.PREVIOUS_RANGE="previousrange",Events}();AVComponentCanvasInstance.Events=Events}(AVComponentCanvasInstance=IIIFComponents.AVComponentCanvasInstance||(IIIFComponents.AVComponentCanvasInstance={}))}(IIIFComponents||(IIIFComponents={}));var IIIFComponents;!function(IIIFComponents){var AVComponentObjects;!function(AVComponentObjects){var CompositeWaveform=function(){function CompositeWaveform(waveforms){var _this=this;this.length=0,this.duration=0,this.pixelsPerSecond=Number.MAX_VALUE,this.secondsPerPixel=Number.MAX_VALUE,this._waveforms=[],waveforms.forEach(function(waveform){_this._waveforms.push({start:_this.length,end:_this.length+waveform.adapter.length,waveform:waveform}),_this.length+=waveform.adapter.length,_this.duration+=waveform.duration,_this.pixelsPerSecond=Math.min(_this.pixelsPerSecond,waveform.pixels_per_second),_this.secondsPerPixel=Math.min(_this.secondsPerPixel,waveform.seconds_per_pixel)})}return CompositeWaveform.prototype.min=function(index){var waveform=this._find(index);return waveform?waveform.waveform.min_sample(index-waveform.start):0},CompositeWaveform.prototype.max=function(index){var waveform=this._find(index);return waveform?waveform.waveform.max_sample(index-waveform.start):0},CompositeWaveform.prototype._find=function(index){var waveforms=this._waveforms.filter(function(waveform){return index>=waveform.start&&index<waveform.end});return waveforms.length>0?waveforms[0]:null},CompositeWaveform}();AVComponentObjects.CompositeWaveform=CompositeWaveform}(AVComponentObjects=IIIFComponents.AVComponentObjects||(IIIFComponents.AVComponentObjects={}))}(IIIFComponents||(IIIFComponents={}));var IIIFComponents;!function(IIIFComponents){var AVComponentUtils;!function(AVComponentUtils){var Utils=function(){function Utils(){}return Utils._compare=function(a,b){var changed=[];return Object.keys(a).forEach(function(p){Object.is(b[p],a[p])||changed.push(p)}),changed},Utils.diff=function(a,b){return Array.from(new Set(Utils._compare(a,b).concat(Utils._compare(b,a))))},Utils.getSpatialComponent=function(target){var spatial=/xywh=([^&]+)/g.exec(target),xywh=null;return spatial&&spatial[1]&&(xywh=spatial[1].split(",")),xywh},Utils.getFirstTargetedCanvasId=function(range){var canvasId;if(range.canvases&&range.canvases.length)canvasId=range.canvases[0];else{var childRanges=range.getRanges();if(childRanges.length)return Utils.getFirstTargetedCanvasId(childRanges[0])}if(void 0!==canvasId)return Manifesto.Utils.normaliseUrl(canvasId)},Utils.getTimestamp=function(){return String((new Date).valueOf())},Utils.retargetTemporalComponent=function(canvases,target){var t=Manifesto.Utils.getTemporalComponent(target);if(t){for(var offset=0,targetWithoutTemporal=target.substr(0,target.indexOf("#")),i=0;i<canvases.length;i++){var canvas=canvases[i];if(canvas.id.includes(targetWithoutTemporal))break;var duration=canvas.getDuration();duration&&(offset+=duration)}return t[0]=Number(t[0])+offset,t[1]=Number(t[1])+offset,targetWithoutTemporal+"#t="+t[0]+","+t[1]}},Utils.formatTime=function(aNumber){var hours,minutes,seconds,hourValue;return seconds=Math.ceil(aNumber),hours=Math.floor(seconds/3600),hours=hours>=10?hours:"0"+hours,minutes=Math.floor(seconds%3600/60),minutes=minutes>=10?minutes:"0"+minutes,seconds=Math.floor(seconds%3600%60),seconds=seconds>=10?seconds:"0"+seconds,hourValue=hours>=1?hours+":":"",hourValue+minutes+":"+seconds},Utils.detectIE=function(){var ua=window.navigator.userAgent,msie=ua.indexOf("MSIE ");if(msie>0)return parseInt(ua.substring(msie+5,ua.indexOf(".",msie)),10);var trident=ua.indexOf("Trident/");if(trident>0){var rv=ua.indexOf("rv:");return parseInt(ua.substring(rv+3,ua.indexOf(".",rv)),10)}var edge=ua.indexOf("Edge/");return edge>0&&parseInt(ua.substring(edge+5,ua.indexOf(".",edge)),10)},Utils.isSafari=function(){var isSafari=/^((?!chrome|android).)*safari/i.test(navigator.userAgent);return console.log("isSafari",isSafari),isSafari},Utils.debounce=function(fn,debounceDuration){return debounceDuration=debounceDuration||100,function(){if(!fn.debouncing){var args=Array.prototype.slice.apply(arguments);fn.lastReturnVal=fn.apply(window,args),fn.debouncing=!0}return clearTimeout(fn.debounceTimeout),fn.debounceTimeout=setTimeout(function(){fn.debouncing=!1},debounceDuration),fn.lastReturnVal}},Utils.normalise=function(num,min,max){return(num-min)/(max-min)},Utils.isHLSFormat=function(format){return this.hlsMimeTypes.includes(format.toString())},Utils.isMpegDashFormat=function(format){return"application/dash+xml"===format.toString()},Utils.canPlayHls=function(){var doc="object"==typeof document&&document,videoelem=doc&&doc.createElement("video"),isvideosupport=Boolean(videoelem&&videoelem.canPlayType);return isvideosupport&&this.hlsMimeTypes.some(function(canItPlay){return/maybe|probably/i.test(videoelem.canPlayType(canItPlay))})},Utils.hlsMimeTypes=["application/vnd.apple.mpegurl","vnd.apple.mpegurl","audio/mpegurl","audio/x-mpegurl","application/x-mpegurl","video/x-mpegurl","video/mpegurl","application/mpegurl"],Utils}();AVComponentUtils.Utils=Utils}(AVComponentUtils=IIIFComponents.AVComponentUtils||(IIIFComponents.AVComponentUtils={}))}(IIIFComponents||(IIIFComponents={}));var IIIFComponents;!function(IIIFComponents){var AVComponentObjects;!function(AVComponentObjects){var VirtualCanvas=function(){function VirtualCanvas(){this.canvases=[],this.id=IIIFComponents.AVComponentUtils.Utils.getTimestamp()}return VirtualCanvas.prototype.addCanvas=function(canvas){this.canvases.push(jQuery.extend(!0,{},canvas))},VirtualCanvas.prototype.getContent=function(){var _this=this,annotations=[];return this.canvases.forEach(function(canvas){var items=canvas.getContent();items.forEach(function(item){var target=item.getTarget();if(target){var t=Manifesto.Utils.getTemporalComponent(target);t||(item.__jsonld.target+="#t=0,"+canvas.getDuration())}}),items.forEach(function(item){var target=item.getTarget();target&&(item.__jsonld.target=IIIFComponents.AVComponentUtils.Utils.retargetTemporalComponent(_this.canvases,target))}),annotations.push.apply(annotations,items)}),annotations},VirtualCanvas.prototype.getDuration=function(){var duration=0;return this.canvases.forEach(function(canvas){var d=canvas.getDuration();d&&(duration+=d)}),duration},VirtualCanvas.prototype.getWidth=function(){return this.canvases.length?this.canvases[0].getWidth():0},VirtualCanvas.prototype.getHeight=function(){return this.canvases.length?this.canvases[0].getHeight():0},VirtualCanvas}();AVComponentObjects.VirtualCanvas=VirtualCanvas}(AVComponentObjects=IIIFComponents.AVComponentObjects||(IIIFComponents.AVComponentObjects={}))}(IIIFComponents||(IIIFComponents={}));var IIIFComponents;!function(IIIFComponents){var AVComponentObjects;!function(AVComponentObjects){var Waveform=function(){function Waveform(){}return Waveform}();AVComponentObjects.Waveform=Waveform}(AVComponentObjects=IIIFComponents.AVComponentObjects||(IIIFComponents.AVComponentObjects={}))}(IIIFComponents||(IIIFComponents={}))}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{}]},{},[1])(1)});
\ No newline at end of file
+// iiif-av-component v0.0.77 https://github.com/iiif-commons/iiif-av-component#readme
+!function(f){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=f();else if("function"==typeof define&&define.amd)define([],f);else{var g;g="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:this,g.iiifAvComponent=f()}}(function(){return function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c="function"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error("Cannot find module '"+i+"'");throw a.code="MODULE_NOT_FOUND",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u="function"==typeof require&&require,i=0;i<t.length;i++)o(t[i]);return o}return r}()({1:[function(require,module,exports){(function(global){var IIIFComponents,__extends=this&&this.__extends||function(){var extendStatics=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(d,b){d.__proto__=b}||function(d,b){for(var p in b)b.hasOwnProperty(p)&&(d[p]=b[p])};return function(d,b){function __(){this.constructor=d}extendStatics(d,b),d.prototype=null===b?Object.create(b):(__.prototype=b.prototype,new __)}}();!function(IIIFComponents){var AVComponent=function(_super){function AVComponent(options){var _this=_super.call(this,options)||this;return _this._data=_this.data(),_this.canvasInstances=[],_this._readyMedia=0,_this._readyWaveforms=0,_this._posterCanvasWidth=0,_this._posterCanvasHeight=0,_this._posterImageExpanded=!1,_this._init(),_this._resize(),_this}return __extends(AVComponent,_super),AVComponent.prototype._init=function(){var success=_super.prototype._init.call(this);return success||console.error("Component failed to initialise"),success},AVComponent.prototype.data=function(){return{autoPlay:!1,constrainNavigationToRange:!1,defaultAspectRatio:.56,doubleClickMS:350,halveAtWidth:200,limitToRange:!1,posterImageRatio:.3,virtualCanvasEnabled:!0,content:{currentTime:"Current Time",collapse:"Collapse",duration:"Duration",expand:"Expand",mute:"Mute",next:"Next",pause:"Pause",play:"Play",previous:"Previous",unmute:"Unmute"}}},AVComponent.prototype.set=function(data){var _this=this,oldData=Object.assign({},this._data);this._data=Object.assign(this._data,data);var diff=IIIFComponents.AVComponentUtils.Utils.diff(oldData,this._data);if(diff.includes("helper")&&this._reset(),!this._data.helper)return void console.warn("must pass a helper object");if(diff.includes("limitToRange")&&this._data.canvasId&&this.canvasInstances.forEach(function(canvasInstance,index){canvasInstance.set({limitToRange:_this._data.limitToRange})}),diff.includes("constrainNavigationToRange")&&this._data.canvasId&&this.canvasInstances.forEach(function(canvasInstance,index){canvasInstance.set({constrainNavigationToRange:_this._data.constrainNavigationToRange})}),diff.includes("autoSelectRange")&&this._data.canvasId&&this.canvasInstances.forEach(function(canvasInstance,index){canvasInstance.set({autoSelectRange:_this._data.autoSelectRange})}),diff.includes("canvasId")&&this._data.canvasId){var nextCanvasInstance_1=this._getCanvasInstanceById(this._data.canvasId);nextCanvasInstance_1&&this.canvasInstances.forEach(function(canvasInstance){canvasInstance.getCanvasId()!==nextCanvasInstance_1.getCanvasId()?canvasInstance.set({visible:!1}):diff.includes("range")?canvasInstance.set({visible:!0,range:_this._data.range?jQuery.extend(!0,{},_this._data.range):void 0}):canvasInstance.set({visible:!0})})}if(diff.includes("virtualCanvasEnabled")&&(this.set({range:void 0}),this._data.virtualCanvasEnabled&&this.canvasInstances.forEach(function(canvasInstance){canvasInstance.isVirtual()&&_this.set({canvasId:canvasInstance.getCanvasId(),range:void 0})})),diff.includes("range")&&this._data.range){var range=this._data.helper.getRangeById(this._data.range.id);if(range){var canvasId=IIIFComponents.AVComponentUtils.Utils.getFirstTargetedCanvasId(range);if(canvasId){var canvasInstance=this._getCanvasInstanceById(canvasId);if(canvasInstance){if(canvasInstance.isVirtual()&&this._data.virtualCanvasEnabled&&canvasInstance.includesVirtualSubCanvas(canvasId)){canvasId=canvasInstance.getCanvasId();for(var i=0;i<canvasInstance.ranges.length;i++){var r=canvasInstance.ranges[i];if(r.id===range.id){range=r;break}}}this._data.canvasId&&(this._data.canvasId.includes("://")?Manifesto.Utils.normaliseUrl(this._data.canvasId):this._data.canvasId)!==canvasId?this.set({canvasId:canvasId,range:jQuery.extend(!0,{},range)}):canvasInstance.set({range:jQuery.extend(!0,{},range)})}}}else console.warn("range not found")}this._render(),this._resize()},AVComponent.prototype._render=function(){},AVComponent.prototype.reset=function(){this._reset()},AVComponent.prototype._reset=function(){var _this=this;if(this.canvasInstances.forEach(function(canvasInstance,index){canvasInstance.destroy()}),this.canvasInstances=[],this._$element.empty(),this._data&&this._data.helper){var behavior=this._data.helper.manifest.getBehavior(),canvases=this._getCanvases();if(behavior&&behavior.toString()===manifesto.Behavior.autoadvance().toString()){var virtualCanvas_1=new IIIFComponents.AVComponentObjects.VirtualCanvas;canvases.forEach(function(canvas){virtualCanvas_1.addCanvas(canvas)}),this._initCanvas(virtualCanvas_1)}canvases.forEach(function(canvas){_this._initCanvas(canvas)}),this.canvasInstances.length>0&&(this._data.canvasId=this.canvasInstances[0].getCanvasId()),this._checkAllMediaReadyInterval=setInterval(this._checkAllMediaReady.bind(this),100),this._checkAllWaveformsReadyInterval=setInterval(this._checkAllWaveformsReady.bind(this),100),this._$posterContainer=$('<div class="poster-container"></div>'),this._$element.append(this._$posterContainer),this._$posterImage=$('<div class="poster-image"></div>'),this._$posterExpandButton=$('\n                    <button class="btn" title="'+(this._data&&this._data.content?this._data.content.expand:"")+'">\n                        <i class="av-icon  av-icon-expand expand" aria-hidden="true"></i><span>'+(this._data&&this._data.content?this._data.content.expand:"")+"</span>\n                    </button>\n                "),this._$posterImage.append(this._$posterExpandButton),this._$posterImage.on("touchstart click",function(e){e.preventDefault();var target=_this._getPosterImageCss(!_this._posterImageExpanded);if(_this._$posterImage.animate(target),_this._posterImageExpanded=!_this._posterImageExpanded,_this._posterImageExpanded){var label=_this.options.data.content.collapse;_this._$posterExpandButton.prop("title",label),_this._$posterExpandButton.find("i").switchClass("expand","collapse")}else{var label=_this.options.data.content.expand;_this._$posterExpandButton.prop("title",label),_this._$posterExpandButton.find("i").switchClass("collapse","expand")}});var posterCanvas=this._data.helper.getPosterCanvas();if(posterCanvas){this._posterCanvasWidth=posterCanvas.getWidth(),this._posterCanvasHeight=posterCanvas.getHeight();var posterImage=this._data.helper.getPosterImage();if(posterImage){this._$posterContainer.append(this._$posterImage);var css=this._getPosterImageCss(this._posterImageExpanded);css=Object.assign({},css,{"background-image":"url("+posterImage+")"}),this._$posterImage.css(css)}}}},AVComponent.prototype._checkAllMediaReady=function(){console.log("loading media"),this._readyMedia===this.canvasInstances.length&&(console.log("all media ready"),clearInterval(this._checkAllMediaReadyInterval),this.fire(AVComponent.Events.MEDIA_READY),this.resize())},AVComponent.prototype._checkAllWaveformsReady=function(){console.log("loading waveforms"),this._readyWaveforms===this._getCanvasInstancesWithWaveforms().length&&(console.log("waveforms ready"),clearInterval(this._checkAllWaveformsReadyInterval),this.fire(AVComponent.Events.WAVEFORMS_READY),this.resize())},AVComponent.prototype._getCanvasInstancesWithWaveforms=function(){return this.canvasInstances.filter(function(c){return c.waveforms.length>0})},AVComponent.prototype._getCanvases=function(){return this._data.helper?this._data.helper.getCanvases():[]},AVComponent.prototype._initCanvas=function(canvas){var _this=this,canvasInstance=new IIIFComponents.CanvasInstance({target:document.createElement("div"),data:Object.assign({},{canvas:canvas},this._data)});canvasInstance.logMessage=this._logMessage.bind(this),this._$element.append(canvasInstance.$playerElement),canvasInstance.init(),this.canvasInstances.push(canvasInstance),canvasInstance.on(AVComponent.Events.MEDIA_READY,function(){_this._readyMedia++},!1),canvasInstance.on(AVComponent.Events.WAVEFORM_READY,function(){_this._readyWaveforms++},!1),canvasInstance.on(IIIFComponents.AVComponentCanvasInstance.Events.PREVIOUS_RANGE,function(){_this._prevRange()},!1),canvasInstance.on(IIIFComponents.AVComponentCanvasInstance.Events.NEXT_RANGE,function(){_this._nextRange()},!1),canvasInstance.on(AVComponent.Events.RANGE_CHANGED,function(rangeId){_this.fire(AVComponent.Events.RANGE_CHANGED,rangeId)},!1),canvasInstance.on(IIIFComponents.AVVolumeControl.Events.VOLUME_CHANGED,function(volume){_this._setCanvasInstanceVolumes(volume),_this.fire(IIIFComponents.AVVolumeControl.Events.VOLUME_CHANGED,volume)},!1)},AVComponent.prototype._prevRange=function(){if(this._data&&this._data.helper){var prevRange=this._data.helper.getPreviousRange();prevRange?this.playRange(prevRange.id):this._rewind()}},AVComponent.prototype._nextRange=function(){if(this._data&&this._data.helper){var nextRange=this._data.helper.getNextRange();nextRange&&this.playRange(nextRange.id)}},AVComponent.prototype._setCanvasInstanceVolumes=function(volume){this.canvasInstances.forEach(function(canvasInstance){canvasInstance.set({volume:volume})})},AVComponent.prototype._getCanvasInstanceById=function(canvasId){if(canvasId=canvasId.includes("://")?Manifesto.Utils.normaliseUrl(canvasId):canvasId,this._data.virtualCanvasEnabled)for(var i=0;i<this.canvasInstances.length;i++){var canvasInstance=this.canvasInstances[i];if(canvasInstance.isVirtual()&&canvasInstance.getCanvasId()===canvasId||canvasInstance.includesVirtualSubCanvas(canvasId))return canvasInstance}else for(var i=0;i<this.canvasInstances.length;i++){var canvasInstance=this.canvasInstances[i],id=canvasInstance.getCanvasId();if(id){var canvasInstanceId=Manifesto.Utils.normaliseUrl(id);if(canvasInstanceId===canvasId)return canvasInstance}}},AVComponent.prototype._getCurrentCanvas=function(){if(this._data.canvasId)return this._getCanvasInstanceById(this._data.canvasId)},AVComponent.prototype._rewind=function(){if(!this._data.limitToRange){var canvasInstance=this._getCurrentCanvas();canvasInstance&&canvasInstance.set({range:void 0})}},AVComponent.prototype.play=function(){var currentCanvas=this._getCurrentCanvas();currentCanvas&&currentCanvas.play()},AVComponent.prototype.pause=function(){var currentCanvas=this._getCurrentCanvas();currentCanvas&&currentCanvas.pause()},AVComponent.prototype.playRange=function(rangeId){if(this._data.helper){var range=this._data.helper.getRangeById(rangeId);range&&this.set({range:jQuery.extend(!0,{},range)})}},AVComponent.prototype.showCanvas=function(canvasId){var currentCanvas=this._getCurrentCanvas();currentCanvas&&currentCanvas.getCanvasId()===canvasId&&!currentCanvas.isVisible()?currentCanvas.set({visible:!0}):this.set({canvasId:canvasId})},AVComponent.prototype._logMessage=function(message){this.fire(AVComponent.Events.LOG,message)},AVComponent.prototype._getPosterImageCss=function(expanded){var currentCanvas=this._getCurrentCanvas();if(currentCanvas){var $options=currentCanvas.$playerElement.find(".options-container"),containerWidth=currentCanvas.$playerElement.parent().width(),containerHeight=currentCanvas.$playerElement.parent().height()-$options.height();if(expanded)return{top:0,left:0,width:containerWidth,height:containerHeight};var ratio=void 0,width=void 0,height=void 0;return this._posterCanvasWidth>this._posterCanvasHeight?(ratio=this._posterCanvasHeight/this._posterCanvasWidth,width=containerWidth*this._data.posterImageRatio,height=width*ratio):(ratio=this._posterCanvasWidth/this._posterCanvasHeight,height=containerHeight*this._data.posterImageRatio,width=height*ratio),{top:0,left:containerWidth-width,width:width,height:height}}return null},AVComponent.prototype.resize=function(){this.canvasInstances.forEach(function(canvasInstance){canvasInstance.resize()});var currentCanvas=this._getCurrentCanvas();currentCanvas&&this._$posterImage&&this._$posterImage.is(":visible")&&(this._posterImageExpanded?this._$posterImage.css(this._getPosterImageCss(!0)):this._$posterImage.css(this._getPosterImageCss(!1)))},AVComponent}(_Components.BaseComponent);IIIFComponents.AVComponent=AVComponent}(IIIFComponents||(IIIFComponents={})),function(IIIFComponents){var AVComponent;!function(AVComponent){var Events=function(){function Events(){}return Events.MEDIA_READY="mediaready",Events.LOG="log",Events.RANGE_CHANGED="rangechanged",Events.WAVEFORM_READY="waveformready",Events.WAVEFORMS_READY="waveformsready",Events}();AVComponent.Events=Events}(AVComponent=IIIFComponents.AVComponent||(IIIFComponents.AVComponent={}))}(IIIFComponents||(IIIFComponents={})),function(g){g.IIIFComponents?g.IIIFComponents.AVComponent=IIIFComponents.AVComponent:g.IIIFComponents=IIIFComponents}(global);var IIIFComponents,__extends=this&&this.__extends||function(){var extendStatics=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(d,b){d.__proto__=b}||function(d,b){for(var p in b)b.hasOwnProperty(p)&&(d[p]=b[p])};return function(d,b){function __(){this.constructor=d}extendStatics(d,b),d.prototype=null===b?Object.create(b):(__.prototype=b.prototype,new __)}}();!function(IIIFComponents){var AVVolumeControl=function(_super){function AVVolumeControl(options){var _this=_super.call(this,options)||this;return _this._lastVolume=1,_this._data={volume:1},_this._init(),_this._resize(),_this}return __extends(AVVolumeControl,_super),AVVolumeControl.prototype._init=function(){var _this=this,success=_super.prototype._init.call(this);success||console.error("Component failed to initialise"),this._$volumeMute=$('\n                                <button class="btn volume-mute" title="'+this.options.data.content.mute+'">\n                                    <i class="av-icon av-icon-mute on" aria-hidden="true"></i>'+this.options.data.content.mute+"\n                                </button>"),this._$volumeSlider=$('<div class="volume-slider"></div>'),this._$element.append(this._$volumeMute,this._$volumeSlider);var that=this;return this._$volumeMute.on("touchstart click",function(e){e.preventDefault(),0!==_this._data.volume?(_this._lastVolume=_this._data.volume,_this._data.volume=0):_this._data.volume=_this._lastVolume,_this.fire(AVVolumeControl.Events.VOLUME_CHANGED,_this._data.volume)}),this._$volumeSlider.slider({value:that._data.volume,step:.1,orientation:"horizontal",range:"min",min:0,max:1,animate:!1,create:function(evt,ui){},slide:function(evt,ui){that._data.volume=ui.value,0===that._data.volume&&(that._lastVolume=0),that.fire(AVVolumeControl.Events.VOLUME_CHANGED,that._data.volume)},stop:function(evt,ui){}}),success},AVVolumeControl.prototype.set=function(data){this._data=Object.assign(this._data,data),this._render()},AVVolumeControl.prototype._render=function(){if(void 0!==this._data.volume)if(this._$volumeSlider.slider({value:this._data.volume}),0===this._data.volume){var label=this.options.data.content.unmute;this._$volumeMute.prop("title",label),this._$volumeMute.find("i").switchClass("on","off")}else{var label=this.options.data.content.mute;this._$volumeMute.prop("title",label),this._$volumeMute.find("i").switchClass("off","on")}},AVVolumeControl.prototype._resize=function(){},AVVolumeControl}(_Components.BaseComponent);IIIFComponents.AVVolumeControl=AVVolumeControl}(IIIFComponents||(IIIFComponents={})),function(IIIFComponents){var AVVolumeControl;!function(AVVolumeControl){var Events=function(){function Events(){}return Events.VOLUME_CHANGED="volumechanged",Events}();AVVolumeControl.Events=Events}(AVVolumeControl=IIIFComponents.AVVolumeControl||(IIIFComponents.AVVolumeControl={}))}(IIIFComponents||(IIIFComponents={}));var IIIFComponents,__extends=this&&this.__extends||function(){var extendStatics=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(d,b){d.__proto__=b}||function(d,b){for(var p in b)b.hasOwnProperty(p)&&(d[p]=b[p])};return function(d,b){function __(){this.constructor=d}extendStatics(d,b),d.prototype=null===b?Object.create(b):(__.prototype=b.prototype,new __)}}();!function(IIIFComponents){var CanvasInstance=function(_super){function CanvasInstance(options){var _this=_super.call(this,options)||this;return _this._canvasClockFrequency=25,_this._canvasClockStartDate=0,_this._canvasClockTime=0,_this._canvasHeight=0,_this._canvasWidth=0,_this._data=_this.data(),_this._highPriorityFrequency=25,_this._isPlaying=!1,_this._isStalled=!1,_this._lowPriorityFrequency=250,_this._mediaSyncMarginSecs=1,_this._rangeSpanPadding=.25,_this._readyMediaCount=0,_this._stallRequestedBy=[],_this._wasPlaying=!1,_this.ranges=[],_this.waveforms=[],_this._scaleY=function(amplitude,height){var range=256;return Math.max(_this._data.waveformBarWidth,amplitude*height/range)},_this._data=_this.options.data,_this.$playerElement=$('<div class="player"></div>'),_this}return __extends(CanvasInstance,_super),CanvasInstance.prototype.init=function(){var _this=this;if(!this._data||!this._data.content||!this._data.canvas)return void console.warn("unable to initialise, missing canvas or content");this._$hoverPreviewTemplate=$('<div class="hover-preview"><div class="label"></div><div class="pointer"><span class="arrow"></span></div></div>'),this._$canvasContainer=$('<div class="canvas-container"></div>'),this._$optionsContainer=$('<div class="options-container"></div>'),this._$rangeTimelineContainer=$('<div class="range-timeline-container"></div>'),this._$canvasTimelineContainer=$('<div class="canvas-timeline-container"></div>'),this._$canvasHoverPreview=this._$hoverPreviewTemplate.clone(),this._$canvasHoverHighlight=$('<div class="hover-highlight"></div>'),this._$rangeHoverPreview=this._$hoverPreviewTemplate.clone(),this._$rangeHoverHighlight=$('<div class="hover-highlight"></div>'),this._$durationHighlight=$('<div class="duration-highlight"></div>'),this._$timelineItemContainer=$('<div class="timeline-item-container"></div>'),this._$controlsContainer=$('<div class="controls-container"></div>'),this._$prevButton=$('\n                                <button class="btn" title="'+this._data.content.previous+'">\n                                    <i class="av-icon av-icon-previous" aria-hidden="true"></i>'+this._data.content.previous+"\n                                </button>"),this._$playButton=$('\n                                <button class="btn" title="'+this._data.content.play+'">\n                                    <i class="av-icon av-icon-play play" aria-hidden="true"></i>'+this._data.content.play+"\n                                </button>"),this._$nextButton=$('\n                                <button class="btn" title="'+this._data.content.next+'">\n                                    <i class="av-icon av-icon-next" aria-hidden="true"></i>'+this._data.content.next+"\n                                </button>"),this._$timeDisplay=$('<div class="time-display"><span class="canvas-time"></span> / <span class="canvas-duration"></span></div>'),this._$canvasTime=this._$timeDisplay.find(".canvas-time"),this._$canvasDuration=this._$timeDisplay.find(".canvas-duration"),this.isVirtual()&&this.$playerElement.addClass("virtual");var $volume=$('<div class="volume"></div>');if(this._volume=new IIIFComponents.AVVolumeControl({target:$volume[0],data:Object.assign({},this._data)}),this._volume.on(IIIFComponents.AVVolumeControl.Events.VOLUME_CHANGED,function(value){_this.fire(IIIFComponents.AVVolumeControl.Events.VOLUME_CHANGED,value)},!1),this._$controlsContainer.append(this._$prevButton,this._$playButton,this._$nextButton,this._$timeDisplay,$volume),this._$canvasTimelineContainer.append(this._$canvasHoverPreview,this._$canvasHoverHighlight,this._$durationHighlight),this._$rangeTimelineContainer.append(this._$rangeHoverPreview,this._$rangeHoverHighlight),this._$optionsContainer.append(this._$canvasTimelineContainer,this._$rangeTimelineContainer,this._$timelineItemContainer,this._$controlsContainer),this.$playerElement.append(this._$canvasContainer,this._$optionsContainer),this._$canvasHoverPreview.hide(),this._$rangeHoverPreview.hide(),this._data&&this._data.helper&&this._data.canvas){var ranges_1=[];this.isVirtual()?this._data.canvas.canvases.forEach(function(canvas){if(_this._data&&_this._data.helper){var r=_this._data.helper.getCanvasRanges(canvas),clonedRanges_1=[];r.forEach(function(range){var clonedRange=jQuery.extend(!0,{},range);if(clonedRanges_1.push(clonedRange),clonedRange.canvases&&clonedRange.canvases.length)for(var i=0;i<clonedRange.canvases.length;i++)clonedRange.canvases[i]=IIIFComponents.AVComponentUtils.Utils.retargetTemporalComponent(_this._data.canvas.canvases,clonedRange.__jsonld.items[i].id)}),ranges_1.push.apply(ranges_1,clonedRanges_1)}}):ranges_1=ranges_1.concat(this._data.helper.getCanvasRanges(this._data.canvas)),ranges_1.forEach(function(range){_this.ranges.push(range)})}var canvasWidth=this._data.canvas.getWidth(),canvasHeight=this._data.canvas.getHeight();canvasWidth?this._canvasWidth=canvasWidth:this._canvasWidth=this.$playerElement.parent().width(),canvasHeight?this._canvasHeight=canvasHeight:this._canvasHeight=this._canvasWidth*this._data.defaultAspectRatio;var that=this,prevClicks=0,prevTimeout=0;this._$prevButton.on("touchstart click",function(e){e.preventDefault(),prevClicks++,1===prevClicks?(_this._previous(!1),prevTimeout=setTimeout(function(){prevClicks=0,prevTimeout=0},_this._data.doubleClickMS)):(_this._previous(!0),clearTimeout(prevTimeout),prevClicks=0,prevTimeout=0)}),this._$playButton.on("touchstart click",function(e){e.preventDefault(),_this._isPlaying?_this.pause():_this.play()}),this._$nextButton.on("touchstart click",function(e){e.preventDefault(),_this._next()}),this._$canvasTimelineContainer.slider({value:0,step:.01,orientation:"horizontal",range:"min",max:that._getDuration(),animate:!1,create:function(evt,ui){},slide:function(evt,ui){that._setCurrentTime(ui.value)},stop:function(evt,ui){}}),this._$canvasTimelineContainer.mouseout(function(){that._$canvasHoverHighlight.width(0),that._$canvasHoverPreview.hide()}),this._$rangeTimelineContainer.mouseout(function(){that._$rangeHoverHighlight.width(0),that._$rangeHoverPreview.hide()}),this._$canvasTimelineContainer.on("mousemove",function(e){_this._updateHoverPreview(e,_this._$canvasTimelineContainer,_this._getDuration())}),this._$rangeTimelineContainer.on("mousemove",function(e){if(_this._data.range){var duration=_this._data.range.getDuration();_this._updateHoverPreview(e,_this._$rangeTimelineContainer,duration?duration.getLength():0)}}),this._contentAnnotations=[];var items=this._data.canvas.getContent();this._$timelineItemContainer.hide();for(var i=0;i<items.length;i++){var item=items[i],mediaSource=void 0,bodies=item.getBody();if(!bodies.length)return void console.warn("item has no body");var body=this._getBody(bodies);if(body){var type=body.getType(),format=body.getFormat();type&&"textualbody"===type.toString()||(mediaSource=body.id.split("#")[0]);var target=item.getTarget();if(!target)return void console.warn("item has no target");var xywh=IIIFComponents.AVComponentUtils.Utils.getSpatialComponent(target),t=Manifesto.Utils.getTemporalComponent(target);xywh||(xywh=[0,0,this._canvasWidth,this._canvasHeight]),t||(t=[0,this._getDuration()]);var positionLeft=parseInt(String(xywh[0])),positionTop=parseInt(String(xywh[1])),mediaWidth=parseInt(String(xywh[2])),mediaHeight=parseInt(String(xywh[3])),startTime=parseInt(String(t[0])),endTime=parseInt(String(t[1])),percentageTop=this._convertToPercentage(positionTop,this._canvasHeight),percentageLeft=this._convertToPercentage(positionLeft,this._canvasWidth),percentageWidth=this._convertToPercentage(mediaWidth,this._canvasWidth),percentageHeight=this._convertToPercentage(mediaHeight,this._canvasHeight),temporalOffsets=/t=([^&]+)/g.exec(body.id),ot=void 0;ot=temporalOffsets&&temporalOffsets[1]?temporalOffsets[1].split(","):[null,null];var offsetStart=ot[0]?parseInt(ot[0]):ot[0],offsetEnd=ot[1]?parseInt(ot[1]):ot[1],itemData={active:!1,end:endTime,endOffset:offsetEnd,format:format,height:percentageHeight,left:percentageLeft,source:mediaSource,start:startTime,startOffset:offsetStart,top:percentageTop,type:type,width:percentageWidth};this._renderMediaElement(itemData);var seeAlso=item.getProperty("seeAlso");if(seeAlso&&seeAlso.length){var dat=seeAlso[0].id;this.waveforms.push(dat)}}else console.warn("unable to find suitable format for",item.id)}this._renderWaveform()},CanvasInstance.prototype._getBody=function(bodies){for(var i=0;i<bodies.length;i++){var body=bodies[i],format=body.getFormat();if(format&&IIIFComponents.AVComponentUtils.Utils.isHLSFormat(format)&&IIIFComponents.AVComponentUtils.Utils.canPlayHls())return body}for(var i=0;i<bodies.length;i++){var body=bodies[i],format=body.getFormat();if(format&&IIIFComponents.AVComponentUtils.Utils.isMpegDashFormat(format)&&!IIIFComponents.AVComponentUtils.Utils.isSafari())return body}for(var i=0;i<bodies.length;i++){var body=bodies[i],format=body.getFormat();if(format&&!IIIFComponents.AVComponentUtils.Utils.isHLSFormat(format)&&!IIIFComponents.AVComponentUtils.Utils.isMpegDashFormat(format))return body}return null},CanvasInstance.prototype._getDuration=function(){return this._data&&this._data.canvas?this._data.canvas.getDuration():0},CanvasInstance.prototype.data=function(){return{waveformColor:"#fff",waveformBarSpacing:4,waveformBarWidth:2,volume:1}},CanvasInstance.prototype.isVirtual=function(){return this._data.canvas instanceof IIIFComponents.AVComponentObjects.VirtualCanvas},CanvasInstance.prototype.isVisible=function(){return!!this._data.visible},CanvasInstance.prototype.includesVirtualSubCanvas=function(canvasId){if(this.isVirtual()&&this._data.canvas&&this._data.canvas.canvases)for(var i=0;i<this._data.canvas.canvases.length;i++){var canvas=this._data.canvas.canvases[i];if(Manifesto.Utils.normaliseUrl(canvas.id)===canvasId)return!0}return!1},CanvasInstance.prototype.set=function(data){var _this=this,oldData=Object.assign({},this._data);this._data=Object.assign(this._data,data);var diff=IIIFComponents.AVComponentUtils.Utils.diff(oldData,this._data);if(diff.includes("visible")&&this._data.canvas&&(this._data.visible?(this._rewind(),this.$playerElement.show()):(this.$playerElement.hide(),this.pause()),this.resize()),diff.includes("range")&&this._data.helper)if(this._data.range){var duration=this._data.range.getDuration();duration&&(this._data.range.autoChanged||this._setCurrentTime(duration.start),this._data.autoPlay&&this.play(),this.fire(IIIFComponents.AVComponent.Events.RANGE_CHANGED,this._data.range.id))}else this.fire(IIIFComponents.AVComponent.Events.RANGE_CHANGED,null);diff.includes("volume")?this._contentAnnotations.forEach(function($mediaElement){$($mediaElement.element).prop("volume",_this._data.volume),_this._volume.set({volume:_this._data.volume})}):this._render(),diff.includes("limitToRange")&&this._render()},CanvasInstance.prototype._hasRangeChanged=function(){var range=this._getRangeForCurrentTime();range&&!this._data.limitToRange&&(!this._data.range||this._data.range&&range.id!==this._data.range.id)&&this.set({range:jQuery.extend(!0,{autoChanged:!0},range)})},CanvasInstance.prototype._getRangeForCurrentTime=function(parentRange){var ranges;ranges=parentRange?parentRange.getRanges():this.ranges;for(var i=0;i<ranges.length;i++){var range=ranges[i];if(this._rangeSpansCurrentTime(range)){if(this._rangeNavigable(range))return range;for(var childRanges=range.getRanges(),i_1=0;i_1<childRanges.length;i_1++){var childRange=childRanges[i_1];if(this._rangeSpansCurrentTime(childRange))return this._getRangeForCurrentTime(childRange)}return range.parentRange}}},CanvasInstance.prototype._rangeSpansCurrentTime=function(range){return!!range.spansTime(Math.ceil(this._canvasClockTime)+this._rangeSpanPadding)},CanvasInstance.prototype._rangeNavigable=function(range){var behavior=range.getBehavior();return!behavior||behavior.toString()!==manifesto.Behavior.nonav().toString()},CanvasInstance.prototype._render=function(){if(this._data.range){var duration=this._data.range.getDuration();if(duration){var totalLength=this._getDuration(),timelineLength=this._$canvasTimelineContainer.width(),ratio=timelineLength/totalLength,start=duration.start*ratio,end=duration.end*ratio;(end>totalLength||end<start)&&(end=totalLength);var width=end-start;this.isVirtual()?(this._$durationHighlight.show(),this._$durationHighlight.css({left:start,width:width})):this._$durationHighlight.hide();var that_1=this;this._$rangeTimelineContainer.slider("destroy"),this._$rangeTimelineContainer.slider({value:duration.start,step:.01,orientation:"horizontal",range:"min",min:duration.start,max:duration.end,animate:!1,create:function(evt,ui){},slide:function(evt,ui){that_1._setCurrentTime(ui.value)},stop:function(evt,ui){}})}}else this._$durationHighlight.hide();this._data.limitToRange&&this._data.range?(this._$canvasTimelineContainer.hide(),this._$rangeTimelineContainer.show()):(this._$canvasTimelineContainer.show(),this._$rangeTimelineContainer.hide()),this._updateCurrentTimeDisplay(),this._updateDurationDisplay(),this._drawWaveform()},CanvasInstance.prototype.getCanvasId=function(){if(this._data&&this._data.canvas)return this._data.canvas.id},CanvasInstance.prototype._updateHoverPreview=function(e,$container,duration){var offset=$container.offset(),x=e.pageX-offset.left,$hoverArrow=$container.find(".arrow"),$hoverHighlight=$container.find(".hover-highlight"),$hoverPreview=$container.find(".hover-preview");$hoverHighlight.width(x);var fullWidth=$container.width(),ratio=x/fullWidth,seconds=Math.min(duration*ratio);$hoverPreview.find(".label").text(IIIFComponents.AVComponentUtils.Utils.formatTime(seconds));var hoverPreviewWidth=$hoverPreview.outerWidth(),hoverPreviewHeight=$hoverPreview.outerHeight(),left=x-.5*hoverPreviewWidth,arrowLeft=.5*hoverPreviewWidth-6;left<0&&(left=0,arrowLeft=x-6),left+hoverPreviewWidth>fullWidth&&(left=fullWidth-hoverPreviewWidth,arrowLeft=hoverPreviewWidth-(fullWidth-x)-6),$hoverPreview.css({left:left,top:hoverPreviewHeight*-1+"px"}).show(),$hoverArrow.css({left:arrowLeft})},CanvasInstance.prototype._previous=function(isDouble){this._data.limitToRange?isDouble?this._isNavigationConstrainedToRange()?this._rewind():this.fire(IIIFComponents.AVComponentCanvasInstance.Events.PREVIOUS_RANGE):this._rewind():this._data.range?isDouble?(this.set({range:void 0}),this._rewind()):this.fire(IIIFComponents.AVComponentCanvasInstance.Events.PREVIOUS_RANGE):this._rewind()},CanvasInstance.prototype._next=function(){this._data.limitToRange&&this._isNavigationConstrainedToRange()?this._fastforward():this.fire(IIIFComponents.AVComponentCanvasInstance.Events.NEXT_RANGE)},CanvasInstance.prototype.destroy=function(){window.clearInterval(this._highPriorityInterval),window.clearInterval(this._lowPriorityInterval),window.clearInterval(this._canvasClockInterval)},CanvasInstance.prototype._convertToPercentage=function(pixelValue,maxValue){var percentage=pixelValue/maxValue*100;return percentage},CanvasInstance.prototype._renderMediaElement=function(data){var $mediaElement,_this=this,type=data.type.toString().toLowerCase();switch(type){case"image":$mediaElement=$('<img class="anno" src="'+data.source+'" />');break;case"video":$mediaElement=$('<video class="anno" />');break;case"audio":$mediaElement=$('<audio class="anno" />');break;case"textualbody":$mediaElement=$('<div class="anno">'+data.source+"</div>");break;default:return}var media=$mediaElement[0];if(data.format&&"application/dash+xml"===data.format.toString()){$mediaElement.attr("data-dashjs-player","");
+var player=dashjs.MediaPlayer().create();player.initialize(media,data.source)}else if(data.format&&"application/vnd.apple.mpegurl"===data.format.toString())if(Hls.isSupported()){var hls=new Hls;hls.loadSource(data.source),hls.attachMedia(media)}else media.canPlayType("application/vnd.apple.mpegurl")&&(media.src=data.source);else $mediaElement.attr("src",data.source);if($mediaElement.css({top:data.top+"%",left:data.left+"%",width:data.width+"%",height:data.height+"%"}).hide(),data.element=$mediaElement,"video"===type||"audio"===type){data.timeout=null;var that_2=this;data.checkForStall=function(){var self=this;this.active?(that_2._checkMediaSynchronization(),this.element.get(0).readyState>0&&!this.outOfSync?that_2._playbackStalled(!1,self):(that_2._playbackStalled(!0,self),this.timeout&&window.clearTimeout(this.timeout),this.timeout=window.setTimeout(function(){self.checkForStall()},1e3))):that_2._playbackStalled(!1,self)}}this._contentAnnotations.push(data),this.$playerElement&&this._$canvasContainer.append($mediaElement),"video"!==type&&"audio"!==type||($mediaElement.on("loadstart",function(){}),$mediaElement.on("waiting",function(){}),$mediaElement.on("seeking",function(){}),$mediaElement.on("loadedmetadata",function(){_this._readyMediaCount++,_this._readyMediaCount===_this._contentAnnotations.length&&(_this._setCurrentTime(0),_this._data.autoPlay&&_this.play(),_this._updateDurationDisplay(),_this.fire(IIIFComponents.AVComponent.Events.MEDIA_READY))}),$mediaElement.attr("preload","auto"),$mediaElement.get(0).load()),this._renderSyncIndicator(data)},CanvasInstance.prototype._getWaveformData=function(url){return new Promise(function(resolve,reject){$.ajax({url:url,type:"GET",dataType:"binary",responseType:"arraybuffer",processData:!1}).done(function(data){resolve(WaveformData.create(data))}).fail(function(err){reject(new Error("Network Error"))})})},CanvasInstance.prototype._renderWaveform=function(){var _this=this;if(this.waveforms.length){var promises=this.waveforms.map(function(url){return _this._getWaveformData(url)});Promise.all(promises).then(function(waveforms){_this._waveformCanvas=document.createElement("canvas"),_this._waveformCanvas.classList.add("waveform"),_this._$canvasContainer.append(_this._waveformCanvas),_this._waveformCtx=_this._waveformCanvas.getContext("2d"),_this._waveformCtx&&(_this._waveformCtx.fillStyle=_this._data.waveformColor,_this._compositeWaveform=new IIIFComponents.AVComponentObjects.CompositeWaveform(waveforms),_this.fire(IIIFComponents.AVComponent.Events.WAVEFORM_READY))})}},CanvasInstance.prototype._drawWaveform=function(){if(this._waveformCtx){var duration,start=0,end=this._compositeWaveform.duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration&&(start=duration.start,end=duration.end);var startpx=start*this._compositeWaveform.pixelsPerSecond,endpx=end*this._compositeWaveform.pixelsPerSecond,canvasWidth=this._waveformCtx.canvas.width,canvasHeight=this._waveformCtx.canvas.height,barSpacing=this._data.waveformBarSpacing,barWidth=this._data.waveformBarWidth,increment=Math.floor((endpx-startpx)/canvasWidth*barSpacing),sampleSpacing=canvasWidth/barSpacing;this._waveformCtx.clearRect(0,0,canvasWidth,canvasHeight),this._waveformCtx.fillStyle=this._data.waveformColor;for(var x=startpx;x<endpx;x+=increment){var maxMin=this._getWaveformMaxAndMin(this._compositeWaveform,x,sampleSpacing),height=this._scaleY(maxMin.max-maxMin.min,canvasHeight),ypos=(canvasHeight-height)/2,xpos=canvasWidth*IIIFComponents.AVComponentUtils.Utils.normalise(x,startpx,endpx);this._waveformCtx.fillRect(xpos,ypos,barWidth,height)}}},CanvasInstance.prototype._getWaveformMaxAndMin=function(waveform,index,sampleSpacing){for(var max=-127,min=128,x=index;x<index+sampleSpacing;x++)waveform.max(x)>max&&(max=waveform.max(x)),waveform.min(x)<min&&(min=waveform.min(x));return{max:max,min:min}},CanvasInstance.prototype._updateCurrentTimeDisplay=function(){var duration;if(this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration){var rangeClockTime=this._canvasClockTime-duration.start;this._$canvasTime.text(IIIFComponents.AVComponentUtils.Utils.formatTime(rangeClockTime))}else this._$canvasTime.text(IIIFComponents.AVComponentUtils.Utils.formatTime(this._canvasClockTime))},CanvasInstance.prototype._updateDurationDisplay=function(){var duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration?this._$canvasDuration.text(IIIFComponents.AVComponentUtils.Utils.formatTime(duration.getLength())):this._$canvasDuration.text(IIIFComponents.AVComponentUtils.Utils.formatTime(this._getDuration()))},CanvasInstance.prototype._renderSyncIndicator=function(mediaElementData){var leftPercent=this._convertToPercentage(mediaElementData.start,this._getDuration()),widthPercent=this._convertToPercentage(mediaElementData.end-mediaElementData.start,this._getDuration()),$timelineItem=$('<div class="timeline-item" title="'+mediaElementData.source+'" data-start="'+mediaElementData.start+'" data-end="'+mediaElementData.end+'"></div>');$timelineItem.css({left:leftPercent+"%",width:widthPercent+"%"});var $lineWrapper=$('<div class="line-wrapper"></div>');$timelineItem.appendTo($lineWrapper),mediaElementData.timelineElement=$timelineItem,this.$playerElement&&this._$timelineItemContainer.append($lineWrapper)},CanvasInstance.prototype._setCurrentTime=function(seconds){this._canvasClockTime=seconds,this._canvasClockStartDate=Date.now()-1e3*this._canvasClockTime,this.logMessage("SET CURRENT TIME to: "+this._canvasClockTime+" seconds."),this._canvasClockUpdater(),this._highPriorityUpdater(),this._lowPriorityUpdater(),this._synchronizeMedia()},CanvasInstance.prototype._rewind=function(withoutUpdate){this.pause();var duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration?this._canvasClockTime=duration.start:this._canvasClockTime=0,this._data.limitToRange||this._data&&this._data.helper&&this.set({range:void 0})},CanvasInstance.prototype._fastforward=function(){var duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration?this._canvasClockTime=duration.end:this._canvasClockTime=this._getDuration(),this.pause()},CanvasInstance.prototype.play=function(withoutUpdate){var _this=this;if(!this._isPlaying){var duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration&&this._canvasClockTime>=duration.end&&(this._canvasClockTime=duration.start),this._canvasClockTime===this._getDuration()&&(this._canvasClockTime=0),this._canvasClockStartDate=Date.now()-1e3*this._canvasClockTime,this._highPriorityInterval=window.setInterval(function(){_this._highPriorityUpdater()},this._highPriorityFrequency),this._lowPriorityInterval=window.setInterval(function(){_this._lowPriorityUpdater()},this._lowPriorityFrequency),this._canvasClockInterval=window.setInterval(function(){_this._canvasClockUpdater()},this._canvasClockFrequency),this._isPlaying=!0,withoutUpdate||this._synchronizeMedia();var label=this._data&&this._data.content?this._data.content.pause:"";this._$playButton.prop("title",label),this._$playButton.find("i").switchClass("play","pause"),this.fire(IIIFComponents.AVComponentCanvasInstance.Events.PLAYCANVAS),this.logMessage("PLAY canvas")}},CanvasInstance.prototype.pause=function(withoutUpdate){window.clearInterval(this._highPriorityInterval),window.clearInterval(this._lowPriorityInterval),window.clearInterval(this._canvasClockInterval),this._isPlaying=!1,withoutUpdate||(this._highPriorityUpdater(),this._lowPriorityUpdater(),this._synchronizeMedia());var label=this._data&&this._data.content?this._data.content.play:"";this._$playButton.prop("title",label),this._$playButton.find("i").switchClass("pause","play"),this.fire(IIIFComponents.AVComponentCanvasInstance.Events.PAUSECANVAS),this.logMessage("PAUSE canvas")},CanvasInstance.prototype._isNavigationConstrainedToRange=function(){return this._data.constrainNavigationToRange},CanvasInstance.prototype._canvasClockUpdater=function(){this._canvasClockTime=(Date.now()-this._canvasClockStartDate)/1e3;var duration;this._data.range&&(duration=this._data.range.getDuration()),this._data.limitToRange&&duration&&this._canvasClockTime>=duration.end&&this.pause(),this._canvasClockTime>=this._getDuration()&&(this._canvasClockTime=this._getDuration(),this.pause())},CanvasInstance.prototype._highPriorityUpdater=function(){this._$rangeTimelineContainer.slider({value:this._canvasClockTime}),this._$canvasTimelineContainer.slider({value:this._canvasClockTime}),this._updateCurrentTimeDisplay(),this._updateDurationDisplay()},CanvasInstance.prototype._lowPriorityUpdater=function(){this._updateMediaActiveStates(),this._isPlaying&&this._data.autoSelectRange&&this.isVirtual()&&this._hasRangeChanged()},CanvasInstance.prototype._updateMediaActiveStates=function(){for(var contentAnnotation,i=0;i<this._contentAnnotations.length;i++){contentAnnotation=this._contentAnnotations[i];var type=contentAnnotation.type.toString().toLowerCase();contentAnnotation.start<=this._canvasClockTime&&contentAnnotation.end>=this._canvasClockTime?(this._checkMediaSynchronization(),contentAnnotation.active||(this._synchronizeMedia(),contentAnnotation.active=!0,contentAnnotation.element.show(),contentAnnotation.timelineElement.addClass("active")),"video"!==type&&"audio"!==type||contentAnnotation.element[0].currentTime>contentAnnotation.element[0].duration-contentAnnotation.endOffset&&this._pauseMedia(contentAnnotation.element[0])):contentAnnotation.active&&(contentAnnotation.active=!1,contentAnnotation.element.hide(),contentAnnotation.timelineElement.removeClass("active"),"video"!==type&&"audio"!==type||this._pauseMedia(contentAnnotation.element[0]))}},CanvasInstance.prototype._pauseMedia=function(media){media.pause()},CanvasInstance.prototype._setMediaCurrentTime=function(media,time){isNaN(media.duration)||(media.currentTime=time)},CanvasInstance.prototype._synchronizeMedia=function(){for(var contentAnnotation,i=0;i<this._contentAnnotations.length;i++){contentAnnotation=this._contentAnnotations[i];var type=contentAnnotation.type.toString().toLowerCase();if("video"===type||"audio"===type){if(this._setMediaCurrentTime(contentAnnotation.element[0],this._canvasClockTime-contentAnnotation.start+contentAnnotation.startOffset),contentAnnotation.start<=this._canvasClockTime&&contentAnnotation.end>=this._canvasClockTime)if(this._isPlaying){if(contentAnnotation.element[0].paused){var promise=contentAnnotation.element[0].play();promise&&promise["catch"](function(){})}}else this._pauseMedia(contentAnnotation.element[0]);else this._pauseMedia(contentAnnotation.element[0]);contentAnnotation.element[0].currentTime>contentAnnotation.element[0].duration-contentAnnotation.endOffset&&this._pauseMedia(contentAnnotation.element[0])}}this.logMessage("SYNC MEDIA at: "+this._canvasClockTime+" seconds.")},CanvasInstance.prototype._checkMediaSynchronization=function(){for(var contentAnnotation,i=0,l=this._contentAnnotations.length;i<l;i++){contentAnnotation=this._contentAnnotations[i];var type=contentAnnotation.type.toString().toLowerCase();if(("video"===type||"audio"===type)&&contentAnnotation.start<=this._canvasClockTime&&contentAnnotation.end>=this._canvasClockTime){var correctTime=this._canvasClockTime-contentAnnotation.start+contentAnnotation.startOffset,factualTime=contentAnnotation.element[0].currentTime;if(Math.abs(factualTime-correctTime)>this._mediaSyncMarginSecs){contentAnnotation.outOfSync=!0;var lag=Math.abs(factualTime-correctTime);this.logMessage("DETECTED synchronization lag: "+Math.abs(lag)),this._setMediaCurrentTime(contentAnnotation.element[0],correctTime)}else contentAnnotation.outOfSync=!1}}},CanvasInstance.prototype._playbackStalled=function(aBoolean,syncMediaRequestingStall){if(aBoolean)this._stallRequestedBy.indexOf(syncMediaRequestingStall)<0&&this._stallRequestedBy.push(syncMediaRequestingStall),this._isStalled||(this.$playerElement,this._wasPlaying=this._isPlaying,this.pause(!0),this._isStalled=aBoolean);else{var idx=this._stallRequestedBy.indexOf(syncMediaRequestingStall);idx>=0&&this._stallRequestedBy.splice(idx,1),0===this._stallRequestedBy.length&&(this._isStalled&&this._wasPlaying&&this.play(!0),this._isStalled=aBoolean)}},CanvasInstance.prototype.resize=function(){if(this.$playerElement){var containerWidth=this._$canvasContainer.width();if(containerWidth){this._$canvasTimelineContainer.width(containerWidth);var $options=this.$playerElement.find(".options-container");void 0!==this._data.halveAtWidth&&this.$playerElement.parent().width()<this._data.halveAtWidth?this._$canvasContainer.height(this.$playerElement.parent().height()/2):this._$canvasContainer.height(this.$playerElement.parent().height()-$options.height())}if(this._waveformCanvas){var canvasWidth=this._$canvasContainer.width(),canvasHeight=this._$canvasContainer.height();this._waveformCanvas.width=this._lastCanvasWidth=canvasWidth,this._waveformCanvas.height=this._lastCanvasHeight=canvasHeight}this._render()}},CanvasInstance}(_Components.BaseComponent);IIIFComponents.CanvasInstance=CanvasInstance}(IIIFComponents||(IIIFComponents={})),function(IIIFComponents){var AVComponentCanvasInstance;!function(AVComponentCanvasInstance){var Events=function(){function Events(){}return Events.NEXT_RANGE="nextrange",Events.PAUSECANVAS="pause",Events.PLAYCANVAS="play",Events.PREVIOUS_RANGE="previousrange",Events}();AVComponentCanvasInstance.Events=Events}(AVComponentCanvasInstance=IIIFComponents.AVComponentCanvasInstance||(IIIFComponents.AVComponentCanvasInstance={}))}(IIIFComponents||(IIIFComponents={}));var IIIFComponents;!function(IIIFComponents){var AVComponentObjects;!function(AVComponentObjects){var CompositeWaveform=function(){function CompositeWaveform(waveforms){var _this=this;this.length=0,this.duration=0,this.pixelsPerSecond=Number.MAX_VALUE,this.secondsPerPixel=Number.MAX_VALUE,this._waveforms=[],waveforms.forEach(function(waveform){_this._waveforms.push({start:_this.length,end:_this.length+waveform.adapter.length,waveform:waveform}),_this.length+=waveform.adapter.length,_this.duration+=waveform.duration,_this.pixelsPerSecond=Math.min(_this.pixelsPerSecond,waveform.pixels_per_second),_this.secondsPerPixel=Math.min(_this.secondsPerPixel,waveform.seconds_per_pixel)})}return CompositeWaveform.prototype.min=function(index){var waveform=this._find(index);return waveform?waveform.waveform.min_sample(index-waveform.start):0},CompositeWaveform.prototype.max=function(index){var waveform=this._find(index);return waveform?waveform.waveform.max_sample(index-waveform.start):0},CompositeWaveform.prototype._find=function(index){var waveforms=this._waveforms.filter(function(waveform){return index>=waveform.start&&index<waveform.end});return waveforms.length>0?waveforms[0]:null},CompositeWaveform}();AVComponentObjects.CompositeWaveform=CompositeWaveform}(AVComponentObjects=IIIFComponents.AVComponentObjects||(IIIFComponents.AVComponentObjects={}))}(IIIFComponents||(IIIFComponents={}));var IIIFComponents;!function(IIIFComponents){var AVComponentUtils;!function(AVComponentUtils){var Utils=function(){function Utils(){}return Utils._compare=function(a,b){var changed=[];return Object.keys(a).forEach(function(p){Object.is(b[p],a[p])||changed.push(p)}),changed},Utils.diff=function(a,b){return Array.from(new Set(Utils._compare(a,b).concat(Utils._compare(b,a))))},Utils.getSpatialComponent=function(target){var spatial=/xywh=([^&]+)/g.exec(target),xywh=null;return spatial&&spatial[1]&&(xywh=spatial[1].split(",")),xywh},Utils.getFirstTargetedCanvasId=function(range){var canvasId;if(range.canvases&&range.canvases.length)canvasId=range.canvases[0];else{var childRanges=range.getRanges();if(childRanges.length)return Utils.getFirstTargetedCanvasId(childRanges[0])}if(void 0!==canvasId)return Manifesto.Utils.normaliseUrl(canvasId)},Utils.getTimestamp=function(){return String((new Date).valueOf())},Utils.retargetTemporalComponent=function(canvases,target){var t=Manifesto.Utils.getTemporalComponent(target);if(t){for(var offset=0,targetWithoutTemporal=target.substr(0,target.indexOf("#")),i=0;i<canvases.length;i++){var canvas=canvases[i];if(canvas.id.includes(targetWithoutTemporal))break;var duration=canvas.getDuration();duration&&(offset+=duration)}return t[0]=Number(t[0])+offset,t[1]=Number(t[1])+offset,targetWithoutTemporal+"#t="+t[0]+","+t[1]}},Utils.formatTime=function(aNumber){var hours,minutes,seconds,hourValue;return seconds=Math.ceil(aNumber),hours=Math.floor(seconds/3600),hours=hours>=10?hours:"0"+hours,minutes=Math.floor(seconds%3600/60),minutes=minutes>=10?minutes:"0"+minutes,seconds=Math.floor(seconds%3600%60),seconds=seconds>=10?seconds:"0"+seconds,hourValue=hours>=1?hours+":":"",hourValue+minutes+":"+seconds},Utils.detectIE=function(){var ua=window.navigator.userAgent,msie=ua.indexOf("MSIE ");if(msie>0)return parseInt(ua.substring(msie+5,ua.indexOf(".",msie)),10);var trident=ua.indexOf("Trident/");if(trident>0){var rv=ua.indexOf("rv:");return parseInt(ua.substring(rv+3,ua.indexOf(".",rv)),10)}var edge=ua.indexOf("Edge/");return edge>0&&parseInt(ua.substring(edge+5,ua.indexOf(".",edge)),10)},Utils.isSafari=function(){var isSafari=/^((?!chrome|android).)*safari/i.test(navigator.userAgent);return console.log("isSafari",isSafari),isSafari},Utils.debounce=function(fn,debounceDuration){return debounceDuration=debounceDuration||100,function(){if(!fn.debouncing){var args=Array.prototype.slice.apply(arguments);fn.lastReturnVal=fn.apply(window,args),fn.debouncing=!0}return clearTimeout(fn.debounceTimeout),fn.debounceTimeout=setTimeout(function(){fn.debouncing=!1},debounceDuration),fn.lastReturnVal}},Utils.normalise=function(num,min,max){return(num-min)/(max-min)},Utils.isHLSFormat=function(format){return this.hlsMimeTypes.includes(format.toString())},Utils.isMpegDashFormat=function(format){return"application/dash+xml"===format.toString()},Utils.canPlayHls=function(){var doc="object"==typeof document&&document,videoelem=doc&&doc.createElement("video"),isvideosupport=Boolean(videoelem&&videoelem.canPlayType);return isvideosupport&&this.hlsMimeTypes.some(function(canItPlay){return/maybe|probably/i.test(videoelem.canPlayType(canItPlay))})},Utils.hlsMimeTypes=["application/vnd.apple.mpegurl","vnd.apple.mpegurl","audio/mpegurl","audio/x-mpegurl","application/x-mpegurl","video/x-mpegurl","video/mpegurl","application/mpegurl"],Utils}();AVComponentUtils.Utils=Utils}(AVComponentUtils=IIIFComponents.AVComponentUtils||(IIIFComponents.AVComponentUtils={}))}(IIIFComponents||(IIIFComponents={}));var IIIFComponents;!function(IIIFComponents){var AVComponentObjects;!function(AVComponentObjects){var VirtualCanvas=function(){function VirtualCanvas(){this.canvases=[],this.id=IIIFComponents.AVComponentUtils.Utils.getTimestamp()}return VirtualCanvas.prototype.addCanvas=function(canvas){this.canvases.push(jQuery.extend(!0,{},canvas))},VirtualCanvas.prototype.getContent=function(){var _this=this,annotations=[];return this.canvases.forEach(function(canvas){var items=canvas.getContent();items.forEach(function(item){var target=item.getTarget();if(target){var t=Manifesto.Utils.getTemporalComponent(target);t||(item.__jsonld.target+="#t=0,"+canvas.getDuration())}}),items.forEach(function(item){var target=item.getTarget();target&&(item.__jsonld.target=IIIFComponents.AVComponentUtils.Utils.retargetTemporalComponent(_this.canvases,target))}),annotations.push.apply(annotations,items)}),annotations},VirtualCanvas.prototype.getDuration=function(){var duration=0;return this.canvases.forEach(function(canvas){var d=canvas.getDuration();d&&(duration+=d)}),duration},VirtualCanvas.prototype.getWidth=function(){return this.canvases.length?this.canvases[0].getWidth():0},VirtualCanvas.prototype.getHeight=function(){return this.canvases.length?this.canvases[0].getHeight():0},VirtualCanvas}();AVComponentObjects.VirtualCanvas=VirtualCanvas}(AVComponentObjects=IIIFComponents.AVComponentObjects||(IIIFComponents.AVComponentObjects={}))}(IIIFComponents||(IIIFComponents={}));var IIIFComponents;!function(IIIFComponents){var AVComponentObjects;!function(AVComponentObjects){var Waveform=function(){function Waveform(){}return Waveform}();AVComponentObjects.Waveform=Waveform}(AVComponentObjects=IIIFComponents.AVComponentObjects||(IIIFComponents.AVComponentObjects={}))}(IIIFComponents||(IIIFComponents={}))}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{}]},{},[1])(1)});
\ No newline at end of file
diff --git a/examples/js/iiif-av-component.js b/examples/js/iiif-av-component.js
index b2db9a4..e19d9e5 100644
--- a/examples/js/iiif-av-component.js
+++ b/examples/js/iiif-av-component.js
@@ -1,4 +1,4 @@
-// iiif-av-component v0.0.76 https://github.com/iiif-commons/iiif-av-component#readme
+// iiif-av-component v0.0.77 https://github.com/iiif-commons/iiif-av-component#readme
 (function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.iiifAvComponent = f()}})(function(){var define,module,exports;return (function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c="function"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error("Cannot find module '"+i+"'");throw a.code="MODULE_NOT_FOUND",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u="function"==typeof require&&require,i=0;i<t.length;i++)o(t[i]);return o}return r})()({1:[function(require,module,exports){
 (function (global){
 
@@ -184,6 +184,9 @@ var IIIFComponents;
         };
         AVComponent.prototype._render = function () {
         };
+        AVComponent.prototype.reset = function () {
+            this._reset();
+        };
         AVComponent.prototype._reset = function () {
             var _this = this;
             this.canvasInstances.forEach(function (canvasInstance, index) {
diff --git a/package.json b/package.json
index 0a16b81..a235876 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "iiif-av-component",
-  "version": "0.0.76",
+  "version": "0.0.77",
   "description": "",
   "main": "index.js",
   "types": "./dist/iiif-av-component.d.ts",
diff --git a/src/AVComponent.ts b/src/AVComponent.ts
index 046bbd1..51f9c7f 100644
--- a/src/AVComponent.ts
+++ b/src/AVComponent.ts
@@ -223,6 +223,10 @@ namespace IIIFComponents {
             
         }
 
+        public reset(): void {
+            this._reset();
+        }
+
         private _reset(): void {
 
             this.canvasInstances.forEach((canvasInstance: CanvasInstance, index: number) => {