Error executing template "Designs/Ege/eCom/ProductCatalog/Ege_ProductViewDetail.cshtml"
System.NullReferenceException: Object reference not set to an instance of an object.
   at EGE.Website.CustomModules.Extensions.PageExtensions.GetUrl(Page page) in C:\azp\agent\_work\4\s\EGE.Website\CustomModules\Extensions\PageExtensions.cs:line 23
   at EGE.Website.CustomModules.Extensions.ProductExtensions.GetTypeUrl(ProductViewModel prodVm, Object typeId) in C:\azp\agent\_work\4\s\EGE.Website\CustomModules\Extensions\ProductExt\ProductExtensions.cs:line 47
   at CompiledRazorTemplates.Dynamic.RazorEngine_a9e5bbdee74f4385bd59a76ffd8d4249.Execute() in E:\Solutions\egecarpets.dk\Files\Templates\Designs\Ege\eCom\ProductCatalog\Ege_ProductViewDetail.cshtml:line 440
   at RazorEngine.Templating.TemplateBase.RazorEngine.Templating.ITemplate.Run(ExecuteContext context, TextWriter reader)
   at RazorEngine.Templating.RazorEngineService.RunCompile(ITemplateKey key, TextWriter writer, Type modelType, Object model, DynamicViewBag viewBag)
   at RazorEngine.Templating.RazorEngineServiceExtensions.<>c__DisplayClass16_0.<RunCompile>b__0(TextWriter writer)
   at RazorEngine.Templating.RazorEngineServiceExtensions.WithWriter(Action`1 withWriter)
   at Dynamicweb.Rendering.RazorTemplateRenderingProvider.Render(Template template)
   at Dynamicweb.Rendering.TemplateRenderingService.Render(Template template)
   at Dynamicweb.Rendering.Template.RenderRazorTemplate()


  1     @inherits ViewModelTemplate<ProductViewModel>
  2     @using Dynamicweb.Rendering
  3     @using Dynamicweb.Ecommerce.ProductCatalog
  4     @using EGE.Website.CustomModules
  5     @using EGE.Website.CustomModules.Models
  6     @using EGE.Website.CustomModules.Extensions
  7     @using EGE.Website.CustomModules.Helpers
  8     @using System.Web
  9     @using Newtonsoft.Json;
 10     @using Newtonsoft.Json.Linq;
 11     @using System.Net.Http;
 12     @using System.Configuration;
 13     
 14     @{
 15         var product = Dynamicweb.Ecommerce.Services.Products.GetProductById(Model.Id, Model.VariantId, Model.LanguageId);
 16     }
 17     
 18     @functions {
 19         private JObject GetRugImageInformation(string structureId, string colorId, string langId)
 20         {
 21     
 22             var handler = new HttpClientHandler();
 23             handler.ServerCertificateCustomValidationCallback = (sender, cert, chain, sslPolicyErrors) => true;
 24     
 25             using (var client = new HttpClient(handler))
 26             {
 27                 var request = new HttpRequestMessage
 28                 {
 29                     Method = HttpMethod.Get,
 30                     RequestUri = new Uri(ConfigurationManager.AppSettings["EgeAPIURL"] + "GetImages?StructureID=" + structureId + "&ColorID=" + colorId + "&Lang=" + langId),
 31                     Headers =
 32     {
 33                         { "Authorization", ConfigurationManager.AppSettings["EgeAPIAuthToken"] },
 34                     },
 35                 };
 36     
 37                 using (var response = client.SendAsync(request).Result)
 38                 {
 39                     if (response.IsSuccessStatusCode)
 40                     {
 41                         string result = response.Content.ReadAsStringAsync().Result;
 42                         return JsonConvert.DeserializeObject<JObject>(result);
 43                     }
 44                 }
 45                 return null;
 46             }
 47         }
 48     }
 49     
 50     @if (product == null)
 51     {
 52         <h3>The product is not available in the chosen language, please try another.</h3>
 53     }
 54     else
 55     {
 56         bool isOutletSite = PageExtensions.IsOutletArea(Pageview.AreaID);
 57         var B2cSiteActive = PageExtensions.IsB2CArea(Pageview.AreaID);
 58         //string groupIdQueryParameter = string.IsNullOrEmpty(Dynamicweb.Context.Current.Request["GroupID"])
 59         //    ? string.Empty
 60         //    : "&amp;GroupID=" + Dynamicweb.Context.Current.Request["GroupID"];
 61         var variantCombinations = product.VariantCombinations.Where(x => !x.VariantId.Contains("NA"));
 62     
 63         string productLink = "/Default.aspx?ID=" + Pageview.Page.ID + "&amp;ProductID=" + Model.Id;
 64         var prodImage = ProductExtensions.GetProductImagePath(Model.Id, out bool isExternal);
 65         var prodTypeName = Model.GetFieldName("ProductEgeType");
 66         var prodTypeValue = Model.GetFieldValue("ProductEgeType");
 67         var prodConceptName = Model.GetFieldName("ProductConcept");
 68         var prodConceptValue = Model.GetFieldValue("ProductConcept");
 69         var prodCollectionName = Model.PrimaryOrDefaultGroup.Name;
 70         var prodCollectionLink = string.Empty;
 71         var prodB2CCollectionLink = string.Empty;
 72         var prodConceptLink = string.Empty;
 73         int variantListCounter = 0;
 74         var IsBulkCarpets = PageExtensions.IsBulkCarpets(prodTypeValue);
 75     
 76         //EGEDR-769
 77         bool isCircleBack = false;
 78         string circleBackText = string.Empty;
 79         if (Model.ProductCategories.Keys.Any())
 80         {
 81             if (Model.ProductCategories.ContainsKey("CarpetCategory"))
 82             {
 83                 isCircleBack = bool.Parse(product.GetCategoryValue("CarpetCategory", "IsCircleBack").ToString());
 84                 var circleBackTextObj = product.GetCategoryValue("CarpetCategory", "CircleBackText");
 85                 circleBackText = circleBackTextObj != null ? circleBackTextObj.ToString() : null;
 86     
 87             }
 88     
 89         }
 90     
 91         var CurrencyCode = Dynamicweb.Ecommerce.Common.Context.Currency.Code;
 92     
 93         if (Model.ProductCategories.Keys.Any())
 94         {
 95             if (Model.ProductCategories.ContainsKey("CarpetCategory"))
 96             {
 97                 var fields = Model.ProductCategories["CarpetCategory"];
 98                 prodCollectionLink = fields.Fields["CollectionContentPage"].Value as string;
 99                 prodConceptLink = fields.Fields["ConceptContentPage"].Value as string;
100                 prodB2CCollectionLink = fields.Fields["B2CCollectionContentPage"].Value as string;
101             }
102     
103         }
104         var images = Model.GetImages();
105         var sustainabilityChoices = string.Empty;
106         if (Model.ProductCategories.ContainsKey("CarpetCategory"))
107         {
108             var susChoiceList = (Model.ProductCategories["CarpetCategory"].Fields["PdfSustainBlocks"]?.Value as List<FieldOptionValueViewModel>);
109     
110             foreach (var choice in susChoiceList)
111             {
112                 sustainabilityChoices += choice.Value;
113             }
114         }
115     
116         var variantsDivId = "js-product-details__variants";
117         var prodNumber = "";
118         var patternNumber = "";
119         var backingAbbr = "";
120     
121         if (isOutletSite)
122         {
123             @TemplateHelper.RenderPartial("Ecom/Partials/Details_OutletData.cshtml", Model)
124             prodNumber = Model.GetCategoryValueAs<string>("M3ProductNumber", "OutletSpecs");
125             patternNumber = Model.GetCategoryValueAs<string>("PatternNumber", "OutletSpecs");
126             backingAbbr = Model.GetFieldValue("ProductBacking").ToString();
127         }
128         else
129         {
130             @TemplateHelper.RenderPartial("Ecom/Partials/Details_Data.cshtml", Model)
131         }
132     
133         var cartOrderLinesFeed = Dynamicweb.Services.Pages.GetPageByNavigationTag(Pageview.AreaID, "CartOrderLinesFeed");
134         var cartOrderLinesFeedUrl = "";
135         if (cartOrderLinesFeed != null)
136         {
137             cartOrderLinesFeedUrl = Dynamicweb.Frontend.SearchEngineFriendlyURLs.GetFriendlyUrl(cartOrderLinesFeed.ID);
138         }
139     
140         var isProductRug = EGE.Website.CustomModules.Extensions.ProductExtensions.IsRug(HttpContext.Current.Request["ProductID"]);
141         var showConfigurator = EGE.Website.CustomModules.Extensions.ProductExtensions.GetProductShowConfigurator(HttpContext.Current.Request["ProductID"]);
142         bool anyNonEmptyImagePath = false;
143     
144         Dynamicweb.Content.PageService pageService = new Dynamicweb.Content.PageService();
145         Dynamicweb.Content.Page configuratorLoginPage = pageService.GetPageByNavigationTag(Pageview.AreaID, "ConfiguratorLoginPage");
146         string configuratorLoginPageUrl = configuratorLoginPage != null ? Dynamicweb.Frontend.SearchEngineFriendlyURLs.GetFriendlyUrl(configuratorLoginPage.ID) : null;
147         string productId = HttpContext.Current.Request["ProductID"];
148     
149         string configuratorFullLink = configuratorLoginPageUrl + "?configuratorId=" + productId;
150     
151         var structureID = product.GetProductFieldValue("ProductStructureID").ToString();
152         var colorID = product.GetProductFieldValue("ProductColorID").ToString();
153         dynamic rugImageInfo = null;
154         var hasRugImages = false;
155     
156         if (!string.IsNullOrWhiteSpace(structureID) && !string.IsNullOrWhiteSpace(colorID) && isProductRug)
157         {
158             rugImageInfo = GetRugImageInformation(structureID, colorID, Model.LanguageId);
159             hasRugImages = true;
160         }
161     
162         <section class="product-details" id="js-product-details" data-model-id="@Model.Id" data-model-name="@Model.Name" data-non-variants="@Model.GetRelatedGroupById("RELGRP1").Any()" data-thumb="@ProductExtensions.GetProductImagePath(Model.Id, out isExternal, "XS")">
163     
164             <div class="container">
165                 <div class="product-details__inner">
166                     <div class="product-details__header-holder">
167                         <h1 class="header-in-component header-in-component--product-detail">
168                             @Model.Name
169                         </h1>
170                         <div class="product-details__header-id">
171                             @if (!isOutletSite)
172                             {
173                                 @Model.Number
174                             }
175                             else
176                             {
177                                 @:@prodNumber - @patternNumber - @backingAbbr
178                             }
179                         </div>
180                     </div>
181                     <div class="product-details__slider-holder">
182                         <div class="slider-with-counter slider-with-counter--main" id="slider-with-counter--wide">
183                             <div class="slider-with-counter__slider-holder">
184     
185                                 <ul class="slider-with-counter__list slider-with-counter__list--hidden" data-counter-text="@Translate("Product | You are viewing {X} of {Y} images", "You are viewing {X} of {Y} images").Replace("{X}", "{0}").Replace("{Y}", "{0}")">
186     
187                                     @if (hasRugImages)
188                                     {
189                                         foreach (var image in rugImageInfo.webImages)
190                                         {
191                                             string title = image.Title;
192                                             string imageSrc = image.ImagePath;
193                                             var imageIndex = 0;
194     
195                                             if (!string.IsNullOrEmpty(imageSrc))
196                                             {
197                                                 anyNonEmptyImagePath = true;
198                                                 <li class="slider-with-counter__item">
199                                                     <img class="lazyload a-image lazyload-measure lazyload-bg " src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="@title" property="contentUrl" data-src="@(ImageUiFormatHelper.Format(imageSrc, 542, 542))"
200                                                          data-query-obj='{ "mode":"crop" }'>
201                                                     <noscript v-if="false">
202                                                         <img src="@(ImageUiFormatHelper.Format(imageSrc, 542, 542))" alt="@title">
203                                                     </noscript>
204     
205                                                     <button @@click="showOverlay(@imageIndex+1)" class="slider-with-counter__button-lightbox" data-lightbox-image="test-slider.jpg"></button>
206                                                 </li>
207                                             }
208                                         }
209                                     }
210                                     @if (!hasRugImages || !anyNonEmptyImagePath)
211                                     {
212                                         foreach (var image in images)
213                                         {
214                                         var imageIndex = 0;
215                                         <li class="slider-with-counter__item">
216                                             @if (isCircleBack && !B2cSiteActive && image.Url.Contains("/Files/Files/Ecom/Images/Products/"))
217                                             {
218                                                 <div class="product-details__circle-back-overlay-container">
219                                                     <div class="product-details__circle-back-overlay">
220                                                         <div class="product-details__circle-back-overlay--img-container">
221                                                             <img class="product-details__circle-back-overlay--img" src="@ImageUiFormatHelper.Format("/Files/Files/Images/CircleBack/Ege_Circular_Black.png", 123, 136)" height="123" width="136" />
222                                                         </div>
223                                                     </div>
224                                                 </div>
225                                                 }
226                                                 <img class="lazyload a-image lazyload-measure lazyload-bg " src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="@image.AltText" property="contentUrl" data-src="@(image.IsExternal ? image.Url : ImageUiFormatHelper.Format(image.Url, 542, 542))"
227                                                      data-query-obj='{ "mode":"crop" }'>
228                                                 <noscript v-if="false">
229                                                     <img src="@(image.IsExternal ? image.Url : ImageUiFormatHelper.Format(image.Url, 542, 542))" alt="@image.AltText">
230                                                 </noscript>
231     
232                                                 <button @@click="showOverlay(@imageIndex+1)" class="slider-with-counter__button-lightbox" data-lightbox-image="test-slider.jpg"></button>
233                                             </li>
234                                         }
235                                     }
236     
237                                 </ul>
238                                 <div class="slider-with-counter__navigation">
239                                     <button @@click="slideToPrev(sliderMain)" v-bind:class="{ 'slider-with-counter__button--show': sliderMain.showButtonPrev}" class="slider-with-counter__button slider-with-counter__button--prev">
240                                         <svg class="svg-icon  slider-with-counter__svg">
241                                             <use xlink:href="@Constants.DistPath/icons/icons.svg#arrow"></use>
242                                         </svg>
243                                     </button>
244                                     <button @@click="slideToNext(sliderMain)" v-bind:class="{ 'slider-with-counter__button--show': sliderMain.showButtonNext }" class="slider-with-counter__button slider-with-counter__button--next">
245                                         <svg class="svg-icon  slider-with-counter__svg">
246                                             <use xlink:href="@Constants.DistPath/icons/icons.svg#arrow"></use>
247                                         </svg>
248                                     </button>
249                                 </div>
250                             </div>
251                             @if (!isOutletSite && !B2cSiteActive && !isProductRug)
252                             {
253                                 <div v-if="sliderMain.currentSlide <= 1">
254                                     <span id="ImageDownload" class="product-list-room-shot__item-image-download-product-detail">
255                                         <figure class="product-list-room-shot__item-image-download-icon"><svg class="svg-icon  product-list-room-shot__item-image-download-icon-arrow"><use xlink:href="/dist/icons/icons.svg#arrow-down-in-circle"></use></svg></figure>
256                                         <a href="@prodImage" download="@prodImage" class="product-list-room-shot__item-image-download-link">Low res</a>
257     
258                                         @if (ProductExtensions.GetHighResolutionImagePath(Model.Id) != null && !string.IsNullOrEmpty(ProductExtensions.GetHighResolutionImagePath(Model.Id)))
259                                         {
260                                             <a href="@ProductExtensions.GetHighResolutionImagePath(Model.Id)" download="@ProductExtensions.GetHighResolutionImagePath(Model.Id)" class="product-list-room-shot__item-image-download-link">High res</a>
261                                         }
262                                     </span>
263                                 </div>
264     
265                             }
266                             <div class="slider-with-counter__counter">
267                                 <span class="slider-with-counter__counter-part slider-with-counter__counter-part--plain" v-html="sliderMain.counterTextBefore"></span>
268                                 <span class="slider-with-counter__counter-part slider-with-counter__counter-part--number" v-html="sliderMain.currentSlide"></span>
269                                 <span class="slider-with-counter__counter-part slider-with-counter__counter-part--middle" v-html="sliderMain.counterTextMiddle"></span>
270                                 <span class="slider-with-counter__counter-part slider-with-counter__counter-part--number" v-html="slidesAmount"></span>
271                                 <span class="slider-with-counter__counter-part slider-with-counter__counter-part--plain" v-html="sliderMain.counterTextAfter"></span>
272                             </div>
273                             <div class="slider-with-counter__template">
274     
275                                 <div class="novi-backdrop novi-backdrop--hidden novi-backdrop--slider-with-counter" id="slider-with-counter__overlay">
276                                     <div class="novi-overlay">
277                                         <div class="novi-overlay__container">
278                                             <div class="novi-overlay__content">
279                                                 <div class="slider-with-counter slider-with-counter--in-overlay slider-with-counter--zoom" id="slider-with-counter--wide">
280                                                     <div class="slider-with-counter__slider-holder">
281                                                         <ul class="slider-with-counter__list slider-with-counter__list--hidden slider-with-counter__list--zoom">
282                                                             @{
283                                                                 int canvasCounter = 0;
284                                                             }
285     
286                                                             @if (hasRugImages)
287                                                             {
288     
289                                                                 foreach (var image in rugImageInfo.webImages)
290                                                                 {
291                                                                     string imageSrc = image.ImagePath;
292                                                                     if (!string.IsNullOrEmpty(imageSrc))
293                                                                     {
294                                                                         anyNonEmptyImagePath = true;
295                                                                         <li class="slider-with-counter__item">
296                                                                             <img class="lazyload a-image lazyload-measure lazyload-bg" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="@image.Title" property="contentUrl" data-src="@ImageUiFormatHelper.Format(imageSrc, 700, 700)"
297                                                                                  data-query-obj='{ "mode":"crop" }'>
298                                                                             <noscript v-if="false">
299                                                                                 <img src="@ImageUiFormatHelper.Format(imageSrc, 700, 700)"
300                                                                                      alt="@image.Title">
301                                                                             </noscript>
302                                                                             <span class="button__wait-animation button__wait-animation--slider-with-counter">
303                                                                                 <span></span>
304                                                                                 <span></span>
305                                                                                 <span></span>
306                                                                                 <span></span>
307                                                                             </span>
308     
309                                                                             @if (canvasCounter == 0)
310                                                                             {
311                                                                                 <canvas v-bind:class="{'slider-with-counter__zoom-canvas--loading':zoomElements[@canvasCounter] && zoomElements[@canvasCounter].isLoading}" @@touchend="zoomOnTouchEnd(@canvasCounter,$event)" @@mouseup="zoomOnTouchEnd(@canvasCounter,$event)" @@touchmove="zoomOnTouchMove(@canvasCounter,$event)" @@touchstart="zoomOnTouchStart(@canvasCounter,$event)" @@mousedown="zoomOnTouchStart(@canvasCounter,$event)" @@wheel="zoomOnWheel(@canvasCounter,$event)" @@mousemove="zoomOnTouchMove(@canvasCounter,$event)" @@mouseleave="zoomClear(@canvasCounter)" data-src="@(image.ImagePath + "&mode=crop")" data-no="@canvasCounter" class="slider-with-counter__zoom-canvas"></canvas>
312                                                                                 <span class="slider-with-counter__zoom-loading" v-if="zoomElements[@canvasCounter] && zoomElements[@canvasCounter].isLoading">
313                                                                                     <span class="button__wait-animation button__wait-animation--zoom">
314                                                                                         <span></span>
315                                                                                         <span></span>
316                                                                                         <span></span>
317                                                                                         <span></span>
318                                                                                     </span>
319                                                                                     <span class="slider-with-counter__zoom-loading-text">@Translate("Product | Zoom | Loading zoomable image", "Loading zoomable image")</span>
320                                                                                 </span>
321                                                                                 <div class="slider-with-counter__zoom-container">
322                                                                                     <div v-if="zoomElements[@canvasCounter]" class="slider-with-counter__zoom-level-indicator">
323                                                                                         <button @@click="zoomOnButton(@canvasCounter,true)" class="increase-decrease__button increase-decrease__button--up slider-with-counter__zoom-level-button slider-with-counter__zoom-level-button--plus"></button>
324                                                                                         <div class="slider-with-counter__zoom-level-illustration">
325                                                                                             <span v-bind:style="'top:'+zoomDotPosition" class="slider-with-counter__zoom-level-illustration-dot"></span>
326                                                                                         </div>
327                                                                                         <button @@click="zoomOnButton(@canvasCounter,false)" class="increase-decrease__button increase-decrease__button--down slider-with-counter__zoom-level-button slider-with-counter__zoom-level-button--minus"></button>
328                                                                                     </div>
329                                                                                     <span class="slider-with-counter__zoom-indicator" style="background-image: url(@image.ImagePath)">
330                                                                                         <span v-if="zoomElements[@canvasCounter]" v-bind:style="{paddingTop: zoomElements[@canvasCounter].thumbnailRatio}" class="slider-with-counter__zoom-indicator-aspect-ratio"></span>
331                                                                                         <span v-if="zoomElements[@canvasCounter]" v-bind:style="{width:zoomThumbnailSize[@canvasCounter],height:zoomThumbnailSize[@canvasCounter],left:zoomThumbnailPositionComp[@canvasCounter].left,top:zoomThumbnailPositionComp[@canvasCounter].top}" class="slider-with-counter__zoom-indicator-excerpt"><span></span></span>
332                                                                                     </span>
333                                                                                 </div>
334                                                                             }
335                                                                             @{canvasCounter++;}
336                                                                         </li>
337                                                                     }
338                                                                 }
339                                                             }
340                                                             @if (!hasRugImages || !anyNonEmptyImagePath)
341                                                             {
342                                                                 foreach (var image in images)
343                                                                 {
344                                                                     <li class="slider-with-counter__item">
345                                                                         <img class="lazyload a-image lazyload-measure @(image.IsFirst ? "slider-with-counter__real-image" : "lazyload-bg")" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="@image.AltText" property="contentUrl" data-src="@(image.IsExternal ? image.Url : ImageUiFormatHelper.Format(image.Url, 700, 700))"
346                                                                              data-query-obj='{ "mode":"crop" }'>
347                                                                         <noscript v-if="false">
348                                                                             <img src="@(image.IsExternal ? image.Url + "?mode=crop" : ImageUiFormatHelper.Format(image.Url, 700, 700))"
349                                                                                  alt="@image.AltText">
350                                                                         </noscript>
351                                                                         <span class="button__wait-animation button__wait-animation--slider-with-counter">
352                                                                             <span></span>
353                                                                             <span></span>
354                                                                             <span></span>
355                                                                             <span></span>
356                                                                         </span>
357     
358                                                                         @if (canvasCounter == 0)
359                                                                         {
360                                                                             <canvas v-bind:class="{'slider-with-counter__zoom-canvas--loading':zoomElements[@canvasCounter] && zoomElements[@canvasCounter].isLoading}" @@touchend="zoomOnTouchEnd(@canvasCounter,$event)" @@mouseup="zoomOnTouchEnd(@canvasCounter,$event)" @@touchmove="zoomOnTouchMove(@canvasCounter,$event)" @@touchstart="zoomOnTouchStart(@canvasCounter,$event)" @@mousedown="zoomOnTouchStart(@canvasCounter,$event)" @@wheel="zoomOnWheel(@canvasCounter,$event)" @@mousemove="zoomOnTouchMove(@canvasCounter,$event)" @@mouseleave="zoomClear(@canvasCounter)" data-src="@(image.Url + "&mode=crop")" data-no="@canvasCounter" class="slider-with-counter__zoom-canvas"></canvas>
361                                                                             <span class="slider-with-counter__zoom-loading" v-if="zoomElements[@canvasCounter] && zoomElements[@canvasCounter].isLoading">
362                                                                                 <span class="button__wait-animation button__wait-animation--zoom">
363                                                                                     <span></span>
364                                                                                     <span></span>
365                                                                                     <span></span>
366                                                                                     <span></span>
367                                                                                 </span>
368                                                                                 <span class="slider-with-counter__zoom-loading-text">@Translate("Product | Zoom | Loading zoomable image", "Loading zoomable image")</span>
369                                                                             </span>
370                                                                             <div class="slider-with-counter__zoom-container">
371                                                                                 <div v-if="zoomElements[@canvasCounter]" class="slider-with-counter__zoom-level-indicator">
372                                                                                     <button @@click="zoomOnButton(@canvasCounter,true)" class="increase-decrease__button increase-decrease__button--up slider-with-counter__zoom-level-button slider-with-counter__zoom-level-button--plus"></button>
373                                                                                     <div class="slider-with-counter__zoom-level-illustration">
374                                                                                         <span v-bind:style="'top:'+zoomDotPosition" class="slider-with-counter__zoom-level-illustration-dot"></span>
375                                                                                     </div>
376                                                                                     <button @@click="zoomOnButton(@canvasCounter,false)" class="increase-decrease__button increase-decrease__button--down slider-with-counter__zoom-level-button slider-with-counter__zoom-level-button--minus"></button>
377                                                                                 </div>
378                                                                                 <span class="slider-with-counter__zoom-indicator" style="background-image: url(@image.Url)">
379                                                                                     <span v-if="zoomElements[@canvasCounter]" v-bind:style="{paddingTop: zoomElements[@canvasCounter].thumbnailRatio}" class="slider-with-counter__zoom-indicator-aspect-ratio"></span>
380                                                                                     <span v-if="zoomElements[@canvasCounter]" v-bind:style="{width:zoomThumbnailSize[@canvasCounter],height:zoomThumbnailSize[@canvasCounter],left:zoomThumbnailPositionComp[@canvasCounter].left,top:zoomThumbnailPositionComp[@canvasCounter].top}" class="slider-with-counter__zoom-indicator-excerpt"><span></span></span>
381                                                                                 </span>
382                                                                             </div>
383                                                                         }
384                                                                         @{canvasCounter++;}
385                                                                     </li>
386                                                                 }
387                                                             }
388                                                         </ul>
389                                                         <div class="slider-with-counter__navigation">
390                                                             <button @@click="slideToPrev(sliderInOverlay)" v-bind:class="{ 'slider-with-counter__button--show': sliderInOverlay.showButtonPrev}" class="slider-with-counter__button slider-with-counter__button--prev">
391                                                                 <svg class="svg-icon  slider-with-counter__svg">
392                                                                     <use xlink:href="@Constants.DistPath/icons/icons.svg#arrow"></use>
393                                                                 </svg>
394                                                             </button>
395                                                             <button @@click="slideToNext(sliderInOverlay)" v-bind:class="{ 'slider-with-counter__button--show': sliderInOverlay.showButtonNext }" class="slider-with-counter__button slider-with-counter__button--next">
396                                                                 <svg class="svg-icon  slider-with-counter__svg">
397                                                                     <use xlink:href="@Constants.DistPath/icons/icons.svg#arrow"></use>
398                                                                 </svg>
399                                                             </button>
400                                                         </div>
401                                                     </div>
402                                                     <div class="slider-with-counter__counter">
403                                                         <span class="slider-with-counter__counter-part slider-with-counter__counter-part--plain" v-html="sliderInOverlay.counterTextBefore"></span>
404                                                         <span class="slider-with-counter__counter-part slider-with-counter__counter-part--number" v-html="sliderInOverlay.currentSlide"></span>
405                                                         <span class="slider-with-counter__counter-part slider-with-counter__counter-part--middle" v-html="sliderInOverlay.counterTextMiddle"></span>
406                                                         <span class="slider-with-counter__counter-part slider-with-counter__counter-part--number" v-html="slidesAmount"></span>
407                                                         <span class="slider-with-counter__counter-part slider-with-counter__counter-part--plain" v-html="sliderInOverlay.counterTextAfter"></span>
408                                                     </div>
409                                                 </div>
410                                                 <div class="novi-overlay__close-area">
411                                                     <button class="close-button novi-overlay__close-button">
412                                                         <span class="close-button__icon">
413                                                             <svg class="svg-icon  close-button__svg">
414                                                                 <use xlink:href="@Constants.DistPath/icons/icons.svg#cross"></use>
415                                                             </svg>
416                                                         </span>
417                                                         <span class="close-button__text">@Translate("Product | Image overlay | Close", "Close")</span>
418                                                     </button>
419                                                 </div>
420                                             </div>
421                                         </div>
422                                     </div>
423     
424                                 </div>
425                             </div>
426     
427                         </div>
428     
429                     </div>
430     
431                     <div class="product-details__details-holder">
432                         <h2 class="product-text__header">@(B2cSiteActive ? @Translate("Product | B2C Tags", "B2C Tags") : @Translate("Product | Tags", "Tags"))</h2>
433                         <ul class="product-details__tag-list">
434                             <li class="product-details__tag-item">
435                                 @if (B2cSiteActive)
436                                 {
437                                     <span class="product-details__tag-link">@prodTypeName</span>
438                                 }
439                                 else
440                                 {
441     
442                                     <a href="@(Model.GetTypeUrl(prodTypeValue))" class="product-details__tag-link">@prodTypeName</a>
443                                 }
444                             </li>
445                             @if (!B2cSiteActive)
446                             {
447                                 <li class="product-details__tag-item">
448                                     <a href="@(!string.IsNullOrWhiteSpace(prodConceptLink) ? prodConceptLink : Model.GetProductListUrl() + "?concept=" + prodConceptValue)" class="product-details__tag-link">@prodConceptName</a>
449                                 </li>
450                             }
451                             @if (B2cSiteActive)
452                             {
453                                 <li class="product-details__tag-item">
454                                     <span class="product-details__tag-link">@prodCollectionName</span>
455                                 </li>
456     
457                             }
458                             else if (!string.IsNullOrWhiteSpace(prodCollectionLink))
459                             {
460                                 <li class="product-details__tag-item">
461                                     <a href="@prodCollectionLink" class="product-details__tag-link">@prodCollectionName</a>
462                                 </li>
463                             }
464                         </ul>
465     
466                         <div id="@variantsDivId" ref="variantType_@variantListCounter" class="product-details__variants">
467                             @foreach (var designVariantLists in Model.ProduceListsOfDesignVariants())
468                             {
469                                 var activeProductId = HttpContext.Current.Request["ProductID"];
470                                 var hideVariantsClass = "product-details__variant-type--hide";
471                                 if (variantListCounter == 0)
472                                 {
473                                     hideVariantsClass = "";
474                                 }
475                                 if (variantListCounter > 0)
476                                 {
477                                     <button ref="variantTypeButton_@variantListCounter" @@click="toggleVariantType(@variantListCounter)" class="product-text__read-more"><svg class="svg-icon product-text__svg"><use xlink:href="/dist/icons/icons.svg#arrow"></use></svg><span>@Translate(designVariantLists.TranslationKey, designVariantLists.TranslationDefaultValue)</span></button>
478                                 }
479                                 <div ref="variantType_@variantListCounter" class="product-details__variant-type @hideVariantsClass">
480                                     <h2 class="product-text__header">@Translate(designVariantLists.TranslationKey, designVariantLists.TranslationDefaultValue)</h2>
481                                     <div class="product-details__variant-type-content">
482                                         <div class="product-details__variant-truncate" :style="{'max-height':variantTruncateHeight[@variantListCounter]}">
483                                             <ul class="product-details__variant-list">
484     
485                                                 @foreach (var relatedProduct in designVariantLists.RelatedProducts.OrderBy(x => x.Id))
486                                                 {
487                                                     var imagePath = ProductExtensions.GetProductImagePath(relatedProduct.Id, out bool relatedIsExternal, "XS");
488                                                     productLink = "/Default.aspx?ID=" + Pageview.Page.ID + "&amp;ProductID=" + relatedProduct.Id;
489                                                     <li class="product-details__variant-item">
490                                                         <a href="@productLink" class="product-details__variant-link @(activeProductId == relatedProduct.Id ? "product-details__variant-link--active" : "")" title="@relatedProduct.Id">
491                                                             <figure class="product-details__variant-img">
492                                                                 <img class="lazyload a-image lazyload-measure lazyload-bg " src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="@relatedProduct.Name" property="contentUrl" data-src="@(activeProductId == relatedProduct.Id ? (isExternal ? prodImage : ImageUiFormatHelper.Format(prodImage, 700, 700)) : (relatedIsExternal ? imagePath : ImageUiFormatHelper.Format(imagePath, 700, 700)))"
493                                                                      data-query-obj='{  }'>
494                                                                 <noscript v-if="false">
495                                                                     <img src="@(activeProductId == relatedProduct.Id ? (isExternal ? prodImage : ImageUiFormatHelper.Format(prodImage, 700, 700)) : (relatedIsExternal ? imagePath : ImageUiFormatHelper.Format(imagePath, 700, 700)))"
496                                                                          alt="@relatedProduct.Name">
497                                                                 </noscript>
498                                                             </figure>
499                                                         </a>
500                                                     </li>
501                                                 }
502                                                 <li class="product-details__variant-item product-details__variant-item--adjustment"></li>
503                                                 <li class="product-details__variant-item product-details__variant-item--adjustment"></li>
504                                                 <li class="product-details__variant-item product-details__variant-item--adjustment"></li>
505                                                 <li class="product-details__variant-item product-details__variant-item--adjustment"></li>
506                                                 <li class="product-details__variant-item product-details__variant-item--adjustment"></li>
507                                                 <li class="product-details__variant-item product-details__variant-item--adjustment"></li>
508                                                 <li class="product-details__variant-item product-details__variant-item--adjustment"></li>
509                                             </ul>
510                                         </div>
511                                     </div>
512                                     <button class="product-details__see-all-variants" :class="{'product-details__see-all-variants--open':variantTypes[@variantListCounter].showAllVariants}" v-if="variantTypes[@variantListCounter] && variantTypes[@variantListCounter].moreVariantsThanOneLine" @@click="hideShowVariants(@variantListCounter)">
513                                         <span class="product-details__see-all-variants-text product-details__see-all-variants-text--see-all">
514                                             @Translate("Product | See all variants", "See all variants")
515                                         </span>
516                                         <span class="product-details__see-all-variants-text product-details__see-all-variants-text--see-less">
517                                             @Translate("Product | See less variants", "See less variants")
518                                         </span>
519     
520                                         <svg class="svg-icon  product-details__see-all-variants-svg">
521                                             <use xlink:href="@Constants.DistPath/icons/icons.svg#arrow-down-in-circle"></use>
522                                         </svg>
523                                     </button>
524                                 </div>
525                                 variantListCounter++;
526                             }
527                         </div>
528                         @if (isCircleBack && !B2cSiteActive)
529                         {
530                             <div id="product-details__circle-back" class="product-details__variant-type">
531                                 <img src="@ImageUiFormatHelper.Format("/Files/Files/Images/CircleBack/Ege_Circular_Black.png", 50, 55)" height="50" width="55" />
532                                 <button ref="circleBackButton" v-show="!toggleCircleBack" @@click="initToggleCircleBack()" class="product-text__read-more"><svg class="svg-icon product-text__svg"><use xlink:href="/dist/icons/icons.svg#arrow"></use></svg><span>@Translate("EgeCircleBack:ReadMoreButtonText", "Ege CircleBack")</span></button>
533                                 <div v-show="toggleCircleBack" class="product-text__text">
534                                     @circleBackText
535                                 </div>
536                             </div>
537                         }
538                         <div class="product-text" data-button-text-1="@Translate("Read more", "Read more")" data-button-text-2="@Translate("Show less", "Show less")">
539                             <h2 class="product-text__header">@Model.ShortDescription</h2>
540                             <div v-bind:style="{ maxHeight: maxHeight + 'px' }" class="product-text__text" v-bind:class="{'product-text__text--truncate':truncateText}">
541                                 <div>@Model.LongDescription</div>
542                             </div>
543                             <button @@click="toggle" v-if="hasOverflow" class="product-text__read-more">
544                                 <svg class="svg-icon  product-text__svg">
545                                     <use xlink:href="@Constants.DistPath/icons/icons.svg#arrow"></use>
546                                 </svg><span v-html="buttonText"></span>
547                             </button>
548                         </div>
549     
550                         @if (B2cSiteActive)
551                         {
552     
553                             var B2CFullWidthPrice = string.Empty;
554                             var B2CCarvingPrice = string.Empty;
555                             var B2CAnyShapePrice = string.Empty;
556                             var B2CAnyShapeExtraText = string.Empty;
557     
558                             if (Model.ProductCategories.Keys.Any())
559                             {
560                                 if (Model.ProductCategories.ContainsKey("CarpetCategory"))
561                                 {
562                                     var fields2 = Model.ProductCategories["CarpetCategory"];
563     
564                                     B2CFullWidthPrice = product.GetCategoryValue("CarpetCategory", "B2CFullWidthPrice").ToString();
565                                     B2CCarvingPrice = product.GetCategoryValue("CarpetCategory", "B2CCarvingPrice").ToString();
566                                     B2CAnyShapePrice = product.GetCategoryValue("CarpetCategory", "B2CAnyShapePrice").ToString();
567                                     B2CAnyShapeExtraText = fields2.Fields["B2CAnyShapeExtraText"].Value as string;
568                                 }
569     
570                             }
571     
572                             <div class="remnants">
573                                 <div class="remnants__header">
574                                     <div class="remnants__headline">@Translate("Product details B2C | Remnants | Priser", "Priser")</div>
575                                 </div>
576                                 <ul class="remnants__list">
577                                     @if (!string.IsNullOrWhiteSpace(B2CFullWidthPrice) && B2CFullWidthPrice != "0")
578                                     {
579                                         // adding decimals if not already present
580                                         var B2CFillWidthPriceFormatted = (B2CFullWidthPrice.Contains(',') ? B2CFullWidthPrice : B2CFullWidthPrice + ",00");
581     
582                                         <li class="remnants__item">
583                                             <div class="remnants__item-inner">
584                                                 <div class="remnants__info remnants__info--first-column">
585                                                     <div class="remnants__info-text">@Translate("Product details B2C | Remnants | B2CFullWidthText", "Fuld bredde, pr. m2 inkl. moms")</div>
586                                                 </div>
587                                                 <div class="remnants__price remnants__price--first-column">@CurrencyCode @B2CFillWidthPriceFormatted</div>
588                                             </div>
589                                         </li>
590                                     }
591                                     @if (!string.IsNullOrWhiteSpace(B2CCarvingPrice) && B2CCarvingPrice != "0")
592                                     {
593                                         // adding decimals if not already present
594                                         var B2CCarvingPriceFormatted = (B2CCarvingPrice.Contains(',') ? B2CCarvingPrice : B2CCarvingPrice + ",00");
595     
596                                         <li class="remnants__item">
597                                             <div class="remnants__item-inner">
598                                                 <div class="remnants__info remnants__info--first-column">
599                                                     <div class="remnants__info-text">@Translate("Product details B2C | Remnants | B2CCarvingText", "Udskåret mål, pr. m2 inkl. moms")</div>
600                                                 </div>
601                                                 <div class="remnants__price remnants__price--first-column">@CurrencyCode @B2CCarvingPriceFormatted</div>
602                                             </div>
603                                         </li>
604                                     }
605                                     @if (!string.IsNullOrWhiteSpace(B2CAnyShapePrice) && B2CAnyShapePrice != "0")
606                                     {
607                                         // adding decimals if not already present
608                                         var B2CAnyShapePriceFormatted = (B2CAnyShapePrice.Contains(',') ? B2CAnyShapePrice : B2CAnyShapePrice + ",00");
609     
610                                         <li class="remnants__item">
611                                             <div class="remnants__item-inner">
612                                                 <div class="remnants__info remnants__info--first-column">
613                                                     <div class="remnants__info-text">@B2CAnyShapeExtraText</div>
614                                                 </div>
615                                                 <div class="remnants__price remnants__price--first-column">@CurrencyCode @B2CAnyShapePriceFormatted</div>
616                                             </div>
617                                         </li>
618                                     }
619                                 </ul>
620                             </div>
621                         }
622     
623                         @if (isOutletSite)
624                         {
625                             var addToBasketString = Translate("Product details | Remnants | Add to basket", "Add to basket");
626     
627                             <div id="js-remnants" v-cloak class="remnants" data-text-options-singular="@Translate("Product details | Remnants | option (singular)", "option")" data-text-options-plural="@Translate("Product details | Remnants | options (plural)", "options")" data-text-product-singular="@Translate("Product details | Remnants | fault (singular)", "fault")" data-text-product-plural="@Translate("Product details | Remnants | faults (plural)", "faults")">
628                                 <div class="remnants__header">
629                                     <div class="remnants__headline">@Translate("Product details | Remnants | Choose carpet remnants", "Choose carpet remnants")</div>
630                                     <div class="remnants__items-available">{{remnantItems.length}} <span v-html="remnantItems.length === 1 ? textOptionsSingular : textOptionsPlural"></span></div>
631                                 </div>
632                                 <ul class="remnants__list" :class="{'remnants__list--show-all':showAll}">
633                                     <li class="remnants__item" v-for="remnantItem in remnantItems" :key="remnantItem.VariantId">
634                                         <div class="remnants__item-inner">
635                                             <div class="remnants__input">
636                                                 <label :for="'remnant-input-'+remnantItem.VariantId" class="form__checkbox-label">
637                                                     <input :id="'remnant-input-'+remnantItem.VariantId" :value="remnantItem.VariantId" v-model="chosenRemnants" name="remnants" type="checkbox" class="form__input-checkbox">
638                                                     <span class="form__checkbox-label-text"></span>
639                                                 </label>
640                                             </div>
641                                             <div class="remnants__area">{{remnantItem.AvailableArea}} m<sup>2</sup></div>
642                                             <div class="remnants__info">
643                                                 <div class="remnants__info-text">{{remnantItem.RollCorners}} @Translate("Product details | Remnants | corners", "corners"), {{remnantItem.NumberOfFlaws}} <span v-html="remnantItem.NumberOfFlaws === 1 ? textProductSingular : textProductPlural"></span><span class="remnants__waste-carpet" v-if="remnantItem.IsWasteCarpet"> (@Translate("Product details | Remnants | waste carpet", "waste carpet"))</span><span v-if="remnantItem.UnitPrice">, </span><span class="remnants__unit-price" v-if="remnantItem.UnitPrice">{{remnantItem.UnitPrice}} {{remnantItem.CurrencyCode}} @Translate("Product details | Remnants | per m2", "per m2")</span></div>
644                                                 <button class="remnants__preview" @@click="showCarpetProfile(remnantItem.ProductNumber,remnantItem.M3BatchNumber,remnantItem.M3ProductNumber)">@Translate("Product details | Remnants | Outlet | Roll profile", "Roll profile")</button>
645                                                 @if (ProductExtensions.GetOutletPatternPDF(patternNumber) != "")
646                                                 {
647                                                     <a target="_blank" class="remnants__pattern-pdf" href="@ProductExtensions.GetOutletPatternPDF(patternNumber)">@Translate("Product details | Remnants | Outlet | Pattern PDF", "Pattern PDF")</a>
648                                                 }
649                                             </div>
650                                             <div class="remnants__price">{{Number(remnantItem.Price).toLocaleString('en-GB') }} {{remnantItem.CurrencyCode}}</div>
651                                         </div>
652                                     </li>
653                                     <div class="remnants__additional-costs-msg" v-if="remnantItems.length > 0">@Translate("Product details | Remnants | Additional costs message", "Delivery costs will be added")</div>
654                                 </ul>
655                                 <div class="remnants__footer">
656                                     <div class="remnants__show-all-holder">
657                                         <button class="remnants__show-all" @@click="doShowAll" :class="{'remnants__show-all--show':showShowAll}">@Translate("Product details | Remnants | Show all", "Show all") ({{remnantItems.length}})</button>
658                                     </div>
659                                     <button @@click="addChosenToBasket" type="button" property="url"
660                                             class="button button--solid button--black button--wait-animation"
661                                             data-service="@cartOrderLinesFeedUrl"
662                                             v-bind:class="{'button--error':showErrorOnButton,'button--wait':showWaitAnimation}"
663                                             data-text="@addToBasketString">
664                                         <span class="button__error-message">
665                                             @Translate("Product details | Remnants | You haven't selected any products to add to basket", "You haven't selected any products to add to basket")
666                                         </span>
667                                         <span class="button__wait-animation">
668                                             <span></span>
669                                             <span></span>
670                                             <span></span>
671                                             <span></span>
672                                         </span>
673                                         <span class="button__content">
674                                             <span class="button__icon">
675                                                 <svg class="svg-icon  button__svg">
676                                                     <use xlink:href="@Constants.DistPath/icons/icons.svg#samples"></use>
677                                                 </svg>
678                                             </span>
679                                             <span class="button__text">@addToBasketString</span>
680                                         </span>
681                                     </button>
682                                 </div>
683     
684                                 <div @@click="closeProfileOverlay" class="novi-backdrop novi-backdrop--hidden novi-backdrop--carpet-profile" :class="{'novi-backdrop--shown':showProfileOverlay}">
685                                     <div class="novi-overlay">
686                                         <div class="novi-overlay__container">
687                                             <div class="novi-overlay__content" @@click="stopProp">
688                                                 <div class="carpet-profile">
689                                                     <header class="carpet-profile__header">
690                                                         <h2 class="subheader-in-component js-alt-color-gold">
691                                                             @Translate("Product details | Remnants | Error table | header | Error profile", "Error profile")
692                                                         </h2>
693                                                         <p v-if="currentChosenProfileIndex !== null">@Translate("Product details | Remnants | Profile overlay | For product number", "For product number"): <span v-html="remnantProfiles[currentChosenProfileIndex].M3productNumber"></span>  @Translate("Product details | Remnants | Profile overlay | Batch number", "Batch number"): <span v-html="remnantProfiles[currentChosenProfileIndex].batchNumber"></span></p>
694                                                     </header>
695                                                     <div class="row">
696                                                         <div class="col-xs-12">
697                                                             <img class="carpet-profile__img" id='base64image' v-if="currentChosenProfileIndex !== null"
698                                                                  :src="'data:image/jpeg;base64, '+remnantProfiles[this.currentChosenProfileIndex].data.profileBase64" />
699                                                             <p class="carpet-profile__draw-outline" v-if="currentChosenProfileIndex !== null" v-html="remnantProfiles[this.currentChosenProfileIndex].data.profileText"></p>
700     
701                                                             <table class="carpet-profile__fault-list" v-if="currentChosenProfileIndex !== null && remnantProfiles[this.currentChosenProfileIndex].data.faults.length">
702                                                                 <tr class="carpet-profile__fault-list-item carpet-profile__fault-list-item--header">
703                                                                     <th class="carpet-profile__fault-list-cell carpet-profile__fault-list-cell--header">@Translate("Product details | Remnants | Error table | Error code", "Error code")</th>
704                                                                     <th class="carpet-profile__fault-list-cell carpet-profile__fault-list-cell--header">@Translate("Product details | Remnants | Error table | Error rank", "Error rank")</th>
705                                                                     <th class="carpet-profile__fault-list-cell carpet-profile__fault-list-cell--header">@Translate("Product details | Remnants | Error table | Text", "Text")</th>
706                                                                     <th class="carpet-profile__fault-list-cell carpet-profile__fault-list-cell--header">@Translate("Product details | Remnants | Error table | Width from", "Width from")</th>
707                                                                     <th class="carpet-profile__fault-list-cell carpet-profile__fault-list-cell--header">@Translate("Product details | Remnants | Error table | Width to", "Width to")</th>
708                                                                     <th class="carpet-profile__fault-list-cell carpet-profile__fault-list-cell--header">@Translate("Product details | Remnants | Error table | Length from", "Length from")</th>
709                                                                     <th class="carpet-profile__fault-list-cell carpet-profile__fault-list-cell--header">@Translate("Product details | Remnants | Error table | Length to", "Length to")</th>
710                                                                 </tr>
711                                                                 <tr class="carpet-profile__fault-list-item" v-for="fault in remnantProfiles[this.currentChosenProfileIndex].data.faults">
712                                                                     <td data-header="@Translate("Product details | Remnants | Error table | Error code", "Error code")" class="carpet-profile__fault-list-cell" v-html="fault.reasonCode"></td>
713                                                                     <td data-header="@Translate("Product details | Remnants | Error table | Error rank", "Error rank")" class="carpet-profile__fault-list-cell" v-html="fault.errorRank"></td>
714                                                                     <td data-header="@Translate("Product details | Remnants | Error table | Text", "Text")" class="carpet-profile__fault-list-cell carpet-profile__fault-list-cell--text" v-html="fault.textForReason"></td>
715                                                                     <td data-header="@Translate("Product details | Remnants | Error table | Width from", "Width from")" class="carpet-profile__fault-list-cell" v-html="fault.brdStart"></td>
716                                                                     <td data-header="@Translate("Product details | Remnants | Error table | Width to", "Width to")" class="carpet-profile__fault-list-cell" v-html="fault.brdEnd"></td>
717                                                                     <td data-header="@Translate("Product details | Remnants | Error table | Length from", "Length from")" class="carpet-profile__fault-list-cell" v-html="fault.lgdStart"></td>
718                                                                     <td data-header="@Translate("Product details | Remnants | Error table | Length to", "Length to")" class="carpet-profile__fault-list-cell" v-html="fault.lgdEnd"></td>
719                                                                 </tr>
720                                                             </table>
721                                                         </div>
722                                                     </div>
723                                                 </div>
724                                                 <div class="novi-overlay__close-area">
725                                                     <button @@click="closeProfileOverlay" class="close-button novi-overlay__close-button">
726                                                         <span class="close-button__icon">
727                                                             <svg class="svg-icon  close-button__svg">
728                                                                 <use xlink:href="@Constants.DistPath/icons/icons.svg#cross"></use>
729                                                             </svg>
730                                                         </span>
731                                                         <span class="close-button__text">@Translate("Product | Sample overlay | Close", "Close")</span>
732                                                     </button>
733                                                 </div>
734                                             </div>
735                                         </div>
736                                     </div>
737                                 </div>
738                             </div>
739                         }
740                         else
741                         {
742                             <span>
743                                 <div class="button-double product-details__buttons">
744                                     @if (!B2cSiteActive && !string.IsNullOrWhiteSpace(Model.GetCadesignProperties().ToolUrl) && !isProductRug)
745                                     {
746                                         string firstBtnText = string.Empty;
747     
748                                         if (Model.GetCadesignProperties().IsTile)
749                                         {
750                                             firstBtnText = Translate("Product | Tile", "Create your tile design");
751                                         }
752                                         else if (Model.GetCadesignProperties().Recolour)
753                                         {
754                                             firstBtnText = Translate("Product | Customize", "Customize");
755                                         }
756                                         else
757                                         {
758                                             firstBtnText = Translate("Product | Visualize", "Visualize");
759                                         }
760                                         <button data-href="@Model.GetCadesignProperties().ToolUrl" @@click="openCustomizeOverlay" class="button button--ghost button--black js-customize-button" data-text="@firstBtnText">
761                                             <span class="button__content">
762                                                 <span class="button__icon">
763                                                     <svg class="svg-icon  button__svg">
764                                                         <use xlink:href="@Constants.DistPath/icons/icons.svg#magic-wand"></use>
765                                                     </svg>
766                                                 </span>
767                                                 <span class="button__text">@firstBtnText</span>
768                                             </span>
769                                             <div class="product-details__hide js-customize-iframe-holder">
770                                                 <div class="product-details__iframe-holder">
771                                                     <iframe class="product-details__customize-iframe" frameborder="0"></iframe>
772                                                     <span class="product-details__wait-animation">
773                                                         <span></span>
774                                                         <span></span>
775                                                         <span></span>
776                                                         <span></span>
777                                                     </span>
778                                                 </div>
779                                             </div>
780                                         </button>
781                                     }
782                                     else if (isProductRug)
783                                     {
784                                         if (showConfigurator)
785                                         {
786                                             string firstBtnText = string.Empty;
787                                             firstBtnText = Translate("Product | Rug configurator", "Configure rug");
788                                             <a href="@configuratorFullLink" target="_blank" class="button button--ghost button--black js-customize-button">
789                                                 <span class="button__content">
790                                                     <span class="button__icon">
791                                                         <svg class="svg-icon  button__svg">
792                                                             <use xlink:href="@Constants.DistPath/icons/icons.svg#magic-wand"></use>
793                                                         </svg>
794                                                     </span>
795                                                     <span class="button__text">@firstBtnText</span>
796                                                 </span>
797                                                 <div class="product-details__hide js-customize-iframe-holder">
798                                                     <div class="product-details__iframe-holder">
799                                                         <iframe class="product-details__customize-iframe" frameborder="0"></iframe>
800                                                         <span class="product-details__wait-animation">
801                                                             <span></span>
802                                                             <span></span>
803                                                             <span></span>
804                                                             <span></span>
805                                                         </span>
806                                                     </div>
807                                                 </div>
808                                             </a>
809                                         }
810                                     }
811     
812     
813                                     else if (B2cSiteActive && !string.IsNullOrWhiteSpace(Model.GetFieldValue<string>("ProductBacking")) && !string.IsNullOrWhiteSpace(Model.GetFieldValue<string>("ProductSpecificationCode")))
814                                     {
815                                         var prod = Dynamicweb.Ecommerce.Services.Products.GetProductByNumber(Model.GetFieldValue<string>("ProductBacking"), Model.LanguageId);
816     
817                                         <form method="post" action="/api/specifications/getpdf" class="button-double__form">
818                                             <input type="hidden" name="backingCode" value="@(Model.GetFieldValue<string>("ProductBacking"))" />
819                                             <input type="hidden" name="backingName" value="@(ProductExtensions.GetProductName(product))" />
820                                             <input type="hidden" name="qualityName" value="@prodCollectionName" />
821                                             <input type="hidden" name="collectionCode" value="@Model.GetFieldValue("ProductCollectionCode")" />
822                                             <input type="hidden" name="specificationCode" value="@(Model.GetFieldValue<string>("ProductSpecificationCode"))" />
823                                             <input type="hidden" name="nationalityCode" value="@Dynamicweb.Ecommerce.Common.Context.Language.CountryCode" />
824                                             <input type="hidden" name="areaId" value="@Pageview.AreaID" /> @* On the B2C site we hardcode the area id to the danish b2b site to pull the sustainability stores from there(these are defined in website settings) *@
825                                             <input type="hidden" name="productName" value="@Model.Name" />
826                                             <input type="hidden" name="sustainabilityChoice" value="@sustainabilityChoices" />
827                                             <button type="submit" property="url" class="button button--ghost button--black" data-text="@Translate("Product details | Specifications | Download full specifications", "Download full specifications")" @@click="downloadFullSpecifications" ref="showFullSpecificationsSubmitButton">
828                                                 <span class="button__content">
829                                                     <span class="button__icon">
830                                                         <svg class="svg-icon  button__svg">
831                                                             <use xlink:href="@Constants.DistPath/icons/icons.svg#arrow-down-in-circle"></use>
832                                                         </svg>
833                                                     </span>
834                                                     <span class="button__text">
835                                                         @Translate("Product details | Specifications | Download full specifications", "Download full specifications")
836                                                     </span>
837                                                 </span>
838                                             </button>
839                                         </form>
840                                     }
841                                     @if (!B2cSiteActive && (variantCombinations.Any() || Model.GetRelatedGroupById("RELGRP1").Any()))
842                                     {
843                                         var nonVariantSamples = Model.GetRelatedGroupById("RELGRP1");
844                                         var showSamplesVersion = "";
845                                         if (variantCombinations.Any())
846                                         {
847                                             showSamplesVersion = "showSamplesAdvanced";
848                                         }
849                                         else if (nonVariantSamples.Any())
850                                         {
851                                             showSamplesVersion = "showSamplesSimple";
852                                         }
853                                         <button id="js-add-to-samples-button" type="button" class="button button--solid button--black " @@click="@showSamplesVersion" data-text="@Translate("Product | Add to samples", "Add to samples")">
854                                             <span class="button__content">
855                                                 <span class="button__icon">
856                                                     <svg class="svg-icon  button__svg">
857                                                         <use xlink:href="@Constants.DistPath/icons/icons.svg#samples"></use>
858                                                     </svg>
859                                                 </span>
860                                                 <span class="button__text">@Translate("Product | Add to samples", "Add to samples")</span>
861                                             </span>
862                                         </button>
863                                     }
864                                     else if (B2cSiteActive)
865                                     {
866                                         if (IsBulkCarpets && prodCollectionName != "Geometrica Rugs")
867                                         {
868                                             var shapeOverlayBtnText = Translate("Product | See rug in room", "Se tæppet i rum");
869                                             var shapeToolUrl = ProductExtensions.CadesignServiceUrl + "/rug-ui.html?prod=" + @Model.Id;
870                                             <button data-href="@shapeToolUrl" @@click="openCustomizeOverlay"
871                                                     class="button button--solid button--black js-customize-button"
872                                                     data-text="@shapeOverlayBtnText">
873                                                 <span class="button__content">
874                                                     <span class="button__icon">
875                                                         <svg class="svg-icon  button__svg">
876                                                             <use xlink:href="@Constants.DistPath/icons/icons.svg#magic-wand"></use>
877                                                         </svg>
878                                                     </span>
879                                                     <span class="button__text">@shapeOverlayBtnText</span>
880                                                 </span>
881                                                 <div class="product-details__hide js-customize-iframe-holder">
882                                                     <div class="product-details__iframe-holder">
883                                                         <iframe class="product-details__customize-iframe" frameborder="0"></iframe>
884                                                         <span class="product-details__wait-animation">
885                                                             <span></span>
886                                                             <span></span>
887                                                             <span></span>
888                                                             <span></span>
889                                                         </span>
890                                                     </div>
891                                                 </div>
892                                             </button>
893                                         }
894                                         else
895                                         {
896                                             <button id="js-product-details__contact-form-link-button" @@click="scrollDown" type="button" class="button button--solid button--black " data-text="@Translate("Product | B2C Kontakt Os Knap", "B2C Kontakt Os Knap")">
897                                                 <span class="button__content">
898                                                     <span class="button__icon">
899                                                         <svg class="svg-icon  button__svg">
900                                                             <use xlink:href="@Constants.DistPath/icons/icons.svg#contact"></use>
901                                                         </svg>
902                                                     </span>
903                                                     <span class="button__text">@Translate("Product | B2C Kontakt Os Knap", "B2C Kontakt Os Knap")</span>
904                                                 </span>
905                                             </button>
906                                         }
907                                     }
908                                     @if (!B2cSiteActive)
909                                     {
910                                         <div class="product-details__contact-form-link">
911                                             <span class="product-details__contact-form-link-left">@Translate("Product | Do you need help", "Do you need help?")</span>
912                                             <span class="product-details__contact-form-link-right">
913                                                 <button type="button" id="js-product-details__contact-form-link-button" class="product-details__contact-form-link-button" @@click="scrollDown">
914                                                     @Translate("Product | Contact us", "Contact us")
915                                                     <span class="product-details__contact-form-link-arrow">
916                                                         <svg class="svg-icon  product-details__contact-form-link-arrow-svg">
917                                                             <use xlink:href="@Constants.DistPath/icons/icons.svg#arrow"></use>
918                                                         </svg>
919                                                     </span>
920                                                 </button>
921                                             </span>
922                                         </div>
923                                     }
924                                     else if (B2cSiteActive && !string.IsNullOrEmpty(prodB2CCollectionLink))
925                                     {
926                                         <div class="product-details__contact-form-link product-details__contact-form-link--b2c">
927                                             <a href="@prodB2CCollectionLink" type="button" class="product-details__contact-form-link-button">
928                                                 @Translate("Product | B2C Se vores Priser", "Se vores priser her!")
929                                                 <span class="product-details__contact-form-link-arrow product-details__contact-form-link-arrow--b2c">
930                                                     <svg class="svg-icon product-details__contact-form-link-arrow-svg">
931                                                         <use xlink:href="@Constants.DistPath/icons/icons.svg#arrow"></use>
932                                                     </svg>
933                                                 </span>
934                                             </a>
935                                         </div>
936                                     }
937                                 </div>
938                             </span>
939                             <div>
940                                 @TemplateHelper.RenderPartial("Ecom/Partials/Details_SelectedSamplesOverlay.cshtml")
941                                 @TemplateHelper.RenderPartial("Ecom/Partials/Details_AddToSamples.cshtml", Model)
942                             </div>
943                         }
944                     </div>
945                 </div>
946     
947             </div>
948         </section>
949     
950         if (isOutletSite)
951         {
952     
953         }
954         else if (B2cSiteActive)
955         {
956             @TemplateHelper.RenderPartial("Ecom/Partials/Details_B2CGuidesAndImages.cshtml", Model)
957         }
958         else
959         {
960             if (isProductRug)
961             {
962                 @TemplateHelper.RenderPartial("Ecom/Partials/Details_RugShapeAndFinishingTypes.cshtml", Model)
963                 @TemplateHelper.RenderPartial("Ecom/Partials/Details_DesignerInformation.cshtml", Model)
964     
965             }
966             else
967             {
968                 @TemplateHelper.RenderPartial("Ecom/Partials/Details_B2BGuidesAndImages.cshtml", Model)
969             }
970     
971             @TemplateHelper.RenderPartial("Ecom/Partials/Details_SpecificationsAndHighlights.cshtml", Model)
972     
973         }
974     }
975