{extends file="admin-layout.tpl"}

{block name="no-return-functions"}
    {$admin_current_location = 'configuration'}
{/block}

{block name="page-title"}{intl l='Thelia Languages'}{/block}

{block name="check-resource"}admin.configuration.language{/block}
{block name="check-access"}view{/block}

{block name="main-content"}
<div class="languages">

    <div id="wrapper" class="container">

        <ul class="breadcrumb">
            <li><a href="{url path='/admin/home'}">{intl l="Home"}</a></li>
            <li><a href="{url path='/admin/configuration'}">{intl l="Configuration"}</a></li>
            <li><a href="{url path='/admin/configuration/languages'}">{intl l="Languages"}</a></li>
        </ul>

        {hook name="languages.top" location="languages_top" }

        {if $error_message|default:null}
            <div class="row">
                <div class="col-md-12">
                    <div class="alert alert-danger">
                        {$error_message}
                    </div>
                </div>
             </div>
        {/if}

        <div class="row">
            <div class="col-md-12">
                <div class="general-block-decorator">
                    <form action="" method="">
                        <table class="table table-striped table-condensed table-left-aligned">
                            <caption>
                                {intl l="Languages management"}
                                {include file='renderer/buttons.html' btn_group=false buttons=[
                                    [
                                        'type' => 'create',
                                        'class' => 'action-btn',
                                        'title' => {intl l='Add a new language'},
                                        'href' => '#creation_dialog',
                                        'auth' => ['resource' => 'admin.configuration.language'],
                                        'data' => [
                                            'toggle' => 'modal'
                                        ]
                                    ]
                                ]}
                            </caption>
                            <thead>
                                <tr>
                                    <th>{intl l="ID"}</th>
                                    <th colspan="2">{intl l="Language name"}</th>
                                    <th>{intl l="ISO 639 Code"}</th>
                                    <th>{intl l="Locale"}</th>
                                    <th>{intl l="Visible in front"}</th>
                                    <th>{intl l="Active"}</th>
                                    <th>{intl l="Default"}</th>
                                    <th>{intl l="Actions"}</th>
                                </tr>
                            </thead>
                            <tbody>
                                {loop type="lang" name="lang.list" backend_context="1" active="*"}
                                <tr>
                                    <td>{$ID}</td>
                                    <td class="text-center"><img class="img-flags" src="{image file="assets/img/svgFlags/{$CODE}.svg" failsafe="on"}" alt="{$CODE}" /></td>
                                    <td>{$TITLE}</td>
                                    <td>{$CODE}</td>
                                    <td>{$LOCALE}</td>
                                    <td>
                                        <div class="make-switch switch-small switch-radio lang-visible-change" data-id="{$ID}" 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" name="visible" {if $VISIBLE}checked{/if}>
                                        </div>
                                    </td>
                                    <td>
                                        <div class="make-switch switch-small switch-radio lang-active-change" data-id="{$ID}" 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" name="active" {if $ACTIVE}checked{/if}>
                                        </div>
                                    </td>
                                    <td>
                                        <div class="make-switch switch-small switch-radio lang-default-change" data-id="{$ID}" 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="radio" name="is_default" {if $IS_DEFAULT}checked{/if}>
                                        </div>
                                    </td>
                                    <td class="actions">
                                        {$buttons = [
                                            [
                                                'type' => 'edit',
                                                'class' => 'lang-change no-follow-link',
                                                'title' => {intl l='Change this language'},
                                                'auth' => ['resource' => 'admin.configuration.language'],
                                                'data' => [
                                                    'id' => $ID
                                                ]
                                            ]
                                        ]}

                                        {if !$IS_DEFAULT}
                                        {$buttons[] = [
                                                'type' => 'delete',
                                                'class' => 'lang-delete',
                                                'title' => {intl l="Delete this language"},
                                                'href' => '#delete_dialog',
                                                'data' => [
                                                    'id' => $ID,
                                                    'toggle' => 'modal'
                                                ],
                                                'auth' => ['resource' => 'admin.configuration.language']
                                        ]}
                                        {/if}

                                        {include file='renderer/buttons.html' buttons=$buttons}
                                    </td>
                                </tr>
                                {/loop}
                            </tbody>
                        </table>

                    </form>

                </div>
            </div>



        </div>

        <div class="row">
            <div class="col-md-6">
                <div class="general-block-decorator">

                    <div class="title title-without-tabs">{intl l="Parameters"}</div>
                    {form name="thelia.lang.defaultBehavior"}
                    <form action="{url path="/admin/configuration/languages/defaultBehavior"}" method="post">
                        {form_hidden_fields}
                        {form_field field="behavior"}
                        <div class="form-group {if $error}has-error{/if}" >
                            <label for="{$label_attr.for|default:null}" class="label-control">{intl l="If a translation is missing or incomplete :"}</label>
                            <div class="input-group">
                                <select name="{$name}" id="{$label_attr.for|default:null}" data-toggle="selectpicker">
                                    {foreach $choices as $choice}
                                        <option value="{$choice->value}" {if $lang_without_translation == $choice->value}selected="selected"{/if}>{$choice->label}</option>
                                    {/foreach}
                                </select>
                                <div class="input-group-btn">
                                    <button type="submit" class="btn btn-primary"><span class="glyphicon glyphicon-check"></span> {intl l='Save'}</button>
                                </div>
                            </div>
                        </div>
                        {/form_field}
                    </form>
                    {/form}
                </div>
            </div>
            <div class="col-md-6">
                <div class="general-block-decorator clearfix">

                    <div class="title title-without-tabs">{intl l="Using a domain or subdomain for each language"}</div>
                    {form name="thelia.lang.url"}
                    <form action="{url path="/admin/configuration/languages/updateUrl"}" method="post">
                        {form_hidden_fields}
                        <table class="table table-striped table-condensed table-left-aligned">
                            <tbody>
                            {form_tagged_fields tag='url'}
                                {if $attr_list.url_id}
                                <tr>
                                    <th>{$attr_list.url_title}</th>
                                    <td>
                                        <div class="form-group {if $error}has-error{/if}">
                                        <input type="text" class="form-control" name="{$name}" value="{$value}" placeholder="http://www.domain.com" {if $one_domain_per_lang == 0}readonly{/if}>
                                        </div>
                                    </td>
                                </tr>
                                {/if}
                            {/form_tagged_fields}
                            </tbody>
                            <tfoot>
                                <tr>
                                    <td></td>
                                    <td class="text-right">
                                        {if $one_domain_per_lang == 0}
                                            <a href="{url path="/admin/configuration/languages/domain/activate"}" class="btn btn-default btn-success"><span class="glyphicon glyphicon-ok-sign"></span> {intl l="activate"}</a>
                                        {else}
                                            <a href="{url path="/admin/configuration/languages/domain/deactivate"}" class="btn btn-default btn-danger"><span class="glyphicon glyphicon-ok-sign"></span> {intl l="deactivate"}</a>
                                        {/if}

                                        <button type="submit" {if $one_domain_per_lang == 0}disabled{/if} class="btn btn-primary"><span class="glyphicon glyphicon-check"></span> {intl l="Save"}</button>
                                    </td>
                                </tr>
                            </tfoot>
                        </table>
                    </form>
                    {/form}
                </div>
            </div>
        </div>

        {hook name="languages.bottom" location="languages_bottom" }

    </div>
