box-content-preview 3.77.0 → 3.79.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +7 -7
- package/dist/lib/index.css +1 -1
- package/dist/lib/index.js +206 -302
- package/package.json +5 -7
package/README.md
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
[](https://mergify.io)
|
|
3
3
|
[](https://github.com/prettier/prettier)
|
|
4
4
|
[](https://travis-ci.org/box/box-content-preview)
|
|
5
|
-
[](https://github.com/box/box-content-preview)
|
|
6
6
|
[](https://www.npmjs.com/package/box-ui-elements)
|
|
7
7
|
|
|
8
8
|
# [Box Content Preview](https://developer.box.com/docs/box-content-preview)
|
|
@@ -22,11 +22,11 @@ We encourage all users to update their applications to utilize modern browsers f
|
|
|
22
22
|
|
|
23
23
|
## Current Version
|
|
24
24
|
|
|
25
|
-
- Version: v3.
|
|
25
|
+
- Version: v3.79.0
|
|
26
26
|
- Locale: en-US
|
|
27
27
|
|
|
28
|
-
https://cdn01.boxcdn.net/platform/preview/3.
|
|
29
|
-
https://cdn01.boxcdn.net/platform/preview/3.
|
|
28
|
+
https://cdn01.boxcdn.net/platform/preview/3.79.0/en-US/preview.js
|
|
29
|
+
https://cdn01.boxcdn.net/platform/preview/3.79.0/en-US/preview.css
|
|
30
30
|
|
|
31
31
|
## Supported Locales
|
|
32
32
|
|
|
@@ -52,10 +52,10 @@ You can self-host the Box Content Preview library or reference the versions avai
|
|
|
52
52
|
<title>Box Content Preview Demo</title>
|
|
53
53
|
|
|
54
54
|
<!-- Latest version of Preview SDK for your locale -->
|
|
55
|
-
<script src="https://cdn01.boxcdn.net/platform/preview/3.
|
|
55
|
+
<script src="https://cdn01.boxcdn.net/platform/preview/3.79.0/en-US/preview.js"></script>
|
|
56
56
|
<link
|
|
57
57
|
rel="stylesheet"
|
|
58
|
-
href="https://cdn01.boxcdn.net/platform/preview/3.
|
|
58
|
+
href="https://cdn01.boxcdn.net/platform/preview/3.79.0/en-US/preview.css"
|
|
59
59
|
/>
|
|
60
60
|
</head>
|
|
61
61
|
<body>
|
|
@@ -76,7 +76,7 @@ To self-host the Box Content Preview library, follow these steps:
|
|
|
76
76
|
|
|
77
77
|
1. Either fork the repo and check out the version you want to host or download the specific version as a zip:
|
|
78
78
|
|
|
79
|
-
- Check out a specific version with `git checkout v3.
|
|
79
|
+
- Check out a specific version with `git checkout v3.79.0`
|
|
80
80
|
- Download a specific version as a zip from https://github.com/box/box-content-preview/releases
|
|
81
81
|
|
|
82
82
|
2. Install dependencies and build the library with `yarn install && yarn build:i18n && yarn build:prod`
|
package/dist/lib/index.css
CHANGED
|
@@ -66,7 +66,7 @@
|
|
|
66
66
|
.bp-SubtitlesToggle{opacity:.9;transition:opacity 150ms,background-color 150ms;will-change:opacity;outline:0;display:flex;align-items:center;justify-content:center;margin:0;padding:0;color:#fff;background:transparent;border:0;border-radius:25px;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation;zoom:1}.bp-SubtitlesToggle:focus:not(:disabled),.bp-SubtitlesToggle:hover:not(:disabled){background-color:rgba(255,255,255,.08);opacity:1}.bp-SubtitlesToggle:focus:not(:disabled) svg,.bp-SubtitlesToggle:hover:not(:disabled) svg,.bp-SubtitlesToggle.bp-is-active svg{transform:scale(1.09);transition:transform 150ms}.bp-SubtitlesToggle.bp-is-active,.bp-SubtitlesToggle:active:not(:disabled){background-color:rgba(255,255,255,.16)}.bp-SubtitlesToggle.bp-is-active:focus:not(:disabled),.bp-SubtitlesToggle.bp-is-active:hover:not(:disabled){background-color:rgba(255,255,255,.2)}.bp-SubtitlesToggle:focus:not(:disabled){box-shadow:inset 0 0 0 1px rgba(211,211,211,.5),0 1px 2px rgba(0,0,0,.1)}.bp-SubtitlesToggle:focus-visible:not(:disabled){box-shadow:inset 0 0 0 1px rgba(211,211,211,.5),0 1px 2px rgba(0,0,0,.1)}.bp-SubtitlesToggle:focus:not(:focus-visible){box-shadow:none}.bp-SubtitlesToggle:disabled{cursor:default;opacity:.2;pointer-events:none}.bp-SubtitlesToggle svg{width:32px;height:32px;padding:5px}.bp-SubtitlesToggle[aria-pressed=true] .bp-SubtitlesToggle-text{color:#fff;background-color:#0061d5}.bp-SubtitlesToggle-text{display:flex;align-items:center;justify-content:center;width:24px;height:24px;color:#fff;font-weight:bold;font-size:12px;letter-spacing:.1em;background-color:rgba(0,0,0,.3);border-radius:4px}
|
|
67
67
|
.bp-VideoControls{display:flex;flex-direction:column;width:100%;background-image:linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 100%);padding:40px 20px 8px}.bp-VideoControls .bp-FullscreenToggle{width:36px;height:40px}.bp-VideoControls-bar{display:flex;padding:0 10px 5px;display:grid;align-items:center}.bp-VideoControls-bar.bp-VideoControls-bar--two-groups{justify-content:flex-end}.bp-VideoControls-bar.bp-VideoControls-bar--two-groups .bp-VideoControls-group--play-pause{position:absolute;left:50%;transform:translateX(-50%)}.bp-VideoControls-bar.bp-VideoControls-bar--three-groups{grid-template-columns:repeat(3, 1fr)}.bp-VideoControls-bar.bp-VideoControls-bar--three-groups.bp-VideoControls-bar--narrow-video{grid-template-columns:repeat(2, 1fr)}.bp-VideoControls-bar.bp-VideoControls-bar--three-groups .bp-VideoControls-group--annotations{justify-self:flex-start}.bp-VideoControls-bar.bp-VideoControls-bar--three-groups .bp-VideoControls-group--play-pause{justify-self:center}.bp-VideoControls-bar.bp-VideoControls-bar--three-groups .bp-VideoControls-group--media-controls{justify-self:flex-end}.bp-VideoControls-group{display:flex;align-items:center}.bp-VideoControls-settings{position:relative}.bp-VideoControls-settings .bp-SettingsFlyout{right:15px}.bp-VideoControls-settings .bp-SettingsToggle-button{width:36px;height:40px}
|
|
68
68
|
.bp-TimestampControl{position:relative;display:flex;align-items:center}.bp-TimestampControl-button,.bp-TimestampControl-static{display:flex;gap:4px;align-items:center;padding:6px 12px;color:#fff;font-weight:normal;font-size:14px;font-family:Lato,Arial,sans-serif;line-height:20px;letter-spacing:.3px;white-space:nowrap;-webkit-user-select:none;user-select:none}.bp-TimestampControl-button{opacity:.9;transition:opacity 150ms,background-color 150ms;will-change:opacity;outline:0;margin:0;background:transparent;border:0;border-radius:25px;cursor:pointer}.bp-TimestampControl-button:focus:not(:disabled),.bp-TimestampControl-button:hover:not(:disabled){background-color:rgba(255,255,255,.08);opacity:1}.bp-TimestampControl-button:focus:not(:disabled) svg,.bp-TimestampControl-button:hover:not(:disabled) svg,.bp-TimestampControl-button.bp-is-active svg{transform:scale(1.09);transition:transform 150ms}.bp-TimestampControl-button.bp-is-active,.bp-TimestampControl-button:active:not(:disabled){background-color:rgba(255,255,255,.16)}.bp-TimestampControl-button.bp-is-active:focus:not(:disabled),.bp-TimestampControl-button.bp-is-active:hover:not(:disabled){background-color:rgba(255,255,255,.2)}.bp-TimestampControl-button:focus:not(:disabled){box-shadow:inset 0 0 0 1px rgba(211,211,211,.5),0 1px 2px rgba(0,0,0,.1)}.bp-TimestampControl-button:focus-visible:not(:disabled){box-shadow:inset 0 0 0 1px rgba(211,211,211,.5),0 1px 2px rgba(0,0,0,.1)}.bp-TimestampControl-button:focus:not(:focus-visible){box-shadow:none}.bp-TimestampControl-button:focus:not(:disabled),.bp-TimestampControl-button.bp-is-open{background:transparent}.bp-TimestampControl-button:hover:not(:disabled){background:rgba(255,255,255,.08)}.bp-TimestampControl-separator,.bp-TimestampControl-duration{color:rgba(255,255,255,.8)}.bp-TimestampControl-chevron{width:16px;height:16px;margin-left:2px;fill:rgba(255,255,255,.8)}.bp-TimestampControl-flyout{position:absolute;bottom:calc(100% + 12px);left:50%;z-index:1;min-width:250px;padding:12px 8px;background:#fff;border-radius:16px;box-shadow:0 4px 12px 0 rgba(0,0,0,.15);transform:translateX(-50%)}.bp-TimestampControl-header{padding:6px 14px;color:#767676;font-weight:bold;font-size:14px;font-family:Lato,Arial,sans-serif;line-height:20px;letter-spacing:.3px;-webkit-user-select:none;user-select:none}.bp-TimestampControl-listitem{display:flex;gap:16px;align-items:center;justify-content:space-between;padding:6px 14px;color:#000;font-size:16px;font-family:Lato,Arial,sans-serif;line-height:24px;white-space:nowrap;border-radius:8px;outline:none;cursor:pointer}.bp-TimestampControl-listitem:hover,.bp-TimestampControl-listitem:focus{background:#f4f4f4}.bp-TimestampControl-check{flex:none;fill:#000}
|
|
69
|
-
.bp-FilmstripV2{position:absolute;bottom:calc(100% + 12px);padding:12px;padding-bottom:8px;background:#fff;border-radius:16px;box-shadow:0 2px 8px rgba(0,0,0,.15);visibility:hidden}.bp-FilmstripV2.bp-is-shown{visibility:visible}.bp-FilmstripV2-frame{display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:10px}.bp-FilmstripV2-time{margin-top:8px;color:#000;font-size:13px;line-height:20px;text-align:center}
|
|
69
|
+
.bp-FilmstripV2{position:absolute;bottom:calc(100% + 12px);padding:12px;padding-bottom:8px;background:#fff;border-radius:16px;box-shadow:0 2px 8px rgba(0,0,0,.15);visibility:hidden}.bp-FilmstripV2.bp-is-shown{visibility:visible}.bp-FilmstripV2-frame{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:10px}.bp-FilmstripV2-frameImage{position:absolute;top:0;left:0;overflow:hidden;background-repeat:no-repeat;transform-origin:top left}.bp-FilmstripV2-frame .bp-crawler{position:relative;z-index:1}.bp-FilmstripV2-time{margin-top:8px;color:#000;font-size:13px;line-height:20px;text-align:center}
|
|
70
70
|
.bp-MarkerAvatar{position:absolute;bottom:calc(100% + 4px);left:50%;width:12px;height:12px;overflow:hidden;border:0;border-radius:50%;outline:2px solid rgba(0,0,0,.5);box-shadow:0 0 0 0 #fff;transform:translate(-50%, 0);transform-origin:bottom center;transition:transform 150ms,box-shadow 150ms,outline 150ms}.bp-MarkerAvatar img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center}.bp-MarkerAvatar-initial{display:grid;width:100%;height:100%;font-weight:bold;font-size:7px;line-height:1;text-align:center;text-transform:uppercase;place-items:center}.bp-MarkerAvatar-anonymousIcon{width:100%;height:100%;color:#222}
|
|
71
71
|
.bp-MarkerAvatarStack{position:absolute;bottom:calc(100% + 4px);left:50%;display:flex;align-items:center;transform:translateX(-50%)}.bp-MarkerAvatarStack-item{position:relative;flex-shrink:0;padding:0;background:none;border:0;cursor:pointer;transition:margin 150ms}.bp-MarkerAvatarStack-item:not(:first-child){margin-left:-6px}.bp-MarkerAvatarStack-item .bp-MarkerAvatar{position:relative;bottom:auto;left:auto;display:block;transform:none}.bp-MarkerAvatarStack-item:hover,.bp-MarkerAvatarStack-item:focus-visible{z-index:1}.bp-MarkerAvatarStack-item:hover .bp-MarkerAvatar,.bp-MarkerAvatarStack-item:focus-visible .bp-MarkerAvatar{outline:0 solid transparent;box-shadow:0 0 0 2px #fff}.bp-TimeControlsV2-marker--group:hover .bp-MarkerAvatarStack-item:not(:first-child),.bp-TimeControlsV2-marker--group:focus-visible .bp-MarkerAvatarStack-item:not(:first-child),.bp-MarkerCluster:hover .bp-MarkerAvatarStack-item:not(:first-child),.bp-MarkerCluster:focus-within .bp-MarkerAvatarStack-item:not(:first-child){margin-left:2px}.bp-MarkerAvatarStack-overflow{cursor:pointer}.bp-MarkerAvatarStack-overflowBadge{background-color:#6f6f6f}
|
|
72
72
|
.bp-MarkerCluster{position:absolute;top:50%;z-index:1;height:8px;transform:translate(-2px, -50%);transition:transform 150ms}.bp-MarkerCluster:hover,.bp-MarkerCluster:focus-within{z-index:2;transform:translate(-2px, -50%) scale(1.5)}.bp-MarkerCluster:hover .bp-MarkerCluster-tick,.bp-MarkerCluster:focus-within .bp-MarkerCluster-tick{transform:none}.bp-MarkerCluster-tick{display:block;width:100%;height:100%;padding:0;background:#6f6f6f;border:1px solid #fff;border-radius:2px;cursor:pointer;transition:transform 150ms}
|
package/dist/lib/index.js
CHANGED
|
@@ -15388,7 +15388,7 @@ function util_toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var
|
|
|
15388
15388
|
const CLIENT_NAME = "box-content-preview"; // eslint-disable-line no-undef
|
|
15389
15389
|
const CLIENT_NAME_KEY = 'box_client_name';
|
|
15390
15390
|
const CLIENT_VERSION_KEY = 'box_client_version';
|
|
15391
|
-
const CLIENT_VERSION = "3.
|
|
15391
|
+
const CLIENT_VERSION = "3.79.0"; // eslint-disable-line no-undef
|
|
15392
15392
|
const HEADER_CLIENT_NAME = 'X-Box-Client-Name';
|
|
15393
15393
|
const HEADER_CLIENT_VERSION = 'X-Box-Client-Version';
|
|
15394
15394
|
const PROMISE_MAP = {};
|
|
@@ -17085,7 +17085,7 @@ class Browser {
|
|
|
17085
17085
|
;// ./src/lib/Logger.js
|
|
17086
17086
|
/* eslint-disable no-undef */
|
|
17087
17087
|
const Logger_CLIENT_NAME = "box-content-preview";
|
|
17088
|
-
const Logger_CLIENT_VERSION = "3.
|
|
17088
|
+
const Logger_CLIENT_VERSION = "3.79.0";
|
|
17089
17089
|
/* eslint-enable no-undef */
|
|
17090
17090
|
|
|
17091
17091
|
class Logger {
|
|
@@ -17813,8 +17813,7 @@ class RepStatus extends (events_default()) {
|
|
|
17813
17813
|
sharedLink,
|
|
17814
17814
|
sharedLinkPassword,
|
|
17815
17815
|
logger,
|
|
17816
|
-
fileId
|
|
17817
|
-
migrateAccessTokenToHeader = false
|
|
17816
|
+
fileId
|
|
17818
17817
|
}) {
|
|
17819
17818
|
super();
|
|
17820
17819
|
/** @property {Api} - Api used for XHR calls */
|
|
@@ -17826,12 +17825,8 @@ class RepStatus extends (events_default()) {
|
|
|
17826
17825
|
|
|
17827
17826
|
// Some representations (e.g. ORIGINAL) may not have an info url
|
|
17828
17827
|
const repInfo = this.representation.info;
|
|
17829
|
-
|
|
17830
|
-
|
|
17831
|
-
this.headers = getHeaders({}, token);
|
|
17832
|
-
} else {
|
|
17833
|
-
this.infoUrl = repInfo ? appendAuthParams(repInfo.url, token, sharedLink, sharedLinkPassword) : '';
|
|
17834
|
-
}
|
|
17828
|
+
this.infoUrl = repInfo ? appendAuthParamsV2(repInfo.url, sharedLink, sharedLinkPassword) : '';
|
|
17829
|
+
this.headers = getHeaders({}, token);
|
|
17835
17830
|
this.promise = new Promise((resolve, reject) => {
|
|
17836
17831
|
this.resolve = resolve;
|
|
17837
17832
|
this.reject = reject;
|
|
@@ -18569,15 +18564,11 @@ class BaseViewer extends (events_default()) {
|
|
|
18569
18564
|
template = this.api.reachability.constructor.replaceDownloadHostWithDefault(template);
|
|
18570
18565
|
}
|
|
18571
18566
|
|
|
18572
|
-
//
|
|
18573
|
-
// varies the cache key on its own.
|
|
18574
|
-
const resolveCacheBuster = this.featureEnabled('migrateAccessTokenToHeader');
|
|
18575
|
-
|
|
18576
|
-
// Append optional query params
|
|
18567
|
+
// Auth is header-based, so re-resolve the cache-buster per request.
|
|
18577
18568
|
const {
|
|
18578
18569
|
queryParams
|
|
18579
18570
|
} = this.options;
|
|
18580
|
-
return appendQueryParams(createContentUrl(template, asset,
|
|
18571
|
+
return appendQueryParams(createContentUrl(template, asset, true), queryParams);
|
|
18581
18572
|
}
|
|
18582
18573
|
|
|
18583
18574
|
/**
|
|
@@ -18591,13 +18582,7 @@ class BaseViewer extends (events_default()) {
|
|
|
18591
18582
|
* @return {string} content url
|
|
18592
18583
|
*/
|
|
18593
18584
|
createContentUrlWithAuthParams(template, asset) {
|
|
18594
|
-
|
|
18595
|
-
|
|
18596
|
-
// Append optional query params
|
|
18597
|
-
const {
|
|
18598
|
-
queryParams
|
|
18599
|
-
} = this.options;
|
|
18600
|
-
return appendQueryParams(urlWithAuthParams, queryParams);
|
|
18585
|
+
return this.createContentUrlV2(template, asset);
|
|
18601
18586
|
}
|
|
18602
18587
|
|
|
18603
18588
|
/**
|
|
@@ -19034,9 +19019,7 @@ class BaseViewer extends (events_default()) {
|
|
|
19034
19019
|
sharedLink,
|
|
19035
19020
|
sharedLinkPassword,
|
|
19036
19021
|
fileId: file.id,
|
|
19037
|
-
logger: representation ? null : logger
|
|
19038
|
-
// Do not log to main preview status if rep is passed in
|
|
19039
|
-
migrateAccessTokenToHeader: this.featureEnabled('migrateAccessTokenToHeader')
|
|
19022
|
+
logger: representation ? null : logger // Do not log to main preview status if rep is passed in
|
|
19040
19023
|
});
|
|
19041
19024
|
|
|
19042
19025
|
// Don't time out while conversion is pending
|
|
@@ -19615,14 +19598,10 @@ class ArchiveViewer extends viewers_BaseViewer {
|
|
|
19615
19598
|
} = this.options;
|
|
19616
19599
|
const template = get_default()(representation, 'content.url_template');
|
|
19617
19600
|
this.startLoadTimer();
|
|
19618
|
-
|
|
19619
|
-
|
|
19620
|
-
|
|
19621
|
-
|
|
19622
|
-
});
|
|
19623
|
-
}
|
|
19624
|
-
const contentUrl = this.createContentUrlWithAuthParams(template);
|
|
19625
|
-
return this.api.get(contentUrl);
|
|
19601
|
+
const contentUrl = this.createContentUrlV2(template);
|
|
19602
|
+
return this.api.get(contentUrl, {
|
|
19603
|
+
headers: this.appendAuthHeader()
|
|
19604
|
+
});
|
|
19626
19605
|
}).then(this.finishLoading).catch(this.handleAssetError);
|
|
19627
19606
|
}
|
|
19628
19607
|
}
|
|
@@ -21335,8 +21314,7 @@ class ImageViewer extends image_ImageBaseViewer {
|
|
|
21335
21314
|
this.removeListener('zoom', this.handleZoomEvent);
|
|
21336
21315
|
}
|
|
21337
21316
|
|
|
21338
|
-
//
|
|
21339
|
-
// Revoke to free the memory since blobs persist until explicitly released.
|
|
21317
|
+
// Blob URLs stay allocated until revoked.
|
|
21340
21318
|
if (this.imageEl && this.imageEl.src && this.imageEl.src.startsWith('blob:')) {
|
|
21341
21319
|
URL.revokeObjectURL(this.imageEl.src);
|
|
21342
21320
|
}
|
|
@@ -21382,23 +21360,21 @@ class ImageViewer extends image_ImageBaseViewer {
|
|
|
21382
21360
|
} = this.options;
|
|
21383
21361
|
const template = representation.content.url_template;
|
|
21384
21362
|
this.bindDOMListeners();
|
|
21385
|
-
|
|
21386
|
-
|
|
21387
|
-
|
|
21388
|
-
|
|
21389
|
-
|
|
21390
|
-
|
|
21391
|
-
|
|
21392
|
-
|
|
21393
|
-
|
|
21394
|
-
|
|
21395
|
-
|
|
21396
|
-
|
|
21397
|
-
|
|
21398
|
-
|
|
21399
|
-
}
|
|
21400
|
-
const downloadUrl = this.createContentUrlWithAuthParams(template, viewer.ASSET);
|
|
21401
|
-
return this.getRepStatus().getPromise().then(() => this.handleAssetAndRepLoad(downloadUrl)).catch(this.handleAssetError);
|
|
21363
|
+
const contentUrl = this.createContentUrlV2(template, viewer.ASSET);
|
|
21364
|
+
return this.getRepStatus().getPromise().then(() => {
|
|
21365
|
+
this.startLoadTimer();
|
|
21366
|
+
return this.fetchContentAsBlobUrl(contentUrl);
|
|
21367
|
+
}).then(blobUrl => {
|
|
21368
|
+
if (this.isDestroyed()) {
|
|
21369
|
+
URL.revokeObjectURL(blobUrl);
|
|
21370
|
+
return;
|
|
21371
|
+
}
|
|
21372
|
+
this.imageEl.src = blobUrl;
|
|
21373
|
+
if (this.imageEl.complete) {
|
|
21374
|
+
this.finishLoading();
|
|
21375
|
+
}
|
|
21376
|
+
super.handleAssetAndRepLoad();
|
|
21377
|
+
}).catch(this.handleAssetError);
|
|
21402
21378
|
}
|
|
21403
21379
|
|
|
21404
21380
|
/**
|
|
@@ -21442,9 +21418,6 @@ class ImageViewer extends image_ImageBaseViewer {
|
|
|
21442
21418
|
this.firstRenderEmitted = true;
|
|
21443
21419
|
}
|
|
21444
21420
|
}
|
|
21445
|
-
prefetchFinishedLoading(event) {
|
|
21446
|
-
document.body.removeChild(event?.currentTarget);
|
|
21447
|
-
}
|
|
21448
21421
|
|
|
21449
21422
|
/**
|
|
21450
21423
|
* Prefetches assets for an image.
|
|
@@ -21464,16 +21437,13 @@ class ImageViewer extends image_ImageBaseViewer {
|
|
|
21464
21437
|
const isWatermarked = file && file.watermark_info && file.watermark_info.is_watermarked;
|
|
21465
21438
|
if ((content || preload) && !isWatermarked && this.isRepresentationReady(representation)) {
|
|
21466
21439
|
const template = representation.content.url_template;
|
|
21467
|
-
|
|
21468
|
-
|
|
21469
|
-
|
|
21470
|
-
|
|
21471
|
-
|
|
21472
|
-
|
|
21473
|
-
|
|
21474
|
-
document.body.appendChild(preFetchedImg);
|
|
21475
|
-
preFetchedImg.src = this.createContentUrlWithAuthParams(template, viewer.ASSET);
|
|
21476
|
-
}
|
|
21440
|
+
const contentUrl = this.createContentUrlV2(template, viewer.ASSET);
|
|
21441
|
+
this.api.get(contentUrl, {
|
|
21442
|
+
type: 'blob',
|
|
21443
|
+
headers: this.appendAuthHeader()
|
|
21444
|
+
}).catch(err => {
|
|
21445
|
+
console.warn('Image prefetch failed', err); // eslint-disable-line no-console
|
|
21446
|
+
});
|
|
21477
21447
|
}
|
|
21478
21448
|
}
|
|
21479
21449
|
|
|
@@ -22138,8 +22108,7 @@ class MultiImageViewer extends image_ImageBaseViewer {
|
|
|
22138
22108
|
*/
|
|
22139
22109
|
destroy() {
|
|
22140
22110
|
if (this.singleImageEls && this.singleImageEls.length > 0) {
|
|
22141
|
-
//
|
|
22142
|
-
// Revoke to free the memory since blobs persist until explicitly released.
|
|
22111
|
+
// Blob URLs stay allocated until revoked.
|
|
22143
22112
|
this.singleImageEls.forEach((el, index) => {
|
|
22144
22113
|
if (el.src && el.src.startsWith('blob:')) {
|
|
22145
22114
|
URL.revokeObjectURL(el.src);
|
|
@@ -22210,8 +22179,7 @@ class MultiImageViewer extends image_ImageBaseViewer {
|
|
|
22210
22179
|
} = representation;
|
|
22211
22180
|
const asset = viewer.ASSET;
|
|
22212
22181
|
this.pagesCount = metadata.pages;
|
|
22213
|
-
const
|
|
22214
|
-
const urlBase = useHeaders ? this.createContentUrlV2(template, asset) : this.createContentUrlWithAuthParams(template, asset);
|
|
22182
|
+
const urlBase = this.createContentUrlV2(template, asset);
|
|
22215
22183
|
const urls = [];
|
|
22216
22184
|
for (let pageNum = 1; pageNum <= this.pagesCount; pageNum += 1) {
|
|
22217
22185
|
urls.push(urlBase.replace('{page}', pageNum));
|
|
@@ -22236,13 +22204,13 @@ class MultiImageViewer extends image_ImageBaseViewer {
|
|
|
22236
22204
|
// Set page number. Page is index + 1.
|
|
22237
22205
|
this.singleImageEls[index].setAttribute('data-page-number', index + 1);
|
|
22238
22206
|
this.singleImageEls[index].classList.add(CLASS_MULTI_IMAGE_PAGE);
|
|
22239
|
-
|
|
22240
|
-
this.
|
|
22241
|
-
|
|
22242
|
-
|
|
22243
|
-
|
|
22244
|
-
this.singleImageEls[index].src =
|
|
22245
|
-
}
|
|
22207
|
+
this.fetchContentAsBlobUrl(imageUrl).then(blobUrl => {
|
|
22208
|
+
if (this.isDestroyed()) {
|
|
22209
|
+
URL.revokeObjectURL(blobUrl);
|
|
22210
|
+
return;
|
|
22211
|
+
}
|
|
22212
|
+
this.singleImageEls[index].src = blobUrl;
|
|
22213
|
+
}).catch(this.handleMultiImageDownloadError);
|
|
22246
22214
|
}
|
|
22247
22215
|
|
|
22248
22216
|
/**
|
|
@@ -24710,15 +24678,17 @@ class SWFViewer extends viewers_BaseViewer {
|
|
|
24710
24678
|
/* global swfobject */
|
|
24711
24679
|
const template = this.options.representation.content.url_template;
|
|
24712
24680
|
this.startLoadTimer();
|
|
24713
|
-
|
|
24714
|
-
|
|
24715
|
-
|
|
24716
|
-
|
|
24717
|
-
|
|
24718
|
-
|
|
24719
|
-
|
|
24720
|
-
|
|
24721
|
-
|
|
24681
|
+
const contentUrl = this.createContentUrlV2(template);
|
|
24682
|
+
return this.fetchContentAsBlobUrl(contentUrl).then(blobUrl => {
|
|
24683
|
+
/* istanbul ignore next */
|
|
24684
|
+
swfobject.embedSWF(blobUrl, this.playerEl.id, '100%', '100%', '9', null, null, SWF_PARAMS, null, () => {
|
|
24685
|
+
if (this.isDestroyed()) {
|
|
24686
|
+
return;
|
|
24687
|
+
}
|
|
24688
|
+
this.loaded = true;
|
|
24689
|
+
this.emit(VIEWER_EVENT.load);
|
|
24690
|
+
});
|
|
24691
|
+
}).catch(this.handleAssetError);
|
|
24722
24692
|
});
|
|
24723
24693
|
}
|
|
24724
24694
|
/**
|
|
@@ -25687,13 +25657,8 @@ class PlainTextViewer extends text_TextBaseViewer {
|
|
|
25687
25657
|
const headers = this.truncated ? {
|
|
25688
25658
|
Range: `bytes=0-${SIZE_LIMIT_BYTES}`
|
|
25689
25659
|
} : {};
|
|
25690
|
-
|
|
25691
|
-
|
|
25692
|
-
contentUrl = this.createContentUrlV2(template);
|
|
25693
|
-
PlainTextViewer_extends(headers, this.appendAuthHeader());
|
|
25694
|
-
} else {
|
|
25695
|
-
contentUrl = this.createContentUrlWithAuthParams(template);
|
|
25696
|
-
}
|
|
25660
|
+
const contentUrl = this.createContentUrlV2(template);
|
|
25661
|
+
PlainTextViewer_extends(headers, this.appendAuthHeader());
|
|
25697
25662
|
this.startLoadTimer();
|
|
25698
25663
|
return this.api.get(contentUrl, {
|
|
25699
25664
|
headers,
|
|
@@ -25764,17 +25729,11 @@ class PlainTextViewer extends text_TextBaseViewer {
|
|
|
25764
25729
|
} = this.options;
|
|
25765
25730
|
if (content && this.isRepresentationReady(representation)) {
|
|
25766
25731
|
const template = representation.content.url_template;
|
|
25767
|
-
|
|
25768
|
-
|
|
25769
|
-
|
|
25770
|
-
|
|
25771
|
-
|
|
25772
|
-
});
|
|
25773
|
-
} else {
|
|
25774
|
-
this.api.get(this.createContentUrlWithAuthParams(template), {
|
|
25775
|
-
type: 'document'
|
|
25776
|
-
});
|
|
25777
|
-
}
|
|
25732
|
+
const contentUrl = this.createContentUrlV2(template);
|
|
25733
|
+
this.api.get(contentUrl, {
|
|
25734
|
+
type: 'document',
|
|
25735
|
+
headers: this.appendAuthHeader()
|
|
25736
|
+
});
|
|
25778
25737
|
}
|
|
25779
25738
|
}
|
|
25780
25739
|
|
|
@@ -26243,15 +26202,11 @@ class CSVViewer extends text_TextBaseViewer {
|
|
|
26243
26202
|
worker: true
|
|
26244
26203
|
});
|
|
26245
26204
|
};
|
|
26246
|
-
|
|
26247
|
-
|
|
26248
|
-
|
|
26249
|
-
|
|
26250
|
-
|
|
26251
|
-
});
|
|
26252
|
-
}
|
|
26253
|
-
parseCSV(this.createContentUrlWithAuthParams(template));
|
|
26254
|
-
return undefined;
|
|
26205
|
+
const contentUrl = this.createContentUrlV2(template);
|
|
26206
|
+
return this.fetchContentAsBlobUrl(contentUrl).then(blobUrl => {
|
|
26207
|
+
this.blobUrl = blobUrl;
|
|
26208
|
+
parseCSV(blobUrl);
|
|
26209
|
+
});
|
|
26255
26210
|
}).catch(this.handleAssetError);
|
|
26256
26211
|
}
|
|
26257
26212
|
|
|
@@ -26302,17 +26257,11 @@ class CSVViewer extends text_TextBaseViewer {
|
|
|
26302
26257
|
} = this.options;
|
|
26303
26258
|
if (content && this.isRepresentationReady(representation)) {
|
|
26304
26259
|
const template = representation.content.url_template;
|
|
26305
|
-
|
|
26306
|
-
|
|
26307
|
-
|
|
26308
|
-
|
|
26309
|
-
|
|
26310
|
-
});
|
|
26311
|
-
} else {
|
|
26312
|
-
this.api.get(this.createContentUrlWithAuthParams(template), {
|
|
26313
|
-
type: 'document'
|
|
26314
|
-
});
|
|
26315
|
-
}
|
|
26260
|
+
const contentUrl = this.createContentUrlV2(template);
|
|
26261
|
+
this.api.get(contentUrl, {
|
|
26262
|
+
type: 'document',
|
|
26263
|
+
headers: this.appendAuthHeader()
|
|
26264
|
+
});
|
|
26316
26265
|
}
|
|
26317
26266
|
}
|
|
26318
26267
|
|
|
@@ -28563,21 +28512,14 @@ class MediaBaseViewer extends viewers_BaseViewer {
|
|
|
28563
28512
|
// https://webkit.org/blog/6784/new-video-policies-for-ios/
|
|
28564
28513
|
this.mediaEl.autoplay = true;
|
|
28565
28514
|
}
|
|
28566
|
-
|
|
28567
|
-
const contentUrl = this.createContentUrlV2(template);
|
|
28568
|
-
return this.getRepStatus().getPromise().then(() => {
|
|
28569
|
-
this.startLoadTimer();
|
|
28570
|
-
return this.fetchContentAsBlobUrl(contentUrl);
|
|
28571
|
-
}).then(blobUrl => {
|
|
28572
|
-
this.mediaBlobUrl = blobUrl;
|
|
28573
|
-
this.mediaUrl = blobUrl;
|
|
28574
|
-
this.mediaEl.src = blobUrl;
|
|
28575
|
-
}).catch(this.handleAssetError);
|
|
28576
|
-
}
|
|
28577
|
-
this.mediaUrl = this.createContentUrlWithAuthParams(template);
|
|
28515
|
+
const contentUrl = this.createContentUrlV2(template);
|
|
28578
28516
|
return this.getRepStatus().getPromise().then(() => {
|
|
28579
28517
|
this.startLoadTimer();
|
|
28580
|
-
|
|
28518
|
+
return this.fetchContentAsBlobUrl(contentUrl);
|
|
28519
|
+
}).then(blobUrl => {
|
|
28520
|
+
this.mediaBlobUrl = blobUrl;
|
|
28521
|
+
this.mediaUrl = blobUrl;
|
|
28522
|
+
this.mediaEl.src = blobUrl;
|
|
28581
28523
|
}).catch(this.handleAssetError);
|
|
28582
28524
|
}
|
|
28583
28525
|
|
|
@@ -28677,20 +28619,15 @@ class MediaBaseViewer extends viewers_BaseViewer {
|
|
|
28677
28619
|
} = this.mediaEl;
|
|
28678
28620
|
this.currentTime = currentTime;
|
|
28679
28621
|
this.options.token = newToken;
|
|
28680
|
-
if (this.
|
|
28681
|
-
|
|
28682
|
-
URL.revokeObjectURL(this.mediaBlobUrl);
|
|
28683
|
-
}
|
|
28684
|
-
const contentUrl = this.createContentUrlV2(this.options.representation.content.url_template);
|
|
28685
|
-
this.fetchContentAsBlobUrl(contentUrl).then(blobUrl => {
|
|
28686
|
-
this.mediaBlobUrl = blobUrl;
|
|
28687
|
-
this.mediaUrl = blobUrl;
|
|
28688
|
-
this.mediaEl.src = blobUrl;
|
|
28689
|
-
}).catch(this.handleAssetError);
|
|
28690
|
-
return;
|
|
28622
|
+
if (this.mediaBlobUrl) {
|
|
28623
|
+
URL.revokeObjectURL(this.mediaBlobUrl);
|
|
28691
28624
|
}
|
|
28692
|
-
|
|
28693
|
-
this.
|
|
28625
|
+
const contentUrl = this.createContentUrlV2(this.options.representation.content.url_template);
|
|
28626
|
+
this.fetchContentAsBlobUrl(contentUrl).then(blobUrl => {
|
|
28627
|
+
this.mediaBlobUrl = blobUrl;
|
|
28628
|
+
this.mediaUrl = blobUrl;
|
|
28629
|
+
this.mediaEl.src = blobUrl;
|
|
28630
|
+
}).catch(this.handleAssetError);
|
|
28694
28631
|
}
|
|
28695
28632
|
|
|
28696
28633
|
/**
|
|
@@ -32659,19 +32596,22 @@ class VideoBaseViewer extends media_MediaBaseViewer {
|
|
|
32659
32596
|
height: this.wrapperEl.clientHeight - controlsHeight
|
|
32660
32597
|
};
|
|
32661
32598
|
}
|
|
32662
|
-
|
|
32663
|
-
|
|
32664
|
-
|
|
32665
|
-
URL.revokeObjectURL(this.preloadBlobUrl);
|
|
32666
|
-
}
|
|
32667
|
-
this.fetchContentAsBlobUrl(contentUrl).then(blobUrl => {
|
|
32668
|
-
this.preloadBlobUrl = blobUrl;
|
|
32669
|
-
this.preloader.showPreload(blobUrl, this.mediaContainerEl, options);
|
|
32670
|
-
}).catch(this.handleAssetError);
|
|
32671
|
-
} else {
|
|
32672
|
-
const preloadUrlWithAuth = this.createContentUrlWithAuthParams(template);
|
|
32673
|
-
this.preloader.showPreload(preloadUrlWithAuth, this.mediaContainerEl, options);
|
|
32599
|
+
const contentUrl = this.createContentUrlV2(template);
|
|
32600
|
+
if (this.preloadBlobUrl) {
|
|
32601
|
+
URL.revokeObjectURL(this.preloadBlobUrl);
|
|
32674
32602
|
}
|
|
32603
|
+
this.fetchContentAsBlobUrl(contentUrl).then(blobUrl => {
|
|
32604
|
+
if (this.isDestroyed()) {
|
|
32605
|
+
URL.revokeObjectURL(blobUrl);
|
|
32606
|
+
return;
|
|
32607
|
+
}
|
|
32608
|
+
this.preloadBlobUrl = blobUrl;
|
|
32609
|
+
this.preloader.showPreload(blobUrl, this.mediaContainerEl, options);
|
|
32610
|
+
}).catch(err => {
|
|
32611
|
+
// Poster is a non-critical first-frame enhancement.
|
|
32612
|
+
// Warn so prod 401s leave a breadcrumb in DevTools.
|
|
32613
|
+
console.warn('Video preload failed', err); // eslint-disable-line no-console
|
|
32614
|
+
});
|
|
32675
32615
|
this.mediaEl.classList.add(CLASS_INVISIBLE);
|
|
32676
32616
|
}
|
|
32677
32617
|
|
|
@@ -32712,18 +32652,13 @@ class VideoBaseViewer extends media_MediaBaseViewer {
|
|
|
32712
32652
|
if (!preloadRep || !this.isRepresentationReady(preloadRep) || !preloadRep.content?.url_template) {
|
|
32713
32653
|
return;
|
|
32714
32654
|
}
|
|
32715
|
-
|
|
32716
|
-
|
|
32717
|
-
|
|
32718
|
-
|
|
32719
|
-
|
|
32720
|
-
|
|
32721
|
-
}
|
|
32722
|
-
const preloadUrlWithAuth = this.createContentUrlWithAuthParams(preloadRep.content.url_template);
|
|
32723
|
-
this.api.get(preloadUrlWithAuth, {
|
|
32724
|
-
type: 'blob'
|
|
32725
|
-
}).catch(() => {});
|
|
32726
|
-
}
|
|
32655
|
+
const contentUrl = this.createContentUrlV2(preloadRep.content.url_template);
|
|
32656
|
+
this.api.get(contentUrl, {
|
|
32657
|
+
type: 'blob',
|
|
32658
|
+
headers: this.appendAuthHeader()
|
|
32659
|
+
}).catch(err => {
|
|
32660
|
+
console.warn('Video preload prefetch failed', err); // eslint-disable-line no-console
|
|
32661
|
+
});
|
|
32727
32662
|
}
|
|
32728
32663
|
buildPlayButtonWithSeekButtons() {
|
|
32729
32664
|
this.playContainerEl = this.mediaContainerEl.appendChild(document.createElement('div'));
|
|
@@ -33757,6 +33692,7 @@ const FilmstripV2_FILMSTRIP_FRAMES_PER_ROW = 100;
|
|
|
33757
33692
|
const FILMSTRIP_SOURCE_FRAME_HEIGHT = 90;
|
|
33758
33693
|
const FILMSTRIP_DISPLAY_HEIGHT = 135;
|
|
33759
33694
|
const FILMSTRIP_DISPLAY_WIDTH = 240;
|
|
33695
|
+
const FILMSTRIP_DISPLAY_SCALE = FILMSTRIP_DISPLAY_HEIGHT / FILMSTRIP_SOURCE_FRAME_HEIGHT;
|
|
33760
33696
|
function FilmstripV2({
|
|
33761
33697
|
aspectRatio = 0,
|
|
33762
33698
|
fps,
|
|
@@ -33769,14 +33705,13 @@ function FilmstripV2({
|
|
|
33769
33705
|
}) {
|
|
33770
33706
|
const [isLoading, setIsLoading] = __WEBPACK_EXTERNAL_MODULE_react_default__.useState(true);
|
|
33771
33707
|
const [imageWidth, setImageWidth] = __WEBPACK_EXTERNAL_MODULE_react_default__.useState(0);
|
|
33772
|
-
const frameNumber = Math.floor(time / interval);
|
|
33773
|
-
const frameRow = Math.floor(frameNumber / FilmstripV2_FILMSTRIP_FRAMES_PER_ROW);
|
|
33708
|
+
const frameNumber = Math.floor(time / interval); // Current frame based on current time
|
|
33709
|
+
const frameRow = Math.floor(frameNumber / FilmstripV2_FILMSTRIP_FRAMES_PER_ROW); // Row number if there is more than one row
|
|
33774
33710
|
const sourceFrameWidth = imageWidth ? Math.floor(imageWidth / FilmstripV2_FILMSTRIP_FRAMES_PER_ROW) : Math.floor(aspectRatio * FILMSTRIP_SOURCE_FRAME_HEIGHT) || Math.floor(FILMSTRIP_DISPLAY_WIDTH * (FILMSTRIP_SOURCE_FRAME_HEIGHT / FILMSTRIP_DISPLAY_HEIGHT));
|
|
33775
|
-
const
|
|
33776
|
-
const
|
|
33777
|
-
|
|
33778
|
-
const
|
|
33779
|
-
const backgroundWidth = imageWidth ? imageWidth * scale : undefined;
|
|
33711
|
+
const frameBackgroundLeft = -(frameNumber % FilmstripV2_FILMSTRIP_FRAMES_PER_ROW) * sourceFrameWidth; // Frame position in its row
|
|
33712
|
+
const frameBackgroundTop = -(frameRow * FILMSTRIP_SOURCE_FRAME_HEIGHT); // Row position in its filmstrip
|
|
33713
|
+
|
|
33714
|
+
const displayWidth = Math.floor(sourceFrameWidth * FILMSTRIP_DISPLAY_SCALE) || FILMSTRIP_DISPLAY_WIDTH;
|
|
33780
33715
|
const cardWidth = displayWidth + 24;
|
|
33781
33716
|
const filmstripLeft = Math.min(Math.max(0, position - cardWidth / 2), positionMax - cardWidth);
|
|
33782
33717
|
__WEBPACK_EXTERNAL_MODULE_react_default__.useEffect(() => {
|
|
@@ -33800,14 +33735,21 @@ function FilmstripV2({
|
|
|
33800
33735
|
className: "bp-FilmstripV2-frame",
|
|
33801
33736
|
"data-testid": "bp-FilmstripV2-frame",
|
|
33802
33737
|
style: {
|
|
33803
|
-
backgroundImage: imageUrl ? `url('${imageUrl}')` : '',
|
|
33804
|
-
backgroundPositionX: backgroundLeft,
|
|
33805
|
-
backgroundPositionY: backgroundTop,
|
|
33806
|
-
backgroundSize: backgroundWidth ? `${backgroundWidth}px auto` : undefined,
|
|
33807
33738
|
height: FILMSTRIP_DISPLAY_HEIGHT,
|
|
33808
33739
|
width: displayWidth
|
|
33809
33740
|
}
|
|
33810
|
-
},
|
|
33741
|
+
}, !!imageUrl && /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement("div", {
|
|
33742
|
+
className: "bp-FilmstripV2-frameImage",
|
|
33743
|
+
"data-testid": "bp-FilmstripV2-frameImage",
|
|
33744
|
+
style: {
|
|
33745
|
+
backgroundImage: `url('${imageUrl}')`,
|
|
33746
|
+
backgroundPositionX: frameBackgroundLeft,
|
|
33747
|
+
backgroundPositionY: frameBackgroundTop,
|
|
33748
|
+
height: FILMSTRIP_SOURCE_FRAME_HEIGHT,
|
|
33749
|
+
transform: `scale(${FILMSTRIP_DISPLAY_SCALE})`,
|
|
33750
|
+
width: sourceFrameWidth
|
|
33751
|
+
}
|
|
33752
|
+
}), isLoading && /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement("div", {
|
|
33811
33753
|
className: "bp-crawler",
|
|
33812
33754
|
"data-testid": "bp-FilmstripV2-crawler"
|
|
33813
33755
|
}, /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement("div", null), /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement("div", null), /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement("div", null))), /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement("div", {
|
|
@@ -34800,7 +34742,7 @@ class DashViewer extends media_VideoBaseViewer {
|
|
|
34800
34742
|
this.filmstripStatus.destroy();
|
|
34801
34743
|
}
|
|
34802
34744
|
|
|
34803
|
-
// Release blob: URL allocated for the filmstrip
|
|
34745
|
+
// Release blob: URL allocated for the filmstrip
|
|
34804
34746
|
if (this.filmstripUrl && this.filmstripUrl.startsWith('blob:')) {
|
|
34805
34747
|
URL.revokeObjectURL(this.filmstripUrl);
|
|
34806
34748
|
}
|
|
@@ -34878,17 +34820,11 @@ class DashViewer extends media_VideoBaseViewer {
|
|
|
34878
34820
|
} = this.options;
|
|
34879
34821
|
if (content && this.isRepresentationReady(representation)) {
|
|
34880
34822
|
const template = representation.content.url_template;
|
|
34881
|
-
|
|
34882
|
-
|
|
34883
|
-
|
|
34884
|
-
|
|
34885
|
-
|
|
34886
|
-
});
|
|
34887
|
-
} else {
|
|
34888
|
-
this.api.get(this.createContentUrlWithAuthParams(template, MANIFEST), {
|
|
34889
|
-
type: 'document'
|
|
34890
|
-
});
|
|
34891
|
-
}
|
|
34823
|
+
const contentUrl = this.createContentUrlV2(template, MANIFEST);
|
|
34824
|
+
this.api.get(contentUrl, {
|
|
34825
|
+
type: 'document',
|
|
34826
|
+
headers: this.appendAuthHeader()
|
|
34827
|
+
});
|
|
34892
34828
|
}
|
|
34893
34829
|
}
|
|
34894
34830
|
|
|
@@ -35014,7 +34950,7 @@ class DashViewer extends media_VideoBaseViewer {
|
|
|
35014
34950
|
}
|
|
35015
34951
|
|
|
35016
34952
|
/**
|
|
35017
|
-
*
|
|
34953
|
+
* Rewrites representation URIs without an access token and attaches Authorization headers.
|
|
35018
34954
|
* Manifest type will use an asset name. Segments will not.
|
|
35019
34955
|
*
|
|
35020
34956
|
* @private
|
|
@@ -35025,28 +34961,16 @@ class DashViewer extends media_VideoBaseViewer {
|
|
|
35025
34961
|
requestFilter(type, request) {
|
|
35026
34962
|
const asset = type === shaka.net.NetworkingEngine.RequestType.MANIFEST ? MANIFEST : undefined;
|
|
35027
34963
|
/* eslint-disable no-param-reassign */
|
|
35028
|
-
|
|
35029
|
-
|
|
35030
|
-
|
|
35031
|
-
|
|
35032
|
-
|
|
35033
|
-
|
|
35034
|
-
|
|
35035
|
-
|
|
35036
|
-
|
|
35037
|
-
|
|
35038
|
-
DashViewer_extends(request.headers, this.appendAuthHeader());
|
|
35039
|
-
} else {
|
|
35040
|
-
request.uris = request.uris.map(uri => {
|
|
35041
|
-
let newUri = this.createContentUrlWithAuthParams(uri, asset);
|
|
35042
|
-
if (asset !== MANIFEST && this.options.file.watermark_info.is_watermarked) {
|
|
35043
|
-
newUri = appendQueryParams(newUri, {
|
|
35044
|
-
watermark_content: this.watermarkCacheBust
|
|
35045
|
-
});
|
|
35046
|
-
}
|
|
35047
|
-
return newUri;
|
|
35048
|
-
});
|
|
35049
|
-
}
|
|
34964
|
+
request.uris = request.uris.map(uri => {
|
|
34965
|
+
let newUri = this.createContentUrlV2(uri, asset);
|
|
34966
|
+
if (asset !== MANIFEST && this.options.file.watermark_info.is_watermarked) {
|
|
34967
|
+
newUri = appendQueryParams(newUri, {
|
|
34968
|
+
watermark_content: this.watermarkCacheBust
|
|
34969
|
+
});
|
|
34970
|
+
}
|
|
34971
|
+
return newUri;
|
|
34972
|
+
});
|
|
34973
|
+
request.headers = DashViewer_extends(request.headers || {}, this.appendAuthHeader());
|
|
35050
34974
|
/* eslint-enable no-param-reassign */
|
|
35051
34975
|
}
|
|
35052
34976
|
|
|
@@ -35609,29 +35533,14 @@ class DashViewer extends media_VideoBaseViewer {
|
|
|
35609
35533
|
const filmstrip = getRepresentation(this.options.file, 'filmstrip');
|
|
35610
35534
|
const filmstripInterval = filmstrip && filmstrip.metadata && filmstrip.metadata.interval;
|
|
35611
35535
|
if (filmstripInterval > 0) {
|
|
35612
|
-
const useHeaders = this.featureEnabled('migrateAccessTokenToHeader');
|
|
35613
35536
|
const useReactControls = this.useReactControls();
|
|
35614
|
-
const url =
|
|
35537
|
+
const url = this.createContentUrlV2(filmstrip.content.url_template);
|
|
35615
35538
|
this.filmstripInterval = filmstripInterval;
|
|
35616
35539
|
this.filmstripStatus = this.getRepStatus(filmstrip);
|
|
35617
|
-
|
|
35618
|
-
|
|
35619
|
-
this.filmstripUrl = useHeaders ? null : url;
|
|
35620
|
-
|
|
35621
|
-
// Legacy controls have a synchronous init path when the URL already carries a token.
|
|
35622
|
-
if (!useHeaders && !useReactControls) {
|
|
35623
|
-
this.mediaControls.initFilmstrip(url, this.filmstripStatus, this.aspect, filmstripInterval);
|
|
35624
|
-
return;
|
|
35625
|
-
}
|
|
35626
|
-
this.filmstripStatus.getPromise().then(() => useHeaders ? this.fetchContentAsBlobUrl(url) : url).then(filmstripUrl => {
|
|
35627
|
-
// <img src> can't carry an Authorization header, so when the access-token has
|
|
35628
|
-
// been migrated out of the URL we expose the rep as a blob: URL instead.
|
|
35629
|
-
// If the viewer was destroyed while we were fetching, release the blob now —
|
|
35630
|
-
// destroy() can't see it because filmstripUrl was still null when it ran.
|
|
35540
|
+
this.filmstripUrl = null;
|
|
35541
|
+
this.filmstripStatus.getPromise().then(() => this.fetchContentAsBlobUrl(url)).then(filmstripUrl => {
|
|
35631
35542
|
if (this.destroyed) {
|
|
35632
|
-
|
|
35633
|
-
URL.revokeObjectURL(filmstripUrl);
|
|
35634
|
-
}
|
|
35543
|
+
URL.revokeObjectURL(filmstripUrl);
|
|
35635
35544
|
return;
|
|
35636
35545
|
}
|
|
35637
35546
|
this.filmstripUrl = filmstripUrl;
|
|
@@ -35641,9 +35550,8 @@ class DashViewer extends media_VideoBaseViewer {
|
|
|
35641
35550
|
this.mediaControls.initFilmstrip(filmstripUrl, this.filmstripStatus, this.aspect, filmstripInterval);
|
|
35642
35551
|
}
|
|
35643
35552
|
})
|
|
35644
|
-
// Filmstrip is a non-critical scrubbing-preview enhancement
|
|
35645
|
-
//
|
|
35646
|
-
// the whole viewer. Warn so prod 401s leave a breadcrumb in DevTools.
|
|
35553
|
+
// Filmstrip is a non-critical scrubbing-preview enhancement.
|
|
35554
|
+
// Warn so prod 401s leave a breadcrumb in DevTools.
|
|
35647
35555
|
.catch(err => {
|
|
35648
35556
|
console.warn('Filmstrip load failed', err); // eslint-disable-line no-console
|
|
35649
35557
|
});
|
|
@@ -35664,7 +35572,7 @@ class DashViewer extends media_VideoBaseViewer {
|
|
|
35664
35572
|
if (!extractedText?.content?.url_template) {
|
|
35665
35573
|
return;
|
|
35666
35574
|
}
|
|
35667
|
-
const transcriptionUrl = this.
|
|
35575
|
+
const transcriptionUrl = this.createContentUrlV2(extractedText.content.url_template);
|
|
35668
35576
|
this.transcriptionStatus = this.getRepStatus(extractedText);
|
|
35669
35577
|
try {
|
|
35670
35578
|
await this.transcriptionStatus.getPromise();
|
|
@@ -40664,15 +40572,14 @@ class DocBaseViewer extends viewers_BaseViewer {
|
|
|
40664
40572
|
const pagedWebpRepReady = pagedWebpRep && this.isRepresentationReady(pagedWebpRep) && pagedWebpRep.content?.url_template;
|
|
40665
40573
|
const jpegRepReady = jpegPreloadRep && this.isRepresentationReady(jpegPreloadRep) && jpegPreloadRep.content?.url_template;
|
|
40666
40574
|
const onlyJpegRepAvailable = jpegRepReady && !pagedWebpRepReady;
|
|
40667
|
-
const
|
|
40668
|
-
const headersOption = useHeaders ? {
|
|
40575
|
+
const headersOption = {
|
|
40669
40576
|
headers: this.appendAuthHeader()
|
|
40670
|
-
}
|
|
40577
|
+
};
|
|
40671
40578
|
if (onlyJpegRepAvailable) {
|
|
40672
40579
|
const {
|
|
40673
40580
|
url_template: jpegUrlTemplate = ''
|
|
40674
40581
|
} = jpegPreloadRep.content;
|
|
40675
|
-
const jpegUrlAuthTemplate =
|
|
40582
|
+
const jpegUrlAuthTemplate = this.createContentUrlV2(jpegUrlTemplate);
|
|
40676
40583
|
const promises = getPreloadImageRequestPromises(this.api, jpegUrlAuthTemplate, 1, '', headersOption);
|
|
40677
40584
|
Promise.all(promises).then(() => {
|
|
40678
40585
|
this.preloaderImagesPrefetched = true;
|
|
@@ -40683,7 +40590,7 @@ class DocBaseViewer extends viewers_BaseViewer {
|
|
|
40683
40590
|
} = pagedWebpRep.content;
|
|
40684
40591
|
const pageCount = pagedWebpRep.metadata?.pages || 8;
|
|
40685
40592
|
const newPagedUrlTemplate = pagedUrlTemplate.replace(/\{.*\}/, DocBaseViewer_PAGED_URL_TEMPLATE_PAGE_NUMBER_HOLDER);
|
|
40686
|
-
const pagedUrlAuthTemplate =
|
|
40593
|
+
const pagedUrlAuthTemplate = this.createContentUrlV2(newPagedUrlTemplate);
|
|
40687
40594
|
if (docFirstPagesConfig && docFirstPagesConfig.priorityPages) {
|
|
40688
40595
|
const {
|
|
40689
40596
|
priorityPages,
|
|
@@ -40748,19 +40655,11 @@ class DocBaseViewer extends viewers_BaseViewer {
|
|
|
40748
40655
|
const {
|
|
40749
40656
|
url_template: template
|
|
40750
40657
|
} = preloadRep.content;
|
|
40751
|
-
|
|
40752
|
-
|
|
40753
|
-
|
|
40754
|
-
|
|
40755
|
-
|
|
40756
|
-
type: 'blob',
|
|
40757
|
-
headers: this.appendAuthHeader()
|
|
40758
|
-
});
|
|
40759
|
-
} else {
|
|
40760
|
-
this.api.get(this.createContentUrlWithAuthParams(template), {
|
|
40761
|
-
type: 'blob'
|
|
40762
|
-
});
|
|
40763
|
-
}
|
|
40658
|
+
const contentUrl = this.createContentUrlV2(template);
|
|
40659
|
+
this.api.get(contentUrl, {
|
|
40660
|
+
type: 'blob',
|
|
40661
|
+
headers: this.appendAuthHeader()
|
|
40662
|
+
});
|
|
40764
40663
|
}
|
|
40765
40664
|
} else {
|
|
40766
40665
|
this.prefetchPreloaderImages(file);
|
|
@@ -40770,17 +40669,11 @@ class DocBaseViewer extends viewers_BaseViewer {
|
|
|
40770
40669
|
const {
|
|
40771
40670
|
url_template: template
|
|
40772
40671
|
} = representation.content;
|
|
40773
|
-
|
|
40774
|
-
|
|
40775
|
-
|
|
40776
|
-
|
|
40777
|
-
|
|
40778
|
-
});
|
|
40779
|
-
} else {
|
|
40780
|
-
this.api.get(this.createContentUrlWithAuthParams(template), {
|
|
40781
|
-
type: 'document'
|
|
40782
|
-
});
|
|
40783
|
-
}
|
|
40672
|
+
const contentUrl = this.createContentUrlV2(template);
|
|
40673
|
+
this.api.get(contentUrl, {
|
|
40674
|
+
type: 'document',
|
|
40675
|
+
headers: this.appendAuthHeader()
|
|
40676
|
+
});
|
|
40784
40677
|
}
|
|
40785
40678
|
}
|
|
40786
40679
|
|
|
@@ -40839,11 +40732,10 @@ class DocBaseViewer extends viewers_BaseViewer {
|
|
|
40839
40732
|
const {
|
|
40840
40733
|
url_template: template = ''
|
|
40841
40734
|
} = preloadRep?.content || {};
|
|
40842
|
-
const
|
|
40843
|
-
const
|
|
40844
|
-
const headersOption = useHeaders ? {
|
|
40735
|
+
const preloadUrl = this.createContentUrlV2(template);
|
|
40736
|
+
const headersOption = {
|
|
40845
40737
|
headers: this.appendAuthHeader()
|
|
40846
|
-
}
|
|
40738
|
+
};
|
|
40847
40739
|
if (!this.docFirstPagesEnabled) {
|
|
40848
40740
|
this.startPreloadTimer();
|
|
40849
40741
|
this.preloader.showPreload(preloadUrl, this.containerEl, headersOption);
|
|
@@ -40867,7 +40759,7 @@ class DocBaseViewer extends viewers_BaseViewer {
|
|
|
40867
40759
|
url_template: pagedUrlTemplate = ''
|
|
40868
40760
|
} = preloadRepPaged?.content || {};
|
|
40869
40761
|
const newPagedUrlTemplate = pagedUrlTemplate.replace(/\{.*\}/, DocBaseViewer_PAGED_URL_TEMPLATE_PAGE_NUMBER_HOLDER);
|
|
40870
|
-
const pagedPreLoadUrl =
|
|
40762
|
+
const pagedPreLoadUrl = this.createContentUrlV2(newPagedUrlTemplate);
|
|
40871
40763
|
this.preloader.showPreload(null, this.containerEl, pagedPreLoadUrl, pageCount, this, headersOption);
|
|
40872
40764
|
}
|
|
40873
40765
|
}
|
|
@@ -40907,11 +40799,7 @@ class DocBaseViewer extends viewers_BaseViewer {
|
|
|
40907
40799
|
this.showPreload();
|
|
40908
40800
|
}
|
|
40909
40801
|
const template = this.options.representation.content.url_template;
|
|
40910
|
-
|
|
40911
|
-
this.pdfUrl = this.createContentUrlV2(template);
|
|
40912
|
-
} else {
|
|
40913
|
-
this.pdfUrl = this.createContentUrlWithAuthParams(template);
|
|
40914
|
-
}
|
|
40802
|
+
this.pdfUrl = this.createContentUrlV2(template);
|
|
40915
40803
|
let jsAssets;
|
|
40916
40804
|
let cssAssets;
|
|
40917
40805
|
const useNpmPdfjs = this.featureEnabled('useNpmPdfjs');
|
|
@@ -41310,9 +41198,7 @@ class DocBaseViewer extends viewers_BaseViewer {
|
|
|
41310
41198
|
rangeChunkSize,
|
|
41311
41199
|
url: pdfUrl
|
|
41312
41200
|
};
|
|
41313
|
-
|
|
41314
|
-
pdfDocConfig.httpHeaders = this.appendAuthHeader();
|
|
41315
|
-
}
|
|
41201
|
+
pdfDocConfig.httpHeaders = this.appendAuthHeader();
|
|
41316
41202
|
this.pdfLoadingTask = this.pdfjsLib.getDocument(pdfDocConfig);
|
|
41317
41203
|
if (this.pageTracker) {
|
|
41318
41204
|
this.addListener('preview_event_report', this.handlePreviewEventReport);
|
|
@@ -41631,13 +41517,10 @@ class DocBaseViewer extends viewers_BaseViewer {
|
|
|
41631
41517
|
* @return {Promise} Promise setting print blob
|
|
41632
41518
|
*/
|
|
41633
41519
|
fetchPrintBlob(pdfUrl) {
|
|
41634
|
-
|
|
41635
|
-
type: 'blob'
|
|
41636
|
-
|
|
41637
|
-
|
|
41638
|
-
options.headers = this.appendAuthHeader();
|
|
41639
|
-
}
|
|
41640
|
-
return this.api.get(pdfUrl, options).then(blob => {
|
|
41520
|
+
return this.api.get(pdfUrl, {
|
|
41521
|
+
type: 'blob',
|
|
41522
|
+
headers: this.appendAuthHeader()
|
|
41523
|
+
}).then(blob => {
|
|
41641
41524
|
this.printBlob = blob;
|
|
41642
41525
|
});
|
|
41643
41526
|
}
|
|
@@ -47334,7 +47217,7 @@ class OfficeViewer extends viewers_BaseViewer {
|
|
|
47334
47217
|
|
|
47335
47218
|
// This occurs in the case of .xlsb files where no pdf rep exists
|
|
47336
47219
|
if (template) {
|
|
47337
|
-
this.pdfUrl = this.
|
|
47220
|
+
this.pdfUrl = this.createContentUrlV2(template);
|
|
47338
47221
|
}
|
|
47339
47222
|
}
|
|
47340
47223
|
|
|
@@ -47494,7 +47377,8 @@ class OfficeViewer extends viewers_BaseViewer {
|
|
|
47494
47377
|
*/
|
|
47495
47378
|
fetchPrintBlob(pdfUrl) {
|
|
47496
47379
|
return this.api.get(pdfUrl, {
|
|
47497
|
-
type: 'blob'
|
|
47380
|
+
type: 'blob',
|
|
47381
|
+
headers: this.appendAuthHeader()
|
|
47498
47382
|
}).then(blob => {
|
|
47499
47383
|
this.printBlob = blob;
|
|
47500
47384
|
});
|
|
@@ -48923,8 +48807,25 @@ class Preview extends (events_default()) {
|
|
|
48923
48807
|
const params = Preview_objectSpread({
|
|
48924
48808
|
response_content_disposition_type: 'attachment'
|
|
48925
48809
|
}, queryParams);
|
|
48926
|
-
const downloadUrl = appendQueryParams(this.viewer.
|
|
48927
|
-
this.api.
|
|
48810
|
+
const downloadUrl = appendQueryParams(this.viewer.createContentUrlV2(contentUrlTemplate, this.viewer.getAssetPath()), params);
|
|
48811
|
+
this.api.get(downloadUrl, {
|
|
48812
|
+
type: 'blob',
|
|
48813
|
+
headers: this.getRequestHeaders()
|
|
48814
|
+
}).then(data => {
|
|
48815
|
+
const blob = data instanceof Blob ? data : new Blob([data]);
|
|
48816
|
+
const blobUrl = URL.createObjectURL(blob);
|
|
48817
|
+
const anchor = document.createElement('a');
|
|
48818
|
+
anchor.href = blobUrl;
|
|
48819
|
+
anchor.download = this.file && this.file.name || 'download';
|
|
48820
|
+
document.body.appendChild(anchor);
|
|
48821
|
+
anchor.click();
|
|
48822
|
+
document.body.removeChild(anchor);
|
|
48823
|
+
URL.revokeObjectURL(blobUrl);
|
|
48824
|
+
}).catch(error => {
|
|
48825
|
+
const code = getProp(error, 'response.data.code');
|
|
48826
|
+
const msg = code === ERROR_CODE_403_FORBIDDEN_BY_POLICY ? downloadErrorDueToPolicyMsg : downloadErrorMsg;
|
|
48827
|
+
this.ui.showNotification(msg);
|
|
48828
|
+
});
|
|
48928
48829
|
|
|
48929
48830
|
// Otherwise, get the content download URL of the original file and download
|
|
48930
48831
|
} else {
|
|
@@ -48995,8 +48896,7 @@ class Preview extends (events_default()) {
|
|
|
48995
48896
|
sharedLinkPassword = '',
|
|
48996
48897
|
preload = false,
|
|
48997
48898
|
isDocFirstPrefetchEnabled = false,
|
|
48998
|
-
docFirstPagesConfig = null
|
|
48999
|
-
isAccessTokenHeaderEnabled = false
|
|
48899
|
+
docFirstPagesConfig = null
|
|
49000
48900
|
}) {
|
|
49001
48901
|
let file;
|
|
49002
48902
|
let loader;
|
|
@@ -49037,9 +48937,6 @@ class Preview extends (events_default()) {
|
|
|
49037
48937
|
options.sharedLinkPassword = sharedLinkPassword;
|
|
49038
48938
|
options.isDocFirstPrefetchEnabled = isDocFirstPrefetchEnabled;
|
|
49039
48939
|
options.docFirstPagesConfig = docFirstPagesConfig;
|
|
49040
|
-
options.features = Preview_objectSpread(Preview_objectSpread({}, this.options.features), {}, {
|
|
49041
|
-
migrateAccessTokenToHeader: isAccessTokenHeaderEnabled
|
|
49042
|
-
});
|
|
49043
48940
|
}
|
|
49044
48941
|
const viewerInstance = new viewer.CONSTRUCTOR(this.createViewerOptions(options));
|
|
49045
48942
|
if (typeof viewerInstance.prefetch === 'function') {
|
|
@@ -49577,6 +49474,13 @@ class Preview extends (events_default()) {
|
|
|
49577
49474
|
return;
|
|
49578
49475
|
}
|
|
49579
49476
|
|
|
49477
|
+
// Server file info is authoritative: a video with no dash/mp4 will never play for this
|
|
49478
|
+
// account (HD video is paid). Instant Preview may have mounted a jpg-only viewer from
|
|
49479
|
+
// cache; throw error_account instead of waiting forever on an empty player.
|
|
49480
|
+
if (this.isVideoFileByExtension() && !this.hasPlayableVideoReps(file)) {
|
|
49481
|
+
throw new lib_PreviewError(ERROR_CODE.ACCOUNT, "This preview didn’t load because your account is unable to preview this file type. Please try to open or download the file to view.");
|
|
49482
|
+
}
|
|
49483
|
+
|
|
49580
49484
|
// Should load viewer for first time if:
|
|
49581
49485
|
// - File isn't cached OR
|
|
49582
49486
|
// - Cached file doesn't have a valid structure
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "box-content-preview",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.79.0",
|
|
4
4
|
"description": "Box Content Preview UI Element",
|
|
5
5
|
"author": "Box (https://www.box.com/)",
|
|
6
6
|
"license": "SEE LICENSE IN LICENSE",
|
|
@@ -49,7 +49,7 @@
|
|
|
49
49
|
"@babel/plugin-proposal-class-properties": "^7.18.6",
|
|
50
50
|
"@babel/plugin-proposal-object-rest-spread": "^7.18.6",
|
|
51
51
|
"@babel/plugin-transform-object-assign": "^7.18.6",
|
|
52
|
-
"@babel/preset-env": "^7.
|
|
52
|
+
"@babel/preset-env": "^7.24.7",
|
|
53
53
|
"@babel/preset-react": "^7.18.6",
|
|
54
54
|
"@babel/preset-typescript": "^7.18.6",
|
|
55
55
|
"@box/blueprint-web": "^14.41.0",
|
|
@@ -80,8 +80,8 @@
|
|
|
80
80
|
"box-ui-elements": "^20.0.0",
|
|
81
81
|
"chai": "^4.2.0",
|
|
82
82
|
"classnames": "^2.2.6",
|
|
83
|
-
"conventional-changelog
|
|
84
|
-
"conventional-
|
|
83
|
+
"conventional-changelog": "^8.1.3",
|
|
84
|
+
"conventional-changelog-conventionalcommits": "^10.3.0",
|
|
85
85
|
"create-react-class": "^15.6.2",
|
|
86
86
|
"css-loader": "^6.11.0",
|
|
87
87
|
"css-minimizer-webpack-plugin": "^8.0.0",
|
|
@@ -89,7 +89,6 @@
|
|
|
89
89
|
"eslint": "^8.43.0",
|
|
90
90
|
"eslint-config-airbnb": "^18.0.1",
|
|
91
91
|
"eslint-config-prettier": "^6.7.0",
|
|
92
|
-
"eslint-import-resolver-webpack": "^0.11.1",
|
|
93
92
|
"eslint-plugin-babel": "^5.3.0",
|
|
94
93
|
"eslint-plugin-chai-friendly": "^0.4.1",
|
|
95
94
|
"eslint-plugin-cypress": "^2.8.1",
|
|
@@ -114,7 +113,6 @@
|
|
|
114
113
|
"lodash": "^4.18.1",
|
|
115
114
|
"mini-css-extract-plugin": "^2.10.2",
|
|
116
115
|
"mock-local-storage": "^1.1.15",
|
|
117
|
-
"mojito-rb-gen": "^0.0.1",
|
|
118
116
|
"npm-run-all": "^4.1.5",
|
|
119
117
|
"postcss": "^8.5.18",
|
|
120
118
|
"postcss-loader": "^8.1.1",
|
|
@@ -149,7 +147,7 @@
|
|
|
149
147
|
"build": "yarn setup && yarn clean && yarn build:i18n && yarn build:dev",
|
|
150
148
|
"build:ci": "yarn setup && yarn webpack --progress --config build/webpack.config.js",
|
|
151
149
|
"build:dev": "BABEL_ENV=dev NODE_ENV=dev yarn webpack --progress --config build/webpack.config.js",
|
|
152
|
-
"build:i18n": "
|
|
150
|
+
"build:i18n": "node build/buildI18n.js",
|
|
153
151
|
"build:lib": "yarn build:i18n && yarn build:lib:js && yarn build:lib:verify && yarn build:lib:types",
|
|
154
152
|
"build:lib:verify": "node build/verifyLibBundle.js",
|
|
155
153
|
"build:lib:js": "BABEL_ENV=production NODE_ENV=production yarn webpack --config build/webpack.config.lib.js",
|