Ajax based features to improve your OpenCart store. Reduce server load and increase your conversion rate.
Features:
✯ Loading the product list without need of reloading the page✯ Support pagination, sorting & filters
✯ Compatible with almost any theme or modification
OVERWRITE
No files are overwrittenCOMPATIBILITY
☞ Module should be compatible with almost any theme or modificationREQUIREMENTS
☞ Latest vQmod extension is requiredGALLERY
INSTALL
- Upload all files in upload folder to your opencart directory.
- DONE !
Source code
Prohibition of copying and distribution without permission.
JavaScript:
$().ready(function(){
function init() {
var $content = $('#content').css('position', 'relative');
if( ! $content.length )
return;
var $productFilter = $content.find('.product-filter');
//var $productList = $content.find('.product-list');
function createParams( url, o ) {
var p = url.split('?')[1];
if( typeof o == 'undefined' )
o = {};
if( typeof p != 'undefined' ) {
p = p.replace(/&/g, '&');
p = p.split('&');
for( var i = 0; i < p.length; i++ ) {
var key = p[i].split('=')[0];
var val = p[i].split('=')[1];
if( typeof key != 'undefined' && typeof val != 'undefined' )
o[key] = val;
}
}
return o;
}
function createLoader() {
var top = $productFilter.length ? $productFilter.offset().top + $productFilter.height() - 20 : $content.height() / 4;
if( $content.offset().top + top + 80 > $content.offset().top + $content.height() )
top -= 80;
return $('<i>')
.css({
'display' : 'block',
'position' : 'absolute',
'z-index' : '9',
'width' : $content.outerWidth() + 'px',
'height' : $content.outerHeight() + 'px',
'background': 'rgba(255,255,255,0.5)',
'text-align': 'center',
'padding' : '0',
'margin' : '0',
'cursor' : 'wait'
})
.append($('<img>')
.attr( 'src', 'catalog/view/theme/default/image/ajax-loading.gif' )
.css('margin-top', top + 'px')
)
.prependTo( $content );
}
var remembers = [ 'limit', 'sort' ];
var url = document.location.href;
var params = createParams( url );
var isLocked = false;
$productFilter.find('select').unbind('change').removeAttr('onchange').bind('change', function(){
params = createParams( $(this).val(), params );
ajax();
return false;
});
$('.pagination a').bind('click', function(){
params = createParams( $(this).attr('href'), params );
ajax();
return false;
});
$('#button-search').unbind('click').bind('click', function(){
var hasFilter = false;
function _set( $this ) {
var name = $this.attr('name');
var value = $this.val();
if( $this.prop('tagName').toLowerCase() == 'input' ) {
switch( $this.attr('type') ) {
case 'checkbox' :
case 'radio' : {
if( ! $this.is(':checked') )
value = '';
}
}
}
params[name] = value;
}
$content.find('[name^="filter_"]').each(function(){
_set( $(this) );
hasFilter = true;
});
if( ! hasFilter ) {
$content.find('[name="search"],[name="category_id"],[name="description"]').each(function(){
_set( $(this) );
});
}
ajax();
return false;
}).each(function(){
var $input = $content.find('input[name="filter_name"]');
if( ! $input.length )
$content.find('input[name="search"]');
$content.unbind('keydown').bind('keydown', function(e){
if( e.keyCode == 13 ){
$('#button-search').trigger('click');
return false;
}
return true;
});
});
$('#button-filter').unbind('click').bind('click', function(){
var filter = [];
$('.box-filter input[type="checkbox"]:checked').each(function() {
filter.push( $(this).val() );
});
params['filter'] = filter.join(',');
ajax();
return false;
});
function ajax() {
if( isLocked )
return;
isLocked = true;
// aktywuj loader
var loader = createLoader();
var response = null;
var ready = false;
var interval = setInterval(function(){
onLoad();
}, 100);
$('html, body').animate({
scrollTop: $productFilter.length ? $productFilter.offset().top : $content.offset().top
}, 800).promise().done(function(){
clearInterval( interval );
ready = true;
setTimeout(function(){
onLoad();
}, 100);
});
function onLoad() {
if( response === null || ! ready )
return;
clearInterval( interval );
loader.remove();
isLocked = false;
var contents = $('<div>').append( response ).find('#content > *');
/*if( ! contents.length ) {
contents = $("<div>").append( response ).find("#content-center > *");
$content = $('#content-center');
}*/
if( contents.length ) {
$content.html( contents );
if( typeof display == 'function' ) {
var dis = null;
if( typeof $.cookie == 'function' )
dis = $.cookie('display');
if( ! dis && typeof $.totalStorage == 'function' )
dis = $.totalStorage('display');
if( dis )
display( dis );
}
} else {
window.location.href = url;
}
init();
}
$.ajax({
'type' : 'GET',
'data' : params,
'url' : url.split('?')[0],
'cache' : false,
'timeout' : 10000,
'success' : function( res ) {
response = res;
},
'error' : function() {
window.location.href = url;
}
});
}
}
init();
});
Prohibition of copying and distribution without permission.
