Skip to content

Commit

Permalink
last changes
Browse files Browse the repository at this point in the history
  • Loading branch information
darrenarbon committed Sep 12, 2022
1 parent d16fafc commit 88f147d
Show file tree
Hide file tree
Showing 4 changed files with 137 additions and 64 deletions.
1 change: 1 addition & 0 deletions dist/pdfplayer-stencil/index.esm.js
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@

130 changes: 129 additions & 1 deletion dist/pdfplayer-stencil/pdfplayer-stencil.esm.js
Original file line number Diff line number Diff line change
@@ -1 +1,129 @@
import{p as e,b as t}from"./p-0d8c2eea.js";(()=>{const t=import.meta.url,o={};return""!==t&&(o.resourcesUrl=new URL(".",t).href),e(o)})().then((e=>t([["p-68ae0d54",[[1,"talis-pdf-viewer",{depotUrl:[1,"depot-url"],token:[1],pageCount:[2,"page-count"],annotations:[1],currentPage:[2,"current-page"],hasLoaded:[32],showPinDrop:[32],top:[32],left:[32],annotationsArray:[32]}]]]],e)));
import { B as BUILD, c as consoleDevInfo, p as plt, w as win, H, d as doc, N as NAMESPACE, a as promiseResolve, b as bootstrapLazy } from './index-c36cbccc.js';
import { g as globalScripts } from './app-globals-0f993ce5.js';

/*
Stencil Client Patch Browser v2.17.4 | MIT Licensed | https://stenciljs.com
*/
const getDynamicImportFunction = (namespace) => `__sc_import_${namespace.replace(/\s|-/g, '_')}`;
const patchBrowser = () => {
// NOTE!! This fn cannot use async/await!
if (BUILD.isDev && !BUILD.isTesting) {
consoleDevInfo('Running in development mode.');
}
if (BUILD.cssVarShim) {
// shim css vars
plt.$cssShim$ = win.__cssshim;
}
if (BUILD.cloneNodeFix) {
// opted-in to polyfill cloneNode() for slot polyfilled components
patchCloneNodeFix(H.prototype);
}
if (BUILD.profile && !performance.mark) {
// not all browsers support performance.mark/measure (Safari 10)
// because the mark/measure APIs are designed to write entries to a buffer in the browser that does not exist,
// simply stub the implementations out.
// TODO(STENCIL-323): Remove this patch when support for older browsers is removed (breaking)
// @ts-ignore
performance.mark = performance.measure = () => {
/*noop*/
};
performance.getEntriesByName = () => [];
}
// @ts-ignore
const scriptElm = BUILD.scriptDataOpts || BUILD.safari10 || BUILD.dynamicImportShim
? Array.from(doc.querySelectorAll('script')).find((s) => new RegExp(`\/${NAMESPACE}(\\.esm)?\\.js($|\\?|#)`).test(s.src) ||
s.getAttribute('data-stencil-namespace') === NAMESPACE)
: null;
const importMeta = import.meta.url;
const opts = BUILD.scriptDataOpts ? scriptElm['data-opts'] || {} : {};
if (BUILD.safari10 && 'onbeforeload' in scriptElm && !history.scrollRestoration /* IS_ESM_BUILD */) {
// Safari < v11 support: This IF is true if it's Safari below v11.
// This fn cannot use async/await since Safari didn't support it until v11,
// however, Safari 10 did support modules. Safari 10 also didn't support "nomodule",
// so both the ESM file and nomodule file would get downloaded. Only Safari
// has 'onbeforeload' in the script, and "history.scrollRestoration" was added
// to Safari in v11. Return a noop then() so the async/await ESM code doesn't continue.
// IS_ESM_BUILD is replaced at build time so this check doesn't happen in systemjs builds.
return {
then() {
/* promise noop */
},
};
}
if (!BUILD.safari10 && importMeta !== '') {
opts.resourcesUrl = new URL('.', importMeta).href;
}
else if (BUILD.dynamicImportShim || BUILD.safari10) {
opts.resourcesUrl = new URL('.', new URL(scriptElm.getAttribute('data-resources-url') || scriptElm.src, win.location.href)).href;
if (BUILD.dynamicImportShim) {
patchDynamicImport(opts.resourcesUrl, scriptElm);
}
if (BUILD.dynamicImportShim && !win.customElements) {
// module support, but no custom elements support (Old Edge)
// @ts-ignore
return import(/* webpackChunkName: "polyfills-dom" */ './dom-9794f747.js').then(() => opts);
}
}
return promiseResolve(opts);
};
const patchDynamicImport = (base, orgScriptElm) => {
const importFunctionName = getDynamicImportFunction(NAMESPACE);
try {
// test if this browser supports dynamic imports
// There is a caching issue in V8, that breaks using import() in Function
// By generating a random string, we can workaround it
// Check https://bugs.chromium.org/p/chromium/issues/detail?id=990810 for more info
win[importFunctionName] = new Function('w', `return import(w);//${Math.random()}`);
}
catch (e) {
// this shim is specifically for browsers that do support "esm" imports
// however, they do NOT support "dynamic" imports
// basically this code is for old Edge, v18 and below
const moduleMap = new Map();
win[importFunctionName] = (src) => {
const url = new URL(src, base).href;
let mod = moduleMap.get(url);
if (!mod) {
const script = doc.createElement('script');
script.type = 'module';
script.crossOrigin = orgScriptElm.crossOrigin;
script.src = URL.createObjectURL(new Blob([`import * as m from '${url}'; window.${importFunctionName}.m = m;`], {
type: 'application/javascript',
}));
mod = new Promise((resolve) => {
script.onload = () => {
resolve(win[importFunctionName].m);
script.remove();
};
});
moduleMap.set(url, mod);
doc.head.appendChild(script);
}
return mod;
};
}
};
const patchCloneNodeFix = (HTMLElementPrototype) => {
const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;
HTMLElementPrototype.cloneNode = function (deep) {
if (this.nodeName === 'TEMPLATE') {
return nativeCloneNodeFn.call(this, deep);
}
const clonedNode = nativeCloneNodeFn.call(this, false);
const srcChildNodes = this.childNodes;
if (deep) {
for (let i = 0; i < srcChildNodes.length; i++) {
// Node.ATTRIBUTE_NODE === 2, and checking because IE11
if (srcChildNodes[i].nodeType !== 2) {
clonedNode.appendChild(srcChildNodes[i].cloneNode(true));
}
}
}
return clonedNode;
};
};

