{% extends "propesqBundle::layout.html.twig" %}

{% block stylesheets %}
    <!-- TODO: verificar caminho do arquivo -->
    <link rel="stylesheet" href="{{ asset('bundles/propesq/css/edit.css') }}" type="text/css" media="all" />
{% endblock %}

{% block content %}
<div id="form-container">
    <div class="title">
        <h2>
        {%if entity.id is defined and entity.id is not null%} 
            {{'cabecalho.alterar.usuario'|trans}}
        {%else%}  
            {{'cabecalho.incluir.usuario'|trans}}
        {%endif%}
        </h2>
    </div>    

{{ form_errors(form) }}

       
<form id="formulario-usuario" class="{% if  not includeLayout %}ajax {%endif%} form-horizontal" action="{%if entity.id is defined and entity.id is not null%} {{ path('usuario_update', { 'id': entity.id }) }} {%else%} {{ path('usuario_create') }} {%endif%}" method="post" {{ form_enctype(form) }} autocomplete="off">
    <fieldset style="float: left; margin: 10px;">
        
        {{ form_widget(form._token) }}
        
        
        {% if not includeLayout %}
            <input type='hidden' name='noLayout' value='true'>
        {% endif %}
               
        {#
        <div class="control-group">
            {{ form_label(form.codPessoa) }}
            <div class="controls">
                {{ form_widget(form.codPessoa,{ 'attr': {'class': 'input-xlarge'} }) }}
              <span class="help-inline">{{ form_errors(form.codPessoa) }}</span>
            </div>
        </div>
        #}
            
        <div class="row-fluid">
            <div class="control-group span4">
                {{ form_label(form.codPessoa) }}
                <div class="controls">
                    {{ form_widget(form.codPessoa,{ 'attr': {'class': 'input-xlarge'} }) }}
                </div>
            </div>
        </div>    
            
        <div class="control-group">
            {{ form_label(form.txtLogin) }}
            <div class="controls">
                {{ form_widget(form.txtLogin,{ 'attr': {'class': 'input-xlarge'} }) }}
              <span class="help-inline">{{ form_errors(form.txtLogin) }}</span>
            </div>
        </div>
        <div class="control-group">
            {{ form_label(form.txtSenha) }}
            <div class="controls">
                {{ form_widget(form.txtSenha,{ 'attr': {'class': 'input-xlarge', 'autocomplete': 'new-password'} }) }}
              <span class="help-inline">{{ form_errors(form.txtSenha) }}</span>
            </div>
            {%if entity.id is defined and entity.id is not null%}
            <div class="control-group">
                <label for="disconnect" class="control-label">Desconectar todos os dispositivos? </label>
                <input type="checkbox" id="disconnect" name="disconnect">
            </div>
            {% endif %}
        </div>
        <div class="control-group">
            {{ form_label(form.txtFuncao) }}
            <div class="controls">
                {{ form_widget(form.txtFuncao,{ 'attr': {'class': 'span6'} }) }}
              <span class="help-inline">{{ form_errors(form.txtFuncao) }}</span>
            </div>
        </div>
        <div class="control-group">
            {{ form_label(form.isSomenteProPesqMOB) }}
            <div class="controls">
                {{ form_widget(form.isSomenteProPesqMOB,{ 'attr': {'class': 'input-xlarge'} }) }}
                <span class="help-inline">{{ form_errors(form.isSomenteProPesqMOB) }}</span>
            </div>
        </div>
        <div class="control-group" id="localidade-container" style="display: none;">
            {{ form_label(form.codLocalidade) }}
            <div class="controls">
                {{ form_widget(form.codLocalidade,{ 'attr': {'class': 'input-xlarge'} }) }}
                <span class="help-inline">{{ form_errors(form.codLocalidade) }}</span>
            </div>
        </div>
        <div class="row-fluid show-grid">
            <div class="span12">
                <div class="control-group">
                    <div class="controls">
                        <div id="fonte-dado-fields-list"
                             data-prototype="{% filter escape %}{% include 'propesqBundle:UsuarioFonteDado:new.html.twig' with {'formUsuarioFonteDado': form.usuarioFonteDados.get('prototype')} %}{% endfilter %}">
                            {% for fonteDadoField in form.usuarioFonteDados %}
                                {% include 'propesqBundle:UsuarioFonteDado:new.html.twig' with {'formUsuarioFonteDado': fonteDadoField, 'id': loop.index0} %}
                            {% endfor %}
                        </div>
                        <a href="#" id="add-another-fonte-dado">Adicionar fonte de dados</a>
                        <span class="help-inline">{{ form_errors(form.usuarioFonteDados) }}</span>
                    </div>
                </div>
            </div>
        </div>
        <div class="control-group">
            {{ form_label(form.codPerfilUsuario) }}
            <div class="controls">
                {{ form_widget(form.codPerfilUsuario,{ 'attr': {'class': 'input-xlarge'} }) }}
                <span class="help-inline">{{ form_errors(form.codPerfilUsuario) }}</span>
            </div>
        </div>
      </fieldset>
    <br style="clear: both;">
    <div class="controls" id="role-container" style="min-width: 600px; min-height: 100px;">
    </div>

    <div class=" div-actions">
        <a id="buttonSubmit" class="btn btn-primary">{{'acao.salvar'|trans}}</a>
        <a class=""{% if not includeLayout %} onclick="$(this).parents('.modal').find('.close').click(); return false;" {% endif %} href="{{ path('usuario') }}" title="{{'acao.cancelar'|trans}}">{{'acao.cancelar'|trans}}</a>
    </div>
</form>
</div>
<script>

    function tornarPermissoesObrigatoria(){

        $("#{{form.codPerfilUsuario.get('id')}}").closest(".control-group").find('label').addClass('required');

        {{form.codPerfilUsuario.get('id')}}.setRequired(true);
        $('#{{form.codPerfilUsuario.get('id')}}').parents('form').find('[type="submit"]').click(function(event){
            if($('#{{form.codPerfilUsuario.get('id')}}').html() != null){
                if(!{{form.codPerfilUsuario.get('id')}}.getSelectedObject() && $('#{{form.codPerfilUsuario.get('id')}}').find('.requiredCombobox').length){
                    $('#{{form.codPerfilUsuario.get('id')}}').setError('Selecione uma opção.');
                    $('#{{form.codPerfilUsuario.get('id')}}').find('.requiredCombobox').trigger('invalid');
                    return true;
                }else{
                    $('#{{form.codPerfilUsuario.get('id')}}').setError(false);
                    return true;
                }
            }
        });
        //validação real na submissão do form
        $('#{{form.codPerfilUsuario.get('id')}}').parents('form').submit(function(event){
            if($('#{{form.codPerfilUsuario.get('id')}}').html() != null){
                if(!{{form.codPerfilUsuario.get('id')}}.getSelectedObject() && $('#{{form.codPerfilUsuario.get('id')}}').find('.requiredCombobox').length){
                    $('#{{form.codPerfilUsuario.get('id')}}').setError('Selecione uma opção.');
                    $('#{{form.codPerfilUsuario.get('id')}}').find('.requiredCombobox').trigger('invalid');
                    return false;
                }else{
                    $('#{{form.codPerfilUsuario.get('id')}}').setError(false);
                    return true;
                }
            }
        });

        $("#{{form.codPerfilUsuario.get('id')}}").closest(".control-group").show();

    }
    function tornarPermissoesOpcional(){
        $("#{{form.codPerfilUsuario.get('id')}}").closest(".control-group").find('label').removeClass('required');

        $('#{{form.codPerfilUsuario.get('id')}}').setError(false);
        {{form.codPerfilUsuario.get('id')}}.setRequired(false);
        $("#{{form.codPerfilUsuario.get('id')}}").closest(".control-group").hide();
    }

    function mostrarLocalidade(){
        $("#localidade-container").show();
        {{ form.codLocalidade.get('id') }}.setRequired(true);
        $("#localidade-container label").addClass('required');
    }

    function ocultarLocalidade(){
        $("#localidade-container").hide();
        {{ form.codLocalidade.get('id') }}.setSelectedByValue(null);
        {{ form.codLocalidade.get('id') }}.setRequired(false);
        $("#localidade-container label").removeClass('required');
    }

    var action="{%if entity.id is defined and entity.id is not null%}{{ path('usuario_update', { 'id': entity.id }) }}{%else%}{{ path('usuario_create') }}{%endif%}";
    var fonteDadoCount = '{{ form.usuarioFonteDados | length }}';

    $(document).ready(function() {
        var disconnect = false;
        var id = '{{entity.codPerfilUsuario.id}}';
        $('#add-another-fonte-dado').click(addFonteDado);

        $('#buttonSubmit').on('click', function () {
            var form = $('form');
            form.removeAttr('action');
            {%if entity.id is defined and entity.id is not null%}
            if($('#disconnect').is(':checked')){
                disconnect = true;
                form.attr('action', action + '?disconnect='+disconnect);
                var cancelarUrl = "{{ path('registro') }}" ;
                $.fn.dialog2.helpers.confirm("Caso os dispositivos a serem desconectados ainda possuam dados não sincronizados, os mesmos serão perdidos.<br/>Você realmente deseja desconectar?", {
                    closeOnEscape: false,
                    title: 'Atenção!',
                    confirm: function() {
                        $('form').trigger('submit');
                    },
                    decline: function() {
                        $('.close').click();
                    }
                });
            }else{
                disconnect = false;
                form.attr('action', action + '?disconnect='+disconnect);
                $('form').trigger('submit');
            }
            {% else %}
                disconnect = false;
                form.attr('action', action + '?disconnect='+disconnect);
                $('form').trigger('submit');
            {% endif %}

        });

        if (id) {
            executeLoadPermissaoUsuario({{entity.id}});
        }else{
            $("#role-container").html('');
        }

        $('#{{ form.isSomenteProPesqMOB.vars.id }}').live('click', function(){
            checkIsSomenteProPesqMOB(this);
        });

        checkIsSomenteProPesqMOB($('#{{ form.isSomenteProPesqMOB.vars.id }}'));

        if (fonteDadoCount > 0){
            setupFonteDados();
        }
     });

    function checkIsSomenteProPesqMOB(somenteProPesqMOB){
        if($(somenteProPesqMOB).is(':checked')) {
            {{ form.codPerfilUsuario.vars.id }}.setSelectedByValue(null);
            tornarPermissoesOpcional();
            mostrarLocalidade();
        }else{
            tornarPermissoesObrigatoria();
            ocultarLocalidade();
        }
    }

     function tipoChange(obj){
        
        item = obj.getSelectedObject();
        if(item){
            executeTipoChange(item.id, obj);        
        }else{
            $("#role-container").html('');
        }
    }
    
    function executeLoadPermissaoUsuario(id){
        var request = $.ajax({
        url: "{{ path('usuario_rolePerfil') }}",
        type: "POST",
        data: {id: id},
        dataType: "html",
        beforeSend: function ( xhr ) {
            loader('#role-container');
        }
        });

        request.done(function(msg) {
            $("#role-container").html(msg);
        });

        request.fail(function(jqXHR, textStatus) {
            alert( "Request failed: " + textStatus );
        });  
    }
    
    function executeTipoChange(id, obj){
        var request = $.ajax({
        url: "{{ path('perfilusuario_roleTipoPerfil') }}",
        type: "POST",
        data: {perfilId: id},
        dataType: "html",
        beforeSend: function ( xhr ) {
            if (obj) {
                obj.setLoading(true);
            }
            loader('#role-container');
        }
        });

        request.done(function(msg) {
            $("#role-container").html(msg);
            if (obj) {
                obj.setLoading(false);
            }
        });

        request.fail(function(jqXHR, textStatus) {
            alert( "Request failed: " + textStatus );
            if (obj) {
                obj.setLoading(false);
            }
        });  
    }

    function refreshSpy() {
        $('[data-spy="scroll"]').each(function () {
            $(this).scrollspy('refresh');
        });
    }

    function setupFonteDados() {
        var lista = $('#fonte-dado-fields-list');

        lista.children('.usuario-fonte-dado-container').each(function (i) {

            $(this).bind('keydown', 'Ctrl+del', teclaDelete);

            var btn = $('#remover-fonte-dado-' + i);

            btn.click(function () {
                removerElemento($(this).parents(".usuario-fonte-dado-container"));
            });

            $(this).bind('keydown', 'Ctrl+insert', teclaInsert)
        });
    }

    function addFonteDado(evt, firstLoad) {
        var fonteDadoList = $('#fonte-dado-fields-list');
        var newWidget = fonteDadoList.attr('data-prototype');
        newWidget = newWidget.replace(/\$\$name\$\$/g, fonteDadoCount);
        newWidget = $(newWidget);
        newWidget.appendTo(fonteDadoList);

        var btn = $('#remover-fonte-dado-' + fonteDadoCount);

        btn.click(function () {
            removerElemento($(this).parents(".usuario-fonte-dado-container"));
            fonteDadoList.children('.usuario-fonte-dado-container:last-child').find('.hasfocus');
        });

        $(fonteDadoList).ready(function () {
            if (!firstLoad) {
                fonteDadoList.children('.usuario-fonte-dado-container:last-child').find('.hasfocus').focus();
            }
            fonteDadoList.children('.usuario-fonte-dado-container:last-child').find('.insertaction').bind('keydown', 'Ctrl+del', teclaDelete);
        });

        $(fonteDadoList).ready(function () {
            fonteDadoList.children('.usuario-fonte-dado-container:last-child').find('.insertaction').bind('keydown', 'Ctrl+insert', teclaInsert);
        });

        fonteDadoCount++;

        refreshSpy();

        return false;
    }

    function removerElemento(el) {
        el.remove();
        refreshSpy();
    }

    function teclaInsert(evt) {
        if ($(evt.target).parents('.usuario-fonte-dado-container').length == 1) {
            addFonteDado();
        }
    }

    function teclaDelete(evt) {
        if ($(evt.target).parents('.usuario-fonte-dado-container').length == 1) {
            removerElemento($(evt.target).parents('.usuario-fonte-dado-container'));
            $('#fonte-dado-fields-list').children('.usuario-fonte-dado-container:last-child').find('.insertaction').focus();
        }
    }
</script>
{% endblock %}