Skip to content

Commit

Permalink
[*] BO : #PSCFV-12359 #PSCSX-1257 product tab async loading
Browse files Browse the repository at this point in the history
  • Loading branch information
@gRoussac @julienbourdeau
gRoussac authored and julienbourdeau committed Oct 23, 2015
1 parent 9f692c6 commit 68d052a
Show file tree
Hide file tree
Showing 3 changed files with 55 additions and 82 deletions.
17 changes: 7 additions & 10 deletions admin-dev/themes/default/template/controllers/products/helpers/form/form.tpl
View file
Expand Up @@ -73,15 +73,14 @@
</div>
</div>
<script type="text/javascript">
var id_product = {if isset($product->id)}{$product->id}{else}0{/if};
var id_lang_default = {$id_lang_default};
var product_type_pack = {Product::PTYPE_PACK};
var product_type_virtual = {Product::PTYPE_VIRTUAL};
var product_type_simple = {Product::PTYPE_SIMPLE};
var id_product = {if isset($product->id)}{$product->id|intval}{else}0{/if};
var id_lang_default = {$id_lang_default|intval};
var product_type_pack = {Product::PTYPE_PACK|intval};
var product_type_virtual = {Product::PTYPE_VIRTUAL|intval};
var product_type_simple = {Product::PTYPE_SIMPLE|intval};
var has_combinations = {$has_combinations};
var has_combinations = {$has_combinations|intval};
var toload = new Array();
var empty_pack_msg = '{l s='This pack is empty. You will need to add at least one product to the pack before you can save.' js=1}';
var empty_name_msg = '{l s='The product name is empty. You will at least need to enter a name for the default language before you can save the product.' js=1}';
var empty_link_rewrite_msg = '{l s='The friendly URL is empty. You will at least need to enter a friendly URL for the default language before you can save the product.' slashes=1}';
Expand All @@ -102,7 +101,6 @@
var display_multishop_checkboxes = false;
{/if}
var tabs_preloaded = new Array();
var tabs_to_preload = new Array();
var mod_evasive = {if isset($mod_evasive) && $mod_evasive}true{else}false{/if};
var mod_security = {if isset($mod_security) && $mod_security}true{else}false{/if};
Expand Down Expand Up @@ -224,8 +222,7 @@
tabs_to_preload.push('{$tab_name}');
{/if}
{/foreach}
// Recursively load tabs starting with the first element of stack
tabs_manager.tabs_to_preload = tabs_to_preload.slice(0);
tabs_manager.displayBulk(tabs_to_preload);
$('.productTabs').show();
$('#product-tab-content-wait').hide();
Expand Down
109 changes: 48 additions & 61 deletions js/admin/products.js
View file
Expand Up @@ -28,8 +28,9 @@
function ProductTabsManager(){
var self = this;
this.product_tabs = [];
this.tabs_to_preload = [];
this.current_request;
this.stack_error = [];
this.stack_done = [];
this.page_reloading = false;
this.has_error_loading_tabs = false;

Expand All @@ -47,8 +48,10 @@ function ProductTabsManager(){
*/
this.init = function() {
for (var tab_name in this.product_tabs) {
if (this.product_tabs[tab_name].onReady !== undefined && this.product_tabs[tab_name] !== this.product_tabs['Pack'] )
if (this.product_tabs[tab_name].onReady !== undefined && this.product_tabs[tab_name] !== this.product_tabs['Pack'])
{
this.onLoad(tab_name, this.product_tabs[tab_name].onReady);
}
}

$('.shopList.chzn-done').on('change', function(){
Expand Down Expand Up @@ -92,21 +95,15 @@ function ProductTabsManager(){
*/
this.display = function (tab_name, selected)
{
/*In order to prevent mod_evasive DOSPageInterval (Default 1s)*/
if (mod_evasive)
sleep(1000);

var tab_selector = $("#product-tab-content-" + tab_name);
$('#product-tab-content-wait').hide();

// Is the tab already being loaded?
if (tab_selector.hasClass('not-loaded') && !tab_selector.hasClass('loading'))
{
// Mark the tab as being currently loading
tab_selector.addClass('loading');

if (selected)
$('#product-tab-content-wait').show();

// send $_POST array with the request to be able to retrieve posted data if there was an error while saving product
var data;
var send_type = 'GET';
Expand All @@ -117,7 +114,6 @@ function ProductTabsManager(){
// set key_tab so that the ajax call returns the display for the current tab
data.key_tab = tab_name;
}

return $.ajax({
url : $('#link-' + tab_name).attr('href') + '&ajax=1' + ($('#page').length ? '&page=' + parseInt($('#page').val()) : '') + '&rand=' + + new Date().getTime(),
async : true,
Expand All @@ -134,16 +130,17 @@ function ProductTabsManager(){
if (selected)
{
$("#link-"+tab_name).addClass('selected');
$('#product-tab-content-wait').hide();
tab_selector.show();
}
self.stack_done.push(tab_name);
tab_selector.trigger('loaded');
},
complete : function(data)
{
tab_selector.removeClass('loading');
if (selected)
{
$('#product-tab-content-wait').hide();
tab_selector.trigger('displayed');
}
},
Expand All @@ -152,75 +149,65 @@ function ProductTabsManager(){
// don't display the loading notification bar
if (typeof(ajax_running_timeout) !== 'undefined')
clearTimeout(ajax_running_timeout);
if (selected) {
$('#product-tab-content-wait').show();
}
}
});
}
}

/**
* Send an ajax call for each tab in the stack, binding each call to the "complete" event of the previous call
* Send an ajax call for each tab in the stack
*
* @param array stack contains tab names as strings
*/
this.displayBulk = function(stack){
if (stack.length == 0)
{
$('[name="submitAddproductAndStay"]').each(function() {
$(this).prop('disabled', false).find('i').removeClass('process-icon-loading').addClass('process-icon-save');
});
$('[name="submitAddproduct"]').each(function() {
$(this).prop('disabled', false).find('i').removeClass('process-icon-loading').addClass('process-icon-save');
});
this.allow_hide_other_languages = true;

return false;
}

this.current_request = this.display(stack[0], false);
this.current_request = this.display(stack[0], false);

if (this.current_request !== undefined)
{
this.current_request.complete(function(request, status) {
var wrong_statuses = new Array('abort', 'error', 'timeout');
var wrong_status_code = new Array(400, 401, 403, 404, 405, 406, 408, 410, 413, 429, 499, 500, 502, 503, 504);

if ((status === 'abort' || status === 'error' || request.responseText.length == 0 || in_array(request.status, wrong_status_code) || self.stack_error.length !== 0) && !self.page_reloading)
{
var current_tab = stack[0];
self.stack_error.push(stack.shift());
self.has_error_loading_tabs = true;
if ((in_array(status, wrong_statuses) || in_array(request.status, wrong_status_code)) && !self.page_reloading) {
var current_tab = '';
if (request.responseText !== 'undefined' && request.responseText && request.responseText.length) {
current_tab = $(request.responseText).filter('.product-tab').attr('id').replace('product-', '');
}

jConfirm('Tab : ' + current_tab + ' (' + request.status + ')\n' + reload_tab_description, reload_tab_title, function(confirm) {
if (confirm === true)
{
self.page_reloading = true;
self.displayBulk(stack);
}
else
{
$('[name="submitAddproductAndStay"]').each(function() {
$(this).prop('disabled', false).find('i').removeClass('process-icon-loading').addClass('process-icon-save');
});
$('[name="submitAddproduct"]').each(function() {
$(this).prop('disabled', false).find('i').removeClass('process-icon-loading').addClass('process-icon-save');
});
self.allow_hide_other_languages = true;

return false;
}
});
}
else if (stack.length !== 0 && status !== 'abort')
{
stack.shift();
self.displayBulk(stack);
jAlert((current_tab ? 'Tab : ' + current_tab : '') + ' (' + (request.status ? request.status + ' ' : '' ) + request.statusText + ')\n' + reload_tab_description, reload_tab_title);
self.page_reloading = true;
self.has_error_loading_tabs = true;
clearTimeout(tabs_running_timeout);
return false;
}
else if (!self.has_error_loading_tabs && (self.stack_done.length === self.tabs_to_preload.length)) {
$('[name="submitAddproductAndStay"]').each(function() {
$(this).prop('disabled', false).find('i').removeClass('process-icon-loading').addClass('process-icon-save');
});
$('[name="submitAddproduct"]').each(function() {
$(this).prop('disabled', false).find('i').removeClass('process-icon-loading').addClass('process-icon-save');
});
this.allow_hide_other_languages = true;
clearTimeout(tabs_running_timeout);
return false;
}
return true;
});
}
else
{
stack.shift();
self.displayBulk(stack);
/*In order to prevent mod_evasive DOSPageInterval (Default 1s)*/
var time = 0;
if (mod_evasive) {
time = 1000;
}
var tabs_running_timeout = setTimeout(function(){
stack.shift();
if (stack.length > 0) {
self.displayBulk(stack);
}
}, time);
}
}

Expand Down Expand Up @@ -1454,10 +1441,10 @@ product_tabs['Quantities'] = new function(){
showSuccessMessage(quantities_ajax_success);
},
error: function(jqXHR, textStatus, errorThrown)
{
{
if (textStatus != 'error' || errorThrown != '')
showErrorMessage(textStatus + ': ' + errorThrown);
}
}
});
};

Expand Down
11 changes: 0 additions & 11 deletions js/tools.js
View file
Expand Up @@ -593,17 +593,6 @@ function isCleanHtml(content)
return true;
}

function sleep(milliseconds)
{
var start = new Date().getTime();

for (var i = 0; i < 1e7; i++) {
if ((new Date().getTime() - start) > milliseconds) {
break;
}
}
}

function getStorageAvailable() {
test = 'foo';
storage = window.localStorage || window.sessionStorage;
Expand Down

1 comment on commit 68d052a

@Nobodaddy
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Really sophisticated improvement! Thumbs up! 👍

Please sign in to comment.