Categories refactoring

This commit is contained in:
franck
2013-09-06 15:56:06 +02:00
parent 7b3cd46261
commit 6fdf60b960
18 changed files with 634 additions and 423 deletions

View File

@@ -8,9 +8,7 @@
<div class="catalog">
<div id="wrapper" class="container">
<ul class="breadcrumb">
{include file="includes/category_breadcrumb.html"}
</ul>
{include file="includes/catalog-breadcrumb.html"}
{module_include location='catalog_top'}
@@ -20,7 +18,7 @@
<table class="table table-striped table-condensed" id="category_list">
<caption>
{* display parent category name, and get current cat ID *}
{loop name="category_title" type="category" visible="*" id="{$current_category_id}"}
{loop name="category_title" type="category" visible="*" id=$current_category_id}
{intl l="Categories in %cat" cat=$TITLE}
{$cat_id = $ID}
{/loop}
@@ -30,7 +28,7 @@
{module_include location='category_list_caption'}
{loop type="auth" name="can_create" roles="ADMIN" permissions="admin.category.create"}
{loop type="auth" name="can_create" roles="ADMIN" permissions="admin.categories.create"}
<a class="btn btn-default btn-primary action-btn" title="{intl l='Add a new category'}" href="#add_category_dialog" data-toggle="modal">
<span class="glyphicon glyphicon-plus-sign"></span>
</a>
@@ -40,6 +38,16 @@
{ifloop rel="category_list"}
<thead>
<tr>
<th class="object-title">
{admin_sortable_header
current_order=$category_order
order='id'
reverse_order='id_reverse'
path={url path='/admin/catalog' id_category=$current_category_id}
label="{intl l='ID'}"
}
</th>
<th class="object-image">&nbsp;</th>
<th class="object-title">
@@ -47,8 +55,8 @@
current_order=$category_order
order='alpha'
reverse_order='alpha_reverse'
path={url path='/admin/catalog/category' id="{$current_category_id}"}
label={intl l='Category title'}
path={url path='/admin/catalog' id_category=$current_category_id}
label="{intl l='Category title'}"
}
</th>
@@ -59,8 +67,8 @@
current_order=$category_order
order='visible'
reverse_order='visible_reverse'
path={url path='/admin/catalog/category' id="{$current_category_id}"}
label={intl l='Online'}
path={url path='/admin/catalog' id_category=$current_category_id}
label="{intl l='Online'}"
}
</th>
@@ -69,8 +77,8 @@
current_order=$category_order
order='manual'
reverse_order='manual_reverse'
path={url path='/admin/catalog/category' id="{$current_category_id}"}
label={intl l='Position'}
path={url path='/admin/catalog' id_category=$current_category_id}
label="{intl l='Position'}"
}
</th>
@@ -81,22 +89,24 @@
<tbody>
{loop name="category_list" type="category" visible="*" parent=$current_category_id order=$category_order backend_context="1" lang=$lang_id}
<tr>
<td>{$ID}</td>
<td>
i={$ID} {loop type="image" name="cat_image" source="category" source_id="$ID" limit="1" width="50" height="50" resize_mode="crop" backend_context="1"}
<a href="{url path='admin/catalog/category' id="$ID" action='browse'}" title="{intl l='Browse this category'}"><img class="img-thumbnail" src="#IMAGE_URL" alt="#TITLE" /></a>
{loop type="image" name="cat_image" source="category" source_id="$ID" limit="1" width="50" height="50" resize_mode="crop" backend_context="1"}
<a href="{url path='admin/catalog' category_id=$ID}" title="{intl l='Browse this category'}"><img class="img-thumbnail" src="#IMAGE_URL" alt="#TITLE" /></a>
{/loop}
</td>
<td class="object-title">
<a href="{url path='admin/catalog/category' id="$ID" action='browse'}" title="{intl l='Browse this category'}">
{$ID} p={$POSITION} {$TITLE}
<a href="{url path='admin/catalog' category_id=$ID}" title="{intl l='Browse this category'}">
{$TITLE}
</a>
</td>
{module_include location='category_list_row'}
<td>
{loop type="auth" name="can_change" roles="ADMIN" permissions="admin.category.edit"}
{loop type="auth" name="can_change" roles="ADMIN" permissions="admin.categories.edit"}
<div class="make-switch switch-small" data-on="success" data-off="danger" data-on-label="<i class='glyphicon glyphicon-ok'></i>" data-off-label="<i class='glyphicon glyphicon-remove'></i>">
<input type="checkbox" data-id="{$ID}" class="categoryVisibleToggle" {if $VISIBLE == 1}checked="checked"{/if}>
</div>
@@ -111,24 +121,24 @@
<td>
{admin_position_block
permission="admin.category.edit"
path={url path='admin/catalog/category' category_id="{$ID}"}
permission="admin.categories.edit"
path={url path='admin/category/update-position' category_id=$ID}
url_parameter="category_id"
in_place_edit_class="categoryPositionChange"
position="$POSITION"
id="$ID"
position=$POSITION
id=$ID
}
</td>
<td>
<div class="btn-group">
<a class="btn btn-default btn-xs" title="{intl l='Browse this category'}" href="{url path='admin/catalog/category' id="$ID" action='browse'}"><i class="glyphicon glyphicon-folder-open"></i></a>
<a class="btn btn-default btn-xs" title="{intl l='Browse this category'}" href="{url path='admin/category' category_id=$ID}"><i class="glyphicon glyphicon-folder-open"></i></a>
{loop type="auth" name="can_change" roles="ADMIN" permissions="admin.category.edit"}
<a class="btn btn-default btn-xs" title="{intl l='Edit this category'}" href="{url path='admin/catalog/category' id="$ID" action='edit'}"><i class="glyphicon glyphicon-edit"></i></a>
{loop type="auth" name="can_change" roles="ADMIN" permissions="admin.categories.edit"}
<a class="btn btn-default btn-xs" title="{intl l='Edit this category'}" href="{url path='/admin/categories/update' category_id=$ID}"><i class="glyphicon glyphicon-edit"></i></a>
{/loop}
{loop type="auth" name="can_delete" roles="ADMIN" permissions="admin.category.delete"}
{loop type="auth" name="can_delete" roles="ADMIN" permissions="admin.categories.delete"}
<a class="btn btn-default btn-xs category-delete" title="{intl l='Delete this category and all its contents'}" href="#delete_category_dialog" data-id="{$ID}" data-toggle="modal"><i class="glyphicon glyphicon-trash"></i></a>
{/loop}
</div>
@@ -143,7 +153,7 @@
<tr>
<td class="message">
<div class="alert alert-info">
{loop type="auth" name="can_create" roles="ADMIN" permissions="admin.category.create"}
{loop type="auth" name="can_create" roles="ADMIN" permissions="admin.categories.create"}
{intl l="This category has no sub-categories. To create a new one, click the + button above."}
{/loop}
@@ -166,9 +176,10 @@
<table class="table table-striped table-condensed">
<caption>
{* display parent category name *}
{loop name="category_title" type="category" visible="*" id="{$current_category_id}"}
{loop name="category_title" type="category" visible="*" id=$current_category_id}
{intl l="Products in %cat" cat=$TITLE}
{/loop}
{elseloop rel="category_title"}
{intl l="Top level Products"}
{/elseloop}
@@ -183,15 +194,34 @@
{ifloop rel="product_list"}
<thead>
<tr>
<th class="object-title">
{admin_sortable_header
current_order=$product_order
order='id'
reverse_order='id_reverse'
path={url path='/admin/product' category_id=$current_category_id}
label="{intl l='ID'}"
}
<th>&nbsp;</th>
<th class="object-title">
{admin_sortable_header
current_order=$product_order
order='ref'
reverse_order='ref_reverse'
path={url path='/admin/product' category_id=$current_category_id}
label="{intl l='Reference'}"
}
</th>
<th class="object-title">
{admin_sortable_header
current_order=$product_order
order='alpha'
reverse_order='alpha_reverse'
path={url path='/admin/catalog/product' id="{$current_category_id}"}
label={intl l='Product title'}
path={url path='/admin/product' category_id=$current_category_id}
label="{intl l='Product title'}"
}
{module_include location='product_list_header'}
@@ -201,8 +231,8 @@
current_order=$product_order
order='visible'
reverse_order='visible_reverse'
path={url path='/admin/catalog/product' id="{$current_category_id}"}
label={intl l='Online'}
path={url path='/admin/product' category_id=$current_category_id}
label="{intl l='Online'}"
}
</th>
@@ -211,8 +241,8 @@
current_order=$product_order
order='manual'
reverse_order='manual_reverse'
path={url path='/admin/catalog/product' id="{$current_category_id}"}
label={intl l='Position'}
path={url path='/admin/product' category_id=$current_category_id}
label="{intl l='Position'}"
}
</th>
@@ -221,37 +251,58 @@
</thead>
<tbody>
{loop name="product_list" type="product" category="{$current_category_id}" order="manual"}
{loop name="product_list" type="product" category=$current_category_id order="manual"}
<tr>
<td>{$ID}</td>
<td>
{loop type="image" name="cat_image" source="product" source_id="$ID" limit="1" width="50" height="50" resize_mode="crop" backend_context="1"}
<a href="{url path='admin/catalog/product' id="$ID" action='edit'}" title="{intl l='Edit this product'}">
<a href="{url path='admin/product/edit' id=$ID}" title="{intl l='Edit this product'}">
<img src="#IMAGE_URL" alt="#TITLE" />
</a>
{/loop}
<td class="object-title"><a href="{url path='admin/catalog/product' id="$ID" action='edit'}" title="{intl l='Edit this product'}">{$TITLE}</a></td>
<td class="object-title"><a href="{url path='admin/product/edit' id=$ID}" title="{intl l='Edit this product'}">{$REF}</a></td>
<td class="object-title"><a href="{url path='admin/product/edit' id=$ID}" title="{intl l='Edit this product'}">{$TITLE}</a></td>
{module_include location='product_list_row'}
<td>
<input type="checkbox" data-id="{$ID}" class="displayToggle" {if $VISIBLE == 1}checked="checked"{/if}>
{loop type="auth" name="can_change" roles="ADMIN" permissions="admin.products.edit"}
<div class="make-switch switch-small" data-on="success" data-off="danger" data-on-label="<i class='glyphicon glyphicon-ok'></i>" data-off-label="<i class='glyphicon glyphicon-remove'></i>">
<input type="checkbox" data-id="{$ID}" class="productVisibleToggle" {if $VISIBLE == 1}checked="checked"{/if}>
</div>
{/loop}
{elseloop rel="can_change"}
<div class="make-switch switch-small" data-on="success" data-off="danger" data-on-label="<i class='glyphicon glyphicon-ok'></i>" data-off-label="<i class='glyphicon glyphicon-remove'></i>">
<input type="checkbox" class="disabled" disabled="disabled" {if $VISIBLE == 1}checked="checked"{/if}>
</div>
{/elseloop}
</td>
<td>
{admin_position_block
permission="admin.product.edit"
path={url path='admin/catalog/product' category_id="{$ID}"}
path={url path='admin/product' category_id=$ID}
url_parameter="product_id"
in_place_edit_class="productPositionChange"
position="$POSITION"
id="$ID"
position=$POSITION
id=$ID
}
</td>
<td>
<a class="btn btn-default btn-xs" title="{intl l='Edit this product'}" href="{url path='admin/catalog/product' id="$ID" action='edit'}"><i class="glyphicon glyphicon-edit"></i></a>
<a class="btn btn-default btn-xs product-delete" title="{intl l='Delete this product'}" href="{url path='admin/catalog/product' id="$ID" action='delete'}"><i class="glyphicon glyphicon-trash"></i></a>
<div class="btn-group">
{loop type="auth" name="can_change" roles="ADMIN" permissions="admin.product.edit"}
<a class="btn btn-default btn-xs" title="{intl l='Edit this product'}" href="{url path='admin/product/edit' product_id=$ID}"><i class="glyphicon glyphicon-edit"></i></a>
{/loop}
{loop type="auth" name="can_change" roles="ADMIN" permissions="admin.product.delete"}
<a class="btn btn-default btn-xs product-delete" title="{intl l='Delete this product'}" href="{url path='admin/product/delete' id=$ID}"><i class="glyphicon glyphicon-trash"></i></a>
{/loop}
</div>
</td>
</tr>
{/loop}
@@ -274,8 +325,105 @@
</div>
</div>
{include file="includes/add-category-dialog.html"}
{include file="includes/delete-category-dialog.html"}
{* Adding a new Category *}
<div class="modal fade" id="add_category_dialog" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h3>{intl l="Create a new category"}</h3>
</div>
{form name="thelia.admin.category.creation"}
<form method="POST" action="{url path='/admin/catalog/category'}" {form_enctype form=$form}>
{* the action processed by the controller *}
<input type="hidden" name="action" value="create" />
{form_hidden_fields form=$form}
{form_field form=$form field='parent'}
<input type="hidden" name="{$name}" value="{$current_category_id}" />
{/form_field}
{form_field form=$form field='success_url'}
{* on success, redirect to category change page. _ID_ is replaced with the ID of the created category (see Thelia\Action\Category.php) *}
<input type="hidden" name="{$name}" value="{url path='admin/catalog/category' id="_ID_" action='edit'}" />
{/form_field}
<div class="modal-body">
{if #form_error}<div class="alert alert-block alert-error" id="add_category_dialog_error">#form_error_message</div>{/if}
<div class="form-group">
<label class="control-label">
{intl l='Category Title *'}
</label>
{loop type="lang" name="default-lang" default_only="1"}
{form_field form=$form field='locale'}
<input type="hidden" name="{$name}" value="{$LOCALE}" />
{/form_field}
<div class="input-group input-block-level">
{form_field form=$form field='title'}
<span {if $error}class="error"{/if}>
<input type="text" required="required" name="{$name}" value="{$value}" title="{intl l='Category title'}" placeholder="{intl l='Category title'}" class="form-control input-block-level">
</span>
{/form_field}
<span class="input-group-addon"><img src="{image file="assets/img/flags/{$CODE}.gif"}" alt="{intl l=$TITLE}" /></span>
</div>
<div class="help-block">{intl l="Enter here the category title in the default language ($TITLE)"}</div>
{/loop}
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal" aria-hidden="true">{intl l="Cancel"}</button>
<button type="submit" class="btn btn-default btn-primary">{intl l="Create this category"}</button>
</div>
</form>
{/form}
</div>
</div>
</div>
{* Delete category confirmation dialog *}
<div class="modal fade" id="delete_category_dialog" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h3>{intl l="Delete a category"}</h3>
</div>
<div class="modal-body">
<p>{intl l="Do you really want to delete this category ?"}</p>
</div>
<form method="post" action="{url path='/admin/categories/delete'}">
<input type="hidden" name="current_category_id" value="{$current_category_id}" />
<input type="hidden" name="category_id" id="delete_category_id" value="" />
<div class="modal-footer">
<button type="submit" class="btn btn-default btn-primary"><span class="glyphicon glyphicon-check"></span> {intl l="Yes"}</button>
<button type="button" class="btn btn-default" data-dismiss="modal" aria-hidden="true"><span class="glyphicon glyphicon-remove"></span> {intl l="No"}</button>
</div>
</form>
</div>
</div>
</div>
{/block}
{block name="javascript-initialization"}
@@ -314,14 +462,25 @@ $(function() {
{* Set the proper category ID in the delete confirmation dialog *}
$(document).on("click", ".category-delete", function () {
$('#'+'delete-category-id').val($(this).data('id'));
$('a.category-delete').click(function(ev) {
$('#delete_category_id').val($(this).data('id'));
});
// Toggle category visibility
$(".categoryVisibleToggle").click(function() {
$.ajax({
url : "{url path='admin/catalog/category'}",
url : "{url path='admin/categories/toggle-online'}",
data : {
category_id : $(this).data('id'),
action : 'visibilityToggle'
}
});
});
// Toggle product visibility
$(".productVisibleToggle").click(function() {
$.ajax({
url : "{url path='admin/products/toggle-online'}",
data : {
category_id : $(this).data('id'),
action : 'visibilityToggle'
@@ -338,15 +497,34 @@ $(function() {
inputclass : 'input-mini',
placement : 'left',
success : function(response, newValue) {
// The URL template
var url = "{url path='admin/catalog/category' action='changePosition' category_id='__ID__' position='__POS__'}";
// The URL template
var url = "{url path='/admin/categories/update-position' category_id='__ID__' position='__POS__'}";
// Perform subtitutions
// Perform subtitutions
url = url.replace('__ID__', $(this).data('id'))
.replace('__POS__', newValue);
.replace('__POS__', newValue);
// Reload the page
location.href = url;
// Reload the page
location.href = url;
}
});
$('.productPositionChange').editable({
type : 'text',
title : '{intl l="Enter new product position"}',
mode : 'popup',
inputclass : 'input-mini',
placement : 'left',
success : function(response, newValue) {
// The URL template
var url = "{url path='/admin/products/update-position' product_id='__ID__' position='__POS__'}";
// Perform subtitutions
url = url.replace('__ID__', $(this).data('id'))
.replace('__POS__', newValue);
// Reload the page
location.href = url;
}
});

View File

@@ -7,9 +7,8 @@
{block name="main-content"}
<div class="catalog edit-category">
<div id="wrapper" class="container">
<ul class="breadcrumb">
{include file="includes/category_breadcrumb.html"}
</ul>
{include file="includes/categories-breadcrumb.html"}
<div class="row">
{loop name="category_edit" type="category" visible="*" id="{$current_category_id}" backend_context="1" lang="$edit_language_id"}

View File

@@ -122,7 +122,7 @@
<td>
{loop type="auth" name="can_change" roles="ADMIN" permissions="admin.configuration.currencies.change"}
<a title="{intl l='Change this currency'}" href="{url path='/admin/configuration/currencies/update' currency_id="$ID"}">{$NAME}</a>
<a title="{intl l='Change this currency'}" href="{url path='/admin/configuration/currencies/update' currency_id=$ID}">{$NAME}</a>
{/loop}
{elseloop rel="can_change"}
{$NAME}

View File

@@ -1,71 +0,0 @@
{* Adding a new Category *}
<div class="modal fade" id="add_category_dialog" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h3>{intl l="Create a new category"}</h3>
</div>
{form name="thelia.admin.category.creation"}
<form method="POST" action="{url path='/admin/catalog/category'}" {form_enctype form=$form}>
{* the action processed by the controller *}
<input type="hidden" name="action" value="create" />
{form_hidden_fields form=$form}
{form_field form=$form field='parent'}
<input type="hidden" name="{$name}" value="{$current_category_id}" />
{/form_field}
{form_field form=$form field='success_url'}
{* on success, redirect to category change page. _ID_ is replaced with the ID of the created category (see Thelia\Action\Category.php) *}
<input type="hidden" name="{$name}" value="{url path='admin/catalog/category' id="_ID_" action='edit'}" />
{/form_field}
<div class="modal-body">
{if #form_error}<div class="alert alert-block alert-error" id="add_category_dialog_error">#form_error_message</div>{/if}
<div class="form-group">
<label class="control-label">
{intl l='Category Title *'}
</label>
{loop type="lang" name="default-lang" default_only="1"}
{form_field form=$form field='locale'}
<input type="hidden" name="{$name}" value="{$LOCALE}" />
{/form_field}
<div class="input-group input-block-level">
{form_field form=$form field='title'}
<span {if $error}class="error"{/if}>
<input type="text" required="required" name="{$name}" value="{$value}" title="{intl l='Category title'}" placeholder="{intl l='Category title'}" class="form-control input-block-level">
</span>
{/form_field}
<span class="input-group-addon"><img src="{image file="../assets/img/flags/{$CODE}.gif"}" alt="{intl l=$TITLE}" /></span>
</div>
<div class="help-block">{intl l="Enter here the category title in the default language ($TITLE)"}</div>
{/loop}
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal" aria-hidden="true">{intl l="Cancel"}</button>
<button type="submit" class="btn btn-default btn-primary">{intl l="Create this category"}</button>
</div>
</form>
{/form}
</div>
</div>
</div>

View File

@@ -1,13 +0,0 @@
{* Breadcrumb for categories browsing and editing *}
<li><a href="{url path='admin/home'}">Home</a></li>
<li><a href="{url path='admin/catalog'}">Catalog</a> {ifloop rel="category_path"}</li>
{loop name="category_path" type="category-path" visible="*" category="{$current_category_id}"} {if $ID == $current_category_id}
<li class="active">{if $action == 'edit'} {intl l='Editing %cat' cat="{$TITLE}"} {else} {$TITLE} <a href="{url path='admin/catalog/category' id=" $ID" action='edit' }" title="{intl l='Edit this category'}">{intl l="(edit)"}</a> {/if}
</li>
{else}
<li><a href="{url path='admin/catalog/category' id=" $ID" action='browse'}">{$TITLE}</a></li>
{/if} {/loop} {/ifloop} {elseloop rel="category_path"}
</li>
{/elseloop}

View File

@@ -1,42 +0,0 @@
{* Adding a new Category *}
<div class="modal hide fade" id="delete_category_dialog" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h3>{intl l="Delete a category"}</h3>
</div>
{form name="thelia.admin.category.deletion"}
<form method="POST" action="{url path='/admin/catalog/category'}" {form_enctype form=$form}>
{* the action processed by the controller *}
<input type="hidden" name="action" value="delete" />
{form_hidden_fields form=$form}
{form_field form=$form field='category_id'}
<input type="hidden" name="{$name}" id="delete-category-id" value="" />
{/form_field}
{form_field form=$form field='success_url'}
{* on success, redirect to catalog. _ID_ is replaced with the ID of the deleted category parent id (see Thelia\Action\Category.php) *}
<input type="hidden" name="{$name}" value="{url path='admin/catalog/category' id="_ID_" action='browse'}" />
{/form_field}
<div class="modal-body">
{if #form_error}<div class="alert alert-block alert-error" id="add_category_dialog_error">#form_error_message</div>{/if}
<p>{intl l="Delete this category and all its contents ?"}</p>
</div>
<div class="modal-footer">
<button type="button" class="btn" data-dismiss="modal" aria-hidden="true">{intl l="No"}</button>
<button type="submit" class="btn btn-primary">{intl l="Yes"}</button>
</div>
</form>
{/form}
</div>