1 @inherits Dynamicweb.Rendering.RazorTemplateBase<Dynamicweb.Rendering.RazorTemplateModel<Dynamicweb.Rendering.Template>>
2 @using Dynamicweb.Rendering
3 @using System.IO
4 @using System.Web
5
6 @{
7 var request = Dynamicweb.Context.Current.Request;
8 var displayMode = "list";
9 List<LoopItem> products = GetLoop("Products").ToList();
10 //var productTest = Dynamicweb.Ecommerce.Products.Product.GetProductById("PROD855");
11 //var primaryGroup = Dynamicweb.Ecommerce.Products.Group.GetGroupById(productTest.PrimaryGroupId);
12
13 }
14 <style>
15 /* TOP */
16 .product-list-navigation select, .product-list-navigation .btn {
17 border-radius: 0;
18 }
19
20 .product-list-navigation label {
21 line-height: 32px;
22 }
23
24 .product-list-navigation .pagination > .active > a, .product-list-navigation .pagination > .active > a:focus, .product-list-navigation .pagination > .active > a:hover, .product-list-navigation .pagination > .active > span, .product-list-navigation .pagination > .active > span:focus, .product-list-navigation .pagination > .active > span:hover {
25 background-color: #3f6182;
26 border-color: #3f6182;
27 }
28
29 select.page-size {
30 display: inline-block;
31 width: initial;
32 }
33
34 form .product-list-page-sorting, .product-list-page-sorting.bottom-page-sorting {
35 background-color: #f0f0f0;
36 border: 1px solid #e2e2e2;
37 padding: 8px 15px 5px 15px;
38 border-radius: 0;
39 display: block;
40 margin-bottom: 15px;
41 margin-top: 5px;
42 }
43
44 .product-list-navigation label {
45 line-height: 32px;
46 font-weight: normal;
47 }
48
49 .product-list-navigation ul.pagination {
50 margin: 0;
51 }
52
53
54 /* PRODUCT LIST */
55 .list.product-list.display-list .product {
56 border-bottom: 1px solid #c0c0c0;
57 padding-bottom: 40px;
58 }
59
60 .list.product-list .product {
61 padding-top: 15px;
62 margin-bottom: 15px;
63 position: relative;
64 }
65
66 .list.product-list .product-image {
67 padding-left: 10px;
68 padding-right: 10px;
69 }
70
71 .list.product-list .product-image a {
72 display: block;
73 height: 140px;
74 }
75
76 .list.product-list .product-image img {
77 max-width: 100%;
78 max-height: 100%;
79 margin: 0 auto;
80 }
81
82 .list.product-list.display-list .product-name h3 {
83 margin-top: 0;
84 }
85
86 .list.product-list a.product-name:focus, .list.product-list a.product-name:hover {
87 text-decoration: none;
88 }
89
90 .list.product-list .product-name h3 {
91 font-size: 24px;
92 color: #ef7c00;
93 text-transform: uppercase;
94 white-space: nowrap;
95 overflow: hidden;
96 -ms-text-overflow: ellipsis;
97 -o-text-overflow: ellipsis;
98 text-overflow: ellipsis;
99 padding-right: 10px;
100 padding-left: 10px;
101 }
102
103 .list.product-list.display-list .product-number, .list.product-list.display-list .manufacturer-number {
104 font-style: italic;
105 }
106
107 .list.product-list .product .product-number, .list.product-list .product .manufacturer-number {
108 color: #808080;
109 font-size: 12px;
110 margin-bottom: 0;
111 margin-left: 10px;
112 }
113
114 .list.product-list .product .product-shortdescription {
115 margin-left: 10px;
116 margin-bottom: 10px;
117 }
118
119 .list.product-list .product .product-actions .product-price {
120 color: #333;
121 font-size: 20px;
122 line-height: 1;
123 margin-bottom: 15px;
124 }
125
126 .list.product-list.display-list .product-add-to-cart form > div[class^="col-xs"]:first-of-type {
127 padding-right: 3px;
128 }
129
130 .list.product-list.display-list .product-add-to-cart input.product-amount {
131 width: 100%;
132 padding: 5px 0 5px 12px;
133 }
134
135 .list.product-list.display-list .product-add-to-cart form > div[class^="col-xs"]:last-of-type {
136 padding-left: 3px;
137 padding-right: 0;
138 }
139
140 .list.product-list.display-list .product-add-to-cart .btn-primary {
141 width: 100%;
142 background-color: #ef7c00;
143 border-color: #ef7c00;
144 color: #fff;
145 border-radius: 0;
146 }
147
148 .list.product-list.display-list .product-add-to-cart .btn-primary:hover,
149 .list.product-list.display-list .product-add-to-cart .btn-primary:focus,
150 .list.product-list.display-list .product-add-to-cart .btn-primary:active {
151 background-color: #de7401;
152 border-color: #de7401;
153 }
154 </style>
155
156
157 @helper DisplayProducts(string displayMode) {
158 var products = GetLoop("Products");
159 var defaultImageSize = "200x200";
160 var defaultImageText = Translate("photo_missing", "Foto på vej");
161 var baseFilesPath = HttpContext.Current.Server.MapPath("/files");
162 var tryGetImage = false;
163 var filesPath = string.Empty;
164
165
166 if (Pageview.Area.Item.ContainsKey("Ecommerce_Product_Images_Folder")) {
167 var imagesFolder = (string)Pageview.Area.Item["Ecommerce_Product_Images_Folder"];
168
169 if (!string.IsNullOrEmpty(imagesFolder) && imagesFolder != "/") {
170 filesPath = HttpContext.Current.Server.MapPath(imagesFolder);
171 tryGetImage = true;
172 }
173 }
174
175 if (products.Count == 0) {
176 <div class="alert alert-info">@Translate("No_products_found", "Ingen produkter fundet")</div>
177 } else {
178 <div class="row">
179
180 @foreach (var product in products) {
181 var productStock = product.GetInteger("Ecom:Product.Stock");
182 var productNo = product.GetString("Ecom:Product.Number");
183 var productName = product.GetString("Ecom:Product.Name");
184 var productId = product.GetString("Ecom:Product.ID");
185 var productPageId = product.GetInteger("Ecom:Product.PrimaryOrCurrentPageID");
186 var productGroupId = product.GetString("Ecom:Product.PrimaryOrFirstGroupID");
187 var productImageSmall = product.GetString("Ecom:Product.ImageSmall.Clean");
188 var stockStateFew = Pageview.Area.Item.ContainsKey("Ecommerce_Product_Stockstate_Few") ? (int)Pageview.Area.Item["Ecommerce_Product_Stockstate_Few"] : 0;
189 var isNews = product.GetString("Ecom:Product:Field.News") == "True";
190 var isOffer = product.GetString("Ecom:Product:Field.Offer") == "True";
191 var imgPath = string.Empty;
192
193 var productHaveDiscount = product.GetBoolean("Ecom:Product.HaveDiscount") || isOffer;
194 var discount = product.GetLoop("ProductDiscounts").FirstOrDefault(o => o.GetBoolean("Ecom:Product.Discount.Amount.Currency.IsCurrent"));
195 var discountText = Translate("Offer", "Tilbud");
196
197 if (discount != null) {
198 if (string.Equals(discount.GetString("Ecom:Product.Discount.Type"), "percent", StringComparison.OrdinalIgnoreCase)) {
199 discountText = "-" + discount.GetString("Ecom:Product.Discount.PercentWithVAT") + "%";
200 } else {
201 discountText = "-" + discount.GetString("Ecom:Product.Discount.Amount.PriceWithVAT");
202 }
203 }
204
205 if (Pageview.Area.Item.ContainsKey("Ecommerce_Product_Page") && !string.IsNullOrEmpty((string)Pageview.Area.Item["Ecommerce_Product_Page"])) {
206 productPageId = int.Parse((string)Pageview.Area.Item["Ecommerce_Product_Page"]);
207 }
208
209 var productLink = "/Default.aspx?Id=" + productPageId + "&GroupId=" + productGroupId + "&ProductId=" + productId;
210
211 if (tryGetImage) {
212 var imageFiles = Directory.GetFiles(filesPath + "\\Small\\", productNo + "*", SearchOption.TopDirectoryOnly).Take(1).ToList();
213
214 if (imageFiles.Count == 1) {
215 imgPath = "/Files" + imageFiles[0].Replace(baseFilesPath, string.Empty).Replace("\\", "/");
216 }
217 }
218
219 if (displayMode != "list") {
220 <div class="col-xs-12 col-sm-6 col-md-4 list product-list display-gallery">
221 <div class="product" title="@(productName)">
222 <div class="product-image">
223 <a href="@(productLink)">
224 @if (!string.IsNullOrEmpty(productImageSmall)) {
225 <img src="@productImageSmall" alt="" class="img-responsive">
226 } else {
227 <img src="http://placehold.it/@(defaultImageSize)&text=@(defaultImageText)" alt="" class="img-responsive">
228 }
229 </a>
230 </div>
231 <a href="@(productLink)" class="product-name">
232 <h3>@productName</h3>
233 </a>
234 <div class="product-price-button">
235 <div class="clearfix">
236 <div class="pull-left">
237 <div class="product-price">
238 @if (product.GetDouble("Ecom:Product.Discount.Price.PriceWithVAT") == product.GetDouble("Ecom:Product.Price.Price")) {
239 <text>@product.GetValue("Ecom:Product.Price.Price") @product.GetValue("Ecom:Product.Price.CurrencyCode")</text>
240 } else {
241 <s>@product.GetValue("Ecom:Product.Price.Price") @product.GetValue("Ecom:Product.Price.CurrencyCode")</s>
242 <text>@product.GetValue("Ecom:Product.Discount.Price.Price") @product.GetValue("Ecom:Product.Price.CurrencyCode")</text>
243 }
244 </div>
245 @* <div class="product-stock-status">
246 @if (stockStateFew == 0) {
247 <span class="glyphicon glyphicon-ok"></span> <span>@Translate("stockstatus_instock","Varen er på lager")</span>
248 } else {
249 if (productStock > 0 && productStock <= stockStateFew && stockStateFew > 0) {
250 <span class="glyphicon glyphicon-exclamation-sign"></span> <span>@Translate("stockstatus_few","Få varer på lager")</span>
251 } else if (productStock > stockStateFew && productStock > 0) {
252 <span class="glyphicon glyphicon-ok"></span> <span>@Translate("stockstatus_instock","Varen er på lager")</span>
253 } else {
254 <span class="glyphicon glyphicon-remove"></span> <span>@Translate("stockstatus_none","Varen er ikke på lager")</span>
255 }
256 }
257 </div> *@
258 </div>
259 <div class="pull-right">
260 @if (Pageview.Area != null && Pageview.Area.Item.ContainsKey("Ecommerce_Basket_Enabled") && (bool)Pageview.Area.Item["Ecommerce_Basket_Enabled"]) {
261 var productAddLink = productLink + "&CartCmd=add";
262
263 if (!string.IsNullOrEmpty(product.GetString("Ecom:Product.VariantID"))) {
264 productAddLink += "&VariantId=" + product.GetString("Ecom:Product.VariantID");
265 }
266
267 <div class="text-right product-add-to-cart">
268 <a class="btn btn-primary" type="button" rel="nofollow" href="@(productAddLink)">@Translate("Add_to_cart", "Læg i kurv")</a>
269 </div>
270 }
271 @if (false) {
272 <div class="text-center product-add-to-favorites">
273 @if (bool.Parse(product.GetString("Ecom:Product.IsProductInFavoriteList")) == true) {
274 <a href="@product.GetValue("Ecom:Product.RemoveFromFavorites")" class="btn btn-warning">
275 <span class="glyphicon glyphicon-star"></span> @Translate("Remove_from_favorites", "Fjern fra favoritter")
276 </a>
277 } else {
278 <a href="@product.GetValue("Ecom:Product.AddToFavorites")" class="btn btn-warning">
279 <span class="glyphicon glyphicon-star"></span> @Translate("Add_to_favorites", "Føj til favoritter")
280 </a>
281 }
282 </div>
283 }
284 </div>
285 </div>
286 </div>
287
288 @if (productHaveDiscount) {
289 <div class="product-isoffer">
290 @(discountText)
291 </div>
292 } else if (isNews) {
293 <div class="product-isnews">
294 @Translate("News", "Nyhed")
295 </div>
296 }
297 </div>
298 </div>
299 } else {
300 <div class="col-xs-12 list product-list display-list">
301 <div class="product" title="@(productName)">
302 <div class="row">
303 <div class="product-image col-sm-3 col-md-2">
304
305 <!-- Discount sticker -->
306 @if (product.GetString("Ecom:Product.Discount.Price") != product.GetString("Ecom:Product.Price"))
307 {
308 <div class="discount-sticker" style="background-color:#337ab7;color:#FFFFFF ;position: absolute !important; z-index: 1 !important;" name="sticker">
309 <p style="padding:5px 10px;margin:0;">@Translate("On sale!", "On sale!")</p>
310 </div>
311 }
312 <a href="@(productLink)">
313 @if (!string.IsNullOrEmpty(productImageSmall))
314 {
315 var imageString = "/admin/Public/GetImage.ashx?Width=145&Height=140&Crop=1&Compression=70&Image=" + productImageSmall;
316 <img src="@imageString" alt="" class="img-responsive">
317 }
318 else
319 {
320 <img src="http://placehold.it/@(defaultImageSize)&text=@(defaultImageText)" alt="" class="img-responsive">
321 }
322 </a>
323 </div>
324 <div class="product-content col-xs-12 col-sm-5 col-md-7">
325 <div class="row">
326 <div class="col-xs-12">
327 <a href="@(productLink)" class="product-name">
328 <h3>@productName</h3>
329 </a>
330 @if (!string.IsNullOrEmpty(productNo)) {
331 <div class="product-number">
332 @Translate("product_number", "Produktnr.:") @productNo
333 </div>
334 }
335 <div class="product-shortdescription"><small>@product.GetValue("Ecom:Product.ShortDescription")</small></div>
336 </div>
337 </div>
338 </div>
339 <div class="product-actions col-xs-12 col-sm-4 col-md-3">
340 <div class="text-right product-price">
341 @if (product.GetDouble("Ecom:Product.Discount.Price.PriceWithVAT") == product.GetDouble("Ecom:Product.Price.Price")) {
342 <text>@product.GetValue("Ecom:Product.Price.Price") @product.GetValue("Ecom:Product.Price.CurrencyCode")</text>
343 } else {
344 <s>@product.GetValue("Ecom:Product.Price.Price") @product.GetValue("Ecom:Product.Price.CurrencyCode")</s>
345 <text>@product.GetValue("Ecom:Product.Discount.Price.Price") @product.GetValue("Ecom:Product.Price.CurrencyCode")</text>
346 }
347 </div>
348 @* <div class="product-stock-status col-xs-5 col-sm-12">
349 @if (stockStateFew == 0) {
350 <span class="glyphicon glyphicon-ok"></span> <span>@Translate("stockstatus_instock","Varen er på lager")</span>
351 } else {
352 if (productStock > 0 && productStock <= stockStateFew && stockStateFew > 0) {
353 <span class="glyphicon glyphicon-exclamation-sign"></span> <span>@Translate("stockstatus_few","Få varer på lager")</span>
354 } else if (productStock > stockStateFew && productStock > 0) {
355 <span class="glyphicon glyphicon-ok"></span> <span>@Translate("stockstatus_instock","Varen er på lager")</span>
356 } else {
357 <span class="glyphicon glyphicon-remove"></span> <span>@Translate("stockstatus_none","Varen er ikke på lager")</span>
358 }
359 }
360 </div> *@
361 @if (true) {
362 var productAddLink = productLink + "&CartCmd=add";
363
364 if (!string.IsNullOrEmpty(product.GetString("Ecom:Product.VariantID"))) {
365 productAddLink += "&VariantId=" + product.GetString("Ecom:Product.VariantID");
366 }
367
368 <div class="text-right product-add-to-cart">
369 @*<button class="btn btn-primary" rel="nofollow" href="@(productAddLink)">@Translate("Add_to_cart", "Læg i kurv")</button>*@
370
371 @* CF - Denne form er den originale fra Spica, bare hvis du ville slippe for at tænke for meget *@
372 <form method="post" role="form" id="form-@productId">
373 <input type="hidden" name="ID" value="@productPageId" />
374 <input type="hidden" name="ProductID" value="@productId" />
375 <input type="hidden" name="CartCmd" value="add">
376 @if (!string.IsNullOrEmpty(product.GetString("Ecom:Product.VariantID"))) {
377 string variantID = product.GetString("Ecom:Product.VariantID");
378 <input type="hidden" name="VariantId" value="@variantID" />
379 }
380 <div class="col-xs-4">
381 <input class="product-amount" name="quantity" min="1" value="1" type="number" placeholder="1" title="" />
382 </div>
383 <div class="col-xs-8">
384 <button type="submit" form="form-@productId" class="col-md-8 btn btn-primary" rel="nofollow" href="@(productAddLink)">@Translate("Add request")</button>
385 </div>
386 </form>
387
388 @*<form method="post" role="form" id="">
389
390 <div class="col-xs-4">
391 <input class="product-amount" name="quantity" min="1" value="1" type="number" placeholder="1" title="" />
392 </div>
393 <div class="col-xs-8">
394
395 <button class="btn btn-primary" rel="nofollow" href="@(productAddLink)">@Translate("Add_to_cart", "Læg i kurv")</button>
396
397 <button type="submit" form="" class="col-md-8 btn btn-primary" rel="nofollow" href="@(productAddLink))">@Translate("Add_request", "Add request")</button>
398 </div>
399 </form>*@
400 </div>
401 }
402 </div>
403 </div>
404
405 @if (productHaveDiscount) {
406 <div class="product-isoffer">
407 @(discountText)
408 </div>
409 } else if (isNews) {
410 <div class="product-isnews">
411 @Translate("News", "Nyhed")
412 </div>
413 }
414 </div>
415 </div>
416 }
417 }
418 </div>
419 }
420 }
421 @helper GetEcomNavigationDisplay(string displayMode, bool isTop = true) {
422 var request = HttpContext.Current.Request;
423 var productListPageSize = GetInteger("Ecom:ProductList.PageSize");
424 var pageNum = GetInteger("Ecom:ProductList.CurrentPage");
425 var GroupID = GetString("Ecom:ProductList.GroupID");
426 var sortBy = !string.IsNullOrEmpty(request["SortBy"]) ? request["SortBy"] : "Name";
427 var sortOrder = !string.IsNullOrEmpty(request["SortOrder"]) ? request["SortOrder"] : "ASC";
428 var productListSort = sortBy + "|" + sortOrder;
429
430 <div class="row product-list-navigation">
431 <div class="col-xs-12">
432 <form role="form" method="GET" action="">
433 <input type="hidden" class="navigation-display-input page-number" name="PageNum" value="@(pageNum)">
434 <input type="hidden" class="navigation-display-input page-size" name="PageSize" value="@(productListPageSize)">
435 <input type="hidden" class="navigation-display-input page-sort-by" name="SortBy" value="@(sortBy)">
436 <input type="hidden" class="navigation-display-input page-sort-order" name="SortOrder" value="@(sortOrder)">
437 <input type="hidden" class="navigation-display-input" name="GroupID" value="@(GroupID)">
438 <input type="hidden" class="navigation-display-input display-mode" name="DisplayMode" value="@(displayMode)">
439
440 @if (isTop) {
441 <div class="row">
442 <div class="col-xs-12 text-right">
443 <label class="control-label">@Translate("pagination_change_page_size", "Vis"): </label>
444 <select class="form-control page-size" onchange="pageSizeChanged(this);">
445 <option value="20" @(productListPageSize == 20 ? "selected=\"selected\"" : "")>20 @Translate("product_count_per_page", "pr. side")</option>
446 <option value="50" @(productListPageSize == 50 ? "selected=\"selected\"" : "")>50 @Translate("product_count_per_page", "pr. side")</option>
447 <option value="100" @(productListPageSize == 100 ? "selected=\"selected\"" : "")>100 @Translate("product_count_per_page", "pr. side")</option>
448 </select>
449 <!-- Removed the option to choose listview below, as this is not needed! -->
450 @*<div class="btn-group" role="toolbar">
451 <button type="submit" value="gallery" onclick="displayModeChanged(this);" class="btn btn-default btn-md @(displayMode == "list" ? "" : "active") "><i class="glyphicon glyphicon-th-large" aria-hidden="true"></i> @Translate("product_list_display_type_gallery", "Galleri")</button>
452 <button type="submit" value="list" onclick="displayModeChanged(this);" class="btn btn-default btn-md @(displayMode == "list" ? "active" : "") "><i class="glyphicon glyphicon-list" aria-hidden="true"></i> @Translate("product_list_display_type_æost", "Liste")</button>
453 </div>*@
454
455 @*<div class="product-list-display-mode">
456 <label class="control-label">@Translate("pagination_change_page_view", "Visning"): </label>
457 <div class="btn-group" role="toolbar">
458 <button type="submit" value="gallery" onclick="displayModeChanged(this);" class="btn btn-default btn-md @(displayMode == "list" ? "" : "active") "><span class="glyphicon glyphicon-th-large" aria-hidden="true"></span> @Translate("product_list_display_type_gallery", "Galleri")</button>
459 <button type="submit" value="list" onclick="displayModeChanged(this);" class="btn btn-default btn-md @(displayMode == "list" ? "active" : "") "><span class="glyphicon glyphicon-list" aria-hidden="true"></span> @Translate("product_list_display_type_æost", "Liste")</button>
460 </div>
461 </div>*@
462 </div>
463 </div>
464
465 <div class="product-list-page-sorting">
466 <div class="row">
467 <div class="col-xs-12 col-sm-6">
468 <label class="control-label">@Translate("pagination_change_sorting", "Sortering"): </label>
469 <select class="form-control page-size" onchange="sortChanged(this);">
470 <option value="Created|ASC" @(productListSort == "Created|ASC" ? "selected=\"selected\"" : "")>@Translate("product_sort_date_asc", "Nyheder")</option>
471 <option value="Price|ASC" @(productListSort == "Price|ASC" ? "selected=\"selected\"" : "")>@Translate("product_sort_price_asc", "Pris (laveste først)")</option>
472 <option value="Price|DESC" @(productListSort == "Price|DESC" ? "selected=\"selected\"" : "")>@Translate("product_sort_price_desc", "Pris (højeste først)")</option>
473 <option value="Name|ASC" @(productListSort == "Name|ASC" ? "selected=\"selected\"" : "")>@Translate("product_sort_name_asc", "Navn (a til å)")</option>
474 <option value="Name|DESC" @(productListSort == "Name|DESC" ? "selected=\"selected\"" : "")>@Translate("product_sort_name_desc", "Navn (å til a)")</option>
475 </select>
476 </div>
477 <div class="col-xs-12 col-sm-6 text-right">
478 @GetEcomPagination(displayMode)
479 </div>
480 </div>
481 </div>
482 } else {
483 <div class="product-list-page-sorting bottom-page-sorting text-right">
484 @GetEcomPagination(displayMode)
485 </div>
486 }
487 </form>
488 </div>
489 </div>
490 }
491 @helper GetEcomPagination(string displayMode) {
492 var pageSize = GetInteger("Ecom:ProductList.PageSize");
493 var totalProducts = GetInteger("Ecom:ProductList.PageProdCnt");
494 var currentPageNumber = GetInteger("Ecom:ProductList.CurrentPage");
495
496 var pageCount = totalProducts / pageSize; /** Integer division (returning integer) **/
497 var spare = totalProducts % pageSize;
498
499 if (spare > 0) {
500 pageCount++;
501 }
502
503 var initialPage = 1;
504
505 if (currentPageNumber - 2 > 0) {
506 initialPage = currentPageNumber - 2;
507
508 if (pageCount > 5) {
509 if (currentPageNumber + 2 >= pageCount) {
510 initialPage = pageCount - 4;
511 }
512 }
513 }
514
515 var endPage = pageCount >= 5 ? (currentPageNumber + 2 <= 5 ? 5 : (currentPageNumber + 2 > pageCount ? pageCount : currentPageNumber + 2)) : pageCount;
516 var formatString = "pageChanged(this, {0}); return false;";
517
518 <ul class="pagination">
519 <li class="@(currentPageNumber == 1 ? "disabled" : "")"><a href="#" onclick="@(string.Format(formatString, currentPageNumber - 1))">«</a></li>
520 @if (initialPage > 1) {
521 <li><a href="#" onclick="@(string.Format(formatString, 1))">1</a></li>
522 <li class="disabled"><a href="#">...</a></li>
523 }
524 @for (var pageNumber = initialPage; endPage >= pageNumber; pageNumber++) {
525 if (pageNumber == currentPageNumber) {
526 <li class="active"><a href="#" onclick="@(string.Format(formatString, pageNumber))">@pageNumber</a></li>
527 } else {
528 <li><a href="#" onclick="@(string.Format(formatString, pageNumber))">@pageNumber</a></li>
529 }
530 }
531 @if (pageCount > currentPageNumber + 2) {
532 <li class="disabled"><a href="#">...</a></li>
533 <li><a href="@(string.Format(formatString, pageCount))">@pageCount</a></li>
534 }
535 <li class="@(currentPageNumber == pageCount ? "disabled" : "")"><a href="#" onclick="@(string.Format(formatString, currentPageNumber + 1))">»</a></li>
536 </ul>
537 }
538
539 <div class="product-list-group-description">
540 @if (!string.IsNullOrEmpty(GetString("Ecom:Group.Name"))) {
541 <h1>@GetValue("Ecom:Group.Name")</h1>
542 }
543 @if (!string.IsNullOrEmpty(GetString("Ecom:Group.Description"))) {
544 <div>@GetValue("Ecom:Group.Description")</div>
545 }
546 </div>
547
548 <div class="row">
549 @if (string.IsNullOrWhiteSpace(GetString("Ecom:Search.SearchBox"))) {
550 <div class="col-md-12">
551 @GetEcomNavigationDisplay(displayMode)
552 @DisplayProducts(displayMode)
553 @GetEcomNavigationDisplay(displayMode, false)
554 </div>
555 } else {
556 <div class="col-md-3">
557 @GetValue("Ecom:Search.SearchBox")
558 </div>
559 <div class="col-md-9">
560 @DisplayProducts(displayMode)
561 </div>
562 }
563 </div>
564
565 <script type="text/javascript">
566 function pageSizeChanged(obj) {
567 $("input[type='hidden'].navigation-display-input.page-size").val(obj.options[obj.selectedIndex].value);
568 $("input[type='hidden'].navigation-display-input.page-number").val("1");
569 $(obj).closest("form").submit();
570 }
571
572 function sortChanged(obj) {
573 var sortOptions = obj.options[obj.selectedIndex].value.split('|');
574 $("input[type='hidden'].navigation-display-input.page-sort-by").val(sortOptions[0]);
575 $("input[type='hidden'].navigation-display-input.page-sort-order").val(sortOptions[1]);
576 $("input[type='hidden'].navigation-display-input.page-number").val("1");
577 $(obj).closest("form").submit();
578 }
579
580 function pageChanged(obj, newPage) {
581 $("input[type='hidden'].navigation-display-input.page-number").val(newPage);
582 $(obj).closest("form").submit();
583 }
584
585 function displayModeChanged(obj) {
586 $("input[type='hidden'].navigation-display-input.display-mode").val($(obj).val());
587 $(obj).closest("form").submit();
588 }
589 </script>