@thefittingroom/shop-ui 3.2.3 → 4.2.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.
Files changed (70) hide show
  1. package/dist/index.js +22270 -0
  2. package/dist/index.umd.cjs +22274 -0
  3. package/package.json +20 -22
  4. package/.env.dev +0 -2
  5. package/.env.example +0 -3
  6. package/.env.prod +0 -2
  7. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/ErrorModal.js +0 -43
  8. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/ErrorModal.js.map +0 -1
  9. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/FitModal.js +0 -106
  10. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/FitModal.js.map +0 -1
  11. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/ForgotPasswordModal.js +0 -43
  12. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/ForgotPasswordModal.js.map +0 -1
  13. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/LoadingAvatarModal.js +0 -38
  14. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/LoadingAvatarModal.js.map +0 -1
  15. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/LoggedOutModal.js +0 -36
  16. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/LoggedOutModal.js.map +0 -1
  17. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/ModalManager.js +0 -107
  18. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/ModalManager.js.map +0 -1
  19. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/NoAvatarModal.js +0 -19
  20. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/NoAvatarModal.js.map +0 -1
  21. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/ResetLinkModal.js +0 -31
  22. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/ResetLinkModal.js.map +0 -1
  23. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/ScanCodeModal.js +0 -77
  24. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/ScanCodeModal.js.map +0 -1
  25. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/SignInModal.js +0 -94
  26. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/SignInModal.js.map +0 -1
  27. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/SizeErrorModal.js +0 -43
  28. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/SizeErrorModal.js.map +0 -1
  29. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/TryOnModal.js +0 -51
  30. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Modals/TryOnModal.js.map +0 -1
  31. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/SizeRec.js +0 -365
  32. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/SizeRec.js.map +0 -1
  33. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Vto.js +0 -52
  34. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/Vto.js.map +0 -1
  35. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/index.js +0 -16
  36. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/index.js.map +0 -1
  37. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/locale.js +0 -108
  38. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/locale.js.map +0 -1
  39. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/slider.js +0 -44
  40. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/slider.js.map +0 -1
  41. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/svgs.js +0 -33
  42. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/svgs.js.map +0 -1
  43. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/uiError.js +0 -8
  44. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/components/uiError.js.map +0 -1
  45. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/helpers/telephone.js +0 -12368
  46. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/helpers/telephone.js.map +0 -1
  47. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/helpers/validations.js +0 -15
  48. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/helpers/validations.js.map +0 -1
  49. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/index.js +0 -3
  50. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/index.js.map +0 -1
  51. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/init.js +0 -7
  52. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/init.js.map +0 -1
  53. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/styles/index.js +0 -12
  54. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/styles/index.js.map +0 -1
  55. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/tfr-modal.js +0 -77
  56. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/tfr-modal.js.map +0 -1
  57. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/tfr-size-rec.js +0 -202
  58. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/tfr-size-rec.js.map +0 -1
  59. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/tfr.js +0 -212
  60. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/tfr.js.map +0 -1
  61. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/types/index.js +0 -15
  62. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/esm/types/index.js.map +0 -1
  63. package/.rollup.cache/home/runner/work/shop-sdk-ui/shop-sdk-ui/dist/tsconfig.tsbuildinfo +0 -1
  64. package/README.md +0 -153
  65. package/dist/esm/index.js +0 -28142
  66. package/dist/esm/index.js.map +0 -1
  67. package/dist/esm/index.min.js +0 -3399
  68. package/dist/esm/index.min.js.map +0 -1
  69. package/dist/tsconfig.tsbuildinfo +0 -1
  70. package/index.html +0 -126
