index: make entire index scrollable
sorting: add sorting to url resources
This commit is contained in:
Ilya Kreymer
Vendored
+36
-20
@@ -134,7 +134,7 @@ const n=new WeakMap,s=Object(r.d)(e=>t=>{if(!(t instanceof r.b))throw new Error(
|
||||
* Code distributed by Google as part of the polymer project is also
|
||||
* subject to an additional IP rights grant found at
|
||||
* http://polymer.github.io/PATENTS.txt
|
||||
*/const c=new WeakMap,d=Object(r.d)(e=>t=>{if(!(t instanceof r.b))throw new Error("unsafeSVG can only be used in text bindings");const i=c.get(t);if(void 0!==i&&Object(o.h)(e)&&e===i.value&&t.value===i.fragment)return;const a=document.createElement("template");a.innerHTML=`<svg>${e}</svg>`;const n=a.content,s=n.firstChild;n.removeChild(s),Object(l.c)(n,s.firstChild);const d=document.importNode(n,!0);t.setValue(d),c.set(t,{value:e,fragment:d})}),b=new WeakMap,f=Object(r.d)(e=>t=>{if(!(t instanceof r.a)||t instanceof r.c||"style"!==t.committer.name||t.committer.parts.length>1)throw new Error("The `styleMap` directive must be used in the style attribute and must be the only part in the attribute.");const{committer:i}=t,{style:a}=i.element;let o=b.get(t);void 0===o&&(a.cssText=i.strings.join(" "),b.set(t,o=new Set)),o.forEach(t=>{t in e||(o.delete(t),-1===t.indexOf("-")?a[t]=null:a.removeProperty(t))});for(const t in e)o.add(t),-1===t.indexOf("-")?a[t]=e[t]:a.setProperty(t,e[t])});async function h(e){try{e=new URL(e,window.location.origin).href}catch(e){}return{url:e,coll:"id-"+(await async function(e,t){const i=(new TextEncoder).encode(e),a=await crypto.subtle.digest(t,i);return Array.from(new Uint8Array(a)).map(e=>e.toString(16).padStart(2,"0")).join("")}(e,"SHA-256")).slice(0,12)}}var u;function m(e,t){void 0===t&&(t={});var i=t.registrationOptions;void 0===i&&(i={}),delete t.registrationOptions;var a=function(e){for(var i=[],a=arguments.length-1;a-- >0;)i[a]=arguments[a+1];t&&t[e]&&t[e].apply(t,i)};"serviceWorker"in navigator&&u.then((function(){Boolean("localhost"===window.location.hostname||"[::1]"===window.location.hostname||window.location.hostname.match(/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/))?(!function(e,t,i){fetch(e).then((function(a){404===a.status?(t("error",new Error("Service worker not found at "+e)),v()):-1===a.headers.get("content-type").indexOf("javascript")?(t("error",new Error("Expected "+e+" to have javascript content-type, but received "+a.headers.get("content-type"))),v()):g(e,t,i)})).catch((function(e){return p(t,e)}))}(e,a,i),navigator.serviceWorker.ready.then((function(e){a("ready",e)}))):(g(e,a,i),navigator.serviceWorker.ready.then((function(e){a("ready",e)})))}))}function p(e,t){navigator.onLine||e("offline"),e("error",t)}function g(e,t,i){navigator.serviceWorker.register(e,i).then((function(e){t("registered",e),e.waiting?t("updated",e):e.onupdatefound=function(){t("updatefound",e);var i=e.installing;i.onstatechange=function(){"installed"===i.state&&(navigator.serviceWorker.controller?t("updated",e):t("cached",e))}}})).catch((function(e){return p(t,e)}))}function v(){"serviceWorker"in navigator&&navigator.serviceWorker.ready.then((function(e){e.unregister()}))}"undefined"!=typeof window&&(u="undefined"!=typeof Promise?new Promise((function(e){return window.addEventListener("load",e)})):{then:function(e){return window.addEventListener("load",e)}});var x=i(53),w=i.n(x),k=i(82),y=i.n(k),z=(i(106),i(83)),S=i.n(z),_=i(84),$=i.n(_),C=i(85),T=i.n(C),U=i(86),A=i.n(U),j=i(87),P=i.n(j),I=i(88),E=i.n(I),L=i(89),R=i.n(L),N=i(90),O=i.n(N),M=i(91),G=i.n(M),D=i(92),q=i.n(D),B=i(93),F=i.n(B);const H=Object(a.d)(S.a);function V(e){return[H,e]}const W=new Worker("./sw.js");class Z extends a.a{constructor(){super(),this.sourceUrl=null,this.collInfo=null,this.showTerms=!1,this.pageParams={}}static get properties(){return{pageParams:{type:Object},sourceUrl:{type:String},navMenuShown:{type:Boolean},showTerms:{type:Boolean},collInfo:{type:Object},loadInfo:{type:Object},embed:{type:String}}}static get styles(){return V(a.b`
|
||||
*/const c=new WeakMap,d=Object(r.d)(e=>t=>{if(!(t instanceof r.b))throw new Error("unsafeSVG can only be used in text bindings");const i=c.get(t);if(void 0!==i&&Object(o.h)(e)&&e===i.value&&t.value===i.fragment)return;const a=document.createElement("template");a.innerHTML=`<svg>${e}</svg>`;const n=a.content,s=n.firstChild;n.removeChild(s),Object(l.c)(n,s.firstChild);const d=document.importNode(n,!0);t.setValue(d),c.set(t,{value:e,fragment:d})}),b=new WeakMap,f=Object(r.d)(e=>t=>{if(!(t instanceof r.a)||t instanceof r.c||"style"!==t.committer.name||t.committer.parts.length>1)throw new Error("The `styleMap` directive must be used in the style attribute and must be the only part in the attribute.");const{committer:i}=t,{style:a}=i.element;let o=b.get(t);void 0===o&&(a.cssText=i.strings.join(" "),b.set(t,o=new Set)),o.forEach(t=>{t in e||(o.delete(t),-1===t.indexOf("-")?a[t]=null:a.removeProperty(t))});for(const t in e)o.add(t),-1===t.indexOf("-")?a[t]=e[t]:a.setProperty(t,e[t])});async function h(e){try{e=new URL(e,window.location.origin).href}catch(e){}return{url:e,coll:"id-"+(await async function(e,t){const i=(new TextEncoder).encode(e),a=await crypto.subtle.digest(t,i);return Array.from(new Uint8Array(a)).map(e=>e.toString(16).padStart(2,"0")).join("")}(e,"SHA-256")).slice(0,12)}}var u;function m(e,t){void 0===t&&(t={});var i=t.registrationOptions;void 0===i&&(i={}),delete t.registrationOptions;var a=function(e){for(var i=[],a=arguments.length-1;a-- >0;)i[a]=arguments[a+1];t&&t[e]&&t[e].apply(t,i)};"serviceWorker"in navigator&&u.then((function(){Boolean("localhost"===window.location.hostname||"[::1]"===window.location.hostname||window.location.hostname.match(/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/))?(!function(e,t,i){fetch(e).then((function(a){404===a.status?(t("error",new Error("Service worker not found at "+e)),v()):-1===a.headers.get("content-type").indexOf("javascript")?(t("error",new Error("Expected "+e+" to have javascript content-type, but received "+a.headers.get("content-type"))),v()):g(e,t,i)})).catch((function(e){return p(t,e)}))}(e,a,i),navigator.serviceWorker.ready.then((function(e){a("ready",e)}))):(g(e,a,i),navigator.serviceWorker.ready.then((function(e){a("ready",e)})))}))}function p(e,t){navigator.onLine||e("offline"),e("error",t)}function g(e,t,i){navigator.serviceWorker.register(e,i).then((function(e){t("registered",e),e.waiting?t("updated",e):e.onupdatefound=function(){t("updatefound",e);var i=e.installing;i.onstatechange=function(){"installed"===i.state&&(navigator.serviceWorker.controller?t("updated",e):t("cached",e))}}})).catch((function(e){return p(t,e)}))}function v(){"serviceWorker"in navigator&&navigator.serviceWorker.ready.then((function(e){e.unregister()}))}"undefined"!=typeof window&&(u="undefined"!=typeof Promise?new Promise((function(e){return window.addEventListener("load",e)})):{then:function(e){return window.addEventListener("load",e)}});var x=i(53),w=i.n(x),k=i(82),y=i.n(k),z=(i(106),i(83)),S=i.n(z),_=i(84),$=i.n(_),C=i(85),T=i.n(C),U=i(86),A=i.n(U),j=i(87),P=i.n(j),I=i(88),E=i.n(I),L=i(89),R=i.n(L),N=i(90),O=i.n(N),D=i(91),M=i.n(D),G=i(92),q=i.n(G),B=i(93),F=i.n(B);const H=Object(a.d)(S.a);function V(e){return[H,e]}const W=new Worker("./sw.js");class Z extends a.a{constructor(){super(),this.sourceUrl=null,this.collInfo=null,this.showTerms=!1,this.pageParams={}}static get properties(){return{pageParams:{type:Object},sourceUrl:{type:String},navMenuShown:{type:Boolean},showTerms:{type:Boolean},collInfo:{type:Object},loadInfo:{type:Object},embed:{type:String}}}static get styles(){return V(a.b`
|
||||
#logo {
|
||||
max-height: 2.5rem;
|
||||
margin-right: 8px;
|
||||
@@ -195,6 +195,9 @@ const n=new WeakMap,s=Object(r.d)(e=>t=>{if(!(t instanceof r.b))throw new Error(
|
||||
<div class="navbar-item">
|
||||
Loading Mode: <b>${this.collInfo.onDemand?"Download On-Demand":"Fully Local"}</b>
|
||||
</div>
|
||||
<div class="navbar-item">
|
||||
Collection Id: <b>${this.collInfo.coll}</b>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`:""}
|
||||
@@ -251,7 +254,7 @@ const n=new WeakMap,s=Object(r.d)(e=>t=>{if(!(t instanceof r.b))throw new Error(
|
||||
</div>
|
||||
<button class="modal-close is-large" aria-label="close"></button>
|
||||
</div>
|
||||
`:""} `}firstUpdated(){this.initRoute()}updated(e){e.has("sourceUrl")&&(this.collInfo=null)}onFavIcons(e){const t=document.querySelector("head"),i=document.querySelectorAll("link[rel*='icon']");for(const e of i)t.removeChild(e);for(const i of e.detail.icons){const e=document.createElement("link");e.rel=i.rel,e.href=i.href,t.appendChild(e)}}onNavMenu(){this.navMenuShown=!this.navMenuShown}initRoute(){this.pageParams=new URLSearchParams(window.location.search);let e=this.pageParams.get("state");if(e)try{if(e=JSON.parse(e),e.ids instanceof Array&&e.userId&&"open"===e.action)return this.pageParams.set("source","googledrive://"+e.ids[0]),this.pageParams.delete("state"),void(window.location.search=this.pageParams.toString())}catch(e){console.log(e)}if(this.sourceUrl=this.pageParams.get("source")||"",this.embed=this.pageParams.get("embed")||"",this.pageParams.has("terms")&&(this.showTerms=!0),this.pageParams.has("config")){this.loadInfo||(this.loadInfo={});try{this.loadInfo.extraConfig=JSON.parse(this.pageParams.get("config"))}catch(e){console.log("invalid config: "+e)}}this.pageParams.has("customColl")&&(this.loadInfo||(this.loadInfo={}),this.loadInfo.customColl=this.pageParams.get("customColl"))}onStartLoad(e){if(!e.detail.blobUrl)return this.pageParams.set("source",e.detail.sourceUrl),void(window.location.search=this.pageParams.toString());this.sourceUrl=e.detail.sourceUrl,this.loadInfo=e.detail}onCollLoaded(e){this.loadInfo=null,e.detail.collInfo&&(this.collInfo=e.detail.collInfo),e.detail.alreadyLoaded||(this.initRoute(),e.detail.sourceUrl!==this.sourceUrl&&(this.pageParams.set("source",e.detail.sourceUrl),window.location.search=this.pageParams.toString()))}}class Y extends a.a{constructor(){super(),this.progress=0,this.total=0,this.percent=0,this.coll="",this.state="waiting",this.loadInfo=null}static get properties(){return{sourceUrl:{type:String},loadInfo:{type:Object},state:{type:String},progress:{type:Number},percent:{type:Number},error:{type:String},total:{type:Number},status:{type:String},coll:{type:String}}}firstUpdated(e){this.initMessages()}initMessages(){W.addEventListener("message",e=>{switch(e.data.msg_type){case"collProgress":e.data.name===this.coll&&(this.percent=e.data.percent,e.data.error&&(this.error=e.data.error,this.state="errored"));break;case"collAdded":e.data.name===this.coll&&(this.total||(this.total=100),this.progress=this.total,this.percent=100,this.dispatchEvent(new CustomEvent("coll-loaded",{detail:e.data})))}})}async doLoad(){let e=this.sourceUrl,t=null;try{const{scheme:i,host:a,path:o}=function(e){let t=e.indexOf("://"),i=0,a="",o="",r="";return t>=0?(a=e.slice(0,t),t+=3):(t++,e.startsWith("//")&&(t+=2)),i=e.indexOf("/",t),i>0?(o=e.slice(t,i),r=e.slice(i)):(o=e.slice(t),r=""),{scheme:a,host:o,path:r}}(e);switch(i){case"googledrive":this.state="googledrive",t=await this.googledriveInit();break;case"s3":t={sourceUrl:e,loadUrl:`https://${a}.s3.amazonaws.com${o}`,name:this.sourceUrl};break;case"file":if(!this.loadInfo)return this.state="errored",void(this.error="File URLs can not be entered directly or shared.\nYou can select a file to upload from the main page by clicking the 'Choose File...' button.");t={sourceUrl:this.loadInfo.sourceUrl,loadUrl:this.loadInfo.blobUrl,name:this.loadInfo.name}}}catch(e){}t||(t={sourceUrl:e}),this.state="started";const i={msg_type:"addColl",name:this.coll,skipExisting:!0,file:t};this.loadInfo&&this.loadInfo.extraConfig&&(i.extraConfig=this.loadInfo.extraConfig),W.postMessage(i)}googledriveInit(){return this._gdWait=new Promise(e=>this._gdResolve=e),this._gdWait}async onLoadReady(e){this._gdResolve&&this._gdResolve(e.detail)}onCancel(){W.postMessage({msg_type:"cancelLoad",name:this.coll})}updated(e){this.sourceUrl&&e.has("sourceUrl")&&this.doLoad()}static get styles(){return V(a.b`
|
||||
`:""} `}firstUpdated(){this.initRoute()}updated(e){e.has("sourceUrl")&&(this.collInfo=null)}onFavIcons(e){const t=document.querySelector("head"),i=document.querySelectorAll("link[rel*='icon']");for(const e of i)t.removeChild(e);for(const i of e.detail.icons){const e=document.createElement("link");e.rel=i.rel,e.href=i.href,t.appendChild(e)}}onNavMenu(){this.navMenuShown=!this.navMenuShown}initRoute(){this.pageParams=new URLSearchParams(window.location.search);let e=this.pageParams.get("state");if(e)try{if(e=JSON.parse(e),e.ids instanceof Array&&e.userId&&"open"===e.action)return this.pageParams.set("source","googledrive://"+e.ids[0]),this.pageParams.delete("state"),void(window.location.search=this.pageParams.toString())}catch(e){console.log(e)}if(this.sourceUrl=this.pageParams.get("source")||"",this.embed=this.pageParams.get("embed")||"",this.pageParams.has("terms")&&(this.showTerms=!0),this.pageParams.has("config")){this.loadInfo||(this.loadInfo={});try{this.loadInfo.extraConfig=JSON.parse(this.pageParams.get("config"))}catch(e){console.log("invalid config: "+e)}}this.pageParams.has("customColl")&&(this.loadInfo||(this.loadInfo={}),this.loadInfo.customColl=this.pageParams.get("customColl"))}onStartLoad(e){if(!e.detail.blobUrl)return this.pageParams.set("source",e.detail.sourceUrl),void(window.location.search=this.pageParams.toString());this.sourceUrl=e.detail.sourceUrl,this.loadInfo=e.detail}onCollLoaded(e){this.loadInfo=null,e.detail.collInfo&&(this.collInfo=e.detail.collInfo),e.detail.alreadyLoaded||(this.initRoute(),e.detail.sourceUrl!==this.sourceUrl&&(this.pageParams.set("source",e.detail.sourceUrl),window.location.search=this.pageParams.toString()))}}class K extends a.a{constructor(){super(),this.progress=0,this.total=0,this.percent=0,this.coll="",this.state="waiting",this.loadInfo=null}static get properties(){return{sourceUrl:{type:String},loadInfo:{type:Object},state:{type:String},progress:{type:Number},percent:{type:Number},error:{type:String},total:{type:Number},status:{type:String},coll:{type:String}}}firstUpdated(e){this.initMessages()}initMessages(){W.addEventListener("message",e=>{switch(e.data.msg_type){case"collProgress":e.data.name===this.coll&&(this.percent=e.data.percent,e.data.error&&(this.error=e.data.error,this.state="errored"));break;case"collAdded":e.data.name===this.coll&&(this.total||(this.total=100),this.progress=this.total,this.percent=100,this.dispatchEvent(new CustomEvent("coll-loaded",{detail:e.data})))}})}async doLoad(){let e=this.sourceUrl,t=null;try{const{scheme:i,host:a,path:o}=function(e){let t=e.indexOf("://"),i=0,a="",o="",r="";return t>=0?(a=e.slice(0,t),t+=3):(t++,e.startsWith("//")&&(t+=2)),i=e.indexOf("/",t),i>0?(o=e.slice(t,i),r=e.slice(i)):(o=e.slice(t),r=""),{scheme:a,host:o,path:r}}(e);switch(i){case"googledrive":this.state="googledrive",t=await this.googledriveInit();break;case"s3":t={sourceUrl:e,loadUrl:`https://${a}.s3.amazonaws.com${o}`,name:this.sourceUrl};break;case"file":if(!this.loadInfo)return this.state="errored",void(this.error="File URLs can not be entered directly or shared.\nYou can select a file to upload from the main page by clicking the 'Choose File...' button.");t={sourceUrl:this.loadInfo.sourceUrl,loadUrl:this.loadInfo.blobUrl,name:this.loadInfo.name}}}catch(e){}t||(t={sourceUrl:e}),this.state="started";const i={msg_type:"addColl",name:this.coll,skipExisting:!0,file:t};this.loadInfo&&this.loadInfo.extraConfig&&(i.extraConfig=this.loadInfo.extraConfig),W.postMessage(i)}googledriveInit(){return this._gdWait=new Promise(e=>this._gdResolve=e),this._gdWait}async onLoadReady(e){this._gdResolve&&this._gdResolve(e.detail)}onCancel(){W.postMessage({msg_type:"cancelLoad",name:this.coll})}updated(e){this.sourceUrl&&e.has("sourceUrl")&&this.doLoad()}static get styles(){return V(a.b`
|
||||
.logo {
|
||||
width: 96px;
|
||||
height: 96px;
|
||||
@@ -300,7 +303,10 @@ const n=new WeakMap,s=Object(r.d)(e=>t=>{if(!(t instanceof r.b))throw new Error(
|
||||
<div class="has-text-left">
|
||||
<div class="error has-text-danger">${this.error}</div>
|
||||
<div><a href="/" class="button is-warning">Back</a></div>
|
||||
</div>`;case"waiting":default:return a.c`<progress class="progress is-primary is-large" style="max-width: 400px"/>`}}}class J extends a.a{constructor(){super(),this.colls=[],this.fileDisplayName="",this.file=null,this._deleting={}}static get properties(){return{colls:{type:Array},fileDisplayName:{type:String},_deleting:{type:Object}}}firstUpdated(){this.loadColls()}async loadColls(){const e=await fetch("/wabac/api/index"),t=await e.json();this.colls=t.colls,this._deleting={}}async onDeleteColl(e){e.preventDefault();const t=Number(e.currentTarget.getAttribute("data-coll-index")),i=this.colls[t];if(!i||this._deleting[i.sourceUrl])return;this._deleting[i.sourceUrl]=!0,this.requestUpdate();const a=await fetch("/wabac/api/"+i.id,{method:"DELETE"});if(200===a.status){const e=await a.json();this.colls=e.colls}return!1}onChooseFile(e){0!==e.currentTarget.files.length&&(this.file=e.currentTarget.files[0],this.fileDisplayName="file://"+this.file.name,this.requestUpdate())}onStartLoad(e){e.preventDefault();const t={sourceUrl:this.fileDisplayName};return this.file&&(t.blobUrl=URL.createObjectURL(this.file),t.name=this.fileDisplayName),this.dispatchEvent(new CustomEvent("load-start",{detail:t})),!1}onInput(e){this.fileDisplayName=e.currentTarget.value,this.file&&this.fileDisplayName&&this.fileDisplayName.startsWith("file://")&&(this.file=null,this.fileDisplayName="")}static get styles(){return V(a.b`
|
||||
</div>`;case"waiting":default:return a.c`<progress class="progress is-primary is-large" style="max-width: 400px"/>`}}}class Y extends a.a{constructor(){super(),this.colls=[],this.fileDisplayName="",this.file=null,this._deleting={}}static get properties(){return{colls:{type:Array},fileDisplayName:{type:String},_deleting:{type:Object}}}firstUpdated(){this.loadColls()}async loadColls(){const e=await fetch("/wabac/api/index"),t=await e.json();this.colls=t.colls,this._deleting={}}async onDeleteColl(e){e.preventDefault();const t=Number(e.currentTarget.getAttribute("data-coll-index")),i=this.colls[t];if(!i||this._deleting[i.sourceUrl])return;this._deleting[i.sourceUrl]=!0,this.requestUpdate();const a=await fetch("/wabac/api/"+i.id,{method:"DELETE"});if(200===a.status){const e=await a.json();this.colls=e.colls}return!1}onChooseFile(e){0!==e.currentTarget.files.length&&(this.file=e.currentTarget.files[0],this.fileDisplayName="file://"+this.file.name,this.requestUpdate())}onStartLoad(e){e.preventDefault();const t={sourceUrl:this.fileDisplayName};return this.file&&(t.blobUrl=URL.createObjectURL(this.file),t.name=this.fileDisplayName),this.dispatchEvent(new CustomEvent("load-start",{detail:t})),!1}onInput(e){this.fileDisplayName=e.currentTarget.value,this.file&&this.fileDisplayName&&this.fileDisplayName.startsWith("file://")&&(this.file=null,this.fileDisplayName="")}static get styles(){return V(a.b`
|
||||
:host {
|
||||
overflow-y: auto;
|
||||
}
|
||||
.size {
|
||||
margin-right: 20px;
|
||||
}
|
||||
@@ -320,13 +326,9 @@ const n=new WeakMap,s=Object(r.d)(e=>t=>{if(!(t instanceof r.b))throw new Error(
|
||||
background-color: transparent !important;
|
||||
width: auto;
|
||||
}
|
||||
.coll-list {
|
||||
overflow-y: auto;
|
||||
nav.panel.is-light {
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
nav.main-scroll {
|
||||
max-height: calc(100vh - 279px);
|
||||
}
|
||||
|
||||
input.input.file-name:invalid {
|
||||
border: 1px dashed red;
|
||||
}
|
||||
@@ -378,7 +380,7 @@ const n=new WeakMap,s=Object(r.d)(e=>t=>{if(!(t instanceof r.b))throw new Error(
|
||||
</div>
|
||||
</section>
|
||||
<section class="container">
|
||||
<nav class="panel main-scroll is-light">
|
||||
<nav class="panel is-light">
|
||||
<p class="panel-heading">Loaded Archives</p>
|
||||
<div class="coll-list">
|
||||
${this.colls.length?this.colls.map((e,t)=>a.c`
|
||||
@@ -408,7 +410,7 @@ const n=new WeakMap,s=Object(r.d)(e=>t=>{if(!(t instanceof r.b))throw new Error(
|
||||
</div>
|
||||
</nav>
|
||||
</section>
|
||||
`}}class X extends a.a{constructor(){super(),this.sourceUrl=null,this.baseApiPrefix="/wabac/api",this.baseReplayPrefix="/wabac",this.apiPrefix="",this.replayPrefix="",this.coll="",this.collInfo=null,this.hasCurated=!1,this._replaceLoc=!1,this._locUpdateNeeded=!1,this._locationHash="",this.tabData={}}static get properties(){return{sourceUrl:{type:String},loadInfo:{type:Object},collInfo:{type:Object},coll:{type:String},hasCurated:{type:Boolean},tabData:{type:Object},replayUrl:{type:String},replayTS:{type:String},embed:{type:String}}}firstUpdated(){window.addEventListener("hashchange",e=>this.onHashChange(e))}updated(e){if((e.has("replayUrl")||e.has("replayTS"))&&(this.tabData={view:"replay",url:this.replayUrl,ts:this.replayTS}),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 e="#"+new URLSearchParams(this.tabData).toString();if(e!==this._locationHash)if(this._locationHash=e,this._replaceLoc){const e=new URL(window.location.href);e.hash=this._locationHash,window.history.replaceState({},"",e.href),this._replaceLoc=!1}else window.location.hash=this._locationHash;this._locUpdateNeeded=!1}}async doUpdateInfo(){let e=this.loadInfo&&this.loadInfo.customColl;if(!e){e=(await h(this.sourceUrl)).coll}this.coll=e;const t=this.baseApiPrefix+"/"+e,i=this.baseReplayPrefix+"/"+e,a=await fetch(t);if(200!=a.status)return this.collInfo={},void(this.hasCurated=!1);const o=await a.json();this.collInfo={apiPrefix:t,replayPrefix:i,coll:e,...o},this.collInfo.title||(this.collInfo.title=this.collInfo.filename),this.hasCurated=this.collInfo.lists&&this.collInfo.lists.length,this.dispatchEvent(new CustomEvent("coll-loaded",{detail:{collInfo:this.collInfo,alreadyLoaded:!0}}));const r=window.location.hash;r&&(this.tabData=Object.fromEntries(new URLSearchParams(r.slice(1)).entries())),this.collInfo.coll&&!this.tabData.view&&(this.tabData={...this.tabData,view:this.hasCurated?"curated":"resources"})}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;t&&t!==this._locationHash&&(this.tabData=Object.fromEntries(new URLSearchParams(t.slice(1)).entries()),this._locationHash=t)}onTabClick(e){e.preventDefault();const t=e.currentTarget.getAttribute("href");return this.tabData={...this.tabData,view:t.slice(1)},!1}onCollTabNav(e){e.target.id===this.tabData.view&&(this.tabData={view:this.tabData.view,...e.detail.data},this._replaceLoc=!this._locUpdateNeeded&&e.detail.replaceLoc,this._locUpdateNeeded=!0)}static get styles(){return V(a.b`
|
||||
`}}class J extends a.a{constructor(){super(),this.sourceUrl=null,this.baseApiPrefix="/wabac/api",this.baseReplayPrefix="/wabac",this.apiPrefix="",this.replayPrefix="",this.coll="",this.collInfo=null,this.hasCurated=!1,this._replaceLoc=!1,this._locUpdateNeeded=!1,this._locationHash="",this.tabData={}}static get properties(){return{sourceUrl:{type:String},loadInfo:{type:Object},collInfo:{type:Object},coll:{type:String},hasCurated:{type:Boolean},tabData:{type:Object},replayUrl:{type:String},replayTS:{type:String},embed:{type:String}}}firstUpdated(){window.addEventListener("hashchange",e=>this.onHashChange(e))}updated(e){if((e.has("replayUrl")||e.has("replayTS"))&&(this.tabData={view:"replay",url:this.replayUrl,ts:this.replayTS}),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 e="#"+new URLSearchParams(this.tabData).toString();if(e!==this._locationHash)if(this._locationHash=e,this._replaceLoc){const e=new URL(window.location.href);e.hash=this._locationHash,window.history.replaceState({},"",e.href),this._replaceLoc=!1}else window.location.hash=this._locationHash;this._locUpdateNeeded=!1}}async doUpdateInfo(){let e=this.loadInfo&&this.loadInfo.customColl;if(!e){e=(await h(this.sourceUrl)).coll}this.coll=e;const t=this.baseApiPrefix+"/"+e,i=this.baseReplayPrefix+"/"+e,a=await fetch(t);if(200!=a.status)return this.collInfo={},void(this.hasCurated=!1);const o=await a.json();this.collInfo={apiPrefix:t,replayPrefix:i,coll:e,...o},this.collInfo.title||(this.collInfo.title=this.collInfo.filename),this.hasCurated=this.collInfo.lists&&this.collInfo.lists.length,this.dispatchEvent(new CustomEvent("coll-loaded",{detail:{collInfo:this.collInfo,alreadyLoaded:!0}}));const r=window.location.hash;r&&(this.tabData=Object.fromEntries(new URLSearchParams(r.slice(1)).entries())),this.collInfo.coll&&!this.tabData.view&&(this.tabData={...this.tabData,view:this.hasCurated?"curated":"resources"})}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;t&&t!==this._locationHash&&(this.tabData=Object.fromEntries(new URLSearchParams(t.slice(1)).entries()),this._locationHash=t)}onTabClick(e){e.preventDefault();const t=e.currentTarget.getAttribute("href");return this.tabData={...this.tabData,view:t.slice(1)},!1}onCollTabNav(e){e.target.id===this.tabData.view&&(this.tabData={view:this.tabData.view,...e.detail.data},this._replaceLoc=!this._locUpdateNeeded&&e.detail.replaceLoc,this._locUpdateNeeded=!0)}static get styles(){return V(a.b`
|
||||
.icon {
|
||||
vertical-align: text-top;
|
||||
}
|
||||
@@ -493,7 +495,7 @@ const n=new WeakMap,s=Object(r.d)(e=>t=>{if(!(t instanceof r.b))throw new Error(
|
||||
|
||||
<li class="${"replay"===this.tabData.view?"is-active":""}">
|
||||
<a @click="${this.onTabClick}" href="#replay" class="is-size-6">
|
||||
<span class="icon"><fa-icon .svg="${G.a}"></fa-icon></span>
|
||||
<span class="icon"><fa-icon .svg="${M.a}"></fa-icon></span>
|
||||
<span class="tab-label" title="Replay">Replay</span>
|
||||
</a>
|
||||
</li>
|
||||
@@ -525,7 +527,7 @@ const n=new WeakMap,s=Object(r.d)(e=>t=>{if(!(t instanceof r.b))throw new Error(
|
||||
class="${"replay"===this.tabData.view?"":"is-hidden"}">
|
||||
</wr-replay-page>
|
||||
`:""}
|
||||
`}}class K extends a.a{constructor(){super(),this.collInfo=null,this.currList=0,this.curatedPages={},this.offset=0,this.lastST=0,this.clickTime=0}static get properties(){return{collInfo:{type:Object},curatedPages:{type:Object},currList:{type:Number}}}firstUpdated(){}updated(e){e.has("collInfo")&&this.doLoadCurated()}async doLoadCurated(){const e=await fetch(`${this.collInfo.apiPrefix}/curatedPages?offset=${this.offset}&count=1000`),t=await e.json();this.total=t.total,this.curatedPages={};for(const e of t.curatedPages)this.curatedPages[e.list]||(this.curatedPages[e.list]=[]),this.curatedPages[e.list].push(e);this.currList&&this.scrollToList(this.currList)}static get styles(){return V(a.b`
|
||||
`}}class X extends a.a{constructor(){super(),this.collInfo=null,this.currList=0,this.curatedPages={},this.offset=0,this.lastST=0,this.clickTime=0}static get properties(){return{collInfo:{type:Object},curatedPages:{type:Object},currList:{type:Number}}}firstUpdated(){}updated(e){e.has("collInfo")&&this.doLoadCurated()}async doLoadCurated(){const e=await fetch(`${this.collInfo.apiPrefix}/curatedPages?offset=${this.offset}&count=1000`),t=await e.json();this.total=t.total,this.curatedPages={};for(const e of t.curatedPages)this.curatedPages[e.list]||(this.curatedPages[e.list]=[]),this.curatedPages[e.list].push(e);this.currList&&this.scrollToList(this.currList)}static get styles(){return V(a.b`
|
||||
.columns {
|
||||
width: 100vw;
|
||||
display: flex;
|
||||
@@ -608,13 +610,14 @@ const n=new WeakMap,s=Object(r.d)(e=>t=>{if(!(t instanceof r.b))throw new Error(
|
||||
</div>
|
||||
</article>
|
||||
`)}
|
||||
`}onReplay(e){e.preventDefault();const t={url:e.currentTarget.getAttribute("data-url"),ts:e.currentTarget.getAttribute("data-ts"),view:"replay"};return this.sendChangeEvent(t),!1}sendChangeEvent(e){this.dispatchEvent(new CustomEvent("coll-tab-nav",{detail:{data:e}}))}onClickScroll(e){return e.preventDefault(),this.scrollToList(e.currentTarget.getAttribute("data-list")),!1}scrollToList(e){this.currList=Number(e),this.currList>this.collInfo.lists.length&&(this.currList=0),this.sendChangeEvent({currList:this.currList||void 0});this.clickTime=(new Date).getTime(),this.renderRoot.getElementById("list-"+this.currList).scrollIntoView({behavior:"smooth",block:"nearest",inline:"nearest"})}onScroll(e){const t=e.currentTarget,i=this.renderRoot.getElementById("list-"+this.currList);if(!i)return;let a=i;const o=t.offsetTop,r=t.scrollTop;if(r>this.lastST)for(;a.nextElementSibling&&a.nextElementSibling.getBoundingClientRect().top<o;)a=a.nextElementSibling;else for(;a.previousElementSibling&&a.previousElementSibling.getBoundingClientRect().bottom>=o;)a=a.previousElementSibling;if(this.lastST=r,a&&a!=i&&a.id.startsWith("list-")&&(this.currList=Number(a.id.slice(5)),this.sendChangeEvent({currList:this.currList})),(new Date).getTime()-this.clickTime<1e3)return;const n=this.renderRoot.querySelector(`a[data-list="${this.currList}"]`);if(n){const e={behavior:"smooth",block:"nearest",inline:"nearest"};n.scrollIntoView(e)}}}class Q extends a.a{static get filters(){return[{name:"HTML",filter:"text/html,text/xhtml"},{name:"Images",filter:"image/"},{name:"Audio/Video",filter:"audio/,video/"},{name:"PDF",filter:"application/pdf"},{name:"Javascript",filter:"application/javascript,application/x-javascript"},{name:"CSS",filter:"text/css"},{name:"Fonts",filter:"font/,application/font-woff"},{name:"Plain Text",filter:"text/plain"},{name:"JSON",filter:"application/json"},{name:"DASH/HLS",filter:"application/dash+xml,application/x-mpegURL,application/vnd.apple.mpegurl"},{name:"All URLs",filter:"all"}]}constructor(){super(),this.collInfo=null,this.currMime="",this.urlSearch="",this.urlSearchType="",this.filteredResults=[],this.results=[],this.tryMore=!1,this.loading=!1}static get properties(){return{collInfo:{type:Object},currMime:{type:String},urlSearch:{type:String},urlSearchType:{type:String},filteredResults:{type:Array},loading:{type:Boolean}}}firstUpdated(){}updated(e){if(e.has("urlSearch")||e.has("urlSearchType")||e.has("currMime")){this.currMime||(this.currMime="text/html,text/xhtml"),this.doLoadResources();const t={urlSearch:this.urlSearch,urlSearchType:this.urlSearchType,currMime:this.currMime},i=!e.has("currMime")&&!e.has("urlSearchType");this.dispatchEvent(new CustomEvent("coll-tab-nav",{detail:{replaceLoc:i,data:t}}))}}async doLoadResources(){this.loading=!0;let e=""!==this.urlSearchType?this.urlSearch:"";const t=e&&"prefix"===this.urlSearchType?1:0;e&&!e.startsWith("http")&&(e="https://"+e);const i="all"===this.currMime?"":this.currMime,a=new URLSearchParams({mime:i,url:e,prefix:t,count:100}).toString();let o=await fetch(`${this.collInfo.apiPrefix}/urls?${a}`);o=await o.json(),this.results=o.urls,this.tryMore=100===o.urls.length,this.filter(),this.loading=!1}async doLoadMore(){if(!this.tryMore||!this.results.length)return;if(this.loading)return;this.loading=!0;const e=""!==this.urlSearchType?this.urlSearch:"",t=e&&"prefix"===this.urlSearchType?1:0,i="all"===this.currMime?"":this.currMime,a=this.results[this.results.length-1],o=new URLSearchParams({mime:i,url:e,prefix:t,fromMime:a.mime,fromUrl:a.url,fromTs:new Date(a.date).getTime(),count:100}).toString();let r=await fetch(`${this.collInfo.apiPrefix}/urls?${o}`);r=await r.json(),this.results=this.results.concat(r.urls),this.tryMore=100===r.urls.length,this.filter(),this.loading=!1}onChangeTypeSearch(e){this.currMime=e.currentTarget.value}onChangeUrlSearch(e){this.urlSearch=e.currentTarget.value}onClickUrlType(e){this.urlSearchType=e.currentTarget.value}filter(){const e=[],t=""===this.urlSearchType?this.urlSearch:"";for(const i of this.results)(!t||i.url.indexOf(t)>=0)&&e.push(i);this.filteredResults=e}onScroll(e){const t=e.currentTarget,i=t.scrollHeight-t.scrollTop-t.clientHeight;this.tryMore&&i<40&&this.doLoadMore()}static get styles(){return V(a.b`
|
||||
`}onReplay(e){e.preventDefault();const t={url:e.currentTarget.getAttribute("data-url"),ts:e.currentTarget.getAttribute("data-ts"),view:"replay"};return this.sendChangeEvent(t),!1}sendChangeEvent(e){this.dispatchEvent(new CustomEvent("coll-tab-nav",{detail:{data:e}}))}onClickScroll(e){return e.preventDefault(),this.scrollToList(e.currentTarget.getAttribute("data-list")),!1}scrollToList(e){this.currList=Number(e),this.currList>this.collInfo.lists.length&&(this.currList=0),this.sendChangeEvent({currList:this.currList||void 0});this.clickTime=(new Date).getTime(),this.renderRoot.getElementById("list-"+this.currList).scrollIntoView({behavior:"smooth",block:"nearest",inline:"nearest"})}onScroll(e){const t=e.currentTarget,i=this.renderRoot.getElementById("list-"+this.currList);if(!i)return;let a=i;const o=t.offsetTop,r=t.scrollTop;if(r>this.lastST)for(;a.nextElementSibling&&a.nextElementSibling.getBoundingClientRect().top<o;)a=a.nextElementSibling;else for(;a.previousElementSibling&&a.previousElementSibling.getBoundingClientRect().bottom>=o;)a=a.previousElementSibling;if(this.lastST=r,a&&a!=i&&a.id.startsWith("list-")&&(this.currList=Number(a.id.slice(5)),this.sendChangeEvent({currList:this.currList})),(new Date).getTime()-this.clickTime<1e3)return;const n=this.renderRoot.querySelector(`a[data-list="${this.currList}"]`);if(n){const e={behavior:"smooth",block:"nearest",inline:"nearest"};n.scrollIntoView(e)}}}class Q extends a.a{static get filters(){return[{name:"HTML",filter:"text/html,text/xhtml"},{name:"Images",filter:"image/"},{name:"Audio/Video",filter:"audio/,video/"},{name:"PDF",filter:"application/pdf"},{name:"Javascript",filter:"application/javascript,application/x-javascript"},{name:"CSS",filter:"text/css"},{name:"Fonts",filter:"font/,application/font-woff"},{name:"Plain Text",filter:"text/plain"},{name:"JSON",filter:"application/json"},{name:"DASH/HLS",filter:"application/dash+xml,application/x-mpegURL,application/vnd.apple.mpegurl"},{name:"All URLs",filter:"all"}]}constructor(){super(),this.collInfo=null,this.currMime="",this.urlSearch="",this.urlSearchType="",this.filteredResults=[],this.results=[],this.tryMore=!1,this.loading=!1,this.sortKey="url",this.sortDesc=!1}static get properties(){return{collInfo:{type:Object},currMime:{type:String},urlSearch:{type:String},urlSearchType:{type:String},filteredResults:{type:Array},loading:{type:Boolean},sortKey:{type:String},sortDesc:{type:Boolean}}}firstUpdated(){}updated(e){if(e.has("urlSearch")||e.has("urlSearchType")||e.has("currMime")){this.currMime||(this.currMime="text/html,text/xhtml"),this.doLoadResources();const t={urlSearch:this.urlSearch,urlSearchType:this.urlSearchType,currMime:this.currMime},i=!e.has("currMime")&&!e.has("urlSearchType");this.dispatchEvent(new CustomEvent("coll-tab-nav",{detail:{replaceLoc:i,data:t}}))}(e.has("sortKey")||e.has("sortDesc"))&&this.filter()}async doLoadResources(){this.loading=!0;let e=""!==this.urlSearchType?this.urlSearch:"";const t=e&&"prefix"===this.urlSearchType?1:0;e&&!e.startsWith("http")&&(e="https://"+e);const i="all"===this.currMime?"":this.currMime,a=new URLSearchParams({mime:i,url:e,prefix:t,count:100}).toString();let o=await fetch(`${this.collInfo.apiPrefix}/urls?${a}`);o=await o.json(),this.results=o.urls,this.tryMore=100===o.urls.length,this.filter(),this.loading=!1}async doLoadMore(){if(!this.tryMore||!this.results.length)return;if(this.loading)return;this.loading=!0;const e=""!==this.urlSearchType?this.urlSearch:"",t=e&&"prefix"===this.urlSearchType?1:0,i="all"===this.currMime?"":this.currMime,a=this.results[this.results.length-1],o=new URLSearchParams({mime:i,url:e,prefix:t,fromMime:a.mime,fromUrl:a.url,fromTs:new Date(a.date).getTime(),count:100}).toString();let r=await fetch(`${this.collInfo.apiPrefix}/urls?${o}`);r=await r.json(),this.results=this.results.concat(r.urls),this.tryMore=100===r.urls.length,this.filter(),this.loading=!1}onChangeTypeSearch(e){this.currMime=e.currentTarget.value}onChangeUrlSearch(e){this.urlSearch=e.currentTarget.value}onClickUrlType(e){this.urlSearchType=e.currentTarget.value}filter(){const e=[],t=""===this.urlSearchType?this.urlSearch:"";for(const i of this.results)(!t||i.url.indexOf(t)>=0)&&e.push(i);this.filteredResults=e,this.sortKey&&("url"!==this.sortKey||this.sortDesc)&&this.filteredResults.sort((e,t)=>e[this.sortKey]===t[this.sortKey]?0:this.sortDesc==e[this.sortKey]<t[this.sortKey]?1:-1)}onScroll(e){const t=e.currentTarget,i=t.scrollHeight-t.scrollTop-t.clientHeight;this.tryMore&&i<40&&this.doLoadMore()}static get styles(){return V(a.b`
|
||||
:host {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.notification {
|
||||
width: 100%;
|
||||
min-height: 80px;
|
||||
}
|
||||
.main-scroll {
|
||||
height: calc(100vh - 180px);
|
||||
@@ -627,6 +630,9 @@ const n=new WeakMap,s=Object(r.d)(e=>t=>{if(!(t instanceof r.b))throw new Error(
|
||||
text-overflow: ellipsis;
|
||||
height: 100%;
|
||||
}
|
||||
tr > th {
|
||||
cursor: pointer;
|
||||
}
|
||||
tbody > tr {
|
||||
display: table;
|
||||
width: 100%;
|
||||
@@ -663,6 +669,15 @@ const n=new WeakMap,s=Object(r.d)(e=>t=>{if(!(t instanceof r.b))throw new Error(
|
||||
.flex-auto {
|
||||
flex: auto;
|
||||
}
|
||||
.asc:after {
|
||||
content: "▼";
|
||||
font-size: 0.75em;
|
||||
}
|
||||
.desc:after {
|
||||
content: "▲";
|
||||
font-size: 0.75em;
|
||||
}
|
||||
|
||||
`)}render(){return a.c`
|
||||
<div class="notification level is-marginless">
|
||||
<div class="level-left flex-auto">
|
||||
@@ -694,13 +709,14 @@ const n=new WeakMap,s=Object(r.d)(e=>t=>{if(!(t instanceof r.b))throw new Error(
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<table class="table is-striped is-fullwidth">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="col-url">URL</th>
|
||||
<th class="col-ts">Timestamp</th>
|
||||
<th class="col-mime">Mime</th>
|
||||
<th class="col-status">Status</th>
|
||||
<th @click="${this.onSort}" data-key="url" class="${"url"===this.sortKey?this.sortDesc?"desc":"asc":""} col-url">URL</th>
|
||||
<th @click="${this.onSort}" data-key="ts" class="${"ts"===this.sortKey?this.sortDesc?"desc":"asc":""} col-ts">Timestamp</th>
|
||||
<th @click="${this.onSort}" data-key="mime" class="${"mime"===this.sortKey?this.sortDesc?"desc":"asc":""} col-mime">Mime</th>
|
||||
<th @click="${this.onSort}" data-key="status" class="${"status"===this.sortKey?this.sortDesc?"desc":"asc":""} col-status">Status</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="main-scroll" @scroll="${this.onScroll}">
|
||||
@@ -714,7 +730,7 @@ const n=new WeakMap,s=Object(r.d)(e=>t=>{if(!(t instanceof r.b))throw new Error(
|
||||
`):a.c`<div class="section"><i>No Results Found.</i></div>`}
|
||||
</tbody>
|
||||
</table>
|
||||
`}onReplay(e){e.preventDefault();const t={url:e.currentTarget.getAttribute("data-url"),ts:e.currentTarget.getAttribute("data-ts"),view:"replay"};return this.dispatchEvent(new CustomEvent("coll-tab-nav",{detail:{data:t}})),!1}}class ee extends a.a{constructor(){super(),this.isLoading=!1,this.replayUrl="",this.replayTS="",this.url="",this.ts="",this.title="",this.showAuth=!1,this.reauthWait=null}static get properties(){return{collInfo:{type:Object},sourceUrl:{type:String},url:{type:String},ts:{type:String},replayUrl:{type:String},replayTS:{type:String},title:{type:String},iframeUrl:{type:String},isLoading:{type:Boolean},showAuth:{type:Boolean},embed:{type:String},isFullscreen:{type:Boolean}}}firstUpdated(){window.addEventListener("message",e=>this.onReplayMessage(e)),navigator.serviceWorker.addEventListener("message",async e=>{"authneeded"===e.data.type&&this.collInfo&&e.data.coll===this.collInfo.coll&&(this.reauthWait?await this.reauthWait:this.showAuth=!0)}),this.addEventListener("fullscreenchange",e=>{this.isFullscreen=!!document.fullscreenElement})}onFullscreenToggle(){this.isFullscreen?document.exitFullscreen():this.requestFullscreen()}doSetIframeUrl(){this.iframeUrl=this.url?`${this.collInfo.replayPrefix}/${this.ts||""}mp_/${this.url}`:""}updated(e){if((e.has("sourceUrl")||e.has("collInfo"))&&(this.isAuthable=this.sourceUrl.startsWith("googledrive://")&&this.collInfo&&this.collInfo.onDemand,this.reauthWait=null),!this.url||this.replayUrl==this.url&&this.replayTS==this.ts||!e.has("url")&&!e.has("ts")||(this.replayUrl=this.url,this.replayTS=this.ts,this.doSetIframeUrl()),this.iframeUrl&&e.has("iframeUrl")&&(this.isLoading=!0),this.replayUrl&&e.has("replayUrl")){const e={url:this.replayUrl,ts:this.replayTS};this.dispatchEvent(new CustomEvent("coll-tab-nav",{detail:{replaceLoc:!0,data:e}}))}this.embed&&window.parent!==window&&e.has("title")&&window.parent.postMessage({title:this.title,url:this.replayUrl,ts:this.replayTS},"*")}onReplayMessage(e){const t=this.renderRoot.querySelector("iframe");if(t&&e.source===t.contentWindow)if("load"===e.data.wb_type||"replace-url"===e.data.wb_type){if(this.replayTS=e.data.ts,this.replayUrl=e.data.url,this.title=e.data.title||this.title,this.isLoading=!1,e.data.icons){const t=e.data.icons;this.dispatchEvent(new CustomEvent("replay-favicons",{bubbles:!0,composed:!0,detail:{icons:t}}))}}else"title"===e.data.wb_type&&(this.title=e.data.title)}onSubmit(e){e.preventDefault();const t=this.renderRoot.querySelector("input").value;return this.url=t,!1}onRefresh(e,t){if(e&&e.preventDefault(),this.isLoading&&!t)return;const i=this.renderRoot.querySelector("iframe");i&&(this.isLoading=!0,i.contentWindow.location.reload())}static get styles(){return V(a.b`
|
||||
`}onSort(e){const t=e.currentTarget.getAttribute("data-key");t===this.sortKey?this.sortDesc=!this.sortDesc:(this.sortDesc=!1,this.sortKey=t)}onReplay(e){e.preventDefault();const t={url:e.currentTarget.getAttribute("data-url"),ts:e.currentTarget.getAttribute("data-ts"),view:"replay"};return this.dispatchEvent(new CustomEvent("coll-tab-nav",{detail:{data:t}})),!1}}class ee extends a.a{constructor(){super(),this.isLoading=!1,this.replayUrl="",this.replayTS="",this.url="",this.ts="",this.title="",this.showAuth=!1,this.reauthWait=null}static get properties(){return{collInfo:{type:Object},sourceUrl:{type:String},url:{type:String},ts:{type:String},replayUrl:{type:String},replayTS:{type:String},title:{type:String},iframeUrl:{type:String},isLoading:{type:Boolean},showAuth:{type:Boolean},embed:{type:String},isFullscreen:{type:Boolean}}}firstUpdated(){window.addEventListener("message",e=>this.onReplayMessage(e)),navigator.serviceWorker.addEventListener("message",async e=>{"authneeded"===e.data.type&&this.collInfo&&e.data.coll===this.collInfo.coll&&(this.reauthWait?await this.reauthWait:this.showAuth=!0)}),this.addEventListener("fullscreenchange",e=>{this.isFullscreen=!!document.fullscreenElement})}onFullscreenToggle(){this.isFullscreen?document.exitFullscreen():this.requestFullscreen()}doSetIframeUrl(){this.iframeUrl=this.url?`${this.collInfo.replayPrefix}/${this.ts||""}mp_/${this.url}`:""}updated(e){if((e.has("sourceUrl")||e.has("collInfo"))&&(this.isAuthable=this.sourceUrl.startsWith("googledrive://")&&this.collInfo&&this.collInfo.onDemand,this.reauthWait=null),!this.url||this.replayUrl==this.url&&this.replayTS==this.ts||!e.has("url")&&!e.has("ts")||(this.replayUrl=this.url,this.replayTS=this.ts,this.doSetIframeUrl()),this.iframeUrl&&e.has("iframeUrl")&&(this.isLoading=!0),this.replayUrl&&e.has("replayUrl")){const e={url:this.replayUrl,ts:this.replayTS};this.dispatchEvent(new CustomEvent("coll-tab-nav",{detail:{replaceLoc:!0,data:e}}))}this.embed&&window.parent!==window&&e.has("title")&&window.parent.postMessage({title:this.title,url:this.replayUrl,ts:this.replayTS},"*")}onReplayMessage(e){const t=this.renderRoot.querySelector("iframe");if(t&&e.source===t.contentWindow)if("load"===e.data.wb_type||"replace-url"===e.data.wb_type){if(this.replayTS=e.data.ts,this.replayUrl=e.data.url,this.title=e.data.title||this.title,this.isLoading=!1,e.data.icons){const t=e.data.icons;this.dispatchEvent(new CustomEvent("replay-favicons",{bubbles:!0,composed:!0,detail:{icons:t}}))}}else"title"===e.data.wb_type&&(this.title=e.data.title)}onSubmit(e){e.preventDefault();const t=this.renderRoot.querySelector("input").value;return this.url=t,!1}onRefresh(e,t){if(e&&e.preventDefault(),this.isLoading&&!t)return;const i=this.renderRoot.querySelector("iframe");i&&(this.isLoading=!0,i.contentWindow.location.reload())}static get styles(){return V(a.b`
|
||||
host: {
|
||||
display: flex;
|
||||
}
|
||||
@@ -839,7 +855,7 @@ const n=new WeakMap,s=Object(r.d)(e=>t=>{if(!(t instanceof r.b))throw new Error(
|
||||
width: var(--fa-icon-width, 19px);
|
||||
height: var(--fa-icon-height, 19px);
|
||||
}
|
||||
`}render(){if(!this.svg)return a.c``;const e={width:this.size,height:this.size};return a.c`<svg style="${f(e)}"><g>${d(this.svg)}</g></svg>`}}!async function(){const e=function(e){let t,i;new Promise((e,a)=>{t=e,i=a}),m(e,{registrationOptions:{scope:"/"},ready(e){console.log("Service worker is active."),t()},error(e){console.error("Error during service worker registration:",e),i()}})}("./sw.js");await e,customElements.define("app-main",Z),customElements.define("wr-index",J),customElements.define("wr-loader",Y),customElements.define("wr-coll",X),customElements.define("wr-coll-resources",Q),customElements.define("wr-coll-curated",K),customElements.define("wr-replay-page",ee),customElements.define("wr-gdrive",te),customElements.define("fa-icon",ie)}()},27:function(e,t){function i(){return{baseUrl:null,breaks:!1,gfm:!0,headerIds:!0,headerPrefix:"",highlight:null,langPrefix:"language-",mangle:!0,pedantic:!1,renderer:null,sanitize:!1,sanitizer:null,silent:!1,smartLists:!1,smartypants:!1,tokenizer:null,xhtml:!1}}e.exports={defaults:{baseUrl:null,breaks:!1,gfm:!0,headerIds:!0,headerPrefix:"",highlight:null,langPrefix:"language-",mangle:!0,pedantic:!1,renderer:null,sanitize:!1,sanitizer:null,silent:!1,smartLists:!1,smartypants:!1,tokenizer:null,xhtml:!1},getDefaults:i,changeDefaults:function(t){e.exports.defaults=t}}},28:function(e,t){const i=/[&<>"']/,a=/[&<>"']/g,o=/[<>"']|&(?!#?\w+;)/,r=/[<>"']|&(?!#?\w+;)/g,n={"&":"&","<":"<",">":">",'"':""","'":"'"},s=e=>n[e];const l=/&(#(?:\d+)|(?:#x[0-9A-Fa-f]+)|(?:\w+));?/gi;function c(e){return e.replace(l,(e,t)=>"colon"===(t=t.toLowerCase())?":":"#"===t.charAt(0)?"x"===t.charAt(1)?String.fromCharCode(parseInt(t.substring(2),16)):String.fromCharCode(+t.substring(1)):"")}const d=/(^|[^\[])\^/g;const b=/[^\w:]/g,f=/^$|^[a-z][a-z0-9+.-]*:|^[?#]/i;const h={},u=/^[^:]+:\/*[^/]*$/,m=/^([^:]+:)[\s\S]*$/,p=/^([^:]+:\/*[^/]*)[\s\S]*$/;function g(e,t){h[" "+e]||(u.test(e)?h[" "+e]=e+"/":h[" "+e]=v(e,"/",!0));const i=-1===(e=h[" "+e]).indexOf(":");return"//"===t.substring(0,2)?i?t:e.replace(m,"$1")+t:"/"===t.charAt(0)?i?t:e.replace(p,"$1")+t:e+t}function v(e,t,i){const a=e.length;if(0===a)return"";let o=0;for(;o<a;){const r=e.charAt(a-o-1);if(r!==t||i){if(r===t||!i)break;o++}else o++}return e.substr(0,a-o)}e.exports={escape:function(e,t){if(t){if(i.test(e))return e.replace(a,s)}else if(o.test(e))return e.replace(r,s);return e},unescape:c,edit:function(e,t){e=e.source||e,t=t||"";const i={replace:(t,a)=>(a=(a=a.source||a).replace(d,"$1"),e=e.replace(t,a),i),getRegex:()=>new RegExp(e,t)};return i},cleanUrl:function(e,t,i){if(e){let e;try{e=decodeURIComponent(c(i)).replace(b,"").toLowerCase()}catch(e){return null}if(0===e.indexOf("javascript:")||0===e.indexOf("vbscript:")||0===e.indexOf("data:"))return null}t&&!f.test(i)&&(i=g(t,i));try{i=encodeURI(i).replace(/%25/g,"%")}catch(e){return null}return i},resolveUrl:g,noopTest:{exec:function(){}},merge:function(e){let t,i,a=1;for(;a<arguments.length;a++)for(i in t=arguments[a],t)Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i]);return e},splitCells:function(e,t){const i=e.replace(/\|/g,(e,t,i)=>{let a=!1,o=t;for(;--o>=0&&"\\"===i[o];)a=!a;return a?"|":" |"}).split(/ \|/);let a=0;if(i.length>t)i.splice(t);else for(;i.length<t;)i.push("");for(;a<i.length;a++)i[a]=i[a].trim().replace(/\\\|/g,"|");return i},rtrim:v,findClosingBracket:function(e,t){if(-1===e.indexOf(t[1]))return-1;const i=e.length;let a=0,o=0;for(;o<i;o++)if("\\"===e[o])o++;else if(e[o]===t[0])a++;else if(e[o]===t[1]&&(a--,a<0))return o;return-1},checkSanitizeDeprecation:function(e){e&&e.sanitize&&!e.silent&&console.warn("marked(): sanitize and sanitizer parameters are deprecated since version 0.7.0, should not be used and will be removed in the future. Read more here: https://marked.js.org/#/USING_ADVANCED.md#options")}}},4:function(e,t,i){"use strict";i.d(t,"a",(function(){return a})),i.d(t,"b",(function(){return o}));
|
||||
`}render(){if(!this.svg)return a.c``;const e={width:this.size,height:this.size};return a.c`<svg style="${f(e)}"><g>${d(this.svg)}</g></svg>`}}!async function(){const e=function(e){let t,i;new Promise((e,a)=>{t=e,i=a}),m(e,{registrationOptions:{scope:"/"},ready(e){console.log("Service worker is active."),t()},error(e){console.error("Error during service worker registration:",e),i()}})}("./sw.js");await e,customElements.define("app-main",Z),customElements.define("wr-index",Y),customElements.define("wr-loader",K),customElements.define("wr-coll",J),customElements.define("wr-coll-resources",Q),customElements.define("wr-coll-curated",X),customElements.define("wr-replay-page",ee),customElements.define("wr-gdrive",te),customElements.define("fa-icon",ie)}()},27:function(e,t){function i(){return{baseUrl:null,breaks:!1,gfm:!0,headerIds:!0,headerPrefix:"",highlight:null,langPrefix:"language-",mangle:!0,pedantic:!1,renderer:null,sanitize:!1,sanitizer:null,silent:!1,smartLists:!1,smartypants:!1,tokenizer:null,xhtml:!1}}e.exports={defaults:{baseUrl:null,breaks:!1,gfm:!0,headerIds:!0,headerPrefix:"",highlight:null,langPrefix:"language-",mangle:!0,pedantic:!1,renderer:null,sanitize:!1,sanitizer:null,silent:!1,smartLists:!1,smartypants:!1,tokenizer:null,xhtml:!1},getDefaults:i,changeDefaults:function(t){e.exports.defaults=t}}},28:function(e,t){const i=/[&<>"']/,a=/[&<>"']/g,o=/[<>"']|&(?!#?\w+;)/,r=/[<>"']|&(?!#?\w+;)/g,n={"&":"&","<":"<",">":">",'"':""","'":"'"},s=e=>n[e];const l=/&(#(?:\d+)|(?:#x[0-9A-Fa-f]+)|(?:\w+));?/gi;function c(e){return e.replace(l,(e,t)=>"colon"===(t=t.toLowerCase())?":":"#"===t.charAt(0)?"x"===t.charAt(1)?String.fromCharCode(parseInt(t.substring(2),16)):String.fromCharCode(+t.substring(1)):"")}const d=/(^|[^\[])\^/g;const b=/[^\w:]/g,f=/^$|^[a-z][a-z0-9+.-]*:|^[?#]/i;const h={},u=/^[^:]+:\/*[^/]*$/,m=/^([^:]+:)[\s\S]*$/,p=/^([^:]+:\/*[^/]*)[\s\S]*$/;function g(e,t){h[" "+e]||(u.test(e)?h[" "+e]=e+"/":h[" "+e]=v(e,"/",!0));const i=-1===(e=h[" "+e]).indexOf(":");return"//"===t.substring(0,2)?i?t:e.replace(m,"$1")+t:"/"===t.charAt(0)?i?t:e.replace(p,"$1")+t:e+t}function v(e,t,i){const a=e.length;if(0===a)return"";let o=0;for(;o<a;){const r=e.charAt(a-o-1);if(r!==t||i){if(r===t||!i)break;o++}else o++}return e.substr(0,a-o)}e.exports={escape:function(e,t){if(t){if(i.test(e))return e.replace(a,s)}else if(o.test(e))return e.replace(r,s);return e},unescape:c,edit:function(e,t){e=e.source||e,t=t||"";const i={replace:(t,a)=>(a=(a=a.source||a).replace(d,"$1"),e=e.replace(t,a),i),getRegex:()=>new RegExp(e,t)};return i},cleanUrl:function(e,t,i){if(e){let e;try{e=decodeURIComponent(c(i)).replace(b,"").toLowerCase()}catch(e){return null}if(0===e.indexOf("javascript:")||0===e.indexOf("vbscript:")||0===e.indexOf("data:"))return null}t&&!f.test(i)&&(i=g(t,i));try{i=encodeURI(i).replace(/%25/g,"%")}catch(e){return null}return i},resolveUrl:g,noopTest:{exec:function(){}},merge:function(e){let t,i,a=1;for(;a<arguments.length;a++)for(i in t=arguments[a],t)Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i]);return e},splitCells:function(e,t){const i=e.replace(/\|/g,(e,t,i)=>{let a=!1,o=t;for(;--o>=0&&"\\"===i[o];)a=!a;return a?"|":" |"}).split(/ \|/);let a=0;if(i.length>t)i.splice(t);else for(;i.length<t;)i.push("");for(;a<i.length;a++)i[a]=i[a].trim().replace(/\\\|/g,"|");return i},rtrim:v,findClosingBracket:function(e,t){if(-1===e.indexOf(t[1]))return-1;const i=e.length;let a=0,o=0;for(;o<i;o++)if("\\"===e[o])o++;else if(e[o]===t[0])a++;else if(e[o]===t[1]&&(a--,a<0))return o;return-1},checkSanitizeDeprecation:function(e){e&&e.sanitize&&!e.silent&&console.warn("marked(): sanitize and sanitizer parameters are deprecated since version 0.7.0, should not be used and will be removed in the future. Read more here: https://marked.js.org/#/USING_ADVANCED.md#options")}}},4:function(e,t,i){"use strict";i.d(t,"a",(function(){return a})),i.d(t,"b",(function(){return o}));
|
||||
/**
|
||||
* @license
|
||||
* Copyright (c) 2018 The Polymer Project Authors. All rights reserved.
|
||||
|
||||
+60
-12
@@ -130,6 +130,9 @@ class AppMain extends LitElement
|
||||
<div class="navbar-item">
|
||||
Loading Mode: <b>${this.collInfo.onDemand ? "Download On-Demand" : "Fully Local"}</b>
|
||||
</div>
|
||||
<div class="navbar-item">
|
||||
Collection Id: <b>${this.collInfo.coll}</b>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
` : ``}
|
||||
@@ -597,6 +600,9 @@ class WrIndex extends LitElement
|
||||
|
||||
static get styles() {
|
||||
return wrapCss(css`
|
||||
:host {
|
||||
overflow-y: auto;
|
||||
}
|
||||
.size {
|
||||
margin-right: 20px;
|
||||
}
|
||||
@@ -616,13 +622,9 @@ class WrIndex extends LitElement
|
||||
background-color: transparent !important;
|
||||
width: auto;
|
||||
}
|
||||
.coll-list {
|
||||
overflow-y: auto;
|
||||
nav.panel.is-light {
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
nav.main-scroll {
|
||||
max-height: calc(100vh - 279px);
|
||||
}
|
||||
|
||||
input.input.file-name:invalid {
|
||||
border: 1px dashed red;
|
||||
}
|
||||
@@ -678,7 +680,7 @@ class WrIndex extends LitElement
|
||||
</div>
|
||||
</section>
|
||||
<section class="container">
|
||||
<nav class="panel main-scroll is-light">
|
||||
<nav class="panel is-light">
|
||||
<p class="panel-heading">Loaded Archives</p>
|
||||
<div class="coll-list">
|
||||
${this.colls.length ? this.colls.map((coll, i) => html`
|
||||
@@ -1271,6 +1273,9 @@ class WrResources extends LitElement
|
||||
|
||||
this.tryMore = false;
|
||||
this.loading = false;
|
||||
|
||||
this.sortKey = "url";
|
||||
this.sortDesc = false;
|
||||
}
|
||||
|
||||
static get properties() {
|
||||
@@ -1280,7 +1285,10 @@ class WrResources extends LitElement
|
||||
urlSearch: { type: String },
|
||||
urlSearchType: { type: String },
|
||||
filteredResults: { type: Array },
|
||||
loading: { type: Boolean }
|
||||
loading: { type: Boolean },
|
||||
|
||||
sortKey: { type: String },
|
||||
sortDesc: { type: Boolean }
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1306,6 +1314,10 @@ class WrResources extends LitElement
|
||||
const replaceLoc = !changedProperties.has("currMime") && !changedProperties.has("urlSearchType");
|
||||
this.dispatchEvent(new CustomEvent("coll-tab-nav", {detail: {replaceLoc, data}}));
|
||||
}
|
||||
|
||||
if (changedProperties.has("sortKey") || changedProperties.has("sortDesc")) {
|
||||
this.filter();
|
||||
}
|
||||
}
|
||||
|
||||
async doLoadResources() {
|
||||
@@ -1368,6 +1380,7 @@ class WrResources extends LitElement
|
||||
this.results = this.results.concat(resp.urls);
|
||||
this.tryMore = (resp.urls.length === count);
|
||||
this.filter();
|
||||
|
||||
this.loading = false;
|
||||
}
|
||||
|
||||
@@ -1394,7 +1407,18 @@ class WrResources extends LitElement
|
||||
filteredResults.push(result);
|
||||
}
|
||||
}
|
||||
|
||||
this.filteredResults = filteredResults;
|
||||
|
||||
if (this.sortKey && !(this.sortKey === "url" && !this.sortDesc)) {
|
||||
this.filteredResults.sort((first, second) => {
|
||||
if (first[this.sortKey] === second[this.sortKey]) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
return (this.sortDesc == (first[this.sortKey] < second[this.sortKey])) ? 1 : -1;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
onScroll(event) {
|
||||
@@ -1413,6 +1437,7 @@ class WrResources extends LitElement
|
||||
}
|
||||
.notification {
|
||||
width: 100%;
|
||||
min-height: 80px;
|
||||
}
|
||||
.main-scroll {
|
||||
height: calc(100vh - 180px);
|
||||
@@ -1425,6 +1450,9 @@ class WrResources extends LitElement
|
||||
text-overflow: ellipsis;
|
||||
height: 100%;
|
||||
}
|
||||
tr > th {
|
||||
cursor: pointer;
|
||||
}
|
||||
tbody > tr {
|
||||
display: table;
|
||||
width: 100%;
|
||||
@@ -1461,6 +1489,15 @@ class WrResources extends LitElement
|
||||
.flex-auto {
|
||||
flex: auto;
|
||||
}
|
||||
.asc:after {
|
||||
content: "▼";
|
||||
font-size: 0.75em;
|
||||
}
|
||||
.desc:after {
|
||||
content: "▲";
|
||||
font-size: 0.75em;
|
||||
}
|
||||
|
||||
`);
|
||||
}
|
||||
|
||||
@@ -1496,13 +1533,14 @@ class WrResources extends LitElement
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<table class="table is-striped is-fullwidth">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="col-url">URL</th>
|
||||
<th class="col-ts">Timestamp</th>
|
||||
<th class="col-mime">Mime</th>
|
||||
<th class="col-status">Status</th>
|
||||
<th @click="${this.onSort}" data-key="url" class="${this.sortKey === "url" ? (this.sortDesc ? "desc" : "asc") : ''} col-url">URL</th>
|
||||
<th @click="${this.onSort}" data-key="ts" class="${this.sortKey === "ts" ? (this.sortDesc ? "desc" : "asc") : ''} col-ts">Timestamp</th>
|
||||
<th @click="${this.onSort}" data-key="mime" class="${this.sortKey === "mime" ? (this.sortDesc ? "desc" : "asc") : ''} col-mime">Mime</th>
|
||||
<th @click="${this.onSort}" data-key="status" class="${this.sortKey === "status" ? (this.sortDesc ? "desc" : "asc") : ''} col-status">Status</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="main-scroll" @scroll="${this.onScroll}">
|
||||
@@ -1520,6 +1558,16 @@ class WrResources extends LitElement
|
||||
`;
|
||||
}
|
||||
|
||||
onSort(event) {
|
||||
const key = event.currentTarget.getAttribute("data-key");
|
||||
if (key === this.sortKey) {
|
||||
this.sortDesc = !this.sortDesc;
|
||||
} else {
|
||||
this.sortDesc = false;
|
||||
this.sortKey = key;
|
||||
}
|
||||
}
|
||||
|
||||
onReplay(event) {
|
||||
event.preventDefault();
|
||||
const data = {
|
||||
|
||||
Reference in New Issue
Block a user