var productSelectorService = (function() { return { products: [], selectedFilters: [], filter: function() { //reset the sort select var $sortSelect = $("#product-sort-select"); $sortSelect.val(''); $sortSelect.change(); //get filter settings var $berths = $("#input-range__berths"); var $maxNumberOfPeople = $("#input-range__persons"); var $hullLength = $("#input-range__hull"); var $beamOverall = $("#input-range__beam-overall"); var $checkedTypes = $(".type-checkbox:checked"); var $checkedRanges = $(".range-checkbox:checked"); var $checkedFuelTypes = $(".fuel-type-checkbox:checked"); var $checkedHpRange = $(".hp-range-checkbox:checked"); var $trailerable = $("#input-checkbox__trailerable"); var $notTrailerable = $("#input-checkbox__nottrailerable"); var $hiddenProducts = $("#hidden-products"); //re-enable compare checkbox $(".product-compare-checkbox").prop('disabled', false); productSelectorService.selectedFilters.length = 0; //handle items for filter option display productSelectorService.addSelectedCheckboxFilter($checkedTypes); productSelectorService.addSelectedRangeFilter($maxNumberOfPeople); productSelectorService.addSelectedRangeFilter($hullLength); productSelectorService.addSelectedRangeFilter($beamOverall); productSelectorService.addSelectedRangeFilter($berths); productSelectorService.addSelectedCheckboxFilter($checkedRanges); productSelectorService.addSelectedCheckboxFilter($checkedFuelTypes); productSelectorService.addSelectedCheckboxFilter($checkedHpRange); productSelectorService.addSelectedCheckboxFilter($trailerable); productSelectorService.addSelectedCheckboxFilter($notTrailerable); $(".custom-selector-type").hide(); $(".custom-selector-type-generic").show(); if ($checkedTypes.length && $checkedTypes.length === 1) { var typeId = $(".custom-selector-type-specific").data("type-id"); $checkedTypes.each(function () { var checkedTypeId = $(this).data("id"); if (checkedTypeId === typeId) { $(".custom-selector-type").show(); $(".custom-selector-type-generic").hide(); } }); } var filtered = productSelectorService.products.filter(function (product) { //baseline filter using sliders var query = (product.Berths >= parseInt($berths.val()) && product.MaxNumberOfPeople >= parseInt($maxNumberOfPeople.val()) && product.HullLength >= parseFloat($hullLength.val().replace(",", ".")) && product.BeamOverall >= parseFloat($beamOverall.val().replace(",", "."))); var subquery; //handle checkboxes if ($checkedTypes.length) { $checkedTypes.each(function () { subquery = subquery || ($.inArray($(this).data("name"), product.Types) !== -1); }); query = query && subquery; } subquery = undefined; if ($checkedRanges.length) { $checkedRanges.each(function () { subquery = subquery || $(this).data("name") === product.Range; }); query = query && subquery; } subquery = undefined; if ($checkedFuelTypes.length) { $checkedFuelTypes.each(function () { subquery = subquery || ($.inArray($(this).data("name"), product.FuelTypes) !== -1); }); query = query && subquery; } subquery = undefined; if ($checkedHpRange.length) { $checkedHpRange.each(function () { subquery = subquery || ($.inArray($(this).data("name"), product.HpRange) !== -1); //subquery = subquery || $(this).data("name") === product.HpRange; }); query = query && subquery; } if ($trailerable.is(":checked")) { query = query && product.IsTrailerable; } if ($notTrailerable.is(":checked")) { query = query && !product.IsTrailerable; } return query; }); productSelectorService.hideAllProducts(); for (var i in filtered) { var $hiddenProduct = $hiddenProducts.find(".product_" + filtered[i].Id).clone(true); $("#shown-products").append($hiddenProduct); } productSelectorService.updateResultCount(); productSelectorService.updateSelectedFilters(); }, filterByTypeAndRangeOnly: function (types, ranges) { var $checkedTypes = $(".type-checkbox:checked"); var $checkedRanges = $(".range-checkbox:checked"); productSelectorService.selectedFilters.length = 0; productSelectorService.addSelectedCheckboxFilter($checkedTypes); productSelectorService.addSelectedCheckboxFilter($checkedRanges); var filtered = productSelectorService.products.filter(function (product) { var query = false; var subquery; if (types.length) { types.forEach(function (item) { query = query || ($.inArray(item, product.TypeUrlSegments) !== -1); }); } if (ranges.length) { ranges.forEach(function (item) { subquery = subquery || ($.inArray(item, product.RangeUrlSegments) !== -1); }); query = query || subquery; } return query; }); //console.info(filtered); productSelectorService.hideAllProducts(); var $hiddenProducts = $("#hidden-products"); for (var i in filtered) { var $hiddenProduct = $hiddenProducts.find(".product_" + filtered[i].Id).clone(true); $("#shown-products").append($hiddenProduct); } productSelectorService.updateResultCount(); productSelectorService.updateSelectedFilters(); }, loadProducts: function(callback) { $("#hidden-products .product").each(function() { var $p = $(this); productSelectorService.products.push({ Id: $p.data('product-id'), HullLength: parseFloat($p.data('hull-length').toString().replace(",", ".")), BeamOverall: parseFloat($p.data("beam-overall").toString().replace(",",".")), MaxNumberOfPeople: $p.data('max-people'), Berths: $p.data('berths'), Types: $p.data('types').split(","), Range: $p.data('range-type'), FuelTypes: $p.data('fuel-types').split(","), IsTrailerable: $p.data('trailerable') === "True", MinimumHp: $p.data('minimumhp'), HpRange: $p.data('range-hp').split(","), TypeUrlSegments: $p.data('type-url-segments').split(","), RangeUrlSegments: $p.data('range-url-segments').split(",") }); }); callback(); }, hideAllProducts: function() { var $shownProducts = $("#shown-products"); $shownProducts.find(".product").remove(); productSelectorService.updateResultCount(); productSelectorService.updateSelectedFilters(); }, showAllProducts: function () { var $shownProducts = $("#shown-products"); var $hiddenProducts = $("#hidden-products"); productSelectorService.selectedFilters.length = 0; productSelectorService.sortProducts(); $shownProducts.html($hiddenProducts.html()); productSelectorService.updateResultCount(); productSelectorService.updateSelectedFilters(); }, showProductsByTypeAndRange: function(typesAsCsv, rangesAsCsv) { var types = typesAsCsv.split(",").filter(function (el) { return el.length !== 0 }); var ranges = rangesAsCsv.split(",").filter(function (el) { return el.length !== 0 }); //check the right box types.forEach(function (item) { $(".type-checkbox[data-name-url-segment='" + item + "']").attr("checked", true); }); ranges.forEach(function (item) { $(".range-checkbox[data-name-url-segment='" + item + "']").attr("checked", true); }); this.filterByTypeAndRangeOnly(types, ranges); }, updateResultCount: function () { var $shownProducts = $("#shown-products .product"); $(".filter-head__results-title").text($shownProducts.length); var $resultSpan = $(".filter-head__results-subtitle"); if ($shownProducts.length != 1) { $resultSpan.text($resultSpan.data("resultsPlural")); } else { $resultSpan.text($resultSpan.data("resultsSingular")); } }, sortProducts: function() { var $select = $("#product-sort-select"); var selectValue = $select.val(); if (!selectValue) { return; } $("#shown-products .product").sort(function (a, b) { var keyA = $(a).data(selectValue); var keyB = $(b).data(selectValue); if (selectValue === "overall-length") { return (keyA > keyB) ? -1 : (keyA < keyB) ? 1 : 0; } return (keyA < keyB) ? -1 : (keyA > keyB) ? 1 : 0; }).appendTo("#shown-products"); }, getComparedItems: function (productIds, countryCode, languageCode, callback) { var url = "/umbraco/surface/productselectorcomparison/getcompareditems?productIdCsv=" + productIds.join(",") + "&countryCode=" + countryCode + "&languageCode=" + languageCode + "&culture=" + culture; $.ajax({ url: url, success: function (data) { callback(data); } }); }, scrollTo: function (id) { $('html, body').animate({ 'scrollTop': $("#" + id).offset().top - 140 }, 1000); }, addSelectedRangeFilter: function (el) { if (parseInt(el.val()) > parseInt(el.attr("min"))) { var $fieldset = el.closest(".filter__fieldset"); productSelectorService.selectedFilters.push({ label: $("> .filter__label", $fieldset).text(), value: el.prev(".helper--right").text() }); } }, addSelectedCheckboxFilter: function (el) { if (el.length && el.is(":checked")) { var $fieldset = el.eq(0).closest(".filter__fieldset"); productSelectorService.selectedFilters.push({ label: $("> .filter__label", $fieldset).text(), value: el.map(function () { return $(this).data("name") ? $(this).data("name") : $(this).next("label").text(); }).get() }); } }, updateSelectedFilters: function() { var $filterElement = $("#filter-options"); var $filterPlaceholder = $("#filter-options-placeholder", $filterElement); $filterPlaceholder.empty(); if (productSelectorService.selectedFilters.length) { productSelectorService.selectedFilters.forEach(function (el) { var value = el.value.constructor === Array ? el.value.join(", ") : el.value; $filterPlaceholder.append("" + el.label + ": " + value + ""); }); $filterElement.show(); } else { $filterElement.hide(); } } } })();