@@ -1,365 +0,0 @@
1
- import { infoIcon, tfrDoor, userIcon } from './svgs';
2
- export class SizeRecComponent {
3
- constructor(sizeRecMainDivId, onSignInClick, onSignOutClick, onFitInfoClick, onTryOnClick) {
4
- this.onSignInClick = onSignInClick;
5
- this.onSignOutClick = onSignOutClick;
6
- this.onFitInfoClick = onFitInfoClick;
7
- this.onTryOnClick = onTryOnClick;
8
- this._sku = '';
9
- this._styleId = null;
10
- this.tfrLoggedInElements = [];
11
- this.tfrLoggedOutElements = [];
12
- this.tfrToggleOpenElements = [];
13
- this.tfrToggleClosedElements = [];
14
- this.isCollapsed = false;
15
- this.redraw = null;
16
- this.init(sizeRecMainDivId);
17
- }
18
- get sku() {
19
- return this._sku;
20
- }
21
- setSku(sku) {
22
- this._sku = sku;
23
- }
24
- get styleId() {
25
- return this._styleId;
26
- }
27
- setStyleId(styleId) {
28
- this._styleId = styleId;
29
- }
30
- setIsLoggedIn(isLoggedIn) {
31
- this.tfrSizeRecSelectContainer.style.display = 'flex';
32
- this.tfrSizeRecSelect.style.display = 'flex';
33
- this.tfrSizeHowItFits.style.display = 'block';
34
- if (isLoggedIn) {
35
- this.tfrSizeHowItFits.style.opacity = '1';
36
- this.tfrSizeRecSelect.style.opacity = '1';
37
- this.tfrLoggedInElements.forEach((element) => (element.style.display = 'block'));
38
- this.tfrLoggedOutElements.forEach((element) => (element.style.display = 'none'));
39
- this.tfrSizeRecActionLogin.style.display = 'none';
40
- this.tfrSizeRecActionLogout.style.display = 'block';
41
- this.tfrSizeRecTitle.style.display = 'flex';
42
- this.isCollapsed = false;
43
- this.tfrSizeRecTitleToggle.classList.add('tfr-chevron-up');
44
- this.tfrSizeRecTitleToggle.classList.remove('tfr-chevron-down');
45
- // Ensure the container is visible
46
- this.tfrSizeRecSelectContainer.style.display = 'flex';
47
- this.tfrSizeRecSelectContainer.style.opacity = '1';
48
- }
49
- else {
50
- this.tfrSizeHowItFits.style.opacity = '0.4';
51
- this.tfrSizeRecSelect.style.opacity = '0.4';
52
- this.tfrLoggedInElements.forEach((element) => (element.style.display = 'none'));
53
- this.tfrLoggedOutElements.forEach((element) => (element.style.display = 'block'));
54
- this.tfrSizeRecActionLogin.style.display = 'block';
55
- this.tfrSizeRecActionLogout.style.display = 'none';
56
- this.tfrSizeRecTitle.style.display = 'flex';
57
- this.tfrSizeRecommendationError.style.display = 'none';
58
- this.tfrSizeRecommendationError.innerHTML = '';
59
- this.renderSizeRecSelectLoggedOut();
60
- }
61
- }
62
- setLoading(isLoading) {
63
- if (isLoading) {
64
- this.tfrSizeRecLoading.style.display = 'block';
65
- this.tfrSizeRecommendationsContainer.style.display = 'none';
66
- }
67
- else {
68
- this.tfrSizeRecLoading.style.display = 'none';
69
- this.tfrSizeRecommendationsContainer.style.display = 'flex';
70
- }
71
- }
72
- setGarmentLocations(locations) {
73
- if (!locations || !locations.length) {
74
- this.tfrSizeRecTitle.style.display = 'none';
75
- return;
76
- }
77
- this.renderGarmentLocations(locations);
78
- }
79
- setRecommendedSize({ recommended, sizes }) {
80
- this.renderSizeRec(recommended, sizes);
81
- }
82
- hide() {
83
- if (this.sizeRecMainDiv) {
84
- this.sizeRecMainDiv.style.display = 'none';
85
- }
86
- }
87
- show() {
88
- if (this.sizeRecMainDiv) {
89
- this.sizeRecMainDiv.style.display = 'block';
90
- }
91
- }
92
- init(sizeRecMainDivId) {
93
- const sizeRecMainDiv = document.getElementById(sizeRecMainDivId);
94
- if (!sizeRecMainDiv)
95
- throw new Error('Size rec main div not found');
96
- this.sizeRecMainDiv = sizeRecMainDiv;
97
- this.render(sizeRecMainDiv);
98
- this.setElements();
99
- this.bindEvents();
100
- }
101
- setElements() {
102
- this.tfrSizeHowItFits = document.getElementById('tfr-size-how-it-fits');
103
- this.tfrSizeRecTitle = document.getElementById('tfr-size-rec-title');
104
- this.tfrInfoIcon = document.getElementById('tfr-info-icon');
105
- this.tfrLoginToView = document.getElementById('tfr-login-to-view');
106
- this.tfrSizeRecActionLogin = document.getElementById('tfr-size-rec-action-login');
107
- this.tfrSizeRecActionLogout = document.getElementById('tfr-size-rec-action-logout');
108
- this.tfrSizeRecTable = document.getElementById('tfr-size-rec-table');
109
- this.tfrSizeRecommendationError = document.getElementById('tfr-size-recommendation-error');
110
- this.tfrSizeRecSize = document.getElementById('tfr-size-rec-size');
111
- this.tfrSizeRecSelect = document.getElementById('tfr-size-rec-select');
112
- this.tfrSizeRecLoading = document.getElementById('tfr-size-rec-loading');
113
- this.tfrSizeRecTitleToggle = document.getElementById('tfr-size-rec-title-toggle');
114
- this.tfrSizeRecSelectContainer = document.getElementById('tfr-size-rec-select-container');
115
- this.tfrSizeRecommendationsContainer = document.getElementById('tfr-size-recommendations-container');
116
- this.tfrLoggedInElements = document.querySelectorAll('.tfr-logged-in');
117
- this.tfrLoggedOutElements = document.querySelectorAll('.tfr-logged-out');
118
- this.tfrToggleOpenElements = document.querySelectorAll('.tfr-toggle-open');
119
- this.tfrToggleClosedElements = document.querySelectorAll('.tfr-toggle-closed');
120
- }
121
- bindEvents() {
122
- this.tfrSizeRecActionLogin.addEventListener('click', this.onSignInClick);
123
- this.tfrSizeRecActionLogout.addEventListener('click', this.onSignOutClick);
124
- this.tfrSizeRecSelect.addEventListener('click', this.onSizeRecSelectClick.bind(this));
125
- this.tfrSizeRecTitleToggle.addEventListener('click', this.toggletSizeRecSelectContainer.bind(this));
126
- this.tfrInfoIcon.addEventListener('click', this.onFitInfoClick);
127
- this.tfrLoginToView.addEventListener('click', this.onSignInClick);
128
- const tryOnButton = document.getElementById('tfr-try-on-button');
129
- if (!tryOnButton)
130
- return;
131
- tryOnButton.addEventListener('click', async () => {
132
- // Prevent multiple clicks while loading
133
- if (tryOnButton.classList.contains('loading')) {
134
- return;
135
- }
136
- const activeButton = document.querySelector('.tfr-size-rec-select-button.active');
137
- if (!activeButton)
138
- return;
139
- const selectedSizeId = Number(activeButton.getAttribute('data-size-id'));
140
- if (Number.isNaN(selectedSizeId))
141
- return;
142
- // Set loading state
143
- tryOnButton.classList.add('loading');
144
- const originalText = tryOnButton.textContent;
145
- tryOnButton.textContent = ' ';
146
- tryOnButton.setAttribute('disabled', 'true');
147
- try {
148
- // Get all size buttons
149
- const allSizeButtons = Array.from(document.querySelectorAll('.tfr-size-rec-select-button'));
150
- const activeIndex = allSizeButtons.indexOf(activeButton);
151
- if (this.styleId !== null) {
152
- // 1. Fetch and display the VTO for the active (recommended) size
153
- try {
154
- await this.onTryOnClick(this.styleId, selectedSizeId, true);
155
- }
156
- catch (e) {
157
- console.error(`Error trying on active size ${selectedSizeId}:`, e);
158
- // Optionally, inform the user about the error for the primary VTO
159
- }
160
- // 2. Fetch VTO for the size to the left (if it exists)
161
- if (activeIndex > 0) {
162
- const leftButton = allSizeButtons[activeIndex - 1];
163
- await this._preloadNeighborVTO(leftButton);
164
- }
165
- // 3. Fetch VTO for the size to the right (if it exists)
166
- if (activeIndex >= 0 && activeIndex < allSizeButtons.length - 1) {
167
- const rightButton = allSizeButtons[activeIndex + 1];
168
- await this._preloadNeighborVTO(rightButton);
169
- }
170
- }
171
- }
172
- catch (error) {
173
- console.error('Error during sequential try-on process:', error);
174
- }
175
- finally {
176
- // Reset loading state
177
- tryOnButton.classList.remove('loading');
178
- tryOnButton.textContent = originalText;
179
- tryOnButton.removeAttribute('disabled');
180
- }
181
- });
182
- }
183
- async _preloadNeighborVTO(buttonElement) {
184
- var _a;
185
- // this.styleId is assumed to be non-null here because the calling context (bindEvents)
186
- // is wrapped in 'if (this.styleId !== null)'
187
- const sizeId = Number(buttonElement.getAttribute('data-size-id'));
188
- if (!Number.isNaN(sizeId)) {
189
- try {
190
- await this.onTryOnClick(this.styleId, sizeId, false);
191
- }
192
- catch (e) {
193
- const buttonText = ((_a = buttonElement.textContent) === null || _a === void 0 ? void 0 : _a.trim()) || 'N/A';
194
- console.error(`Error pre-loading try-on for size ${sizeId} (button: ${buttonText}):`, e);
195
- }
196
- }
197
- }
198
- onSizeRecSelectClick(e) {
199
- const target = e.target;
200
- if (!target.classList.contains('tfr-size-rec-select-button') || target.classList.contains('tfr-disabled'))
201
- return;
202
- e.preventDefault();
203
- const selectedIndex = Number(target.getAttribute('data-index'));
204
- if (Number.isNaN(selectedIndex))
205
- return;
206
- const allButtons = document.querySelectorAll('.tfr-size-rec-select-button');
207
- allButtons.forEach((button) => button.classList.remove('active'));
208
- allButtons.item(selectedIndex).classList.add('active');
209
- this.redraw(selectedIndex);
210
- const selectedSizeId = Number(target.getAttribute('data-size-id'));
211
- if (Number.isNaN(selectedSizeId))
212
- return;
213
- this.onTryOnClick(this.styleId, selectedSizeId, true);
214
- }
215
- renderSizeRec(recommended, sizes) {
216
- this.tfrSizeRecSize.innerHTML = `&nbsp;${recommended}`;
217
- const selectedSizeIndex = sizes.findIndex(({ size }) => size === recommended);
218
- this.redraw = (index) => this.renderSizeRecTable(sizes, index);
219
- this.redraw(selectedSizeIndex);
220
- this.renderSizeRecSelect(sizes, selectedSizeIndex);
221
- }
222
- renderSizeRecTable(sizes, index) {
223
- const { locations } = sizes[index];
224
- const html = locations
225
- .map(({ location, fit, isPerfect }) => this.renderSizeRecTableRow(location, fit, isPerfect))
226
- .join('');
227
- this.tfrSizeRecTable.innerHTML = html;
228
- }
229
- renderSizeRecSelect(sizes, index) {
230
- const sizeNames = sizes.map(({ size }) => size);
231
- const html = sizeNames
232
- .map((name, i) => `<div class="tfr-size-rec-select-button ${i === index ? 'active' : ''}" data-index="${i}" data-size-id="${sizes[i].size_id}">${name}</div>`)
233
- .join('');
234
- this.tfrSizeRecSelect.innerHTML = html;
235
- }
236
- renderSizeRecSelectLoggedOut() {
237
- const html = [
238
- `<div class="tfr-size-rec-select-button tfr-disabled">M</div>`,
239
- `<div class="tfr-size-rec-select-button tfr-disabled active">L</div>`,
240
- `<div class="tfr-size-rec-select-button tfr-disabled">XL</div>`,
241
- ].join('');
242
- this.tfrSizeRecSelect.innerHTML = html;
243
- }
244
- renderSizeRecTableRow(location, fit, isPerfect = false) {
245
- return `<div class="tfr-size-rec-table-row">
246
- <div class="tfr-size-rec-table-cell-left">${location}</div>
247
- <div class="tfr-size-rec-table-cell-right ${isPerfect ? 'perfect' : ''}">
248
- ${fit}
249
- </div>
250
- </div>`;
251
- }
252
- renderGarmentLocations(locations) {
253
- const innerHtml = locations
254
- .map((location, index) => this.renderSizeRecTableRow(location, this.randomFit(index), true))
255
- .join('');
256
- const html = `<div id="tfr-logged-out-overlay-container">
257
- <div id="tfr-logged-out-overlay">
258
- Login to reveal how this item will fit specifically at each area of your body in different sizes
259
- </div>
260
- <div>
261
- ${innerHtml}
262
- </div>
263
- </div>`;
264
- this.tfrSizeRecTable.innerHTML = html;
265
- }
266
- randomFit(index) {
267
- const choices = ['Slightly Tight', 'Perfect Fit', 'Perfect Fit', 'Slightly Loose', 'Perfect Fit'];
268
- return choices[index % choices.length];
269
- }
270
- toggletSizeRecSelectContainer() {
271
- if (this.isCollapsed) {
272
- this.isCollapsed = false;
273
- this.tfrSizeRecTitleToggle.classList.add('tfr-chevron-up');
274
- this.tfrSizeRecTitleToggle.classList.remove('tfr-chevron-down');
275
- this.tfrToggleOpenElements.forEach((element) => (element.style.display = 'block'));
276
- this.tfrToggleClosedElements.forEach((element) => (element.style.display = 'none'));
277
- }
278
- else {
279
- this.isCollapsed = true;
280
- this.tfrSizeRecTitleToggle.classList.remove('tfr-chevron-up');
281
- this.tfrSizeRecTitleToggle.classList.add('tfr-chevron-down');
282
- this.tfrToggleOpenElements.forEach((element) => (element.style.display = 'none'));
283
- this.tfrToggleClosedElements.forEach((element) => (element.style.display = 'block'));
284
- }
285
- }
286
- render(sizeRecMainDiv) {
287
- const body = `<div id="tfr-size-recommendations">
288
- <div id="tfr-size-rec-loading">
289
- <div class="lds-ellipsis">
290
- <div></div>
291
- <div></div>
292
- <div></div>
293
- <div></div>
294
- </div>
295
- </div>
296
- <div id="tfr-size-recommendations-container">
297
- <div id="tfr-size-rec-title-toggle" class="tfr-chevron-up">v</div>
298
-
299
- <div class="tfr-logged-out">
300
- <div class="tfr-flex tfr-gap tfr-mb-2 tfr-mobile-small-text">
301
- <div>Uncertain&nbsp;of&nbsp;your&nbsp;size?</div>
302
-
303
- <div class="tfr-toggle-closed">
304
- <div class="tfr-flex tfr-items-center">
305
- <div>Try</div>
306
- <div class="tfr-powered-by-logo">${tfrDoor}</div>
307
- <div class="tfr-powered-by-text-bold">The&nbsp;Fitting&nbsp;Room</div>
308
- </div>
309
- </div>
310
-
311
- <div class="tfr-toggle-open">
312
- <div id="tfr-login-to-view" class="tfr-flex tfr-items-center">
313
- ${userIcon} Login to view
314
- </div>
315
- </div>
316
- </div>
317
- </div>
318
-
319
- <div class="tfr-logged-in">
320
- <div id="tfr-size-rec-title">
321
- Recommended Size:
322
- <div id="tfr-size-rec-size">
323
- <div class="tfr-size-rec-login-cta">
324
- ${userIcon} Sign up to view
325
- </div>
326
- </div>
327
- </div>
328
- </div>
329
-
330
- <div class="tfr-toggle-open" style="width: 100%">
331
- <div id="tfr-size-rec-select-container">
332
- <div id="tfr-size-how-it-fits">Select size to see how it fits:</div>
333
-
334
- <div id="tfr-size-rec-select"></div>
335
-
336
- <div id="tfr-size-rec-subtitle">
337
- How it fits
338
- <span id="tfr-info-icon">${infoIcon}</span>
339
- </div>
340
-
341
- <div id="tfr-size-rec-table"></div>
342
-
343
- <div id="tfr-try-on-button" class="tfr-try-on-button">Try On</div>
344
- </div>
345
- </div>
346
-
347
- <div id="tfr-size-rec-action">
348
- <div id="tfr-size-rec-action-login">Sign up or login</div>
349
- <div id="tfr-size-rec-action-logout">Log out</div>
350
- </div>
351
-
352
- <div class="tfr-toggle-open">
353
- <div class="tfr-powered-by">
354
- <div>Powered by</div>
355
- <div class="tfr-powered-by-logo">${tfrDoor}</div>
356
- <div class="tfr-powered-by-text-bold">The Fitting Room</div>
357
- </div>
358
- </div>
359
- </div>
360
- </div>
361
- <div id="tfr-size-recommendation-error"></div>`;
362
- sizeRecMainDiv.innerHTML = body;
363
- }
364
- }
365
- //# sourceMappingURL=SizeRec.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SizeRec.js","sourceRoot":"","sources":["../../../src/components/SizeRec.ts"],"names":[],"mappings":"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","sourcesContent":["import { infoIcon, tfrDoor, userIcon } from './svgs'\n\nexport type RecommendedSize = {\n recommended: string\n sizes: {\n size: string\n size_id: number\n locations: {\n fit: string\n isPerfect: boolean\n location: string\n }[]\n }[]\n}\n\nexport class SizeRecComponent {\n private _sku: string = ''\n private _styleId: number = null\n\n private sizeRecMainDiv: HTMLDivElement\n\n private tfrInfoIcon: HTMLDivElement\n private tfrLoginToView: HTMLDivElement\n private tfrSizeHowItFits: HTMLDivElement\n private tfrSizeRecActionLogin: HTMLDivElement\n private tfrSizeRecActionLogout: HTMLDivElement\n private tfrSizeRecLoading: HTMLDivElement\n private tfrSizeRecommendationError: HTMLDivElement\n private tfrSizeRecommendationsContainer: HTMLDivElement\n private tfrSizeRecSelect: HTMLDivElement\n private tfrSizeRecSelectContainer: HTMLDivElement\n private tfrSizeRecSize: HTMLDivElement\n private tfrSizeRecTable: HTMLDivElement\n private tfrSizeRecTitle: HTMLDivElement\n private tfrSizeRecTitleToggle: HTMLDivElement\n\n private tfrLoggedInElements: NodeList = [] as any as NodeList\n private tfrLoggedOutElements: NodeList = [] as any as NodeList\n\n private tfrToggleOpenElements: NodeList = [] as any as NodeList\n private tfrToggleClosedElements: NodeList = [] as any as NodeList\n\n private isCollapsed: boolean = false\n private redraw: (index: number) => void = null\n\n constructor(\n sizeRecMainDivId: string,\n private readonly onSignInClick: () => void,\n private readonly onSignOutClick: () => void,\n private readonly onFitInfoClick: () => void,\n private readonly onTryOnClick: (styleId: number, sizeId: number, shouldDisplay: boolean) => Promise<void>,\n ) {\n this.init(sizeRecMainDivId)\n }\n\n public get sku() {\n return this._sku\n }\n\n public setSku(sku: string) {\n this._sku = sku\n }\n\n public get styleId() {\n return this._styleId\n }\n\n public setStyleId(styleId: number) {\n this._styleId = styleId\n }\n\n public setIsLoggedIn(isLoggedIn: boolean) {\n\n this.tfrSizeRecSelectContainer.style.display = 'flex'\n this.tfrSizeRecSelect.style.display = 'flex'\n this.tfrSizeHowItFits.style.display = 'block'\n\n if (isLoggedIn) {\n this.tfrSizeHowItFits.style.opacity = '1'\n this.tfrSizeRecSelect.style.opacity = '1'\n this.tfrLoggedInElements.forEach((element) => ((element as HTMLElement).style.display = 'block'))\n this.tfrLoggedOutElements.forEach((element) => ((element as HTMLElement).style.display = 'none'))\n\n this.tfrSizeRecActionLogin.style.display = 'none'\n this.tfrSizeRecActionLogout.style.display = 'block'\n this.tfrSizeRecTitle.style.display = 'flex'\n this.isCollapsed = false\n this.tfrSizeRecTitleToggle.classList.add('tfr-chevron-up')\n this.tfrSizeRecTitleToggle.classList.remove('tfr-chevron-down')\n\n // Ensure the container is visible\n this.tfrSizeRecSelectContainer.style.display = 'flex'\n this.tfrSizeRecSelectContainer.style.opacity = '1'\n } else {\n this.tfrSizeHowItFits.style.opacity = '0.4'\n this.tfrSizeRecSelect.style.opacity = '0.4'\n this.tfrLoggedInElements.forEach((element) => ((element as HTMLElement).style.display = 'none'))\n this.tfrLoggedOutElements.forEach((element) => ((element as HTMLElement).style.display = 'block'))\n\n this.tfrSizeRecActionLogin.style.display = 'block'\n this.tfrSizeRecActionLogout.style.display = 'none'\n\n this.tfrSizeRecTitle.style.display = 'flex'\n this.tfrSizeRecommendationError.style.display = 'none'\n this.tfrSizeRecommendationError.innerHTML = ''\n\n this.renderSizeRecSelectLoggedOut()\n }\n }\n\n public setLoading(isLoading: boolean) {\n if (isLoading) {\n this.tfrSizeRecLoading.style.display = 'block'\n this.tfrSizeRecommendationsContainer.style.display = 'none'\n } else {\n this.tfrSizeRecLoading.style.display = 'none'\n this.tfrSizeRecommendationsContainer.style.display = 'flex'\n }\n }\n\n public setGarmentLocations(locations: string[]) {\n if (!locations || !locations.length) {\n this.tfrSizeRecTitle.style.display = 'none'\n\n return\n }\n\n this.renderGarmentLocations(locations)\n }\n\n public setRecommendedSize({ recommended, sizes }: RecommendedSize) {\n this.renderSizeRec(recommended, sizes)\n }\n\n public hide() {\n if (this.sizeRecMainDiv) {\n this.sizeRecMainDiv.style.display = 'none'\n }\n }\n\n public show() {\n if (this.sizeRecMainDiv) {\n this.sizeRecMainDiv.style.display = 'block'\n }\n }\n\n private init(sizeRecMainDivId: string) {\n const sizeRecMainDiv = document.getElementById(sizeRecMainDivId) as HTMLDivElement\n\n if (!sizeRecMainDiv) throw new Error('Size rec main div not found')\n\n this.sizeRecMainDiv = sizeRecMainDiv\n this.render(sizeRecMainDiv)\n this.setElements()\n this.bindEvents()\n }\n\n private setElements() {\n this.tfrSizeHowItFits = document.getElementById('tfr-size-how-it-fits') as HTMLDivElement\n this.tfrSizeRecTitle = document.getElementById('tfr-size-rec-title') as HTMLDivElement\n\n this.tfrInfoIcon = document.getElementById('tfr-info-icon') as HTMLDivElement\n this.tfrLoginToView = document.getElementById('tfr-login-to-view') as HTMLDivElement\n this.tfrSizeRecActionLogin = document.getElementById('tfr-size-rec-action-login') as HTMLDivElement\n this.tfrSizeRecActionLogout = document.getElementById('tfr-size-rec-action-logout') as HTMLDivElement\n this.tfrSizeRecTable = document.getElementById('tfr-size-rec-table') as HTMLDivElement\n this.tfrSizeRecommendationError = document.getElementById('tfr-size-recommendation-error') as HTMLDivElement\n this.tfrSizeRecSize = document.getElementById('tfr-size-rec-size') as HTMLDivElement\n this.tfrSizeRecSelect = document.getElementById('tfr-size-rec-select') as HTMLDivElement\n this.tfrSizeRecLoading = document.getElementById('tfr-size-rec-loading') as HTMLDivElement\n this.tfrSizeRecTitleToggle = document.getElementById('tfr-size-rec-title-toggle') as HTMLDivElement\n this.tfrSizeRecSelectContainer = document.getElementById('tfr-size-rec-select-container') as HTMLDivElement\n this.tfrSizeRecommendationsContainer = document.getElementById(\n 'tfr-size-recommendations-container',\n ) as HTMLDivElement\n\n this.tfrLoggedInElements = document.querySelectorAll('.tfr-logged-in')\n this.tfrLoggedOutElements = document.querySelectorAll('.tfr-logged-out')\n this.tfrToggleOpenElements = document.querySelectorAll('.tfr-toggle-open')\n this.tfrToggleClosedElements = document.querySelectorAll('.tfr-toggle-closed')\n }\n\n private bindEvents() {\n this.tfrSizeRecActionLogin.addEventListener('click', this.onSignInClick)\n this.tfrSizeRecActionLogout.addEventListener('click', this.onSignOutClick)\n this.tfrSizeRecSelect.addEventListener('click', this.onSizeRecSelectClick.bind(this))\n this.tfrSizeRecTitleToggle.addEventListener('click', this.toggletSizeRecSelectContainer.bind(this))\n this.tfrInfoIcon.addEventListener('click', this.onFitInfoClick)\n this.tfrLoginToView.addEventListener('click', this.onSignInClick)\n\n const tryOnButton = document.getElementById('tfr-try-on-button')\n if (!tryOnButton) return\n\n tryOnButton.addEventListener('click', async () => {\n // Prevent multiple clicks while loading\n if (tryOnButton.classList.contains('loading')) {\n return\n }\n\n const activeButton = document.querySelector('.tfr-size-rec-select-button.active')\n if (!activeButton) return\n\n const selectedSizeId = Number(activeButton.getAttribute('data-size-id'))\n if (Number.isNaN(selectedSizeId)) return\n\n // Set loading state\n tryOnButton.classList.add('loading')\n const originalText = tryOnButton.textContent\n tryOnButton.textContent = ' '\n tryOnButton.setAttribute('disabled', 'true')\n\n try {\n // Get all size buttons\n const allSizeButtons = Array.from(document.querySelectorAll('.tfr-size-rec-select-button')) as HTMLElement[]\n const activeIndex = allSizeButtons.indexOf(activeButton as HTMLElement)\n\n if (this.styleId !== null) {\n // 1. Fetch and display the VTO for the active (recommended) size\n try {\n await this.onTryOnClick(this.styleId, selectedSizeId, true)\n } catch (e) {\n console.error(`Error trying on active size ${selectedSizeId}:`, e)\n // Optionally, inform the user about the error for the primary VTO\n }\n\n // 2. Fetch VTO for the size to the left (if it exists)\n if (activeIndex > 0) {\n const leftButton = allSizeButtons[activeIndex - 1]\n await this._preloadNeighborVTO(leftButton)\n }\n\n // 3. Fetch VTO for the size to the right (if it exists)\n if (activeIndex >= 0 && activeIndex < allSizeButtons.length - 1) {\n const rightButton = allSizeButtons[activeIndex + 1]\n await this._preloadNeighborVTO(rightButton)\n }\n }\n } catch (error) {\n console.error('Error during sequential try-on process:', error)\n } finally {\n // Reset loading state\n tryOnButton.classList.remove('loading')\n tryOnButton.textContent = originalText\n tryOnButton.removeAttribute('disabled')\n }\n })\n }\n\n private async _preloadNeighborVTO(buttonElement: HTMLElement): Promise<void> {\n // this.styleId is assumed to be non-null here because the calling context (bindEvents)\n // is wrapped in 'if (this.styleId !== null)'\n const sizeId = Number(buttonElement.getAttribute('data-size-id'))\n if (!Number.isNaN(sizeId)) {\n try {\n await this.onTryOnClick(this.styleId!, sizeId, false)\n } catch (e) {\n const buttonText = buttonElement.textContent?.trim() || 'N/A'\n console.error(`Error pre-loading try-on for size ${sizeId} (button: ${buttonText}):`, e)\n }\n }\n }\n\n private onSizeRecSelectClick(e: MouseEvent) {\n const target = e.target as HTMLDivElement\n if (!target.classList.contains('tfr-size-rec-select-button') || target.classList.contains('tfr-disabled')) return\n\n e.preventDefault()\n\n const selectedIndex = Number(target.getAttribute('data-index'))\n if (Number.isNaN(selectedIndex)) return\n\n const allButtons = document.querySelectorAll('.tfr-size-rec-select-button')\n\n allButtons.forEach((button) => button.classList.remove('active'))\n allButtons.item(selectedIndex).classList.add('active')\n\n this.redraw(selectedIndex)\n\n const selectedSizeId = Number(target.getAttribute('data-size-id'))\n if (Number.isNaN(selectedSizeId)) return\n\n this.onTryOnClick(this.styleId, selectedSizeId, true)\n }\n\n private renderSizeRec(recommended: string, sizes: RecommendedSize['sizes']) {\n this.tfrSizeRecSize.innerHTML = `&nbsp;${recommended}`\n\n const selectedSizeIndex = sizes.findIndex(({ size }) => size === recommended)\n\n this.redraw = (index: number) => this.renderSizeRecTable(sizes, index)\n\n this.redraw(selectedSizeIndex)\n this.renderSizeRecSelect(sizes, selectedSizeIndex)\n }\n\n private renderSizeRecTable(sizes: RecommendedSize['sizes'], index: number) {\n const { locations } = sizes[index]\n const html = locations\n .map(({ location, fit, isPerfect }) => this.renderSizeRecTableRow(location, fit, isPerfect))\n .join('')\n\n this.tfrSizeRecTable.innerHTML = html\n }\n\n private renderSizeRecSelect(sizes: RecommendedSize['sizes'], index: number) {\n const sizeNames = sizes.map(({ size }) => size)\n const html = sizeNames\n .map(\n (name, i) =>\n `<div class=\"tfr-size-rec-select-button ${i === index ? 'active' : ''}\" data-index=\"${i}\" data-size-id=\"${sizes[i].size_id\n }\">${name}</div>`,\n )\n .join('')\n\n this.tfrSizeRecSelect.innerHTML = html\n }\n\n private renderSizeRecSelectLoggedOut() {\n const html = [\n `<div class=\"tfr-size-rec-select-button tfr-disabled\">M</div>`,\n `<div class=\"tfr-size-rec-select-button tfr-disabled active\">L</div>`,\n `<div class=\"tfr-size-rec-select-button tfr-disabled\">XL</div>`,\n ].join('')\n\n this.tfrSizeRecSelect.innerHTML = html\n }\n\n private renderSizeRecTableRow(location: string, fit: string, isPerfect: boolean = false) {\n return `<div class=\"tfr-size-rec-table-row\">\n <div class=\"tfr-size-rec-table-cell-left\">${location}</div>\n <div class=\"tfr-size-rec-table-cell-right ${isPerfect ? 'perfect' : ''}\">\n ${fit}\n </div>\n </div>`\n }\n\n private renderGarmentLocations(locations: string[]) {\n const innerHtml = locations\n .map((location, index) => this.renderSizeRecTableRow(location, this.randomFit(index), true))\n .join('')\n const html = `<div id=\"tfr-logged-out-overlay-container\">\n <div id=\"tfr-logged-out-overlay\">\n Login to reveal how this item will fit specifically at each area of your body in different sizes\n </div>\n <div>\n ${innerHtml}\n </div>\n </div>`\n\n this.tfrSizeRecTable.innerHTML = html\n }\n\n private randomFit(index: number) {\n const choices = ['Slightly Tight', 'Perfect Fit', 'Perfect Fit', 'Slightly Loose', 'Perfect Fit']\n\n return choices[index % choices.length]\n }\n\n private toggletSizeRecSelectContainer() {\n if (this.isCollapsed) {\n this.isCollapsed = false\n this.tfrSizeRecTitleToggle.classList.add('tfr-chevron-up')\n this.tfrSizeRecTitleToggle.classList.remove('tfr-chevron-down')\n this.tfrToggleOpenElements.forEach((element) => ((element as HTMLElement).style.display = 'block'))\n this.tfrToggleClosedElements.forEach((element) => ((element as HTMLElement).style.display = 'none'))\n } else {\n this.isCollapsed = true\n this.tfrSizeRecTitleToggle.classList.remove('tfr-chevron-up')\n this.tfrSizeRecTitleToggle.classList.add('tfr-chevron-down')\n this.tfrToggleOpenElements.forEach((element) => ((element as HTMLElement).style.display = 'none'))\n this.tfrToggleClosedElements.forEach((element) => ((element as HTMLElement).style.display = 'block'))\n }\n }\n\n private render(sizeRecMainDiv: HTMLDivElement) {\n const body = `<div id=\"tfr-size-recommendations\">\n <div id=\"tfr-size-rec-loading\">\n <div class=\"lds-ellipsis\">\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n </div>\n </div>\n <div id=\"tfr-size-recommendations-container\">\n <div id=\"tfr-size-rec-title-toggle\" class=\"tfr-chevron-up\">v</div>\n\n <div class=\"tfr-logged-out\">\n <div class=\"tfr-flex tfr-gap tfr-mb-2 tfr-mobile-small-text\">\n <div>Uncertain&nbsp;of&nbsp;your&nbsp;size?</div>\n \n <div class=\"tfr-toggle-closed\">\n <div class=\"tfr-flex tfr-items-center\">\n <div>Try</div>\n <div class=\"tfr-powered-by-logo\">${tfrDoor}</div>\n <div class=\"tfr-powered-by-text-bold\">The&nbsp;Fitting&nbsp;Room</div>\n </div>\n </div>\n\n <div class=\"tfr-toggle-open\">\n <div id=\"tfr-login-to-view\" class=\"tfr-flex tfr-items-center\">\n ${userIcon} Login to view\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"tfr-logged-in\">\n <div id=\"tfr-size-rec-title\">\n Recommended Size:\n <div id=\"tfr-size-rec-size\">\n <div class=\"tfr-size-rec-login-cta\">\n ${userIcon} Sign up to view\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"tfr-toggle-open\" style=\"width: 100%\">\n <div id=\"tfr-size-rec-select-container\">\n <div id=\"tfr-size-how-it-fits\">Select size to see how it fits:</div>\n\n <div id=\"tfr-size-rec-select\"></div>\n\n <div id=\"tfr-size-rec-subtitle\">\n How it fits\n <span id=\"tfr-info-icon\">${infoIcon}</span>\n </div>\n\n <div id=\"tfr-size-rec-table\"></div>\n\n <div id=\"tfr-try-on-button\" class=\"tfr-try-on-button\">Try On</div>\n </div>\n </div>\n\n <div id=\"tfr-size-rec-action\">\n <div id=\"tfr-size-rec-action-login\">Sign up or login</div>\n <div id=\"tfr-size-rec-action-logout\">Log out</div>\n </div>\n\n <div class=\"tfr-toggle-open\">\n <div class=\"tfr-powered-by\">\n <div>Powered by</div>\n <div class=\"tfr-powered-by-logo\">${tfrDoor}</div>\n <div class=\"tfr-powered-by-text-bold\">The Fitting Room</div>\n </div>\n </div>\n </div>\n </div>\n <div id=\"tfr-size-recommendation-error\"></div>`\n\n sizeRecMainDiv.innerHTML = body\n }\n}\n"]}
@@ -1,52 +0,0 @@
1
- import { InitImageSlider } from './slider';
2
- export class VtoComponent {
3
- constructor(vtoMainDivId) {
4
- this.vtoMainDivId = vtoMainDivId;
5
- this.isInit = false;
6
- this.currentSliderValue = 0;
7
- this.slider = null;
8
- }
9
- init() {
10
- if (this.isInit)
11
- return;
12
- const vtoMainDiv = document.getElementById(this.vtoMainDivId);
13
- if (!vtoMainDiv)
14
- throw new Error(`Element with id ${this.vtoMainDivId} not found`);
15
- vtoMainDiv.innerHTML = `
16
- <div class="tfr-slider-wrapper">
17
- <img id="tfr-tryon-image" src="" />
18
- <input type="range" id="tfr-slider" />
19
- </div>
20
- `;
21
- const tryOnImage = document.getElementById('tfr-tryon-image');
22
- const onChange = (slider, imageUrl) => {
23
- console.debug('slider change', slider, imageUrl);
24
- tryOnImage.src = imageUrl;
25
- this.currentSliderValue = parseInt(slider.value);
26
- };
27
- this.slider = InitImageSlider('tfr-slider', onChange);
28
- this.isInit = true;
29
- }
30
- onNewFramesReady(frames) {
31
- if (!this.isInit) {
32
- this.init();
33
- }
34
- if (Array.isArray(frames) && frames.length > 0) {
35
- // Ensure the current slider value is within bounds of the new frames array
36
- const boundedValue = Math.min(this.currentSliderValue, frames.length - 1);
37
- const e = this.slider.Load(frames, boundedValue);
38
- if (e instanceof Error) {
39
- console.error(e);
40
- return;
41
- }
42
- // Restore previous slider position if it's within bounds
43
- const sliderElement = document.getElementById('tfr-slider');
44
- if (sliderElement && this.currentSliderValue < frames.length) {
45
- sliderElement.value = this.currentSliderValue.toString();
46
- const tryOnImage = document.getElementById('tfr-tryon-image');
47
- tryOnImage.src = frames[this.currentSliderValue];
48
- }
49
- }
50
- }
51
- }
52
- //# sourceMappingURL=Vto.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Vto.js","sourceRoot":"","sources":["../../../src/components/Vto.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAE1C,MAAM,OAAO,YAAY;IAKvB,YAA6B,YAAoB;QAApB,iBAAY,GAAZ,YAAY,CAAQ;QAJzC,WAAM,GAAG,KAAK,CAAA;QACd,uBAAkB,GAAW,CAAC,CAAA;QAC9B,WAAM,GAAuC,IAAI,CAAA;IAEJ,CAAC;IAE/C,IAAI;QACT,IAAI,IAAI,CAAC,MAAM;YAAE,OAAM;QAEvB,MAAM,UAAU,GAAG,QAAQ,CAAC,cAAc,CAAC,IAAI,CAAC,YAAY,CAAC,CAAA;QAE7D,IAAI,CAAC,UAAU;YAAE,MAAM,IAAI,KAAK,CAAC,mBAAmB,IAAI,CAAC,YAAY,YAAY,CAAC,CAAA;QAElF,UAAU,CAAC,SAAS,GAAG;;;;;KAKtB,CAAA;QAED,MAAM,UAAU,GAAqB,QAAQ,CAAC,cAAc,CAAC,iBAAiB,CAAC,CAAA;QAC/E,MAAM,QAAQ,GAAG,CAAC,MAAM,EAAE,QAAQ,EAAE,EAAE;YACpC,OAAO,CAAC,KAAK,CAAC,eAAe,EAAE,MAAM,EAAE,QAAQ,CAAC,CAAA;YAChD,UAAU,CAAC,GAAG,GAAG,QAAQ,CAAA;YACzB,IAAI,CAAC,kBAAkB,GAAG,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;QAClD,CAAC,CAAA;QAED,IAAI,CAAC,MAAM,GAAG,eAAe,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAA;QACrD,IAAI,CAAC,MAAM,GAAG,IAAI,CAAA;IACpB,CAAC;IAEM,gBAAgB,CAAC,MAAgB;QACtC,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC;YACjB,IAAI,CAAC,IAAI,EAAE,CAAA;QACb,CAAC;QAED,IAAI,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,IAAI,MAAM,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YAC/C,2EAA2E;YAC3E,MAAM,YAAY,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,kBAAkB,EAAE,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAA;YACzE,MAAM,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,MAAM,EAAE,YAAY,CAAC,CAAA;YAChD,IAAI,CAAC,YAAY,KAAK,EAAE,CAAC;gBACvB,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;gBAChB,OAAM;YACR,CAAC;YAED,yDAAyD;YACzD,MAAM,aAAa,GAAG,QAAQ,CAAC,cAAc,CAAC,YAAY,CAAqB,CAAA;YAC/E,IAAI,aAAa,IAAI,IAAI,CAAC,kBAAkB,GAAG,MAAM,CAAC,MAAM,EAAE,CAAC;gBAC7D,aAAa,CAAC,KAAK,GAAG,IAAI,CAAC,kBAAkB,CAAC,QAAQ,EAAE,CAAA;gBACxD,MAAM,UAAU,GAAqB,QAAQ,CAAC,cAAc,CAAC,iBAAiB,CAAC,CAAA;gBAC/E,UAAU,CAAC,GAAG,GAAG,MAAM,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAA;YAClD,CAAC;QACH,CAAC;IACH,CAAC;CACF","sourcesContent":["import { InitImageSlider } from './slider'\n\nexport class VtoComponent {\n private isInit = false\n private currentSliderValue: number = 0\n private slider: ReturnType<typeof InitImageSlider> = null\n\n constructor(private readonly vtoMainDivId: string) { }\n\n public init() {\n if (this.isInit) return\n\n const vtoMainDiv = document.getElementById(this.vtoMainDivId)\n\n if (!vtoMainDiv) throw new Error(`Element with id ${this.vtoMainDivId} not found`)\n\n vtoMainDiv.innerHTML = `\n <div class=\"tfr-slider-wrapper\">\n <img id=\"tfr-tryon-image\" src=\"\" />\n <input type=\"range\" id=\"tfr-slider\" />\n </div>\n `\n\n const tryOnImage = <HTMLImageElement>document.getElementById('tfr-tryon-image')\n const onChange = (slider, imageUrl) => {\n console.debug('slider change', slider, imageUrl)\n tryOnImage.src = imageUrl\n this.currentSliderValue = parseInt(slider.value)\n }\n\n this.slider = InitImageSlider('tfr-slider', onChange)\n this.isInit = true\n }\n\n public onNewFramesReady(frames: string[]) {\n if (!this.isInit) {\n this.init()\n }\n\n if (Array.isArray(frames) && frames.length > 0) {\n // Ensure the current slider value is within bounds of the new frames array\n const boundedValue = Math.min(this.currentSliderValue, frames.length - 1)\n const e = this.slider.Load(frames, boundedValue)\n if (e instanceof Error) {\n console.error(e)\n return\n }\n\n // Restore previous slider position if it's within bounds\n const sliderElement = document.getElementById('tfr-slider') as HTMLInputElement\n if (sliderElement && this.currentSliderValue < frames.length) {\n sliderElement.value = this.currentSliderValue.toString()\n const tryOnImage = <HTMLImageElement>document.getElementById('tfr-tryon-image')\n tryOnImage.src = frames[this.currentSliderValue]\n }\n }\n }\n}\n"]}
@@ -1,16 +0,0 @@
1
- import '../styles';
2
- import ErrorModal from './Modals/ErrorModal';
3
- import FitModal from './Modals/FitModal';
4
- import ForgotPasswordModal from './Modals/ForgotPasswordModal';
5
- import LoadingAvatarModal from './Modals/LoadingAvatarModal';
6
- import LoggedOutModal from './Modals/LoggedOutModal';
7
- import { InitModalManager } from './Modals/ModalManager';
8
- import NoAvatarModal from './Modals/NoAvatarModal';
9
- import ResetLinkModal from './Modals/ResetLinkModal';
10
- import ScanCodeModal from './Modals/ScanCodeModal';
11
- import SignInModal from './Modals/SignInModal';
12
- import SizeErrorModal from './Modals/SizeErrorModal';
13
- import TryOnModal from './Modals/TryOnModal';
14
- import { InitImageSlider } from './slider';
15
- export { ErrorModal, FitModal, ForgotPasswordModal, InitImageSlider, InitModalManager, LoadingAvatarModal, LoggedOutModal, NoAvatarModal, ResetLinkModal, ScanCodeModal, SignInModal, SizeErrorModal, TryOnModal, };
16
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,WAAW,CAAA;AAClB,OAAO,UAAU,MAAM,qBAAqB,CAAA;AAC5C,OAAO,QAAQ,MAAM,mBAAmB,CAAA;AACxC,OAAO,mBAAmB,MAAM,8BAA8B,CAAA;AAC9D,OAAO,kBAAkB,MAAM,6BAA6B,CAAA;AAC5D,OAAO,cAAc,MAAM,yBAAyB,CAAA;AACpD,OAAO,EAAE,gBAAgB,EAAgB,MAAM,uBAAuB,CAAA;AACtE,OAAO,aAAa,MAAM,wBAAwB,CAAA;AAClD,OAAO,cAAc,MAAM,yBAAyB,CAAA;AACpD,OAAO,aAAa,MAAM,wBAAwB,CAAA;AAClD,OAAO,WAAW,MAAM,sBAAsB,CAAA;AAC9C,OAAO,cAAc,MAAM,yBAAyB,CAAA;AACpD,OAAO,UAAU,MAAM,qBAAqB,CAAA;AAC5C,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAE1C,OAAO,EACL,UAAU,EACV,QAAQ,EACR,mBAAmB,EACnB,eAAe,EACf,gBAAgB,EAChB,kBAAkB,EAClB,cAAc,EAEd,aAAa,EACb,cAAc,EACd,aAAa,EACb,WAAW,EACX,cAAc,EACd,UAAU,GACX,CAAA","sourcesContent":["import '../styles'\nimport ErrorModal from './Modals/ErrorModal'\nimport FitModal from './Modals/FitModal'\nimport ForgotPasswordModal from './Modals/ForgotPasswordModal'\nimport LoadingAvatarModal from './Modals/LoadingAvatarModal'\nimport LoggedOutModal from './Modals/LoggedOutModal'\nimport { InitModalManager, ModalManager } from './Modals/ModalManager'\nimport NoAvatarModal from './Modals/NoAvatarModal'\nimport ResetLinkModal from './Modals/ResetLinkModal'\nimport ScanCodeModal from './Modals/ScanCodeModal'\nimport SignInModal from './Modals/SignInModal'\nimport SizeErrorModal from './Modals/SizeErrorModal'\nimport TryOnModal from './Modals/TryOnModal'\nimport { InitImageSlider } from './slider'\n\nexport {\n ErrorModal,\n FitModal,\n ForgotPasswordModal,\n InitImageSlider,\n InitModalManager,\n LoadingAvatarModal,\n LoggedOutModal,\n ModalManager,\n NoAvatarModal,\n ResetLinkModal,\n ScanCodeModal,\n SignInModal,\n SizeErrorModal,\n TryOnModal,\n}\n"]}
@@ -1,108 +0,0 @@
1
- import { createUIError } from './uiError';
2
- var L = {
3
- AssociatedEmail: 'If there is an account associated with that email, We have sent a link to reset your password.',
4
- BackToSignIn: 'Back to sign in',
5
- BrandUserIdNotSet: 'User not logged in to brand site.',
6
- ClickHereToDownload: 'Click here to download the app',
7
- DontHaveAcc: "Don't have an account?",
8
- DontHaveAvatar: "Whoops! Looks like you don't have an avatar yet.",
9
- EmailAddress: 'Email address',
10
- EmailError: 'Please enter a valid email address.',
11
- EnterEmailAddress: 'Enter your email address, we will send you a link to reset your password.',
12
- EnterPhoneNumber: 'Enter your number for download link',
13
- FailedToLoadLocale: 'Something went wrong when fetching another language.',
14
- ForgotPasswordWithSymbol: 'Forgot password?',
15
- GetVirtualTryOnFramesErrorText: 'The try-on request timed out. Please try again!',
16
- HaveAcc: 'Have an account? Sign in',
17
- Loading: 'Loading...',
18
- LoadingAvatar: 'Your avatar is loading...',
19
- NoSizeAvailable: 'Unfortunately, that size is not available for try on.',
20
- OrSize: 'or',
21
- Password: 'Password',
22
- PasswordError: 'Please enter a valid password (at least 7 characters).',
23
- PhoneNumber: 'Phone number',
24
- ReturnToCatalogPage: 'Return to Catalog Page',
25
- ReturnToProductPage: 'Return to Product Page',
26
- ReturnToSite: 'Return to site',
27
- ReturnToTfr: 'Please return to The Fitting Room app to create your avatar.',
28
- ScanQrToDownload: 'Scan to download the app',
29
- Send: 'Send',
30
- SignBackIn: 'Sign back in',
31
- SignIn: 'Sign in',
32
- SomethingWentWrong: 'Something went wrong. Try again!',
33
- SuccessfullyLoggedOut: 'You have successfully logged out!',
34
- TheFittingRoom: 'The Fitting Room',
35
- UsernameOrPasswordEmpty: 'Username or password is empty.',
36
- UsernameOrPasswordIncorrect: 'Username or password is incorrect.',
37
- // Modal
38
- ModalTagline: 'End size uncertainty with',
39
- ModalText: 'Our technology captures your precise measurements, and considers things like fabric stretch and your individual physique to find your perfect fit every time.',
40
- };
41
- function findMissingLocales(defaultLocale, newLocale) {
42
- const missingLocales = { default: {}, new: {} };
43
- for (const key in defaultLocale) {
44
- if (newLocale[key] === undefined) {
45
- missingLocales.default[key] = defaultLocale[key];
46
- }
47
- }
48
- for (const key in newLocale) {
49
- if (defaultLocale[key] === undefined) {
50
- missingLocales.new[key] = newLocale[key];
51
- }
52
- }
53
- return missingLocales;
54
- }
55
- async function SetLocale(locale) {
56
- return new Promise((resolve, reject) => {
57
- fetch(`${process.env.LANGUAGE_URL}/${locale}.json`)
58
- .then((response) => {
59
- if (response.ok) {
60
- response
61
- .json()
62
- .then((data) => {
63
- const missingLocales = findMissingLocales(L, data);
64
- if (Object.keys(missingLocales.default).length > 0) {
65
- console.warn(`The following locales are missing from the new locale: ${JSON.stringify(missingLocales.default)}`);
66
- }
67
- if (Object.keys(missingLocales.new).length > 0) {
68
- console.warn(`The following locales are missing from the default locale: ${JSON.stringify(missingLocales.new)}`);
69
- }
70
- L = data;
71
- resolve();
72
- })
73
- .catch((error) => {
74
- reject(createUIError(L.FailedToLoadLocale, error));
75
- });
76
- }
77
- else {
78
- response
79
- .text()
80
- .then((bodyText) => {
81
- reject(createUIError(L.FailedToLoadLocale, new Error(bodyText)));
82
- })
83
- .catch((error) => {
84
- reject(createUIError(L.FailedToLoadLocale, error));
85
- });
86
- }
87
- })
88
- .catch((error) => {
89
- reject(createUIError(L.FailedToLoadLocale, error));
90
- });
91
- });
92
- }
93
- const InitLocale = () => {
94
- return new Promise((resolve, reject) => {
95
- const searchParams = new URL(window.location.href).searchParams;
96
- const language = searchParams.get('language') || 'en';
97
- SetLocale(language)
98
- .then(() => {
99
- resolve(language);
100
- })
101
- .catch((error) => {
102
- reject(error);
103
- });
104
- });
105
- };
106
- //TODO: add OverrideLocale function that rewrites all non-empty keys in the new locale over the old locale
107
- export { InitLocale, L, SetLocale };
108
- //# sourceMappingURL=locale.js.map