<?xml version="1.0" encoding="UTF-8"?>
<modification>
	<name><![CDATA[<i class="fa fa-arrows"></i> Сортировка модулей в макетах]]></name>
	<code>layoutmodulessort</code>
	<version>2.0.0</version>
	<author>Pavel Kravchenko</author>
	<link>https://opencartforum.com/profile/711752-paulkravchenko/</link>
	<date>2019.10.13</date>
	<file path="admin/view/template/design/layout_form.tpl">
		<operation error="skip">
			<search><![CDATA[<?php echo $footer; ?>]]></search>
			<add position="before"><![CDATA[
<script type="text/javascript" src="view/javascript/jquery/jquery-ui-custom.min.js"></script>
<script type="text/javascript"><!--
$('#module-column-left, #module-column-right, #module-content-top, #module-content-bottom').prepend("<tr></tr>").addClass( "table-sort" );
$('.table-sort').sortable({
	items: 'tbody > tr',
    helper: fixWidthHelper,
	placeholder: "placeholder-sortable",
	connectWith: ".table-sort",
	dropOnEmpty: true,
	receive: function( event, ui ){
		$(this).find("tbody > tr").append(ui.item);
        $(this).find('input[name*=\'sort_order\']').each(function(i){
            $(this).val(i+1);
        });
		var id = $(this).attr("id");
		$(this).find('input[name*=\'position\']').each(function(){
            $(this).val(id.replace('module-', '').replace('-', '_'));
        });
    },
	stop: function( event, ui ){
        $(this).find('input[name*=\'sort_order\']').each(function(i){
            $(this).val(i+1);
        });
    }
});
function fixWidthHelper(e, ui) {
    ui.children().each(function() {
        $(this).width($(this).width());
    });
    return ui;
}
//--></script>
<style>
#module-content-bottom tbody tr td:first-child,
#module-content-top tbody tr td:first-child,
#module-column-left tbody tr td:first-child,
#module-column-right tbody tr td:first-child {
    cursor:move;
    position:relative;
    padding-left:20px;
}

#module-content-bottom tbody tr td:before,
#module-content-top tbody tr td:before,
#module-column-left tbody tr td:before,
#module-column-right tbody tr td:before {
    content: "\f0dc";
    font-family: FontAwesome;
    left:5px;
    top:15px;
    position:absolute;
}
.ui-sortable-helper { border: 1px solid #aaa!important;}
.placeholder-sortable { border: 2px dashed #bbb!important; height:40px!important; opacity: 0.1!important; }
.arrow-icon-sortable {float: left;padding: 7px;}
tfoot > tr > td > .arrow-icon-sortable{display:none;}
</style>
			]]></add>
		</operation>
	</file>

	<file path="admin/view/template/design/layout_form.twig">
		<operation error="skip">
			<search><![CDATA[{{ footer }}]]></search>
			<add position="before"><![CDATA[
<script type="text/javascript" src="view/javascript/jquery/jquery-ui-custom.min.js"></script>
<script type="text/javascript"><!--
$('#module-column-left, #module-column-right, #module-content-top, #module-content-bottom').prepend("<tr></tr>").addClass( "table-sort" );
$('.table-sort').sortable({
	items: 'tbody > tr',
    helper: fixWidthHelper,
	placeholder: "placeholder-sortable",
	connectWith: ".table-sort",
	dropOnEmpty: true,
	receive: function( event, ui ){
		$(this).find("tbody > tr").append(ui.item);
        $(this).find('input[name*=\'sort_order\']').each(function(i){
            $(this).val(i+1);
        });
		var id = $(this).attr("id");
		$(this).find('input[name*=\'position\']').each(function(){
            $(this).val(id.replace('module-', '').replace('-', '_'));
        });
    },
	stop: function( event, ui ){
        $(this).find('input[name*=\'sort_order\']').each(function(i){
            $(this).val(i+1);
        });
    }
});
function fixWidthHelper(e, ui) {
    ui.children().each(function() {
        $(this).width($(this).width());
    });
    return ui;
}
//--></script>
<style>
#module-content-bottom tbody tr td:first-child,
#module-content-top tbody tr td:first-child,
#module-column-left tbody tr td:first-child,
#module-column-right tbody tr td:first-child {
    cursor:move;
    position:relative;
    padding-left:20px;
}

#module-content-bottom tbody tr td:before,
#module-content-top tbody tr td:before,
#module-column-left tbody tr td:before,
#module-column-right tbody tr td:before {
    content: "\f0dc";
    font-family: FontAwesome;
    left:5px;
    top:15px;
    position:absolute;
}
.ui-sortable-helper { border: 1px solid #aaa!important;}
.placeholder-sortable { border: 2px dashed #bbb!important; height:40px!important; opacity: 0.1!important; }
.arrow-icon-sortable {float: left;padding: 7px;}
tfoot > tr > td > .arrow-icon-sortable{display:none;}
</style>
			]]></add>
		</operation>
	</file>

</modification>