archivalo-oss/replayweb.page
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

auth: when using googledrive source, attempt getting new token automatically w/o prompt on replay load

Browse Source 
ui: add input validation for file/url chooser, improved error messaging
detect if list is out of range for currList
style tweaks to info for buttons
This commit is contained in:
Ilya Kreymer
2020-05-09 08:40:33 -07:00
parent f37ba87107
commit 3cfc9acf17
3 changed files with 90 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dist/frontend.js
Vendored
+31 -20
View File
@@ -67,7 +67,7 @@ class y{constructor(e,t,i){this.__parts=[],this.template=e,this.processor=t,this
* subject to an additional IP rights grant found at * subject to an additional IP rights grant found at
* http://polymer.github.io/PATENTS.txt * http://polymer.github.io/PATENTS.txt
*/ */
const _=e=>null===e||!("object"==typeof e||"function"==typeof e),$=e=>Array.isArray(e)||!(!e||!e[Symbol.iterator]);class T{constructor(e,t,i){this.dirty=!0,this.element=e,this.name=t,this.strings=i,this.parts=[];for(let e=0;e<i.length-1;e++)this.parts[e]=this._createPart()}_createPart(){return new C(this)}_getValue(){const e=this.strings,t=e.length-1;let i="";for(let a=0;a<t;a++){i+=e[a];const t=this.parts[a];if(void 0!==t){const e=t.value;if(_(e)||!$(e))i+="string"==typeof e?e:String(e);else for(const t of e)i+="string"==typeof t?t:String(t)}}return i+=e[t],i}commit(){this.dirty&&(this.dirty=!1,this.element.setAttribute(this.name,this._getValue()))}}class C{constructor(e){this.value=void 0,this.committer=e}setValue(e){e===w||_(e)&&e===this.value||(this.value=e,x(e)||(this.committer.dirty=!0))}commit(){for(;x(this.value);){const e=this.value;this.value=w,e(this)}this.value!==w&&this.committer.commit()}}class U{constructor(e){this.value=void 0,this.__pendingValue=void 0,this.options=e}appendInto(e){this.startNode=e.appendChild(f()),this.endNode=e.appendChild(f())}insertAfterNode(e){this.startNode=e,this.endNode=e.nextSibling}appendIntoPart(e){e.__insert(this.startNode=f()),e.__insert(this.endNode=f())}insertAfterPart(e){e.__insert(this.startNode=f()),this.endNode=e.endNode,e.endNode=this.startNode}setValue(e){this.__pendingValue=e}commit(){if(null===this.startNode.parentNode)return;for(;x(this.__pendingValue);){const e=this.__pendingValue;this.__pendingValue=w,e(this)}const e=this.__pendingValue;e!==w&&(_(e)?e!==this.value&&this.__commitText(e):e instanceof S?this.__commitTemplateResult(e):e instanceof Node?this.__commitNode(e):$(e)?this.__commitIterable(e):e===k?(this.value=k,this.clear()):this.__commitText(e))}__insert(e){this.endNode.parentNode.insertBefore(e,this.endNode)}__commitNode(e){this.value!==e&&(this.clear(),this.__insert(e),this.value=e)}__commitText(e){const t=this.startNode.nextSibling,i="string"==typeof(e=null==e?"":e)?e:String(e);t===this.endNode.previousSibling&&3===t.nodeType?t.data=i:this.__commitNode(document.createTextNode(i)),this.value=e}__commitTemplateResult(e){const t=this.options.templateFactory(e);if(this.value instanceof y&&this.value.template===t)this.value.update(e.values);else{const i=new y(t,e.processor,this.options),a=i._clone();i.update(e.values),this.__commitNode(a),this.value=i}}__commitIterable(e){Array.isArray(this.value)||(this.value=[],this.clear());const t=this.value;let i,a=0;for(const r of e)i=t[a],void 0===i&&(i=new U(this.options),t.push(i),0===a?i.appendIntoPart(this):i.insertAfterPart(t[a-1])),i.setValue(r),i.commit(),a++;a<t.length&&(t.length=a,this.clear(i&&i.endNode))}clear(e=this.startNode){o(this.startNode.parentNode,e.nextSibling,this.endNode)}}class P{constructor(e,t,i){if(this.value=void 0,this.__pendingValue=void 0,2!==i.length||""!==i[0]||""!==i[1])throw new Error("Boolean attributes can only contain a single expression");this.element=e,this.name=t,this.strings=i}setValue(e){this.__pendingValue=e}commit(){for(;x(this.__pendingValue);){const e=this.__pendingValue;this.__pendingValue=w,e(this)}if(this.__pendingValue===w)return;const e=!!this.__pendingValue;this.value!==e&&(e?this.element.setAttribute(this.name,""):this.element.removeAttribute(this.name),this.value=e),this.__pendingValue=w}}class A extends T{constructor(e,t,i){super(e,t,i),this.single=2===i.length&&""===i[0]&&""===i[1]}_createPart(){return new E(this)}_getValue(){return this.single?this.parts[0].value:super._getValue()}commit(){this.dirty&&(this.dirty=!1,this.element[this.name]=this._getValue())}}class E extends C{}let R=!1;(()=>{try{const e={get capture(){return R=!0,!1}};window.addEventListener("test",e,e),window.removeEventListener("test",e,e)}catch(e){}})();class N{constructor(e,t,i){this.value=void 0,this.__pendingValue=void 0,this.element=e,this.eventName=t,this.eventContext=i,this.__boundHandleEvent=e=>this.handleEvent(e)}setValue(e){this.__pendingValue=e}commit(){for(;x(this.__pendingValue);){const e=this.__pendingValue;this.__pendingValue=w,e(this)}if(this.__pendingValue===w)return;const e=this.__pendingValue,t=this.value,i=null==e||null!=t&&(e.capture!==t.capture||e.once!==t.once||e.passive!==t.passive),a=null!=e&&(null==t||i);i&&this.element.removeEventListener(this.eventName,this.__boundHandleEvent,this.__options),a&&(this.__options=j(e),this.element.addEventListener(this.eventName,this.__boundHandleEvent,this.__options)),this.value=e,this.__pendingValue=w}handleEvent(e){"function"==typeof this.value?this.value.call(this.eventContext||this.element,e):this.value.handleEvent(e)}}const j=e=>e&&(R?{capture:e.capture,passive:e.passive,once:e.once}:e.capture) const _=e=>null===e||!("object"==typeof e||"function"==typeof e),$=e=>Array.isArray(e)||!(!e||!e[Symbol.iterator]);class T{constructor(e,t,i){this.dirty=!0,this.element=e,this.name=t,this.strings=i,this.parts=[];for(let e=0;e<i.length-1;e++)this.parts[e]=this._createPart()}_createPart(){return new C(this)}_getValue(){const e=this.strings,t=e.length-1;let i="";for(let a=0;a<t;a++){i+=e[a];const t=this.parts[a];if(void 0!==t){const e=t.value;if(_(e)||!$(e))i+="string"==typeof e?e:String(e);else for(const t of e)i+="string"==typeof t?t:String(t)}}return i+=e[t],i}commit(){this.dirty&&(this.dirty=!1,this.element.setAttribute(this.name,this._getValue()))}}class C{constructor(e){this.value=void 0,this.committer=e}setValue(e){e===w||_(e)&&e===this.value||(this.value=e,x(e)||(this.committer.dirty=!0))}commit(){for(;x(this.value);){const e=this.value;this.value=w,e(this)}this.value!==w&&this.committer.commit()}}class U{constructor(e){this.value=void 0,this.__pendingValue=void 0,this.options=e}appendInto(e){this.startNode=e.appendChild(f()),this.endNode=e.appendChild(f())}insertAfterNode(e){this.startNode=e,this.endNode=e.nextSibling}appendIntoPart(e){e.__insert(this.startNode=f()),e.__insert(this.endNode=f())}insertAfterPart(e){e.__insert(this.startNode=f()),this.endNode=e.endNode,e.endNode=this.startNode}setValue(e){this.__pendingValue=e}commit(){if(null===this.startNode.parentNode)return;for(;x(this.__pendingValue);){const e=this.__pendingValue;this.__pendingValue=w,e(this)}const e=this.__pendingValue;e!==w&&(_(e)?e!==this.value&&this.__commitText(e):e instanceof S?this.__commitTemplateResult(e):e instanceof Node?this.__commitNode(e):$(e)?this.__commitIterable(e):e===k?(this.value=k,this.clear()):this.__commitText(e))}__insert(e){this.endNode.parentNode.insertBefore(e,this.endNode)}__commitNode(e){this.value!==e&&(this.clear(),this.__insert(e),this.value=e)}__commitText(e){const t=this.startNode.nextSibling,i="string"==typeof(e=null==e?"":e)?e:String(e);t===this.endNode.previousSibling&&3===t.nodeType?t.data=i:this.__commitNode(document.createTextNode(i)),this.value=e}__commitTemplateResult(e){const t=this.options.templateFactory(e);if(this.value instanceof y&&this.value.template===t)this.value.update(e.values);else{const i=new y(t,e.processor,this.options),a=i._clone();i.update(e.values),this.__commitNode(a),this.value=i}}__commitIterable(e){Array.isArray(this.value)||(this.value=[],this.clear());const t=this.value;let i,a=0;for(const r of e)i=t[a],void 0===i&&(i=new U(this.options),t.push(i),0===a?i.appendIntoPart(this):i.insertAfterPart(t[a-1])),i.setValue(r),i.commit(),a++;a<t.length&&(t.length=a,this.clear(i&&i.endNode))}clear(e=this.startNode){o(this.startNode.parentNode,e.nextSibling,this.endNode)}}class A{constructor(e,t,i){if(this.value=void 0,this.__pendingValue=void 0,2!==i.length||""!==i[0]||""!==i[1])throw new Error("Boolean attributes can only contain a single expression");this.element=e,this.name=t,this.strings=i}setValue(e){this.__pendingValue=e}commit(){for(;x(this.__pendingValue);){const e=this.__pendingValue;this.__pendingValue=w,e(this)}if(this.__pendingValue===w)return;const e=!!this.__pendingValue;this.value!==e&&(e?this.element.setAttribute(this.name,""):this.element.removeAttribute(this.name),this.value=e),this.__pendingValue=w}}class P extends T{constructor(e,t,i){super(e,t,i),this.single=2===i.length&&""===i[0]&&""===i[1]}_createPart(){return new E(this)}_getValue(){return this.single?this.parts[0].value:super._getValue()}commit(){this.dirty&&(this.dirty=!1,this.element[this.name]=this._getValue())}}class E extends C{}let R=!1;(()=>{try{const e={get capture(){return R=!0,!1}};window.addEventListener("test",e,e),window.removeEventListener("test",e,e)}catch(e){}})();class L{constructor(e,t,i){this.value=void 0,this.__pendingValue=void 0,this.element=e,this.eventName=t,this.eventContext=i,this.__boundHandleEvent=e=>this.handleEvent(e)}setValue(e){this.__pendingValue=e}commit(){for(;x(this.__pendingValue);){const e=this.__pendingValue;this.__pendingValue=w,e(this)}if(this.__pendingValue===w)return;const e=this.__pendingValue,t=this.value,i=null==e||null!=t&&(e.capture!==t.capture||e.once!==t.once||e.passive!==t.passive),a=null!=e&&(null==t||i);i&&this.element.removeEventListener(this.eventName,this.__boundHandleEvent,this.__options),a&&(this.__options=j(e),this.element.addEventListener(this.eventName,this.__boundHandleEvent,this.__options)),this.value=e,this.__pendingValue=w}handleEvent(e){"function"==typeof this.value?this.value.call(this.eventContext||this.element,e):this.value.handleEvent(e)}}const j=e=>e&&(R?{capture:e.capture,passive:e.passive,once:e.once}:e.capture)
/** /**
* @license * @license
* Copyright (c) 2017 The Polymer Project Authors. All rights reserved. * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
@@ -80,7 +80,7 @@ const _=e=>null===e||!("object"==typeof e||"function"==typeof e),$=e=>Array.isAr
* Code distributed by Google as part of the polymer project is also * Code distributed by Google as part of the polymer project is also
* subject to an additional IP rights grant found at * subject to an additional IP rights grant found at
* http://polymer.github.io/PATENTS.txt * http://polymer.github.io/PATENTS.txt
*/;function L(e){let t=I.get(e.type);void 0===t&&(t={stringsArray:new WeakMap,keyString:new Map},I.set(e.type,t));let i=t.stringsArray.get(e.strings);if(void 0!==i)return i;const a=e.strings.join(n);return i=t.keyString.get(a),void 0===i&&(i=new d(e,e.getTemplateElement()),t.keyString.set(a,i)),t.stringsArray.set(e.strings,i),i}const I=new Map,G=new WeakMap; */;function N(e){let t=I.get(e.type);void 0===t&&(t={stringsArray:new WeakMap,keyString:new Map},I.set(e.type,t));let i=t.stringsArray.get(e.strings);if(void 0!==i)return i;const a=e.strings.join(n);return i=t.keyString.get(a),void 0===i&&(i=new d(e,e.getTemplateElement()),t.keyString.set(a,i)),t.stringsArray.set(e.strings,i),i}const I=new Map,G=new WeakMap;
/** /**
* @license * @license
* Copyright (c) 2017 The Polymer Project Authors. All rights reserved. * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
@@ -107,7 +107,7 @@ const _=e=>null===e||!("object"==typeof e||"function"==typeof e),$=e=>Array.isAr
* subject to an additional IP rights grant found at * subject to an additional IP rights grant found at
* http://polymer.github.io/PATENTS.txt * http://polymer.github.io/PATENTS.txt
*/ */
class{handleAttributeExpressions(e,t,i,a){const r=t[0];if("."===r){return new A(e,t.slice(1),i).parts}return"@"===r?[new N(e,t.slice(1),a.eventContext)]:"?"===r?[new P(e,t.slice(1),i)]:new T(e,t,i).parts}handleTextExpression(e){return new U(e)}}; class{handleAttributeExpressions(e,t,i,a){const r=t[0];if("."===r){return new P(e,t.slice(1),i).parts}return"@"===r?[new L(e,t.slice(1),a.eventContext)]:"?"===r?[new A(e,t.slice(1),i)]:new T(e,t,i).parts}handleTextExpression(e){return new U(e)}};
/** /**
* @license * @license
* Copyright (c) 2017 The Polymer Project Authors. All rights reserved. * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
@@ -145,7 +145,7 @@ const X="adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.pro
* subject to an additional IP rights grant found at * subject to an additional IP rights grant found at
* http://polymer.github.io/PATENTS.txt * http://polymer.github.io/PATENTS.txt
*/ */
(window.litElementVersions||(window.litElementVersions=[])).push("2.3.1");const te={};class ie extends J{static getStyles(){return this.styles}static _getUniqueStyles(){if(this.hasOwnProperty(JSCompiler_renameProperty("_styles",this)))return;const e=this.getStyles();if(void 0===e)this._styles=[];else if(Array.isArray(e)){const t=(e,i)=>e.reduceRight((e,i)=>Array.isArray(i)?t(i,e):(e.add(i),e),i),i=t(e,new Set),a=[];i.forEach(e=>a.unshift(e)),this._styles=a}else this._styles=[e]}initialize(){super.initialize(),this.constructor._getUniqueStyles(),this.renderRoot=this.createRenderRoot(),window.ShadowRoot&&this.renderRoot instanceof window.ShadowRoot&&this.adoptStyles()}createRenderRoot(){return this.attachShadow({mode:"open"})}adoptStyles(){const e=this.constructor._styles;0!==e.length&&(void 0===window.ShadyCSS||window.ShadyCSS.nativeShadow?X?this.renderRoot.adoptedStyleSheets=e.map(e=>e.styleSheet):this._needsShimAdoptedStyleSheets=!0:window.ShadyCSS.ScopingShim.prepareAdoptedCssText(e.map(e=>e.cssText),this.localName))}connectedCallback(){super.connectedCallback(),this.hasUpdated&&void 0!==window.ShadyCSS&&window.ShadyCSS.styleElement(this)}update(e){const t=this.render();super.update(e),t!==te&&this.constructor.render(t,this.renderRoot,{scopeName:this.localName,eventContext:this}),this._needsShimAdoptedStyleSheets&&(this._needsShimAdoptedStyleSheets=!1,this.constructor._styles.forEach(e=>{const t=document.createElement("style");t.textContent=e.cssText,this.renderRoot.appendChild(t)}))}render(){return te}}ie.finalized=!0,ie.render=(e,t,i)=>{if(!i||"object"!=typeof i||!i.scopeName)throw new Error("The `scopeName` option is required.");const a=i.scopeName,r=G.has(t),n=q&&11===t.nodeType&&!!t.host,s=n&&!H.has(a),l=s?document.createDocumentFragment():t;if(((e,t,i)=>{let a=G.get(t);void 0===a&&(o(t,t.firstChild),G.set(t,a=new U(Object.assign({templateFactory:L},i))),a.appendInto(t)),a.setValue(e),a.commit()})(e,l,Object.assign({templateFactory:B(a)},i)),s){const e=G.get(l);G.delete(l);const i=e.value instanceof y?e.value.template:void 0;F(a,l,i),o(t,t.firstChild),t.appendChild(l),G.set(t,e)}!r&&n&&window.ShadyCSS.styleElement(t.host)}; (window.litElementVersions||(window.litElementVersions=[])).push("2.3.1");const te={};class ie extends J{static getStyles(){return this.styles}static _getUniqueStyles(){if(this.hasOwnProperty(JSCompiler_renameProperty("_styles",this)))return;const e=this.getStyles();if(void 0===e)this._styles=[];else if(Array.isArray(e)){const t=(e,i)=>e.reduceRight((e,i)=>Array.isArray(i)?t(i,e):(e.add(i),e),i),i=t(e,new Set),a=[];i.forEach(e=>a.unshift(e)),this._styles=a}else this._styles=[e]}initialize(){super.initialize(),this.constructor._getUniqueStyles(),this.renderRoot=this.createRenderRoot(),window.ShadowRoot&&this.renderRoot instanceof window.ShadowRoot&&this.adoptStyles()}createRenderRoot(){return this.attachShadow({mode:"open"})}adoptStyles(){const e=this.constructor._styles;0!==e.length&&(void 0===window.ShadyCSS||window.ShadyCSS.nativeShadow?X?this.renderRoot.adoptedStyleSheets=e.map(e=>e.styleSheet):this._needsShimAdoptedStyleSheets=!0:window.ShadyCSS.ScopingShim.prepareAdoptedCssText(e.map(e=>e.cssText),this.localName))}connectedCallback(){super.connectedCallback(),this.hasUpdated&&void 0!==window.ShadyCSS&&window.ShadyCSS.styleElement(this)}update(e){const t=this.render();super.update(e),t!==te&&this.constructor.render(t,this.renderRoot,{scopeName:this.localName,eventContext:this}),this._needsShimAdoptedStyleSheets&&(this._needsShimAdoptedStyleSheets=!1,this.constructor._styles.forEach(e=>{const t=document.createElement("style");t.textContent=e.cssText,this.renderRoot.appendChild(t)}))}render(){return te}}ie.finalized=!0,ie.render=(e,t,i)=>{if(!i||"object"!=typeof i||!i.scopeName)throw new Error("The `scopeName` option is required.");const a=i.scopeName,r=G.has(t),n=q&&11===t.nodeType&&!!t.host,s=n&&!H.has(a),l=s?document.createDocumentFragment():t;if(((e,t,i)=>{let a=G.get(t);void 0===a&&(o(t,t.firstChild),G.set(t,a=new U(Object.assign({templateFactory:N},i))),a.appendInto(t)),a.setValue(e),a.commit()})(e,l,Object.assign({templateFactory:B(a)},i)),s){const e=G.get(l);G.delete(l);const i=e.value instanceof y?e.value.template:void 0;F(a,l,i),o(t,t.firstChild),t.appendChild(l),G.set(t,e)}!r&&n&&window.ShadyCSS.styleElement(t.host)};
/** /**
* @license * @license
* Copyright (c) 2017 The Polymer Project Authors. All rights reserved. * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
@@ -159,7 +159,7 @@ const X="adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.pro
* subject to an additional IP rights grant found at * subject to an additional IP rights grant found at
* http://polymer.github.io/PATENTS.txt * http://polymer.github.io/PATENTS.txt
*/ */
const ae=new WeakMap,re=v(e=>t=>{if(!(t instanceof U))throw new Error("unsafeHTML can only be used in text bindings");const i=ae.get(t);if(void 0!==i&&_(e)&&e===i.value&&t.value===i.fragment)return;const a=document.createElement("template");a.innerHTML=e;const r=document.importNode(a.content,!0);t.setValue(r),ae.set(t,{value:e,fragment:r})}),oe=new WeakMap,ne=v(e=>t=>{if(!(t instanceof U))throw new Error("unsafeSVG can only be used in text bindings");const i=oe.get(t);if(void 0!==i&&_(e)&&e===i.value&&t.value===i.fragment)return;const a=document.createElement("template");a.innerHTML=`<svg>${e}</svg>`;const o=a.content,n=o.firstChild;o.removeChild(n),r(o,n.firstChild);const s=document.importNode(o,!0);t.setValue(s),oe.set(t,{value:e,fragment:s})}),se=new WeakMap,le=v(e=>t=>{if(!(t instanceof C)||t instanceof E||"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 r=se.get(t);void 0===r&&(a.cssText=i.strings.join(" "),se.set(t,r=new Set)),r.forEach(t=>{t in e||(r.delete(t),-1===t.indexOf("-")?a[t]=null:a.removeProperty(t))});for(const t in e)r.add(t),-1===t.indexOf("-")?a[t]=e[t]:a.setProperty(t,e[t])});async function de(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 ce;function be(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&&ce.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)),ue()):-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"))),ue()):he(e,t,i)})).catch((function(e){return fe(t,e)}))}(e,a,i),navigator.serviceWorker.ready.then((function(e){a("ready",e)}))):(he(e,a,i),navigator.serviceWorker.ready.then((function(e){a("ready",e)})))}))}function fe(e,t){navigator.onLine||e("offline"),e("error",t)}function he(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 fe(t,e)}))}function ue(){"serviceWorker"in navigator&&navigator.serviceWorker.ready.then((function(e){e.unregister()}))}"undefined"!=typeof window&&(ce="undefined"!=typeof Promise?new Promise((function(e){return window.addEventListener("load",e)})):{then:function(e){return window.addEventListener("load",e)}});var me=i(70),pe=i.n(me),ge=i(71),ve=i.n(ge),xe=(i(92),i(72)),we=i.n(xe),ke=i(73),ye=i.n(ke),ze=i(74),Se=i.n(ze),_e=i(75),$e=i.n(_e),Te=i(76),Ce=i.n(Te),Ue=i(77),Pe=i.n(Ue),Ae=i(78),Ee=i.n(Ae),Re=i(79),Ne=i.n(Re);const je=(Le=we.a,new Q(String(Le),K));var Le;function Ie(e){return[je,e]}const Ge=new Worker("./sw.js");class Oe extends ie{constructor(){super(),this.sourceUrl=null,this.sourceLoaded=!1,this.showTerms=!1,this.pageParams={}}static get properties(){return{pageParams:{type:Object},sourceUrl:{type:String},navMenuShown:{type:Boolean},showTerms:{type:Boolean},sourceLoaded:{type:Boolean}}}static get styles(){return Ie(ee` const ae=new WeakMap,re=v(e=>t=>{if(!(t instanceof U))throw new Error("unsafeHTML can only be used in text bindings");const i=ae.get(t);if(void 0!==i&&_(e)&&e===i.value&&t.value===i.fragment)return;const a=document.createElement("template");a.innerHTML=e;const r=document.importNode(a.content,!0);t.setValue(r),ae.set(t,{value:e,fragment:r})}),oe=new WeakMap,ne=v(e=>t=>{if(!(t instanceof U))throw new Error("unsafeSVG can only be used in text bindings");const i=oe.get(t);if(void 0!==i&&_(e)&&e===i.value&&t.value===i.fragment)return;const a=document.createElement("template");a.innerHTML=`<svg>${e}</svg>`;const o=a.content,n=o.firstChild;o.removeChild(n),r(o,n.firstChild);const s=document.importNode(o,!0);t.setValue(s),oe.set(t,{value:e,fragment:s})}),se=new WeakMap,le=v(e=>t=>{if(!(t instanceof C)||t instanceof E||"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 r=se.get(t);void 0===r&&(a.cssText=i.strings.join(" "),se.set(t,r=new Set)),r.forEach(t=>{t in e||(r.delete(t),-1===t.indexOf("-")?a[t]=null:a.removeProperty(t))});for(const t in e)r.add(t),-1===t.indexOf("-")?a[t]=e[t]:a.setProperty(t,e[t])});async function de(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 ce;function be(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&&ce.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)),ue()):-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"))),ue()):he(e,t,i)})).catch((function(e){return fe(t,e)}))}(e,a,i),navigator.serviceWorker.ready.then((function(e){a("ready",e)}))):(he(e,a,i),navigator.serviceWorker.ready.then((function(e){a("ready",e)})))}))}function fe(e,t){navigator.onLine||e("offline"),e("error",t)}function he(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 fe(t,e)}))}function ue(){"serviceWorker"in navigator&&navigator.serviceWorker.ready.then((function(e){e.unregister()}))}"undefined"!=typeof window&&(ce="undefined"!=typeof Promise?new Promise((function(e){return window.addEventListener("load",e)})):{then:function(e){return window.addEventListener("load",e)}});var me=i(70),pe=i.n(me),ge=i(71),ve=i.n(ge),xe=(i(92),i(72)),we=i.n(xe),ke=i(73),ye=i.n(ke),ze=i(74),Se=i.n(ze),_e=i(75),$e=i.n(_e),Te=i(76),Ce=i.n(Te),Ue=i(77),Ae=i.n(Ue),Pe=i(78),Ee=i.n(Pe),Re=i(79),Le=i.n(Re);const je=(Ne=we.a,new Q(String(Ne),K));var Ne;function Ie(e){return[je,e]}const Ge=new Worker("./sw.js");class Oe extends ie{constructor(){super(),this.sourceUrl=null,this.sourceLoaded=!1,this.showTerms=!1,this.pageParams={}}static get properties(){return{pageParams:{type:Object},sourceUrl:{type:String},navMenuShown:{type:Boolean},showTerms:{type:Boolean},sourceLoaded:{type:Boolean}}}static get styles(){return Ie(ee`
#logo { #logo {
max-height: 2.5rem; max-height: 2.5rem;
margin-right: 8px; margin-right: 8px;
@@ -232,14 +232,14 @@ const ae=new WeakMap,re=v(e=>t=>{if(!(t instanceof U))throw new Error("unsafeHTM
AND WITHOUT WARRANTY OF ANY KIND, EXPRESS, IMPLIED OR OTHERWISE, AND WITHOUT WARRANTY OF ANY KIND, EXPRESS, IMPLIED OR OTHERWISE,
INCLUDING WITHOUT LIMITATION ANY WARRANTY OF MERCHANTABILITY OR FITNESS FOR A PARTICULAR PURPOSE. INCLUDING WITHOUT LIMITATION ANY WARRANTY OF MERCHANTABILITY OR FITNESS FOR A PARTICULAR PURPOSE.
</p> </p>
<a class="button is-primary" href="#" @click="${e=>this.showTerms=!1}">Close</a> <a class="button is-info" href="#" @click="${e=>this.showTerms=!1}">Close</a>
</div> </div>
</div> </div>
</section> </section>
</div> </div>
<button class="modal-close is-large" aria-label="close"></button> <button class="modal-close is-large" aria-label="close"></button>
</div> </div>
`:""} `}firstUpdated(){this.initRoute()}updated(e){e.has("sourceUrl")&&(this.sourceLoaded=!1)}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)}this.sourceUrl=this.pageParams.get("source")||"",this.pageParams.has("terms")&&(this.showTerms=!0)}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.alreadyLoaded?this.sourceLoaded=!0:(this.initRoute(),e.detail.sourceUrl!==this.sourceUrl&&(this.pageParams.set("source",e.detail.sourceUrl),window.location.search=this.pageParams.toString()))}}class Me extends ie{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(){Ge.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:r}=function(e){let t=e.indexOf("://"),i=0,a="",r="",o="";return t>=0?(a=e.slice(0,t),t+=3):(t++,e.startsWith("//")&&(t+=2)),i=e.indexOf("/",t),i>0?(r=e.slice(t,i),o=e.slice(i)):(r=e.slice(t),o=""),{scheme:a,host:r,path:o}}(e);switch(i){case"googledrive":this.state="googledrive",t=await this.googledriveInit();break;case"s3":e=`https://${a}.s3.amazonaws.com${r}`,t={sourceUrl:e,name:this.sourceUrl};break;case"file":if(!this.loadInfo)return this.state="errored",void(this.error="File URLs are local and can not be shared. You can choose a file to upload from the main page.");t={sourceUrl: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};Ge.postMessage(i)}googledriveInit(){return this._gdWait=new Promise(e=>this._gdResolve=e),this._gdWait}async onLoadReady(e){this._gdResolve&&this._gdResolve(e.detail)}updated(e){this.sourceUrl&&e.has("sourceUrl")&&this.doLoad()}static get styles(){return Ie(ee` `:""} `}firstUpdated(){this.initRoute()}updated(e){e.has("sourceUrl")&&(this.sourceLoaded=!1)}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)}this.sourceUrl=this.pageParams.get("source")||"",this.pageParams.has("terms")&&(this.showTerms=!0)}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.alreadyLoaded?this.sourceLoaded=!0:(this.initRoute(),e.detail.sourceUrl!==this.sourceUrl&&(this.pageParams.set("source",e.detail.sourceUrl),window.location.search=this.pageParams.toString()))}}class Me extends ie{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(){Ge.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:r}=function(e){let t=e.indexOf("://"),i=0,a="",r="",o="";return t>=0?(a=e.slice(0,t),t+=3):(t++,e.startsWith("//")&&(t+=2)),i=e.indexOf("/",t),i>0?(r=e.slice(t,i),o=e.slice(i)):(r=e.slice(t),o=""),{scheme:a,host:r,path:o}}(e);switch(i){case"googledrive":this.state="googledrive",t=await this.googledriveInit();break;case"s3":e=`https://${a}.s3.amazonaws.com${r}`,t={sourceUrl:e,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,extra:{blobUrl: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};Ge.postMessage(i)}googledriveInit(){return this._gdWait=new Promise(e=>this._gdResolve=e),this._gdWait}async onLoadReady(e){this._gdResolve&&this._gdResolve(e.detail)}updated(e){this.sourceUrl&&e.has("sourceUrl")&&this.doLoad()}static get styles(){return Ie(ee`
.logo { .logo {
width: 96px; width: 96px;
height: 96px; height: 96px;
@@ -262,7 +262,7 @@ const ae=new WeakMap,re=v(e=>t=>{if(!(t instanceof U))throw new Error("unsafeHTM
.error { .error {
white-space: pre-wrap; white-space: pre-wrap;
text-align: left; margin-bottom: 2em;
} }
`)}render(){return M` `)}render(){return M`
<section class="container"> <section class="container">
@@ -283,7 +283,11 @@ const ae=new WeakMap,re=v(e=>t=>{if(!(t instanceof U))throw new Error("unsafeHTM
<progress id="progress" class="progress is-primary is-large" <progress id="progress" class="progress is-primary is-large"
value="${this.percent}" max="100"></progress> value="${this.percent}" max="100"></progress>
<label class="progress-label" for="progress">${this.percent}%</label> <label class="progress-label" for="progress">${this.percent}%</label>
</div>`;case"errored":return M`<div class="error has-text-danger">${this.error}</div>`;case"waiting":default:return M`<progress class="progress is-primary is-large" style="max-width: 400px"/>`}}}class De extends ie{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 Ie(ee` </div>`;case"errored":return M`
<div class="has-text-left">
<div class="error has-text-danger">${this.error}</div>
<div><a href="/" class="button is-info">Back</a></div>
</div>`;case"waiting":default:return M`<progress class="progress is-primary is-large" style="max-width: 400px"/>`}}}class De extends ie{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 Ie(ee`
.size { .size {
margin-right: 20px; margin-right: 20px;
} }
@@ -309,6 +313,11 @@ const ae=new WeakMap,re=v(e=>t=>{if(!(t instanceof U))throw new Error("unsafeHTM
nav.main-scroll { nav.main-scroll {
max-height: calc(100vh - 279px); max-height: calc(100vh - 279px);
} }
input.file-name:invalid {
border: 1px dashed red;
}
`)}render(){return M` `)}render(){return M`
<section class="section no-top-padding"> <section class="section no-top-padding">
<div class="container"> <div class="container">
@@ -322,7 +331,7 @@ const ae=new WeakMap,re=v(e=>t=>{if(!(t instanceof U))throw new Error("unsafeHTM
@change=${this.onChooseFile} type="file" id="fileupload" name="fileupload"> @change=${this.onChooseFile} type="file" id="fileupload" name="fileupload">
<span class="file-cta"> <span class="file-cta">
<span class="file-icon"> <span class="file-icon">
<fa-icon size="0.9em" .svg=${Ne.a}></fa-icon> <fa-icon size="0.9em" .svg=${Le.a}></fa-icon>
</span> </span>
<span class="file-label"> <span class="file-label">
Choose File... Choose File...
@@ -330,12 +339,13 @@ const ae=new WeakMap,re=v(e=>t=>{if(!(t instanceof U))throw new Error("unsafeHTM
</span> </span>
<div class="field has-addons"> <div class="field has-addons">
<p class="control is-expanded"> <p class="control is-expanded">
<input style="max-width: 100%" class="file-name input" type="text" <input style="max-width: 100%" class="file-name input" type="url"
name="filename" name="filename"
pattern="^(file|http|https|googledrive|s3):\/\/.*\.(warc|warc.gz|har|zip|waz)$"
.value="${this.fileDisplayName}" .value="${this.fileDisplayName}"
@input="${this.onInput}" @input="${this.onInput}"
autocomplete="off" autocomplete="off"
placeholder="Choose a local file or enter a URL for a (WARC, HAR, WBN, or WAZ) archive"> placeholder="Choose a local file or enter a URL for a (WARC, HAR, WBN, or ZIP) archive">
</p> </p>
<div class="control"> <div class="control">
<button type="submit" class="button is-primary">Load</button> <button type="submit" class="button is-primary">Load</button>
@@ -414,7 +424,7 @@ const ae=new WeakMap,re=v(e=>t=>{if(!(t instanceof U))throw new Error("unsafeHTM
<a @click="${this.onTabClick}" href="#replay" <a @click="${this.onTabClick}" href="#replay"
class="is-size-6 ${"replay"===this.tabData.view?"is-active":""}"> class="is-size-6 ${"replay"===this.tabData.view?"is-active":""}">
<span class="icon"><fa-icon .svg="${Pe.a}"></fa-icon></fa-icon></span>Replay</a> <span class="icon"><fa-icon .svg="${Ae.a}"></fa-icon></fa-icon></span>Replay</a>
</p> </p>
${this.renderCollTabs()} ${this.renderCollTabs()}
</nav>`:M``}renderCollTabs(){return M` </nav>`:M``}renderCollTabs(){return M`
@@ -434,6 +444,7 @@ const ae=new WeakMap,re=v(e=>t=>{if(!(t instanceof U))throw new Error("unsafeHTM
${"replay"===this.tabData.view?M` ${"replay"===this.tabData.view?M`
<wr-replay-page .collInfo="${this.collInfo}" <wr-replay-page .collInfo="${this.collInfo}"
.sourceUrl="${this.sourceUrl}"
url="${this.tabData.url||""}" url="${this.tabData.url||""}"
ts="${this.tabData.ts||""}" ts="${this.tabData.ts||""}"
@coll-tab-nav="${this.onCollTabNav}" id="replay" @coll-tab-nav="${this.onCollTabNav}" id="replay"
@@ -508,7 +519,7 @@ const ae=new WeakMap,re=v(e=>t=>{if(!(t instanceof U))throw new Error("unsafeHTM
</div> </div>
</article> </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.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 r=t.offsetTop,o=t.scrollTop;if(o>this.lastST)for(;a.nextElementSibling&&a.nextElementSibling.getBoundingClientRect().top<r;)a=a.nextElementSibling;else for(;a.previousElementSibling&&a.previousElementSibling.getBoundingClientRect().bottom>=r;)a=a.previousElementSibling;if(this.lastST=o,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 Ve extends ie{constructor(){super(),this.collInfo=null,this.currMime="text/html,text/xhtml",this.urlSearch="",this.urlSearchType="",this.filteredResults=[],this.results=[],this.tryMore=!1,this.loading=!1,this.filters=[{name:"HTML",filter:"text/html,text/xhtml"},{name:"Images",filter:"image/"},{name:"Audio/Video",filter:"audio/,video/"},{name:"PDF",filter:"application/pdf"},{name:"All",filter:""}]}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.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=new URLSearchParams({mime:this.currMime,url:e,prefix:t,count:100}).toString();let a=await fetch(`${this.collInfo.apiPrefix}/urls?${i}`);a=await a.json(),this.results=a.urls,this.tryMore=100===a.urls.length,this.filter();this.urlSearch,this.currMime,this.urlSearchType;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=this.results[this.results.length-1],a=new URLSearchParams({mime:this.currMime,url:e,prefix:t,fromMime:i.mime,fromUrl:i.url,fromTs:new Date(i.date).getTime(),count:100}).toString();let r=await fetch(`${this.collInfo.apiPrefix}/urls?${a}`);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 Ie(ee` `}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 r=t.offsetTop,o=t.scrollTop;if(o>this.lastST)for(;a.nextElementSibling&&a.nextElementSibling.getBoundingClientRect().top<r;)a=a.nextElementSibling;else for(;a.previousElementSibling&&a.previousElementSibling.getBoundingClientRect().bottom>=r;)a=a.previousElementSibling;if(this.lastST=o,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 Ve extends ie{constructor(){super(),this.collInfo=null,this.currMime="text/html,text/xhtml",this.urlSearch="",this.urlSearchType="",this.filteredResults=[],this.results=[],this.tryMore=!1,this.loading=!1,this.filters=[{name:"HTML",filter:"text/html,text/xhtml"},{name:"Images",filter:"image/"},{name:"Audio/Video",filter:"audio/,video/"},{name:"PDF",filter:"application/pdf"},{name:"All",filter:""}]}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.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=new URLSearchParams({mime:this.currMime,url:e,prefix:t,count:100}).toString();let a=await fetch(`${this.collInfo.apiPrefix}/urls?${i}`);a=await a.json(),this.results=a.urls,this.tryMore=100===a.urls.length,this.filter();this.urlSearch,this.currMime,this.urlSearchType;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=this.results[this.results.length-1],a=new URLSearchParams({mime:this.currMime,url:e,prefix:t,fromMime:i.mime,fromUrl:i.url,fromTs:new Date(i.date).getTime(),count:100}).toString();let r=await fetch(`${this.collInfo.apiPrefix}/urls?${a}`);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 Ie(ee`
:host { :host {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@@ -612,7 +623,7 @@ const ae=new WeakMap,re=v(e=>t=>{if(!(t instanceof U))throw new Error("unsafeHTM
</tbody> </tbody>
</table> </table>
</div> </div>
`}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 He extends ie{constructor(){super(),this.isLoading=!1,this.replayUrl="",this.replayTS="",this.url="",this.ts="",this.title="",this.authNeeded=null}static get properties(){return{collInfo:{type:Object},url:{type:String},ts:{type:String},replayUrl:{type:String},replayTS:{type:String},title:{type:String},iframeUrl:{type:String},isLoading:{type:Boolean},authNeeded:{type:Object}}}firstUpdated(){window.addEventListener("message",e=>this.onReplayMessage(e)),navigator.serviceWorker.addEventListener("message",e=>{"authneeded"===e.data.type&&(this.authNeeded=e.data)})}doSetIframeUrl(){this.iframeUrl=this.url?`${this.collInfo.replayPrefix}/${this.ts||""}mp_/${this.url}`:""}updated(e){if(!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}}))}}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 Ie(ee` `}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 He extends ie{constructor(){super(),this.isLoading=!1,this.replayUrl="",this.replayTS="",this.url="",this.ts="",this.title="",this.showAuth=!1}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}}}firstUpdated(){window.addEventListener("message",e=>this.onReplayMessage(e)),navigator.serviceWorker.addEventListener("message",e=>{"authneeded"===e.data.type&&this.collInfo&&e.data.coll===this.collInfo.coll&&(this.showAuth=!0)})}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.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}}))}}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 Ie(ee`
host: { host: {
display: flex; display: flex;
} }
@@ -689,8 +700,8 @@ const ae=new WeakMap,re=v(e=>t=>{if(!(t instanceof U))throw new Error("unsafeHTM
src="${this.iframeUrl}"></iframe> src="${this.iframeUrl}"></iframe>
`:""} `:""}
${this.authNeeded?M` ${this.isAuthable?M`
<div class="modal is-active"> <div class="modal ${this.showAuth?"is-active":""}">
<div class="modal-background"></div> <div class="modal-background"></div>
<div class="modal-card"> <div class="modal-card">
<header class="modal-card-head"> <header class="modal-card-head">
@@ -699,14 +710,14 @@ const ae=new WeakMap,re=v(e=>t=>{if(!(t instanceof U))throw new Error("unsafeHTM
</header> </header>
<section class="modal-card-body"> <section class="modal-card-body">
<div class="container has-text-centered"> <div class="container has-text-centered">
<wr-gdrive .sourceUrl=${this.authNeeded.source} .reauth="${!0}" @load-ready=${this.onReAuthed}/> <wr-gdrive .sourceUrl=${this.sourceUrl} .state="${this.showAuth?"trymanual":"implicitonly"}" .reauth="${!0}" @load-ready=${this.onReAuthed}/>
</div> </div>
</section> </section>
</div> </div>
<button class="modal-close is-large" aria-label="close"></button> <button class="modal-close is-large" aria-label="close"></button>
</div> </div>
`:""} `:""}
`}async onReAuthed(e){if(!this.authNeeded)return;const t=e.detail.headers;await fetch(`/wabac/api/${this.authNeeded.coll}/updateAuth`,{method:"POST",body:JSON.stringify({headers:t})});this.authNeeded=!1,this.onRefresh(null,!0)}}class Fe extends ie{constructor(){super(),this.state="trypublic",this.sourceUrl="",this.scriptLoaded=!1,this.error=!1}static get properties(){return{state:{type:String},sourceUrl:{type:String},error:{type:Boolean},reauth:{type:Boolean}}}updated(e){e.has("sourceUrl")&&(this.error=!1,this.state="trypublic",this.tryPublicAccess().then(e=>{e||(this.state="tryauto",this.requestUpdate())}))}async tryPublicAccess(){try{const e=this.sourceUrl,t="https://gdrive-proxy.webrecorder.workers.dev/g/"+e.slice("googledrive://".length);let i=null;try{i=await fetch(t)}catch(e){return!1}const a=await i.json();if(!a.url||!a.name)return!1;const r=a.url;try{const e=new AbortController,t=e.signal;if(i=await fetch(r,{signal:t}),e.abort(),200!=i.status)return!1}catch(e){return!1}const o=a.name,n="Google Drive file: "+o,s={publicUrl:r},l=Number(a.size);return this.dispatchEvent(new CustomEvent("load-ready",{detail:{name:o,displayName:n,extra:s,size:l,sourceUrl:e}})),!0}catch(e){return!1}}onLoad(){this.scriptLoaded=!0,this.gauth("none",e=>{"immediate_failed"===e.error?this.state="trymanual":this.authed(e)})}onClickAuth(){this.gauth("select_account",e=>{e.error||this.authed(e)})}async authed(e){const t=this.sourceUrl,i="https://www.googleapis.com/drive/v3/files/"+t.slice("googledrive://".length),a={Authorization:"Bearer "+e.access_token},r=await fetch(i+"?fields=name,size",{headers:a});if(404===r.status||403==r.status)return this.state="trymanual",void(this.error=!0);this.error=!1;const o=await r.json(),n=o.name,s=Number(o.size),l="Google Drive file: "+o.name;this.dispatchEvent(new CustomEvent("load-ready",{detail:{sourceUrl:t,headers:a,size:s,name:n,displayName:l}}))}static get styles(){return Ie(ee``)}render(){return M` `}async onReAuthed(e){const t=e.detail.headers;await fetch(`/wabac/api/${this.collInfo.coll}/updateAuth`,{method:"POST",body:JSON.stringify({headers:t})});this.showAuth&&(this.onRefresh(null,!0),this.showAuth=!1)}}class Fe extends ie{constructor(){super(),this.state="trypublic",this.sourceUrl="",this.scriptLoaded=!1,this.error=!1}static get properties(){return{state:{type:String},sourceUrl:{type:String},error:{type:Boolean},reauth:{type:Boolean}}}updated(e){e.has("sourceUrl")&&(this.error=!1,this.state="trypublic",this.tryPublicAccess().then(e=>{e||(this.state="tryauto",this.requestUpdate())}))}async tryPublicAccess(){try{const e=this.sourceUrl,t="https://gdrive-proxy.webrecorder.workers.dev/g/"+e.slice("googledrive://".length);let i=null;try{i=await fetch(t)}catch(e){return!1}const a=await i.json();if(!a.url||!a.name||!a.size)return!1;if(a.size>15e6)return!1;const r=a.url;try{const e=new AbortController,t=e.signal;if(i=await fetch(r,{signal:t}),e.abort(),200!=i.status)return!1}catch(e){return!1}const o=a.name,n="Google Drive file: "+o,s={publicUrl:r},l=Number(a.size);return this.dispatchEvent(new CustomEvent("load-ready",{detail:{name:o,displayName:n,extra:s,size:l,sourceUrl:e}})),!0}catch(e){return!1}}onLoad(){this.scriptLoaded=!0,this.gauth("none",e=>{"immediate_failed"===e.error?"implicitonly"!==this.state&&(this.state="trymanual"):this.authed(e)})}onClickAuth(){this.gauth("select_account",e=>{e.error||this.authed(e)})}async authed(e){const t=this.sourceUrl,i="https://www.googleapis.com/drive/v3/files/"+t.slice("googledrive://".length),a={Authorization:"Bearer "+e.access_token},r=await fetch(i+"?fields=name,size",{headers:a});if(404===r.status||403==r.status)return"implicitonly"!==this.state&&(this.state="trymanual"),void(this.error=!0);this.error=!1;const o=await r.json(),n=o.name,s=Number(o.size),l="Google Drive file: "+o.name;this.dispatchEvent(new CustomEvent("load-ready",{detail:{sourceUrl:t,headers:a,size:s,name:n,displayName:l}}))}static get styles(){return Ie(ee``)}render(){return M`
${this.script()} ${this.script()}
${"trymanual"!==this.state?M` ${"trymanual"!==this.state?M`
<p>Connecting to Google Drive...</p> <p>Connecting to Google Drive...</p>
@@ -718,7 +729,7 @@ const ae=new WeakMap,re=v(e=>t=>{if(!(t instanceof U))throw new Error("unsafeHTM
</div> </div>
<br/> <br/>
`:""} `:""}
<button class="button is-primary is-rounded" @click="${this.onClickAuth}"> <button class="button is-info is-rounded" @click="${this.onClickAuth}">
<span class="icon"><fa-icon .svg="${Ee.a}"></fa-icon></span> <span class="icon"><fa-icon .svg="${Ee.a}"></fa-icon></span>
<span>Authorize Google Drive</span> <span>Authorize Google Drive</span>
</button> </button>
src/frontend.js
+57 -27
View File
@@ -138,7 +138,7 @@ class AppMain extends LitElement
AND WITHOUT WARRANTY OF ANY KIND, EXPRESS, IMPLIED OR OTHERWISE, AND WITHOUT WARRANTY OF ANY KIND, EXPRESS, IMPLIED OR OTHERWISE,
INCLUDING WITHOUT LIMITATION ANY WARRANTY OF MERCHANTABILITY OR FITNESS FOR A PARTICULAR PURPOSE. INCLUDING WITHOUT LIMITATION ANY WARRANTY OF MERCHANTABILITY OR FITNESS FOR A PARTICULAR PURPOSE.
</p> </p>
<a class="button is-primary" href="#" @click="${(e) => this.showTerms = false}">Close</a> <a class="button is-info" href="#" @click="${(e) => this.showTerms = false}">Close</a>
</div> </div>
</div> </div>
</section> </section>
@@ -315,13 +315,15 @@ class WrLoader extends LitElement
case "file": case "file":
if (!this.loadInfo) { if (!this.loadInfo) {
this.state = "errored"; this.state = "errored";
this.error = "File URLs are local and can not be shared. You can choose a file to upload from the main page."; this.error = `\
File URLs can not be entered directly or shared.
You can select a file to upload from the main page by clicking the \'Choose File...\' button.`;
return; return;
} }
source = { source = {
sourceUrl: this.loadInfo.blobUrl, sourceUrl: this.loadInfo.sourceUrl,
//sourceId: this.loadInfo.name, extra: {blobUrl: this.loadInfo.blobUrl},
name: this.loadInfo.name name: this.loadInfo.name
} }
break; break;
@@ -384,7 +386,7 @@ class WrLoader extends LitElement
.error { .error {
white-space: pre-wrap; white-space: pre-wrap;
text-align: left; margin-bottom: 2em;
} }
`); `);
} }
@@ -421,7 +423,11 @@ class WrLoader extends LitElement
</div>`; </div>`;
case "errored": case "errored":
return html`<div class="error has-text-danger">${this.error}</div>`; return html`
<div class="has-text-left">
<div class="error has-text-danger">${this.error}</div>
<div><a href="/" class="button is-info">Back</a></div>
</div>`;
case "waiting": case "waiting":
default: default:
@@ -544,6 +550,11 @@ class WrIndex extends LitElement
nav.main-scroll { nav.main-scroll {
max-height: calc(100vh - 279px); max-height: calc(100vh - 279px);
} }
input.file-name:invalid {
border: 1px dashed red;
}
`); `);
} }
@@ -569,12 +580,13 @@ class WrIndex extends LitElement
</span> </span>
<div class="field has-addons"> <div class="field has-addons">
<p class="control is-expanded"> <p class="control is-expanded">
<input style="max-width: 100%" class="file-name input" type="text" <input style="max-width: 100%" class="file-name input" type="url"
name="filename" name="filename"
pattern="^(file|http|https|googledrive|s3):\/\/.*\.(warc|warc.gz|har|zip|waz)$"
.value="${this.fileDisplayName}" .value="${this.fileDisplayName}"
@input="${this.onInput}" @input="${this.onInput}"
autocomplete="off" autocomplete="off"
placeholder="Choose a local file or enter a URL for a (WARC, HAR, WBN, or WAZ) archive"> placeholder="Choose a local file or enter a URL for a (WARC, HAR, WBN, or ZIP) archive">
</p> </p>
<div class="control"> <div class="control">
<button type="submit" class="button is-primary">Load</button> <button type="submit" class="button is-primary">Load</button>
@@ -835,6 +847,7 @@ class WrColl extends LitElement
${this.tabData.view === 'replay' ? html` ${this.tabData.view === 'replay' ? html`
<wr-replay-page .collInfo="${this.collInfo}" <wr-replay-page .collInfo="${this.collInfo}"
.sourceUrl="${this.sourceUrl}"
url="${this.tabData.url || ""}" url="${this.tabData.url || ""}"
ts="${this.tabData.ts || ""}" ts="${this.tabData.ts || ""}"
@coll-tab-nav="${this.onCollTabNav}" id="replay" @coll-tab-nav="${this.onCollTabNav}" id="replay"
@@ -1006,6 +1019,11 @@ class WrCuratedPages extends LitElement
scrollToList(id) { scrollToList(id) {
this.currList = Number(id); this.currList = Number(id);
// lists are 1 based, 0 is header, 1 is first list
if (this.currList > this.collInfo.lists.length) {
this.currList = 0;
}
this.sendChangeEvent({currList: this.currList || undefined}); this.sendChangeEvent({currList: this.currList || undefined});
const opts = {behavior: "smooth", block: "nearest", inline: "nearest"}; const opts = {behavior: "smooth", block: "nearest", inline: "nearest"};
@@ -1350,12 +1368,13 @@ class WrReplayPage extends LitElement
this.ts = ""; this.ts = "";
this.title = ""; this.title = "";
this.authNeeded = null; this.showAuth = false;
} }
static get properties() { static get properties() {
return { return {
collInfo: {type: Object }, collInfo: {type: Object },
sourceUrl: { type: String },
// external url set by parent // external url set by parent
url: { type: String }, url: { type: String },
@@ -1369,15 +1388,15 @@ class WrReplayPage extends LitElement
iframeUrl: { type: String }, iframeUrl: { type: String },
isLoading: { type: Boolean }, isLoading: { type: Boolean },
authNeeded: { type: Object } showAuth: { type: Boolean }
} }
} }
firstUpdated() { firstUpdated() {
window.addEventListener("message", (event) => this.onReplayMessage(event)); window.addEventListener("message", (event) => this.onReplayMessage(event));
navigator.serviceWorker.addEventListener("message", (event) => { navigator.serviceWorker.addEventListener("message", (event) => {
if (event.data.type === "authneeded") { if (event.data.type === "authneeded" && this.collInfo && event.data.coll === this.collInfo.coll) {
this.authNeeded = event.data; this.showAuth = true;
} }
}); });
} }
@@ -1387,6 +1406,11 @@ class WrReplayPage extends LitElement
} }
updated(changedProperties) { updated(changedProperties) {
if (changedProperties.has("sourceUrl") || changedProperties.has("collInfo")) {
this.isAuthable = (this.sourceUrl.startsWith("googledrive://") &&
this.collInfo && this.collInfo.onDemand);
}
if (this.url && if (this.url &&
((this.replayUrl != this.url) || (this.replayTS != this.ts)) && ((this.replayUrl != this.url) || (this.replayTS != this.ts)) &&
(changedProperties.has("url") || changedProperties.has("ts"))) { (changedProperties.has("url") || changedProperties.has("ts"))) {
@@ -1537,8 +1561,8 @@ class WrReplayPage extends LitElement
src="${this.iframeUrl}"></iframe> src="${this.iframeUrl}"></iframe>
` : ``} ` : ``}
${this.authNeeded ? html` ${this.isAuthable ? html`
<div class="modal is-active"> <div class="modal ${this.showAuth ? 'is-active' : ''}">
<div class="modal-background"></div> <div class="modal-background"></div>
<div class="modal-card"> <div class="modal-card">
<header class="modal-card-head"> <header class="modal-card-head">
@@ -1547,7 +1571,7 @@ class WrReplayPage extends LitElement
</header> </header>
<section class="modal-card-body"> <section class="modal-card-body">
<div class="container has-text-centered"> <div class="container has-text-centered">
<wr-gdrive .sourceUrl=${this.authNeeded.source} .reauth="${true}" @load-ready=${this.onReAuthed}/> <wr-gdrive .sourceUrl=${this.sourceUrl} .state="${this.showAuth ? 'trymanual' : 'implicitonly'}" .reauth="${true}" @load-ready=${this.onReAuthed}/>
</div> </div>
</section> </section>
</div> </div>
@@ -1558,20 +1582,17 @@ class WrReplayPage extends LitElement
} }
async onReAuthed(event) { async onReAuthed(event) {
if (!this.authNeeded) {
return;
}
const headers = event.detail.headers; const headers = event.detail.headers;
const resp = await fetch(`/wabac/api/${this.authNeeded.coll}/updateAuth`, { const resp = await fetch(`/wabac/api/${this.collInfo.coll}/updateAuth`, {
method: 'POST', method: 'POST',
body: JSON.stringify({headers}) body: JSON.stringify({headers})
}); });
this.authNeeded = false; if (this.showAuth) {
this.onRefresh(null, true);
this.onRefresh(null, true); this.showAuth = false;
}
} }
} }
@@ -1621,7 +1642,12 @@ class WrGdrive extends LitElement
return false; return false;
} }
const json = await resp.json(); const json = await resp.json();
if (!json.url || !json.name) { if (!json.url || !json.name || !json.size) {
return false;
}
// only allow for small downloads that will not result in partial download
if (json.size > 15000000) {
return false; return false;
} }
@@ -1656,7 +1682,9 @@ class WrGdrive extends LitElement
this.scriptLoaded = true; this.scriptLoaded = true;
this.gauth('none', (response) => { this.gauth('none', (response) => {
if (response.error === "immediate_failed") { if (response.error === "immediate_failed") {
this.state = "trymanual"; if (this.state !== "implicitonly") {
this.state = "trymanual";
}
} else { } else {
this.authed(response); this.authed(response);
} }
@@ -1681,7 +1709,9 @@ class WrGdrive extends LitElement
const resp = await fetch(metadataUrl + "?fields=name,size", {headers}); const resp = await fetch(metadataUrl + "?fields=name,size", {headers});
if ((resp.status === 404 || resp.status == 403)) { if ((resp.status === 404 || resp.status == 403)) {
this.state = "trymanual"; if (this.state !== "implicitonly") {
this.state = "trymanual";
}
this.error = true; this.error = true;
return; return;
} }
@@ -1714,7 +1744,7 @@ class WrGdrive extends LitElement
</div> </div>
<br/> <br/>
` : ``} ` : ``}
<button class="button is-primary is-rounded" @click="${this.onClickAuth}"> <button class="button is-info is-rounded" @click="${this.onClickAuth}">
<span class="icon"><fa-icon .svg="${fabGoogleDrive}"></fa-icon></span> <span class="icon"><fa-icon .svg="${fabGoogleDrive}"></fa-icon></span>
<span>Authorize Google Drive</span> <span>Authorize Google Drive</span>
</button> </button>
sw.js
+2 -2
View File
File diff suppressed because one or more lines are too long