patchBrowser().then(options => {
globalScripts();
return bootstrapLazy([["talis-pdf-viewer",[[0,"talis-pdf-viewer",{"depotUrl":[1,"depot-url"],"token":[1],"pageCount":[2,"page-count"],"annotations":[1],"currentPage":[2,"current-page"],"hasLoaded":[32],"showPinDrop":[32],"top":[32],"left":[32],"annotationsArray":[32]}]]]], options);
});
43 changes: 4 additions & 39 deletions src/components/talis-pdf-viewer/talis-pdf-viewer.css
Original file line number Diff line number Diff line change
@@ -1,9 +1,5 @@
.page-content {
position: absolute;
top: 0px;
bottom: 50px;
left: 0px;
right: 0px;
overflow: auto;
}

Expand All @@ -12,41 +8,6 @@
height: auto;
}

button {
font-weight: 400;
line-height: 1.333;
color: white;
background-color: #017d87;
border: 1px solid #017d87;
font-size: 1.09rem;
border-radius: 0.3125rem;
margin-left: 10px;
margin-right: 10px;
margin-top: 5px;
padding: 5px 7px;
cursor: pointer;
}

.page-navigation {
text-align: center;
display: block;
bottom: 0px;
border-top: solid 1px #017d87;
background-color: white;
position: absolute;
bottom: 0px;
height: 50px;
left: 0px;
right: 0px;
overflow: hidden;
}

.page-location {
color: #017d87;
background-color: white;
cursor: default;
}

.pin-drop-holder {
position: absolute;
}
Expand All @@ -67,3 +28,7 @@ button {
width: 22px;
background: linear-gradient(270deg, #6339aa 50%, #6339aa 50%);
}

.red {
background: linear-gradient(270deg, red 50%, red 50%);
}
27 changes: 3 additions & 24 deletions src/components/talis-pdf-viewer/talis-pdf-viewer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { Component, h, Prop, State, Element } from '@stencil/core';
@Component({
tag: 'talis-pdf-viewer',
styleUrl: 'talis-pdf-viewer.css',
shadow: true,
shadow: false,
})
export class TalisPdfViewer {
@Prop() depotUrl: string;
Expand Down Expand Up @@ -35,22 +35,6 @@ export class TalisPdfViewer {
this.hasLoaded = true;
}

nextPage() {
if (this.currentPage + 1 !== this.pageCount) {
this.currentPage++;
this.showPinDrop = false;
this.getCurrentAnnotation();
}
}

prevPage() {
if (this.currentPage !== 0) {
this.currentPage--;
this.showPinDrop = false;
this.getCurrentAnnotation();
}
}

getCurrentAnnotation() {
const annotationsArray = JSON.parse(this.annotations);
this.annotationsArray = annotationsArray.filter(annotation => {
Expand All @@ -59,7 +43,7 @@ export class TalisPdfViewer {
}

getImageDimensions() {
const img = this.el.shadowRoot.querySelector('img');
const img = this.el.querySelector('img');
const { offsetLeft: x, offsetTop: y, width, height } = img;
return { x, y, width, height };
}
Expand Down Expand Up @@ -92,7 +76,7 @@ export class TalisPdfViewer {
const { top, left } = this.getLocationDetails(annotation);
return (
<div class="pin-drop-holder" style={{ top, left }}>
<div class="pin-drop"></div>
<div class="pin-drop red"></div>
</div>
);
})}
Expand All @@ -102,11 +86,6 @@ export class TalisPdfViewer {
</div>
)}
</div>
<div class="page-navigation">
<button onClick={() => this.prevPage()}>Previous</button>
<button class="page-location">Page {this.currentPage + 1}</button>
<button onClick={() => this.nextPage()}>Next</button>
</div>
</div>
);
}
Expand Down

0 comments on commit 88f147d

Please sign in to comment.