1 @inherits ViewModelTemplate<ProductListViewModel>
2 @using Dynamicweb.Core.Encoders;
3 @using Dynamicweb.Frontend
4 @using Dynamicweb.Rendering
5 @using Dynamicweb.Ecommerce.ProductCatalog
6 @using Dynamicweb.Environment
7 @using Smartpage.PhilipsonWine.Ecommerce.ProductInformation
8
9 @* CUSTOMIZED STANDARD SWIFT (v1.21.0) TEMPLATE *@
10
11 @functions {
12 public ProductViewModel GetDummyProduct()
13 {
14 ProductViewModel product = null;
15 if (Dynamicweb.Context.Current.Items.Contains("ProductDetails"))
16 {
17 product = (ProductViewModel)Dynamicweb.Context.Current.Items["ProductDetails"];
18 }
19 else if (Pageview.Item["DummyProduct"] != null && Pageview.IsVisualEditorMode)
20 {
21 ProductListViewModel productList = Pageview.GetPageviewModel().Item.GetValue<ProductListViewModel>("DummyProduct");
22 if (productList?.Products is object)
23 {
24 product = productList.Products[0];
25 }
26 }
27
28 return product;
29 }
30 }
31
32 @{
33 string googleTagManagerID = Pageview.AreaSettings.GetString("GoogleTagManagerID");
34 string googleAnalyticsMeasurementID = Pageview.AreaSettings.GetString("GoogleAnalyticsMeasurementID");
35
36 bool allowTracking = true;
37 if (CookieManager.IsCookieManagementActive)
38 {
39 var cookieOptInLevel = CookieManager.GetCookieOptInLevel();
40 allowTracking = cookieOptInLevel == CookieOptInLevel.All || (cookieOptInLevel == CookieOptInLevel.Functional && CookieManager.GetCookieOptInCategories().Contains("Statistical"));
41 }
42
43 int paragraphId = !string.IsNullOrEmpty(Dynamicweb.Context.Current.Request.Form.Get("ParagraphId")) ? Convert.ToInt32(Dynamicweb.Context.Current.Request.Form.Get("ParagraphId")) : 0;
44 var paragraph = Dynamicweb.Content.Services.Paragraphs?.GetParagraph(paragraphId) ?? null;
45 ParagraphInfoViewModel paragraphViewModel = Dynamicweb.Frontend.ContentViewModelFactory.CreateParagraphInfoViewModel(paragraph);
46
47 string contentPadding = paragraphViewModel.Item.GetRawValueString("ContentPadding");
48
49 int listItemSourcePageId = paragraphViewModel.Item.GetInt32("ListComponentSource");
50 var page = listItemSourcePageId != 0 ? Dynamicweb.Content.Services.Pages.GetPage(listItemSourcePageId) : null;
51 }
52
53
54 @if (paragraphViewModel != null && page != null)
55 {
56 if (Model.Products.Any())
57 {
58 string sourceType = paragraphViewModel.Item.GetRawValueString("RelationType", "Trending");
59 int modelId = paragraphViewModel.ID;
60
61 string navigationStyle = paragraphViewModel.Item.GetRawValueString("NavigationStyle", "slider-nav-round");
62 string navigationPlacement = paragraphViewModel.Item.GetRawValueString("NavigationPlacement", "slider-nav-on-slides");
63 string indicatorStyle = paragraphViewModel.Item.GetRawValueString("IndicatorStyle", string.Empty);
64 string revealSlides = paragraphViewModel.Item.GetRawValueString("RevealSlides", "no-reveal") == "reveal" ? "slider-item-reveal" : string.Empty;
65 string sliderItemsGap = paragraphViewModel.Item.GetRawValueString("SliderItemsGap", "slider-item-gap") == "slider-item-nogap" ? "slider-item-nogap" : string.Empty;
66 string navigationAlwaysVisible = (paragraphViewModel.Item.GetBoolean("NavigationAlwaysVisible")) ? "slider-nav-visible" : string.Empty;
67 string navigationVisibleOnTouch = (paragraphViewModel.Item.GetBoolean("NavigationVisibleOnTouch")) ? "slider-nav-touch" : string.Empty;
68 string navigationShowScrollbar = (paragraphViewModel.Item.GetBoolean("NavigationShowScrollbar")) ? "slider-nav-scrollbar" : string.Empty;
69 string scrollBarForceMobile = (paragraphViewModel.Item.GetBoolean("NavigationShowScrollbar")) ? "--swiffy-slider-track-height:0.5rem !important;" : string.Empty;
70 string navigationSmall = (paragraphViewModel.Item.GetBoolean("NavigationSmall")) ? "slider-nav-sm" : string.Empty;
71 string navigationInvertColors = (paragraphViewModel.Item.GetBoolean("NavigationInvertColors")) ? "slider-nav-dark" : string.Empty;
72 string navigationSlideEntirePage = (paragraphViewModel.Item.GetBoolean("NavigationSlideEntirePage")) ? "slider-nav-page" : string.Empty;
73 string navigationNoLoop = (paragraphViewModel.Item.GetBoolean("NavigationNoLoop")) ? "slider-nav-noloop" : string.Empty;
74 string indicatorsOutsideSlider = (paragraphViewModel.Item.GetBoolean("IndicatorsOutsideSlider") && indicatorStyle != string.Empty) ? "slider-indicators-outside" : string.Empty;
75 string indicatorsHighlightActive = (paragraphViewModel.Item.GetBoolean("IndicatorsHighlightActive")) ? "slider-indicators-highlight" : string.Empty;
76 string indicatorsInvertColors = (paragraphViewModel.Item.GetBoolean("IndicatorsInvertedColors")) ? "slider-indicators-dark" : string.Empty;
77 string indicatorsVisibleOnSmallDevices = (paragraphViewModel.Item.GetBoolean("IndicatorsVisibleOnSmallDevices")) ? "slider-indicators-sm" : string.Empty;
78 string animation = paragraphViewModel.Item.GetRawValueString("Animation", string.Empty) != string.Empty ? $"slider-nav-animation {paragraphViewModel.Item.GetRawValueString("Animation")}" : string.Empty;
79 string autoplay = (paragraphViewModel.Item.GetBoolean("Autoplay")) ? "slider-nav-autoplay" : string.Empty;
80 string autoplayInterval = paragraphViewModel.Item.GetRawValueString("AutoplayInterval", string.Empty);
81 bool hideSliderNavigation = false;
82
83 string gridColumnSize = paragraphViewModel.Item.GetRawValueString("SliderLayout", "3");
84 int itemsShown = Convert.ToInt32(gridColumnSize);
85
86 var pageViewModel = Dynamicweb.Frontend.ContentViewModelFactory.CreatePageInfoViewModel(page);
87 string listItemTheme = " theme " + paragraphViewModel.Item.GetRawValueString("Theme", string.Empty).Replace(" ", "").Trim().ToLower();
88 string listItemPadding = pageViewModel.Item.GetRawValueString("ContentPadding", string.Empty);
89 string listItemPaddingClass = string.Empty;
90
91 switch (listItemPadding)
92 {
93 case "":
94 listItemPaddingClass = "";
95 break;
96 case "small":
97 listItemPaddingClass = " p-2 p-xl-3";
98 break;
99 }
100
101 if (sourceType == "selected")
102 {
103 string productIds = !string.IsNullOrEmpty(Dynamicweb.Context.Current.Request.Form.Get("MainProductID")) ? Dynamicweb.Context.Current.Request.Form.Get("MainProductID") : string.Empty;
104 productIds = string.IsNullOrEmpty(productIds) ? Dynamicweb.Context.Current.Request.Form.Get("ProductVariantId") : productIds;
105
106 Model.Products = Model.Products.OrderBy(product => productIds.IndexOf(product.Id)).ToList();
107 }
108
109 if (navigationStyle == "slider-nav-none")
110 {
111 hideSliderNavigation = true;
112 }
113
114 // Custom
115 if (sourceType == "selected-in-focus" && !string.IsNullOrEmpty(Dynamicweb.Context.Current.Request.GetString("CustomSortByIds")))
116 {
117 var customSortBy = Dynamicweb.Context.Current.Request.GetString("CustomSortByIds").Split(',');
118 if (customSortBy.Length > 1)
119 {
120 Model.Products = Model.Products.OrderBy(i => Array.IndexOf(customSortBy, i.Id)).ToList();
121 }
122 }
123 //-- Custom
124
125 <div class="grid gap-0 @contentPadding">
126 <div id="slider_@(modelId)" class="g-col-12 swiffy-slider slider-item-show@(itemsShown) @(navigationStyle) @(revealSlides) @(navigationPlacement) @(navigationAlwaysVisible) @(navigationVisibleOnTouch) @(indicatorStyle) @(navigationShowScrollbar) @(navigationSmall) @(navigationInvertColors) @(indicatorsOutsideSlider) @(navigationNoLoop) @(indicatorsHighlightActive) @(indicatorsInvertColors) @(indicatorsVisibleOnSmallDevices) @(navigationSlideEntirePage)" style="--swiffy-slider-nav-light:var(--swift-foreground-color);--swiffy-slider-nav-dark:var(--swift-background-color);@(scrollBarForceMobile)">
127 <ul class="slider-container">
128 @foreach (ExtendedProductViewModel product in Model.Products)
129 {
130 string link = product.GetProductLink(GetPageIdByNavigationTag("Shop"));
131
132 string clickProductLink = string.Empty;
133 if ((!string.IsNullOrWhiteSpace(googleAnalyticsMeasurementID) || !string.IsNullOrWhiteSpace(googleTagManagerID)) && allowTracking)
134 {
135 clickProductLink = "onclick=\"return clickProductLink('" + @product.Id + "', '" + @product.Name + "', '" + @product.VariantName + "', '" + @product.Price.CurrencyCode + "', '" + @product.Price.Price + "')\"";
136 }
137
138 if (Dynamicweb.Context.Current.Items.Contains("ProductDetails"))
139 {
140 Dynamicweb.Context.Current.Items["ProductDetails"] = product;
141 }
142 else
143 {
144 Dynamicweb.Context.Current.Items.Add("ProductDetails", product);
145 }
146
147 <li class="product-slider-list-item d-flex flex-column rounded-5 h-100 @listItemTheme @listItemPaddingClass">
148 <a href="@link" class="stretched-link" @clickProductLink>
149 <span class="visually-hidden">@product.Name</span>
150 </a>
151 @{
152 @RenderGrid(listItemSourcePageId)
153 }
154 </li>
155 }
156
157 @if (!Model.Products.Any() && Pageview.IsVisualEditorMode)
158 {
159 if (Dynamicweb.Context.Current.Items.Contains("ProductDetails"))
160 {
161 Dynamicweb.Context.Current.Items["ProductDetails"] = GetDummyProduct();
162 }
163 else
164 {
165 Dynamicweb.Context.Current.Items.Add("ProductDetails", GetDummyProduct());
166 }
167
168 for (int i = 0; i < 4; i++)
169 {
170 <li class="product-slider-list-item d-flex flex-column rounded-5 h-100 @listItemTheme @listItemPaddingClass">
171 @{
172 @RenderGrid(listItemSourcePageId)
173 }
174 </li>
175 }
176 }
177 </ul>
178
179 @if (!hideSliderNavigation)
180 {
181 <button type="button" title="@HtmlEncoder.HtmlAttributeEncode(Translate("Previous slide"))" class="slider-nav" style="z-index:2;">
182 <span class="visually-hidden">@Translate("Previous slide")</span>
183 </button>
184 <button type="button" title="@HtmlEncoder.HtmlAttributeEncode(Translate("Next slide"))" class="slider-nav slider-nav-next" style="z-index:2;">
185 <span class="visually-hidden">@Translate("Next slide")</span>
186 </button>
187 }
188
189 @if (indicatorStyle != "slider-indicators-hidden")
190 {
191 bool isActive = true;
192 int slideCount = 1;
193
194 <div class="slider-indicators" style="z-index:2;">
195 @foreach (var item in Model.Products)
196 {
197 <button @(isActive ? "class=\"active\"" : string.Empty) type="button" title="@HtmlEncoder.HtmlAttributeEncode(Translate("Go to slide")) @slideCount">
198 <span class="visually-hidden">@Translate("Go to slide") @slideCount</span>
199 </button>
200 {
201 slideCount++;
202 }
203 isActive = false;
204 }
205 </div>
206 }
207 </div>
208 </div>
209
210 <script type="module">
211 swiffyslider.initSlider(document.querySelector('#slider_@(modelId)'));
212 </script>
213 }
214 }
215 else if (Pageview.IsVisualEditorMode == true)
216 {
217 <div class="alert alert-dark" role="alert">
218 <span>@Translate("Product component slider: The slider will be rendered here, if there is anything to show")</span>
219 </div>
220 }
221
