diff --git a/package.json b/package.json
index 482d019..df7c202 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
{
"name": "replaywebpage",
"productName": "ReplayWeb.page",
- "version": "1.1.1-beta.0",
+ "version": "1.1.1-beta.1",
"description": "Serverless Web Archive Replay",
"repository": "https://github.com/webrecorder/replayweb.page",
"homepage": "https://replayweb.page/",
diff --git a/ui.js b/ui.js
index be5dcd6..105433a 100644
--- a/ui.js
+++ b/ui.js
@@ -328,7 +328,7 @@ const re=new WeakMap,oe=v(e=>t=>{if(!(t instanceof L))throw new Error("unsafeSVG
- ReplayWeb.page Version: ${"1.1.1-beta.0"}
+ ReplayWeb.page Version: ${"1.1.1-beta.1"}
@@ -657,7 +657,7 @@ const re=new WeakMap,oe=v(e=>t=>{if(!(t instanceof L))throw new Error("unsafeSVG
`}
- `}onCopy(e,t){return e.preventDefault(),e.stopPropagation(),navigator.clipboard.writeText(t),!1}}customElements.define("wr-coll-index",Ze);var Je=i(97),Ye=i.n(Je),Qe=i(58),Xe=i.n(Qe),et=i(98),tt=i.n(et),it=i(99),at=i.n(it),rt=i(59),ot=i.n(rt),nt=i(60),st=i.n(nt),lt=i(61),ct=i.n(lt),dt=i(100),ht=i.n(dt),ft=i(101),bt=i.n(ft),ut=i(102),pt=i.n(ut),mt="undefined"!=typeof window?window:null,gt=null===mt,vt=gt?void 0:mt.document,wt=function(){return!1},xt=gt?"calc":["","-webkit-","-moz-","-o-"].filter((function(e){var t=vt.createElement("div");return t.style.cssText="width:"+e+"calc(9px)",!!t.style.length})).shift()+"calc",kt=function(e){return"string"==typeof e||e instanceof String},yt=function(e){if(kt(e)){var t=vt.querySelector(e);if(!t)throw new Error("Selector "+e+" did not match a DOM element");return t}return e},St=function(e,t,i){var a=e[t];return void 0!==a?a:i},zt=function(e,t,i,a){if(t){if("end"===a)return 0;if("center"===a)return e/2}else if(i){if("start"===a)return 0;if("center"===a)return e/2}return e},$t=function(e,t){var i=vt.createElement("div");return i.className="gutter gutter-"+t,i},_t=function(e,t,i){var a={};return kt(t)?a[e]=t:a[e]=xt+"("+t+"% - "+i+"px)",a},Ct=function(e,t){var i;return(i={})[e]=t+"px",i},Pt=function(e,t){if(void 0===t&&(t={}),gt)return{};var i,a,r,o,n,s,l=e;Array.from&&(l=Array.from(l));var c=yt(l[0]).parentNode,d=getComputedStyle?getComputedStyle(c):null,h=d?d.flexDirection:null,f=St(t,"sizes")||l.map((function(){return 100/l.length})),b=St(t,"minSize",100),u=Array.isArray(b)?b:l.map((function(){return b})),p=St(t,"expandToMin",!1),m=St(t,"gutterSize",10),g=St(t,"gutterAlign","center"),v=St(t,"snapOffset",30),w=St(t,"dragInterval",1),x=St(t,"direction","horizontal"),k=St(t,"cursor","horizontal"===x?"col-resize":"row-resize"),y=St(t,"gutter",$t),S=St(t,"elementStyle",_t),z=St(t,"gutterStyle",Ct);function $(e,t,a,r){var o=S(i,t,a,r);Object.keys(o).forEach((function(t){e.style[t]=o[t]}))}function _(){return s.map((function(e){return e.size}))}function C(e){return"touches"in e?e.touches[0][a]:e[a]}function P(e){var t=s[this.a],i=s[this.b],a=t.size+i.size;t.size=e/this.size*a,i.size=a-e/this.size*a,$(t.element,t.size,this._b,t.i),$(i.element,i.size,this._c,i.i)}function L(e){var i,a=s[this.a],r=s[this.b];this.dragging&&(i=C(e)-this.start+(this._b-this.dragOffset),w>1&&(i=Math.round(i/w)*w),i<=a.minSize+v+this._b?i=a.minSize+this._b:i>=this.size-(r.minSize+v+this._c)&&(i=this.size-(r.minSize+this._c)),P.call(this,i),St(t,"onDrag",wt)(_()))}function D(){var e=s[this.a].element,t=s[this.b].element,a=e.getBoundingClientRect(),n=t.getBoundingClientRect();this.size=a[i]+n[i]+this._b+this._c,this.start=a[r],this.end=a[o]}function T(e){var t=function(e){if(!getComputedStyle)return null;var t=getComputedStyle(e);if(!t)return null;var i=e[n];return 0===i?null:i-="horizontal"===x?parseFloat(t.paddingLeft)+parseFloat(t.paddingRight):parseFloat(t.paddingTop)+parseFloat(t.paddingBottom)}(c);if(null===t)return e;if(u.reduce((function(e,t){return e+t}),0)>t)return e;var i=0,a=[],r=e.map((function(r,o){var n=t*r/100,s=zt(m,0===o,o===e.length-1,g),l=u[o]+s;return n0&&a[r]-i>0){var n=Math.min(i,a[r]-i);i-=n,o=e-n}return o/t*100}))}function E(){var e=s[this.a].element,i=s[this.b].element;this.dragging&&St(t,"onDragEnd",wt)(_()),this.dragging=!1,mt.removeEventListener("mouseup",this.stop),mt.removeEventListener("touchend",this.stop),mt.removeEventListener("touchcancel",this.stop),mt.removeEventListener("mousemove",this.move),mt.removeEventListener("touchmove",this.move),this.stop=null,this.move=null,e.removeEventListener("selectstart",wt),e.removeEventListener("dragstart",wt),i.removeEventListener("selectstart",wt),i.removeEventListener("dragstart",wt),e.style.userSelect="",e.style.webkitUserSelect="",e.style.MozUserSelect="",e.style.pointerEvents="",i.style.userSelect="",i.style.webkitUserSelect="",i.style.MozUserSelect="",i.style.pointerEvents="",this.gutter.style.cursor="",this.parent.style.cursor="",vt.body.style.cursor=""}function A(e){if(!("button"in e)||0===e.button){var i=s[this.a].element,a=s[this.b].element;this.dragging||St(t,"onDragStart",wt)(_()),e.preventDefault(),this.dragging=!0,this.move=L.bind(this),this.stop=E.bind(this),mt.addEventListener("mouseup",this.stop),mt.addEventListener("touchend",this.stop),mt.addEventListener("touchcancel",this.stop),mt.addEventListener("mousemove",this.move),mt.addEventListener("touchmove",this.move),i.addEventListener("selectstart",wt),i.addEventListener("dragstart",wt),a.addEventListener("selectstart",wt),a.addEventListener("dragstart",wt),i.style.userSelect="none",i.style.webkitUserSelect="none",i.style.MozUserSelect="none",i.style.pointerEvents="none",a.style.userSelect="none",a.style.webkitUserSelect="none",a.style.MozUserSelect="none",a.style.pointerEvents="none",this.gutter.style.cursor=k,this.parent.style.cursor=k,vt.body.style.cursor=k,D.call(this),this.dragOffset=C(e)-this.end}}"horizontal"===x?(i="width",a="clientX",r="left",o="right",n="clientWidth"):"vertical"===x&&(i="height",a="clientY",r="top",o="bottom",n="clientHeight"),f=T(f);var I=[];function R(e){var t=e.i===I.length,i=t?I[e.i-1]:I[e.i];D.call(i);var a=t?i.size-e.minSize-i._c:e.minSize+i._b;P.call(i,a)}return(s=l.map((function(e,t){var a,r={element:yt(e),size:f[t],minSize:u[t],i:t};if(t>0&&((a={a:t-1,b:t,dragging:!1,direction:x,parent:c})._b=zt(m,t-1==0,!1,g),a._c=zt(m,!1,t===l.length-1,g),"row-reverse"===h||"column-reverse"===h)){var o=a.a;a.a=a.b,a.b=o}if(t>0){var n=y(t,x,r.element);!function(e,t,a){var r=z(i,t,a);Object.keys(r).forEach((function(t){e.style[t]=r[t]}))}(n,m,t),a._a=A.bind(a),n.addEventListener("mousedown",a._a),n.addEventListener("touchstart",a._a),c.insertBefore(n,r.element),a.gutter=n}return $(r.element,r.size,zt(m,0===t,t===l.length-1,g),t),t>0&&I.push(a),r}))).forEach((function(e){var t=e.element.getBoundingClientRect()[i];t0){var a=I[i-1],r=s[a.a],o=s[a.b];r.size=t[i-1],o.size=e,$(r.element,r.size,a._b,r.i),$(o.element,o.size,a._c,o.i)}}))},getSizes:_,collapse:function(e){R(s[e])},destroy:function(e,t){I.forEach((function(a){if(!0!==t?a.parent.removeChild(a.gutter):(a.gutter.removeEventListener("mousedown",a._a),a.gutter.removeEventListener("touchstart",a._a)),!0!==e){var r=S(i,a.a.size,a._b);Object.keys(r).forEach((function(e){s[a.a].element.style[e]="",s[a.b].element.style[e]=""}))}}))},parent:c,pairs:I}};class Lt extends ae{constructor(){super(),this.sourceUrl=null,this.inited=!1,this.isLoading=!1,this.baseApiPrefix="./wabac/api",this.baseReplayPrefix="./wabac",this.apiPrefix="",this.replayPrefix="",this.coll="",this.collInfo=null,this._replaceLoc=!1,this._locUpdateNeeded=!1,this._locationHash="",this.tabData={},this.url="",this.ts="",this.tabNames=["pages","story","resources"],this.menuActive=!1,this.hasStory=!1,this.editable=!1,this.showSidebar="1"===localStorage.getItem("pages:showSidebar"),this.splitter=null}static get properties(){return{inited:{type:Boolean},sourceUrl:{type:String},loadInfo:{type:Object,attribute:!1},showSidebar:{type:Boolean},collInfo:{type:Object,attribute:!1},coll:{type:String},hasStory:{type:Boolean},isLoading:{type:Boolean},tabData:{type:Object,attribute:!1},url:{type:String},ts:{type:String},isFullscreen:{type:Boolean},menuActive:{type:Boolean},embed:{type:String},editable:{type:Boolean}}}firstUpdated(){this.inited=!0,window.addEventListener("hashchange",e=>this.onHashChange(e)),this.addEventListener("fullscreenchange",e=>{this.isFullscreen=!!document.fullscreenElement})}updated(e){if(e.has("sourceUrl")&&this.doUpdateInfo(),e.has("tabData")){if(!this.collInfo||!this.collInfo.coll)return;Object.keys(this.tabData).forEach(e=>!this.tabData[e]&&delete this.tabData[e]);const t="#"+new URLSearchParams(this.tabData).toString();if(this.tabData.url||(this.url="search://"+decodeURIComponent(this._paramsToString(this.tabData))),t!==this._locationHash){if(this._locationHash=t,this._replaceLoc||0===Object.keys(e.get("tabData")).length){const e=new URL(window.location.href);e.hash=this._locationHash,window.history.replaceState({},"",e.href),this._replaceLoc=!1}else if(window.location.hash=this._locationHash,!this.showSidebar){const e=this.renderRoot.querySelector("wr-coll-replay");e&&e.focus()}this.embed&&window.parent!==window&&window.parent.postMessage(this.tabData,"*")}this._locUpdateNeeded=!1}e.has("showSidebar")&&(this.embed||localStorage.setItem("pages:showSidebar",this.showSidebar?"1":"0")),(e.has("tabData")||e.has("showSidebar"))&&this.configureSplitter()}configureSplitter(){if(this.tabData.url&&this.showSidebar){const e=this.renderRoot.querySelector("#contents"),t=this.renderRoot.querySelector("wr-coll-replay");if(e&&t&&!this.splitter){const i={sizes:[30,70],minSize:[300,300],gutterSize:4,onDragStart(){t.setDisablePointer(!0)},onDragEnd(){t.setDisablePointer(!1)}};this.splitter=Pt([e,t],i)}}else if(this.splitter){try{this.splitter.destroy()}catch(e){}this.splitter=null}}async doUpdateInfo(){let e=this.loadInfo&&this.loadInfo.customColl;if(!e){e=(await Pe(this.sourceUrl)).coll}this.coll=e;const t=this.baseApiPrefix+"/"+e,i=this.baseReplayPrefix+"/"+e,a=await fetch(t+"?all=1");if(200!=a.status)return void(this.collInfo={});const r=await a.json();this.collInfo={apiPrefix:t,replayPrefix:i,coll:e,...r},this.collInfo.title||(this.collInfo.title=this.collInfo.filename),"replayonly"===this.embed&&(this.showSidebar=!1),this.hasStory=this.collInfo.desc||this.collInfo.lists.length,this.dispatchEvent(new CustomEvent("coll-loaded",{detail:{collInfo:this.collInfo,alreadyLoaded:!0}})),this.onHashChange()}onCollLoaded(e){this.doUpdateInfo(),this.loadInfo=null,this.dispatchEvent(new CustomEvent("coll-loaded",{detail:{sourceUrl:this.sourceUrl,collInfo:this.collInfo}}))}onHashChange(e){const t=window.location.hash;if(t&&t!==this._locationHash&&(this.tabData=Object.fromEntries(new URLSearchParams(t.slice(1)).entries()),this._locationHash=t),this.collInfo.coll&&!this.tabNames.includes(this.tabData.view)){const e=this.hasStory?"story":this.collInfo.pages.length?"pages":"resources";this.tabData={...this.tabData,view:e}}if(this.tabData.url&&this.tabData.url.startsWith("page:")){const e=Number(this.tabData.url.slice("page:".length));if(!isNaN(e)&&e1&&(i=Math.round(i/w)*w),i<=a.minSize+v+this._b?i=a.minSize+this._b:i>=this.size-(r.minSize+v+this._c)&&(i=this.size-(r.minSize+this._c)),P.call(this,i),St(t,"onDrag",wt)(_()))}function D(){var e=s[this.a].element,t=s[this.b].element,a=e.getBoundingClientRect(),n=t.getBoundingClientRect();this.size=a[i]+n[i]+this._b+this._c,this.start=a[r],this.end=a[o]}function T(e){var t=function(e){if(!getComputedStyle)return null;var t=getComputedStyle(e);if(!t)return null;var i=e[n];return 0===i?null:i-="horizontal"===x?parseFloat(t.paddingLeft)+parseFloat(t.paddingRight):parseFloat(t.paddingTop)+parseFloat(t.paddingBottom)}(c);if(null===t)return e;if(u.reduce((function(e,t){return e+t}),0)>t)return e;var i=0,a=[],r=e.map((function(r,o){var n=t*r/100,s=zt(m,0===o,o===e.length-1,g),l=u[o]+s;return n0&&a[r]-i>0){var n=Math.min(i,a[r]-i);i-=n,o=e-n}return o/t*100}))}function E(){var e=s[this.a].element,i=s[this.b].element;this.dragging&&St(t,"onDragEnd",wt)(_()),this.dragging=!1,mt.removeEventListener("mouseup",this.stop),mt.removeEventListener("touchend",this.stop),mt.removeEventListener("touchcancel",this.stop),mt.removeEventListener("mousemove",this.move),mt.removeEventListener("touchmove",this.move),this.stop=null,this.move=null,e.removeEventListener("selectstart",wt),e.removeEventListener("dragstart",wt),i.removeEventListener("selectstart",wt),i.removeEventListener("dragstart",wt),e.style.userSelect="",e.style.webkitUserSelect="",e.style.MozUserSelect="",e.style.pointerEvents="",i.style.userSelect="",i.style.webkitUserSelect="",i.style.MozUserSelect="",i.style.pointerEvents="",this.gutter.style.cursor="",this.parent.style.cursor="",vt.body.style.cursor=""}function A(e){if(!("button"in e)||0===e.button){var i=s[this.a].element,a=s[this.b].element;this.dragging||St(t,"onDragStart",wt)(_()),e.preventDefault(),this.dragging=!0,this.move=L.bind(this),this.stop=E.bind(this),mt.addEventListener("mouseup",this.stop),mt.addEventListener("touchend",this.stop),mt.addEventListener("touchcancel",this.stop),mt.addEventListener("mousemove",this.move),mt.addEventListener("touchmove",this.move),i.addEventListener("selectstart",wt),i.addEventListener("dragstart",wt),a.addEventListener("selectstart",wt),a.addEventListener("dragstart",wt),i.style.userSelect="none",i.style.webkitUserSelect="none",i.style.MozUserSelect="none",i.style.pointerEvents="none",a.style.userSelect="none",a.style.webkitUserSelect="none",a.style.MozUserSelect="none",a.style.pointerEvents="none",this.gutter.style.cursor=k,this.parent.style.cursor=k,vt.body.style.cursor=k,D.call(this),this.dragOffset=C(e)-this.end}}"horizontal"===x?(i="width",a="clientX",r="left",o="right",n="clientWidth"):"vertical"===x&&(i="height",a="clientY",r="top",o="bottom",n="clientHeight"),f=T(f);var I=[];function R(e){var t=e.i===I.length,i=t?I[e.i-1]:I[e.i];D.call(i);var a=t?i.size-e.minSize-i._c:e.minSize+i._b;P.call(i,a)}return(s=l.map((function(e,t){var a,r={element:yt(e),size:f[t],minSize:u[t],i:t};if(t>0&&((a={a:t-1,b:t,dragging:!1,direction:x,parent:c})._b=zt(m,t-1==0,!1,g),a._c=zt(m,!1,t===l.length-1,g),"row-reverse"===h||"column-reverse"===h)){var o=a.a;a.a=a.b,a.b=o}if(t>0){var n=y(t,x,r.element);!function(e,t,a){var r=z(i,t,a);Object.keys(r).forEach((function(t){e.style[t]=r[t]}))}(n,m,t),a._a=A.bind(a),n.addEventListener("mousedown",a._a),n.addEventListener("touchstart",a._a),c.insertBefore(n,r.element),a.gutter=n}return $(r.element,r.size,zt(m,0===t,t===l.length-1,g),t),t>0&&I.push(a),r}))).forEach((function(e){var t=e.element.getBoundingClientRect()[i];t0){var a=I[i-1],r=s[a.a],o=s[a.b];r.size=t[i-1],o.size=e,$(r.element,r.size,a._b,r.i),$(o.element,o.size,a._c,o.i)}}))},getSizes:_,collapse:function(e){R(s[e])},destroy:function(e,t){I.forEach((function(a){if(!0!==t?a.parent.removeChild(a.gutter):(a.gutter.removeEventListener("mousedown",a._a),a.gutter.removeEventListener("touchstart",a._a)),!0!==e){var r=S(i,a.a.size,a._b);Object.keys(r).forEach((function(e){s[a.a].element.style[e]="",s[a.b].element.style[e]=""}))}}))},parent:c,pairs:I}};class Lt extends ae{constructor(){super(),this.sourceUrl=null,this.inited=!1,this.isLoading=!1,this.baseApiPrefix="./wabac/api",this.baseReplayPrefix="./wabac",this.apiPrefix="",this.replayPrefix="",this.coll="",this.collInfo=null,this._replaceLoc=!1,this._locUpdateNeeded=!1,this._locationHash="",this.tabData={},this.url="",this.ts="",this.tabNames=["pages","story","resources"],this.menuActive=!1,this.hasStory=!1,this.editable=!1,this.showSidebar="1"===localStorage.getItem("pages:showSidebar"),this.splitter=null,this.isVisible=!0}static get properties(){return{inited:{type:Boolean},sourceUrl:{type:String},loadInfo:{type:Object,attribute:!1},showSidebar:{type:Boolean},collInfo:{type:Object,attribute:!1},coll:{type:String},hasStory:{type:Boolean},isLoading:{type:Boolean},tabData:{type:Object,attribute:!1},url:{type:String},ts:{type:String},isFullscreen:{type:Boolean},menuActive:{type:Boolean},embed:{type:String},editable:{type:Boolean},isVisible:{type:Boolean}}}firstUpdated(){this.inited=!0,window.addEventListener("hashchange",e=>this.onHashChange(e)),this.addEventListener("fullscreenchange",e=>{this.isFullscreen=!!document.fullscreenElement}),this.embed&&(this.observer=new IntersectionObserver((e,t)=>{this.isVisible=e[0].isIntersecting}),this.observer.observe(this))}updated(e){if(e.has("sourceUrl")&&this.doUpdateInfo(),e.has("tabData")){if(!this.collInfo||!this.collInfo.coll)return;Object.keys(this.tabData).forEach(e=>!this.tabData[e]&&delete this.tabData[e]);const t="#"+new URLSearchParams(this.tabData).toString();if(this.tabData.url||(this.url="search://"+decodeURIComponent(this._paramsToString(this.tabData))),t!==this._locationHash){if(this._locationHash=t,this._replaceLoc||0===Object.keys(e.get("tabData")).length){const e=new URL(window.location.href);e.hash=this._locationHash,window.history.replaceState({},"",e.href),this._replaceLoc=!1}else if(window.location.hash=this._locationHash,!this.showSidebar){const e=this.renderRoot.querySelector("wr-coll-replay");e&&e.focus()}this.embed&&window.parent!==window&&window.parent.postMessage(this.tabData,"*")}this._locUpdateNeeded=!1}e.has("showSidebar")&&(this.embed||localStorage.setItem("pages:showSidebar",this.showSidebar?"1":"0")),(e.has("tabData")||e.has("showSidebar"))&&this.configureSplitter()}configureSplitter(){if(this.tabData.url&&this.showSidebar){const e=this.renderRoot.querySelector("#contents"),t=this.renderRoot.querySelector("wr-coll-replay");if(e&&t&&!this.splitter){const i={sizes:[30,70],minSize:[300,300],gutterSize:4,onDragStart(){t.setDisablePointer(!0)},onDragEnd(){t.setDisablePointer(!1)}};this.splitter=Pt([e,t],i)}}else if(this.splitter){try{this.splitter.destroy()}catch(e){}this.splitter=null}}async doUpdateInfo(){let e=this.loadInfo&&this.loadInfo.customColl;if(!e){e=(await Pe(this.sourceUrl)).coll}this.coll=e;const t=this.baseApiPrefix+"/"+e,i=this.baseReplayPrefix+"/"+e,a=await fetch(t+"?all=1");if(200!=a.status)return void(this.collInfo={});const r=await a.json();this.collInfo={apiPrefix:t,replayPrefix:i,coll:e,...r},this.collInfo.title||(this.collInfo.title=this.collInfo.filename),"replayonly"===this.embed&&(this.showSidebar=!1),this.hasStory=this.collInfo.desc||this.collInfo.lists.length,this.dispatchEvent(new CustomEvent("coll-loaded",{detail:{collInfo:this.collInfo,alreadyLoaded:!0}})),this.onHashChange()}onCollLoaded(e){this.doUpdateInfo(),this.loadInfo=null,this.dispatchEvent(new CustomEvent("coll-loaded",{detail:{sourceUrl:this.sourceUrl,collInfo:this.collInfo}}))}onHashChange(e){const t=window.location.hash;if(t&&t!==this._locationHash&&(this.tabData=Object.fromEntries(new URLSearchParams(t.slice(1)).entries()),this._locationHash=t),this.collInfo.coll&&!this.tabNames.includes(this.tabData.view)){const e=this.hasStory?"story":this.collInfo.pages.length?"pages":"resources";this.tabData={...this.tabData,view:e}}if(this.tabData.url&&this.tabData.url.startsWith("page:")){const e=Number(this.tabData.url.slice("page:".length));if(!isNaN(e)&&et=>{if(!(t instanceof L))throw new Error("unsafeSVG
${this.renderCollTabs(t)}
- ${e?N`
+ ${e&&this.isVisible?N`
t=>{if(!(t instanceof L))throw new Error("unsafeSVG
ts="${this.tabData.ts||""}"
@coll-tab-nav="${this.onCollTabNav}" id="replay"
@replay-loading="${e=>this.isLoading=e.detail.loading}"
- class="${e?"":"is-hidden"}">
+ >
`:""}
@@ -1033,7 +1033,7 @@ const re=new WeakMap,oe=v(e=>t=>{if(!(t instanceof L))throw new Error("unsafeSVG
About ReplayWeb.page
-
+
`:""}