{{ header }}{{ column_left }}
<div id="content">
    <div class="page-header">
        <div class="container-fluid">
            <div class="pull-right">
                <button type="submit" form="form-blog" data-toggle="tooltip" title="{{ button_save }}" class="btn btn-primary"><i class="fa fa-save"></i></button>
                <a href="{{ cancel }}" data-toggle="tooltip" title="{{ button_cancel }}" class="btn btn-default"><i class="fa fa-reply"></i></a>
            </div>
            <h1>{{ heading_title }}</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 %}
            <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 %}
            <div class="alert alert-success"><i class="fa fa-check-circle"></i> {{ success }}
                <button type="button" class="close" data-dismiss="alert">&times;</button>
            </div>
        {% endif %}
        <div class="row">
            <div class="col-md-3 col-sm-12">
                <div class="theme-option-container">
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            <h3 class="panel-title">{{ text_dashboard_menu }}</h3>
                        </div>
                        <ul class="nav nav-tabs menu-sections pt-dashboard-menu">
                            {% set i = 0 %}
                            {% for menu in plaza_menus %}
                                {% if menu.child %}
                                    <li {% if menu.active %} class="active" {% endif %}>
                                        <a href="#ptcollapse_{{ i }}" data-toggle="collapse" class="parent {% if not menu.active %} collapsed {% endif %}">{{ menu.title }}</a>
                                        <ul id="ptcollapse_{{ i }}" class="collapse {% if menu.active %} in {% endif %}">
                                            {% for item in menu.child %}
                                                <li {% if item.active %} class="active" {% endif %}><a href="{{ item.url }}">{{ item.title }}</a></li>
                                            {% endfor %}
                                        </ul>
                                    </li>
                                {% else %}
                                    <li {% if menu.active %} class="active" {% endif %}><a href="{{ menu.url }}">{{ menu.title }}</a></li>
                                {% endif %}
                                {% set i = i + 1 %}
                            {% endfor %}
                        </ul>
                    </div>
                </div>
            </div>
            <div class="col-md-9 col-sm-12">
                <div class="theme-option-container">
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            <h3 class="panel-title"><i class="fa fa-pencil"></i> {{ text_edit }}</h3>
                        </div>
                        <div class="panel-body">
                            <form action="{{ action }}" method="post" enctype="multipart/form-data" id="form-blog" class="form-horizontal">
                                <ul class="nav nav-tabs hoz-ul-sections">
                                    <li class="active"><a href="#tab-blog" data-toggle="tab">{{ tab_blog_page }}</a></li>
                                    <li><a href="#tab-category" data-toggle="tab">{{ tab_category_page }}</a></li>
                                    <li><a href="#tab-post" data-toggle="tab">{{ tab_post_page }}</a></li>
                                </ul>

                                <div class="tab-content child-content">
                                    <div class="tab-pane active" id="tab-blog">
                                        <div class="form-group required">
                                            <label class="col-sm-3 control-label">{{ entry_image_post }}</label>
                                            <div class="col-sm-6">
                                                <div class="row">
                                                    <div class="col-sm-6">
                                                        <input type="text" class="form-control" placeholder="{{ entry_width }}" name="module_ptblog_blog_width" value="{{ module_ptblog_blog_width }}" />
                                                    </div>
                                                    <div class="col-sm-6">
                                                        <input type="text" class="form-control" placeholder="{{ entry_height }}" name="module_ptblog_blog_height" value="{{ module_ptblog_blog_height }}" />
                                                    </div>
                                                </div>
                                                {% if error_image_blog %}
                                                    <div class="text-danger">{{ error_image_blog }}</div>
                                                {% endif %}
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="input-blog-limit"><span data-toggle="tooltip" title="{{ help_post_limit }}">{{ entry_post_limit }}</span></label>
                                            <div class="col-sm-3">
                                                <input type="text" name="module_ptblog_blog_post_limit" value="{{ module_ptblog_blog_post_limit }}" placeholder="10" id="input-blog-limit" class="form-control" />
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="input-blog-category">{{ entry_categories }}</label>
                                            <div class="col-sm-9">
                                                <input type="hidden" name="module_ptblog_cates_show" value="0" />
                                                <input type="checkbox" class="ckb-switch" name="module_ptblog_cates_show" id="input-blog-category"
                                                       data-toggle="toggle" data-on="{{ text_enabled }}" data-off="{{ text_disabled }}" data-width="100" data-height="36"
                                                        {% if module_ptblog_cates_show %} value="1" checked {% else %} value="0" {% endif %}>
                                                <div class="form-group col-sm-12 form-blog-category">
                                                    <input type="text" name="category" value="" placeholder="{{ entry_categories }}" id="input-cate-list" class="form-control" />
                                                    <div id="blog-category" class="well well-sm" style="height: 150px; overflow: auto;">
                                                        {% for category in blog_categories %}
                                                            <div id="blog-category{{ category.post_list_id }}"><i class="fa fa-minus-circle"></i> {{ category.name }}
                                                                <input type="hidden" name="module_ptblog_cates_list[]" value="{{ category.post_list_id }}" />
                                                            </div>
                                                        {% endfor %}
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="input-blog-latest-post">{{ entry_latest_blog }}</label>
                                            <div class="col-sm-2">
                                                <input type="hidden" name="module_ptblog_blog_latest_post" value="0" />
                                                <input type="checkbox" class="ckb-switch" name="module_ptblog_blog_latest_post" id="input-blog-latest-post"
                                                       data-toggle="toggle" data-on="{{ text_enabled }}" data-off="{{ text_disabled }}" data-width="100" data-height="36"
                                                        {% if module_ptblog_blog_latest_post %} value="1" checked {% else %} value="0" {% endif %}>
                                            </div>
                                            <label class="col-sm-2 control-label" for="input-blog-latest-post-limit">{{ entry_limit }}</label>
                                            <div class="col-sm-2">
                                                <input type="text" name="module_ptblog_blog_latest_post_limit" value="{{ module_ptblog_blog_latest_post_limit }}" placeholder="5" id="input-blog-latest-post-limit" class="form-control" />
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="input-blog-layout">{{ entry_layout }}</label>
                                            <div class="col-sm-6">
                                                <div class="switch switch-multi3">
                                                    <input type="radio" name="module_ptblog_blog_layout" class="switch-input" id="blog-layout-left" value="left" {% if module_ptblog_blog_layout == 'left' %} checked="checked"{% endif %}/>
                                                    <label for="blog-layout-left" class="switch-label switch-label-1">{{ text_sidebar_left }}</label>

                                                    <input type="radio" name="module_ptblog_blog_layout" class="switch-input" id="blog-layout-right" value="right" {% if module_ptblog_blog_layout == 'right' %} checked="checked"{% endif %}/>
                                                    <label for="blog-layout-right" class="switch-label switch-label-2">{{ text_sidebar_right }}</label>

                                                    <input type="radio" name="module_ptblog_blog_layout" class="switch-input" id="blog-layout-full" value="full" {% if module_ptblog_blog_layout == 'full' %} checked="checked"{% endif %}/>
                                                    <label for="blog-layout-full" class="switch-label switch-label-3">{{ text_full }}</label>

                                                    <span class="switch-selection"></span>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="input-blog-post-content">{{ entry_post_content }}</label>
                                            <div class="col-sm-3">
                                                <select name="module_ptblog_blog_post_content" class="form-control" id="input-blog-post-content">
                                                    <option value="grid" {% if module_ptblog_blog_post_content == "grid" %}selected="selected"{% endif %}>{{ text_grid }}</option>
                                                    <option value="list" {% if module_ptblog_blog_post_content == "list" %}selected="selected"{% endif %}>{{ text_list }}</option>
                                                </select>
                                            </div>
                                        </div>

                                        <div class="form-group required">
                                            <label class="col-sm-3 control-label" for="input-blog-meta-title">{{ entry_meta_title }}</label>
                                            <div class="col-sm-9">
                                                <input type="text" name="module_ptblog_meta_title" value="{{ module_ptblog_meta_title }}" placeholder="{{ entry_meta_title }}" id="input-blog-meta-title" class="form-control" />
                                                {% if error_meta_title %}
                                                    <div class="text-danger">{{ error_meta_title }}</div>
                                                {% endif %}
                                            </div>
                                        </div>

                                        <div class="form-group required">
                                            <label class="col-sm-3 control-label" for="input-blog-meta-description">{{ entry_meta_description }}</label>
                                            <div class="col-sm-9">
                                                <input type="text" name="module_ptblog_meta_description" value="{{ module_ptblog_meta_description }}" placeholder="{{ entry_meta_description }}" id="input-blog-meta-description" class="form-control" />
                                                {% if error_meta_description %}
                                                    <div class="text-danger">{{ error_meta_description }}</div>
                                                {% endif %}
                                            </div>
                                        </div>

                                        <div class="form-group required">
                                            <label class="col-sm-3 control-label" for="input-blog-meta-keyword">{{ entry_meta_keyword }}</label>
                                            <div class="col-sm-9">
                                                <input type="text" name="module_ptblog_meta_keyword" value="{{ module_ptblog_meta_keyword }}" placeholder="{{ entry_meta_keyword }}" id="input-blog-meta-keyword" class="form-control" />
                                                {% if error_meta_keyword %}
                                                    <div class="text-danger">{{ error_meta_keyword }}</div>
                                                {% endif %}
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="input-seo-url">{{ entry_seo_url }}</label>
                                            <div class="col-sm-9">
                                                {% for language in languages %}
                                                    <div class="input-group">
                                                        <span class="input-group-addon"><img src="language/{{ language.code }}/{{ language.code }}.png" title="{{ language.name }}" /></span>
                                                        <input type="text" id="input-seo-url{{ language.language_id }}" class="form-control" name="module_ptblog_seo_url[{{ language.language_id }}]" value="{{ module_ptblog_seo_url[language.language_id] }}" placeholder="" />
                                                    </div>
                                                {% endfor %}
                                            </div>
                                        </div>
                                    </div>

                                    <div class="tab-pane" id="tab-category">
                                        <div class="form-group required">
                                            <label class="col-sm-3 control-label">{{ entry_image_post }}</label>
                                            <div class="col-sm-6">
                                                <div class="row">
                                                    <div class="col-sm-6">
                                                        <input type="text" class="form-control" placeholder="{{ entry_width }}" name="module_ptblog_category_width" value="{{ module_ptblog_category_width }}" />
                                                    </div>
                                                    <div class="col-sm-6">
                                                        <input type="text" class="form-control" placeholder="{{ entry_height }}" name="module_ptblog_category_height" value="{{ module_ptblog_category_height }}" />
                                                    </div>
                                                </div>
                                                {% if error_image_category %}
                                                    <div class="text-danger">{{ error_image_category }}</div>
                                                {% endif %}
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="input-category-limit"><span data-toggle="tooltip" title="{{ help_post_limit }}">{{ entry_post_limit }}</span></label>
                                            <div class="col-sm-3">
                                                <input type="text" name="module_ptblog_category_post_limit" value="{{ module_ptblog_category_post_limit }}" placeholder="10" id="input-category-limit" class="form-control" />
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="input-category-latest-post">{{ entry_latest_blog }}</label>
                                            <div class="col-sm-2">
                                                <input type="hidden" name="module_ptblog_category_latest_post" value="0" />
                                                <input type="checkbox" class="ckb-switch" name="module_ptblog_category_latest_post" id="input-category-latest-post"
                                                       data-toggle="toggle" data-on="{{ text_enabled }}" data-off="{{ text_disabled }}" data-width="100" data-height="36"
                                                        {% if module_ptblog_category_latest_post %} value="1" checked {% else %} value="0" {% endif %}>
                                            </div>
                                            <label class="col-sm-2 control-label" for="input-category-latest-post-limit">{{ entry_limit }}</label>
                                            <div class="col-sm-2">
                                                <input type="text" name="module_ptblog_category_latest_post_limit" value="{{ module_ptblog_category_latest_post_limit }}" placeholder="5" id="input-category-latest-post-limit" class="form-control" />
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="input-category-layout">{{ entry_layout }}</label>
                                            <div class="col-sm-6">
                                                <div class="switch switch-multi3">
                                                    <input type="radio" name="module_ptblog_category_layout" class="switch-input" id="category-layout-left" value="left" {% if module_ptblog_category_layout == 'left' %} checked="checked"{% endif %}/>
                                                    <label for="category-layout-left" class="switch-label switch-label-1">{{ text_sidebar_left }}</label>

                                                    <input type="radio" name="module_ptblog_category_layout" class="switch-input" id="category-layout-right" value="right" {% if module_ptblog_category_layout == 'right' %} checked="checked"{% endif %}/>
                                                    <label for="category-layout-right" class="switch-label switch-label-2">{{ text_sidebar_right }}</label>

                                                    <input type="radio" name="module_ptblog_category_layout" class="switch-input" id="category-layout-full" value="full" {% if module_ptblog_category_layout == 'full' %} checked="checked"{% endif %}/>
                                                    <label for="category-layout-full" class="switch-label switch-label-3">{{ text_full }}</label>

                                                    <span class="switch-selection"></span>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="input-category-post-content">{{ entry_post_content }}</label>
                                            <div class="col-sm-3">
                                                <select name="module_ptblog_category_post_content" class="form-control" id="input-category-post-content">
                                                    <option value="grid" {% if module_ptblog_category_post_content == "grid" %}selected="selected"{% endif %}>{{ text_grid }}</option>
                                                    <option value="list" {% if module_ptblog_category_post_content == "list" %}selected="selected"{% endif %}>{{ text_list }}</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="tab-pane" id="tab-post">
                                        <div class="form-group required">
                                            <label class="col-sm-3 control-label">{{ entry_image_post }}</label>
                                            <div class="col-sm-6">
                                                <div class="row">
                                                    <div class="col-sm-6">
                                                        <input type="text" class="form-control" placeholder="{{ entry_width }}" name="module_ptblog_post_width" value="{{ module_ptblog_post_width }}" />
                                                    </div>
                                                    <div class="col-sm-6">
                                                        <input type="text" class="form-control" placeholder="{{ entry_height }}" name="module_ptblog_post_height" value="{{ module_ptblog_post_height }}" />
                                                    </div>
                                                </div>
                                                {% if error_image_post %}
                                                    <div class="text-danger">{{ error_image_post }}</div>
                                                {% endif %}
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="input-related-post">{{ entry_related_post }}</label>
                                            <div class="col-sm-2">
                                                <input type="hidden" name="module_ptblog_post_related" value="0" />
                                                <input type="checkbox" class="ckb-switch" name="module_ptblog_post_related" id="input-related-post"
                                                       data-toggle="toggle" data-on="{{ text_enabled }}" data-off="{{ text_disabled }}" data-width="100" data-height="36"
                                                        {% if module_ptblog_post_related %} value="1" checked {% else %} value="0" {% endif %}>
                                            </div>
                                            <label class="col-sm-2 control-label" for="input-related-post-limit">{{ entry_limit }}</label>
                                            <div class="col-sm-2">
                                                <input type="text" name="module_ptblog_post_related_limit" value="{{ module_ptblog_post_related_limit }}" placeholder="5" id="input-related-post-limit" class="form-control" />
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-3 control-label" for="input-post-layout">{{ entry_layout }}</label>
                                            <div class="col-sm-6">
                                                <div class="switch switch-multi3">
                                                    <input type="radio" name="module_ptblog_post_layout" class="switch-input" id="post-layout-left" value="left" {% if module_ptblog_post_layout == 'left' %} checked="checked"{% endif %}/>
                                                    <label for="post-layout-left" class="switch-label switch-label-1">{{ text_sidebar_left }}</label>

                                                    <input type="radio" name="module_ptblog_post_layout" class="switch-input" id="post-layout-right" value="right" {% if module_ptblog_post_layout == 'right' %} checked="checked"{% endif %}/>
                                                    <label for="post-layout-right" class="switch-label switch-label-2">{{ text_sidebar_right }}</label>

                                                    <input type="radio" name="module_ptblog_post_layout" class="switch-input" id="post-layout-full" value="full" {% if module_ptblog_post_layout == 'full' %} checked="checked"{% endif %}/>
                                                    <label for="post-layout-full" class="switch-label switch-label-3">{{ text_full }}</label>

                                                    <span class="switch-selection"></span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    $(document).ready(function () {
        $('.toggle.btn').on('click', function () {
            var ckb_status = parseInt($(this).find('.ckb-switch').val());
            if(ckb_status == 1) {
                $(this).find('.ckb-switch').val('0');
            } else {
                $(this).find('.ckb-switch').val('1');
            }
        });

        $('.form-blog-category').hide();
        var show_blog_cate = parseInt($('#input-blog-category').val());
        var show_blog_cate_select = $('#input-blog-category').closest('.toggle');
        if(show_blog_cate == 1) $('.form-blog-category').show();
        show_blog_cate_select.on('click', function () {
            var ckb_status = parseInt($(this).find('.ckb-switch').val());
            if(ckb_status == 1) {
                $('.form-blog-category').show();
            } else {
                $('.form-blog-category').hide();
            }
        });
    });

    $('input[name=\'category\']').autocomplete({
        source: function(request, response) {
            $.ajax({
                url: 'index.php?route=plaza/blog/list/autocomplete&user_token={{ user_token }}&filter_name=' +  encodeURIComponent(request),
                dataType: 'json',
                success: function(json) {
                    response($.map(json, function(item) {
                        return {
                            label: item['name'],
                            value: item['post_list_id']
                        }
                    }));
                }
            });
        },
        select: function(item) {
            $('input[name=\'category\']').val('');

            $('#blog-category' + item['value']).remove();

            $('#blog-category').append('<div id="blog-category' + item['value'] + '"><i class="fa fa-minus-circle"></i> ' + item['label'] + '<input type="hidden" name="module_ptblog_cates_list[]" value="' + item['value'] + '" /></div>');
        }
    });

    $('#blog-category').delegate('.fa-minus-circle', 'click', function() {
        $(this).parent().remove();
    });
</script>
{{ footer }}