dinislage/PrestaShop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

// Modules positions drag and drop for bootstrap

Browse Source
This commit is contained in:
Jerome Nadaud
2013-10-03 17:47:09 +02:00
parent 309f4333a7
commit 39f0284aa3
1 changed files with 67 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files
admin-dev/themes/default/template/controllers/modules_positions/list_modules.tpl
+67 -32
View File
@@ -27,7 +27,15 @@
var token = '{$token}'; var token = '{$token}';
var come_from = 'AdminModulesPositions'; var come_from = 'AdminModulesPositions';
</script> </script>
<script type="text/javascript" src="../js/admin-dnd.js"></script> <script type="text/javascript" src="../js/jquery/jquery.sortable.js"></script>
<style type="text/css">
li.sortable-placeholder {
border: 1px dashed #CCC;
background: #8EB1D7;
list-style: none;
margin-bottom: 4px;
}
</style>
{include file="toolbar.tpl" toolbar_btn=$toolbar_btn toolbar_scroll=$toolbar_scroll title=$title} {include file="toolbar.tpl" toolbar_btn=$toolbar_btn toolbar_scroll=$toolbar_scroll title=$title}
<div>{block name="leadin"}{/block}</div> <div>{block name="leadin"}{/block}</div>
@@ -82,42 +90,42 @@
{if $hook['module_count']} {if $hook['module_count']}
<section class="module_list"> <section class="module_list">
{foreach $hook['modules'] as $position => $module} <ul{if $hook['modules']|count > 1} class="sortable"{/if}>
{if isset($module['instance'])}
<div id="{$hook['id_hook']}_{$module['instance']->id}" class="module_list_item"> {foreach $hook['modules'] as $position => $module}
{if isset($module['instance'])}
<li id="{$hook['id_hook']}_{$module['instance']->id}" class="module_list_item">
<div class="module_col_select"> <div class="module_col_select">
<input type="checkbox" id="mod{$hook['id_hook']}_{$module['instance']->id}" class="hook{$hook['id_hook']}" onclick="hookCheckboxes({$hook['id_hook']}, 1, this)" name="unhooks[]" value="{$hook['id_hook']}_{$module['instance']->id}"/> <input type="checkbox" id="mod{$hook['id_hook']}_{$module['instance']->id}" class="hook{$hook['id_hook']}" onclick="hookCheckboxes({$hook['id_hook']}, 1, this)" name="unhooks[]" value="{$hook['id_hook']}_{$module['instance']->id}"/>
</div> </div>
{if !$display_key} {if !$display_key}
<div class="module_col_position" {if $can_move && $hook['module_count'] >= 2}class="dragHandle"{/if} id="td_{$hook['id_hook']}_{$module['instance']->id}"> <div class="module_col_position" {if $can_move && $hook['module_count'] >= 2}class="dragHandle"{/if} id="td_{$hook['id_hook']}_{$module['instance']->id}">
<span class="positions">{$module@iteration}</span> <span class="positions">{$module@iteration}</span>
{if $can_move} {if $can_move}
<div class="btn-group-vertical"> <div class="btn-group-vertical">
<a class="btn btn-default btn-xs" {if {$module@iteration} == 1} disabled{/if} href="{$current}&id_module={$module['instance']->id}&id_hook={$hook['id_hook']}&direction=0&token={$token}&changePosition#{$hook['name']}"> <a class="btn btn-default btn-xs" {if {$module@iteration} == 1} disabled{/if} href="{$current}&id_module={$module['instance']->id}&id_hook={$hook['id_hook']}&direction=0&token={$token}&changePosition#{$hook['name']}">
<i class="icon-chevron-up"></i> <i class="icon-chevron-up"></i>
</a> </a>
<a class="btn btn-default btn-xs" {if {$module@iteration} == count($hook['modules'])}disabled{/if} href="{$current}&id_module={$module['instance']->id}&id_hook={$hook['id_hook']}&direction=1&token={$token}&changePosition#{$hook['name']}"> <a class="btn btn-default btn-xs" {if {$module@iteration} == count($hook['modules'])}disabled{/if} href="{$current}&id_module={$module['instance']->id}&id_hook={$hook['id_hook']}&direction=1&token={$token}&changePosition#{$hook['name']}">
<i class="icon-chevron-down"></i> <i class="icon-chevron-down"></i>
</a> </a>
</div> </div>
{/if} {/if}
</div> </div>
{/if} {/if}
<div class="module_col_icon"> <div class="module_col_icon">
<img src="../modules/{$module['instance']->name}/logo.png" alt="{$module['instance']->name|stripslashes}" /> <img src="../modules/{$module['instance']->name}/logo.png" alt="{$module['instance']->name|stripslashes}" />
</div> </div>
<div class="module_col_infos"><span class="module_name"> <div class="module_col_infos">
{$module['instance']->displayName|stripslashes} {if $module['instance']->version} <span class="module_name">
<small class="text-muted">&nbsp;-&nbsp;v{if $module['instance']->version|intval == $module['instance']->version}{sprintf('%.1f', $module['instance']->version)}{else}{$module['instance']->version|floatval}{/if}</small>{/if} {$module['instance']->displayName|stripslashes} {if $module['instance']->version}
</span> <small class="text-muted">&nbsp;-&nbsp;v{if $module['instance']->version|intval == $module['instance']->version}{sprintf('%.1f', $module['instance']->version)}{else}{$module['instance']->version|floatval}{/if}</small>{/if}
<div class="module_description">{$module['instance']->description}</div></div> </span>
<div class="module_col_actions"> <div class="module_description">{$module['instance']->description}</div>
</div>
<div class="module_col_actions">
<!-- <div class="lab_modules_positions" for="mod{$hook['id_hook']}_{$module['instance']->id}"></div> --> <!-- <div class="lab_modules_positions" for="mod{$hook['id_hook']}_{$module['instance']->id}"></div> -->
<div class="btn-group"> <div class="btn-group">
<a class="btn btn-default" href="{$current}&id_module={$module['instance']->id}&id_hook={$hook['id_hook']}&editGraft{if $display_key}&show_modules={$display_key}{/if}&token={$token}"> <a class="btn btn-default" href="{$current}&id_module={$module['instance']->id}&id_hook={$hook['id_hook']}&editGraft{if $display_key}&show_modules={$display_key}{/if}&token={$token}">
<i class="icon-pencil"></i> <i class="icon-pencil"></i>
@@ -136,11 +144,10 @@
</ul> </ul>
</div> </div>
</div> </div>
</li>
</div> {/if}
{/foreach}
{/if} </ul>
{/foreach}
</section> </section>
{else} {else}
<!-- <p>{l s='No module was found for this hook.'}</p> --> <!-- <p>{l s='No module was found for this hook.'}</p> -->
@@ -172,3 +179,31 @@
</div> </div>
</div> </div>
</div> </div>
<script type="text/javascript">
$('.sortable').sortable({
forcePlaceholderSize: true
}).bind('sortupdate', function(e, ui) {
var ids = ui.item.attr('id').split('_');
var way = (ui.start_index < ui.end_index)? 1 : 0;
var data = ids[0]+'[]=';
$.each(e.target.children, function(index, element) {
data += '&'+ids[0]+'[]='+$(element).attr('id');
});
$.ajax({
type: 'POST',
headers: { "cache-control": "no-cache" },
async: false,
url: currentIndex + '&token=' + token + '&' + 'rand=' + new Date().getTime(),
data: data + '&action=updatePositions&id_hook='+ids[0]+'&id_module='+ids[1]+'&way='+way+'&ajax=1' ,
success: function(data) {
start = 0;
$.each(e.target.children, function(index, element) {
$(element).find('.positions').html(++start);
});
}
});
});
</script>