[*] BO : #PI-107 refactoring product page JS - adding ProductTabsManager

This commit is contained in:
tDidierjean
2012-04-03 09:34:56 +00:00
parent b8cc96dbb9
commit e5624fb883
10 changed files with 708 additions and 648 deletions
@@ -90,40 +90,4 @@
</table>
<div class="clear">&nbsp;</div>
<input type="hidden" name="arrayAttachments" id="arrayAttachments" value="{foreach $attach1 as $attach}{$attach.id_attachment},{/foreach}" />
<script type="text/javascript">
$(document).ready(function(){
$("#addAttachment").live('click', function() {
$("#selectAttachment2 option:selected").each(function(){
var val = $('#arrayAttachments').val();
var tab = val.split(',');
for (var i=0; i < tab.length; i++)
if (tab[i] == $(this).val())
return false;
$('#arrayAttachments').val(val+$(this).val()+',');
});
return !$("#selectAttachment2 option:selected").remove().appendTo("#selectAttachment1");
});
$("#removeAttachment").live('click', function() {
$("#selectAttachment1 option:selected").each(function(){
var val = $('#arrayAttachments').val();
var tab = val.split(',');
var tabs = '';
for (var i=0; i < tab.length; i++)
if (tab[i] != $(this).val())
{
tabs = tabs+','+tab[i];
$('#arrayAttachments').val(tabs);
}
});
return !$("#selectAttachment1 option:selected").remove().appendTo("#selectAttachment2");
});
$("#product").submit(function() {
$("#selectAttachment1 option").each(function(i) {
$(this).attr("selected", "selected");
});
});
});
</script>
{/if}
@@ -25,15 +25,15 @@
*}
<script type="text/javascript">
var msg_combination_1 = '{l s='Please choose an attribute'}';
var msg_combination_2 = '{l s='Please choose a value'}';
var msg_combination_3 = '{l s='You can only add one combination per type of attribute'}';
var msg_new_combination = '{l s='New combination'}';
$(document).ready(function(){
{if $product->is_virtual}
$('#virtual_good_attributes').show();
{/if}
var msg_combination_1 = '{l s='Please choose an attribute'}';
var msg_combination_2 = '{l s='Please choose a value'}';
var msg_combination_3 = '{l s='You can only add one combination per type of attribute'}';
var msg_new_combination = '{l s='New combination'}';
});
</script>
@@ -98,11 +98,4 @@
<img src="../img/admin/add.gif" alt="new_features" title="{l s='Add a new feature'}" />&nbsp;{l s='Add a new feature'}
</a>
</div>
<script type="text/javascript">
$(document).ready(function(){
displayFlags(languages, id_language, allowEmployeeFormLang);
});
</script>
{/if}
@@ -28,7 +28,7 @@
{block name="autoload_tinyMCE"}
// Execute when tab Informations has finished loading
new ProductTab('Informations').onDisplay(function(){
tabs_manager.onLoad('Informations', function(){
// change each by click to load only on click
$(".autoload_rte").each(function(e){
tinySetup({
@@ -93,17 +93,22 @@
var post_data = {$post_data};
var product_type;
{*var is_pack = {$is_pack};
var is_virtual = {$product->is_virtual};
var mce_maximum = '{l s='Maximum'}';
var mce_characters = '{l s='characters'}';*}
$(document).ready(function()
{
product_type = $("input[name=type_product]:checked").val();
$('#product-tab-content-wait').show();
{if $is_pack}
new ProductTab('Informations').onDisplay(function(){
tabs_manager.onLoad('Informations', function(){
$('#pack_product').attr('checked', 'checked');
});
$('li.tab-row a[id*="VirtualProduct"]').hide();
{elseif $product->is_virtual}
new ProductTab('Informations').onDisplay(function(){
tabs_manager.onLoad('Informations', function(){
$('#virtual_product').attr('checked', 'checked');
$('#condition').attr('disabled', 'disabled');
$('#condition option[value=new]').attr('selected', 'selected');
@@ -111,7 +116,7 @@
$('li.tab-row a[id*="Pack"]').hide();
$('li.tab-row a[id*="Shipping"]').hide();
{else}
new ProductTab('Informations').onDisplay(function(){
tabs_manager.onLoad('Informations', function(){
$('#simple_product').attr('checked', 'checked');
});
$('li.tab-row a[id*="Pack"]').hide();
@@ -159,20 +164,20 @@
{
$('li.tab-row a[id*="VirtualProduct"]').show().click();
new ProductTab('VirtualProduct').onDisplay(function(){
tabs_manager.onLoad('VirtualProduct', function(){
$('#is_virtual_good').attr('checked', true);
$('#virtual_good').show();
$('#is_virtual').val(1);
$("#virtual_good_attributes").show();
});
new ProductTab('Quantities').onDisplay(function(){
tabs_manager.onLoad('Quantities', function(){
$('.stockForVirtualProduct').hide();
});
$('li.tab-row a[id*="Shipping"]').hide();
new ProductTab('Informations').onDisplay(function(){
tabs_manager.onLoad('Informations', function(){
$('#condition').attr('disabled', 'disabled');
$('#condition option[value=refurbished]').removeAttr('selected');
$('#condition option[value=used]').removeAttr('selected');
@@ -215,7 +220,7 @@
}
if ($("#product-tab-content-"+id).hasClass('not-loaded') && !$("#product-tab-content-"+id).hasClass('loading'))
ProductTab.display(id, true, 0, null);
tabs_manager.display(id, true, 0, null);
else
{
$("#product-tab-content-"+id).show(0, function(){
@@ -249,7 +254,7 @@
if ($('#product-tab-content-Associations').hasClass('not-loaded'))
disableSave();
new ProductTab('Associations').onDisplay(function(){
tabs_manager.onLoad('Associations', function(){
handleSaveButtons();
});
@@ -275,7 +280,7 @@
{/foreach}
// Recursively load tabs starting with the first element of stack
ProductTab.display(tabs_to_preload[0], false, 0, tabs_to_preload);
tabs_manager.display(tabs_to_preload[0], false, 0, tabs_to_preload);
$('.productTabs').show();
$('#product_form').show();
@@ -115,31 +115,17 @@
<td class="col-left"><label>{l s='Options:'}</label></td>
<td style="padding-bottom:5px;">
<ul class="listForm">
<li><input type="checkbox" name="available_for_order" id="available_for_order" value="1" {if $product->available_for_order}checked="checked"{/if} />
<script type="text/javascript">
$(document).ready(function()
{
$("#available_for_order").click(function(){
if ($(this).is(':checked'))
{
$('#show_price').attr('checked', 'checked');
$('#show_price').attr('disabled', 'disabled');
}
else
{
$('#show_price').attr('disabled', '');
}
});
});
</script>
<label for="available_for_order" class="t">{l s='available for order'}</label></li>
<li>
<input type="checkbox" name="available_for_order" id="available_for_order" value="1" {if $product->available_for_order}checked="checked"{/if} />
<label for="available_for_order" class="t">{l s='available for order'}</label>
</li>
<li>
<input type="checkbox" name="show_price" id="show_price" value="1" {if $product->show_price}checked="checked"{/if} {if $product->available_for_order}disabled="disabled"{/if}/>
<label for="show_price" class="t">{l s='show price'}</label>
<input type="checkbox" name="show_price" id="show_price" value="1" {if $product->show_price}checked="checked"{/if} {if $product->available_for_order}disabled="disabled"{/if}/>
<label for="show_price" class="t">{l s='show price'}</label>
</li>
<li>
<input type="checkbox" name="online_only" id="online_only" value="1" {if $product->online_only}checked="checked"{/if} />
<label for="online_only" class="t">{l s='online only (not sold in store)'}</label>
<input type="checkbox" name="online_only" id="online_only" value="1" {if $product->online_only}checked="checked"{/if} />
<label for="online_only" class="t">{l s='online only (not sold in store)'}</label>
</li>
</td>
</tr>
@@ -251,37 +237,6 @@
</td>
</tr>
</table>
<script type="text/javascript">
$(function() {
changeTagImage();
$('#createImageDescription input').change(function(){
changeTagImage();
});
var i = 0;
$('.addImageDescription').click(function(){
if (i == 0){
$('#createImageDescription').animate({
opacity: 1, height: 'toggle'
}, 500);
i = 1;
}else{
$('#createImageDescription').animate({
opacity: 0, height: 'toggle'
}, 500);
i = 0;
}
});
});
function changeTagImage(){
var smallImage = $('input[name=smallImage]:checked').attr('value');
var leftRight = $('input[name=leftRight]:checked').attr('value');
var imageTypes = $('input[name=imageTypes]:checked').attr('value');
var tag = '[img-'+smallImage+'-'+leftRight+'-'+imageTypes+']';
$('#resultImage').val(tag);
}
</script>
{/if}
<table>
<tr>
@@ -25,138 +25,8 @@
*}
<script type="text/javascript">
var msg_select_one = '{l s='Please select at least one product.' js=1}';
var msg_set_quantity = '{l s='Please set a quantity to add a product.' js=1}';
$(document).ready(function() {
if ($('#ppack').attr('checked'))
{
$('#ppack').attr('disabled', 'disabled');
$('#ppackdiv').show();
}
$('div.ppack').hide();
$('#curPackItemName').autocomplete('ajax_products_list.php', {
delay: 100,
minChars: 1,
autoFill: true,
max:20,
matchContains: true,
mustMatch:true,
scroll:false,
cacheLength:0,
// param multipleSeparator:'||' ajouté à cause de bug dans lib autocomplete
multipleSeparator:'||',
formatItem: function(item) {
return item[1]+' - '+item[0];
},
extraParams: {
excludeIds : getSelectedIds(),
excludeVirtuals : 1
}
}).result(function(event, item){
$('#curPackItemId').val(item[1]);
});
});
function addPackItem()
{
var curPackItemId = $('#curPackItemId').val();
var curPackItemName = $('#curPackItemName').val();
var curPackItemQty = $('#curPackItemQty').val();
if (curPackItemId == '' || curPackItemName == '')
{
jAlert(msg_select_one);
return false;
}
else if (curPackItemId == '' || curPackItemQty == '')
{
jAlert(msg_set_quantity);
return false;
}
var lineDisplay = curPackItemQty+ 'x ' +curPackItemName;
var divContent = $('#divPackItems').html();
divContent += lineDisplay;
divContent += '<span onclick="delPackItem(' + curPackItemId + ');" style="cursor: pointer;"><img src="../img/admin/delete.gif" /></span><br />';
// QTYxID-QTYxID
// @todo : it should be better to create input for each items and each qty
// instead of only one separated by x, - and ¤
var line = curPackItemQty+ 'x' +curPackItemId;
$('#inputPackItems').val($('#inputPackItems').val() + line + '-');
$('#divPackItems').html(divContent);
$('#namePackItems').val($('#namePackItems').val() + lineDisplay + '¤');
$('#curPackItemId').val('');
$('#curPackItemName').val('');
$('p.listOfPack').show();
$('#curPackItemName').setOptions({
extraParams: {
excludeIds : getSelectedIds()
}
});
// show / hide save buttons
// if product has a name
handleSaveButtons();
}
function delPackItem(id)
{
var reg = new RegExp('-', 'g');
var regx = new RegExp('x', 'g');
var div = getE('divPackItems');
var input = getE('inputPackItems');
var name = getE('namePackItems');
var select = getE('curPackItemId');
var select_quantity = getE('curPackItemQty');
var inputCut = input.value.split(reg);
var nameCut = name.value.split(new RegExp('¤', 'g'));
input.value = '';
name.value = '';
div.innerHTML = '';
for (var i = 0; i < inputCut.length; ++i)
if (inputCut[i])
{
var inputQty = inputCut[i].split(regx);
if (inputQty[1] != id)
{
input.value += inputCut[i] + '-';
name.value += nameCut[i] + '¤';
div.innerHTML += nameCut[i] + ' <span onclick="delPackItem(' + inputQty[1] + ');" style="cursor: pointer;"><img src="../img/admin/delete.gif" /></span><br />';
}
}
$('#curPackItemName').setOptions({
extraParams: {
excludeIds : getSelectedIds()
}
});
// if no item left in the pack, disable save buttons
handleSaveButtons();
}
function getSelectedIds()
{
var ids = '';
if (typeof(id_product) != 'undefined')
ids += id_product + ',';
ids += $('#inputPackItems').val().replace(/\d*x/g, '').replace(/\-/g,',');
ids = ids.replace(/\,$/,'');
return ids;
}
</script>
<h4>{l s='Pack'}</h4>
@@ -183,7 +53,7 @@
<input type="hidden" name="namePackItems" id="namePackItems" value="{$input_namepack_items}" />
<input type="hidden" size="2" id="curPackItemId" />
<span onclick="addPackItem();" class="button" style="cursor: pointer;">
<span id="add_pack_item" class="button" style="cursor: pointer;">
{l s='Add this product to the pack'}
</span>