@colijnit/product 257.1.7 → 258.1.1
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/app/components/product-page/product-page.component.d.ts +1 -0
- package/app/components/product-selector-type/product-selector-type.component.d.ts +1 -0
- package/app/components/render-carousel/render-carousel.component.d.ts +40 -0
- package/app/components/render-carousel/render-carousel.module.d.ts +2 -0
- package/app/enum/icon.enum.d.ts +2 -0
- package/app/ione-product.component.d.ts +5 -11
- package/app/model/productSettings.d.ts +2 -14
- package/app/service/product-event.service.d.ts +2 -0
- package/bundles/colijnit-product.umd.js +552 -414
- package/bundles/colijnit-product.umd.js.map +1 -1
- package/colijnit-product.d.ts +6 -4
- package/colijnit-product.metadata.json +1 -1
- package/esm2015/app/components/product-page/product-page.component.js +8 -3
- package/esm2015/app/components/product-page/product-page.module.js +4 -2
- package/esm2015/app/components/product-selector-type/product-selector-type.component.js +10 -2
- package/esm2015/app/components/render-carousel/render-carousel.component.js +127 -0
- package/esm2015/app/components/render-carousel/render-carousel.module.js +25 -0
- package/esm2015/app/enum/icon.enum.js +3 -1
- package/esm2015/app/ione-product.component.js +26 -27
- package/esm2015/app/ione-product.module.js +3 -13
- package/esm2015/app/model/icon.js +3 -1
- package/esm2015/app/model/productSettings.js +4 -6
- package/esm2015/app/product-version.js +3 -3
- package/esm2015/app/service/product-event.service.js +3 -1
- package/esm2015/colijnit-product.js +7 -5
- package/fesm2015/colijnit-product.js +487 -333
- package/fesm2015/colijnit-product.js.map +1 -1
- package/package.json +8 -8
|
@@ -1,7 +1,10 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import {
|
|
2
|
+
import { Directive, Injectable, EventEmitter, Component, ViewEncapsulation, Input, Output, Renderer2, ChangeDetectorRef, ViewChild, ElementRef, Pipe, NgModule, ChangeDetectionStrategy, HostListener, HostBinding, SecurityContext, CUSTOM_ELEMENTS_SCHEMA, Inject, PLATFORM_ID, NO_ERRORS_SCHEMA } from '@angular/core';
|
|
3
3
|
import { __awaiter } from 'tslib';
|
|
4
4
|
import { Subject, BehaviorSubject } from 'rxjs';
|
|
5
|
+
import * as i1 from '@angular/common/http';
|
|
6
|
+
import { HttpClient } from '@angular/common/http';
|
|
7
|
+
import { StringUtils } from '@colijnit/ioneconnector/build/utils/string-utils';
|
|
5
8
|
import { Options } from '@colijnit/ioneconnector/build/model/options';
|
|
6
9
|
import { ArticleFullObject } from '@colijnit/articleapi/build/model/article-full-object';
|
|
7
10
|
import { SuperArticle } from '@colijnit/articleapi/build/model/super-article';
|
|
@@ -13,9 +16,6 @@ import { Transaction } from '@colijnit/transactionapi/build/transaction';
|
|
|
13
16
|
import { MainApi } from '@colijnit/mainapi';
|
|
14
17
|
import { TransactionInfoResponse } from '@colijnit/transactionapi/build/model/transaction-info-response.bo';
|
|
15
18
|
import { ArticleListObjectExtended } from '@colijnit/articleapi/build/model/article-list-object-extended.bo';
|
|
16
|
-
import * as i1 from '@angular/common/http';
|
|
17
|
-
import { HttpClient } from '@angular/common/http';
|
|
18
|
-
import { StringUtils } from '@colijnit/ioneconnector/build/utils/string-utils';
|
|
19
19
|
import { CommonModule, isPlatformBrowser } from '@angular/common';
|
|
20
20
|
import { trigger, state, style, transition, animate } from '@angular/animations';
|
|
21
21
|
import * as i1$1 from '@angular/platform-browser';
|
|
@@ -23,84 +23,15 @@ import { DomSanitizer } from '@angular/platform-browser';
|
|
|
23
23
|
import { IconModule, LoaderModule, ScrollContainerModule, PriceDisplayPipeModule, NumberPickerModule, ButtonModule, FilesUploadModule, TileModule } from '@colijnit/corecomponents';
|
|
24
24
|
import { CoDocument } from '@colijnit/mainapi/build/model/co-document';
|
|
25
25
|
import { ConfiguratorStatisticsEnvironment } from '@colijnit/articleapi/build/model/configurator-statistics-environment';
|
|
26
|
-
import { LoaderModule as LoaderModule$1, ArticleTileModule, ButtonModule as ButtonModule$1 } from '@colijnit/corecomponents_v12';
|
|
26
|
+
import { LoaderModule as LoaderModule$1, ArticleTileModule, IconCollapseHandleModule, ButtonModule as ButtonModule$1 } from '@colijnit/corecomponents_v12';
|
|
27
27
|
|
|
28
28
|
// this file is dynamically created, do not change this
|
|
29
29
|
class Version {
|
|
30
30
|
constructor() {
|
|
31
31
|
this.name = "@colijnit/product";
|
|
32
32
|
this.description = "Product detail page project for iOne";
|
|
33
|
-
this.symVer = "
|
|
34
|
-
this.publishDate = "
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
class JsonUtilsService {
|
|
39
|
-
readJsonFile(filePath) {
|
|
40
|
-
return __awaiter(this, void 0, void 0, function* () {
|
|
41
|
-
try {
|
|
42
|
-
const response = yield fetch(filePath);
|
|
43
|
-
if (!response.ok) {
|
|
44
|
-
return null;
|
|
45
|
-
}
|
|
46
|
-
else {
|
|
47
|
-
return response.json();
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
catch (e) {
|
|
51
|
-
console.error('Error getting file:', e.message);
|
|
52
|
-
return '';
|
|
53
|
-
}
|
|
54
|
-
});
|
|
55
|
-
}
|
|
56
|
-
}
|
|
57
|
-
JsonUtilsService.ɵprov = i0.ɵɵdefineInjectable({ factory: function JsonUtilsService_Factory() { return new JsonUtilsService(); }, token: JsonUtilsService, providedIn: "root" });
|
|
58
|
-
JsonUtilsService.decorators = [
|
|
59
|
-
{ type: Injectable, args: [{
|
|
60
|
-
providedIn: 'root'
|
|
61
|
-
},] }
|
|
62
|
-
];
|
|
63
|
-
|
|
64
|
-
class SettingsOptions {
|
|
65
|
-
constructor() {
|
|
66
|
-
this.showStockStatus = false;
|
|
67
|
-
this.showZoomButton = false;
|
|
68
|
-
this.showTagFilter = false;
|
|
69
|
-
this.showAsConfigured = false;
|
|
70
|
-
this.inlineAnswers = false;
|
|
71
|
-
this.showArButton = false;
|
|
72
|
-
this.arEnabled = false;
|
|
73
|
-
this.vrEnabled = false;
|
|
74
|
-
}
|
|
75
|
-
}
|
|
76
|
-
|
|
77
|
-
var RenderModes;
|
|
78
|
-
(function (RenderModes) {
|
|
79
|
-
RenderModes["RenderRoom"] = "render_room";
|
|
80
|
-
RenderModes["RenderShop"] = "render_shop";
|
|
81
|
-
RenderModes["RenderIone"] = "render_ione";
|
|
82
|
-
})(RenderModes || (RenderModes = {}));
|
|
83
|
-
|
|
84
|
-
class RenderParameters {
|
|
85
|
-
constructor() {
|
|
86
|
-
this.host = "";
|
|
87
|
-
this.port = 0;
|
|
88
|
-
this.secure = false;
|
|
89
|
-
this.renderMode = RenderModes.RenderShop;
|
|
90
|
-
}
|
|
91
|
-
}
|
|
92
|
-
|
|
93
|
-
class ProductSettings {
|
|
94
|
-
constructor() {
|
|
95
|
-
this.session = undefined;
|
|
96
|
-
this.useGroups = true;
|
|
97
|
-
this.useRenders = false;
|
|
98
|
-
this.useLoginEncryption = true;
|
|
99
|
-
this.createWebOrder = true;
|
|
100
|
-
this.useMatch = false;
|
|
101
|
-
this.currencySymbol = '€';
|
|
102
|
-
this.options = new SettingsOptions();
|
|
103
|
-
this.renderParameters = new RenderParameters();
|
|
33
|
+
this.symVer = "258.1.1";
|
|
34
|
+
this.publishDate = "27-5-2025 09:44:32";
|
|
104
35
|
}
|
|
105
36
|
}
|
|
106
37
|
|
|
@@ -118,8 +49,10 @@ class ProductEventService {
|
|
|
118
49
|
this.onDraftRenderImageReceived = new Subject();
|
|
119
50
|
this.onArticleInfoReceived = new Subject();
|
|
120
51
|
this.onAnswersAvailable = new Subject();
|
|
52
|
+
this.onReadyToRender = new Subject();
|
|
121
53
|
this.onUpdateProductInfoTab = new Subject();
|
|
122
54
|
this.errorMessage = new Subject();
|
|
55
|
+
this.onGetRenderForRenderCarousel = new Subject();
|
|
123
56
|
}
|
|
124
57
|
}
|
|
125
58
|
ProductEventService.decorators = [
|
|
@@ -127,170 +60,30 @@ ProductEventService.decorators = [
|
|
|
127
60
|
{ type: Injectable }
|
|
128
61
|
];
|
|
129
62
|
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
class ProductConnectorAdapterService {
|
|
133
|
-
constructor(_eventService) {
|
|
134
|
-
this._eventService = _eventService;
|
|
135
|
-
this.showLoader = new Subject();
|
|
136
|
-
this._boFactory = new BusinessObjectFactory();
|
|
137
|
-
this._subs = [];
|
|
138
|
-
}
|
|
139
|
-
ngOnDestroy() {
|
|
140
|
-
this._subs.forEach(s => s.unsubscribe());
|
|
141
|
-
}
|
|
142
|
-
initConnector(options) {
|
|
143
|
-
return __awaiter(this, void 0, void 0, function* () {
|
|
144
|
-
this.articleConnector = new Articles(options);
|
|
145
|
-
yield this.articleConnector.connect();
|
|
146
|
-
this.transactionConnector = new Transaction(options);
|
|
147
|
-
this._subs.push(
|
|
148
|
-
// @ts-ignore
|
|
149
|
-
this.articleConnector.showLoader.subscribe(value => this.showLoader.next(value)));
|
|
150
|
-
});
|
|
151
|
-
}
|
|
152
|
-
setInstance(instanceId) {
|
|
153
|
-
// this.articleConnector.setInstanceToConfigure(instanceId, false);
|
|
154
|
-
}
|
|
155
|
-
getProductBundleSettings(url, upId) {
|
|
156
|
-
return __awaiter(this, void 0, void 0, function* () {
|
|
157
|
-
const tempSettings = new ProductSettings();
|
|
158
|
-
tempSettings.url = url;
|
|
159
|
-
tempSettings.schema = upId.toString();
|
|
160
|
-
const tempMainConnector = new MainApi(tempSettings);
|
|
161
|
-
const response = yield tempMainConnector.getPublicParams(upId);
|
|
162
|
-
if (response) {
|
|
163
|
-
return response.productSettings;
|
|
164
|
-
}
|
|
165
|
-
return "";
|
|
166
|
-
});
|
|
167
|
-
}
|
|
168
|
-
convertArticleFullObjectToArticleExtended(article) {
|
|
169
|
-
if (article) {
|
|
170
|
-
return this._boFactory.makeWithRawBackendData(ArticleListObjectExtended, article);
|
|
171
|
-
}
|
|
172
|
-
}
|
|
173
|
-
getDeliveryPrognosis(goodId, branchNr) {
|
|
174
|
-
return __awaiter(this, void 0, void 0, function* () {
|
|
175
|
-
const deliveryPrognosis = yield this.getSelectorDeliveryDate();
|
|
176
|
-
if (!deliveryPrognosis || !deliveryPrognosis.returnValue) {
|
|
177
|
-
return this.getDeliveryDate2(goodId);
|
|
178
|
-
}
|
|
179
|
-
return deliveryPrognosis;
|
|
180
|
-
});
|
|
181
|
-
}
|
|
182
|
-
getSelectorDeliveryDate() {
|
|
183
|
-
return __awaiter(this, void 0, void 0, function* () {
|
|
184
|
-
const response = yield this.articleConnector.getSelectorDeliveryDate();
|
|
185
|
-
if (response && response.validationResult && response.validationResult.success) {
|
|
186
|
-
return this._boFactory.makeWithRawBackendData(DeliveryPrognosis, response.resultObject);
|
|
187
|
-
}
|
|
188
|
-
else {
|
|
189
|
-
return null;
|
|
190
|
-
}
|
|
191
|
-
});
|
|
192
|
-
}
|
|
193
|
-
getArtStockStatus(goodId) {
|
|
194
|
-
return __awaiter(this, void 0, void 0, function* () {
|
|
195
|
-
const response = yield this.articleConnector.getArtStockStatus(goodId);
|
|
196
|
-
if (response && response.validationResult && response.validationResult.success) {
|
|
197
|
-
return response.resultObject;
|
|
198
|
-
}
|
|
199
|
-
else {
|
|
200
|
-
return null;
|
|
201
|
-
}
|
|
202
|
-
});
|
|
203
|
-
}
|
|
204
|
-
getDeliveryDate2(goodId) {
|
|
205
|
-
return __awaiter(this, void 0, void 0, function* () {
|
|
206
|
-
const response = yield this.articleConnector.getDeliveryDate2(goodId);
|
|
207
|
-
if (response && response.validationResult && response.validationResult.success) {
|
|
208
|
-
return this._boFactory.makeWithRawBackendData(DeliveryPrognosis, response.resultObject);
|
|
209
|
-
}
|
|
210
|
-
else {
|
|
211
|
-
return null;
|
|
212
|
-
}
|
|
213
|
-
});
|
|
214
|
-
}
|
|
215
|
-
getJsonConfiguredArticles(configuratorStatistics) {
|
|
63
|
+
class JsonUtilsService {
|
|
64
|
+
readJsonFile(filePath) {
|
|
216
65
|
return __awaiter(this, void 0, void 0, function* () {
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
66
|
+
try {
|
|
67
|
+
const response = yield fetch(filePath);
|
|
68
|
+
if (!response.ok) {
|
|
69
|
+
return null;
|
|
70
|
+
}
|
|
71
|
+
else {
|
|
72
|
+
return response.json();
|
|
73
|
+
}
|
|
220
74
|
}
|
|
221
|
-
|
|
75
|
+
catch (e) {
|
|
76
|
+
console.error('Error getting file:', e.message);
|
|
222
77
|
return '';
|
|
223
78
|
}
|
|
224
79
|
});
|
|
225
80
|
}
|
|
226
|
-
getJsonArticleFlatTree(goodId, goodType, quantity, externalSource = false, showLoader = true, instanceId, configuratorStatistics) {
|
|
227
|
-
return __awaiter(this, void 0, void 0, function* () {
|
|
228
|
-
return this.articleConnector.getJsonArticleFlatTree(goodId, goodType, quantity, externalSource, showLoader, instanceId, configuratorStatistics).catch((messages) => {
|
|
229
|
-
this._eventService.errorMessage.next(messages);
|
|
230
|
-
return null;
|
|
231
|
-
});
|
|
232
|
-
});
|
|
233
|
-
}
|
|
234
|
-
getGoodIdFromArticleNr(sku) {
|
|
235
|
-
return __awaiter(this, void 0, void 0, function* () {
|
|
236
|
-
const response = yield this.articleConnector.getGoodIdFromArticleNr(sku);
|
|
237
|
-
if (response && response.validationResult && response.validationResult.success) {
|
|
238
|
-
return response.resultObject;
|
|
239
|
-
}
|
|
240
|
-
else {
|
|
241
|
-
return null;
|
|
242
|
-
}
|
|
243
|
-
});
|
|
244
|
-
}
|
|
245
|
-
getArticleFullObject(goodId, showLoader = true) {
|
|
246
|
-
return __awaiter(this, void 0, void 0, function* () {
|
|
247
|
-
const response = yield this.articleConnector.getArticleFullObject(goodId, showLoader);
|
|
248
|
-
if (response && response.validationResult && response.validationResult.success) {
|
|
249
|
-
return this._boFactory.makeWithRawBackendData(ArticleFullObject, response.resultObject);
|
|
250
|
-
}
|
|
251
|
-
else {
|
|
252
|
-
return null;
|
|
253
|
-
}
|
|
254
|
-
});
|
|
255
|
-
}
|
|
256
|
-
getSuperArticle(id, branch) {
|
|
257
|
-
return __awaiter(this, void 0, void 0, function* () {
|
|
258
|
-
const response = yield this.articleConnector.getSuperArticleQuickSel(id, branch);
|
|
259
|
-
if (response && response.validationResult && response.validationResult.success) {
|
|
260
|
-
return this._boFactory.makeWithRawBackendData(SuperArticle, response.resultObject);
|
|
261
|
-
}
|
|
262
|
-
else {
|
|
263
|
-
return null;
|
|
264
|
-
}
|
|
265
|
-
});
|
|
266
|
-
}
|
|
267
|
-
getDocumentContent(docId, thumbnail = true) {
|
|
268
|
-
return __awaiter(this, void 0, void 0, function* () {
|
|
269
|
-
const response = yield this.articleConnector.getDocumentContent(docId, thumbnail);
|
|
270
|
-
if (response && response.validationResult && response.validationResult.success) {
|
|
271
|
-
return this._boFactory.makeWithRawBackendData(DocumentContent, response.resultObject);
|
|
272
|
-
}
|
|
273
|
-
else {
|
|
274
|
-
return null;
|
|
275
|
-
}
|
|
276
|
-
});
|
|
277
|
-
}
|
|
278
|
-
addWebSessionTransactionLine(transactionUuid, sku, quantity) {
|
|
279
|
-
return __awaiter(this, void 0, void 0, function* () {
|
|
280
|
-
const response = yield this.transactionConnector.addWebSessionTransactionLine(transactionUuid, sku, quantity);
|
|
281
|
-
if (response && response.validationResult && response.validationResult.success) {
|
|
282
|
-
const infoResponse = this._boFactory.makeWithRawBackendData(TransactionInfoResponse, response.resultObject);
|
|
283
|
-
return infoResponse.transactionInfo.uuid;
|
|
284
|
-
}
|
|
285
|
-
return "";
|
|
286
|
-
});
|
|
287
|
-
}
|
|
288
81
|
}
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
82
|
+
JsonUtilsService.ɵprov = i0.ɵɵdefineInjectable({ factory: function JsonUtilsService_Factory() { return new JsonUtilsService(); }, token: JsonUtilsService, providedIn: "root" });
|
|
83
|
+
JsonUtilsService.decorators = [
|
|
84
|
+
{ type: Injectable, args: [{
|
|
85
|
+
providedIn: 'root'
|
|
86
|
+
},] }
|
|
294
87
|
];
|
|
295
88
|
|
|
296
89
|
var LanguageCode;
|
|
@@ -475,95 +268,301 @@ class DictionaryService {
|
|
|
475
268
|
}
|
|
476
269
|
return text;
|
|
477
270
|
}
|
|
478
|
-
}
|
|
479
|
-
DictionaryService.ɵprov = i0.ɵɵdefineInjectable({ factory: function DictionaryService_Factory() { return new DictionaryService(i0.ɵɵinject(i1.HttpClient), i0.ɵɵinject(JsonUtilsService)); }, token: DictionaryService, providedIn: "root" });
|
|
480
|
-
DictionaryService.decorators = [
|
|
481
|
-
{ type: Injectable, args: [{
|
|
482
|
-
providedIn: 'root'
|
|
483
|
-
},] }
|
|
484
|
-
];
|
|
485
|
-
DictionaryService.ctorParameters = () => [
|
|
486
|
-
{ type: HttpClient },
|
|
487
|
-
{ type: JsonUtilsService }
|
|
488
|
-
];
|
|
489
|
-
|
|
490
|
-
class
|
|
491
|
-
constructor(
|
|
492
|
-
this.
|
|
493
|
-
this.
|
|
494
|
-
this.
|
|
271
|
+
}
|
|
272
|
+
DictionaryService.ɵprov = i0.ɵɵdefineInjectable({ factory: function DictionaryService_Factory() { return new DictionaryService(i0.ɵɵinject(i1.HttpClient), i0.ɵɵinject(JsonUtilsService)); }, token: DictionaryService, providedIn: "root" });
|
|
273
|
+
DictionaryService.decorators = [
|
|
274
|
+
{ type: Injectable, args: [{
|
|
275
|
+
providedIn: 'root'
|
|
276
|
+
},] }
|
|
277
|
+
];
|
|
278
|
+
DictionaryService.ctorParameters = () => [
|
|
279
|
+
{ type: HttpClient },
|
|
280
|
+
{ type: JsonUtilsService }
|
|
281
|
+
];
|
|
282
|
+
|
|
283
|
+
class SettingsOptions {
|
|
284
|
+
constructor() {
|
|
285
|
+
this.showStockStatus = false;
|
|
286
|
+
this.showZoomButton = false;
|
|
287
|
+
this.showTagFilter = false;
|
|
288
|
+
this.showAsConfigured = false;
|
|
289
|
+
this.inlineAnswers = false;
|
|
290
|
+
this.showArButton = false;
|
|
291
|
+
this.arEnabled = false;
|
|
292
|
+
this.vrEnabled = false;
|
|
293
|
+
}
|
|
294
|
+
}
|
|
295
|
+
|
|
296
|
+
var RenderModes;
|
|
297
|
+
(function (RenderModes) {
|
|
298
|
+
RenderModes["RenderRoom"] = "render_room";
|
|
299
|
+
RenderModes["RenderShop"] = "render_shop";
|
|
300
|
+
RenderModes["RenderIone"] = "render_ione";
|
|
301
|
+
})(RenderModes || (RenderModes = {}));
|
|
302
|
+
|
|
303
|
+
class RenderParameters$1 {
|
|
304
|
+
constructor() {
|
|
305
|
+
this.host = "";
|
|
306
|
+
this.port = 0;
|
|
307
|
+
this.secure = false;
|
|
308
|
+
this.renderMode = RenderModes.RenderShop;
|
|
309
|
+
}
|
|
310
|
+
}
|
|
311
|
+
|
|
312
|
+
class ProductSettings extends Options {
|
|
313
|
+
constructor() {
|
|
314
|
+
super(...arguments);
|
|
315
|
+
this.session = undefined;
|
|
316
|
+
this.createWebOrder = true;
|
|
317
|
+
this.currencySymbol = '€';
|
|
318
|
+
this.options = new SettingsOptions();
|
|
319
|
+
this.renderParameters = new RenderParameters$1();
|
|
320
|
+
}
|
|
321
|
+
}
|
|
322
|
+
|
|
323
|
+
class ProductSettingsService {
|
|
324
|
+
constructor(_jsonUtilsService, _dictionaryService) {
|
|
325
|
+
this._jsonUtilsService = _jsonUtilsService;
|
|
326
|
+
this._dictionaryService = _dictionaryService;
|
|
327
|
+
this.settingsLoaded = new BehaviorSubject(false);
|
|
328
|
+
}
|
|
329
|
+
set settings(value) {
|
|
330
|
+
this._settings = value;
|
|
331
|
+
}
|
|
332
|
+
get settings() {
|
|
333
|
+
return this._settings;
|
|
334
|
+
}
|
|
335
|
+
initializeSettings(finish = true) {
|
|
336
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
337
|
+
// see if there's a json file for application settings
|
|
338
|
+
if (typeof settings === 'undefined') {
|
|
339
|
+
const jsonSettings = yield this._jsonUtilsService.readJsonFile('product-settings.json');
|
|
340
|
+
if (jsonSettings) {
|
|
341
|
+
this.settings = Object.assign(new ProductSettings(), jsonSettings);
|
|
342
|
+
this.settings.options = Object.assign(new SettingsOptions(), this.settings.options);
|
|
343
|
+
if (finish) {
|
|
344
|
+
this.settingsFinished();
|
|
345
|
+
}
|
|
346
|
+
}
|
|
347
|
+
}
|
|
348
|
+
else {
|
|
349
|
+
this.settings = Object.assign(new ProductSettings(), settings);
|
|
350
|
+
this.settings.options = Object.assign(new SettingsOptions(), this.settings.options);
|
|
351
|
+
if (finish) {
|
|
352
|
+
this.settingsFinished();
|
|
353
|
+
}
|
|
354
|
+
}
|
|
355
|
+
});
|
|
356
|
+
}
|
|
357
|
+
createSettingsFromObject(obj) {
|
|
358
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
359
|
+
if (!this.settings) {
|
|
360
|
+
this.settings = new ProductSettings();
|
|
361
|
+
}
|
|
362
|
+
const ownOptions = Object.assign({}, this.settings.options);
|
|
363
|
+
const ownRenderParameters = Object.assign({}, this.settings.renderParameters);
|
|
364
|
+
this.settings = Object.assign({}, this.settings, obj);
|
|
365
|
+
if (obj.renderParameters) {
|
|
366
|
+
this.settings.renderParameters = Object.assign({}, ownRenderParameters, obj.renderParameters);
|
|
367
|
+
}
|
|
368
|
+
if (obj.options) {
|
|
369
|
+
this.settings.options = Object.assign({}, ownOptions, obj.options);
|
|
370
|
+
}
|
|
371
|
+
if (obj.hasOwnProperty('assetPath')) {
|
|
372
|
+
this.settings.assetPath = obj['assetPath'];
|
|
373
|
+
if (this.settings.assetPath[this.settings.assetPath.length - 1] !== '/') {
|
|
374
|
+
this.settings.assetPath += '/';
|
|
375
|
+
}
|
|
376
|
+
this.settings.threeDAssetPath = this.settings.assetPath;
|
|
377
|
+
}
|
|
378
|
+
if (obj.hasOwnProperty('threeDAssetPath')) {
|
|
379
|
+
this.settings.threeDAssetPath = obj['threeDAssetPath'];
|
|
380
|
+
if (this.settings.threeDAssetPath[this.settings.threeDAssetPath.length - 1] !== '/') {
|
|
381
|
+
this.settings.threeDAssetPath += '/';
|
|
382
|
+
}
|
|
383
|
+
}
|
|
384
|
+
this.settingsFinished();
|
|
385
|
+
});
|
|
386
|
+
}
|
|
387
|
+
settingsFinished() {
|
|
388
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
389
|
+
yield this._dictionaryService.setDictionary(this.settings.languageCode);
|
|
390
|
+
this.settingsLoaded.next(true);
|
|
391
|
+
});
|
|
392
|
+
}
|
|
393
|
+
}
|
|
394
|
+
ProductSettingsService.decorators = [
|
|
395
|
+
{ type: Injectable }
|
|
396
|
+
];
|
|
397
|
+
ProductSettingsService.ctorParameters = () => [
|
|
398
|
+
{ type: JsonUtilsService },
|
|
399
|
+
{ type: DictionaryService }
|
|
400
|
+
];
|
|
401
|
+
|
|
402
|
+
// Sole responsibility is simply to wrap around a colijn.Connector to create a stable inner interface to the library in a 1:1 method way.
|
|
403
|
+
// Only to be used by the IOneControllerService.
|
|
404
|
+
class ProductConnectorAdapterService {
|
|
405
|
+
constructor(_eventService) {
|
|
406
|
+
this._eventService = _eventService;
|
|
407
|
+
this.showLoader = new Subject();
|
|
408
|
+
this._boFactory = new BusinessObjectFactory();
|
|
409
|
+
this._subs = [];
|
|
410
|
+
}
|
|
411
|
+
ngOnDestroy() {
|
|
412
|
+
this._subs.forEach(s => s.unsubscribe());
|
|
413
|
+
}
|
|
414
|
+
initConnector(options) {
|
|
415
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
416
|
+
this.articleConnector = new Articles(options);
|
|
417
|
+
yield this.articleConnector.connect();
|
|
418
|
+
this.transactionConnector = new Transaction(options);
|
|
419
|
+
this._subs.push(
|
|
420
|
+
// @ts-ignore
|
|
421
|
+
this.articleConnector.showLoader.subscribe(value => this.showLoader.next(value)));
|
|
422
|
+
});
|
|
423
|
+
}
|
|
424
|
+
setInstance(instanceId) {
|
|
425
|
+
// this.articleConnector.setInstanceToConfigure(instanceId, false);
|
|
426
|
+
}
|
|
427
|
+
getProductBundleSettings(url, upId) {
|
|
428
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
429
|
+
const tempSettings = new ProductSettings();
|
|
430
|
+
tempSettings.url = url;
|
|
431
|
+
tempSettings.schema = upId.toString();
|
|
432
|
+
const tempMainConnector = new MainApi(tempSettings);
|
|
433
|
+
const response = yield tempMainConnector.getPublicParams(upId);
|
|
434
|
+
if (response) {
|
|
435
|
+
return response.productSettings;
|
|
436
|
+
}
|
|
437
|
+
return "";
|
|
438
|
+
});
|
|
439
|
+
}
|
|
440
|
+
convertArticleFullObjectToArticleExtended(article) {
|
|
441
|
+
if (article) {
|
|
442
|
+
return this._boFactory.makeWithRawBackendData(ArticleListObjectExtended, article);
|
|
443
|
+
}
|
|
444
|
+
}
|
|
445
|
+
getDeliveryPrognosis(goodId, branchNr) {
|
|
446
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
447
|
+
const deliveryPrognosis = yield this.getSelectorDeliveryDate();
|
|
448
|
+
if (!deliveryPrognosis || !deliveryPrognosis.returnValue) {
|
|
449
|
+
return this.getDeliveryDate2(goodId);
|
|
450
|
+
}
|
|
451
|
+
return deliveryPrognosis;
|
|
452
|
+
});
|
|
453
|
+
}
|
|
454
|
+
getSelectorDeliveryDate() {
|
|
455
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
456
|
+
const response = yield this.articleConnector.getSelectorDeliveryDate();
|
|
457
|
+
if (response && response.validationResult && response.validationResult.success) {
|
|
458
|
+
return this._boFactory.makeWithRawBackendData(DeliveryPrognosis, response.resultObject);
|
|
459
|
+
}
|
|
460
|
+
else {
|
|
461
|
+
return null;
|
|
462
|
+
}
|
|
463
|
+
});
|
|
464
|
+
}
|
|
465
|
+
getArtStockStatus(goodId) {
|
|
466
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
467
|
+
const response = yield this.articleConnector.getArtStockStatus(goodId);
|
|
468
|
+
if (response && response.validationResult && response.validationResult.success) {
|
|
469
|
+
return response.resultObject;
|
|
470
|
+
}
|
|
471
|
+
else {
|
|
472
|
+
return null;
|
|
473
|
+
}
|
|
474
|
+
});
|
|
495
475
|
}
|
|
496
|
-
|
|
497
|
-
this
|
|
476
|
+
getDeliveryDate2(goodId) {
|
|
477
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
478
|
+
const response = yield this.articleConnector.getDeliveryDate2(goodId);
|
|
479
|
+
if (response && response.validationResult && response.validationResult.success) {
|
|
480
|
+
return this._boFactory.makeWithRawBackendData(DeliveryPrognosis, response.resultObject);
|
|
481
|
+
}
|
|
482
|
+
else {
|
|
483
|
+
return null;
|
|
484
|
+
}
|
|
485
|
+
});
|
|
498
486
|
}
|
|
499
|
-
|
|
500
|
-
return this
|
|
487
|
+
getJsonConfiguredArticles(configuratorStatistics) {
|
|
488
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
489
|
+
const response = yield this.articleConnector.getJsonConfiguredArticles(configuratorStatistics);
|
|
490
|
+
if (response && response.validationResult && response.validationResult.success) {
|
|
491
|
+
return response.resultObject;
|
|
492
|
+
}
|
|
493
|
+
else {
|
|
494
|
+
return '';
|
|
495
|
+
}
|
|
496
|
+
});
|
|
501
497
|
}
|
|
502
|
-
|
|
498
|
+
getJsonArticleFlatTree(goodId, goodType, quantity, externalSource = false, showLoader = true, instanceId, configuratorStatistics) {
|
|
503
499
|
return __awaiter(this, void 0, void 0, function* () {
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
509
|
-
|
|
510
|
-
|
|
511
|
-
|
|
512
|
-
|
|
513
|
-
|
|
500
|
+
return this.articleConnector.getJsonArticleFlatTree(goodId, goodType, quantity, externalSource, showLoader, instanceId, configuratorStatistics).catch((messages) => {
|
|
501
|
+
this._eventService.errorMessage.next(messages);
|
|
502
|
+
return null;
|
|
503
|
+
});
|
|
504
|
+
});
|
|
505
|
+
}
|
|
506
|
+
getGoodIdFromArticleNr(sku) {
|
|
507
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
508
|
+
const response = yield this.articleConnector.getGoodIdFromArticleNr(sku);
|
|
509
|
+
if (response && response.validationResult && response.validationResult.success) {
|
|
510
|
+
return response.resultObject;
|
|
514
511
|
}
|
|
515
512
|
else {
|
|
516
|
-
|
|
517
|
-
this.settings.options = Object.assign(new SettingsOptions(), this.settings.options);
|
|
518
|
-
if (finish) {
|
|
519
|
-
this.settingsFinished();
|
|
520
|
-
}
|
|
513
|
+
return null;
|
|
521
514
|
}
|
|
522
515
|
});
|
|
523
516
|
}
|
|
524
|
-
|
|
517
|
+
getArticleFullObject(goodId, showLoader = true) {
|
|
525
518
|
return __awaiter(this, void 0, void 0, function* () {
|
|
526
|
-
|
|
527
|
-
|
|
519
|
+
const response = yield this.articleConnector.getArticleFullObject(goodId, showLoader);
|
|
520
|
+
if (response && response.validationResult && response.validationResult.success) {
|
|
521
|
+
return this._boFactory.makeWithRawBackendData(ArticleFullObject, response.resultObject);
|
|
528
522
|
}
|
|
529
|
-
|
|
530
|
-
|
|
531
|
-
this.settings = Object.assign({}, this.settings, obj);
|
|
532
|
-
if (obj.renderParameters) {
|
|
533
|
-
this.settings.renderParameters = Object.assign({}, ownRenderParameters, obj.renderParameters);
|
|
523
|
+
else {
|
|
524
|
+
return null;
|
|
534
525
|
}
|
|
535
|
-
|
|
536
|
-
|
|
526
|
+
});
|
|
527
|
+
}
|
|
528
|
+
getSuperArticle(id, branch) {
|
|
529
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
530
|
+
const response = yield this.articleConnector.getSuperArticleQuickSel(id, branch);
|
|
531
|
+
if (response && response.validationResult && response.validationResult.success) {
|
|
532
|
+
return this._boFactory.makeWithRawBackendData(SuperArticle, response.resultObject);
|
|
537
533
|
}
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
if (this.settings.assetPath[this.settings.assetPath.length - 1] !== '/') {
|
|
541
|
-
this.settings.assetPath += '/';
|
|
542
|
-
}
|
|
543
|
-
this.settings.threeDAssetPath = this.settings.assetPath;
|
|
534
|
+
else {
|
|
535
|
+
return null;
|
|
544
536
|
}
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
537
|
+
});
|
|
538
|
+
}
|
|
539
|
+
getDocumentContent(docId, thumbnail = true) {
|
|
540
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
541
|
+
const response = yield this.articleConnector.getDocumentContent(docId, thumbnail);
|
|
542
|
+
if (response && response.validationResult && response.validationResult.success) {
|
|
543
|
+
return this._boFactory.makeWithRawBackendData(DocumentContent, response.resultObject);
|
|
544
|
+
}
|
|
545
|
+
else {
|
|
546
|
+
return null;
|
|
550
547
|
}
|
|
551
|
-
this.settingsFinished();
|
|
552
548
|
});
|
|
553
549
|
}
|
|
554
|
-
|
|
550
|
+
addWebSessionTransactionLine(transactionUuid, sku, quantity) {
|
|
555
551
|
return __awaiter(this, void 0, void 0, function* () {
|
|
556
|
-
yield this.
|
|
557
|
-
|
|
552
|
+
const response = yield this.transactionConnector.addWebSessionTransactionLine(transactionUuid, sku, quantity);
|
|
553
|
+
if (response && response.validationResult && response.validationResult.success) {
|
|
554
|
+
const infoResponse = this._boFactory.makeWithRawBackendData(TransactionInfoResponse, response.resultObject);
|
|
555
|
+
return infoResponse.transactionInfo.uuid;
|
|
556
|
+
}
|
|
557
|
+
return "";
|
|
558
558
|
});
|
|
559
559
|
}
|
|
560
560
|
}
|
|
561
|
-
|
|
561
|
+
ProductConnectorAdapterService.decorators = [
|
|
562
562
|
{ type: Injectable }
|
|
563
563
|
];
|
|
564
|
-
|
|
565
|
-
{ type:
|
|
566
|
-
{ type: DictionaryService }
|
|
564
|
+
ProductConnectorAdapterService.ctorParameters = () => [
|
|
565
|
+
{ type: ProductEventService }
|
|
567
566
|
];
|
|
568
567
|
|
|
569
568
|
// Holds all iONE backend related state and methods for a running HomeDecorator. To be used anywhere internally.
|
|
@@ -667,7 +666,7 @@ ProductConnectorService.ctorParameters = () => [
|
|
|
667
666
|
];
|
|
668
667
|
|
|
669
668
|
class IoneProductComponent {
|
|
670
|
-
constructor(
|
|
669
|
+
constructor(_appEventService, _settingsService) {
|
|
671
670
|
// this.sku = 'CF-HILL';
|
|
672
671
|
// this.sku = 'CF-ALMADA';
|
|
673
672
|
// this.sku = 'CF-39904ANT';
|
|
@@ -680,15 +679,15 @@ class IoneProductComponent {
|
|
|
680
679
|
// this.sku = '104';
|
|
681
680
|
// this.sku = "70000107";
|
|
682
681
|
// this.sku = "grover";
|
|
683
|
-
this.
|
|
684
|
-
this.
|
|
685
|
-
this._ione = _ione;
|
|
686
|
-
this._changeDetector = _changeDetector;
|
|
682
|
+
// this.sku = "1000610952";
|
|
683
|
+
// this.sku = "4387";
|
|
687
684
|
this._appEventService = _appEventService;
|
|
688
685
|
this._settingsService = _settingsService;
|
|
686
|
+
this.enableRenderCarousel = true;
|
|
689
687
|
this.handleAddArticleInternally = true;
|
|
690
688
|
this.onAddToCart = new EventEmitter();
|
|
691
689
|
this.forceRenderImage = new EventEmitter();
|
|
690
|
+
this.getRenderForRenderCarousel = new EventEmitter();
|
|
692
691
|
this.onAlternativeClick = new EventEmitter();
|
|
693
692
|
this.onArticleInfoReceived = new EventEmitter();
|
|
694
693
|
this.onArticleReceived = new EventEmitter();
|
|
@@ -699,9 +698,7 @@ class IoneProductComponent {
|
|
|
699
698
|
this.settingsLoaded = false;
|
|
700
699
|
this.showHD = false;
|
|
701
700
|
this._subs = [];
|
|
702
|
-
this._subs.push(
|
|
703
|
-
// this._dictionary.dictionaryLoaded.subscribe(d => this.upAndLoaded = true),
|
|
704
|
-
this._appEventService.onAddToCart.subscribe((data) => {
|
|
701
|
+
this._subs.push(this._appEventService.onAddToCart.subscribe((data) => {
|
|
705
702
|
this._handleAddToCart(data);
|
|
706
703
|
}), this._appEventService.onAddToQuote.subscribe(json => this.onAddToQuote.emit(json)), this._appEventService.onAlternativeClick.subscribe(article => this.onAlternativeClick.emit(article)), this._appEventService.onArticleInfoReceived.subscribe(info => this._handleAnswerInfoReceived(info)), this._appEventService.onArticleReceived.subscribe(article => this.onArticleReceived.emit(article)), this._appEventService.onSelectionsReceived.subscribe(selections => this.onSelectionsReceived.emit(selections)), this._appEventService.onAnswersAvailable.subscribe(answers => this._handleAnswersAvailable(answers)), this._settingsService.settingsLoaded.subscribe(loaded => {
|
|
707
704
|
this.settingsLoaded = loaded;
|
|
@@ -728,9 +725,6 @@ class IoneProductComponent {
|
|
|
728
725
|
}
|
|
729
726
|
});
|
|
730
727
|
}
|
|
731
|
-
ngOnChanges(changes) {
|
|
732
|
-
this._changeDetector.detectChanges();
|
|
733
|
-
}
|
|
734
728
|
ngOnDestroy() {
|
|
735
729
|
this._subs.forEach(s => s.unsubscribe());
|
|
736
730
|
}
|
|
@@ -753,25 +747,28 @@ IoneProductComponent.decorators = [
|
|
|
753
747
|
{ type: Component, args: [{
|
|
754
748
|
selector: 'app-ione-product',
|
|
755
749
|
template: `
|
|
756
|
-
|
|
757
|
-
|
|
758
|
-
|
|
759
|
-
|
|
760
|
-
|
|
761
|
-
|
|
762
|
-
|
|
750
|
+
<app-product-page *ngIf="settingsLoaded"
|
|
751
|
+
[createFrozenArticle]="handleAddArticleInternally"
|
|
752
|
+
[isReturn]="isReturn"
|
|
753
|
+
[sku]="sku"
|
|
754
|
+
[showRelatedProductsPopup]="showRelatedProductsPopup"
|
|
755
|
+
[enableRenderCarousel]="enableRenderCarousel"
|
|
756
|
+
(openStockEvent)="openStock()"
|
|
757
|
+
></app-product-page>
|
|
763
758
|
<!-- <co-button [label]="'click'" (click)="showHD = !showHD"></co-button>
|
|
764
759
|
<co-product-hd [sku]="'657946ca-e1e1-41fd-7ae0-08dbf7df0cef'" *ngIf="showHD"></co-product-hd>-->
|
|
765
760
|
`,
|
|
761
|
+
providers: [
|
|
762
|
+
ProductSettingsService,
|
|
763
|
+
ProductConnectorService,
|
|
764
|
+
ProductEventService,
|
|
765
|
+
ProductConnectorAdapterService
|
|
766
|
+
],
|
|
766
767
|
encapsulation: ViewEncapsulation.Emulated,
|
|
767
768
|
styles: [""]
|
|
768
769
|
},] }
|
|
769
770
|
];
|
|
770
771
|
IoneProductComponent.ctorParameters = () => [
|
|
771
|
-
{ type: DictionaryService },
|
|
772
|
-
{ type: JsonUtilsService },
|
|
773
|
-
{ type: ProductConnectorService },
|
|
774
|
-
{ type: ChangeDetectorRef },
|
|
775
772
|
{ type: ProductEventService },
|
|
776
773
|
{ type: ProductSettingsService }
|
|
777
774
|
];
|
|
@@ -779,10 +776,12 @@ IoneProductComponent.propDecorators = {
|
|
|
779
776
|
sku: [{ type: Input }],
|
|
780
777
|
isReturn: [{ type: Input }],
|
|
781
778
|
showRelatedProductsPopup: [{ type: Input }],
|
|
779
|
+
enableRenderCarousel: [{ type: Input }],
|
|
782
780
|
settings: [{ type: Input }],
|
|
783
781
|
handleAddArticleInternally: [{ type: Input }],
|
|
784
782
|
onAddToCart: [{ type: Output }],
|
|
785
783
|
forceRenderImage: [{ type: Output }],
|
|
784
|
+
getRenderForRenderCarousel: [{ type: Output }],
|
|
786
785
|
onAlternativeClick: [{ type: Output }],
|
|
787
786
|
onArticleInfoReceived: [{ type: Output }],
|
|
788
787
|
onArticleReceived: [{ type: Output }],
|
|
@@ -811,6 +810,8 @@ var SelectorType;
|
|
|
811
810
|
var IconEnum;
|
|
812
811
|
(function (IconEnum) {
|
|
813
812
|
IconEnum["AddToCartDrop"] = "add_to_cart_drop";
|
|
813
|
+
IconEnum["ArrowPointLeft"] = "arrow_point_left";
|
|
814
|
+
IconEnum["ArrowPointRight"] = "arrow_point_right";
|
|
814
815
|
IconEnum["CrossSkinny"] = "cross_skinny";
|
|
815
816
|
IconEnum["DeliveryTruck"] = "delivery_truck";
|
|
816
817
|
IconEnum["Download"] = "download";
|
|
@@ -832,6 +833,8 @@ var IconEnum;
|
|
|
832
833
|
/** AUTO GENERATED FILE. DO NOT CHANGE.. **/
|
|
833
834
|
const IconSvg = {
|
|
834
835
|
"add_to_cart_drop": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\"><path d=\"M16.58,34.84a1.8,1.8,0,1,0,1.8,1.8A1.79,1.79,0,0,0,16.58,34.84Z\" fill=\"#484f60\"/><path d=\"M31.49,34.84a1.8,1.8,0,1,0,1.8,1.8A1.79,1.79,0,0,0,31.49,34.84Z\" fill=\"#484f60\"/><path d=\"M35.6,17.9l-1.51.18L31.88,20.3l1.31-.17a.88.88,0,0,1,1,1.08L32.35,29.5a1.52,1.52,0,0,1-1.44,1.2H16.51a1.75,1.75,0,0,1-1.57-1.17l-2.31-5.6a1,1,0,0,1,.85-1.29l4.43-.56-1.86-1.86-5.13.61a1,1,0,0,0-.87,1.28l3.34,9.44A1.73,1.73,0,0,0,15,32.72H32.64a1.51,1.51,0,0,0,1.43-1.2L36.6,19A.89.89,0,0,0,35.6,17.9Z\" fill=\"#484f60\"/><path d=\"M39,17a1.87,1.87,0,0,0-1.36,1.46l-.42,2.89c-.1.67.31,1,.9.7a2.75,2.75,0,0,0,1.33-1.7L40,18A.73.73,0,0,0,39,17Z\" fill=\"#484f60\"/><polygon points=\"24 25.35 32.04 17.3 27.04 17.3 27.04 10 20.95 10 20.95 17.3 15.96 17.3 24 25.35\" fill=\"#484f60\"/></svg>",
|
|
836
|
+
"arrow_point_left": "<svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" x=\"0px\" y=\"0px\" viewBox=\"0 0 51 51\" enable-background=\"new 0 0 51 51\" ><path fill=\"#484F5F\" d=\"M31.9,36.7l-14.7-9.6C17.1,27,17,26.9,17,26.7v-2.4c0-0.2,0.1-0.3,0.2-0.4l14.7-9.6c0.2-0.2,0.5-0.1,0.7,0.1l1.4,2.1c0.2,0.2,0.1,0.5-0.1,0.7l-12,7.8c-0.3,0.2-0.3,0.6,0,0.8l12,7.8c0.2,0.2,0.3,0.5,0.1,0.7l-1.4,2.1C32.4,36.8,32.1,36.8,31.9,36.7z\"/></svg>",
|
|
837
|
+
"arrow_point_right": "<svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" x=\"0px\" y=\"0px\" viewBox=\"0 0 51 51\" enable-background=\"new 0 0 51 51\" ><path fill=\"#484F5F\" d=\"M19.1,14.3l14.7,9.6c0.1,0.1,0.2,0.2,0.2,0.4v2.4c0,0.2-0.1,0.3-0.2,0.4l-14.7,9.6c-0.2,0.2-0.5,0.1-0.7-0.1l-1.4-2.1c-0.2-0.2-0.1-0.5,0.1-0.7l12-7.8c0.3-0.2,0.3-0.6,0-0.8l-12-7.8c-0.2-0.2-0.3-0.5-0.1-0.7l1.4-2.1C18.6,14.2,18.9,14.2,19.1,14.3z\"/></svg>",
|
|
835
838
|
"cross_skinny": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 30 30\"><g ><polygon points=\"25.35 5.52 24.65 4.81 15 14.46 5.35 4.81 4.65 5.52 14.29 15.17 4.65 24.81 5.35 25.52 15 15.87 24.65 25.52 25.35 24.81 15.71 15.17 25.35 5.52\" fill=\"#484f60\"/></g></svg>",
|
|
836
839
|
"delivery_truck": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\"><path d=\"M25,45A20,20,0,1,1,45,25,20,20,0,0,1,25,45ZM25,6.29A18.71,18.71,0,1,0,43.71,25,18.73,18.73,0,0,0,25,6.29Z\" fill=\"#484f60\"/><path d=\"M21.86,24.09a7.14,7.14,0,0,1,.72-3.24,6.94,6.94,0,0,1,1.18-1.66H13v10.1h8.51a3.25,3.25,0,0,1,3.27-3.07A3.33,3.33,0,0,1,27,27V25.75H21.9Z\" fill=\"#484f60\" opacity=\"0.5\"/><path d=\"M21.65,30.47h-.48a3.51,3.51,0,0,1,1.13,2.19h1.57a3.22,3.22,0,0,1-1.41-.83A3.13,3.13,0,0,1,21.65,30.47Z\" fill=\"#484f60\" opacity=\"0.5\"/><path d=\"M34.63,21.89H28.87c-.3.25-.5.43-.63.56v8H28a3.19,3.19,0,0,1-.82,1.37,3.3,3.3,0,0,1-1.41.82H29a3.53,3.53,0,0,1,7,0h1V27.1Zm-.2,5.38H30.8a.47.47,0,0,1-.46-.46V23.36a.46.46,0,0,1,.46-.46h2.1a.45.45,0,0,1,.42.27l1.53,3.45A.46.46,0,0,1,34.43,27.27Z\" fill=\"#484f60\" opacity=\"0.5\"/><path d=\"M16.42,30.47a3.51,3.51,0,0,0-1.13,2.19H14.6l-1.6-1V30.47Z\" fill=\"#484f60\" opacity=\"0.5\"/><path d=\"M30,33.08a2.53,2.53,0,1,0,2.53-2.53A2.52,2.52,0,0,0,30,33.08Z\" fill=\"#484f60\" opacity=\"0.5\"/><path d=\"M16.27,33.08a2.53,2.53,0,1,0,2.53-2.53A2.52,2.52,0,0,0,16.27,33.08Z\" fill=\"#484f60\" opacity=\"0.5\"/><path d=\"M22.45,17.27h-3.2a4.29,4.29,0,0,1,1.61-3.49,6.45,6.45,0,0,1,4.31-1.38,6.79,6.79,0,0,1,2.92.57A4.72,4.72,0,0,1,30,14.62a4,4,0,0,1,.72,2.26,3.74,3.74,0,0,1-.23,1.27,5.31,5.31,0,0,1-.73,1.29,12,12,0,0,1-1.4,1.29A8.74,8.74,0,0,0,27.06,22a3.17,3.17,0,0,0-.46.94,7.56,7.56,0,0,0-.23,1.65h-3.3v-.49a6,6,0,0,1,.59-2.68,6.8,6.8,0,0,1,1.94-2.25,9.44,9.44,0,0,0,1.56-1.41,1.5,1.5,0,0,0,.27-.9,1.47,1.47,0,0,0-.65-1.19A2.9,2.9,0,0,0,25,15.14a2.77,2.77,0,0,0-1.84.6A1.91,1.91,0,0,0,22.45,17.27Z\" fill=\"#484f60\"/><path d=\"M24.78,27.42a2.06,2.06,0,0,1,1.51.61,2,2,0,0,1,.63,1.47A2,2,0,0,1,26.3,31a2.08,2.08,0,0,1-1.5.62A2,2,0,0,1,23.31,31a2.08,2.08,0,0,1,0-2.95A2,2,0,0,1,24.78,27.42Z\" fill=\"#484f60\"/></svg>",
|
|
837
840
|
"download": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\" version=\"1.1\" sodipodi:docname=\"download.svg\" inkscape:version=\"0.92.4 (5da689c313, 2019-01-14)\"><metadata ><rdf:RDF><cc:Work rdf:about=\"\"><dc:format>image/svg+xml</dc:format><dc:type rdf:resource=\"http://purl.org/dc/dcmitype/StillImage\" /><dc:title></dc:title></cc:Work></rdf:RDF></metadata><defs /><sodipodi:namedview pagecolor=\"#ffffff\" bordercolor=\"#666666\" borderopacity=\"1\" objecttolerance=\"10\" gridtolerance=\"10\" guidetolerance=\"10\" inkscape:pageopacity=\"0\" inkscape:pageshadow=\"2\" inkscape:window-width=\"1920\" inkscape:window-height=\"1017\" showgr inkscape:zoom=\"6.675088\" inkscape:cx=\"-14.056273\" inkscape:cy=\"29.806579\" inkscape:window-x=\"-8\" inkscape:window-y=\"-8\" inkscape:window-maximized=\"1\" inkscape:current-layer=\"svg8\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05570714,0,0,0.05570648,10.763,10.859394)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\"><g style=\"fill:#484f60;fill-opacity:1\"><path inkscape:connector-curvature=\"0\" d=\"m 498.966,339.946 c -7.197,0 -13.034,5.837 -13.034,13.034 v 49.804 c 0,28.747 -23.388,52.135 -52.135,52.135 H 78.203 c -28.747,0 -52.135,-23.388 -52.135,-52.135 V 352.98 c 0,-7.197 -5.835,-13.034 -13.034,-13.034 C 5.835,339.946 0,345.782 0,352.98 v 49.804 c 0,43.121 35.082,78.203 78.203,78.203 h 355.594 c 43.121,0 78.203,-35.082 78.203,-78.203 V 352.98 c 0,-7.198 -5.835,-13.034 -13.034,-13.034 z\" style=\"fill:#484f60;fill-opacity:1\" /></g></g><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\"><g style=\"fill:#484f60;fill-opacity:1\"><path inkscape:connector-curvature=\"0\" d=\"M 419.833,391.3 H 92.167 c -7.197,0 -13.034,5.837 -13.034,13.034 0,7.197 5.835,13.034 13.034,13.034 h 327.665 c 7.199,0 13.034,-5.835 13.034,-13.034 0,-7.197 -5.835,-13.034 -13.033,-13.034 z\" style=\"fill:#484f60;fill-opacity:1\" /></g></g><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\"><g style=\"fill:#484f60;fill-opacity:1\"><path inkscape:connector-curvature=\"0\" d=\"m 387.919,207.93 c -4.795,-5.367 -13.034,-5.834 -18.404,-1.038 L 269.033,296.657 V 44.048 c 0,-7.197 -5.835,-13.034 -13.034,-13.034 -7.197,0 -13.034,5.835 -13.034,13.034 V 296.657 L 142.483,206.893 c -5.367,-4.796 -13.607,-4.328 -18.404,1.038 -4.794,5.369 -4.331,13.609 1.037,18.404 l 109.174,97.527 c 6.187,5.529 13.946,8.292 21.708,8.292 7.759,0 15.519,-2.763 21.708,-8.289 l 109.174,-97.53 c 5.37,-4.798 5.834,-13.038 1.039,-18.405 z\" style=\"fill:#484f60;fill-opacity:1\" /></g></g><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /><g transform=\"matrix(0.05555739,0,0,0.05555739,10.739964,11.357401)\" style=\"fill:#484f60;fill-opacity:1\" /></svg>",
|
|
@@ -921,6 +924,10 @@ class ProductPageComponent {
|
|
|
921
924
|
else {
|
|
922
925
|
this.showAddToCart = true;
|
|
923
926
|
}
|
|
927
|
+
}), this.appEventService.onGetRenderForRenderCarousel.subscribe((renderParameters) => {
|
|
928
|
+
if (this.selections.nativeElement) {
|
|
929
|
+
this.selections.nativeElement.getRenderForRenderCarousel(renderParameters);
|
|
930
|
+
}
|
|
924
931
|
}));
|
|
925
932
|
}
|
|
926
933
|
set sku(value) {
|
|
@@ -1054,7 +1061,7 @@ class ProductPageComponent {
|
|
|
1054
1061
|
ProductPageComponent.decorators = [
|
|
1055
1062
|
{ type: Component, args: [{
|
|
1056
1063
|
selector: 'app-product-page',
|
|
1057
|
-
template: "<ng-container *ngIf=\"settingsLoaded\">\r\n <div class=\"page-wrapper\">\r\n <div class=\"page-wrapper-content\">\r\n <div class=\"page-wrapper-left\">\r\n <div class=\"product-image-container\">\r\n <div class=\"product-page-block-selector-type\">\r\n <app-product-selector-type class=\"default-padding\"\r\n
|
|
1064
|
+
template: "<ng-container *ngIf=\"settingsLoaded\">\r\n <div class=\"page-wrapper\">\r\n <div class=\"page-wrapper-content\">\r\n <div class=\"page-wrapper-left\">\r\n <div class=\"product-image-container\">\r\n <div class=\"product-page-block-selector-type\">\r\n <app-product-selector-type class=\"default-padding\"\r\n [(currentType)]=\"currentView\"\r\n [show2D]=\"configurable\"\r\n [show3D]=\"threeD\"\r\n ></app-product-selector-type>\r\n </div>\r\n <div class=\"product-page-block-image default-padding\" [class.full]=\"fullScreen\">\r\n\r\n <app-image-carousel\r\n *ngIf=\"!enableRenderCarousel\"\r\n [@toggleVisibilityByState]=\"show2D ? 'show' : 'hide'\"\r\n [images]=\"article?.images\"\r\n [showRefresh]=\"configurable && threeD\">\r\n </app-image-carousel>\r\n\r\n <app-render-carousel\r\n *ngIf=\"enableRenderCarousel\"\r\n [@toggleVisibilityByState]=\"show2D ? 'show' : 'hide'\"\r\n [article]=\"article\">\r\n </app-render-carousel>\r\n\r\n <ng-container *ngIf=\"settingsLoaded\">\r\n <threed-configurator\r\n #configurator\r\n class=\"threed-configurator\"\r\n [class.configurator-full-screen]=\"fullScreen\"\r\n [@toggleVisibilityByState]=\"show3D ? 'show' : 'hide'\"\r\n [@toggleFullScreen]=\"fullScreen ? 'fullscreen' : 'halfscreen'\">\r\n </threed-configurator>\r\n </ng-container>\r\n\r\n <co-icon #fullscreenbutton class=\"fullscreen-button\" *ngIf=\"show3D\"\r\n [@toggleTopLeft]=\"fullScreen ? 'fullscreen' : 'halfscreen'\"\r\n [iconData]=\"iconCache.getIcon(fullScreenIcon)\"\r\n (click)=\"showFullScreen()\"></co-icon>\r\n <co-icon class=\"threed-watermark\" *ngIf=\"show3D && fullScreen\"\r\n [iconData]=\"iconCache.getIcon(icon.Logo)\"></co-icon>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"page-wrapper-right\">\r\n <div class=\"product-page-block-description\">\r\n <app-product-description class=\"default-padding\" [article]=\"article\"></app-product-description>\r\n </div>\r\n <div class=\"product-page-block-additional\">\r\n <div class=\"product-page-block-additional-description\">\r\n <app-product-additional-description class=\"default-padding\" [article]=\"article\"></app-product-additional-description>\r\n </div>\r\n <div class=\"product-page-block-price\" [class.full]=\"configuring\">\r\n <app-product-price class=\"s-padding\" *ngIf=\"!configuring\"\r\n [pricing]=\"article?.pricing\"\r\n [configurable]=\"configurable\"\r\n ></app-product-price>\r\n <ng-container *ngIf=\"settingsLoaded\">\r\n <threed-selections #selections class=\"threed-selections\"\r\n [class.show-selections]=\"configuring\"\r\n [@toggleFullScreenRight]=\"fullScreen ? 'fullscreen' : 'halfscreen'\"\r\n [class.default-padding]=\"!fullScreen\"\r\n [class.show-full-screen]=\"fullScreen\"\r\n [class.mini-scrollbar]=\"fullScreen\"\r\n [sku]=\"sku\"\r\n [settings]=\"settings\"\r\n (onUserActionFromThreeD)=\"configuring = true\"\r\n (instanceSet)=\"setInstance($event)\"\r\n (onImageReceived)=\"appEventService.onImageReceived.next($event)\"\r\n (onRenderStarted)=\"appEventService.onRenderStarted.next()\"\r\n (onDraftRenderImageReceived)=\"appEventService.onDraftRenderImageReceived.next($event)\"\r\n (onArticleReceived)=\"appEventService.onArticleReceived.next($event.detail)\"\r\n (onSelectionsReceived)=\"appEventService.onSelectionsReceived.next($event.detail)\"\r\n (onArticleInfoReceived)=\"appEventService.onArticleInfoReceived.next($event.detail)\"\r\n (onAnswersAvailable)=\"appEventService.onAnswersAvailable.next($event.detail)\"\r\n (onReadyToRender)=\"appEventService.onReadyToRender.next($event.detail)\"\r\n (onRenderImageReceived)=\"appEventService.onRenderImageReceived.next($event.detail)\"\r\n ></threed-selections>\r\n </ng-container>\r\n </div>\r\n <div class=\"product-page-block-addtocart no-padding product-action-buttons\" *ngIf=\"!configuring\" [@toggleTopRight]=\"fullScreen ? 'fullscreen' : 'halfscreen'\">\r\n <app-product-addtocart\r\n [configurable]=\"configurable\"\r\n [createFrozenArticle]=\"createFrozenArticle\"\r\n [configuring]=\"configuring\"\r\n [showAddToCart]=\"showAddToCart\"\r\n [article]=\"article\"\r\n [externalSource]=\"externalSource\"\r\n [isReturn]=\"isReturn\"\r\n (startConfiguration)=\"handleStartConfiguration()\"\r\n (showRelatedPopup)=\"handlePopUpChange($event)\"\r\n ></app-product-addtocart>\r\n </div>\r\n <div class=\"addtocart-reserved product-action-buttons\" *ngIf=\"configuring\" [class.full-screen]=\"fullScreen\">\r\n <app-product-addtocart class=\"default-padding\"\r\n [configurable]=\"false\"\r\n [fullscreen]=\"fullScreen\"\r\n [showAddToCart]=\"showAddToCart\"\r\n [configuring]=\"configuring\"\r\n [article]=\"article\"\r\n [externalSource]=\"externalSource\"\r\n [isReturn]=\"isReturn\"\r\n (startConfiguration)=\"handleStartConfiguration()\"\r\n ></app-product-addtocart>\r\n </div>\r\n <div class=\"product-page-block-variants\">\r\n <app-product-related class=\"no-padding\" *ngIf=\"article?.relatedArticles && article?.relatedArticles.length > 0\"\r\n [externalSource]=\"externalSource\"\r\n [articles]=\"article?.relatedArticles\" [refType]=\"64\" [label]=\"'VARIANTS' | localize\"></app-product-related>\r\n </div>\r\n <div class=\"product-page-block-stock\">\r\n <app-product-stock class=\"no-padding\" [goodId]=\"article?.goodId\" (openStockEvent)=\"openStock()\"></app-product-stock>\r\n </div>\r\n <div class=\"product-page-block-delivery\">\r\n <app-product-delivery class=\"no-padding\" [stockAndDelivery]=\"stockAndDelivery\"></app-product-delivery>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"page-wrapper-content\">\r\n <div class=\"page-wrapper-left\">\r\n <app-product-info-tabs class=\"no-padding\" [article]=\"article\"></app-product-info-tabs>\r\n </div>\r\n <div class=\"page-wrapper-right\">\r\n <div class=\"product-page-block-related s-padding\">\r\n <app-product-related\r\n *ngIf=\"article?.relatedArticles && article?.relatedArticles.length > 0\"\r\n [externalSource]=\"externalSource\"\r\n [articles]=\"article?.relatedArticles\"\r\n [refType]=\"1\"\r\n [label]=\"'RELATED_PRODUCTS' | localize\">\r\n </app-product-related>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"page-wrapper-content no-top-margin\">\r\n <div class=\"page-wrapper-full\">\r\n <div class=\"product-page-block-alternatives s-padding\">\r\n <app-product-related\r\n *ngIf=\"article?.relatedArticles && article?.relatedArticles.length > 0\"\r\n [externalSource]=\"externalSource\"\r\n [articles]=\"article?.relatedArticles\"\r\n [refType]=\"4\"\r\n [isSmallModus]=\"false\"\r\n [label]=\"'ALTERNATIVE_PRODUCTS' | localize\">\r\n </app-product-related>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n\r\n <div *ngIf=\"showRelatedProductsPopup\">\r\n <co-product-dialog\r\n [mainArticle]=\"article\"\r\n [articles]=\"article?.relatedArticles\"\r\n [refType]=\"1\"\r\n (closeRelatedPopup)=\"handlePopUpChange($event)\"\r\n >\r\n </co-product-dialog>\r\n\r\n <!-- <app-product-related class=\"no-padding\" *ngIf=\"article?.relatedArticles && article?.relatedArticles.length > 0\"-->\r\n <!-- [articles]=\"article?.relatedArticles\" [refType]=\"64\" [label]=\"'VARIANTS' | localize\"></app-product-related>-->\r\n </div>\r\n\r\n\r\n </div>\r\n</ng-container>\r\n",
|
|
1058
1065
|
animations: [
|
|
1059
1066
|
trigger('toggleFullScreen', [
|
|
1060
1067
|
state('fullscreen', style({ 'position': 'fixed', 'top': '0', 'left': '0', 'width': '100%', 'height': '100%' })),
|
|
@@ -1087,7 +1094,7 @@ ProductPageComponent.decorators = [
|
|
|
1087
1094
|
transition('void => *', animate('200ms ease-in-out')),
|
|
1088
1095
|
])
|
|
1089
1096
|
],
|
|
1090
|
-
styles: [".page-wrapper{font-family:iOneMontserrat;font-size:12px;display:flex;flex-direction:column;max-width:1400px;padding:0 15px;margin:0 auto}.page-wrapper-content{display:flex;flex-direction:row;margin:40px 0}.page-wrapper-content:first-child{margin-top:0}.page-wrapper-content.no-top-margin{margin-top:0}.page-wrapper-left{display:flex;width:55%;flex-direction:column}.page-wrapper-right{display:flex;width:45%;flex-direction:column}.page-wrapper-full{display:flex;width:100%;flex-direction:column}.page-wrapper-66{display:flex;width:60%;flex-direction:column}.page-wrapper-33{display:flex;width:40%;flex-direction:column}.threed-selections{display:none}.threed-selections.show-selections{display:block}.threed-selections ::ng-deep .rp-lite-selector .rp-answers-slideout ::ng-deep co-slideout{width:480px;z-index:3}.threed-selections ::ng-deep .co-summary-line{cursor:pointer}.product-action-buttons{position:relative}.product-action-buttons.full-screen{z-index:10}.product-image-container{grid-column:1/7;grid-row:1/6;position:relative}.product-page-block-selector-type{width:auto;position:absolute;top:10px;right:10px;z-index:2}.product-page-block-image{box-sizing:border-box;width:100%;z-index:1;position:relative}.product-page-block-image .threed-configurator{border:1px solid #efefef}.product-page-block-image .threed-configurator .layer .viewer canvas{height:100%;width:100%}.product-page-block-image .threed-configurator ::ng-deep .rp-element-toolbar{top:30px}.product-page-block-image app-image-carousel.show-animated,.product-page-block-image threed-configurator.show-animated{opacity:1;z-index:0;transition:all .2s ease-in-out}.product-page-block-image .fullscreen-button{cursor:pointer;height:50px;width:50px;position:absolute;left:30px;z-index:100;top:30px}.product-page-block-image.full{grid-column:1/11;grid-row:2/span 10;z-index:3}.product-page-block-description{grid-column:7/12;grid-row:1/1}.product-page-block-additional{width:100%}.product-page-block-additional-description{width:100%}.product-page-block-price{grid-column:1/3;grid-row:2/2;align-self:center}.product-page-block-price.full{grid-column:1/5}.product-page-block-addtocart{grid-column:3/5;grid-row:2/2;align-self:center;padding-top:30px!important}.product-page-block-addtocart ::ng-deep co-number-picker ::ng-deep co-button{cursor:pointer}.product-page-block-addtocart ::ng-deep co-number-picker ::ng-deep co-button:hover div.rippler{background:#f6f5f4}.product-page-block-addtocart ::ng-deep co-number-picker ::ng-deep co-button ::ng-deep co-icon{position:relative;z-index:2}.product-page-block-addtocart ::ng-deep co-button.cart-button{cursor:pointer}.product-page-block-addtocart ::ng-deep co-button.cart-button:hover{background:#74B77F}.addtocart-reserved{grid-column:1/3;grid-row:3/3}.product-page-block-stock{grid-column:1/3;grid-row:4/4}.product-page-block-delivery{grid-column:3/5;grid-row:4/4}::ng-deep co-scroll-container{overflow:hidden;position:relative}::ng-deep co-scroll-container .content-wrapper{padding:0}::ng-deep co-scroll-container .scroll-layer{left:0;top:0}::ng-deep co-scroll-container .scroll-layer .scroller{width:34px;height:34px;border-radius:36px;background:#fff;cursor:pointer;box-shadow:0 0 5px #0003}::ng-deep co-scroll-container .scroll-layer .scroller:hover{background:#f6f5f4}::ng-deep co-scroll-container .scroll-layer .scroller.left-scroll{left:5px}::ng-deep co-scroll-container .scroll-layer .scroller.left-scroll:before{border-width:0 3px 3px 0;padding:4px;margin-left:13px;margin-top:11px}::ng-deep co-scroll-container .scroll-layer .scroller.right-scroll{right:5px}::ng-deep co-scroll-container .scroll-layer .scroller.right-scroll:after{border-width:0 3px 3px 0;padding:4px;margin-left:9px;margin-top:11px}.product-page-block-variants{margin:20px 0 0}.product-page-block-variants ::ng-deep app-product-related>div{display:flex;grid-gap:15px;gap:15px;align-items:center;border-top:1px solid #f6f5f4;padding:5px 0 7px 15px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep app-header h3{font-size:14px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container{width:320px;max-width:100%;padding:0 16px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container .scroller{width:26px;height:26px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container .scroller.left-scroll{left:5px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container .scroller.left-scroll:before{border-width:0 2px 2px 0;margin-left:9px;margin-top:9px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container .scroller.right-scroll{right:5px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container .scroller.right-scroll:after{border-width:0 2px 2px 0;margin-left:6px;margin-top:9px}.product-page-block-variants ::ng-deep co-tile.small{min-width:50px!important;max-width:50px!important;border:1px solid #f6f5f4;margin:0 10px 0 0;border-radius:4px}.product-page-block-variants ::ng-deep co-tile.small:hover{border-color:#22313c}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper{padding:0}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper .tile-top{display:none}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper .image{height:40px!important;padding:5px;margin-bottom:10px}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper .image .no-image-wrapper .no-image{width:40px;height:40px}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper .image .no-image-wrapper span{display:none!important}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper .tile-bottom{display:none}.product-page-block-variants ::ng-deep co-tile.small .tile-extra-bottom{display:none}.product-page-block-alternatives ::ng-deep .article-wrapper{margin:0 20px 0 0}.product-page-block-alternatives ::ng-deep .article-wrapper:last-child{margin:0}.product-page-block-alternatives ::ng-deep co-tile{cursor:pointer;transition:all .14s ease-out;border:1px solid transparent;border-bottom-color:#f6f5f4;padding:15px 10px 0;width:319px;max-width:none;min-width:0;box-sizing:border-box}.product-page-block-alternatives ::ng-deep co-tile:hover{box-shadow:none;border-color:#f6f5f4}.product-page-block-alternatives ::ng-deep co-tile:hover .tile-wrapper div.image co-image{transform:scale(1.05)}.product-page-block-alternatives ::ng-deep co-tile:hover .tile-wrapper .tile-bottom{margin:0}.product-page-block-alternatives ::ng-deep co-tile:hover .tile-extra-bottom .main .description{text-decoration:underline}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper{padding:0;position:relative;outline:none;overflow:hidden}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper .tile-top{position:absolute;left:0;top:0;width:100%}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper div.image{position:relative;padding:1px;display:flex;align-items:center;justify-content:center;overflow:hidden;max-width:250px;margin:0 auto 10px;height:auto}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper div.image:after{content:\"\";padding:100% 0 0;float:left;width:100%}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper div.image co-image{position:absolute;left:0;top:0;overflow:hidden;width:100%;height:100%;-o-object-fit:contain;object-fit:contain;z-index:-1;transition:all .2s ease}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper div.image .no-image-wrapper{position:absolute;display:flex;left:50%;top:50%;margin:-48px 0 0 -54px;flex-direction:column;align-items:center;opacity:.25}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper .tile-bottom{transition:all .2s ease;height:auto}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper .tile-bottom ::ng-deep co-button{margin:0 0 5px!important;width:36px;height:36px;border:1px solid #22313C;cursor:pointer;border-radius:4px;padding:0!important;font-size:0}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper .tile-bottom ::ng-deep co-button co-icon{width:32px;height:32px;margin:0 2px}.product-page-block-alternatives ::ng-deep co-tile .tile-extra-bottom{outline:none;padding:15px 0;background:transparent!important;min-height:60px}.product-page-block-alternatives ::ng-deep co-tile .tile-extra-bottom .main{padding:0 10px}.product-page-block-alternatives ::ng-deep co-tile .tile-extra-bottom .main .description{font-size:15px;font-weight:bold;margin:0 0 2px}.product-page-block-alternatives ::ng-deep co-tile .tile-extra-bottom .main .price{font-size:16px;margin:15px 0 0;font-weight:bold;color:#2b60a7}.product-page-block-additional-information{grid-column:1/6;grid-row:4/4}.product-page-block-properties{grid-column:7/10;grid-row:3/3}.product-page-block-related-articles{grid-column:2/6;grid-row:4/4}.product-page-block-alternative-articles{grid-column:6/10;grid-row:4/4}.product-page-block-documents{grid-column:2/6;grid-row:5/5}.product-page-block-symbols{grid-column:6/10;grid-row:5/5}@media screen and (max-width: 950px){.default-padding{padding-top:20px;padding-bottom:20px}.m-padding{padding-top:15px;padding-bottom:15px}.s-padding{padding-top:5px;padding-bottom:5px}.page-wrapper{max-width:650px}.page-wrapper .page-wrapper-content{flex-direction:column;margin:30px 0}.page-wrapper .page-wrapper-content .page-wrapper-left{width:100%}.page-wrapper .page-wrapper-content .page-wrapper-right{width:100%}.product-page-block-alternatives ::ng-deep co-tile{width:284px!important}}@media screen and (max-width: 650px){[class*=-padding]{padding-left:0!important;padding-right:0!important}.product-page-block-addtocart ::ng-deep co-number-picker co-button{height:38px!important}.product-page-block-addtocart ::ng-deep co-number-picker co-input-text{height:38px!important;width:36px!important}.product-page-block-addtocart ::ng-deep co-button.cart-button{height:40px;font-size:13px}}\n"]
|
|
1097
|
+
styles: [".page-wrapper{font-family:iOneMontserrat;font-size:12px;display:flex;flex-direction:column;max-width:100%;padding:0 15px;margin:0 auto}.page-wrapper-content{display:flex;flex-direction:row;margin:40px 0}.page-wrapper-content:first-child{margin-top:0}.page-wrapper-content.no-top-margin{margin-top:0}.page-wrapper-left{display:flex;width:65%;flex-direction:column}.page-wrapper-right{display:flex;width:35%;flex-direction:column}.page-wrapper-full{display:flex;width:100%;flex-direction:column}.page-wrapper-66{display:flex;width:60%;flex-direction:column}.page-wrapper-33{display:flex;width:40%;flex-direction:column}.threed-selections{display:none}.threed-selections.show-selections{display:block}.threed-selections ::ng-deep .rp-lite-selector .rp-answers-slideout ::ng-deep co-slideout{width:480px;z-index:3}.threed-selections ::ng-deep .co-summary-line{cursor:pointer}.product-action-buttons{position:relative}.product-action-buttons.full-screen{z-index:10}.product-image-container{grid-column:1/7;grid-row:1/6;position:relative}.product-page-block-selector-type{width:auto;position:absolute;top:10px;right:10px;z-index:2}.product-page-block-image{box-sizing:border-box;width:100%;z-index:1;position:relative}.product-page-block-image .threed-configurator{border:none}.product-page-block-image .threed-configurator .layer .viewer canvas{height:100%;width:100%}.product-page-block-image .threed-configurator ::ng-deep .rp-element-toolbar{top:30px}.product-page-block-image app-image-carousel.show-animated,.product-page-block-image threed-configurator.show-animated{opacity:1;z-index:0;transition:all .2s ease-in-out}.product-page-block-image .fullscreen-button{cursor:pointer;height:50px;width:50px;position:absolute;left:30px;z-index:100;top:30px}.product-page-block-image.full{grid-column:1/11;grid-row:2/span 10;z-index:3}.product-page-block-description{grid-column:7/12;grid-row:1/1}.product-page-block-additional{width:100%}.product-page-block-additional-description{width:100%}.product-page-block-price{grid-column:1/3;grid-row:2/2;align-self:center}.product-page-block-price.full{grid-column:1/5}.product-page-block-addtocart{grid-column:3/5;grid-row:2/2;align-self:center;padding-top:30px!important}.product-page-block-addtocart ::ng-deep co-number-picker ::ng-deep co-button{cursor:pointer}.product-page-block-addtocart ::ng-deep co-number-picker ::ng-deep co-button:hover div.rippler{background:#f6f5f4}.product-page-block-addtocart ::ng-deep co-number-picker ::ng-deep co-button ::ng-deep co-icon{position:relative;z-index:2}.product-page-block-addtocart ::ng-deep co-button.cart-button{cursor:pointer}.product-page-block-addtocart ::ng-deep co-button.cart-button:hover{background:#74B77F}.addtocart-reserved{grid-column:1/3;grid-row:3/3}.product-page-block-stock{grid-column:1/3;grid-row:4/4}.product-page-block-delivery{grid-column:3/5;grid-row:4/4}::ng-deep co-scroll-container{overflow:hidden;position:relative}::ng-deep co-scroll-container .content-wrapper{padding:0}::ng-deep co-scroll-container .scroll-layer{left:0;top:0}::ng-deep co-scroll-container .scroll-layer .scroller{width:34px;height:34px;border-radius:36px;background:#fff;cursor:pointer;box-shadow:0 0 5px #0003}::ng-deep co-scroll-container .scroll-layer .scroller:hover{background:#f6f5f4}::ng-deep co-scroll-container .scroll-layer .scroller.left-scroll{left:5px}::ng-deep co-scroll-container .scroll-layer .scroller.left-scroll:before{border-width:0 3px 3px 0;padding:4px;margin-left:13px;margin-top:11px}::ng-deep co-scroll-container .scroll-layer .scroller.right-scroll{right:5px}::ng-deep co-scroll-container .scroll-layer .scroller.right-scroll:after{border-width:0 3px 3px 0;padding:4px;margin-left:9px;margin-top:11px}.product-page-block-variants{margin:20px 0 0}.product-page-block-variants ::ng-deep app-product-related>div{display:flex;grid-gap:15px;gap:15px;align-items:center;border-top:1px solid #f6f5f4;padding:5px 0 7px 15px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep app-header h3{font-size:14px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container{width:320px;max-width:100%;padding:0 16px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container .scroller{width:26px;height:26px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container .scroller.left-scroll{left:5px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container .scroller.left-scroll:before{border-width:0 2px 2px 0;margin-left:9px;margin-top:9px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container .scroller.right-scroll{right:5px}.product-page-block-variants ::ng-deep app-product-related>div ::ng-deep co-scroll-container .scroller.right-scroll:after{border-width:0 2px 2px 0;margin-left:6px;margin-top:9px}.product-page-block-variants ::ng-deep co-tile.small{min-width:50px!important;max-width:50px!important;border:1px solid #f6f5f4;margin:0 10px 0 0;border-radius:4px}.product-page-block-variants ::ng-deep co-tile.small:hover{border-color:#22313c}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper{padding:0}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper .tile-top{display:none}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper .image{height:40px!important;padding:5px;margin-bottom:10px}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper .image .no-image-wrapper .no-image{width:40px;height:40px}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper .image .no-image-wrapper span{display:none!important}.product-page-block-variants ::ng-deep co-tile.small .tile-wrapper .tile-bottom{display:none}.product-page-block-variants ::ng-deep co-tile.small .tile-extra-bottom{display:none}.product-page-block-alternatives ::ng-deep .article-wrapper{margin:0 20px 0 0}.product-page-block-alternatives ::ng-deep .article-wrapper:last-child{margin:0}.product-page-block-alternatives ::ng-deep co-tile{cursor:pointer;transition:all .14s ease-out;border:1px solid transparent;border-bottom-color:#f6f5f4;padding:15px 10px 0;width:319px;max-width:none;min-width:0;box-sizing:border-box}.product-page-block-alternatives ::ng-deep co-tile:hover{box-shadow:none;border-color:#f6f5f4}.product-page-block-alternatives ::ng-deep co-tile:hover .tile-wrapper div.image co-image{transform:scale(1.05)}.product-page-block-alternatives ::ng-deep co-tile:hover .tile-wrapper .tile-bottom{margin:0}.product-page-block-alternatives ::ng-deep co-tile:hover .tile-extra-bottom .main .description{text-decoration:underline}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper{padding:0;position:relative;outline:none;overflow:hidden}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper .tile-top{position:absolute;left:0;top:0;width:100%}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper div.image{position:relative;padding:1px;display:flex;align-items:center;justify-content:center;overflow:hidden;max-width:250px;margin:0 auto 10px;height:auto}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper div.image:after{content:\"\";padding:100% 0 0;float:left;width:100%}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper div.image co-image{position:absolute;left:0;top:0;overflow:hidden;width:100%;height:100%;-o-object-fit:contain;object-fit:contain;z-index:-1;transition:all .2s ease}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper div.image .no-image-wrapper{position:absolute;display:flex;left:50%;top:50%;margin:-48px 0 0 -54px;flex-direction:column;align-items:center;opacity:.25}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper .tile-bottom{transition:all .2s ease;height:auto}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper .tile-bottom ::ng-deep co-button{margin:0 0 5px!important;width:36px;height:36px;border:1px solid #22313C;cursor:pointer;border-radius:4px;padding:0!important;font-size:0}.product-page-block-alternatives ::ng-deep co-tile .tile-wrapper .tile-bottom ::ng-deep co-button co-icon{width:32px;height:32px;margin:0 2px}.product-page-block-alternatives ::ng-deep co-tile .tile-extra-bottom{outline:none;padding:15px 0;background:transparent!important;min-height:60px}.product-page-block-alternatives ::ng-deep co-tile .tile-extra-bottom .main{padding:0 10px}.product-page-block-alternatives ::ng-deep co-tile .tile-extra-bottom .main .description{font-size:15px;font-weight:bold;margin:0 0 2px}.product-page-block-alternatives ::ng-deep co-tile .tile-extra-bottom .main .price{font-size:16px;margin:15px 0 0;font-weight:bold;color:#2b60a7}.product-page-block-additional-information{grid-column:1/6;grid-row:4/4}.product-page-block-properties{grid-column:7/10;grid-row:3/3}.product-page-block-related-articles{grid-column:2/6;grid-row:4/4}.product-page-block-alternative-articles{grid-column:6/10;grid-row:4/4}.product-page-block-documents{grid-column:2/6;grid-row:5/5}.product-page-block-symbols{grid-column:6/10;grid-row:5/5}@media screen and (max-width: 950px){.default-padding{padding-top:20px;padding-bottom:20px}.m-padding{padding-top:15px;padding-bottom:15px}.s-padding{padding-top:5px;padding-bottom:5px}.page-wrapper{max-width:650px}.page-wrapper .page-wrapper-content{flex-direction:column;margin:30px 0}.page-wrapper .page-wrapper-content .page-wrapper-left{width:100%}.page-wrapper .page-wrapper-content .page-wrapper-right{width:100%}.product-page-block-alternatives ::ng-deep co-tile{width:284px!important}}@media screen and (max-width: 650px){[class*=-padding]{padding-left:0!important;padding-right:0!important}.product-page-block-addtocart ::ng-deep co-number-picker co-button{height:38px!important}.product-page-block-addtocart ::ng-deep co-number-picker co-input-text{height:38px!important;width:36px!important}.product-page-block-addtocart ::ng-deep co-button.cart-button{height:40px;font-size:13px}}\n"]
|
|
1091
1098
|
},] }
|
|
1092
1099
|
];
|
|
1093
1100
|
ProductPageComponent.ctorParameters = () => [
|
|
@@ -1108,6 +1115,7 @@ ProductPageComponent.propDecorators = {
|
|
|
1108
1115
|
createFrozenArticle: [{ type: Input }],
|
|
1109
1116
|
isReturn: [{ type: Input }],
|
|
1110
1117
|
showRelatedProductsPopup: [{ type: Input }],
|
|
1118
|
+
enableRenderCarousel: [{ type: Input }],
|
|
1111
1119
|
openStockEvent: [{ type: Output }]
|
|
1112
1120
|
};
|
|
1113
1121
|
|
|
@@ -1136,11 +1144,18 @@ ProductSelectorTypeComponent.decorators = [
|
|
|
1136
1144
|
selector: 'app-product-selector-type',
|
|
1137
1145
|
template: `
|
|
1138
1146
|
<div *ngIf="show2D || show3D" class="show-in" [textContent]="'SHOW_IN' | localize"></div>
|
|
1139
|
-
<co-icon *ngIf="show2D" class="selector-type-icon"
|
|
1147
|
+
<co-icon *ngIf="show2D && !showRenderCarousel" class="selector-type-icon"
|
|
1148
|
+
[class.active]="currentType === type.TwoD"
|
|
1149
|
+
[iconData]="twoDIcon"
|
|
1150
|
+
(click)="handleIconClick(type.TwoD)"
|
|
1151
|
+
></co-icon>
|
|
1152
|
+
|
|
1153
|
+
<co-icon *ngIf="show2D && showRenderCarousel" class="selector-type-icon"
|
|
1140
1154
|
[class.active]="currentType === type.TwoD"
|
|
1141
1155
|
[iconData]="twoDIcon"
|
|
1142
1156
|
(click)="handleIconClick(type.TwoD)"
|
|
1143
1157
|
></co-icon>
|
|
1158
|
+
|
|
1144
1159
|
<co-icon *ngIf="show3D" class="selector-type-icon"
|
|
1145
1160
|
[class.active]="currentType === type.ThreeD"
|
|
1146
1161
|
[iconData]="threeDIcon"
|
|
@@ -1157,6 +1172,7 @@ ProductSelectorTypeComponent.ctorParameters = () => [
|
|
|
1157
1172
|
ProductSelectorTypeComponent.propDecorators = {
|
|
1158
1173
|
show2D: [{ type: Input }],
|
|
1159
1174
|
show3D: [{ type: Input }],
|
|
1175
|
+
showRenderCarousel: [{ type: Input }],
|
|
1160
1176
|
currentType: [{ type: Input }],
|
|
1161
1177
|
onIconClick: [{ type: Output }],
|
|
1162
1178
|
currentTypeChange: [{ type: Output }]
|
|
@@ -2698,6 +2714,149 @@ ProductDialogModule.decorators = [
|
|
|
2698
2714
|
},] }
|
|
2699
2715
|
];
|
|
2700
2716
|
|
|
2717
|
+
class VectorObject {
|
|
2718
|
+
}
|
|
2719
|
+
class RenderParameters {
|
|
2720
|
+
}
|
|
2721
|
+
class RenderCarouselComponent {
|
|
2722
|
+
constructor(iconCache, _appEventService, _changeDetector) {
|
|
2723
|
+
this.iconCache = iconCache;
|
|
2724
|
+
this._appEventService = _appEventService;
|
|
2725
|
+
this._changeDetector = _changeDetector;
|
|
2726
|
+
this.showRefresh = false;
|
|
2727
|
+
this.resizing = false;
|
|
2728
|
+
this.showLoader = true;
|
|
2729
|
+
this.renderedImageLoaded = false;
|
|
2730
|
+
// For now we will just use mock data
|
|
2731
|
+
this.renderAngles = [0, -45, -90, -135, -180, -225, -270, -315];
|
|
2732
|
+
this.currentRenderAngleIndex = 0;
|
|
2733
|
+
this.icon = IconEnum;
|
|
2734
|
+
this._subs = [];
|
|
2735
|
+
this._subs.push(this._appEventService.onReadyToRender.subscribe((readyToRender) => {
|
|
2736
|
+
if (readyToRender) {
|
|
2737
|
+
this.showLoader = true;
|
|
2738
|
+
this._createNewRender();
|
|
2739
|
+
}
|
|
2740
|
+
}), this._appEventService.onRenderStarted.subscribe(() => {
|
|
2741
|
+
this.showLoader = true;
|
|
2742
|
+
this._changeDetector.detectChanges();
|
|
2743
|
+
}), this._appEventService.onRenderImageReceived.subscribe((image) => {
|
|
2744
|
+
this.renderedImage = image;
|
|
2745
|
+
this.showLoader = false;
|
|
2746
|
+
this._changeDetector.detectChanges();
|
|
2747
|
+
}));
|
|
2748
|
+
}
|
|
2749
|
+
handleWindowResize() {
|
|
2750
|
+
this.resizing = true;
|
|
2751
|
+
clearTimeout(this._resizeTimer);
|
|
2752
|
+
this._resizeTimer = setTimeout(() => {
|
|
2753
|
+
this.resizing = false;
|
|
2754
|
+
}, 200);
|
|
2755
|
+
}
|
|
2756
|
+
gotoNextSlide() {
|
|
2757
|
+
this.showLoader = true;
|
|
2758
|
+
this.currentRenderAngleIndex = (this.currentRenderAngleIndex + 1) % this.renderAngles.length;
|
|
2759
|
+
this._createNewRender();
|
|
2760
|
+
}
|
|
2761
|
+
gotoPrevSlide() {
|
|
2762
|
+
this.showLoader = true;
|
|
2763
|
+
this.currentRenderAngleIndex = (this.currentRenderAngleIndex - 1 + this.renderAngles.length) % this.renderAngles.length;
|
|
2764
|
+
this._createNewRender();
|
|
2765
|
+
}
|
|
2766
|
+
ngOnDestroy() {
|
|
2767
|
+
this.carousel = undefined;
|
|
2768
|
+
this._subs.forEach(s => s.unsubscribe());
|
|
2769
|
+
}
|
|
2770
|
+
ngOnChanges() {
|
|
2771
|
+
this.renderedImageLoaded = false;
|
|
2772
|
+
}
|
|
2773
|
+
onRenderLoaded() {
|
|
2774
|
+
this.renderedImageLoaded = true;
|
|
2775
|
+
}
|
|
2776
|
+
_getRenderSettings() {
|
|
2777
|
+
const settings = new RenderParameters();
|
|
2778
|
+
const rotation = new VectorObject();
|
|
2779
|
+
rotation.x = 0;
|
|
2780
|
+
rotation.y = this.renderAngles[this.currentRenderAngleIndex];
|
|
2781
|
+
rotation.z = 0;
|
|
2782
|
+
settings.objectRotation = rotation;
|
|
2783
|
+
settings.margin = 15;
|
|
2784
|
+
return settings;
|
|
2785
|
+
}
|
|
2786
|
+
_createNewRender() {
|
|
2787
|
+
this.showLoader = true;
|
|
2788
|
+
this.renderedImageLoaded = false;
|
|
2789
|
+
const renderParams = this._getRenderSettings();
|
|
2790
|
+
this._appEventService.onGetRenderForRenderCarousel.next(renderParams);
|
|
2791
|
+
}
|
|
2792
|
+
}
|
|
2793
|
+
RenderCarouselComponent.decorators = [
|
|
2794
|
+
{ type: Component, args: [{
|
|
2795
|
+
selector: 'app-render-carousel',
|
|
2796
|
+
template: `
|
|
2797
|
+
<div id="product_page_carousel">
|
|
2798
|
+
<div id="product_page_carousel_render_items">
|
|
2799
|
+
<co-loader [isShown]="showLoader"></co-loader>
|
|
2800
|
+
<div #carousel class="inner-carousel">
|
|
2801
|
+
<div class="inner-carousel-render">
|
|
2802
|
+
<img
|
|
2803
|
+
[src]="renderedImage"
|
|
2804
|
+
[class.loaded]="renderedImageLoaded"
|
|
2805
|
+
(load)="onRenderLoaded()"
|
|
2806
|
+
class="fade-image"
|
|
2807
|
+
alt="">
|
|
2808
|
+
</div>
|
|
2809
|
+
<div class="carousel-scroller-layer">
|
|
2810
|
+
<div class="carousel-item-scroller prev" (click)="gotoPrevSlide()">
|
|
2811
|
+
<co-icon [iconData]="iconCache.getIcon(icon.ArrowPointLeft)"></co-icon>
|
|
2812
|
+
</div>
|
|
2813
|
+
<div class="carousel-item-scroller next" (click)="gotoNextSlide()">
|
|
2814
|
+
<co-icon [iconData]="iconCache.getIcon(icon.ArrowPointRight)"></co-icon>
|
|
2815
|
+
</div>
|
|
2816
|
+
</div>
|
|
2817
|
+
</div>
|
|
2818
|
+
</div>
|
|
2819
|
+
</div>
|
|
2820
|
+
`,
|
|
2821
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
2822
|
+
styles: [":host{max-height:540px;height:100%;position:relative}:host:not(.resizing) .inner-carousel{scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory}#product_page_carousel{position:relative}#product_page_carousel .refresh-button{position:absolute;bottom:10px;right:10px;background:#fff}#product_page_carousel .refresh-button.loading{animation:spin 1s linear infinite}#product_page_carousel .refresh-button:hover{box-shadow:none;background:#74B77F;transition:all .2s ease-in-out}#product_page_carousel .refresh-button:hover ::ng-deep svg path{fill:#fff!important}#product_page_carousel #product_page_carousel_render_items{position:relative;margin-bottom:10px;min-height:400px}#product_page_carousel #product_page_carousel_render_items ::ng-deep co-loader{position:absolute}#product_page_carousel .inner-carousel{display:flex;flex-direction:row;align-items:center;overflow:hidden;max-height:700px}#product_page_carousel .inner-carousel .inner-carousel-render img{width:100%;height:auto;-o-object-fit:contain;object-fit:contain}#product_page_carousel .carousel-scroller-layer{height:100%;width:100%;position:absolute;top:0;left:0;z-index:100}#product_page_carousel .carousel-scroller-layer .carousel-item-scroller{opacity:0;position:absolute;border-radius:50%;z-index:100;background:rgba(255,255,255,.4);color:#fff;width:30px;height:30px;top:calc(50% - 15px);cursor:pointer;transition:opacity .3s}#product_page_carousel .carousel-scroller-layer .carousel-item-scroller co-icon{color:#fff}#product_page_carousel .carousel-scroller-layer .prev{left:15px}#product_page_carousel .carousel-scroller-layer .next{right:15px}#product_page_carousel .carousel-scroller-layer:hover .carousel-item-scroller{opacity:1}#product_page_carousel #product_page_carousel_thumbs{display:flex;justify-content:flex-start;height:80px;margin-left:auto;margin-right:auto}#product_page_carousel #product_page_carousel_thumbs ::ng-deep co-scroll-container{padding:0 22px}#product_page_carousel #product_page_carousel_thumbs ::ng-deep co-scroll-container .content-wrapper{padding:0}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.fade-image{opacity:0;transition:opacity 1.5s ease-in-out}.fade-image.loaded{opacity:1}\n"]
|
|
2823
|
+
},] }
|
|
2824
|
+
];
|
|
2825
|
+
RenderCarouselComponent.ctorParameters = () => [
|
|
2826
|
+
{ type: IconCacheService },
|
|
2827
|
+
{ type: ProductEventService },
|
|
2828
|
+
{ type: ChangeDetectorRef }
|
|
2829
|
+
];
|
|
2830
|
+
RenderCarouselComponent.propDecorators = {
|
|
2831
|
+
carousel: [{ type: ViewChild, args: ['carousel', { read: ElementRef },] }],
|
|
2832
|
+
showRefresh: [{ type: Input }],
|
|
2833
|
+
article: [{ type: Input }],
|
|
2834
|
+
handleWindowResize: [{ type: HostListener, args: ['window:resize',] }],
|
|
2835
|
+
gotoNextSlide: [{ type: HostListener, args: ['swipeleft',] }],
|
|
2836
|
+
gotoPrevSlide: [{ type: HostListener, args: ['swiperight',] }],
|
|
2837
|
+
resizing: [{ type: HostBinding, args: ['class.resizing',] }]
|
|
2838
|
+
};
|
|
2839
|
+
|
|
2840
|
+
class RenderCarouselModule {
|
|
2841
|
+
}
|
|
2842
|
+
RenderCarouselModule.decorators = [
|
|
2843
|
+
{ type: NgModule, args: [{
|
|
2844
|
+
imports: [
|
|
2845
|
+
CommonModule,
|
|
2846
|
+
LoaderModule,
|
|
2847
|
+
ScrollContainerModule,
|
|
2848
|
+
IconModule,
|
|
2849
|
+
IconCollapseHandleModule
|
|
2850
|
+
],
|
|
2851
|
+
declarations: [
|
|
2852
|
+
RenderCarouselComponent
|
|
2853
|
+
],
|
|
2854
|
+
exports: [
|
|
2855
|
+
RenderCarouselComponent
|
|
2856
|
+
]
|
|
2857
|
+
},] }
|
|
2858
|
+
];
|
|
2859
|
+
|
|
2701
2860
|
class ProductPageModule {
|
|
2702
2861
|
}
|
|
2703
2862
|
ProductPageModule.decorators = [
|
|
@@ -2717,7 +2876,8 @@ ProductPageModule.decorators = [
|
|
|
2717
2876
|
ProductInfoTabsModule,
|
|
2718
2877
|
PipeModule,
|
|
2719
2878
|
ProductDialogModule,
|
|
2720
|
-
LoaderModule$1
|
|
2879
|
+
LoaderModule$1,
|
|
2880
|
+
RenderCarouselModule
|
|
2721
2881
|
],
|
|
2722
2882
|
schemas: [CUSTOM_ELEMENTS_SCHEMA],
|
|
2723
2883
|
declarations: [
|
|
@@ -3143,7 +3303,7 @@ class IoneProductModule {
|
|
|
3143
3303
|
IoneProductModule.decorators = [
|
|
3144
3304
|
{ type: NgModule, args: [{
|
|
3145
3305
|
imports: [
|
|
3146
|
-
//BrowserAnimationsModule,
|
|
3306
|
+
// BrowserAnimationsModule,
|
|
3147
3307
|
CommonModule,
|
|
3148
3308
|
ProductPageModule,
|
|
3149
3309
|
ProductHdModule,
|
|
@@ -3162,12 +3322,6 @@ IoneProductModule.decorators = [
|
|
|
3162
3322
|
],
|
|
3163
3323
|
bootstrap: [
|
|
3164
3324
|
IoneProductComponent
|
|
3165
|
-
],
|
|
3166
|
-
providers: [
|
|
3167
|
-
ProductSettingsService,
|
|
3168
|
-
ProductConnectorService,
|
|
3169
|
-
ProductEventService,
|
|
3170
|
-
ProductConnectorAdapterService
|
|
3171
3325
|
]
|
|
3172
3326
|
},] }
|
|
3173
3327
|
];
|
|
@@ -3176,5 +3330,5 @@ IoneProductModule.decorators = [
|
|
|
3176
3330
|
* Generated bundle index. Do not edit.
|
|
3177
3331
|
*/
|
|
3178
3332
|
|
|
3179
|
-
export { IoneProductComponent, IoneProductModule, ProductConnectorAdapterService, ProductConnectorService, ProductEventService, ProductExternalSourceComponent, ProductExternalSourceModule, ProductSettingsService, Version, ProductPageModule as ɵa, ProductSelectorTypeModule as ɵb, ProductInfoTabsModule as ɵba, ProductAdditionalInfoModule as ɵbb, ProductAdditionalInfoComponent as ɵbc, ProductPropertiesModule as ɵbd, ProductPropertiesComponent as ɵbe, ProductDocumentModule as ɵbf, ProductDocumentsComponent as ɵbg, ProductSymbolsModule as ɵbh, ProductSymbolsComponent as ɵbi, ProductInfoTabsComponent as ɵbj, ProductDialogModule as ɵbk, ProductDialogComponent as ɵbl,
|
|
3333
|
+
export { IoneProductComponent, IoneProductModule, ProductConnectorAdapterService, ProductConnectorService, ProductEventService, ProductExternalSourceComponent, ProductExternalSourceModule, ProductSettingsService, Version, ProductPageModule as ɵa, ProductSelectorTypeModule as ɵb, ProductInfoTabsModule as ɵba, ProductAdditionalInfoModule as ɵbb, ProductAdditionalInfoComponent as ɵbc, ProductPropertiesModule as ɵbd, ProductPropertiesComponent as ɵbe, ProductDocumentModule as ɵbf, ProductDocumentsComponent as ɵbg, ProductSymbolsModule as ɵbh, ProductSymbolsComponent as ɵbi, ProductInfoTabsComponent as ɵbj, ProductDialogModule as ɵbk, ProductDialogComponent as ɵbl, RenderCarouselModule as ɵbm, RenderCarouselComponent as ɵbn, ProductPageComponent as ɵbo, ProductHdModule as ɵbp, ProductHdComponent as ɵbq, ProductScriptLoaderService as ɵbr, PipeModule as ɵc, LocalizePipe as ɵd, DictionaryService as ɵe, JsonUtilsService as ɵf, ProductSelectorTypeComponent as ɵg, IconCacheService as ɵh, ImageCarouselModule as ɵi, ImageCarouselComponent as ɵj, ProductDescriptionModule as ɵk, ProductDescriptionComponent as ɵl, ProductAdditionalDescriptionModule as ɵm, ProductAdditionalDescriptionComponent as ɵn, ProductPriceModule as ɵo, ProductPriceComponent as ɵp, ProductAddtocartModule as ɵq, ProductAddtocartComponent as ɵr, ProductRelatedModule as ɵs, HeaderModule as ɵt, HeaderComponent as ɵu, ProductRelatedComponent as ɵv, ProductStockModule as ɵw, ProductStockComponent as ɵx, ProductDeliveryModule as ɵy, ProductDeliveryComponent as ɵz };
|
|
3180
3334
|
//# sourceMappingURL=colijnit-product.js.map
|