{{ header }}
{{ column_left }}
<div id="content">
    <div class="page-header">
        <div class="container-fluid">
            <div class="pull-right">
                <a class="btn btn-success" onclick="$('#action').val('save_edit');$('#form-featured').submit();" data-toggle="tooltip" title="{{ objlang.get('entry_button_save_and_edit') }}"><i class="fa fa-pencil-square-o"></i> {{ objlang.get('entry_button_save_and_edit') }}</a>
                <a class="btn btn-info" onclick="$('#action').val('save_new');$('#form-featured').submit();" data-toggle="tooltip" title="{{ objlang.get('entry_button_save_and_new') }}"><i class="fa fa-book"></i> {{ objlang.get('entry_button_save_and_new') }}</a>
                <a href="{{ cancel }}" data-toggle="tooltip" title="{{ objlang.get('entry_button_cancel') }}" class="btn btn-danger"><i class="fa fa-reply"></i> {{ objlang.get('entry_button_cancel') }}</a>
            </div>
            <h1>{{ objlang.get('heading_title_so') }}</h1>
            <ul class="breadcrumb">
                {% for breadcrumb in breadcrumbs %}
                    <li><a href="{{ breadcrumb['href'] }}">{{ breadcrumb['text'] }}</a></li>
                {% endfor %}
            </ul>
        </div>
    </div>
    <div class="container-fluid">
        {% if (error['warning'] is defined) %}
            <div class="alert alert-danger"><i class="fa fa-exclamation-circle"></i> {{ error['warning'] }}
                <button type="button" class="close" data-dismiss="alert">&times;</button>
            </div>
        {% endif %}
        {% if (success is defined and success is not empty) %}
            <div class="alert alert-success"><i class="fa fa-check-circle"></i> {{ success }}
                <button type="button" class="close" data-dismiss="alert">&times;</button>
            </div>
            <div class="alert alert-info"><i class="fa fa-info-circle"></i> {{ text_layout }}
                <button type="button" class="close" data-dismiss="alert">&times;</button>
            </div>
        {% endif %}
        <div class="panel panel-default">
            <div class="panel-heading">
                <h3 class="panel-title"><i class="fa fa-pencil"></i> {{ subheading }}</h3>
            </div>
            <div class="panel-body">
                <form action="{{ action }}" method="post" enctype="multipart/form-data" id="form-featured" class="form-horizontal">
                    <div class="row">
                        <ul class="nav nav-tabs" role="tablist">
                            <li {% if (selectedid== 0) %}class="active" {% endif %}><a href="{{ link }}"> <span class="fa fa-plus"></span> {{ objlang.get('button_add_module') }}</a></li>
                            {% set i = 1 %}
                            {% for key,module in moduletabs %}
                                <li role="presentation" {% if (module.module_id == selectedid) %}class="active"{% endif %}>
                                    <a href="{{ link }}&module_id={{ module.module_id }}" aria-controls="bannermodule-{{ key }}">
                                        <span class="fa fa-pencil"></span> {{ module.name }}
                                    </a>
                                </li>
                                {% set i = i + 1 %}
                            {% endfor %}
                        </ul>
                    </div>
                    <div class="row">
                        <div class="col-sm-12">
                            <div class="tab-pane">
                                <ul class="nav nav-tabs" id="so_youtech">
                                    <li>
                                        <a href="#module" data-toggle="tab" onclick="$('#tab_module').val('add-module')">
                                            {{ objlang.get('entry_module') }}
                                        </a>
                                    </li>
                                    {% if (selectedid) %}
                                        <li>
                                            <a href="#slider_option" data-toggle="tab" onclick="$('#tab_module').val('add-slide')">
                                                {{ objlang.get('entry_slider_option') }}
                                            </a>
                                        </li>
                                    {% endif %}
                                </ul>
                                <div class="tab-content">
                                    <div class="tab-pane" id="module">
                                        {% if (selectedid) %}
                                            <div class="pull-right">
                                                <a href="{{ link }}&module_id={{ _GET['module_id'] }}&delete=1" class="remove btn btn-danger"><span><i class="fa fa-remove"></i> {{ objlang.get('entry_button_delete') }}</span></a>
                                            </div>
                                        {% endif %}
                                        <div id="tab-module{{ module_row }}" class="col-sm-12">
                                            <div class="form-group"> {# <!-- Module Name--> #}
                                                <input type="hidden" name="tab_module" id="tab_module" value=""/>
                                                <input type="hidden" name="action" id="action" value=""/>
                                                <label class="col-sm-3 control-label" for="input-name"> <b style="font-weight:bold; color:#f00">*</b> <span data-toggle="tooltip" title="{{ objlang.get('entry_name_desc') }}">{{ objlang.get('entry_name') }} </span></label>
                                                <div class="col-sm-9">
                                                    <div class="col-sm-5">
                                                        <input type="text" name="name" value="{{ module['name'] }}" placeholder="{{ objlang.get('entry_name') }}" id="input-name" class="form-control"/>
                                                    </div>
                                                    {% if (error['name'] is defined) %}
                                                        <div class="text-danger col-sm-12">{{ error['name'] }}</div>
                                                    {% endif %}
                                                </div>
                                            </div>

                                            <div class="form-group"> {# <!--Status --> #}
                                                <label class="col-sm-3 control-label" for="input-status"><span data-toggle="tooltip" title="{{ objlang.get('entry_status_desc') }}">{{ objlang.get('entry_status') }} </span></label>
                                                <div class="col-sm-9">
                                                    <div class="col-sm-5">
                                                        <select name="status" id="input-status" class="form-control">
                                                            {% if (module['status']) %}
                                                                <option value="1" selected="selected">{{ objlang.get('text_enabled') }}</option>
                                                                <option value="0">{{ objlang.get('text_disabled') }}</option>
                                                            {% else %}
                                                                <option value="1">{{ objlang.get('text_enabled') }}</option>
                                                                <option value="0" selected="selected">{{ objlang.get('text_disabled') }}</option>
                                                            {% endif %}
                                                        </select>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        {# ----------------------------------------------------------------------- #}
                                    </div>
                                    {% if (selectedid) %}
                                        <div class="tab-pane" id="slider_option">
                                            <div class="col-md-12">
                                                <div class="form-group"> {# <!--Link --> #}
                                                    <label class="col-sm-2 control-label" for="input-link"> <span data-toggle="tooltip" title="{{ objlang.get('entry_link_desc') }}">{{ objlang.get('entry_link') }} </span> </label>
                                                    <div class="col-sm-10">
                                                        <div class="col-sm-5">
                                                            <input type="text" name="slide_link" value="{{ slide_description['url'] is defined ? slide_description['url'] : '' }}" id="input-link" class="form-control"/>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="form-group"> {# <!--Status slide --> #}
                                                    <label class="col-sm-2 control-label" for="input-slide_status"> <span data-toggle="tooltip" title="{{ objlang.get('entry_status_slide_desc') }}">{{ objlang.get('entry_status') }} </span></label>
                                                    <div class="col-sm-10">
                                                        <div class="col-sm-5">
                                                            <select name="slide_status" id="input-slide_status" class="form-control">
                                                                {% if (slide_description['status'] is defined and slide_description['status']) %}
                                                                    <option value="1" selected="selected">{{ objlang.get('text_yes') }}</option>
                                                                    <option value="0">{{ objlang.get('text_no') }}</option>
                                                                {% else %}
                                                                    <option value="1">{{ objlang.get('text_yes') }}</option>
                                                                    <option value="0" selected="selected">{{ objlang.get('text_no') }}</option>
                                                                {% endif %}
                                                            </select>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-12">
                                                <ul class="nav nav-tabs" id="language">
                                                    {% for language in languages %}
                                                        <li>
                                                            <a href="#language{{ language['language_id'] }}" data-toggle="tab">
                                                                <img src="language/{{ language['code'] }}/{{ language['code'] }}.png" title="{{ language['name'] }}"/>
                                                                {{ language['name'] }}
                                                            </a>
                                                        </li>
                                                    {% endfor %}
                                                </ul>
                                                <div class="tab-content">
                                                    {% for language in languages %}
                                                        <div class="tab-pane" id="language{{ language['language_id'] }}">
                                                            <div class="form-group"> {# <!-- Slide title--> #}
                                                                <label class="col-sm-2 control-label" for="input-slide_title">
                                                                    <b style="font-weight:bold; color:#f00">*</b> <span data-toggle="tooltip" title="{{ objlang.get('entry_slide_title_desc') }}">{{ objlang.get('entry_slide_title') }} </span></label>
                                                                <div class="col-sm-10">
                                                                    <div class="col-sm-5">
                                                                        <input type="text" name="slide_description[{{ language['language_id'] }}][slide_title]" placeholder="{{ objlang.get('entry_slide_title') }}" id="input-slide_title-{{ language['language_id'] }}" value="{{ slide_description[language['language_id']]['title'] is defined ? slide_description[language['language_id']]['title'] : '' }}" class="form-control"/>
                                                                        <input type="hidden" name="slide_description[{{ language['language_id'] }}][language_id]" value="{{ language['language_id'] }}"/>
                                                                    </div>
                                                                    {% if (error['slide_title'] is defined) %}
                                                                        <div class="text-danger col-sm-12">{{ error['slide_title'] }}</div>
                                                                    {% endif %}
                                                                </div>
                                                            </div>
                                                            <div class="form-group"> {# <!--Description --> #}
                                                                <label class="col-sm-2 control-label" for="input-description{{ language['language_id'] }}"> <span data-toggle="tooltip" title="{{ objlang.get('entry_description_desc') }}">{{ objlang.get('entry_description') }} </span></label>
                                                                <div class="col-sm-10">
                                                                    <div class="col-sm-12">
                                                                        <input type="text" name="slide_description[{{ language['language_id'] }}][slide_description]" id="input-slide_title-{{ language['language_id'] }}" value="{{ slide_description[language['language_id']]['description'] is defined ? slide_description[language['language_id']]['description'] : '' }}" class="form-control"/>
                                                                        {% if (error.slide_description is defined) %}
                                                                            <div class="text-danger col-sm-12">{{ error['slide_title'] }}</div>
                                                                        {% endif %}
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    {% endfor %}
                                                </div>
                                            </div>
                                            <div id="slidesContent" class="col-md-12" style="border:#ccc 1px solid; padding:10px; background:#f5f5f5">
                                                <h3 style="text-align:center;background:#4e9e41; color:#fff; padding: 10px;font-weight:bold">{{ objlang.get('label_listslide') }}</h3>
                                                <div id="slides">
                                                    {% for slide in slides %}
                                                        <div id="slides_{{ slide['id'] }}" class="panel" style="border:#ccc 1px solid; padding:10px;">
                                                            <div class="row">
                                                                <div class="col-xs-2">
                                                                    <span><i class="fa fa-arrows "></i></span>
                                                                </div>
                                                                <div class="col-xs-10">
                                                                    <h4>{{ slide.title }}</h4>
                                                                    <h5>{{ slide.description }}</h5>
                                                                    <div class="btn-group-action pull-right">
                                                                        <a class="btn btn-default" href="{{ link }}&slide_id={{ slide['id'] }}&tab=slide&module_id={{ module['moduleid'] }}">
                                                                            <i class="fa fa-edit"></i>
                                                                            Edit
                                                                        </a>
                                                                        <a class="btn btn-default" href="{{ link }}&slide_id={{ slide['id'] }}&tab=slide&module_id={{ module['moduleid'] }}&delete=1">
                                                                            <i class="fa fa-trash"></i>
                                                                            Delete
                                                                        </a>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    {% endfor %}
                                                </div>
                                            </div>

                                        </div>
                                    {% endif %}
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
    {% if (selectedid) %}
        <script>
            $(function () {
                $("#slides").sortable({
                    update: function (event, ui) {
                        var arr = $(this).sortable('toArray');
                        $.ajax({
                            url: 'index.php?route=module/so_home_slider/sortposition&user_token={{ _GET['user_token'] }}&sortarray=' + arr,
                            dataType: 'json'
                        });
                    }
                });
                $("#slides").disableSelection();
            });
        </script>
    {% endif %}
    <script type="text/javascript">
        {% if (_GET["tab"] is defined and _GET["tab"] == "slide") %}
        $('#so_youtech a:last').tab('show');
        {% else %}
        $('#so_youtech a:first').tab('show');
        {% endif %}
        $('#language a:first').tab('show');

        if ($("input[name='child_category']:radio:checked").val() == '0') {
            $('#input-category_depth_form').hide();
        } else {
            $('#input-category_depth_form').show();
        }
        $("input[name='child_category']:radio").change(function () {
            if ($(this).val() == '0') {
                $('#input-category_depth_form').hide();
            } else {
                $('#input-category_depth_form').show();
            }
        });

        $('#language_head-name').change(function () {
            var that = $(this), opt_select = $('option:selected', that).val(), _input = $('#input-head-name-' + opt_select);
            $('[id^="input-head-name-"]').addClass('hide');
            _input.removeClass('hide');
        });

        $('.first-name').change(function () {
            $('input[name="head-name"]').val($(this).val());
        });
    </script>
</div>
<script type="text/javascript" src="view/javascript/summernote/summernote.min.js"></script>
<link href="view/javascript/summernote/summernote.css" rel="stylesheet"/>
<script type="text/javascript" src="view/javascript/summernote/opencart.js"></script>
{{ footer }}