https://www.scalabad.no/scripts/productlistsorter.js

1mcWeb.productListSorter = new (function ($) {
2   
3    'use strict';
4    var self = this;
5    self.service = new WebApiService("ProductVariant");
6    self.productListService = new WebApiService("ProductList");
7
8    self.load = function( ) {
9
10        var plid = "";
11        //todo: find plid from content of field
12        
13        self.sorterId = "productlist-sorter";
14
15        var data = {
16            motherProduktLagerId: plid,
17            isForSearch: jQuery("body.search-result-page").length > 0,
18            currentNodeId: jQuery("#hidden-nodeid").text()
19        };
20
21        self.service.GetAction("GetSorterData", data).then(function(result) {
22            if(self.bindingsApplied) {
23                ko.cleanNode(document.getElementById(self.sorterId))
24            }
25            self.vm = new viewModel(result);
26            ko.applyBindings(self.vm, document.getElementById(self.sorterId));
27            self.bindingsApplied = true;
28        });
29    };
30
31    function selectedSortingOptionName(sortingOptionsList) {
32        return sortingOptionsList.find(x => x.Selected() == true).Name;
33    }
34    function assignSelectedSortOption(sortingOptionsList, selectedOption) {
35        sortingOptionsList.forEach(x => x.Selected(x.Index == selectedOption.Index));
36    }
37
38    self.setActiveItem = function(selectedOption) {
39        var sortingOptionsList = mcWeb.productListSorter.vm.SorterList();
40        assignSelectedSortOption(sortingOptionsList, selectedOption);
41        mcWeb.productListSorter.vm.SorterText(`${mcWeb.productListSorter.vm.SortText} ${selectedSortingOptionName(sortingOptionsList)}`);
42    };
43
44    var viewModel = function(json) {
45        var view = this;
46
47        view.SorterList = ko.observableArray(json.SorterList);
48        if (view.SorterList().length > 0) {
49            for (var i = 0; i < view.SorterList().length; i++) {
50                var item = view.SorterList()[i];
51                item.Selected = ko.observable(item.Selected);
52            }
53        }
54        var selectedItem = view.SorterList()[json.SelectedSorterIndex];
55        view.SortText = json.SorterText;
56        view.SorterText = ko.observable(json.SorterText + " " + selectedItem.Name);
57
58        view.onChangeSort = function(item) {
59            try {
60
61                var data = {
62                    sortType: item.Val,
63                    order: item.Direction,
64                    nodeId: jQuery("#hidden-nodeid").text()
65                };
66
67                self.productListService.GetAction("SetSortType", data)
68                    .then(function (result) {
69                        var newUrl = mcWeb.ajaxRenderEngine.getCurrentFirstPage();
70                        mcWeb.ajaxRenderEngine.CurrentPageNumber = 1;
71                        window.history.pushState(newUrl,'',newUrl);
72                        mcWeb.ajaxRenderEngine.reloadProductListField();
73                        self.setActiveItem(item);
74                    });
75            } catch (e) {
76                console.error(e);
77            }
78        };
79    };
80
81
82})(jQuery);