1 @inherits ViewModelTemplate<ProductListViewModel>
2 @using Dynamicweb.Frontend
3 @using Dynamicweb.Rendering
4 @using Dynamicweb.Ecommerce.ProductCatalog
5 @using Dynamicweb.Environment
6 @using Dynamicweb.Ecommerce.Products;
7 8 @functions {
9 public ProductViewModel GetDummyProduct()
10 {
11 ProductViewModel product = new ProductViewModel();
12 13 ProductViewModelSettings productSetting = new ProductViewModelSettings
14 {
15 LanguageId = Dynamicweb.Ecommerce.Common.Context.LanguageID,
16 CurrencyCode = Dynamicweb.Ecommerce.Common.Context.Currency.Code,
17 CountryCode = Dynamicweb.Ecommerce.Common.Context.Country.Code2,
18 ShopId = Pageview.Area.EcomShopId
19 };
20 21 if (Dynamicweb.Context.Current.Items.Contains("ProductDetails"))
22 {
23 product = (ProductViewModel)Dynamicweb.Context.Current.Items["ProductDetails"];
24 }
25 else
26 {
27 product = ViewModelFactory.CreateView(productSetting, Dynamicweb.Ecommerce.Services.Products.GetLastActiveProducts(1, Dynamicweb.Ecommerce.Common.Context.LanguageID, false).FirstOrDefault().Id);
28 }
29 30 return product;
31 }
32 33 //used for select and similar products
34 public ProductViewModel GetSelectedsProduct(string selectedProductsId)
35 {
36 ProductViewModel product = new ProductViewModel();
37 38 ProductViewModelSettings productSetting = new ProductViewModelSettings
39 {
40 LanguageId = Dynamicweb.Ecommerce.Common.Context.LanguageID,
41 CurrencyCode = Dynamicweb.Ecommerce.Common.Context.Currency.Code,
42 CountryCode = Dynamicweb.Ecommerce.Common.Context.Country.Code2,
43 ShopId = Pageview.Area.EcomShopId
44 };
45 46 if(!string.IsNullOrEmpty(selectedProductsId))
47 {
48 product = ViewModelFactory.CreateView(productSetting, selectedProductsId, Dynamicweb.Ecommerce.Common.Context.LanguageID);
49 }
50 51 return product;
52 }
53 54 55 }
56 57 @{
58 string googleTagManagerID = Pageview.AreaSettings.GetString("GoogleTagManagerID");
59 string googleAnalyticsMeasurementID = Pageview.AreaSettings.GetString("GoogleAnalyticsMeasurementID");
60 var cookieOptInLevel = CookieManager.GetCookieOptInLevel();
61 bool allowTracking = cookieOptInLevel == CookieOptInLevel.All || (cookieOptInLevel == CookieOptInLevel.Functional && CookieManager.GetCookieOptInCategories().Contains("Statistical"));
62 int areaID = Pageview.AreaID;
63 int paragraphId = !string.IsNullOrEmpty(Dynamicweb.Context.Current.Request.Form.Get("ParagraphId")) ? Convert.ToInt32(Dynamicweb.Context.Current.Request.Form.Get("ParagraphId")) : 0;
64 var productList = Model.Products;
65 if (paragraphId == 0)
66 {
67 paragraphId = Convert.ToInt32(Dynamicweb.Content.Services.Pages.GetPageByNavigationTag(areaID, "Capo_ProductComponentSliderService").ID);
68 }
69 70 var paragraph = Dynamicweb.Content.Services.Paragraphs?.GetParagraph(paragraphId) ?? null;
71 ParagraphInfoViewModel paragraphViewModel = Dynamicweb.Frontend.ContentViewModelFactory.CreateParagraphInfoViewModel(paragraph);
72 73 string contentPadding = "";//paragraphViewModel.Item.GetRawValueString("ContentPadding", "");
74 contentPadding = contentPadding == "none" ? "p-0" : contentPadding;
75 contentPadding = contentPadding == "small" ? "p-3 p-md-3" : contentPadding;
76 contentPadding = contentPadding == "large" ? "p-5 p-md-5" : contentPadding;
77 78 int listItemSourcePageId = paragraphViewModel.Item.GetInt32("ListComponentSource");
79 var page = listItemSourcePageId != 0 ? Dynamicweb.Content.Services.Pages.GetPage(listItemSourcePageId) : null;
80 81 82 string selectedDisplayGroups = !string.IsNullOrEmpty(Dynamicweb.Context.Current.Request.Form["SelectedDisplayGroups"]) ? Dynamicweb.Context.Current.Request.Form["SelectedDisplayGroups"].ToString() : "";
83 List<string> selectedDisplayGroupsList = selectedDisplayGroups != null ? selectedDisplayGroups.Split(',').ToList() : new List<string>();
84 85 //Collect the titles for all available fields
86 List<string> fieldsHeaders = new List<string>();
87 foreach (var product in productList)
88 {
89 foreach (var selection in selectedDisplayGroupsList)
90 {
91 foreach (CategoryFieldViewModel group in product.FieldDisplayGroups.Values)
92 {
93 if (selection.ToString() == group.Id)
94 {
95 foreach (var field in group.Fields)
96 {
97 if (!fieldsHeaders.Contains(field.Value.Name))
98 {
99 bool noValues = false;
100 if (field.Value.Value.GetType() == typeof(System.Collections.Generic.List<FieldOptionValueViewModel>))
101 {
102 System.Collections.Generic.List<FieldOptionValueViewModel> values = field.Value.Value as System.Collections.Generic.List<FieldOptionValueViewModel>;
103 noValues = values.Count > 0 ? false : true;
104 }
105 else if (string.IsNullOrEmpty(field.Value.Value.ToString()))
106 {
107 noValues = true;
108 }
109110 if (!noValues)
111 {
112 fieldsHeaders.Add(field.Value.Name);
113 }
114 }
115 }
116 }
117 }
118 }
119 }
120 }
121122123 @if (paragraphViewModel != null && page != null)
124 {
125 if (Model.Products.Any())
126 {
127 int modelId = paragraphViewModel.ID;
128 string navigationStyle = $"{paragraphViewModel.Item.GetRawValueString("NavigationStyle", "slider-nav-round")}";
129 string navigationPlacement = $"{paragraphViewModel.Item.GetRawValueString("NavigationPlacement", "slider-nav-on-slides")}";
130 string indicatorStyle = $"{paragraphViewModel.Item.GetRawValueString("IndicatorStyle", string.Empty)}";
131 string revealSlides = paragraphViewModel.Item.GetRawValueString("RevealSlides", "no-reveal") == "reveal" ? "slider-item-reveal" : string.Empty;
132 string sliderItemsGap = paragraphViewModel.Item.GetRawValueString("SliderItemsGap", "slider-item-gap") == "slider-item-nogap" ? "slider-item-nogap" : string.Empty;
133 string navigationAlwaysVisible = (paragraphViewModel.Item.GetBoolean("NavigationAlwaysVisible")) ? "slider-nav-visible" : string.Empty;
134 string navigationVisibleOnTouch = (paragraphViewModel.Item.GetBoolean("NavigationVisibleOnTouch")) ? "slider-nav-touch" : string.Empty;
135 string navigationShowScrollbar = (paragraphViewModel.Item.GetBoolean("NavigationShowScrollbar")) ? "slider-nav-scrollbar" : string.Empty;
136 string scrollBarForceMobile = (paragraphViewModel.Item.GetBoolean("NavigationShowScrollbar")) ? "--swiffy-slider-track-height:0.5rem !important;" : string.Empty;
137 string navigationSmall = (paragraphViewModel.Item.GetBoolean("NavigationSmall")) ? "slider-nav-sm" : string.Empty;
138 string navigationInvertColors = (paragraphViewModel.Item.GetBoolean("NavigationInvertColors")) ? "slider-nav-dark" : string.Empty;
139 string navigationSlideEntirePage = (paragraphViewModel.Item.GetBoolean("NavigationSlideEntirePage")) ? "slider-nav-page" : string.Empty;
140 string navigationNoLoop = (paragraphViewModel.Item.GetBoolean("NavigationNoLoop")) ? "slider-nav-noloop" : string.Empty;
141 string indicatorsOutsideSlider = (paragraphViewModel.Item.GetBoolean("IndicatorsOutsideSlider") && indicatorStyle != string.Empty) ? "slider-indicators-outside" : string.Empty;
142 string indicatorsHighlightActive = (paragraphViewModel.Item.GetBoolean("IndicatorsHighlightActive")) ? "slider-indicators-highlight" : string.Empty;
143 string indicatorsInvertColors = (paragraphViewModel.Item.GetBoolean("IndicatorsInvertedColors")) ? "slider-indicators-dark" : string.Empty;
144 string indicatorsVisibleOnSmallDevices = (paragraphViewModel.Item.GetBoolean("IndicatorsVisibleOnSmallDevices")) ? "slider-indicators-sm" : string.Empty;
145 string animation = paragraphViewModel.Item.GetRawValueString("Animation", string.Empty) != string.Empty ? $"slider-nav-animation {paragraphViewModel.Item.GetRawValueString("Animation")}" : string.Empty;
146 string autoplay = (paragraphViewModel.Item.GetBoolean("Autoplay")) ? "slider-nav-autoplay" : string.Empty;
147 string autoplayInterval = paragraphViewModel.Item.GetRawValueString("AutoplayInterval", string.Empty);
148 bool hideSliderNavigation = false;
149150 string gridColumnSize = paragraphViewModel.Item.GetRawValueString("SliderLayout", "3");
151 int itemsShown = Convert.ToInt32(gridColumnSize);
152153 var pageViewModel = Dynamicweb.Frontend.ContentViewModelFactory.CreatePageInfoViewModel(page);
154 string listItemTheme = " theme " + pageViewModel.Item.GetRawValueString("Theme", string.Empty).Replace(" ", "").Trim().ToLower();
155 string listItemPadding = pageViewModel.Item.GetRawValueString("ContentPadding", string.Empty);
156 string listItemPaddingClass = string.Empty;
157158 var sourceType = !string.IsNullOrEmpty(Dynamicweb.Context.Current.Request.Form.Get("SourceType").ToString()) ? Dynamicweb.Context.Current.Request.Form.Get("SourceType") : string.Empty;
159 string title = !string.IsNullOrEmpty(Dynamicweb.Context.Current.Request.Form["Title"]) ? Dynamicweb.Context.Current.Request.Form["Title"].ToString() : "";
160 string mainProductId = !string.IsNullOrEmpty(Dynamicweb.Context.Current.Request.Form["MainProductID"]) ? Dynamicweb.Context.Current.Request.Form["MainProductID"].ToString() : "";
161 string paragraphID = !string.IsNullOrEmpty(Dynamicweb.Context.Current.Request.Form["ParagraphID"]) ? Dynamicweb.Context.Current.Request.Form["ParagraphID"].ToString() : "";
162 string servicePageId = !string.IsNullOrEmpty(Dynamicweb.Context.Current.Request.Form["ID"]) ? Dynamicweb.Context.Current.Request.Form["ID"].ToString() : "";
163164165 //Create group id collection and products id collection strings
166 string groupId = !string.IsNullOrEmpty(Dynamicweb.Context.Current.Request.Form["GroupId"]) ? Dynamicweb.Context.Current.Request.Form["GroupId"].ToString() : "";
167 string productIds = !string.IsNullOrEmpty(Dynamicweb.Context.Current.Request.Form["MainProductID"]) ? Dynamicweb.Context.Current.Request.Form["MainProductID"].ToString() : "";
168 string contextCart = !string.IsNullOrEmpty(Dynamicweb.Context.Current.Request.Form["OrderContext"]) ? Dynamicweb.Context.Current.Request.Form["OrderContext"].ToString() : "";
169170 if (sourceType == String.Empty)
171 {
172 sourceType = $"{paragraphViewModel.Item.GetRawValueString("SourceType")}";
173174 }
175176 <script type="module" src="~/Files/Templates/Designs/Swift/Assets/js/swiffy-slider.js"></script>
177 <script type="module">
178 swift.AssetLoader.Load('/Files/Templates/Designs/Swift/Assets/css/swiffy-slider.min.css', 'css');
179 </script>
180181 switch (listItemPadding)
182 {
183 case "small":
184 listItemPaddingClass = " p-2 p-xl-3";
185 break;
186 case "large":
187 listItemPaddingClass = " p-3 p-xl-4";
188 break;
189 case "small-x":
190 listItemPaddingClass = " px-2 px-md-3";
191 break;
192 case "large-x":
193 listItemPaddingClass = " px-3 px-md-4";
194 break;
195 }
196197 if (sourceType.ToLower() == "selected-products")
198 {
199 string[] array = productIds.Split(',');
200 Model.Products.Clear();
201202 foreach (var prodId in array)
203 {
204205 var productToAdd = GetSelectedsProduct(prodId);
206207 Model.Products.Add(productToAdd);
208 }
209 }
210211 if (sourceType.ToLower() == "similar-products")
212 {
213214 bool isGlobalShop = Pageview.AreaSettings.GetBoolean("IsBrandGlobalSite");
215216 List<Product> productsList = new App_Code.SimilarProducts().GetSimilarProducts(mainProductId, groupId, isGlobalShop);
217218 Model.Products.Clear();
219220 foreach (var prodId in productsList)
221 {
222223 var productToAdd = GetSelectedsProduct(prodId.Id);
224225 Model.Products.Add(productToAdd);
226 }
227 }
228229230 if (navigationStyle == "slider-nav-none")
231 {
232 hideSliderNavigation = true;
233 }
234235 @* CAPO CUSTOM *@
236 string sliderLayoutClass = "slider-layout-" + paragraphViewModel.Item.GetRawValueString("Layout", "");
237 string sliderLayout = paragraphViewModel.Item.GetRawValueString("Layout", "");
238 string swiffyClasses = "g-col-12 " + "swiffy-slider " + "slider-item-show" + itemsShown + " " + navigationStyle + " " + revealSlides + " " + navigationPlacement + " " + navigationAlwaysVisible + " " + navigationVisibleOnTouch + " " + indicatorStyle + " " + navigationShowScrollbar + " " + navigationSmall + " " + navigationInvertColors + " " + indicatorsOutsideSlider + " " + navigationNoLoop + " " + indicatorsHighlightActive + " " + indicatorsInvertColors + " " + indicatorsVisibleOnSmallDevices + " " + navigationSlideEntirePage;
239240 if (Model.Products.Count == 4 && sliderLayout == "slider")
241 {
242 sliderLayout = "grid";
243 }
244 if(!string.IsNullOrEmpty(productIds))
245 {
246 <div class="@(sliderLayout == "slider" ? "grid gap-0": "") @contentPadding@(sliderLayoutClass)">
247 <div id="slider_@(modelId)"
248 style="--swiffy-slider-nav-light:var(--swift-foreground-color);--swiffy-slider-nav-dark:var(--swift-background-color);@(scrollBarForceMobile)"
249 class="@(sliderLayout == "slider" ? swiffyClasses : "")">
250 <ul style="padding: 0; margin: 0!important;"
251 class="capo-slider-container @(sliderLayout == "grid" ? "grid grid-1 grid-md-2 grid-lg-3 grid-xl-4" : "slider-container new")">
252 @foreach (ProductViewModel product in Model.Products)
253 {
254 //var link = product.GetProductLink(GetPageIdByNavigationTag("Shop"), false);
255256 // Capo fix for multi-shop links, get a group that is actually in the current shoup and use that in the link
257 var defaultGroup = product.PrimaryOrDefaultGroup;
258 string selectedDetailPage = defaultGroup != null ? Dynamicweb.Ecommerce.Services.ProductGroups.GetGroup(defaultGroup.Id)?.Meta.PrimaryPage : string.Empty;
259 string variantIdForLink = !string.IsNullOrEmpty(product.VariantId) ? $"&VariantID={product.VariantId}" : "";
260261 Dynamicweb.Ecommerce.Products.Product productObject = Dynamicweb.Ecommerce.Services.Products.GetProductById(product.Id, "", Pageview.Area.EcomLanguageId);
262 Dynamicweb.Ecommerce.Products.Group firstGroupInShopContext = productObject.GetDefaultGroupByShopId(Pageview.Area.EcomShopId, false);
263 string groupIdstr = firstGroupInShopContext != null ? firstGroupInShopContext.Id : "";
264265 // Hela systematiken med olika detailsPage funkar ju inte ihop med SearchEngineFriendlyURLs, vid pekning direkt på en product-details undersida blir det ju sketna urler tex: /sortiment/product-details?GroupID=10100&ProductID=SAI-M02
266 string link = "Default.aspx?ID=" + GetPageIdByNavigationTag("Shop").ToString();
267 //string link = string.IsNullOrEmpty(selectedDetailPage) ? $"Default.aspx?ID={detailsPageLink}" : selectedDetailPage;
268 link += $"&GroupID={groupIdstr}";
269 link += $"&ProductID={Dynamicweb.Context.Current.Server.UrlEncode(product.Id)}";
270 link += variantIdForLink;
271 link = Dynamicweb.Frontend.SearchEngineFriendlyURLs.GetFriendlyUrl(link);
272273274 string clickProductLink = string.Empty;
275 string saleBadgeType = !string.IsNullOrEmpty(Dynamicweb.Context.Current.Request.Form.Get("SaleBadgeType")) ? Dynamicweb.Context.Current.Request.Form.Get("SaleBadgeType") : "";
276 string saleBadgeCssClassName = !string.IsNullOrEmpty(Dynamicweb.Context.Current.Request.Form.Get("SaleBadgeCssClassName")) ? Dynamicweb.Context.Current.Request.Form.Get("SaleBadgeCssClassName") : "";
277 string newBadgeCssClassName = !string.IsNullOrEmpty(Dynamicweb.Context.Current.Request.Form.Get("NewBadgeCssClassName")) ? Dynamicweb.Context.Current.Request.Form.Get("NewBadgeCssClassName") : "";
278 int newPublicationDays = !string.IsNullOrEmpty(Dynamicweb.Context.Current.Request.Form.Get("NewPublicationDays")) ? Convert.ToInt32(Dynamicweb.Context.Current.Request.Form.Get("NewPublicationDays")) : 0;
279 string campaignBadgesValues = !string.IsNullOrEmpty(Dynamicweb.Context.Current.Request.Form.Get("CampaignBadgesValues")) ? Dynamicweb.Context.Current.Request.Form.Get("CampaignBadgesValues") : "";
280281 var badgeParms = new Dictionary<string, object>();
282 badgeParms.Add("saleBadgeType", saleBadgeType);
283 badgeParms.Add("saleBadgeCssClassName", saleBadgeCssClassName);
284 badgeParms.Add("newBadgeCssClassName", newBadgeCssClassName);
285 badgeParms.Add("campaignBadgesValues", campaignBadgesValues);
286 badgeParms.Add("newPublicationDays", newPublicationDays);
287288 bool saleBadgeEnabled = !string.IsNullOrWhiteSpace(saleBadgeCssClassName) && saleBadgeCssClassName != "none" ? true : false;
289 bool newBadgeEnabled = !string.IsNullOrWhiteSpace(newBadgeCssClassName) && newBadgeCssClassName != "none" ? true : false;
290 DateTime createdDate = product.Created.Value;
291 bool showBadges = saleBadgeEnabled && product.Discount.Price != 0 ? true : false;
292 showBadges = (newBadgeEnabled && newPublicationDays == 0) || (newBadgeEnabled && (createdDate.AddDays(newPublicationDays) > DateTime.Now)) ? true : showBadges;
293 showBadges = !string.IsNullOrEmpty(campaignBadgesValues) ? true : showBadges;
294 bool customSalesBadges = (bool)Pageview.AreaSettings.GetValue("setInAdmin");
295296 if ((!string.IsNullOrWhiteSpace(googleAnalyticsMeasurementID) || !string.IsNullOrWhiteSpace(googleTagManagerID)) && allowTracking)
297 {
298 clickProductLink = "onclick=\"return clickProductLink('" + @product.Id + "', '" + @product.Name + "', '" + @product.VariantName + "', '" + @product.Price.CurrencyCode + "', '" + @product.Price.Price + "')\"";
299 }
300301 if (Dynamicweb.Context.Current.Items.Contains("ProductDetails"))
302 {
303 Dynamicweb.Context.Current.Items["ProductDetails"] = product;
304 }
305 else
306 {
307 Dynamicweb.Context.Current.Items.Add("ProductDetails", product);
308 }
309310 <li class="d-flex flex-column @listItemTheme @listItemPaddingClass p-4 sundqvist-primary"
311 style="justify-content: space-between; position: relative;">
312 @if (showBadges || customSalesBadges)
313 {
314 <div class="position-absolute top-0 left-0 p-1 p-lg-2" style="z-index: 2">
315 @{@RenderPartial("Components/EcommerceBadge.cshtml", product, badgeParms)}
316 </div>
317 }
318 <a
319 href="@link"
320 class="stretched-link w-100 h-100"
321 style="position: absolute; left: 0; top: 0;"
322 @clickProductLink
323 >
324 <span class="visually-hidden">@product.Name</span>
325 </a>
326327 @{
328 @RenderGrid(listItemSourcePageId)
329 }
330 </li>
331 }
332333 @if (!Model.Products.Any() && Pageview.IsVisualEditorMode)
334 {
335 foreach (ProductViewModel product in Model.Products)
336 {
337 var link = Model.Products.First().GetProductLink(GetPageIdByNavigationTag("Shop"), false);
338 string clickProductLink = string.Empty;
339340 if ((!string.IsNullOrWhiteSpace(googleAnalyticsMeasurementID) || !string.IsNullOrWhiteSpace(googleTagManagerID)) && allowTracking)
341 {
342 clickProductLink = "onclick=\"return clickProductLink('" + @product.Id + "', '" + @product.Name + "', '" + @product.VariantName + "', '" + @product.Price.CurrencyCode + "', '" + @product.Price.Price + "')\"";
343 }
344345 if (Dynamicweb.Context.Current.Items.Contains("ProductDetails"))
346 {
347 Dynamicweb.Context.Current.Items["ProductDetails"] = GetDummyProduct();
348 }
349 else
350 {
351 Dynamicweb.Context.Current.Items.Add("ProductDetails", GetDummyProduct());
352 }
353354 for (int i = 0; i < 4; i++)
355 {
356 <li class="d-flex flex-column @listItemTheme @listItemPaddingClass">
357358 <a href="@link"
359 class="stretched-link"
360 @clickProductLink>
361 <span class="visually-hidden">@product.Name</span>
362 </a>
363 @{
364 @RenderGrid(listItemSourcePageId)
365 }
366 </li>
367 }
368 }
369 }
370 </ul>
371372 @{
373 int gridColumnSizeInt = int.TryParse(gridColumnSize, out var n) ? n : 0;
374 }
375 @if (!hideSliderNavigation && sliderLayout == "slider" && (Model.Products.Count() > gridColumnSizeInt))
376 {
377 <button type="button" title="@Translate("Previous slide")" class="slider-nav" style="z-index:2;">
378 <span class="visually-hidden">@Translate("Previous slide")</span>
379 </button>
380 <button type="button" title="@Translate("Next slide")" class="slider-nav slider-nav-next" style="z-index:2;">
381 <span class="visually-hidden">@Translate("Next slide")</span>
382 </button>
383384 }
385386 @if (indicatorStyle != "slider-indicators-hidden" && sliderLayout == "slider")
387 {
388 bool isActive = true;
389 int slideCount = 1;
390391 <div class="slider-indicators" style="z-index:2;">
392 @foreach (var item in Model.Products)
393 {
394 <button @(isActive ? "class=\"active\"" : string.Empty) type="button" title='@Translate("Go to slide") @slideCount'>
395 <span class="visually-hidden">@Translate("Go to slide") @slideCount</span>
396 </button>
397 {
398 slideCount++;
399 }
400 isActive = false;
401 }
402 </div>
403 }
404 </div>
405 </div>
406 }
407408 <script type="module">
409 swiffyslider.initSlider(document.querySelector('#slider_@(modelId)'));
410 </script>
411 }
412 }
413 else if (Pageview.IsVisualEditorMode == true)
414 {
415 <div class="alert alert-dark" role="alert">
416 <span>@Translate("Product component slider: The slider will be rendered here, if there is anything to show")</span>
417 </div>
418 }
419