</div>

{form name="thelia.lang.create"}

    {* Capture the dialog body, to pass it to the generic dialog *}
    {capture "creation_dialog"}

        {form_hidden_fields}

        {form_field field='title'}
            <div class="form-group {if $error}has-error{/if}">
                <label for="{$label_attr.for|default:null}" class="control-label">{$label} : </label>
                <input type="text" id="{$label_attr.for|default:null}" name="{$name}" class="form-control" value="{$value}" title="{$label}" placeholder="{intl l='Language title'}">
            </div>
        {/form_field}
        {form_field field='code'}
            <div class="form-group {if $error}has-error{/if}">
                <label for="{$label_attr.for|default:null}" class="control-label">{$label} : </label>
                <input type="text" id="{$label_attr.for|default:null}" name="{$name}" class="form-control" value="{$value}" title="{$label}" placeholder="{intl l='ISO Code'}">
                <span class="help-block">{intl l='<a href="http://en.wikipedia.org/wiki/List_of_ISO_639-1_codes" target="_other">Check the list</a> of ISO 639-1 codes'}</span>
            </div>
        {/form_field}
        {form_field field='locale'}
            <div class="form-group {if $error}has-error{/if}">
                <label for="{$label_attr.for|default:null}" class="control-label">{$label} : </label>
                <input type="text" id="{$label_attr.for|default:null}" name="{$name}" class="form-control" value="{$value}" title="{$label}" placeholder="{intl l='en_US'}">
            </div>
        {/form_field}
        {form_field field='date_time_format'}
            <div class="form-group {if $error}has-error{/if}">
                <label for="{$label_attr.for|default:null}" class="control-label">{$label} : </label>
                <input type="text" id="{$label_attr.for|default:null}" name="{$name}" class="form-control" value="{$value}" title="{$label}" placeholder="{intl l='d-m-Y H:i:s'}">
                <span class="help-block">{intl l='The syntax used is identical to the PHP <a href="http://www.php.net/date" target="_other">date()</a> function'}</span>
            </div>
        {/form_field}
        {form_field field='date_format'}
            <div class="form-group {if $error}has-error{/if}">
                <label for="{$label_attr.for|default:null}" class="control-label">{$label} : </label>
                <input type="text" id="{$label_attr.for|default:null}" name="{$name}" class="form-control" value="{$value}" title="{$label}" placeholder="{intl l='d-m-Y'}">
                <span class="help-block">{intl l='The syntax used is identical to the PHP <a href="http://www.php.net/date" target="_other">date()</a> function'}</span>
            </div>
        {/form_field}
        {form_field field='time_format'}
            <div class="form-group {if $error}has-error{/if}">
                <label for="{$label_attr.for|default:null}" class="control-label">{$label} : </label>
                <input type="text" id="{$label_attr.for|default:null}" name="{$name}" class="form-control" value="{$value}" title="{$label}" placeholder="{intl l='H:i:s'}">
                <span class="help-block">{intl l='The syntax used is identical to the PHP <a href="http://www.php.net/date" target="_other">date()</a> function'}</span>
            </div>
        {/form_field}
        {form_field field='decimal_separator'}
            <div class="form-group {if $error}has-error{/if}">
                <label for="{$label_attr.for|default:null}" class="control-label">{$label} : </label>
                <input type="text" id="{$label_attr.for|default:null}" name="{$name}" class="form-control" value="{$value}" title="{$label}" placeholder="{intl l='eg: . or ,'}">
                <span class="help-block">{intl l='Sets the separator for the decimal point'}</span>
            </div>
        {/form_field}
        {form_field field='thousands_separator'}
            <div class="form-group {if $error}has-error{/if}">
                <label for="{$label_attr.for|default:null}" class="control-label">{$label} : </label>
                <input type="text" id="{$label_attr.for|default:null}" name="{$name}" class="form-control" value="{$value}" title="{$label}">
                <span class="help-block">{intl l='Sets the thousands separator.'}</span>
            </div>
        {/form_field}
        {form_field field='decimals'}
            <div class="form-group {if $error}has-error{/if}">
                <label for="{$label_attr.for|default:null}" class="control-label">{$label} : </label>
                <input type="text" id="{$label_attr.for|default:null}" name="{$name}" class="form-control" value="{$value}" title="{$label}" placeholder="2">
                <span class="help-block">{intl l='Decimal places'}</span>
            </div>
        {/form_field}

        {hook name="language.create-form" location="language_create_form" }

    {/capture}

    {include
        file = "includes/generic-create-dialog.html"

        dialog_id    = "creation_dialog"
        dialog_title = {intl l="Create a new language"}
        dialog_body  = {$smarty.capture.creation_dialog nofilter}

        dialog_ok_label     = {intl l="Create this language"}

        form_action        = {url path='/admin/configuration/languages/add'}
        form_enctype       = {form_enctype}
        form_error_message = $form_error_message
    }
{/form}

