Server : Apache System : Linux server2.corals.io 4.18.0-348.2.1.el8_5.x86_64 #1 SMP Mon Nov 15 09:17:08 EST 2021 x86_64 User : corals ( 1002) PHP Version : 7.4.33 Disable Function : exec,passthru,shell_exec,system Directory : /home/corals/old/app/code/Soon/AjaxScroll/view/frontend/web/js/ |
/**
* @license http://opensource.org/licenses/osl-3.0.php Open Software License (OSL 3.0)
* @author Hervé Guétin <[email protected]> <@herveguetin>
* @copyright Copyright (c) 2017 Agence Soon (http://www.agence-soon.fr)
*/
define([
'jquery',
'mage/template'
], function ($, mageTemplate) {
'use strict';
$.widget('soon.ajaxScroll', {
options: {
buttonTemplateSelector: '#soon_ajaxscroll_button_template',
// Below are default options that are overriden from template.
// @see Soon/AjaxScroll/view/frontend/templates/js.phtml
current_page: 1,
last_page: 1,
items_per_page: 1,
collection_count: 10,
is_infinite: false,
repeat_container: true
},
button: false,
buttonContainer: $('[soon_ajaxscroll_button]'),
pager: {},
productListSelector: '[soon_ajaxscroll]',
isLoading: false,
_create: function () {
this.doHistory();
this.doButton();
this.createUrl();
this.loadPreviousPages();
this.listen();
},
doHistory: function () {
// Init history on page load
history.pushState(this.options, 'soon_ajaxscroll', this.pager[this.options.current_page]);
// Listen to "back" and "forward" buttons hits
window.onpopstate = function (event) {
// Replace our options with the 'state' property of history
this.options = event.state;
this.scrollToCurentPage();
}.bind(this);
},
/**
* The "Show next X products" button below the products list
*/
doButton: function () {
var buttonTemplate = mageTemplate(this.options.buttonTemplateSelector);
this.buttonContainer.html(buttonTemplate(this.buttonData()));
this.button = this.buttonContainer;
if (
this.options.current_page >= this.options.last_page
|| this.options.is_infinite
) {
this.buttonContainer.html(null);
this.button = false;
}
},
buttonData: function () {
var displayed = this.options.current_page * this.options.items_per_page;
var total = this.options.collection_count;
return {
data: {
displayed: displayed,
total: total,
count: (this.options.current_page === this.options.last_page - 1)
? total - displayed
: this.options.items_per_page
}
};
},
/**
* Create URLs for pages
*/
createUrl: function () {
for (var initPage = 1; initPage <= this.options.last_page; initPage++) {
this.pager[initPage] = this.replaceUrlParam(window.location.href, 'p', initPage);
}
var domPager = $('div.pages');
domPager.hide();
},
replaceUrlParam: function(url, paramName, paramValue)
{
if (paramValue == null) {
paramValue = '';
}
var pattern = new RegExp('\\b('+paramName+'=).*?(&|#|$)');
if (url.search(pattern)>=0) {
return url.replace(pattern,'$1' + paramValue + '$2');
}
url = url.replace(/[?#]$/,'');
return url + (url.indexOf('?')>0 ? '&' : '?') + paramName + '=' + paramValue;
},
/**
* Load all products from page 1 to current page
*/
loadPreviousPages: function () {
if (this.getPageRequestArg() && this.getPageRequestArg() > 1) {
var url = this.pager[this.options.current_page]
+ '&isSoonAjaxScroll=1&SoonAjaxScrollProductInit='
+ this.options.current_page * this.options.items_per_page;
this.ajax(url, this.onSeveralPagesResponse.bind(this));
}
},
getPageRequestArg: function () {
var url_string = window.location.href;
var url = new URL(url_string);
var p = url.searchParams.get('p');
return (p == null) ? false : parseInt(p);
},
/**
* Event listeners
*/
listen: function () {
if (this.button) {
this.button.on('click', function () {
this.scroll();
}.bind(this));
}
if (this.options.is_infinite) {
$(window).scroll(function () {
if (this.canScroll()) this.scroll();
}.bind(this));
}
},
canScroll: function () {
if (
this.options.current_page >= this.options.last_page
|| this.isLoading
) {
return false;
}
var hT = this.buttonContainer.offset().top,
hH = this.buttonContainer.outerHeight(),
wH = $(window).height(),
wS = $(window).scrollTop();
return (wS > (hT + hH - wH));
},
scroll: function () {
var href = this.pager[this.options.current_page + 1];
// Update the browser history:
// . change location.href without reloading the page
// . fill the 'state' property of history with our options
var state = Object.assign({}, this.options);
state.current_page++;
history.pushState(state, 'soon_ajaxscroll', href);
this.ajax(href + '&isSoonAjaxScroll=1', this.onSinglePageResponse.bind(this));
},
ajax: function (url, cb) {
this.loading(true);
$(document).trigger('soon_ajaxscroll:start');
$.ajax({url: url, cache: true})
.always(function () {
this.loading(false);
$(document).trigger('soon_ajaxscroll:stop')
}.bind(this))
.then(function (response) {
cb(response);
}.bind(this));
},
loading: function (flag) {
this.isLoading = flag;
var method = (flag) ? 'addClass' : 'removeClass';
$('body')[method]('soon_ajaxscroll-loading');
if (this.button) this.button[method]('loading');
},
onSinglePageResponse: function (response) {
this.updateItems(response);
this.options.current_page++;
this.doButton();
},
onSeveralPagesResponse: function (response) {
this.updateItems(response, true);
this.scrollToCurentPage();
},
scrollToCurentPage: function () {
var elIndexToScrollTo = (this.options.current_page - 1) * this.options.items_per_page;
var elToScrollTo = $(this.productListSelector + ' .product-item:eq(' + elIndexToScrollTo + ')');
$('html, body').animate({
scrollTop: elToScrollTo.offset().top
}, 500);
},
updateItems: function (data, replace) {
if (replace) {
$(this.productListSelector).html(data);
} else {
if (!this.options.repeat_container) {
$(this.productListSelector).children().first().append($(data).html());
} else {
$(this.productListSelector).append(data);
}
}
$(this.productListSelector).trigger('contentUpdated');
$(document).trigger('soon_ajaxscroll:populated');
}
});
return $.soon.ajaxScroll;
});