1 @using Warmgarant.Shop.Models.Constants
2 @using Warmgarant.Shop.Repository.Helpers
3 @using Warmgarant.Shop.Models.Enumerations
4
5 @inherits Dynamicweb.Rendering.RazorTemplateBase<Dynamicweb.Rendering.RazorTemplateModel<Dynamicweb.Rendering.Template>>
6 @SnippetStart("HeadContent")
7 <script src="/Scripts/jquery.waypoints.min.js"></script>
8 <script src="/Scripts/sticky.min.js"></script>
9 @SnippetEnd("HeadContent")
10
11 @{
12
13 // Get the product by productIds
14
15 var errorMessage = "";
16 var result = Warmgarant.Shop.Application.CustomCode.Extenders.PageTemplateExtender1.TryGetProductForAssemblePageFromUrl().ToList();
17
18 if (result.Count() > 1)
19 {
20 errorMessage = Translate("ErrorDuplicateCustomAssemblyPagesConfigured", "There are conflicting/duplicate assemble pages configured for this product.");
21 }
22 else if (result.Count() < 1)
23 {
24 errorMessage = Translate("ErrorNoCustomAssemblyPagesConfigured", "There are no assemble pages configured for this product.");
25 }
26
27 var product = result.FirstOrDefault().Product;
28 var orderType = result.FirstOrDefault().OrderType;
29
30 // Determine rent or buy
31
32 // Give warning by to many results
33
34 // dependencies
35 var areaId = Dynamicweb.Frontend.PageView.Current().AreaID;
36
37
38 /// config
39 var assetsDirectory = "./files/templates/designs/warmgarant/styleguide/assets/";
40 var isComparePage = false;
41 var cartUrl = default(string);
42
43 var selectedBoiler = product;
44 ProductHelper.ClearProductPriceCache(selectedBoiler);
45 var boilerSelected = selectedBoiler != null;
46
47 // quotation data
48 var quotationParagraphId = AreaHelper.GetAreaItemIntValueBySystemName(StringConstants.WebsiteConfiguration.QuotationRequestParagraphId);
49
50 // boiler info
51 var boilerName = default(string);
52 var boilerProductId = default(string);
53 var productPrice = default(string);
54 var productPriceMobile = default(string);
55 var productPriceDouble = default(double);
56 var productImage = default(string);
57 var boilerMonthlyCost = default(double);
58 var isActionPrice = default(bool);
59 var isNew = default(bool);
60 var productBadge = default(string);
61 var productMonthlyCosts = default(string);
62 var productMonthlyCostsMobile = default(string);
63 var priceBeforeDiscount = default(string);
64 var priceBeforeDiscountDouble = default(double);
65 var productLongDescription = default(string);
66 var techSpecsPageUrl = default(string);
67 var productHeatingPower = default(string);
68 var productWarmWater = default(string);
69 var subtitle = GetString("Item.SubTitle.Value");
70 var thermostatTitle = GetString("Item.ThermostatTitle.Value");
71
72 Dynamicweb.Ecommerce.Products.Product selectedThermostat = null;
73 List<Dynamicweb.Ecommerce.Products.Product> thermostatOptions = null;
74
75 var thermostatIntro = GetString("Item.ThermostatIntroText.Value");
76
77 // floor heating info
78 Dynamicweb.Ecommerce.Products.Product selectedFloorHeating = null;
79 List<Dynamicweb.Ecommerce.Products.Product> floorheatingOptions = null;
80 var floorHeatingTitle = GetString("Item.FloorHeatingTitle.Value");
81 var floorHeatingInfo = GetString("Item.FloorHeatingTitleInformation.Value");
82 var floorHeatingIntro = GetString("Item.FloorHeatingIntroText.Value");
83 var floorHeatingExtraInfo = default(string);
84
85 // air/dirt separator product info
86 Dynamicweb.Ecommerce.Products.Product selectedAirDirtSeparatorProduct = null;
87 List<Dynamicweb.Ecommerce.Products.Product> airDirtSeparatorOptions = null;
88 var airDirtSeparatorTitle = GetString("Item.AirDirtSeparatorTitle.Value");
89 var airDirtSeparatorInfo = GetString("Item.AirDirtSeparatorInformation.Value");
90 var airDirtSeparatorIntro = GetString("Item.AirDirtSeparatorIntroText.Value");
91 var airDirtSeparatorExtraInfo = default(string);
92
93 // installation info
94 var installationTitle = GetString("Item.InstallationTitle.Value");
95 var installationInfo = GetString("Item.InstallationTitleInformation.Value");
96 var installationIntro = GetString("Item.InstallationIntroText.Value");
97
98 // disclaimer info
99 var disclaimerTitle = GetString("Item.DisclaimerTitle.Value");
100 var disclaimerText = GetString("Item.DisclaimerText.Value");
101
102 // service subscriptipn info
103 var serviceSubscriptionTitle = GetString("Item.ServiceSubscriptionTitle.Value");
104 var serviceSubscriptionIntro = GetString("Item.ServiceSubscriptionIntroText.Value");
105 var serviceSubscriptionInfo = default(string);
106 var selectedServiceSubscription = (Dynamicweb.Ecommerce.Products.Product)null;
107 var serviceSubscriptionOptions = new List<Dynamicweb.Ecommerce.Products.Product>();
108
109 // installation info
110 var selectedInstallation = (Dynamicweb.Ecommerce.Products.Product)null;
111 var installationOptions = new List<Dynamicweb.Ecommerce.Products.Product>();
112 var installationExtraInfo = default(string);
113
114 if (boilerSelected)
115 {
116 SessionHelper.SetLastAddedProductSessionValue(selectedBoiler.Id, orderType);
117
118 // boiler info
119 productLongDescription = selectedBoiler.LongDescription;
120 boilerProductId = selectedBoiler.Id;
121 boilerName = ProductHelper.CreateProductName(selectedBoiler.Name, selectedBoiler.Manufacturer);
122
123 boilerMonthlyCost = ProductHelper.GetProductFieldValue<double>(selectedBoiler, "RentMonthlyCosts");
124 productBadge = ProductHelper.GetProductFieldValue<string>(selectedBoiler, "ExtraIcon").Replace("../", "./Files/");
125 if (!string.IsNullOrWhiteSpace(productBadge) && !productBadge.ToLower().Contains("/files/"))
126 {
127 // for some reason "/Files/Images/Cons-logo_2017.png" can be "Cons-logo_2017.png" when collected by ProductHelper.GetProductFieldValue<string>()
128 productBadge = string.Format("./Files/Images/{0}", productBadge);
129 }
130
131
132 productHeatingPower = ProductHelper.GetProductFieldValue<string>(selectedBoiler, StringConstants.ProductFieldValueSystemNames.PowerLabel);
133 productWarmWater = ProductHelper.GetProductFieldValue<string>(selectedBoiler, StringConstants.ProductFieldValueSystemNames.TapWater40C);
134
135 // thermostat info
136 thermostatOptions = OrderHelper.GetThermostats(selectedBoiler, orderType);
137
138 // floor heating info
139 floorheatingOptions = OrderHelper.GetOptions(ProductType.FloorHeatingSet, areaId);
140 if (selectedFloorHeating != null)
141 {
142 floorHeatingExtraInfo = selectedFloorHeating.LongDescription;
143 }
144 if (string.IsNullOrWhiteSpace(floorHeatingExtraInfo))
145 {
146 floorHeatingExtraInfo = floorheatingOptions.FirstOrDefault().LongDescription;
147 }
148
149 // air- dirt separator info
150 airDirtSeparatorOptions = OrderHelper.GetOptions(ProductType.AirDirtSeparator, areaId, orderType);
151 if (selectedAirDirtSeparatorProduct != null)
152 {
153 airDirtSeparatorExtraInfo = selectedAirDirtSeparatorProduct.LongDescription;
154 }
155 if (string.IsNullOrWhiteSpace(airDirtSeparatorExtraInfo))
156 {
157 airDirtSeparatorExtraInfo = airDirtSeparatorOptions?.FirstOrDefault().LongDescription ?? "";
158 }
159
160 // service subscription info
161 serviceSubscriptionOptions = OrderHelper.GetServiceSubscriptions(orderType, ProductType.Boiler, areaId, false, false, false, false);
162 if (serviceSubscriptionOptions != null && serviceSubscriptionOptions.Any())
163 {
164 serviceSubscriptionInfo = serviceSubscriptionOptions.FirstOrDefault()?.LongDescription;
165 }
166
167 // installation info
168 //installationOptions = OrderHelper.GetOptions(ProductType.Installation).FirstOrDefault();
169 installationOptions = OrderHelper.GetInstallations(orderType, ProductType.Boiler, areaId, selectedBoiler).ToList();
170 if (installationOptions != null)
171 {
172 installationExtraInfo = installationOptions.FirstOrDefault().LongDescription;
173 }
174
175 // add defaults
176 var setDefaults = selectedThermostat == null ||
177 selectedFloorHeating == null ||
178 selectedAirDirtSeparatorProduct == null ||
179 selectedServiceSubscription == null ||
180 selectedInstallation == null;
181
182 if (orderType.Equals(OrderType.Buy))
183 {
184 // get price
185 ProductHelper.ClearProductPriceCache(selectedBoiler);
186 productPriceDouble = ProductHelper.GetProductPrice(selectedBoiler).Price;
187 productPrice = productPriceDouble.WarmgarantMoneyFormat(true, false);
188 productPriceMobile = productPriceDouble.WarmgarantMoneyFormat(true, false);
189
190 var productDiscountInfo = ProductHelper.GetProductDiscountInfo(selectedBoiler.Id, areaId: areaId);
191 isActionPrice = productDiscountInfo.ProductHasDiscount;
192 if (productDiscountInfo.ProductHasDiscount)
193 {
194 priceBeforeDiscount = productDiscountInfo.ProductPriceBeforeDiscount.ToString();
195 var productDiscountPriceDouble = productDiscountInfo.ProductPrice;
196 priceBeforeDiscountDouble = productDiscountInfo.ProductPriceBeforeDiscount;
197 productPriceDouble = productDiscountInfo.ProductPrice;
198 productPrice = productDiscountPriceDouble.WarmgarantMoneyFormat(true, false);
199 }
200
201 // get price sub title
202 var serviceSubscriptionProduct = OrderHelper.GetOptions(Warmgarant.Shop.Models.Enumerations.ProductType.ServiceSubscription, areaId)?.FirstOrDefault(p => p.Number.Equals(StringConstants.ProductSystemNames.ServiceSubscriptionBuy) && p.Active);
203 if (serviceSubscriptionProduct != null)
204 {
205 ProductHelper.ClearProductPriceCache(serviceSubscriptionProduct);
206 boilerMonthlyCost = ProductHelper.GetProductPrice(serviceSubscriptionProduct).Price;
207 }
208 else
209 {
210 boilerMonthlyCost = 0.0; // don't show the rent costs for buy
211 }
212
213 // go to cart URL
214 var cartPageId = AreaHelper.GetAreaItemStringValueBySystemName(StringConstants.WebsiteConfiguration.SalesCartPageId);
215 if (!string.IsNullOrWhiteSpace(cartPageId))
216 {
217 cartUrl = string.Format("/Default.aspx?ID={0}", cartPageId);
218 }
219 }
220
221 if (orderType.Equals(OrderType.Rent))
222 {
223 isActionPrice = ProductHelper.GetProductFieldValue<bool>(selectedBoiler, StringConstants.ProductFieldValueSystemNames.IsForRentAction);
224
225 // go to cart URL
226 var cartPageId = AreaHelper.GetAreaItemStringValueBySystemName(StringConstants.WebsiteConfiguration.RentalsCartPageId);
227 if (!string.IsNullOrWhiteSpace(cartPageId))
228 {
229 cartUrl = string.Format("/Default.aspx?ID={0}", cartPageId);
230 }
231 }
232
233 productMonthlyCosts = boilerMonthlyCost <= 0 ? "" : string.Format("+{0} {1}", boilerMonthlyCost.WarmgarantMoneyFormat(), Translate("PerMonthShort", "p/m").JsEncode());
234 productMonthlyCostsMobile = boilerMonthlyCost <= 0 ? "" : string.Format("+ {0} {1}", boilerMonthlyCost.WarmgarantMoneyFormat(true), Translate("PerMonth", "per month").JsEncode());
235
236 productImage = ProductHelper.GetProductImage(selectedBoiler, orderType, areaId);
237 }
238
239 var seoPage = SeoHelper.GetVirtualPageviewAssemblyPage(
240 GetGlobalValue("Global:Request.Scheme"),
241 GetGlobalValue("Global:Request.Host"),
242 GetGlobalValue("Global:Pageview.Url"),
243 boilerName);
244
245 var seoPageQuotation = string.Format("{0}/{1}", seoPage, Translate("SEO_VirtualPageviewBoilerAssemblyQuotationForm", "quotation-form"));
246
247 var serviceSubscriptionImage = "";
248 var installationImage = "";
249
250 var productDetailPageLink = Equals(orderType, Warmgarant.Shop.Models.Enumerations.OrderType.Rent) ?
251 GetString("Ecom:Product:Field.AW_PumpProductPage_Rent.Value") :
252 GetString("Ecom:Product:Field.WT_PumpProductPage.Value");
253
254
255 if (!string.IsNullOrWhiteSpace(seoPage))
256 {
257 <Text>
258 <script>
259 SEO.trackPageView("@seoPage", '@GetGlobalValue("Global:CookieOptInLevel").ToLower()' === 'functional');
260 </script>
261 </Text>
262 }
263
264 <div id="boilerassembly">
265 @NavigationHelper.GetBreadCrumb()
266
267 @if (!string.IsNullOrEmpty(errorMessage))
268 {
269 <div class="alert alert-danger">
270 <div class="alert-title">@Translate("Warning", "Warning")</div>
271 <p>@errorMessage</p>
272 </div>
273 }
274 else
275 {
276 <div class="row">
277 <div class="col s10 push-s1 l12">
278 <h1>@GetString("ParagraphHeader") @GetString("Item.ParagraphHeader.Value")</h1>
279 </div>
280 </div>
281 <div class="row">
282 <div class="col s12 l3 hide-on-med-and-down">
283 <div class="row">
284 <div class="col s12">
285 <div class="boiler-image">
286 <div class="contents">
287 @using Warmgarant.Shop.Repository.Helpers
288 @inherits Dynamicweb.Rendering.RazorTemplateBase<Dynamicweb.Rendering.RazorTemplateModel<Dynamicweb.Rendering.Template>>
289
290 @if (productPriceDouble > 0)
291 {
292 var priceColorClass = "orange-gradient";
293 if (isActionPrice)
294 {
295 priceColorClass = "red-gradient";
296 }
297
298 <div class="action-circle medium @priceColorClass">
299 <div class="action-container">
300 <span @if (!string.IsNullOrWhiteSpace(productMonthlyCosts)) { <text> data-after="@productMonthlyCosts" </text> }>@productPrice</span>
301 </div>
302 </div>
303 }
304
305 <div class="action-corner @(!isActionPrice ? "hide" : "")">
306 <div class="action-corner-wrapper">
307 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/action-corner.svg", assetsDirectory), title: Translate("Action", "Action").JsEncode())
308 <div class="action-corner-container">
309 <span>@Translate("Action", "Action")</span>
310 </div>
311 </div>
312 </div>
313
314 @if (!string.IsNullOrWhiteSpace(productBadge))
315 {
316 <div class="ribbons">
317 <div class="ribbon ribbon-medium">
318 <img src="@productBadge" alt="@Translate("ProductBadge", "Product badge").JsEncode()" width="78">
319 </div>
320 </div>
321 }
322 else if (isNew)
323 {
324 <div class="action-circle medium special">
325 <div class="action-container">
326 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/action-circle-new.svg", assetsDirectory), "brown-svg", Translate("New", "New").JsEncode())
327 <span>@Translate("New", "New")</span>
328 </div>
329 </div>
330 }
331
332 @if (orderType.Equals(OrderType.Buy))
333 {
334 <div class="original-price @(!isActionPrice ? "hide" : "")">
335 <div class="contents text-small brown-wg-text darken-2">
336 @Translate("Of", "Van").ToLower() <span class="strikethrough">@priceBeforeDiscount</span>
337 <br />
338 <b>@Translate("For", "Voor").ToLower()</b>
339 </div>
340 </div>
341 }
342
343 <div class="image" style="background-image: url(@productImage);"></div>
344
345
346 </div>
347 </div>
348 @using Warmgarant.Shop.Repository.Helpers
349 @inherits Dynamicweb.Rendering.RazorTemplateBase<Dynamicweb.Rendering.RazorTemplateModel<Dynamicweb.Rendering.Template>>
350 @{
351 @*NOTE: Javascript initialize of this element should be done in the parent, because the default settings can differ per page!*@
352 int adviceParagraphId = Warmgarant.Shop.Repository.Helpers.AreaHelper.GetAreaItemIntValueBySystemName(Warmgarant.Shop.Models.Constants.StringConstants.WebsiteConfiguration.AdviceParagraphId);
353 int contactParagraphId = Warmgarant.Shop.Repository.Helpers.AreaHelper.GetAreaItemIntValueBySystemName(Warmgarant.Shop.Models.Constants.StringConstants.WebsiteConfiguration.ContactParagraphId);
354
355 // alleen gevuld als Advice_Contact itemtype gebruikt wordt en de custom velden zijn gevuld:
356 var customContactText = GetString("Item.CustomContactText.Value");
357 var customAdviceText = GetString("Item.CustomAdviceText.Value");
358
359 if (adviceParagraphId > 0 && contactParagraphId > 0)
360 {
361 var callMeBackConsentText = StringHelper.GetConsentLabel(Translate("CallMeBackConsentLabel", "I agree with the Warmgarant privacy statement as shown on the {0}privacy page{1}"),
362 Translate("ConsentPrivacyPageUrl", "https://www.warmgarant.nl/privacy"),
363 "callmeback-consent-link");
364
365 <div id="advice-contact">
366 <div class="tabs-wrapper tabs-brown" id="tabs-advice-contact">
367 @*TABS: default (a with active class) is set on parent, can differ per page*@
368 <ul class="tabs">
369 <li class="tab"><a href="#tab-content-advice" id="advice-tab">@Translate("Our Advice", "Ons advies")</a></li>
370 <li class="tab"><a href="#tab-content-contact" id="contact-tab" class="active">@Translate("Contact")</a></li>
371 </ul>
372 @*ADVICE*@
373 <div id="tab-content-advice" class="col s12 tabs-content" style="display: none;">
374 <div class="tabs-content-wrapper">
375 @if (!string.IsNullOrWhiteSpace(customAdviceText))
376 {
377 <div class="pictogram pictogram-small">
378 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/pictograms/apostrophe.svg", assetsDirectory), classNames: "orange-svg", title: Translate("Apostrophe", "Apostrophe"))
379 </div>
380
381 @customAdviceText
382 }
383 else
384 {
385 @RenderParagraphContent(adviceParagraphId)
386 }
387 </div>
388 </div>
389 @*CONTACT*@
390 <div id="tab-content-contact" class="col s12 tabs-content general-wg-text active">
391 @*CONTACT CONTENT OPEN/CLOSED*@
392 <div class="tabs-content-wrapper">
393 @if (!string.IsNullOrWhiteSpace(customContactText))
394 {
395 <div class="pictogram pictogram-small">
396 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/pictograms/apostrophe.svg", assetsDirectory), classNames: "orange-svg", title: Translate("Apostrophe", "Apostrophe"))
397 </div>
398
399 @customContactText
400 }
401 else
402 {
403 @RenderParagraphContent(contactParagraphId)
404 }
405 </div>
406 @*CALL ME BACK FORM*@
407 <div class="tabs-content-overlay tabs-content-overlay-hidden" id="call-me-back-container">
408 <div class="overlay-toggle overlay-toggle-top">
409 <div class="pictogram pictogram-x-small" data-toggle="call-me-back-container">
410 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/pictograms/x-close.svg", assetsDirectory), classNames: "general-svg", title: Translate("Close", "Close").JsEncode())
411 </div>
412 </div>
413 <div class="pictogram pictogram-small">
414 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/pictograms/apostrophe.svg", assetsDirectory), classNames: "orange-svg", title: Translate("Apostrophe", "Apostrophe").JsEncode())
415 </div>
416 <h7>@Translate("CallBackForm_Intro", "Call me back request")</h7>
417
418 @*Note: translate tags within form need to be surrounded by single quotes, or the pageheatpumpinfo page will crash! *@
419
420 <form name="call-back-request-form" id="call-back-request-form" method="post">
421 <div class="row">
422 <div class="col s12">
423 <input type="text" name="CallMeBack_Name" id="CallMeBack_Name" required="required" class="validate" placeholder='@Translate("CallBackForm_Name", "Your name").JsEncode()' />
424 </div>
425 </div>
426 <div class="row">
427 <div class="col s12">
428 <textarea name="CallMeBack_Address" id="CallMeBack_Address" required="required" class="materialize-textarea validate" placeholder='@Translate("CallBackForm_Address", "Your address")'></textarea>
429 </div>
430 </div>
431 <div class="row">
432 <div class="col s12">
433 <input type="tel" name="CallMeBack_Telephone" id="CallMeBack_Telephone" required="required" class="validate" maxlength="10" placeholder='@Translate("CallBackForm_Telephone", "Your telephone number")' />
434 </div>
435 </div>
436 <div class="row">
437 <div class="col s12">
438 <label class="checkbox consent orange-content-link cmb">
439 <input type="checkbox" value="true" name="CallMeBack_Consent" id="CallMeBack_Consent" required="required" />
440 @callMeBackConsentText
441 </label>
442 </div>
443 </div>
444 <div class="row">
445 <div class="input-field col s12">
446 <input type="button" name="CallMeBack_Submit" id="CallMeBack_Submit" value='@Translate("CallBackForm_ButtonText", "Submit")' class="btn btn-brown" />
447 </div>
448 </div>
449 </form>
450
451 <div id="feedback-success" class="hide">
452 <p class="general-wg-text">@Translate("CallBackForm_FeedbackSuccess", "Thanks for your call back request. We will contact you as soon as possible.")</p>
453 </div>
454 <div id="feedback-failure" class="hide">
455 <p class="general-wg-text">@Translate("CallBackForm_FeedbackFailure", "An error has occurred while sending the request.")</p>
456 </div>
457 </div>
458 @{
459 @*CHAT ICOON*@
460 if (AreaHelper.OfficeIsOpen().Item1 &&
461 IntercomHelper.IntercomIsActive() &
462 !string.IsNullOrWhiteSpace(Warmgarant.Shop.Models.Config.ExtraConfig.ExtraConfiguration.IntercomMessengerSettings.InboundEmail))
463 {
464 <div class="overlay-toggle">
465 <div class="pictogram pictogram-small general-wg">
466 <a href="javascript:void(0);" class="openIntercom">@SvgHelper.GetSvgContent(string.Format("{0}images/svg/pictograms/chat2.svg", assetsDirectory), classNames: "brown-svg darken-4", title: Translate("Chat", "Chat").JsEncode())</a>
467 </div>
468 </div>
469 }
470 }
471 </div>
472 </div>
473 </div>
474
475 @SnippetStart("JavaScriptBottom")
476 <script>
477
478 function onBeforeCallMeBack() {
479 $("#call-back-request-form").removeClass("hide");
480 $("#feedback-failure").addClass("hide");
481 $("#feedback-success").addClass("hide");
482 ResetCallBackRequestForm();
483 }
484
485 function callMeBackFormSent() {
486 $("#call-back-request-form").addClass("hide");
487 $("#feedback-failure").addClass("hide");
488 $("#feedback-success").removeClass("hide");
489
490 SEO.trackEvent(
491 '@Translate("SEO_Event_CallMeBack", "call-me-back")',
492 '@Translate("SEO_Event_CallMeBack_Sent", "success")',
493 $("#CallMeBack_Telephone").val(),
494 '');
495
496 ResetCallBackRequestForm();
497 }
498
499 function callMeBackFormNotSent() {
500 $("#call-back-request-form").addClass("hide");
501 $("#feedback-success").addClass("hide");
502 $("#feedback-failure").removeClass("hide");
503 ResetCallBackRequestForm();
504 }
505
506 function ResetCallBackRequestForm() {
507 $("#CallMeBack_Name", "#call-back-request-form").val("");
508 $("#CallMeBack_Address", "#call-back-request-form").val("");
509 $("#CallMeBack_Telephone", "#call-back-request-form").val("");
510 $("#CallMeBack_Submit", "#call-back-request-form").removeClass("btn-orange").addClass("btn-brown");
511
512 // Only numbers in telephone field
513 $("#CallMeBack_Telephone", "#call-back-request-form").numeric();
514
515 // Initialize consent checkbox
516 $("label.checkbox.consent.cmb", "#call-back-request-form").innovadisCheckbox({
517 onAfterChange: validateCallBackForm(true)
518 });
519 $("#CallMeBack_Consent", "#call-back-request-form").prop("checked", false);
520
521 // Enable link in general conditions label
522 $(".callmeback-consent-link", "#call-back-request-form").off("click").on("click", function (e) {
523 e.stopPropagation();
524 e.preventDefault();
525 window.open($(this).attr('href'), $(this).attr('target'));
526 return false;
527 });
528
529 $("input, textarea", "#call-back-request-form").off("change").on("change", function () {
530 if ($(this).val() !== "") {
531 $(this).removeClass("error");
532 }
533 });
534
535 }
536
537 function validateCallBackForm(changeButton) {
538
539 $("input,textarea", "#call-back-request-form").removeClass("error");
540
541 var isValid = true;
542 var name = $("#CallMeBack_Name", "#call-back-request-form").val();
543 var address = $("#CallMeBack_Address", "#call-back-request-form").val();
544 var telephone = $("#CallMeBack_Telephone", "#call-back-request-form").val();
545 var callbackConsent = $("#CallMeBack_Consent", "#call-back-request-form").prop("checked");
546
547 if (name.length == 0) {
548 isValid = false;
549 $("#CallMeBack_Name", "#call-back-request-form").addClass("error");
550 }
551
552 if (address.length == 0) {
553 isValid = false;
554 $("#CallMeBack_Address", "#call-back-request-form").addClass("error");
555 }
556
557 if (telephone.length != 10 || !telephone.startsWith("0")) {
558 isValid = false;
559 $("#CallMeBack_Telephone", "#call-back-request-form").addClass("error");
560 }
561
562 if (!callbackConsent) {
563 isValid = false;
564 }
565
566 if (changeButton) {
567 if (isValid) {
568 $("#CallMeBack_Submit").removeClass("btn-brown").addClass("btn-orange");
569
570 } else {
571 $("#CallMeBack_Submit").removeClass("btn-orange").addClass("btn-brown");
572 }
573 }
574
575 return isValid;
576 }
577
578
579 </script>
580 @SnippetEnd("JavaScriptBottom")
581 @SnippetStart("JavaScriptDocReady")
582 <text>
583
584 // submit form
585 $("#CallMeBack_Submit", "#call-back-request-form")
586 .off("click")
587 .on("click", function() {
588
589 if (!validateCallBackForm(false)) {
590 return false;
591 }
592
593 var name = $("#CallMeBack_Name", "#call-back-request-form").val();
594 var address = $("#CallMeBack_Address", "#call-back-request-form").val();
595 var telephone = $("#CallMeBack_Telephone", "#call-back-request-form").val();
596
597 var callbackRequestApiUrl = "/@Warmgarant.Shop.Models.Constants.StringConstants.ApplicationVariables.WebApiName/form/callbackrequestsubmit";
598
599 var formvalues = {
600 areaId: @Warmgarant.Shop.Repository.Helpers.AreaHelper.GetCurrentAreaId(),
601 culture: '@GetGlobalValue("Global:Area.LongLang")',
602 name: name.trim(),
603 address: address.trim(),
604 telephonenumber: telephone.trim()
605 }
606
607 // ajax post
608 $.ajax({
609 type: "POST",
610 data: JSON.stringify(formvalues),
611 url: callbackRequestApiUrl,
612 contentType: "application/json"
613 }).done(function(sentSuccessfully, status, metaData) {
614 if (sentSuccessfully) {
615 callMeBackFormSent();
616 } else { //show error message
617 callMeBackFormNotSent();
618 }
619 }).fail(function(jqxhr, textStatus, error) {
620 var err = textStatus + ", " + error;
621 console.error("Request:", callbackRequestApiUrl, " failed:", err);
622 callMeBackFormNotSent();
623 });
624
625 });
626 </text>
627 @SnippetEnd("JavaScriptDocReady")
628 }
629 }
630 </div>
631 </div>
632 </div>
633 <div class="col s12 l9">
634 <div class="row" id="contentrow">
635 <div class="col s10 l8 push-s1">
636
637 <div class="row">
638
639 @{
640 if (selectedBoiler == null)
641 {
642 <div class="col s12">
643 <p>@Translate("FirstSelectABoiler", "First select a boiler.")</p>
644 </div>
645 }
646 else
647 {
648 var productPageId = 0;
649 if (orderType.Equals(OrderType.Buy))
650 {
651 productPageId = AreaHelper.GetAreaItemIntValueBySystemName(StringConstants.WebsiteConfiguration.SalesListPageId);
652
653 }
654 if (orderType.Equals(OrderType.Rent))
655 {
656 productPageId = AreaHelper.GetAreaItemIntValueBySystemName(StringConstants.WebsiteConfiguration.RentalsListPageId);
657 }
658
659 if (productPageId > 0)
660 {
661 techSpecsPageUrl = string.Format("/Default.aspx?ID={0}&ProductID={1}", productPageId, boilerProductId);
662 }
663
664 <div class="col s12">
665 <div class="row">
666 <div class="col s12">
667 <h3>@boilerName</h3>
668 <span class="hide-on-large-only mobile-price">@productPriceMobile @productMonthlyCostsMobile</span>
669 </div>
670 <div class="col s12 hide-on-med-and-down rich-text-editor-content assembly-intro">
671 @selectedBoiler.ShortDescription
672 </div>
673 <div class="col s12 hide-on-med-and-down">
674 <div class="specsArea">
675 <div class="specscolumn heating-wrapper">
676 <div class="header-container">
677 <div class="text-small opensans-bold">@Translate("ProductInfoModal_HeatingPower", "Heating power")</div>
678 <div class="text-small">@Translate("ProductInfoModal_InKW", "in kW")</div>
679 </div>
680 <div class="details-container">
681 <div class="indicator indicator-small">
682 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/indicators/heating-capacity.svg", assetsDirectory), "orange-svg")
683 </div>
684 <div class="text-large opensans-bold">@{ProductHelper.GetProductFieldValue<string>(selectedBoiler, StringConstants.ProductFieldValueSystemNames.PowerFrom);}</div>
685 <div>
686 <span class="text-large opensans-bold">@productHeatingPower</span>
687 <span class="text-small">@Translate("kW", "kW")</span>
688 </div>
689 </div>
690 </div>
691 <div class="specscolumn water-wrapper">
692 <div class="header-container">
693 <div class="text-small opensans-bold">@Translate("ProductInfoModal_WarmWater", "Warm water")</div>
694 <div class="text-small">@Translate("ProductInfoModal_WarmWaterPMin", "40� C in liter/min")</div>
695 </div>
696 <div class="details-container">
697 <div class="indicator indicator-small">
698 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/indicators/water-capacity.svg", assetsDirectory), "blue-svg, lighten-1")
699 </div>
700 <div class="text-large opensans-bold">@{ProductHelper.GetProductFieldValue<string>(selectedBoiler, StringConstants.ProductFieldValueSystemNames.TapWater40C);}</div>
701 <div>
702 <span class="text-large opensans-bold">@productWarmWater</span>
703 <span class="text-small">@Translate("liter", "Liter")</span>
704 </div>
705 </div>
706 </div>
707 @RenderSnippet("ActionLinks")
708 <div class="specscolumn last-item">
709 <a class="btn btn-brown hide-on-design-and-up quotation-button" href="@cartUrl" id="quotation-button-small">@Translate("Button_Send_Quotation_Small", "Quotation")</a>
710 <a class="btn btn-brown hide-on-design-and-down quotation-button" href="@cartUrl" id="quotation-button-large">@Translate("Button_Send_Quotation", "Send me a quotation")</a>
711 </div>
712 </div>
713 </div>
714 @if (!string.IsNullOrWhiteSpace(productImage))
715 {
716 <div class="col s4 hide-on-large-only mobile-image">
717 <img src="@productImage" />
718 </div>
719 }
720 <div class="col s8 hide-on-large-only">
721 @RenderSnippet("ActionLinks")
722 <div class="specscolumn last-item">
723 <a class="btn btn-brown quotation-button" href="@cartUrl" id="quotation-button-small-2">@Translate("Button_Send_Quotation_Small", "Quotation")</a>
724 </div>
725 </div>
726 </div>
727 </div>
728 <div class="col s12">
729 <h4>@subtitle.Replace("{currentBoiler}", boilerName)</h4>
730 </div>
731
732 <form method="POST" action="@StringConstants.ApplicationVariables.AssembleControllerName/@nameof(Warmgarant.Shop.Application.Controllers.AssembleController.HandleOrder)" class="assembly">
733
734 @* AREA ID *@
735 <input type="hidden"
736 id="areaid-@areaId"
737 name="areaid"
738 value="@areaId" />
739
740 @* ORDER TYPE *@
741 <input type="hidden"
742 id="ordertype-@orderType"
743 name="ordertype"
744 value="@orderType" />
745
746 @* BASE PRODUCT *@
747 <input type="hidden"
748 id="base-@product.Id"
749 name="baseProductId"
750 value="@product.Id" />
751
752 @* BASE PRODUCT TYPE *@
753 <input type="hidden"
754 id="basetype-@ProductType.Boiler"
755 name="baseProductType"
756 value="@ProductType.Boiler" />
757
758 @* THERMOSTAT *@
759 @if (thermostatOptions != null && thermostatOptions.Any())
760 {
761 <div class="col s12 thermostats">
762 <div class="row">
763 <div class="col">
764 <h5>
765 @thermostatTitle
766 <span class="pictogram info-btn" id="thermostat-choose-infobtn">
767 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/information.svg", assetsDirectory), title: Translate("MoreInformation", "More information").JsEncode())
768 </span>
769 </h5>
770 </div>
771 <div class="col">@thermostatIntro</div>
772 <div class="option-selector-container col s12" id="opt-container1">
773 <div class="row">
774
775 @for (int i = 0; i < thermostatOptions.Count; i++)
776 {
777 var thermostatOption = thermostatOptions[i];
778
779 var thermostatProductId = thermostatOption.Id;
780 var thermostat = ProductHelper.CreateProductName(thermostatOption.Name, thermostatOption.Manufacturer);
781 ProductHelper.ClearProductPriceCache(thermostatOption);
782 var thermostatPriceRaw = ProductHelper.GetProductPrice(thermostatOption).Price;
783 var thermostatPrice = Math.Abs(thermostatPriceRaw).WarmgarantMoneyFormat(true, false, true); // no negative prices, add discount or rent credit prefixes, show free text when 0
784 if (thermostatPriceRaw < 0)
785 {
786 var prefix = orderType.Equals(OrderType.Buy) ? Translate("Discount") : Translate("RentCredit");
787 thermostatPrice = string.Format("<span class=\"price-prefix\">{0}:</span> {1}", prefix, thermostatPrice);
788 }
789 var thermostatImage = thermostatOption.ImageSmall;
790 var defaultSelected = i == 0;
791
792 <div class="col s12 m6">
793 <label class="option-panel horizontal large @(defaultSelected ? "selected" : "")"
794 for="thermostat-@thermostatProductId"
795 data-value="@thermostatProductId"
796 data-productid="@thermostatProductId"
797 data-productType="@ProductType.Thermostat"
798 data-receipt="@string.Concat( TranslationHelper.Translate("Thermostat", areaId), ": ", thermostat)"
799 data-receipt-price="@ProductHelper.GetProductPrice(thermostatProductId, null).Price">
800
801 <input type="radio"
802 id="thermostat-@thermostatProductId"
803 name="thermostatOptionProductId"
804 value="@thermostatProductId"
805 class="radio-hidden"
806 @(defaultSelected ? "checked" : "") />
807
808 <div class="left-column">
809 @if (!string.IsNullOrWhiteSpace(thermostatImage))
810 {
811 thermostatImage = string.Format("/Files{0}", thermostatImage);
812 <img src="@thermostatImage" alt="@Translate("Thermostat", "Thermostat").JsEncode(): @thermostat.JsEncode()" />
813 }
814 </div>
815 <div class="right-column">
816 <div class="text">@thermostat</div>
817 <div class="price opensans-bold">@thermostatPrice</div>
818 </div>
819 </label>
820 </div>
821
822 }
823 </div>
824 </div>
825 </div>
826 </div>
827 }
828
829 @* FLOOR HEATING *@
830 @if (floorheatingOptions != null && floorheatingOptions.Any())
831 {
832 <div class="col s12 floor heating">
833 <div class="row">
834 <div class="col">
835 <h5>
836 @floorHeatingTitle
837 @if (!string.IsNullOrWhiteSpace(floorHeatingExtraInfo))
838 {
839 <span class="pictogram info-btn" id="floorheating-infobtn">
840 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/information.svg", assetsDirectory), title: Translate("MoreInformation", "More information").JsEncode())
841 </span>
842 }
843 else
844 {
845 @SvgHelper.CreateInfoIcon(floorHeatingInfo, Translate("Information", "Information"), assetPath: assetsDirectory)
846 }
847
848 </h5>
849 </div>
850 <div class="col s12">
851 @floorHeatingIntro
852 </div>
853 <div class="col s12 option-selector-container" id="opt-container2">
854 <div class="row">
855 @for (int i = 0; i < floorheatingOptions.Count; i++)
856 {
857 var floorheatingOption = floorheatingOptions[i];
858
859 var floorHeatingProductId = floorheatingOption.Id;
860 var floorHeating = ProductHelper.CreateProductName(floorheatingOption.Name, floorheatingOption.Manufacturer);
861 ProductHelper.ClearProductPriceCache(floorheatingOption);
862 var floorHeatingPriceRaw = ProductHelper.GetProductPrice(floorheatingOption).Price;
863 var floorHeatingPrice = floorHeatingPriceRaw.WarmgarantMoneyFormat(true, false);
864 var floorHeatingImage = floorheatingOption.ImageSmall;
865
866 var defaultSelected = i == 0;
867
868 <div class="col s12 m6">
869 <label class="option-panel horizontal large @(defaultSelected ? "selected" : "")"
870 for="floorHeating-@floorHeatingProductId"
871 data-value="boiler1"
872 data-productid="@floorHeatingProductId"
873 data-productType="@ProductType.FloorHeatingSet"
874 data-receipt="@TranslationHelper.Translate("FloorHeatingSet", areaId)"
875 data-receipt-price="@ProductHelper.GetProductPrice(floorHeatingProductId, null).Price"
876 data-show-receipt-when-zero="false">
877 @* TODO: Returns Ja or Nee instead of "Vloerverwarmingset" when selecting Ja, only visible in receipt when Ja is selected *@
878
879 <input type="radio"
880 id="floorHeating-@floorHeatingProductId"
881 name="floorHeatingOptionProductId"
882 value="@floorHeatingProductId"
883 class="radio-hidden"
884 @(defaultSelected ? "checked" : "") />
885
886 <div class="left-column">
887 @floorHeating
888 </div>
889 <div class="right-column">
890 <div class="text">
891 @Translate(string.Format("FloorHeatingButtonText_{0}", floorHeating), @floorHeating)
892 </div>
893
894 @if (floorHeatingPriceRaw > 0)
895 {
896 <div class="price opensans-bold">@floorHeatingPrice</div>
897 }
898 </div>
899 </label>
900 </div>
901 }
902 </div>
903 </div>
904 </div>
905 </div>
906 }
907
908 @* AIR/DIRST SEPERATOR *@
909 @if (airDirtSeparatorOptions != null && airDirtSeparatorOptions.Any())
910 {
911 <div class="col s12 airdirtseparator">
912 <div class="row">
913 <div class="col">
914 <h5 class="optiontitle">
915 @airDirtSeparatorTitle
916 @if (!string.IsNullOrWhiteSpace(airDirtSeparatorExtraInfo))
917 {
918 <span class="pictogram info-btn valign-wrapper" id="airdirtseparator-infobtn">
919 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/information.svg", assetsDirectory), title: Translate("MoreInformation", "More information").JsEncode())
920 </span>
921 }
922 else
923 {
924 @SvgHelper.CreateInfoIcon(airDirtSeparatorInfo, Translate("Information", "Information"), assetPath: assetsDirectory)
925 }
926 </h5>
927 </div>
928 <div class="col s12">
929 @airDirtSeparatorIntro
930 </div>
931 <div class="col s12 option-selector-container" id="opt-container3">
932 <div class="row">
933 @for (int i = 0; i < airDirtSeparatorOptions.Count; i++)
934 {
935 var airDirtSeparatorOption = airDirtSeparatorOptions[i];
936 var isAirDirtProduct = airDirtSeparatorOption.Number.StartsWith(StringConstants.ProductSystemNames.AirDirtSeparator);
937
938 var airDirtSeparatorProductId = airDirtSeparatorOption.Id;
939 var airDirtSeparator = airDirtSeparatorOption.Name;
940 ProductHelper.ClearProductPriceCache(airDirtSeparatorOption);
941 var airDirtSeparatorPriceRaw = ProductHelper.GetProductPrice(airDirtSeparatorOption).Price;
942 var airDirtSeparatorPrice = airDirtSeparatorPriceRaw.WarmgarantMoneyFormat(true, false, true);
943 var airDirtSeparatorImage = string.Format("/Files/Templates/Designs/Warmgarant/Images/icons/Spirotech-{0}.png", airDirtSeparator.ToLower());
944
945 var defaultSelected = i == 0;
946
947 <div class="col s12 m6">
948 <label class="option-panel horizontal large @(defaultSelected ? "selected" : "")"
949 for="airDirtSeparator-@airDirtSeparatorProductId"
950 data-value="boiler1"
951 data-productid="@airDirtSeparatorProductId"
952 data-productType="@ProductType.AirDirtSeparator"
953 data-receipt="@TranslationHelper.Translate("AirDirtSeparator", areaId)"
954 data-receipt-price="@ProductHelper.GetProductPrice(airDirtSeparatorProductId, null).Price"
955 data-show-receipt-when-zero="@isAirDirtProduct.ToString().ToLower()">
956
957 <input type="radio"
958 id="airDirtSeparator-@airDirtSeparatorProductId"
959 name="airDirtSeparatorOptionProductId"
960 value="@airDirtSeparatorProductId"
961 class="radio-hidden"
962 @(defaultSelected ? "checked" : "") />
963
964 <div class="left-column">
965 <img src="@airDirtSeparatorImage" />
966 </div>
967
968 <div class="right-column">
969 <div class="text">
970 @Translate(string.Format("AirDirtSeparatorButtonText_{0}", airDirtSeparator), airDirtSeparator)
971 </div>
972
973 @if (isAirDirtProduct)
974 {
975 <div class="price opensans-bold">@airDirtSeparatorPrice</div>
976 }
977 </div>
978 </label>
979 </div>
980 }
981 </div>
982 </div>
983 </div>
984 </div>
985 }
986
987 @* SERIVCE SUBSCRIPTION *@
988 @if (serviceSubscriptionOptions != null && serviceSubscriptionOptions.Any())
989 {
990 <div class="col s12 service-subscription">
991 <div class="row">
992 <div class="col s12">
993 <h5>
994 @serviceSubscriptionTitle
995 @if (!string.IsNullOrWhiteSpace(serviceSubscriptionInfo))
996 {
997 <span class="pictogram info-btn" id="service-subscription-infobtn">
998 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/information.svg", assetsDirectory), title: Translate("MoreInformation", "More information").JsEncode())
999 </span>
1000 }
1001 </h5>
1002 </div>
1003 <div class="col s12">
1004 @serviceSubscriptionIntro
1005 </div>
1006 <div class="col s12 option-selector-container" id="opt-container4">
1007 <div class="row">
1008 <div class="col s12 m6">
1009 @for (int i = 0; i < serviceSubscriptionOptions.Count; i++)
1010 {
1011 var serviceSubscriptionOption = serviceSubscriptionOptions[i];
1012
1013 var serviceSubscriptionProductId = serviceSubscriptionOption.Id;
1014 var serviceSubscription = serviceSubscriptionOption.Name;
1015 var serviceSubscriptionBreak = "";
1016 int index = serviceSubscription.IndexOf(" (");
1017 if (index > 0)
1018 {
1019 serviceSubscriptionBreak = serviceSubscription.Insert(index - 1 + " (".Length, "<br />");
1020 }
1021 else
1022 {
1023 serviceSubscriptionBreak = serviceSubscription;
1024 }
1025 ProductHelper.ClearProductPriceCache(serviceSubscriptionOption);
1026 var serviceSubscriptionPriceRaw = ProductHelper.GetProductPrice(serviceSubscriptionOption).Price;
1027 var serviceSubscriptionPrice = serviceSubscriptionPriceRaw.WarmgarantMoneyFormat(true, false);
1028 serviceSubscriptionImage = string.Format("{0}images/svg/pictograms/service-subscription.svg", assetsDirectory);
1029
1030 var defaultSelected = i == 0;
1031
1032 <label class="option-panel horizontal large @(defaultSelected ? "selected" : "")"
1033 for="serviceSubscription-@serviceSubscriptionProductId"
1034 data-value="boiler1"
1035 data-productid="@serviceSubscriptionProductId"
1036 data-productType="@ProductType.ServiceSubscription"
1037 data-receipt="@serviceSubscription"
1038 data-receipt-price="@ProductHelper.GetProductPrice(serviceSubscriptionProductId, null).Price"
1039 data-is-service="true">
1040
1041 <input type="radio"
1042 id="serviceSubscription-@serviceSubscriptionProductId"
1043 name="serviceSubscriptionOptionProductId"
1044 value="@serviceSubscriptionProductId"
1045 class="radio-hidden"
1046 data-price="@ProductHelper.GetProductPrice(serviceSubscriptionProductId, null).Price"
1047 @(defaultSelected ? "checked" : "") />
1048
1049 <div class="left-column">
1050 @SvgHelper.GetSvgContent(serviceSubscriptionImage, "brown-svg")
1051 </div>
1052
1053 <div class="right-column">
1054 <div class="text">@serviceSubscriptionBreak</div>
1055
1056 @if (serviceSubscriptionPriceRaw > 0)
1057 {
1058 <div class="price opensans-bold">@serviceSubscriptionPrice</div>
1059 }
1060 </div>
1061 </label>
1062
1063 }
1064 </div>
1065 </div>
1066 </div>
1067 </div>
1068 </div>
1069 }
1070
1071 @* INSTALLATIONS *@
1072 @if (serviceSubscriptionOptions != null && serviceSubscriptionOptions.Any())
1073 {
1074 <div class="col s12 installation">
1075 <div class="row">
1076 <div class="col s12">
1077 <h5>
1078 @installationTitle
1079 @if (!string.IsNullOrWhiteSpace(installationExtraInfo))
1080 {
1081 <span class="pictogram info-btn" id="installation-infobtn">
1082 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/information.svg", assetsDirectory), title: Translate("MoreInformation", "More information").JsEncode())
1083 </span>
1084 }
1085 else
1086 {
1087 @SvgHelper.CreateInfoIcon(installationInfo, Translate("Information", "Information"), assetPath: assetsDirectory)
1088 }
1089 </h5>
1090 </div>
1091 <div class="col s12">
1092 @installationIntro
1093 </div>
1094 <div class="col s12 option-selector-container" id="opt-container5">
1095 <div class="row">
1096 @for (int i = 0; i < installationOptions.Count; i++)
1097 {
1098 var installation = installationOptions[i];
1099
1100 ProductHelper.ClearProductPriceCache(installation);
1101 var installationPriceRaw = ProductHelper.GetProductPrice(installation).Price;
1102 var installationPrice = installationPriceRaw.WarmgarantMoneyFormat(true, false);
1103 installationImage = string.Format("{0}images/svg/pictograms/install.svg", assetsDirectory);
1104
1105 var defaultSelected = i == 0;
1106
1107 <div class="col s12 m6">
1108 <label class="option-panel horizontal large @(defaultSelected ? "selected" : "")"
1109 for="installation-@installation.Id"
1110 data-value="boiler1"
1111 data-productid="@installation.Id"
1112 data-productType="@ProductType.Installation"
1113 data-receipt="@installation.Name"
1114 data-receipt-price="@ProductHelper.GetProductPrice(installation.Id, null).Price"
1115 data-position="0">
1116
1117 <input type="radio"
1118 id="installation-@installation.Id"
1119 name="installationOptionProductId"
1120 value="@installation.Id"
1121 class="radio-hidden"
1122 @(defaultSelected ? "checked" : "") />
1123
1124 <div class="left-column">
1125 @SvgHelper.GetSvgContent(installationImage, "brown-svg")
1126 </div>
1127
1128 <div class="right-column">
1129 <div class="text">@installation.Name</div>
1130
1131 @if (installationPriceRaw > 0)
1132 {
1133 <div class="price opensans-bold">@installationPrice</div>
1134 }
1135 </div>
1136 </label>
1137 </div>
1138
1139 }
1140 </div>
1141 </div>
1142 </div>
1143 </div>
1144 }
1145
1146 @* TERMS AND SUBMIT *@
1147 <div class="col s12">
1148 <h5>@disclaimerTitle</h5>
1149 @disclaimerText
1150
1151 <label class="checkbox" id="terms-agree">
1152 <input type="checkbox" name="agree-terms" id="agree-terms" required="required" style="display: none;" />
1153
1154 @Translate("AssemblyDisclaimerAgreeTermsText", "Ik begrijp het en ga akkoord")
1155 </label>
1156
1157 <p> </p>
1158
1159 <button type="submit" class="btn btn-orange disabled-link" id="orderlink">@Translate("OrderThisBoiler", "Order this boiler")</button>
1160
1161 </div>
1162 </form>
1163
1164 // MODAL THERMOSTATS
1165 if (thermostatOptions != null && thermostatOptions.Any())
1166 {
1167 <div id="ThermostatsModal" class="modal modal-large slider-modal">
1168 <div class="modal-header">
1169 <h3>@Translate("ThermostatsModalHeader", "Compare thermostats")</h3>
1170 <div class="modal-icon hide-on-small-only">
1171 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/information.svg", assetsDirectory))
1172 </div>
1173 <div class="modal-action modal-close">
1174 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/pictograms/x-close.svg", assetsDirectory), classNames: "brown-svg darken-3", title: Translate("Close", "Close").JsEncode())
1175 </div>
1176 </div>
1177 <div class="modal-content">
1178 <div class="slider-control slider-control-left">
1179 <div class="slider-control-wrapper">
1180 <div class="slider-arrow waves-effect">
1181 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/arrow.svg", assetsDirectory), classNames: "general-svg", title: "Slider Control Left")
1182 </div>
1183 </div>
1184 </div>
1185 <div class="slider-container">
1186 @foreach (var thermostatOption in thermostatOptions)
1187 {
1188 var thermostatProductId = thermostatOption.Id;
1189 var thermostat = ProductHelper.CreateProductName(thermostatOption.Name, thermostatOption.Manufacturer);
1190 ProductHelper.ClearProductPriceCache(thermostatOption);
1191 var thermostatPriceRaw = ProductHelper.GetProductPrice(thermostatOption).Price;
1192 var thermostatPrice = thermostatPriceRaw.WarmgarantMoneyFormat(false, false, true, true);
1193 var thermostatPriceColorClass = thermostatPriceRaw > 0 ? "orange-gradient" : "green-gradient";
1194 var thermostatImage = thermostatOption.ImageSmall;
1195 var thermostatMobileDescription = thermostatOption.ShortDescription;
1196 var thermostatDescription = thermostatOption.LongDescription;
1197
1198 <div class="slider-slide" data-productid="@thermostatProductId" data-productType="@ProductType.Thermostat" style="height: 100%">
1199 <div class="slider-content">
1200 <div class="content-header">
1201 <div class="action-circle medium @thermostatPriceColorClass">
1202 <div class="action-container">
1203 <span>@thermostatPrice</span>
1204 </div>
1205 </div>
1206 @if (!string.IsNullOrWhiteSpace(thermostatImage))
1207 {
1208 thermostatImage = string.Format("/Files{0}", thermostatImage);
1209 <img src="@thermostatImage"
1210 alt="@Translate("Thermostat", "Thermostat").JsEncode(): @thermostat.JsEncode()" />
1211 }
1212 </div>
1213 <div class="content-description ul-list rich-text-editor-content text-small hide-on-large-only">@thermostatMobileDescription</div>
1214 <div class="content-description ul-list rich-text-editor-content text-small hide-on-med-and-down">@thermostatDescription</div>
1215 <div class="choose-button">
1216 <button class="btn btn-orange" onclick="selectThermostatOption('@thermostatProductId')">@Translate("Choose", "Kies")</button>
1217 </div>
1218 </div>
1219 </div>
1220 }
1221 </div>
1222 <div class="slider-control slider-control-right">
1223 <div class="slider-control-wrapper">
1224 <div class="slider-arrow waves-effect">
1225 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/arrow.svg", assetsDirectory), classNames: "general-svg", title: "Slider Control Right")
1226 </div>
1227 </div>
1228 </div>
1229 </div>
1230 </div>
1231 }
1232
1233 // MODAL FLOOR HEATING
1234 if (!string.IsNullOrWhiteSpace(floorHeatingExtraInfo))
1235 {
1236 <div id="FloorHeatingInfoModal" class="modal modal-small icon-modal floorheating-detail">
1237 <div class="modal-header">
1238 <h3>@Translate("FloorHeatingInfoModalHeader", "Floor heating info")</h3>
1239 <div class="modal-icon hide-on-small-only">
1240 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/information.svg", assetsDirectory))
1241 </div>
1242 <div class="modal-action modal-close">
1243 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/pictograms/x-close.svg", assetsDirectory), classNames: "brown-svg darken-3", title: Translate("Close", "Close").JsEncode())
1244 </div>
1245 </div>
1246 <div class="modal-content rich-text-editor-content">
1247 @floorHeatingExtraInfo
1248 </div>
1249 </div>
1250 }
1251
1252 // MODAL Air/Dirt separator
1253 if (!string.IsNullOrWhiteSpace(airDirtSeparatorExtraInfo))
1254 {
1255 <div id="AirDirtSeparatorInfoModal" class="modal modal-medium icon-modal airdirtseparator-detail">
1256 <div class="modal-header">
1257 <h3>@Translate("AirDirtSeparatorModalHeader", "Air/dirt separator info")</h3>
1258 <div class="modal-icon hide-on-small-only">
1259 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/information.svg", assetsDirectory))
1260 </div>
1261 <div class="modal-action modal-close">
1262 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/pictograms/x-close.svg", assetsDirectory), classNames: "brown-svg darken-3", title: Translate("Close", "Close").JsEncode())
1263 </div>
1264 </div>
1265 <div class="modal-content rich-text-editor-content">
1266 @airDirtSeparatorExtraInfo
1267 </div>
1268 </div>
1269 }
1270
1271 // MODAL SERVICE SUBSCRIPTION
1272 if (!string.IsNullOrWhiteSpace(serviceSubscriptionInfo))
1273 {
1274 <div id="ServiceSubscriptionModal" class="modal modal-small icon-modal service-subscription-detail">
1275 <div class="modal-header">
1276 <h3>@Translate("ServiceSubscriptionModalHeader", "Service subscription")</h3>
1277 <div class="modal-icon hide-on-small-only">
1278 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/information.svg", assetsDirectory))
1279 </div>
1280 <div class="modal-action modal-close">
1281 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/pictograms/x-close.svg", assetsDirectory), classNames: "brown-svg darken-3", title: Translate("Close", "Close").JsEncode())
1282 </div>
1283 </div>
1284 <div class="modal-content rich-text-editor-content">
1285 @if (!string.IsNullOrWhiteSpace(serviceSubscriptionImage))
1286 {
1287 <span class="pictogram pictogram-medium modal-intro-icon">
1288 @SvgHelper.GetSvgContent(serviceSubscriptionImage, "brown-svg")
1289 </span>
1290 <br />
1291 }
1292 @serviceSubscriptionInfo
1293 </div>
1294 </div>
1295 }
1296
1297 // MODAL INSTALLATION INFO
1298 if (!string.IsNullOrWhiteSpace(installationExtraInfo))
1299 {
1300 <div id="InstallationInfoModal" class="modal modal-small icon-modal installation-detail">
1301 <div class="modal-header">
1302 <h3>@Translate("InstallationInfoModalHeader", "Installation info")</h3>
1303 <div class="modal-icon hide-on-small-only">
1304 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/information.svg", assetsDirectory))
1305 </div>
1306 <div class="modal-action modal-close">
1307 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/pictograms/x-close.svg", assetsDirectory), classNames: "brown-svg darken-3", title: Translate("Close", "Close").JsEncode())
1308 </div>
1309 </div>
1310 <div class="modal-content rich-text-editor-content">
1311 @if (!string.IsNullOrWhiteSpace(installationImage))
1312 {
1313 <span class="pictogram pictogram-medium modal-intro-icon">
1314 @SvgHelper.GetSvgContent(installationImage, "brown-svg")
1315 </span>
1316 <br />
1317 }
1318 @installationExtraInfo
1319 </div>
1320 </div>
1321 }
1322
1323 // MODAL MORE INFO
1324 if (!string.IsNullOrWhiteSpace(productLongDescription) && productLongDescription.Length > 10)
1325 {
1326 <div id="MoreInfoModal" class="modal modal-large icon-modal more-info">
1327 <div class="modal-header">
1328 <h3>@Translate("MoreInformation", "More info")</h3>
1329 <div class="modal-icon hide-on-small-only">
1330 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/information.svg", assetsDirectory))
1331 </div>
1332 <div class="modal-action modal-close">
1333 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/pictograms/x-close.svg", assetsDirectory), classNames: "brown-svg darken-3", title: Translate("Close", "Close").JsEncode())
1334 </div>
1335 </div>
1336 <div class="modal-content rich-text-editor-content">
1337 @productLongDescription
1338 </div>
1339 </div>
1340 }
1341
1342 // TECH SPECS FOR DESKTOP
1343 <div id="TechSpecsModalDesktop" class="modal modal-medium modal-techspecs more-info hide-on-small-and-down">
1344 @RenderSnippet("TechnicalSpecsModalContent")
1345 </div>
1346
1347 // TECH SPECS FOR MOBILE
1348 <div id="TechSpecsModalMobile" class="modal modal-large modal-techspecs more-info hide-on-med-and-up">
1349 @RenderSnippet("TechnicalSpecsModalContent")
1350 </div>
1351
1352 @SnippetStart("TechnicalSpecsModalContent")
1353 <div class="modal-header">
1354 <h3>@boilerName</h3>
1355 <div class="modal-action modal-close">
1356 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/pictograms/x-close.svg", assetsDirectory), classNames: "brown-svg darken-3", title: Translate("Close", "Close").JsEncode())
1357 </div>
1358 </div>
1359 <div class="modal-content">
1360 @{
1361 var groupId = ProductHelper.GetProductPrimaryGroupId(selectedBoiler);
1362 var group = Dynamicweb.Ecommerce.Services.ProductGroups.GetGroup(groupId);
1363 var groupSubtitle = ProductHelper.GetGroupSubtitle(group);
1364 int powerLabel = ProductHelper.GetProductFieldValue<int>(selectedBoiler, StringConstants.ProductFieldValueSystemNames.PowerLabel);
1365 string tapWater40C = ProductHelper.GetSingleOrNoDecimalValueFromDoubleAsString(ProductHelper.GetProductFieldValue<double>(selectedBoiler, StringConstants.ProductFieldValueSystemNames.TapWater40C));
1366 var energyLabel = ProductHelper.GetProductFieldValue<string>(selectedBoiler, StringConstants.ProductFieldValueSystemNames.EnergyLabel);
1367 energyLabel = energyLabel.JsEncode();
1368 var powerFrom = ProductHelper.GetProductFieldValue<string>(selectedBoiler, StringConstants.ProductFieldValueSystemNames.PowerFrom);
1369 var powerTo = ProductHelper.GetProductFieldValue<string>(selectedBoiler, StringConstants.ProductFieldValueSystemNames.PowerTo);
1370 var usageEfficiencyHeating = ProductHelper.GetProductFieldValue<string>(selectedBoiler, StringConstants.ProductFieldValueSystemNames.UsageEfficiencyHeating);
1371 var usageEfficiencyHotWater = ProductHelper.GetProductFieldValue<string>(selectedBoiler, StringConstants.ProductFieldValueSystemNames.UsageEfficiencyHotWater);
1372 var generationEfficiency = ProductHelper.GetProductFieldValue<string>(selectedBoiler, StringConstants.ProductFieldValueSystemNames.GenerationEfficiency);
1373 var yearTapEfficiency = ProductHelper.GetProductFieldValue<string>(selectedBoiler, StringConstants.ProductFieldValueSystemNames.YearTapEfficiency);
1374 string tapDamper = ProductHelper.GetSingleOrNoDecimalValueFromDoubleAsString(ProductHelper.GetProductFieldValue<double>(selectedBoiler, StringConstants.ProductFieldValueSystemNames.TapDamper));
1375 string tapWater60C = ProductHelper.GetSingleOrNoDecimalValueFromDoubleAsString(ProductHelper.GetProductFieldValue<double>(selectedBoiler, StringConstants.ProductFieldValueSystemNames.TapWater60C));
1376 var height = ProductHelper.GetProductFieldValue<string>(selectedBoiler, StringConstants.ProductFieldValueSystemNames.Height);
1377 var width = ProductHelper.GetProductFieldValue<string>(selectedBoiler, StringConstants.ProductFieldValueSystemNames.Width);
1378 var depth = ProductHelper.GetProductFieldValue<string>(selectedBoiler, StringConstants.ProductFieldValueSystemNames.Depth);
1379 var weight = selectedBoiler.Weight.ToString();
1380 var prosAndCons = "";
1381 var pos1 = StringConstants.ProductFieldValueSystemNames.ComparePositive1;
1382 var neg1 = StringConstants.ProductFieldValueSystemNames.CompareNegative1;
1383 for (var i = 1; i < 4; i++)
1384 {
1385 var systemName = pos1.Replace("1", i.ToString());
1386 var positive = ProductHelper.GetProductFieldValue<string>(selectedBoiler, systemName);
1387 if (!string.IsNullOrWhiteSpace(positive))
1388 {
1389 prosAndCons += string.Format("<div class=\"valign-wrapper plus-minus\"><i class=\"mdi mdi-plus\"></i>{0}</div>", positive);
1390 }
1391 }
1392 for (var i = 1; i < 4; i++)
1393 {
1394 var systemName = neg1.Replace("1", i.ToString());
1395 var negative = ProductHelper.GetProductFieldValue<string>(selectedBoiler, systemName);
1396 if (!string.IsNullOrWhiteSpace(negative))
1397 {
1398 prosAndCons += string.Format("<div class=\"valign-wrapper plus-minus\"><i class=\"mdi mdi-minus\"></i>{0}</div>", negative);
1399 }
1400 }
1401
1402 @*SPECIFICATIES*@
1403 @ProductHelper.CreateTechSpecTableRow(Translate("Specifications", "Specifications"), "", "", true)
1404 <div class="row">
1405 <div class="col s7 table-label">
1406 @Translate("ProductInfoModal_HeatingPower", "Vermogen verwarming")
1407 </div>
1408 <div class="col s5 table-value">
1409 <div class="indicator-icon-text">
1410 <div class="indicator indicator-small">
1411 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/indicators/heating-capacity.svg", assetsDirectory), "brown-svg darken-3", title: "Heating Capacity Small")
1412 </div>
1413 <span class="indicator-text">
1414 @powerLabel <span class="unit">@Translate("kW", "kW")</span>
1415 </span>
1416 </div>
1417 </div>
1418 </div>
1419 <div class="row">
1420 <div class="col s7 table-label">
1421 @Translate("ProductInfoModal_WarmWater", "Warm water")
1422 </div>
1423 <div class="col s5 table-value">
1424 <div class="indicator-icon-text">
1425 <div class="indicator indicator-small">
1426 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/indicators/water-capacity.svg", assetsDirectory), "brown-svg darken-3", title: "Water Capacity Small")
1427 </div>
1428 <span class="indicator-text">
1429 @tapWater40C <span class="unit">@Translate("liter", "liter")</span>
1430 </span>
1431 </div>
1432 </div>
1433 </div>
1434 <div class="row">
1435 <div class="col s7 table-label">
1436 @Translate("ProductInfoModal_CwValue", "CW Waarde")
1437 </div>
1438 <div class="col s5 table-value">
1439 <div class="indicator-icon-text">
1440 <div class="pictogram pictogram-small">
1441 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/pictograms/shower-cw-{1}.svg", assetsDirectory, group.Number), "brown-svg darken-3", title: group.Name.JsEncode())
1442 </div>
1443 <span class="indicator-text top">
1444 @group.Name <span class="comfort-group-text">@groupSubtitle</span>
1445 </span>
1446 </div>
1447 </div>
1448 </div>
1449 <div class="row">
1450 <div class="col s7 table-label">
1451 @Translate("ProductInfoModal_EnergyLabel", "Energielabel")
1452 </div>
1453 <div class="col s5 table-value">
1454 <div class="energy-label energy-label-small energy-label-@energyLabel.ToLower()">
1455 <span>@energyLabel.ToUpper()</span>
1456 </div>
1457 </div>
1458 </div>
1459 if (!string.IsNullOrWhiteSpace(prosAndCons))
1460 {
1461 <div class="row">
1462 <div class="col s12 table-label">
1463 @Translate("ProsAndCons", "Plus- en minpunten")
1464 </div>
1465 <div class="col s12 table-value">@prosAndCons</div>
1466 </div>
1467 }
1468 @*PRESTATIES *@
1469 @ProductHelper.CreateTechSpecTableRow(Translate("Performance", "Performance"), "", "", true)
1470 @ProductHelper.CreateTechSpecTableRow(Translate("NormalPower", "Normaal vermogen bij 80/60"), string.Format("{0} - {1}", powerFrom, powerTo), Translate("kW", "kW"))
1471 @ProductHelper.CreateTechSpecTableRow(Translate("UsageEfficiencyHeating", "Using efficiency heating"), usageEfficiencyHeating, "%")
1472 if (!string.IsNullOrEmpty(usageEfficiencyHotWater) && usageEfficiencyHotWater != "0")
1473 {
1474 @ProductHelper.CreateTechSpecTableRow(Translate("UsageEfficiencyHotWater", "Using efficiency warm water"), usageEfficiencyHotWater, "%")
1475 }
1476 else
1477 {
1478 @ProductHelper.CreateTechSpecTableRow(Translate("UsageEfficiencyHotWater", "Using efficiency warm water"), "-")
1479 }
1480 @ProductHelper.CreateTechSpecTableRow(Translate("GenerationEfficiency", "Generic efficiency EPN"), generationEfficiency)
1481 @ProductHelper.CreateTechSpecTableRow(Translate("YearTapEfficiency", "Year tap efficiency EPN"), yearTapEfficiency, "Hs")
1482 @ProductHelper.CreateTechSpecTableRow(Translate("TapThreshold", "Tapdrempel"), tapDamper, Translate("ltr_min", "ltr/min"))
1483 @ProductHelper.CreateTechSpecTableRow(Translate("TapWater60C", "Tapwater60° C"), tapWater60C, Translate("ltr_min", "ltr/min"))
1484 @ProductHelper.CreateTechSpecTableRow(Translate("TapWater40C", "Tapwater40° C"), tapWater40C, Translate("ltr_min", "ltr/min"))
1485 @*AFMETINGEN *@
1486 @ProductHelper.CreateTechSpecTableRow(Translate("Dimensions", "Dimensions"), "", "", true)
1487 @ProductHelper.CreateTechSpecTableRow(Translate("HeightWidthDepth", "height x width x depth"), string.Format("{0} x {1} x {2}", height, width, depth), "mm")
1488 @ProductHelper.CreateTechSpecTableRow(Translate("Weight", "Weight"), weight, "kg")
1489 @*OMSCHRIJVING *@
1490 if (!string.IsNullOrWhiteSpace(selectedBoiler.ShortDescription))
1491 {
1492 @ProductHelper.CreateTechSpecTableRow(Translate("Description", "Description"), "", "", true)
1493 <div class="row">
1494 <div class="col s12 rich-text-editor-content">
1495 @selectedBoiler.ShortDescription
1496 </div>
1497 </div>
1498 }
1499 }
1500 </div>
1501 @SnippetEnd("TechnicalSpecsModalContent")
1502 }
1503 }
1504 </div>
1505 </div>
1506 <div class="col s10 l4 push-s1">
1507 <div id="receipt">
1508 @* receipt table *@
1509 <table id="order-receipt">
1510 <caption>@TranslationHelper.Translate($"ReceiptTitle_{orderType}", areaId)</caption>
1511 <tbody id="receipt-body">
1512 @* filled using javascript *@
1513 </tbody>
1514 </table>
1515 @* /receipt table *@
1516 </div>
1517 </div>
1518 </div>
1519 </div>
1520 </div>
1521
1522 }
1523 @if (quotationParagraphId > 0)
1524 {
1525 <div id="QuotationRequestModal" class="modal modal-large quotation-request-modal">
1526 <div class="modal-header">
1527 <h3>@Translate("QuotationRequests_Modal_Header", "Quotation request")</h3>
1528 <div class="modal-action modal-close">
1529 @SvgHelper.GetSvgContent(string.Format("{0}images/svg/pictograms/x-close.svg", assetsDirectory), classNames: "brown-svg darken-3", title: Translate("Close", "Close").JsEncode())
1530 </div>
1531 </div>
1532 <div class="modal-content rich-text-editor-content">
1533 @RenderParagraphContent(quotationParagraphId)
1534 </div>
1535 </div>
1536 }
1537 </div>
1538
1539 @SnippetStart("ActionLinks")
1540 <div class="specscolumn ul-list ul-list-arrow-orange orange-wg-text">
1541 <ul>
1542 @if (string.IsNullOrWhiteSpace(productLongDescription) || productLongDescription.Length > 10)
1543 {
1544 <li><a href="#" class="more-infobtn">@Translate("MoreInformation", "More info")</a></li>
1545 }
1546 @if (!string.IsNullOrWhiteSpace(techSpecsPageUrl))
1547 {
1548 <li class="hide-on-small-and-down"><a href="#" class="techspecs-desktop">@Translate("TechnicalSpecifications", "Technical specs")</a></li>
1549 <li class="hide-on-med-and-up"><a href="#" class="techspecs-mobile">@Translate("TechnicalSpecifications", "Technical specs")</a></li>
1550 }
1551 <li><a href="@Translate("KiyohUrl", "https://www.kiyoh.com/reviews/1047653/warmgarant_nl?from=widget&lang=nl")" target="_blank">@Translate("CustomerExperiences", "Klantervaringen")</a></li>
1552 </ul>
1553 </div>
1554 @SnippetEnd("ActionLinks")
1555
1556 <script>
1557 var orderType = '@orderType';
1558 @if (orderType == OrderType.Buy && serviceSubscriptionOptions != null)
1559 {
1560 <Text>
1561 var boilerProductId = '@boilerProductId';
1562 var productMonthlyCosts = '@productMonthlyCosts';
1563 var areaId = @areaId;
1564 </Text>
1565 }
1566 </script>
1567
1568 <script>
1569 // toggle tile logic
1570 document.querySelectorAll('.option-selector-container').forEach(container => {
1571 container.addEventListener('change', (e) => {
1572 if (e.target.matches('input[type="radio"]')) {
1573 const selectedInput = e.target;
1574
1575 container.querySelectorAll('label.option-panel').forEach(label => {
1576 label.classList.remove('selected');
1577 });
1578
1579 const selectedLabel = selectedInput.closest('label');
1580 if (selectedLabel) {
1581 selectedLabel.classList.add('selected');
1582 }
1583 }
1584 });
1585 });
1586
1587 function selectThermostatOption(matchingValue) {
1588 const radios = document.querySelectorAll('input[type="radio"][name="thermostatOptionProductId"]');
1589
1590 radios.forEach(radio => {
1591 const isMatch = radio.value === matchingValue;
1592
1593 if (isMatch && !radio.checked) {
1594 radio.checked = true;
1595
1596 // Manually dispatch the change event
1597 const event = new Event('change', { bubbles: true });
1598 radio.dispatchEvent(event);
1599 } else if (!isMatch) {
1600 radio.checked = false;
1601 }
1602
1603 const label = radio.closest('label');
1604 if (label) {
1605 label.classList.toggle('selected', isMatch);
1606 }
1607 });
1608 }
1609
1610 document.addEventListener('DOMContentLoaded', function () {
1611 @if (orderType == OrderType.Buy)
1612 {
1613 <Text>
1614 buildBuyReceipt();
1615 </Text>
1616 }
1617 else
1618 {
1619 <Text>
1620 buildRentReceipt();
1621 </Text>
1622 }
1623 });
1624
1625 document.addEventListener('change', function (event) {
1626 if (event.target.matches('input[type="radio"]')) {
1627 @if (orderType == OrderType.Buy)
1628 {
1629 <Text>
1630 buildBuyReceipt();
1631 </Text>
1632 }
1633 else
1634 {
1635 <Text>
1636 buildRentReceipt();
1637 </Text>
1638 }
1639 }
1640 });
1641
1642 function buildRentReceipt() {
1643 const receiptBody = document.getElementById('receipt-body');
1644
1645 // Clear any existing content first
1646 receiptBody.innerHTML = '';
1647
1648 const { products, totalPrice } = getSelectedProductsAndTotal();
1649
1650 if (products.length === 0) {
1651 return; // No products to display
1652 }
1653
1654 let total = 0;
1655
1656 // TranslationHelper.Translate("ReceiptSubTitleRent", areaId)
1657 const boilerRow = document.createElement('tr');
1658 const boilerCell = document.createElement('td');
1659 boilerCell.colSpan = 2;
1660 boilerCell.innerHTML = `<strong>@boilerName</strong>`;
1661 boilerRow.appendChild(boilerCell);
1662 receiptBody.appendChild(boilerRow);
1663
1664 const rentalPriceRow = document.createElement('tr');
1665
1666 const nameCell = document.createElement('td');
1667 nameCell.classList.add('box');
1668 nameCell.textContent = "@TranslationHelper.Translate("RentalPricePerMonth", areaId)";
1669 rentalPriceRow.appendChild(nameCell);
1670
1671 @{
1672 var rentalPriceField = product.ProductFieldValues.GetProductFieldValue(StringConstants.ProductFieldValueSystemNames.RentMonthlyCosts);
1673 if (rentalPriceField != null && rentalPriceField.HasValue)
1674 {
1675 <text>
1676 const priceCell = document.createElement('td');
1677 priceCell.classList.add('price', 'box');
1678 priceCell.textContent = formatPrice(@rentalPriceField.Value);
1679 rentalPriceRow.appendChild(priceCell);
1680 </text>
1681 }
1682 }
1683
1684 receiptBody.appendChild(rentalPriceRow);
1685
1686 // rental downpayment text
1687 const installationProduct = products.find(product => product.type === "installation");
1688 const isNegativeProductInstallation = installationProduct.price <= 0;
1689
1690 if (isNegativeProductInstallation) {
1691 const rentalDownpaymentRow = document.createElement('tr');
1692 const rentalDownpaymentCell = document.createElement('td');
1693 rentalDownpaymentCell.classList.add('rental-downpayment', 'box');
1694 rentalDownpaymentCell.colSpan = 2;
1695 rentalDownpaymentCell.innerHTML = '@TranslationHelper.Translate("RentalDownpaymentInfo", areaId)';
1696 rentalDownpaymentRow.appendChild(rentalDownpaymentCell);
1697 receiptBody.appendChild(rentalDownpaymentRow);
1698 }
1699
1700 // empty row to split up the monlthly costs
1701 const spacerRow = document.createElement('tr');
1702 const spacerCell = document.createElement('td');
1703 spacerCell.colSpan = 2;
1704 spacerCell.innerHTML = ' ';
1705 spacerRow.appendChild(spacerCell);
1706 receiptBody.appendChild(spacerRow);
1707
1708 // receipt
1709 const receiptSubtitleRow = document.createElement('tr');
1710 const receiptSubtitleCell = document.createElement('td');
1711 receiptSubtitleCell.colSpan = 2;
1712 receiptSubtitleCell.classList.add('subtitle', 'box');
1713
1714 receiptSubtitleCell.innerHTML = '@TranslationHelper.Translate("ReceiptSubTitleRent", areaId):';
1715 receiptSubtitleRow.appendChild(receiptSubtitleCell);
1716 receiptBody.appendChild(receiptSubtitleRow);
1717
1718 // add 1 time fee for installation (should also be added to total)
1719 if (!isNegativeProductInstallation)
1720 {
1721 const installationRow = document.createElement('tr');
1722
1723 const installationNameCell = document.createElement('td');
1724 installationNameCell.classList.add('box');
1725 installationNameCell.textContent = installationProduct.name;
1726
1727 const installationPriceCell = document.createElement('td');
1728 installationPriceCell.classList.add('price', 'box');
1729 installationPriceCell.textContent = formatPrice(installationProduct.price);
1730 total += Number(installationProduct.price);
1731
1732 installationRow.appendChild(installationNameCell);
1733 installationRow.appendChild(installationPriceCell);
1734
1735 receiptBody.appendChild(installationRow);
1736
1737
1738 // options:
1739 const optionsRow = document.createElement('tr');
1740 const optionsCell = document.createElement('td');
1741 optionsCell.colSpan = 2;
1742 optionsCell.classList.add('box');
1743 optionsCell.innerHTML = '<i>@TranslationHelper.Translate("Options", areaId):</i>';
1744 optionsRow.appendChild(optionsCell);
1745 receiptBody.appendChild(optionsRow);
1746 }
1747 else
1748 {
1749 // There should always be a positive deposit
1750 total += Number(@rentalPriceField.Value);
1751 }
1752
1753 // loop through all options
1754 let optionProducts = isNegativeProductInstallation ? products : products.filter(product => product !== installationProduct);
1755 let totalOptionsAmount = 0;
1756 for (let i = 0; i < optionProducts.length; i++) {
1757 const product = optionProducts[i];
1758
1759 const row = document.createElement('tr');
1760
1761 const nameCell = document.createElement('td');
1762 nameCell.classList.add('box');
1763 nameCell.textContent = product.name;
1764
1765 const priceCell = document.createElement('td');
1766 priceCell.classList.add('price', 'box');
1767 priceCell.textContent = formatPrice(product.price, false, product.zeroPriceDisplayText);
1768 totalOptionsAmount += Number(product.price);
1769
1770 row.appendChild(nameCell);
1771 row.appendChild(priceCell);
1772
1773 receiptBody.appendChild(row);
1774 }
1775
1776 // Total options price
1777 const totalOptionsPriceRow = document.createElement('tr');
1778 const totalOptionsNameCell = document.createElement('td');
1779 totalOptionsNameCell.classList.add('box');
1780 totalOptionsNameCell.innerHTML = `@TranslationHelper.Translate("TotalOptions", areaId):`;
1781
1782 const totalOptionsPriceCell = document.createElement('td');
1783 totalOptionsPriceCell.classList.add('price', 'total-price', 'box');
1784 totalOptionsPriceCell.innerHTML = `${formatPrice(totalOptionsAmount, true)}`;
1785
1786 totalOptionsPriceRow.appendChild(totalOptionsNameCell);
1787 totalOptionsPriceRow.appendChild(totalOptionsPriceCell);
1788
1789 receiptBody.appendChild(totalOptionsPriceRow);
1790
1791 // Add the total price
1792 const totalPriceRow = document.createElement('tr');
1793
1794 const totalNameCell = document.createElement('td');
1795 totalNameCell.classList.add('box');
1796 totalNameCell.innerHTML = `<strong>@TranslationHelper.Translate("Total", areaId)</strong>:`;
1797
1798 const totalPriceCell = document.createElement('td');
1799 totalPriceCell.classList.add('price', 'box');
1800 totalPriceCell.innerHTML = `<strong>${formatPrice(total + totalOptionsAmount)}</strong>`;
1801
1802
1803 totalPriceRow.appendChild(totalNameCell);
1804 totalPriceRow.appendChild(totalPriceCell);
1805
1806 receiptBody.appendChild(totalPriceRow);
1807
1808 const depositRow = document.createElement('tr');
1809
1810 const depositNameCell = document.createElement('td');
1811 depositNameCell.classList.add('box');
1812
1813 depositNameCell.innerHTML = `@TranslationHelper.Translate("Deposit", areaId):`;
1814
1815 const depositPriceCell = document.createElement('td');
1816 depositPriceCell.classList.add('price', 'box');
1817 depositPriceCell.innerHTML = formatPrice(total);
1818
1819 depositRow.appendChild(depositNameCell);
1820 depositRow.appendChild(depositPriceCell);
1821
1822 receiptBody.appendChild(depositRow);
1823
1824 // service subscription list
1825 const serviceSubscriptionRow = document.createElement('tr');
1826 const serviceSubscriptionCell = document.createElement('td');
1827 serviceSubscriptionCell.classList.add('service-subscription');
1828 serviceSubscriptionCell.colSpan = 2;
1829
1830 let receiptFooterText = `@TranslationHelper.Translate("ReceiptRentFooterText", areaId)`;
1831 receiptFooterText = receiptFooterText.replace('{installationcosts}', formatPrice(installationProduct.price));
1832
1833 serviceSubscriptionCell.innerHTML = `<br />${receiptFooterText}`;
1834
1835 serviceSubscriptionRow.appendChild(serviceSubscriptionCell);
1836
1837 receiptBody.appendChild(serviceSubscriptionRow);
1838
1839 }
1840
1841 function buildBuyReceipt() {
1842 const receiptBody = document.getElementById('receipt-body');
1843
1844 // Clear any existing content first
1845 receiptBody.innerHTML = '';
1846
1847 const { products, totalPrice } = getSelectedProductsAndTotal();
1848
1849 if (products.length === 0) {
1850 return; // No products to display
1851 }
1852
1853 // Add the boiler name first (only the name, from the first product)
1854
1855 // TranslationHelper.Translate("ReceiptSubTitleRent", areaId)
1856 const boilerRow = document.createElement('tr');
1857 const boilerCell = document.createElement('td');
1858 boilerCell.colSpan = 2;
1859 boilerCell.innerHTML = `<strong>${products[0].name}</strong>`;
1860 boilerRow.appendChild(boilerCell);
1861 receiptBody.appendChild(boilerRow);
1862
1863 // Add products to receipt
1864 for (let i = 0; i < products.length; i++) {
1865 const product = products[i];
1866
1867 const row = document.createElement('tr');
1868
1869 const nameCell = document.createElement('td');
1870 nameCell.classList.add('box');
1871 nameCell.textContent = product.name;
1872
1873 const priceCell = document.createElement('td');
1874 priceCell.classList.add('price', 'box');
1875 priceCell.textContent = formatPrice(product.price, false, product.zeroPriceDisplayText);
1876
1877 row.appendChild(nameCell);
1878 row.appendChild(priceCell);
1879
1880 receiptBody.appendChild(row);
1881 }
1882
1883 // Add the total price
1884 const totalPriceRow = document.createElement('tr');
1885
1886 const totalNameCell = document.createElement('td');
1887 totalNameCell.classList.add('box');
1888 totalNameCell.innerHTML = `<strong>Totaal</strong>:`;
1889
1890 const totalPriceCell = document.createElement('td');
1891 totalPriceCell.classList.add('price', 'total-price', 'box');
1892 totalPriceCell.innerHTML = `<strong>${formatPrice(totalPrice)}</strong>`;
1893
1894 totalPriceRow.appendChild(totalNameCell);
1895 totalPriceRow.appendChild(totalPriceCell);
1896
1897 receiptBody.appendChild(totalPriceRow);
1898
1899 const depositRow = document.createElement('tr');
1900
1901 const depositNameCell = document.createElement('td');
1902 depositNameCell.classList.add('box');
1903 @{
1904 var downPaymentValue = 50.0D;
1905 double.TryParse(AreaHelper.GetAreaItemStringValueBySystemName(StringConstants.WebsiteConfiguration.Downpayment, areaId), out downPaymentValue);
1906 }
1907 depositNameCell.innerHTML = `@TranslationHelper.Translate("OfWhichDeposit", areaId)`;
1908
1909 const depositPriceCell = document.createElement('td');
1910 depositPriceCell.classList.add('price', 'box');
1911 depositPriceCell.innerHTML = formatPrice(@downPaymentValue);
1912
1913 depositRow.appendChild(depositNameCell);
1914 depositRow.appendChild(depositPriceCell);
1915
1916 receiptBody.appendChild(depositRow);
1917
1918 const spacerRow = document.createElement('tr');
1919
1920 const spacerCell = document.createElement('td');
1921 spacerCell.colSpan = 2;
1922 spacerCell.innerHTML = ' ';
1923
1924 spacerRow.appendChild(spacerCell);
1925
1926 receiptBody.appendChild(spacerRow);
1927
1928 // monthly service costs
1929
1930 const serviceSubtitleRow = document.createElement('tr');
1931 const serviceSubtitleCell = document.createElement('td');
1932 serviceSubtitleCell.classList.add('subtitle-hint', 'box');
1933 serviceSubtitleCell.colSpan = 2;
1934 serviceSubtitleCell.innerHTML = `@TranslationHelper.Translate("ReceiptSubTitleBuy", areaId)`;
1935
1936 serviceSubtitleRow.appendChild(serviceSubtitleCell);
1937
1938 receiptBody.appendChild(serviceSubtitleRow);
1939
1940
1941 const serviceCostRow = document.createElement('tr');
1942
1943 const servicePriceTextCell = document.createElement('td');
1944 servicePriceTextCell.classList.add('box');
1945 servicePriceTextCell.innerHTML = `@TranslationHelper.Translate("Monthly", areaId):`;
1946
1947 const servicePriceCell = document.createElement('td');
1948 servicePriceCell.classList.add('price', 'box');
1949 let selectedInput = document.querySelector('input[id^="serviceSubscription-"]:checked');
1950 let selectedPrice = selectedInput ? parseFloat(selectedInput.dataset.price.replace(',', '.')) : null;
1951
1952 servicePriceCell.innerHTML = `${formatPrice(selectedPrice)}`;
1953
1954 serviceCostRow.appendChild(servicePriceTextCell);
1955 serviceCostRow.appendChild(servicePriceCell);
1956
1957 receiptBody.appendChild(serviceCostRow);
1958
1959 // service subscription list
1960 const serviceSubscriptionRow = document.createElement('tr');
1961 const serviceSubscriptionCell = document.createElement('td');
1962 serviceSubscriptionCell.classList.add('service-subscription');
1963 serviceSubscriptionCell.colSpan = 2;
1964
1965 serviceSubscriptionCell.innerHTML = `<br />@TranslationHelper.Translate("ReceiptBuyFooterText", areaId)`;
1966
1967 serviceSubscriptionRow.appendChild(serviceSubscriptionCell);
1968
1969 receiptBody.appendChild(serviceSubscriptionRow);
1970
1971 }
1972
1973 function getSelectedRentProductsAndTotal() {
1974
1975 }
1976
1977 function getSelectedProductsAndTotal() {
1978 const selectedRadios = Array.from(document.querySelectorAll('input[type="radio"]:checked'));
1979 const products = [];
1980
1981 // sort the steps (radios) and priotize some over others
1982 selectedRadios.sort((a, b) => {
1983 const labelA = document.querySelector(`label[for="${a.id}"]`);
1984 const labelB = document.querySelector(`label[for="${b.id}"]`);
1985 const posA = labelA?.getAttribute('data-position');
1986 const posB = labelB?.getAttribute('data-position');
1987
1988 const numA = posA !== null ? parseInt(posA, 10) : Infinity;
1989 const numB = posB !== null ? parseInt(posB, 10) : Infinity;
1990
1991 return numA - numB;
1992 });
1993
1994 @if(orderType == OrderType.Buy)
1995 {
1996 <text>
1997 products.push({
1998 name: '@boilerName'.replace(/'/g, "\\'"),
1999 type: 'mainproduct',
2000 price: @productPriceDouble
2001 });
2002 </text>
2003 }
2004
2005
2006 selectedRadios.forEach(radio => {
2007 const label = document.querySelector(`label[for="${radio.id}"]`);
2008 if (label) {
2009 const receipt = label.getAttribute('data-receipt');
2010 const receiptPrice = label.getAttribute('data-receipt-price');
2011 const receiptShowWhenZero = label.getAttribute('data-show-receipt-when-zero');
2012 const zeroPriceDisplayText = label.getAttribute('data-zero-price-text');
2013 const isService = label.getAttribute('data-is-service') === 'true';
2014 const productType = label.getAttribute('data-productType');
2015
2016 // services should be added to a seperated part of the receipt
2017 if (receipt && !isService) {
2018 const name = receipt.trim();
2019 const price = parseFloat(receiptPrice.replace(',', '.')) || 0;
2020
2021 // item shouldn't be showed in the receipt when it's zero for some sub products
2022 if (receiptShowWhenZero !== 'false' || price > 0) {
2023 products.push({
2024 name: name,
2025 type: productType.toLowerCase(),
2026 price: price,
2027 zeroPriceDisplayText: zeroPriceDisplayText
2028 });
2029 }
2030 }
2031
2032 }
2033 });
2034
2035 const totalPrice = products.reduce((sum, product) => sum + product.price, 0);
2036
2037 return {
2038 products: products,
2039 totalPrice: totalPrice
2040 };
2041 }
2042
2043 // TODO: Maybe move to a helper file
2044 function formatPrice(amount, returnZeroWhenFree = false, zeroPriceDisplayText = '') {
2045 const formatter = new Intl.NumberFormat('nl-NL', {
2046 style: 'currency',
2047 currency: 'EUR',
2048 minimumFractionDigits: 2,
2049 maximumFractionDigits: 2,
2050 });
2051
2052 // Format and manually adjust to your specific "-," style
2053 const formatted = formatter.format(amount).replace(",00", ",-");
2054
2055 if (amount === 0) {
2056 return returnZeroWhenFree ? formatted : (zeroPriceDisplayText || '@TranslationHelper.Translate("Free", areaId)');
2057 }
2058
2059 return formatted;
2060 }
2061 </script>
2062
2063 @SnippetStart("JavaScriptBottom")
2064 <script>
2065 // product click
2066 function productSelected(element) {
2067 var clickedProduct = $(element);
2068 var productId = clickedProduct.attr("data-productid");
2069 var productTypeData = clickedProduct.attr("data-productType");
2070 var productType = null;
2071 var areaId = @Dynamicweb.Frontend.PageView.Current().AreaID;
2072 var canResetToNothingSelected = false; // warmgarant is using yes and no products, so they are never set to true
2073 switch (productTypeData) {
2074 case "Thermostat": productType = ProductType.Thermostat;
2075 break;
2076 case "FloorHeatingSet": productType = ProductType.FloorHeatingSet;
2077 break;
2078 case "AirDirtSeparator": productType = ProductType.AirDirtSeparator;
2079 break;
2080 case "Installation": productType = ProductType.Installation;
2081 break;
2082 //case "AutomaticTopUp":
2083 // productType = ProductType.AutomaticTopUp;
2084 // canResetToNothingSelected = true; // not available (yet)
2085 // break;
2086 //case "HydronicBalancer":
2087 // productType = ProductType.HydronicBalancer;
2088 // canResetToNothingSelected = true; // not available (yet)
2089 // break;
2090 //case "SmokeDetector":
2091 // productType = ProductType.SmokeDetector;
2092 // canResetToNothingSelected = true; // not available (yet)
2093 // break;
2094 default: return;
2095 break;
2096 }
2097
2098 if (productType != null) {
2099 if (canResetToNothingSelected) {
2100 var isSelected = clickedProduct.hasClass("selected");
2101 if (isSelected) {
2102 Cart.AddOption(productType, productId, 1, areaId, false, OptionChangeSucceeded, OptionChangeFailed);
2103 } else {
2104 Cart.RemoveOptionById(productId, areaId, OptionChangeSucceeded, OptionChangeFailed);
2105 }
2106 } else {
2107 Cart.AddOption(productType, productId, 1, areaId, true, OptionChangeSucceeded, OptionChangeFailed);
2108 }
2109 } else {
2110 OptionChangeFailed();
2111 }
2112 };
2113
2114 function OptionChangeSucceeded(newProductId) {
2115 // reload receipt
2116 Cart.ReloadReceipt('@GetGlobalValue("Global:Area.LongLang")', "", scrollAbleReceipt);
2117 };
2118
2119 function OptionChangeFailed() {
2120 alert("selection failed");
2121 };
2122
2123 function termsClick(event) {
2124 var checkbox = $(event.target.firstElementChild); // clicked checkbox
2125 var checked = checkbox.is(":checked"); // clicked checkbox is checked
2126 if (checked) {
2127 $("#orderlink").removeClass("disabled-link");
2128 } else {
2129 $("#orderlink").addClass("disabled-link");
2130 }
2131 };
2132
2133 var initReceiptScroll = function (element) {
2134 var $this = $(element);
2135 var $target = $('#contentrow');
2136 $this.pushpin({
2137 top: $target.offset().top + 10,
2138 bottom: $target.offset().top + $target.outerHeight() - $this.height(),
2139 offset: $target.offset().top - 130
2140 });
2141 };
2142
2143 var initChatAgentScroll = function (element) {
2144 var $this = $(element);
2145 var $target = $('#contentrow');
2146 $this.pushpin({
2147 top: $target.offset().top + 440,
2148 bottom: $target.offset().top + $target.outerHeight() - $this.height(),
2149 offset: $target.offset().top - 130
2150 });
2151 };
2152
2153 var scrollAbleReceipt = function () {
2154 $('html.screen-lg-up').find('#receipt').each(function () {
2155 $(this).pushpin('remove');
2156 initReceiptScroll(this);
2157 resizeToParentWidth(this);
2158 });
2159 };
2160
2161 var initThermostatButtons = function () {
2162 $('#ThermostatsModal .choose-button').off('click').on('click', function () {
2163 $('#opt-container1').trigger("option-click", $(this).closest(".slider-slide").data('productid'));
2164 $('#ThermostatsModal').modal('close');
2165 });
2166 };
2167
2168 var initSliderButtons = function (slick) {
2169 if (slick.slideCount > slick.options.slidesToShow) {
2170 $('.slider-arrow').show()
2171
2172 } else {
2173 $('.slider-arrow').hide()
2174 }
2175 };
2176
2177 var openQuotationRequestModal = function () {
2178 $('#QuotationRequestModal').innovadisModal().modal('open');
2179 };
2180
2181 </script>
2182 @SnippetEnd("JavaScriptBottom")
2183 @SnippetStart("JavaScriptDocReady")
2184 <text>
2185
2186 // Initialize checkbox
2187 $("label.checkbox").innovadisCheckbox({
2188 onAfterChange: termsClick
2189 });
2190
2191 // Init modal listeners
2192 $('#thermostat-choose-infobtn').off("click").on("click", function () {
2193 $('#ThermostatsModal').innovadisModal({
2194 slick: {
2195 slidesToShow: 4,
2196 responsive: [
2197 {
2198 breakpoint: 992,
2199 settings: {
2200 slidesToShow: 2,
2201 dots: true
2202 }
2203
2204 }, {
2205 breakpoint: 600,
2206 settings: {
2207 slidesToShow: 1,
2208 dots: true
2209 }
2210
2211 }]
2212 }
2213 }).modal('open');
2214
2215 });
2216
2217 $('#ThermostatsModal').on('init breakpoint', function (event, slick, direction) {
2218 initThermostatButtons();
2219 initSliderButtons(slick);
2220 });
2221
2222 $('#floorheating-infobtn').off("click").on("click", function () {
2223 $('#FloorHeatingInfoModal').innovadisModal().modal('open');
2224 });
2225
2226 $('#airdirtseparator-infobtn').off("click").on("click", function () {
2227 $('#AirDirtSeparatorInfoModal').innovadisModal().modal('open');
2228 });
2229
2230 $('#service-subscription-infobtn').off("click").on("click", function () {
2231 $('#ServiceSubscriptionModal').innovadisModal().modal('open');
2232 });
2233
2234 $('#installation-infobtn').off("click").on("click", function () {
2235 $('#InstallationInfoModal').innovadisModal().modal('open');
2236 });
2237
2238 $('.more-infobtn').off("click").on("click", function (e) {
2239 e.preventDefault();
2240 $('#MoreInfoModal').innovadisModal().modal('open');
2241 return false;
2242 });
2243
2244 // show technical specifications for desktop click
2245 $('.techspecs-desktop').off("click").on("click", function (e) {
2246 e.preventDefault();
2247 $('#TechSpecsModalDesktop').innovadisModal().modal('open');
2248 return false;
2249 });
2250
2251 // show technical specifications for mobile click
2252 $('.techspecs-mobile').off("click").on("click", function (e) {
2253 e.preventDefault();
2254 $('#TechSpecsModalMobile').innovadisModal().modal('open');
2255 return false;
2256 });
2257
2258 // Init modal quotation request
2259 $('.quotation-button').off("click").on("click", function (e) {
2260 e.preventDefault();
2261 openQuotationRequestModal();
2262 SEO.trackPageView("@seoPageQuotation", '@GetGlobalValue("Global:CookieOptInLevel").ToLower()' === 'functional');
2263 return false;
2264 });
2265
2266 // Initialize advice & contact plugin
2267 if ($('#tabs-advice-contact')[0]) {
2268
2269 function handleTabOnbefore(event) {
2270
2271 var $element = $(event.currentTarget);
2272 var $target = $element.data("toggle");
2273
2274 // reset call me back form before showing
2275 if ($target === "call-me-back-container" && typeof onBeforeCallMeBack !== 'undefined') {
2276 onBeforeCallMeBack();
2277 }
2278
2279 }
2280
2281 // set advice as default
2282 $('[data-toggle]').innovadisToggleClass({
2283 target: $('#tabs-advice-contact'), // Target which will receive "className"
2284 className: 'overlay-active', // Class to add as active class
2285 subTarget: true, // Use data-attribute value as target ID, target will receive active class
2286 onBefore: handleTabOnbefore // Call a function before toggling
2287 });
2288 $('ul.tabs', "#tabs-advice-contact").tabs('select_tab', 'contact-tab');
2289 $("#advice-tab").parent().addClass("hide"); // hide advice tab
2290 }
2291
2292 // initialize modals
2293 $('.modal').modal();
2294
2295 // Initialize option panels
2296 /*
2297 $('#opt-container1').innovadisOptionSelector({ inputName: 'select_product', callback: productSelected });
2298 $('#opt-container2').innovadisOptionSelector({ inputName: 'select_product', callback: productSelected });
2299 $('#opt-container3').innovadisOptionSelector({ inputName: 'select_product', callback: productSelected });
2300 $('#opt-container4').innovadisOptionSelector({ inputName: 'select_product', callback: productSelected });
2301 $('#opt-container5').innovadisOptionSelector({ inputName: 'select_installation', callback: productSelected });
2302 */
2303 // Initial load receipt
2304 // Cart.ReloadReceipt('@GetGlobalValue("Global:Area.LongLang")', "", scrollAbleReceipt);
2305
2306 $(window)
2307 .resize(function () {
2308 resizeToParentWidth('#receipt');
2309 resizeToParentWidth('#advice-contact');
2310 })
2311 .trigger('resize');
2312
2313 scrollAbleReceipt();
2314
2315 $('html.screen-lg-up').find('#advice-contact').each(function () {
2316 initChatAgentScroll(this);
2317 });
2318
2319 $('html').on('classChange', function (event, eventClass) {
2320 if (eventClass === 'screen-md-down') {
2321 $('#receipt').pushpin('remove');
2322 $('#advice-contact').pushpin('remove');
2323 }
2324 if (eventClass === 'screen-md-down-removed') {
2325 initReceiptScroll('#receipt');
2326 initChatAgentScroll('#advice-contact');
2327 }
2328 });
2329 </text>
2330 @SnippetEnd("JavaScriptDocReady")
2331 }