{* Delete confirmation dialog *}

{capture "delete_dialog"}
    <input type="hidden" name="language_id" id="language_delete_id" value="" />

    {hook name="languages.delete-form" location="languages_delete_form" }

{/capture}

{include
    file = "includes/generic-confirm-dialog.html"

    dialog_id       = "delete_dialog"
    dialog_title    = {intl l="Delete language"}
    dialog_message  = {intl l="Do you really want to delete this language ?"}

    form_action         = {token_url path='/admin/configuration/languages/delete'}
    form_content        = {$smarty.capture.delete_dialog nofilter}
    form_error_message  = $error_delete_message|default:null
}

    <div id="lang-update-modal"></div>

    <div class="modal fade" id="toggle-default-failed" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content alert alert-block alert-danger ">

                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h2>{intl l="Error"}</h2>
                </div>
                <div class="modal-body">
                    <strong>{intl l="Impossible to change default languages. Please contact your administrator or try later"}</strong>
                </div>


            </div>
        </div>
    </div>
{/block}

{block name="javascript-initialization"}
    {javascripts file='assets/js/bootstrap-switch/bootstrap-switch.js'}
        <script src="{$asset_url}"></script>
    {/javascripts}

    {javascripts file='assets/js/bootstrap-select/bootstrap-select.js'}
        <script src="{$asset_url}"></script>
    {/javascripts}

    <script>
        $(document).ready(function(){
            $("a.lang-change").click(function(e){
                var baseUrl = "{url path="/admin/configuration/languages/update/"}";
                $('body').append('<div class="modal-backdrop fade in" id="loading-event"><div class="loading"></div></div>');
                $.ajax({
                    method: 'get',
                    url: baseUrl+$(this).data('id')
                }).done(function(data){
                    $("#loading-event").remove();
                    $("#lang-update-modal").html(data);
                    $("#edit_lang_dialog").modal("show");
                }).fail(function(){
                    $("#loading-event").remove();
                });
            });

            $(".lang-default-change").on("switch-change", function(e, data){
                var url = "{token_url path='/admin/configuration/languages/toggleDefault/_ID_'}";
                // Reload the page
                location.href = url.replace('_ID_', $(this).data('id'));
            });

            $(".lang-active-change").on("switch-change", function(e, data){
                var url = "{token_url path='/admin/configuration/languages/toggleActive/_ID_'}";
                // Reload the page
                location.href = url.replace('_ID_', $(this).data('id'));
            });

            $(".lang-visible-change").on("switch-change", function(e, data){
                var url = "{token_url path='/admin/configuration/languages/toggleVisible/_ID_'}";
                // Reload the page
                location.href = url.replace('_ID_', $(this).data('id'));
            });

            $(".lang-delete").click(function(){
                $("#language_delete_id").val($(this).data("id"));
            });
        });
    </script>
{/block}

{block name="javascript-last-call"}
    {hook name="languages.js" location="languages-js" }
{/block}