diff --git a/package.json b/package.json index 40d6936..e584804 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "replaywebpage", "productName": "ReplayWeb.page", - "version": "1.0.1-alpha.0", + "version": "1.0.1", "description": "Serverless Web Archive Replay", "repository": "https://github.com/webrecorder/replayweb.page", "homepage": "https://replayweb.page/", diff --git a/src/replay.js b/src/replay.js index 89e2af5..70a0226 100644 --- a/src/replay.js +++ b/src/replay.js @@ -1,5 +1,5 @@ import { LitElement, html, css } from 'lit-element'; -import { wrapCss } from './misc'; +import { wrapCss, rwpLogo } from './misc'; import { tsToDate } from './pageutils'; @@ -253,9 +253,25 @@ class Replay extends LitElement z-index: 10; background: linear-gradient(90deg, rgba(255, 255, 255, 0), #FFF 15%, #FFF); margin: -35px 0 0 0px; + padding-left: 3em; line-height: 2; } + .menu-head { + font-size: 10px; + font-weight: bold; + display: block; + } + .menu-logo { + vertical-align: middle; + } + .menu-version { + font-size: 10px; + } + .dropdown-item.info { + font-style: italic; + } + input:focus + #datetime { display: none; } @@ -284,6 +300,8 @@ class Replay extends LitElement } render() { + const dateStr = tsToDate(this.replayTS).toLocaleString(); + return html` ${this.embed !== "replayonly" ? html`
@@ -305,7 +323,7 @@ class Replay extends LitElement ` : ``} -
- -

${tsToDate(this.replayTS).toLocaleString()}

+ +

${dateStr}

@@ -350,9 +368,7 @@ class Replay extends LitElement ` : ``} - ${!this.isLoading ? html` - ` : ``} Reload @@ -361,6 +377,18 @@ class Replay extends LitElement Purge Cache + Full Reload ` : ``} +
+
+ Capture Date${dateStr} +
+ ${this.embed ? html` +
+ + +  About ReplayWeb.page + (${__VERSION__}) + + ` : ``}
@@ -402,6 +430,12 @@ class Replay extends LitElement `; } + onKeyDown(event) { + if (event.key === "Esc" || event.key === "Escape") { + event.target.value = this.replayUrl; + } + } + onMenu(event) { event.stopPropagation(); this.menuActive = !this.menuActive; diff --git a/ui.js b/ui.js index 6329b85..0b15e5e 100644 --- a/ui.js +++ b/ui.js @@ -81,7 +81,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 * subject to an additional IP rights grant found at * http://polymer.github.io/PATENTS.txt - */;function j(e){let t=D.get(e.type);void 0===t&&(t={stringsArray:new WeakMap,keyString:new Map},D.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 c(e,e.getTemplateElement()),t.keyString.set(a,i)),t.stringsArray.set(e.strings,i),i}const D=new Map,N=new WeakMap; + */;function D(e){let t=j.get(e.type);void 0===t&&(t={stringsArray:new WeakMap,keyString:new Map},j.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 c(e,e.getTemplateElement()),t.keyString.set(a,i)),t.stringsArray.set(e.strings,i),i}const j=new Map,N=new WeakMap; /** * @license * Copyright (c) 2017 The Polymer Project Authors. All rights reserved. @@ -121,7 +121,7 @@ class{handleAttributeExpressions(e,t,i,a){const o=t[0];if("."===o){return new A( * 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 - */"undefined"!=typeof window&&(window.litHtmlVersions||(window.litHtmlVersions=[])).push("1.2.1");const q=(e,...t)=>new S(e,t,"html",M),O=(e,t)=>`${e}--${t}`;let G=!0;void 0===window.ShadyCSS?G=!1:void 0===window.ShadyCSS.prepareTemplateDom&&(console.warn("Incompatible ShadyCSS version detected. Please update to at least @webcomponents/webcomponentsjs@2.0.2 and @webcomponents/shadycss@1.3.1."),G=!1);const B=e=>t=>{const i=O(t.type,e);let a=D.get(i);void 0===a&&(a={stringsArray:new WeakMap,keyString:new Map},D.set(i,a));let o=a.stringsArray.get(t.strings);if(void 0!==o)return o;const r=t.strings.join(n);if(o=a.keyString.get(r),void 0===o){const i=t.getTemplateElement();G&&window.ShadyCSS.prepareTemplateDom(i,e),o=new c(t,i),a.keyString.set(r,o)}return a.stringsArray.set(t.strings,o),o},H=["html","svg"],F=new Set,W=(e,t,i)=>{F.add(e);const a=i?i.element:document.createElement("template"),o=t.querySelectorAll("style"),{length:r}=o;if(0===r)return void window.ShadyCSS.prepareTemplateStyles(a,e);const n=document.createElement("style");for(let e=0;e{H.forEach(t=>{const i=D.get(O(t,e));void 0!==i&&i.keyString.forEach(e=>{const{element:{content:t}}=e,i=new Set;Array.from(t.querySelectorAll("style")).forEach(e=>{i.add(e)}),u(e,i)})})})(e);const s=a.content;i?function(e,t,i=null){const{element:{content:a},parts:o}=e;if(null==i)return void a.appendChild(t);const r=document.createTreeWalker(a,133,null,!1);let n=m(o),s=0,l=-1;for(;r.nextNode();){for(l++,r.currentNode===i&&(s=p(t),i.parentNode.insertBefore(t,i));-1!==n&&o[n].index===l;){if(s>0){for(;-1!==n;)o[n].index+=s,n=m(o,n);return}n=m(o,n)}}}(i,n,s.firstChild):s.insertBefore(n,s.firstChild),window.ShadyCSS.prepareTemplateStyles(a,e);const l=s.querySelector("style");if(window.ShadyCSS.nativeShadow&&null!==l)t.insertBefore(l.cloneNode(!0),t.firstChild);else if(i){s.insertBefore(n,s.firstChild);const e=new Set;e.add(n),u(i,e)}};window.JSCompiler_renameProperty=(e,t)=>e;const V={toAttribute(e,t){switch(t){case Boolean:return e?"":null;case Object:case Array:return null==e?e:JSON.stringify(e)}return e},fromAttribute(e,t){switch(t){case Boolean:return null!==e;case Number:return null===e?null:Number(e);case Object:case Array:return JSON.parse(e)}return e}},K=(e,t)=>t!==e&&(t==t||e==e),Z={attribute:!0,type:String,converter:V,reflect:!1,hasChanged:K};class Y extends HTMLElement{constructor(){super(),this._updateState=0,this._instanceProperties=void 0,this._updatePromise=new Promise(e=>this._enableUpdatingResolver=e),this._changedProperties=new Map,this._reflectingProperties=void 0,this.initialize()}static get observedAttributes(){this.finalize();const e=[];return this._classProperties.forEach((t,i)=>{const a=this._attributeNameForProperty(i,t);void 0!==a&&(this._attributeToPropertyMap.set(a,i),e.push(a))}),e}static _ensureClassProperties(){if(!this.hasOwnProperty(JSCompiler_renameProperty("_classProperties",this))){this._classProperties=new Map;const e=Object.getPrototypeOf(this)._classProperties;void 0!==e&&e.forEach((e,t)=>this._classProperties.set(t,e))}}static createProperty(e,t=Z){if(this._ensureClassProperties(),this._classProperties.set(e,t),t.noAccessor||this.prototype.hasOwnProperty(e))return;const i="symbol"==typeof e?Symbol():"__"+e,a=this.getPropertyDescriptor(e,i,t);void 0!==a&&Object.defineProperty(this.prototype,e,a)}static getPropertyDescriptor(e,t,i){return{get(){return this[t]},set(i){const a=this[e];this[t]=i,this._requestUpdate(e,a)},configurable:!0,enumerable:!0}}static getPropertyOptions(e){return this._classProperties&&this._classProperties.get(e)||Z}static finalize(){const e=Object.getPrototypeOf(this);if(e.hasOwnProperty("finalized")||e.finalize(),this.finalized=!0,this._ensureClassProperties(),this._attributeToPropertyMap=new Map,this.hasOwnProperty(JSCompiler_renameProperty("properties",this))){const e=this.properties,t=[...Object.getOwnPropertyNames(e),..."function"==typeof Object.getOwnPropertySymbols?Object.getOwnPropertySymbols(e):[]];for(const i of t)this.createProperty(i,e[i])}}static _attributeNameForProperty(e,t){const i=t.attribute;return!1===i?void 0:"string"==typeof i?i:"string"==typeof e?e.toLowerCase():void 0}static _valueHasChanged(e,t,i=K){return i(e,t)}static _propertyValueFromAttribute(e,t){const i=t.type,a=t.converter||V,o="function"==typeof a?a:a.fromAttribute;return o?o(e,i):e}static _propertyValueToAttribute(e,t){if(void 0===t.reflect)return;const i=t.type,a=t.converter;return(a&&a.toAttribute||V.toAttribute)(e,i)}initialize(){this._saveInstanceProperties(),this._requestUpdate()}_saveInstanceProperties(){this.constructor._classProperties.forEach((e,t)=>{if(this.hasOwnProperty(t)){const e=this[t];delete this[t],this._instanceProperties||(this._instanceProperties=new Map),this._instanceProperties.set(t,e)}})}_applyInstanceProperties(){this._instanceProperties.forEach((e,t)=>this[t]=e),this._instanceProperties=void 0}connectedCallback(){this.enableUpdating()}enableUpdating(){void 0!==this._enableUpdatingResolver&&(this._enableUpdatingResolver(),this._enableUpdatingResolver=void 0)}disconnectedCallback(){}attributeChangedCallback(e,t,i){t!==i&&this._attributeToProperty(e,i)}_propertyToAttribute(e,t,i=Z){const a=this.constructor,o=a._attributeNameForProperty(e,i);if(void 0!==o){const e=a._propertyValueToAttribute(t,i);if(void 0===e)return;this._updateState=8|this._updateState,null==e?this.removeAttribute(o):this.setAttribute(o,e),this._updateState=-9&this._updateState}}_attributeToProperty(e,t){if(8&this._updateState)return;const i=this.constructor,a=i._attributeToPropertyMap.get(e);if(void 0!==a){const e=i.getPropertyOptions(a);this._updateState=16|this._updateState,this[a]=i._propertyValueFromAttribute(t,e),this._updateState=-17&this._updateState}}_requestUpdate(e,t){let i=!0;if(void 0!==e){const a=this.constructor,o=a.getPropertyOptions(e);a._valueHasChanged(this[e],t,o.hasChanged)?(this._changedProperties.has(e)||this._changedProperties.set(e,t),!0!==o.reflect||16&this._updateState||(void 0===this._reflectingProperties&&(this._reflectingProperties=new Map),this._reflectingProperties.set(e,o))):i=!1}!this._hasRequestedUpdate&&i&&(this._updatePromise=this._enqueueUpdate())}requestUpdate(e,t){return this._requestUpdate(e,t),this.updateComplete}async _enqueueUpdate(){this._updateState=4|this._updateState;try{await this._updatePromise}catch(e){}const e=this.performUpdate();return null!=e&&await e,!this._hasRequestedUpdate}get _hasRequestedUpdate(){return 4&this._updateState}get hasUpdated(){return 1&this._updateState}performUpdate(){this._instanceProperties&&this._applyInstanceProperties();let e=!1;const t=this._changedProperties;try{e=this.shouldUpdate(t),e?this.update(t):this._markUpdated()}catch(t){throw e=!1,this._markUpdated(),t}e&&(1&this._updateState||(this._updateState=1|this._updateState,this.firstUpdated(t)),this.updated(t))}_markUpdated(){this._changedProperties=new Map,this._updateState=-5&this._updateState}get updateComplete(){return this._getUpdateComplete()}_getUpdateComplete(){return this._updatePromise}shouldUpdate(e){return!0}update(e){void 0!==this._reflectingProperties&&this._reflectingProperties.size>0&&(this._reflectingProperties.forEach((e,t)=>this._propertyToAttribute(t,this[t],e)),this._reflectingProperties=void 0),this._markUpdated()}updated(e){}firstUpdated(e){}}Y.finalized=!0; + */"undefined"!=typeof window&&(window.litHtmlVersions||(window.litHtmlVersions=[])).push("1.2.1");const q=(e,...t)=>new S(e,t,"html",M),O=(e,t)=>`${e}--${t}`;let G=!0;void 0===window.ShadyCSS?G=!1:void 0===window.ShadyCSS.prepareTemplateDom&&(console.warn("Incompatible ShadyCSS version detected. Please update to at least @webcomponents/webcomponentsjs@2.0.2 and @webcomponents/shadycss@1.3.1."),G=!1);const B=e=>t=>{const i=O(t.type,e);let a=j.get(i);void 0===a&&(a={stringsArray:new WeakMap,keyString:new Map},j.set(i,a));let o=a.stringsArray.get(t.strings);if(void 0!==o)return o;const r=t.strings.join(n);if(o=a.keyString.get(r),void 0===o){const i=t.getTemplateElement();G&&window.ShadyCSS.prepareTemplateDom(i,e),o=new c(t,i),a.keyString.set(r,o)}return a.stringsArray.set(t.strings,o),o},H=["html","svg"],F=new Set,W=(e,t,i)=>{F.add(e);const a=i?i.element:document.createElement("template"),o=t.querySelectorAll("style"),{length:r}=o;if(0===r)return void window.ShadyCSS.prepareTemplateStyles(a,e);const n=document.createElement("style");for(let e=0;e{H.forEach(t=>{const i=j.get(O(t,e));void 0!==i&&i.keyString.forEach(e=>{const{element:{content:t}}=e,i=new Set;Array.from(t.querySelectorAll("style")).forEach(e=>{i.add(e)}),u(e,i)})})})(e);const s=a.content;i?function(e,t,i=null){const{element:{content:a},parts:o}=e;if(null==i)return void a.appendChild(t);const r=document.createTreeWalker(a,133,null,!1);let n=m(o),s=0,l=-1;for(;r.nextNode();){for(l++,r.currentNode===i&&(s=p(t),i.parentNode.insertBefore(t,i));-1!==n&&o[n].index===l;){if(s>0){for(;-1!==n;)o[n].index+=s,n=m(o,n);return}n=m(o,n)}}}(i,n,s.firstChild):s.insertBefore(n,s.firstChild),window.ShadyCSS.prepareTemplateStyles(a,e);const l=s.querySelector("style");if(window.ShadyCSS.nativeShadow&&null!==l)t.insertBefore(l.cloneNode(!0),t.firstChild);else if(i){s.insertBefore(n,s.firstChild);const e=new Set;e.add(n),u(i,e)}};window.JSCompiler_renameProperty=(e,t)=>e;const V={toAttribute(e,t){switch(t){case Boolean:return e?"":null;case Object:case Array:return null==e?e:JSON.stringify(e)}return e},fromAttribute(e,t){switch(t){case Boolean:return null!==e;case Number:return null===e?null:Number(e);case Object:case Array:return JSON.parse(e)}return e}},K=(e,t)=>t!==e&&(t==t||e==e),Z={attribute:!0,type:String,converter:V,reflect:!1,hasChanged:K};class Y extends HTMLElement{constructor(){super(),this._updateState=0,this._instanceProperties=void 0,this._updatePromise=new Promise(e=>this._enableUpdatingResolver=e),this._changedProperties=new Map,this._reflectingProperties=void 0,this.initialize()}static get observedAttributes(){this.finalize();const e=[];return this._classProperties.forEach((t,i)=>{const a=this._attributeNameForProperty(i,t);void 0!==a&&(this._attributeToPropertyMap.set(a,i),e.push(a))}),e}static _ensureClassProperties(){if(!this.hasOwnProperty(JSCompiler_renameProperty("_classProperties",this))){this._classProperties=new Map;const e=Object.getPrototypeOf(this)._classProperties;void 0!==e&&e.forEach((e,t)=>this._classProperties.set(t,e))}}static createProperty(e,t=Z){if(this._ensureClassProperties(),this._classProperties.set(e,t),t.noAccessor||this.prototype.hasOwnProperty(e))return;const i="symbol"==typeof e?Symbol():"__"+e,a=this.getPropertyDescriptor(e,i,t);void 0!==a&&Object.defineProperty(this.prototype,e,a)}static getPropertyDescriptor(e,t,i){return{get(){return this[t]},set(i){const a=this[e];this[t]=i,this._requestUpdate(e,a)},configurable:!0,enumerable:!0}}static getPropertyOptions(e){return this._classProperties&&this._classProperties.get(e)||Z}static finalize(){const e=Object.getPrototypeOf(this);if(e.hasOwnProperty("finalized")||e.finalize(),this.finalized=!0,this._ensureClassProperties(),this._attributeToPropertyMap=new Map,this.hasOwnProperty(JSCompiler_renameProperty("properties",this))){const e=this.properties,t=[...Object.getOwnPropertyNames(e),..."function"==typeof Object.getOwnPropertySymbols?Object.getOwnPropertySymbols(e):[]];for(const i of t)this.createProperty(i,e[i])}}static _attributeNameForProperty(e,t){const i=t.attribute;return!1===i?void 0:"string"==typeof i?i:"string"==typeof e?e.toLowerCase():void 0}static _valueHasChanged(e,t,i=K){return i(e,t)}static _propertyValueFromAttribute(e,t){const i=t.type,a=t.converter||V,o="function"==typeof a?a:a.fromAttribute;return o?o(e,i):e}static _propertyValueToAttribute(e,t){if(void 0===t.reflect)return;const i=t.type,a=t.converter;return(a&&a.toAttribute||V.toAttribute)(e,i)}initialize(){this._saveInstanceProperties(),this._requestUpdate()}_saveInstanceProperties(){this.constructor._classProperties.forEach((e,t)=>{if(this.hasOwnProperty(t)){const e=this[t];delete this[t],this._instanceProperties||(this._instanceProperties=new Map),this._instanceProperties.set(t,e)}})}_applyInstanceProperties(){this._instanceProperties.forEach((e,t)=>this[t]=e),this._instanceProperties=void 0}connectedCallback(){this.enableUpdating()}enableUpdating(){void 0!==this._enableUpdatingResolver&&(this._enableUpdatingResolver(),this._enableUpdatingResolver=void 0)}disconnectedCallback(){}attributeChangedCallback(e,t,i){t!==i&&this._attributeToProperty(e,i)}_propertyToAttribute(e,t,i=Z){const a=this.constructor,o=a._attributeNameForProperty(e,i);if(void 0!==o){const e=a._propertyValueToAttribute(t,i);if(void 0===e)return;this._updateState=8|this._updateState,null==e?this.removeAttribute(o):this.setAttribute(o,e),this._updateState=-9&this._updateState}}_attributeToProperty(e,t){if(8&this._updateState)return;const i=this.constructor,a=i._attributeToPropertyMap.get(e);if(void 0!==a){const e=i.getPropertyOptions(a);this._updateState=16|this._updateState,this[a]=i._propertyValueFromAttribute(t,e),this._updateState=-17&this._updateState}}_requestUpdate(e,t){let i=!0;if(void 0!==e){const a=this.constructor,o=a.getPropertyOptions(e);a._valueHasChanged(this[e],t,o.hasChanged)?(this._changedProperties.has(e)||this._changedProperties.set(e,t),!0!==o.reflect||16&this._updateState||(void 0===this._reflectingProperties&&(this._reflectingProperties=new Map),this._reflectingProperties.set(e,o))):i=!1}!this._hasRequestedUpdate&&i&&(this._updatePromise=this._enqueueUpdate())}requestUpdate(e,t){return this._requestUpdate(e,t),this.updateComplete}async _enqueueUpdate(){this._updateState=4|this._updateState;try{await this._updatePromise}catch(e){}const e=this.performUpdate();return null!=e&&await e,!this._hasRequestedUpdate}get _hasRequestedUpdate(){return 4&this._updateState}get hasUpdated(){return 1&this._updateState}performUpdate(){this._instanceProperties&&this._applyInstanceProperties();let e=!1;const t=this._changedProperties;try{e=this.shouldUpdate(t),e?this.update(t):this._markUpdated()}catch(t){throw e=!1,this._markUpdated(),t}e&&(1&this._updateState||(this._updateState=1|this._updateState,this.firstUpdated(t)),this.updated(t))}_markUpdated(){this._changedProperties=new Map,this._updateState=-5&this._updateState}get updateComplete(){return this._getUpdateComplete()}_getUpdateComplete(){return this._updatePromise}shouldUpdate(e){return!0}update(e){void 0!==this._reflectingProperties&&this._reflectingProperties.size>0&&(this._reflectingProperties.forEach((e,t)=>this._propertyToAttribute(t,this[t],e)),this._reflectingProperties=void 0),this._markUpdated()}updated(e){}firstUpdated(e){}}Y.finalized=!0; /** @license Copyright (c) 2019 The Polymer Project Authors. All rights reserved. @@ -146,7 +146,7 @@ const J="adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.pro * subject to an additional IP rights grant found at * http://polymer.github.io/PATENTS.txt */ -(window.litElementVersions||(window.litElementVersions=[])).push("2.3.1");const te={};class ie extends Y{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?J?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,o=N.has(t),n=G&&11===t.nodeType&&!!t.host,s=n&&!F.has(a),l=s?document.createDocumentFragment():t;if(((e,t,i)=>{let a=N.get(t);void 0===a&&(r(t,t.firstChild),N.set(t,a=new T(Object.assign({templateFactory:j},i))),a.appendInto(t)),a.setValue(e),a.commit()})(e,l,Object.assign({templateFactory:B(a)},i)),s){const e=N.get(l);N.delete(l);const i=e.value instanceof y?e.value.template:void 0;W(a,l,i),r(t,t.firstChild),t.appendChild(l),N.set(t,e)}!o&&n&&window.ShadyCSS.styleElement(t.host)}; +(window.litElementVersions||(window.litElementVersions=[])).push("2.3.1");const te={};class ie extends Y{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?J?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,o=N.has(t),n=G&&11===t.nodeType&&!!t.host,s=n&&!F.has(a),l=s?document.createDocumentFragment():t;if(((e,t,i)=>{let a=N.get(t);void 0===a&&(r(t,t.firstChild),N.set(t,a=new T(Object.assign({templateFactory:D},i))),a.appendInto(t)),a.setValue(e),a.commit()})(e,l,Object.assign({templateFactory:B(a)},i)),s){const e=N.get(l);N.delete(l);const i=e.value instanceof y?e.value.template:void 0;W(a,l,i),r(t,t.firstChild),t.appendChild(l),N.set(t,e)}!o&&n&&window.ShadyCSS.styleElement(t.host)}; /** * @license * Copyright (c) 2017 The Polymer Project Authors. All rights reserved. @@ -319,7 +319,7 @@ const ae=new WeakMap,oe=v(e=>t=>{if(!(t instanceof T))throw new Error("unsafeSVG
- ReplayWeb.page Version: ${"1.0.1-alpha.0"} + ReplayWeb.page Version: ${"1.0.1"}
@@ -386,7 +386,7 @@ const ae=new WeakMap,oe=v(e=>t=>{if(!(t instanceof T))throw new Error("unsafeSVG - `:""} `:q``}firstUpdated(){this.initRoute(),window.addEventListener("popstate",e=>{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(e){e.stopPropagation(),this.navMenuShown=!this.navMenuShown,this.navMenuShown&&document.addEventListener("click",()=>{this.navMenuShown=!1},{once:!0})}initRoute(){this.inited=!0,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.get("config")){this.loadInfo||(this.loadInfo={});try{this.loadInfo.extraConfig=JSON.parse(this.pageParams.get("config"))}catch(e){console.log("invalid config: "+e)}}this.pageParams.get("basePageUrl")&&(this.loadInfo||(this.loadInfo={extraConfig:{}}),this.loadInfo.extraConfig||(this.loadInfo.extraConfig={}),this.loadInfo.extraConfig.baseUrl=this.pageParams.get("basePageUrl")),this.pageParams.get("customColl")&&(this.loadInfo||(this.loadInfo={}),this.loadInfo.customColl=this.pageParams.get("customColl"))}onStartLoad(e){if(this.pageParams.set("source",e.detail.sourceUrl),e.detail.isFile){{const e=new URL(window.location.href);e.search=this.pageParams.toString(),window.history.pushState({},"",e.toString())}this.sourceUrl=e.detail.sourceUrl,this.loadInfo=e.detail}else window.location.search=this.pageParams.toString()}onCollLoaded(e){this.loadInfo=null,e.detail.collInfo&&(this.collInfo=e.detail.collInfo),e.detail.alreadyLoaded||e.detail.sourceUrl!==this.sourceUrl&&(this.pageParams.set("source",e.detail.sourceUrl),window.location.search=this.pageParams.toString())}});var je=i(94),De=i.n(je);customElements.define("wr-chooser",class extends ie{constructor(){super(),this.fileDisplayName="",this.file=null}onChooseFile(e){0!==e.currentTarget.files.length&&(this.file=e.currentTarget.files[0],this.fileDisplayName="file://"+(this.file.path||this.file.name),this.requestUpdate())}onStartLoad(e){e.preventDefault();const t={sourceUrl:this.fileDisplayName};if(this.file){if(t.isFile=!0,this.file.path){const e=new URL("http://files.replayweb.page/");e.searchParams.set("filename",this.file.path),t.loadUrl=e.href}else t.loadUrl=URL.createObjectURL(this.file),t.blob=this.file;t.size=this.file.size,t.noCache=void 0!==this.file.path,t.name=this.fileDisplayName}return 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 be(ee` + `:""} `:q``}firstUpdated(){this.initRoute(),window.addEventListener("popstate",e=>{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(e){e.stopPropagation(),this.navMenuShown=!this.navMenuShown,this.navMenuShown&&document.addEventListener("click",()=>{this.navMenuShown=!1},{once:!0})}initRoute(){this.inited=!0,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.get("config")){this.loadInfo||(this.loadInfo={});try{this.loadInfo.extraConfig=JSON.parse(this.pageParams.get("config"))}catch(e){console.log("invalid config: "+e)}}this.pageParams.get("basePageUrl")&&(this.loadInfo||(this.loadInfo={extraConfig:{}}),this.loadInfo.extraConfig||(this.loadInfo.extraConfig={}),this.loadInfo.extraConfig.baseUrl=this.pageParams.get("basePageUrl")),this.pageParams.get("customColl")&&(this.loadInfo||(this.loadInfo={}),this.loadInfo.customColl=this.pageParams.get("customColl"))}onStartLoad(e){if(this.pageParams.set("source",e.detail.sourceUrl),e.detail.isFile){{const e=new URL(window.location.href);e.search=this.pageParams.toString(),window.history.pushState({},"",e.toString())}this.sourceUrl=e.detail.sourceUrl,this.loadInfo=e.detail}else window.location.search=this.pageParams.toString()}onCollLoaded(e){this.loadInfo=null,e.detail.collInfo&&(this.collInfo=e.detail.collInfo),e.detail.alreadyLoaded||e.detail.sourceUrl!==this.sourceUrl&&(this.pageParams.set("source",e.detail.sourceUrl),window.location.search=this.pageParams.toString())}});var De=i(94),je=i.n(De);customElements.define("wr-chooser",class extends ie{constructor(){super(),this.fileDisplayName="",this.file=null}onChooseFile(e){0!==e.currentTarget.files.length&&(this.file=e.currentTarget.files[0],this.fileDisplayName="file://"+(this.file.path||this.file.name),this.requestUpdate())}onStartLoad(e){e.preventDefault();const t={sourceUrl:this.fileDisplayName};if(this.file){if(t.isFile=!0,this.file.path){const e=new URL("http://files.replayweb.page/");e.searchParams.set("filename",this.file.path),t.loadUrl=e.href}else t.loadUrl=URL.createObjectURL(this.file),t.blob=this.file;t.size=this.file.size,t.noCache=void 0!==this.file.path,t.name=this.fileDisplayName}return 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 be(ee` .extra-padding { padding: 2em; } @@ -436,7 +436,7 @@ const ae=new WeakMap,oe=v(e=>t=>{if(!(t instanceof T))throw new Error("unsafeSVG @change=${this.onChooseFile} type="file" id="fileupload" name="fileupload"> - + Choose File... @@ -1333,9 +1333,25 @@ const tt=new WeakMap,it=v(e=>t=>{if(!(t instanceof T))throw new Error("unsafeHTM z-index: 10; background: linear-gradient(90deg, rgba(255, 255, 255, 0), #FFF 15%, #FFF); margin: -35px 0 0 0px; + padding-left: 3em; line-height: 2; } + .menu-head { + font-size: 10px; + font-weight: bold; + display: block; + } + .menu-logo { + vertical-align: middle; + } + .menu-version { + font-size: 10px; + } + .dropdown-item.info { + font-style: italic; + } + input:focus + #datetime { display: none; } @@ -1360,7 +1376,7 @@ const tt=new WeakMap,it=v(e=>t=>{if(!(t instanceof T))throw new Error("unsafeHTM width: 100%; } - `)}render(){return q` + `)}render(){const e=function(e){if(!e)return"";e.length<14&&(e+="00000000000000".substr(e.length));const t=e.substring(0,4)+"-"+e.substring(4,6)+"-"+e.substring(6,8)+"T"+e.substring(8,10)+":"+e.substring(10,12)+":"+e.substring(12,14)+"-00:00";return new Date(t)}(this.replayTS).toLocaleString();return q` ${"replayonly"!==this.embed?q`
@@ -1381,7 +1397,7 @@ const tt=new WeakMap,it=v(e=>t=>{if(!(t instanceof T))throw new Error("unsafeHTM `:""} -
- -

${function(e){if(!e)return"";e.length<14&&(e+="00000000000000".substr(e.length));const t=e.substring(0,4)+"-"+e.substring(4,6)+"-"+e.substring(6,8)+"T"+e.substring(8,10)+":"+e.substring(10,12)+":"+e.substring(12,14)+"-00:00";return new Date(t)}(this.replayTS).toLocaleString()}

+ +

${e}

@@ -1426,9 +1442,7 @@ const tt=new WeakMap,it=v(e=>t=>{if(!(t instanceof T))throw new Error("unsafeHTM `:""} - ${this.isLoading?"":q` - `} Reload @@ -1437,6 +1451,18 @@ const tt=new WeakMap,it=v(e=>t=>{if(!(t instanceof T))throw new Error("unsafeHTM Purge Cache + Full Reload `:""} +
+
+ Capture Date${e} +
+ ${this.embed?q` +
+ + +  About ReplayWeb.page + (${"1.0.1"}) + + `:""}
@@ -1475,7 +1501,7 @@ const tt=new WeakMap,it=v(e=>t=>{if(!(t instanceof T))throw new Error("unsafeHTM `:""} - `}onMenu(e){e.stopPropagation(),this.menuActive=!this.menuActive,this.menuActive&&document.addEventListener("click",()=>{this.menuActive=!1},{once:!0})}onGoBack(){this.menuActive=!1,window.history.back()}onGoForward(){this.menuActive=!1,window.history.forward()}onReAuthed(e){this.reauthWait=(async()=>{const t=e.detail.headers;await fetch(this.collInfo.apiPrefix+"/updateAuth",{method:"POST",body:JSON.stringify({headers:t})});this.showAuth&&(this.onRefresh(null,!0),this.showAuth=!1)})()}async onPurgeCache(e){e.preventDefault();const t=await fetch(""+this.collInfo.apiPrefix,{method:"DELETE"});200===t.status&&window.parent?window.parent.location.reload():console.warn("purge failed: "+t.status)}});var zt=i(107),St=i.n(zt),$t=i(108),_t=i.n($t);customElements.define("wr-sorter",class extends ie{constructor(){super(),this.sortedData=[],this.data=[],this.numResults=100,this.defaultDesc=!1}static get properties(){return{id:{type:String},defaultKey:{type:String},defaultDesc:{type:Boolean},data:{type:Array},sortedData:{type:Array},sortKey:{type:String},sortDesc:{type:Boolean}}}firstUpdated(){this.sortKey=localStorage.getItem(this.id+":sortKey")||this.defaultKey;const e=localStorage.getItem(this.id+":sortDesc");this.sortDesc=e?"1"===e:this.defaultDesc}updated(e){const t=e.has("sortKey"),i=e.has("sortDesc"),a=e.has("data");e.has("numResults");t&&localStorage.setItem(this.id+":sortKey",this.sortKey),i&&localStorage.setItem(this.id+":sortDesc",this.sortDesc?"1":"0"),(t||i||a)&&this.sortData()}sortData(){this.sortedData=[...this.data],this.numResults=100,this.sortedData.sort((e,t)=>e[this.sortKey]===t[this.sortKey]?0:this.sortDesc==e[this.sortKey]=this.sortedData.length||(this.numResults+=e,this.sendSortChanged())}static get styles(){return be(ee` + `}onKeyDown(e){"Esc"!==e.key&&"Escape"!==e.key||(e.target.value=this.replayUrl)}onMenu(e){e.stopPropagation(),this.menuActive=!this.menuActive,this.menuActive&&document.addEventListener("click",()=>{this.menuActive=!1},{once:!0})}onGoBack(){this.menuActive=!1,window.history.back()}onGoForward(){this.menuActive=!1,window.history.forward()}onReAuthed(e){this.reauthWait=(async()=>{const t=e.detail.headers;await fetch(this.collInfo.apiPrefix+"/updateAuth",{method:"POST",body:JSON.stringify({headers:t})});this.showAuth&&(this.onRefresh(null,!0),this.showAuth=!1)})()}async onPurgeCache(e){e.preventDefault();const t=await fetch(""+this.collInfo.apiPrefix,{method:"DELETE"});200===t.status&&window.parent?window.parent.location.reload():console.warn("purge failed: "+t.status)}});var zt=i(107),St=i.n(zt),$t=i(108),_t=i.n($t);customElements.define("wr-sorter",class extends ie{constructor(){super(),this.sortedData=[],this.data=[],this.numResults=100,this.defaultDesc=!1}static get properties(){return{id:{type:String},defaultKey:{type:String},defaultDesc:{type:Boolean},data:{type:Array},sortedData:{type:Array},sortKey:{type:String},sortDesc:{type:Boolean}}}firstUpdated(){this.sortKey=localStorage.getItem(this.id+":sortKey")||this.defaultKey;const e=localStorage.getItem(this.id+":sortDesc");this.sortDesc=e?"1"===e:this.defaultDesc}updated(e){const t=e.has("sortKey"),i=e.has("sortDesc"),a=e.has("data");e.has("numResults");t&&localStorage.setItem(this.id+":sortKey",this.sortKey),i&&localStorage.setItem(this.id+":sortDesc",this.sortDesc?"1":"0"),(t||i||a)&&this.sortData()}sortData(){this.sortedData=[...this.data],this.numResults=100,this.sortedData.sort((e,t)=>e[this.sortKey]===t[this.sortKey]?0:this.sortDesc==e[this.sortKey]=this.sortedData.length||(this.numResults+=e,this.sendSortChanged())}static get styles(){return be(ee` :host { min-width: 100px; }