wickes-css2 2.113.0-develop.13 → 2.113.0-develop.15
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/build/css/main.css +1 -1
- package/build/css/my-account-main-v2.css +1 -1
- package/build/css/my-account-main.css +1 -1
- package/build/css/pdp-main-before-combine.css +1 -1
- package/build/css/pdp-main-non-critical.css +1 -1
- package/build/css/pdp-main.css +1 -1
- package/build/css/store-locator-main.css +1 -1
- package/build/js/bloomreach-widget.min.js +1 -1
- package/build/js/emulation.min.js +36 -16
- package/build/js/page/bloomreach-widget/bloomreach-recommendation-carousel-widget.js +7 -6
- package/build/js/page/bloomreach-widget/bloomreach-widget-core.js +2 -0
- package/build/js/page/bloomreach-widget/bloomreach-widget.js +5 -0
- package/build/js/page/bloomreach-widget/complete-your-project/widget.js +0 -1
- package/build/js/page/bloomreach-widget/similar-products-widget.js +17 -0
- package/package.json +1 -1
- package/src/components/bloomreach/why-not-add-card.hbs +25 -6
- package/src/components/bloomreach/why-not-add.hbs +1 -1
- package/src/components/price-block-v2.hbs +90 -72
- package/src/js/emulation/mock.js +9 -0
- package/src/js/emulation/similar-products-loading.js +22 -0
- package/src/js/page/bloomreach-widget/bloomreach-recommendation-carousel-widget.js +7 -6
- package/src/js/page/bloomreach-widget/bloomreach-widget-core.js +2 -0
- package/src/js/page/bloomreach-widget/bloomreach-widget.js +5 -0
- package/src/js/page/bloomreach-widget/complete-your-project/widget.js +0 -1
- package/src/js/page/bloomreach-widget/similar-products-widget.js +17 -0
- package/src/page_product-details-with-similar-products-widget.html +132 -0
- package/src/scss/components/_map.scss +38 -0
- package/src/scss/components/bloomreach/_why-not-add.scss +3 -1
- package/src/sitemap.html +12 -6
|
@@ -34,6 +34,7 @@ export function createBloomreachRecommendationCarouselWidget(config) {
|
|
|
34
34
|
};
|
|
35
35
|
const el = {
|
|
36
36
|
...DEFAULT_EL,
|
|
37
|
+
...(config.el || {}),
|
|
37
38
|
widgetContainer: config.widgetContainer,
|
|
38
39
|
};
|
|
39
40
|
const addToCartEvent = config.addToCartEvent || 'addToCart';
|
|
@@ -58,9 +59,6 @@ export function createBloomreachRecommendationCarouselWidget(config) {
|
|
|
58
59
|
.map(function (item) {
|
|
59
60
|
return item.baseProduct || item;
|
|
60
61
|
})
|
|
61
|
-
.filter(function (product) {
|
|
62
|
-
return config.isEligibleProduct ? config.isEligibleProduct(product) : true;
|
|
63
|
-
})
|
|
64
62
|
.slice(0, 5);
|
|
65
63
|
}
|
|
66
64
|
|
|
@@ -85,6 +83,8 @@ export function createBloomreachRecommendationCarouselWidget(config) {
|
|
|
85
83
|
...Wick.BloomreachWidget.getProductRenderData(product),
|
|
86
84
|
addToCartError: config.addToCartError,
|
|
87
85
|
showBadge: !config.hideBadge,
|
|
86
|
+
sameTab: Boolean(config.sameTab),
|
|
87
|
+
linkImage: Boolean(config.linkImage),
|
|
88
88
|
};
|
|
89
89
|
}),
|
|
90
90
|
isSingleProduct: products.length === 1,
|
|
@@ -130,7 +130,7 @@ export function createBloomreachRecommendationCarouselWidget(config) {
|
|
|
130
130
|
navigation: {
|
|
131
131
|
nextEl: $widget.find(el.next)[0],
|
|
132
132
|
prevEl: $widget.find(el.prev)[0],
|
|
133
|
-
disabledClass: 'why-not-add__arrow--disabled',
|
|
133
|
+
disabledClass: config.arrowDisabledClass || 'why-not-add__arrow--disabled',
|
|
134
134
|
},
|
|
135
135
|
pagination: {
|
|
136
136
|
el: $widget.find(el.pagination)[0],
|
|
@@ -140,8 +140,9 @@ export function createBloomreachRecommendationCarouselWidget(config) {
|
|
|
140
140
|
index + 1
|
|
141
141
|
}"></button>`;
|
|
142
142
|
},
|
|
143
|
-
bulletClass: 'why-not-add__pagination-item',
|
|
144
|
-
bulletActiveClass:
|
|
143
|
+
bulletClass: config.paginationItemClass || 'why-not-add__pagination-item',
|
|
144
|
+
bulletActiveClass:
|
|
145
|
+
config.paginationActiveItemClass || 'why-not-add__pagination-item--active',
|
|
145
146
|
},
|
|
146
147
|
});
|
|
147
148
|
|
|
@@ -56,6 +56,8 @@ export function createBloomreachWidget(config) {
|
|
|
56
56
|
config.renderWidget($container, payloadData, widget);
|
|
57
57
|
}
|
|
58
58
|
|
|
59
|
+
Wick.BloomreachWidget.removeBlankTargets($container);
|
|
60
|
+
|
|
59
61
|
if (config.initRenderedWidget) {
|
|
60
62
|
config.initRenderedWidget($container, widget);
|
|
61
63
|
}
|
|
@@ -4,6 +4,7 @@ import './bloomreach-widget-core';
|
|
|
4
4
|
import Widget from './complete-your-project/widget';
|
|
5
5
|
import WhyNotAddWidget from './why-not-add-widget';
|
|
6
6
|
import DontForgetWidget from './dont-forget-widget';
|
|
7
|
+
import SimilarProductsWidget from './similar-products-widget';
|
|
7
8
|
|
|
8
9
|
Wick.BloomreachWidget.registerWidgets([
|
|
9
10
|
{
|
|
@@ -18,4 +19,8 @@ Wick.BloomreachWidget.registerWidgets([
|
|
|
18
19
|
type: 'dontForget',
|
|
19
20
|
widget: DontForgetWidget,
|
|
20
21
|
},
|
|
22
|
+
{
|
|
23
|
+
type: 'similarProducts',
|
|
24
|
+
widget: SimilarProductsWidget,
|
|
25
|
+
},
|
|
21
26
|
]);
|
|
@@ -124,7 +124,6 @@ function initRenderedWidget($container) {
|
|
|
124
124
|
return;
|
|
125
125
|
}
|
|
126
126
|
|
|
127
|
-
Wick.BloomreachWidget.removeBlankTargets($completeWidget);
|
|
128
127
|
Wick.BloomreachWidget.drawRating($completeWidget);
|
|
129
128
|
cards.bindCardSelection($completeWidget);
|
|
130
129
|
cards.bindDropdowns();
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { createBloomreachRecommendationCarouselWidget } from './bloomreach-recommendation-carousel-widget';
|
|
2
|
+
|
|
3
|
+
const SimilarProductsWidget = createBloomreachRecommendationCarouselWidget({
|
|
4
|
+
namespace: 'similarProducts',
|
|
5
|
+
title: 'Similar products',
|
|
6
|
+
widgetContainer: '[data-similar-products-widget]',
|
|
7
|
+
disableAfterSuccess: false,
|
|
8
|
+
disableAfterFailure: false,
|
|
9
|
+
hideBadge: true,
|
|
10
|
+
sameTab: true,
|
|
11
|
+
linkImage: true,
|
|
12
|
+
el: {
|
|
13
|
+
productLink: '.why-not-add-card__title, .why-not-add-card__image-link',
|
|
14
|
+
},
|
|
15
|
+
});
|
|
16
|
+
|
|
17
|
+
export default SimilarProductsWidget;
|
package/package.json
CHANGED
|
@@ -11,15 +11,34 @@
|
|
|
11
11
|
{{/if}}
|
|
12
12
|
{{/if}}
|
|
13
13
|
{{#if image.url}}
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
14
|
+
{{#if linkImage}}
|
|
15
|
+
<a
|
|
16
|
+
href="{{url}}"
|
|
17
|
+
class="why-not-add-card__image-link"
|
|
18
|
+
{{#unless sameTab}}target="_blank"{{/unless}}
|
|
19
|
+
aria-label="{{name}}"
|
|
20
|
+
>
|
|
21
|
+
<img
|
|
22
|
+
class="why-not-add-card__image"
|
|
23
|
+
src="{{image.url}}"
|
|
24
|
+
alt="{{image.altText}}"
|
|
25
|
+
>
|
|
26
|
+
</a>
|
|
27
|
+
{{else}}
|
|
28
|
+
<img
|
|
29
|
+
class="why-not-add-card__image"
|
|
30
|
+
src="{{image.url}}"
|
|
31
|
+
alt="{{image.altText}}"
|
|
32
|
+
>
|
|
33
|
+
{{/if}}
|
|
19
34
|
{{/if}}
|
|
20
35
|
|
|
21
36
|
<div class="why-not-add-card__content">
|
|
22
|
-
<a
|
|
37
|
+
<a
|
|
38
|
+
href="{{url}}"
|
|
39
|
+
{{#unless sameTab}}target="_blank"{{/unless}}
|
|
40
|
+
class="why-not-add-card__title"
|
|
41
|
+
>
|
|
23
42
|
{{name}}
|
|
24
43
|
</a>
|
|
25
44
|
|
|
@@ -10,9 +10,9 @@
|
|
|
10
10
|
{{#ifCond price-vat '&&' was_price-vat}}
|
|
11
11
|
<div class="pdp-price__old-price"><s>£{{was_price-vat}}</s></div>
|
|
12
12
|
<div class="main-price">
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
13
|
+
<div class="main-price__value pdp-price__new-price">£{{price-vat}}</div>
|
|
14
|
+
<div class="main-price__vat">Inc.VAT</div>
|
|
15
|
+
</div>
|
|
16
16
|
{{else}}
|
|
17
17
|
<div class="pdp-price__old-price"><s>£119.99</s></div>
|
|
18
18
|
<div class="main-price">
|
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
<div class="pdp-price__remainder">You save £40</div>
|
|
28
28
|
{{/unless}}
|
|
29
29
|
{{#if isExcludingDelivery}}
|
|
30
|
-
|
|
30
|
+
<a href="#" class="pdp-price__excluding-delivery">Excluding delivery</a>
|
|
31
31
|
{{/if}}
|
|
32
32
|
{{#if isDescription}}
|
|
33
33
|
{{#if isCashback}}
|
|
@@ -47,7 +47,6 @@
|
|
|
47
47
|
</div>
|
|
48
48
|
{{/if}}
|
|
49
49
|
{{/if}}
|
|
50
|
-
|
|
51
50
|
{{else}}
|
|
52
51
|
{{#if price}}
|
|
53
52
|
<div class="pdp-price__price">£{{price}}</div>
|
|
@@ -55,18 +54,19 @@
|
|
|
55
54
|
<div class="pdp-price__price">£79.99</div>
|
|
56
55
|
{{/if}}
|
|
57
56
|
{{#ifCond isExcludingDelivery '&&' package}}
|
|
58
|
-
|
|
57
|
+
<a href="#" class="pdp-price__excluding-delivery">Excluding delivery</a>
|
|
59
58
|
{{/ifCond}}
|
|
60
59
|
{{/if}}
|
|
61
60
|
</div>
|
|
61
|
+
|
|
62
62
|
<div class="pdp-price-sale__value excluding-vat d-none">
|
|
63
63
|
{{#if isDiscount}}
|
|
64
64
|
{{#ifCond price '&&' was_price}}
|
|
65
65
|
<div class="pdp-price__old-price"><s>£{{was_price}}</s></div>
|
|
66
66
|
<div class="main-price">
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
67
|
+
<div class="main-price__value pdp-price__new-price">£{{price}}</div>
|
|
68
|
+
<div class="main-price__vat">Exc.VAT</div>
|
|
69
|
+
</div>
|
|
70
70
|
{{else}}
|
|
71
71
|
<div class="pdp-price__old-price"><s>£118.99</s></div>
|
|
72
72
|
<div class="main-price">
|
|
@@ -81,7 +81,7 @@
|
|
|
81
81
|
<div class="pdp-price__remainder">You save £39</div>
|
|
82
82
|
{{/unless}}
|
|
83
83
|
{{#if isExcludingDelivery}}
|
|
84
|
-
|
|
84
|
+
<a href="#" class="pdp-price__excluding-delivery">Excluding delivery</a>
|
|
85
85
|
{{/if}}
|
|
86
86
|
{{#if isDescription}}
|
|
87
87
|
{{#if isCashback}}
|
|
@@ -101,7 +101,6 @@
|
|
|
101
101
|
</div>
|
|
102
102
|
{{/if}}
|
|
103
103
|
{{/if}}
|
|
104
|
-
|
|
105
104
|
{{else}}
|
|
106
105
|
{{#if price}}
|
|
107
106
|
<div class="pdp-price__price">£{{price}}</div>
|
|
@@ -109,7 +108,7 @@
|
|
|
109
108
|
<div class="pdp-price__price">£79.99</div>
|
|
110
109
|
{{/if}}
|
|
111
110
|
{{#ifCond isExcludingDelivery '&&' package}}
|
|
112
|
-
|
|
111
|
+
<a href="#" class="pdp-price__excluding-delivery">Excluding delivery</a>
|
|
113
112
|
{{/ifCond}}
|
|
114
113
|
{{/if}}
|
|
115
114
|
</div>
|
|
@@ -133,7 +132,7 @@
|
|
|
133
132
|
{{/unless}}
|
|
134
133
|
|
|
135
134
|
{{#if isExcludingDelivery}}
|
|
136
|
-
|
|
135
|
+
<a href="#" class="pdp-price__excluding-delivery">Excluding delivery</a>
|
|
137
136
|
{{/if}}
|
|
138
137
|
|
|
139
138
|
{{#if isDescription}}
|
|
@@ -163,7 +162,7 @@
|
|
|
163
162
|
<div class="pdp-price__price">£79.99</div>
|
|
164
163
|
{{/if}}
|
|
165
164
|
{{#ifCond isExcludingDelivery '&&' package}}
|
|
166
|
-
|
|
165
|
+
<a href="#" class="pdp-price__excluding-delivery">Excluding delivery</a>
|
|
167
166
|
{{/ifCond}}
|
|
168
167
|
{{/if}}
|
|
169
168
|
</div>
|
|
@@ -173,7 +172,7 @@
|
|
|
173
172
|
<div class="pdp-price__message-wrapper">
|
|
174
173
|
<div>
|
|
175
174
|
<span class="pdp-price__delivery-message">Delivery:</span>
|
|
176
|
-
<span>Delivery options shown at checkout. Items may be delivered separately. Minimum
|
|
175
|
+
<span>Delivery options shown at checkout. Items may be delivered separately. Minimum �4 delivery charge applies.</span>
|
|
177
176
|
</div>
|
|
178
177
|
|
|
179
178
|
<div>
|
|
@@ -183,56 +182,70 @@
|
|
|
183
182
|
</div>
|
|
184
183
|
{{/ifCond}}
|
|
185
184
|
|
|
185
|
+
{{#if currentlyInStock}}
|
|
186
|
+
{{#if noDelivery}}
|
|
187
|
+
<div class="pdp-price__oos">
|
|
188
|
+
<strong>Not available for delivery</strong>
|
|
189
|
+
<p>Sorry, this product is not available for delivery</p>
|
|
190
|
+
</div>
|
|
191
|
+
{{else}}
|
|
192
|
+
{{#unless package}}
|
|
193
|
+
<div class="pdp-price__value pdp-price__value_extended">
|
|
194
|
+
<div class="pdp-price__delivery">
|
|
195
|
+
<span class="delivery-link">Delivery</span>
|
|
196
|
+
<span class="delivery-info">Available to certain postcodes</span>
|
|
197
|
+
</div>
|
|
198
|
+
</div>
|
|
199
|
+
{{/unless}}
|
|
200
|
+
{{/if}}
|
|
201
|
+
{{else if notifyMe}}
|
|
202
|
+
<div class="pdp-price__oos">
|
|
203
|
+
<a href="#" class="btn btn-action btn_full">
|
|
204
|
+
<span class="btn__text">Notify Me</span>
|
|
205
|
+
</a>
|
|
206
|
+
<p>Currently out of stock, use our Notify Me button to receive an email when this item is available</p>
|
|
207
|
+
</div>
|
|
208
|
+
{{else}}
|
|
209
|
+
<div class="pdp-price__oos">
|
|
210
|
+
<strong>Out of Stock</strong>
|
|
211
|
+
<p>Sorry, this product is out of stock</p>
|
|
212
|
+
</div>
|
|
213
|
+
<div class="pdp-price__in-store-only">
|
|
214
|
+
<p>In Store Only</p>
|
|
215
|
+
</div>
|
|
216
|
+
{{/if}}
|
|
217
|
+
|
|
218
|
+
{{#if similarProductsMockDataKey}}
|
|
219
|
+
{{> bloomreach/why-not-add context=similarProductsMockDataKey similarProducts=true}}
|
|
220
|
+
{{/if}}
|
|
221
|
+
|
|
186
222
|
{{#if klarna-placement}}
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
223
|
+
<div class="pdp-price__klarna-payment">
|
|
224
|
+
<klarna-placement
|
|
225
|
+
data-key="credit-promotion-badge"
|
|
226
|
+
data-locale="en-GB"
|
|
227
|
+
data-purchase-amount="12000"
|
|
228
|
+
{{#if klarna-method-ids}}data-custom-payment-method-ids="{{klarna-method-ids}}"{{/if}}
|
|
229
|
+
></klarna-placement>
|
|
230
|
+
</div>
|
|
195
231
|
{{/if}}
|
|
196
232
|
{{#if billie-placement}}
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
233
|
+
<div class="pdp-price__billie-payment">
|
|
234
|
+
{{> billie-online-messaging}}
|
|
235
|
+
</div>
|
|
200
236
|
{{/if}}
|
|
201
237
|
{{#if clearpay-placement}}
|
|
202
|
-
|
|
238
|
+
{{> clearpay}}
|
|
203
239
|
{{/if}}
|
|
204
240
|
</div>
|
|
205
|
-
|
|
206
|
-
{{#unless package}}
|
|
207
|
-
<div class="pdp-price__value pdp-price__value_extended">
|
|
208
|
-
<div class="pdp-price__delivery">
|
|
209
|
-
<span class="delivery-link">Delivery</span>
|
|
210
|
-
<span class="delivery-info">Available to certain postcodes</span>
|
|
211
|
-
</div>
|
|
212
|
-
</div>
|
|
213
|
-
{{/unless}}
|
|
214
|
-
{{else if notifyMe}}
|
|
215
|
-
<div class="pdp-price__oos">
|
|
216
|
-
<a href="#" class="btn btn-action btn_full">
|
|
217
|
-
<span class="btn__text">Notify Me</span>
|
|
218
|
-
</a>
|
|
219
|
-
<p>Currently out of stock, use our Notify Me button to receive an email when this item is available</p>
|
|
220
|
-
</div>
|
|
221
|
-
{{else}}
|
|
222
|
-
<div class="pdp-price__oos">
|
|
223
|
-
<strong>Out of Stock</strong>
|
|
224
|
-
<p>Sorry, this product is out of stock</p>
|
|
225
|
-
</div>
|
|
226
|
-
<div class="pdp-price__in-store-only">
|
|
227
|
-
<p>In Store Only</p>
|
|
228
|
-
</div>
|
|
229
|
-
{{/if}}
|
|
241
|
+
|
|
230
242
|
<div class="pdp-price__controls">
|
|
231
243
|
{{#if isSize}}
|
|
232
244
|
<div class="pdp-price__size">
|
|
233
245
|
{{> form-row row-mod="sort-order-by" dropdown="true" id="d1" placeholder="Please select a size"}}
|
|
234
246
|
</div>
|
|
235
247
|
{{/if}}
|
|
248
|
+
|
|
236
249
|
<div class="
|
|
237
250
|
pdp-price__control-holder
|
|
238
251
|
{{#unless wisdom}}
|
|
@@ -250,36 +263,41 @@
|
|
|
250
263
|
{{#unless default-store}}
|
|
251
264
|
<div class="pdp-price__calculator-wrapper">
|
|
252
265
|
<a href="#">
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
266
|
+
<span class="icon">
|
|
267
|
+
<i class="far fa-calculator"></i>
|
|
268
|
+
</span>
|
|
256
269
|
Calculator
|
|
257
270
|
</a>
|
|
258
271
|
</div>
|
|
259
272
|
{{/unless}}
|
|
260
273
|
</div>
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
274
|
+
|
|
275
|
+
{{#unless similarProductsMockDataKey}}
|
|
276
|
+
{{#if isWhyNotAdd}}
|
|
277
|
+
{{> bloomreach/why-not-add context=mockDataKey}}
|
|
278
|
+
{{/if}}
|
|
279
|
+
{{/unless}}
|
|
280
|
+
|
|
264
281
|
{{#if mfeProductCalculator}}
|
|
265
282
|
<div class="pdp-price__quantity-calculator">MFE Calculator Placeholder</div>
|
|
266
283
|
{{/if}}
|
|
284
|
+
|
|
267
285
|
{{#if currentlyInStock}}
|
|
268
286
|
{{> pdp-price-actions
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
287
|
+
installation=install
|
|
288
|
+
order-sample=sample
|
|
289
|
+
c-and-c=cc
|
|
290
|
+
delivery=delivery
|
|
291
|
+
big-wins=big-wins
|
|
292
|
+
wisdom=wisdom
|
|
293
|
+
mcfc=mcfc
|
|
294
|
+
available=available
|
|
295
|
+
stock-accordion="stock-accordion"
|
|
296
|
+
isUserNonRegistered=isUserNonRegistered
|
|
297
|
+
nearest-purchase=nearest-purchase
|
|
298
|
+
unhappy=unhappy
|
|
299
|
+
nearestAmount=nearestAmount
|
|
300
|
+
nearestName=nearestName
|
|
283
301
|
}}
|
|
284
302
|
<div class="pdp-price__call-to-actions">
|
|
285
303
|
{{#unless default-store}}
|
package/src/js/emulation/mock.js
CHANGED
|
@@ -4035,3 +4035,12 @@ Wick.FEMock = {
|
|
|
4035
4035
|
</div>
|
|
4036
4036
|
`,
|
|
4037
4037
|
};
|
|
4038
|
+
|
|
4039
|
+
Wick.FEMock.dataBloomreach.similarProductsRecommendations = {
|
|
4040
|
+
...Wick.FEMock.dataBloomreach.whyNotAddRecommendations,
|
|
4041
|
+
widgetMetadata: {
|
|
4042
|
+
responseId: 'mock-similar-products-response',
|
|
4043
|
+
id: 'similar-products-12345',
|
|
4044
|
+
type: 'similar_products',
|
|
4045
|
+
},
|
|
4046
|
+
};
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
var Wick = window.Wick || {};
|
|
2
|
+
|
|
3
|
+
$(document).ready(function () {
|
|
4
|
+
window.setTimeout(function () {
|
|
5
|
+
const $container = $('[data-similar-products-widget]').first();
|
|
6
|
+
|
|
7
|
+
if (!$container.length) {
|
|
8
|
+
return;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
const mockDataKey = $container.attr('data-mock-key');
|
|
12
|
+
const payloadData =
|
|
13
|
+
Wick.FEMock && Wick.FEMock.dataBloomreach && Wick.FEMock.dataBloomreach[mockDataKey];
|
|
14
|
+
|
|
15
|
+
if (!payloadData) {
|
|
16
|
+
$container.empty().hide();
|
|
17
|
+
return;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
Wick.BloomreachWidget.init('similarProducts', payloadData);
|
|
21
|
+
}, 3000);
|
|
22
|
+
});
|
|
@@ -34,6 +34,7 @@ export function createBloomreachRecommendationCarouselWidget(config) {
|
|
|
34
34
|
};
|
|
35
35
|
const el = {
|
|
36
36
|
...DEFAULT_EL,
|
|
37
|
+
...(config.el || {}),
|
|
37
38
|
widgetContainer: config.widgetContainer,
|
|
38
39
|
};
|
|
39
40
|
const addToCartEvent = config.addToCartEvent || 'addToCart';
|
|
@@ -58,9 +59,6 @@ export function createBloomreachRecommendationCarouselWidget(config) {
|
|
|
58
59
|
.map(function (item) {
|
|
59
60
|
return item.baseProduct || item;
|
|
60
61
|
})
|
|
61
|
-
.filter(function (product) {
|
|
62
|
-
return config.isEligibleProduct ? config.isEligibleProduct(product) : true;
|
|
63
|
-
})
|
|
64
62
|
.slice(0, 5);
|
|
65
63
|
}
|
|
66
64
|
|
|
@@ -85,6 +83,8 @@ export function createBloomreachRecommendationCarouselWidget(config) {
|
|
|
85
83
|
...Wick.BloomreachWidget.getProductRenderData(product),
|
|
86
84
|
addToCartError: config.addToCartError,
|
|
87
85
|
showBadge: !config.hideBadge,
|
|
86
|
+
sameTab: Boolean(config.sameTab),
|
|
87
|
+
linkImage: Boolean(config.linkImage),
|
|
88
88
|
};
|
|
89
89
|
}),
|
|
90
90
|
isSingleProduct: products.length === 1,
|
|
@@ -130,7 +130,7 @@ export function createBloomreachRecommendationCarouselWidget(config) {
|
|
|
130
130
|
navigation: {
|
|
131
131
|
nextEl: $widget.find(el.next)[0],
|
|
132
132
|
prevEl: $widget.find(el.prev)[0],
|
|
133
|
-
disabledClass: 'why-not-add__arrow--disabled',
|
|
133
|
+
disabledClass: config.arrowDisabledClass || 'why-not-add__arrow--disabled',
|
|
134
134
|
},
|
|
135
135
|
pagination: {
|
|
136
136
|
el: $widget.find(el.pagination)[0],
|
|
@@ -140,8 +140,9 @@ export function createBloomreachRecommendationCarouselWidget(config) {
|
|
|
140
140
|
index + 1
|
|
141
141
|
}"></button>`;
|
|
142
142
|
},
|
|
143
|
-
bulletClass: 'why-not-add__pagination-item',
|
|
144
|
-
bulletActiveClass:
|
|
143
|
+
bulletClass: config.paginationItemClass || 'why-not-add__pagination-item',
|
|
144
|
+
bulletActiveClass:
|
|
145
|
+
config.paginationActiveItemClass || 'why-not-add__pagination-item--active',
|
|
145
146
|
},
|
|
146
147
|
});
|
|
147
148
|
|
|
@@ -56,6 +56,8 @@ export function createBloomreachWidget(config) {
|
|
|
56
56
|
config.renderWidget($container, payloadData, widget);
|
|
57
57
|
}
|
|
58
58
|
|
|
59
|
+
Wick.BloomreachWidget.removeBlankTargets($container);
|
|
60
|
+
|
|
59
61
|
if (config.initRenderedWidget) {
|
|
60
62
|
config.initRenderedWidget($container, widget);
|
|
61
63
|
}
|
|
@@ -4,6 +4,7 @@ import './bloomreach-widget-core';
|
|
|
4
4
|
import Widget from './complete-your-project/widget';
|
|
5
5
|
import WhyNotAddWidget from './why-not-add-widget';
|
|
6
6
|
import DontForgetWidget from './dont-forget-widget';
|
|
7
|
+
import SimilarProductsWidget from './similar-products-widget';
|
|
7
8
|
|
|
8
9
|
Wick.BloomreachWidget.registerWidgets([
|
|
9
10
|
{
|
|
@@ -18,4 +19,8 @@ Wick.BloomreachWidget.registerWidgets([
|
|
|
18
19
|
type: 'dontForget',
|
|
19
20
|
widget: DontForgetWidget,
|
|
20
21
|
},
|
|
22
|
+
{
|
|
23
|
+
type: 'similarProducts',
|
|
24
|
+
widget: SimilarProductsWidget,
|
|
25
|
+
},
|
|
21
26
|
]);
|
|
@@ -124,7 +124,6 @@ function initRenderedWidget($container) {
|
|
|
124
124
|
return;
|
|
125
125
|
}
|
|
126
126
|
|
|
127
|
-
Wick.BloomreachWidget.removeBlankTargets($completeWidget);
|
|
128
127
|
Wick.BloomreachWidget.drawRating($completeWidget);
|
|
129
128
|
cards.bindCardSelection($completeWidget);
|
|
130
129
|
cards.bindDropdowns();
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { createBloomreachRecommendationCarouselWidget } from './bloomreach-recommendation-carousel-widget';
|
|
2
|
+
|
|
3
|
+
const SimilarProductsWidget = createBloomreachRecommendationCarouselWidget({
|
|
4
|
+
namespace: 'similarProducts',
|
|
5
|
+
title: 'Similar products',
|
|
6
|
+
widgetContainer: '[data-similar-products-widget]',
|
|
7
|
+
disableAfterSuccess: false,
|
|
8
|
+
disableAfterFailure: false,
|
|
9
|
+
hideBadge: true,
|
|
10
|
+
sameTab: true,
|
|
11
|
+
linkImage: true,
|
|
12
|
+
el: {
|
|
13
|
+
productLink: '.why-not-add-card__title, .why-not-add-card__image-link',
|
|
14
|
+
},
|
|
15
|
+
});
|
|
16
|
+
|
|
17
|
+
export default SimilarProductsWidget;
|