{% extends "propesqBundle::layout.html.twig" %}
{% import  "propesqBundle:Form:function.html.twig" as form %}

{% block stylesheets %}
    <!-- TODO: verificar caminho do arquivo -->
    <link rel="stylesheet" href="{{ asset('bundles/propesq/css/edit.css') }}" type="text/css" media="all" />
    <style>
        #txtRequest, #txtResponse{
            font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
            display: inline-block;
            padding: 4px;
            margin-bottom: 9px;
            font-size: 13px;
            line-height: 18px;
            color: #555;
            background-color: #fff;
            border: 1px solid #ccc;
            -webkit-border-radius: 3px;
            -moz-border-radius: 3px;
            border-radius: 3px;

            -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
            -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
            box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
            -webkit-transition: border linear 0.2s, box-shadow linear 0.2s;
            -moz-transition: border linear 0.2s, box-shadow linear 0.2s;
            -ms-transition: border linear 0.2s, box-shadow linear 0.2s;
            -o-transition: border linear 0.2s, box-shadow linear 0.2s;
            transition: border linear 0.2s, box-shadow linear 0.2s;


            background-color: #eee;
            border-color: #ddd;



        }
    </style>

    <link rel="stylesheet" href="{{ asset('bundles/propesq/js/jsonviewer/css/jjsonviewer.css') }}" type="text/css" media="all" />
    <script type='text/javascript' src='{{ asset('bundles/propesq/js/jsonviewer/js/jjsonviewer.js') }}'></script>
    <link rel="stylesheet" href="{{ asset('bundles/propesq/webgis/css/ol.css') }}" type="text/css">
    <script src="https://cdn.rawgit.com/bjornharrtell/jsts/gh-pages/1.2.0/jsts.min.js"></script>
    <script src="{{ asset('bundles/propesq/webgis/geoInformacao/plugins/openlayers/v3.17.1-dist/ol.js') }}" type="text/javascript"></script>
{% endblock %}

{% block content %}
<div id="form-container">
    <div class="title">
        <h2>{{'cabecalho.detalhar.logeventos'|trans}}</h2>
    </div>  
       
<form class="form-horizontal">
    <fieldset style="float: left; margin: 10px;">
         <legend>{{'cabecalho.fieldset.logeventos.dadosbasicos'|trans}}</legend>
        <div class="row-fluid show-grid">
            <div class="span4">
                {{ form.show('entidade.logeventos.txtAcao',entity.txtAcao)}}
            </div>
            <div class="span4">
                {% if entity.codLogEventos.datAcesso %}

                    {% set datAcesso  = entity.codLogEventos.datAcesso|date('locale.datetimeTxt'|trans)  %}
                {% endif %}
                {{ form.show('entidade.logeventos.datAcesso',datAcesso)}}
            </div>
            <div class="span4">
                {{ form.show('entidade.logeventos.codUsuario',entity.codLogEventos.codUsuario.txtLogin)}}
            </div>
        </div>

        <div class="row-fluid show-grid">
            <div class="span4">
                {{ form.show('entidade.logeventos.txtNumIp',entity.codLogEventos.txtNumIp)}}
            </div>

            <div class="span4">
                {{ form.show('entidade.logeventos.txtDeviceId',entity.codLogEventos.txtDeviceId)}}
            </div>
            <div class="span4">
                {{ form.show('entidade.logeventos.txtDeviceEmail',entity.codLogEventos.txtDeviceEmail)}}
            </div>
        </div>

        <div class="row-fluid show-grid">
            <div class="span4">
                {{ form.show('entidade.logeventos.txtMobileVersion',entity.codLogEventos.txtMobileVersion)}}
            </div>
        </div>




        <div class="row-fluid show-grid">

            <div class="span6">
                <div class="control-group">
                    <label class="control-label">{{ 'entidade.logeventos.txtRequest'|trans }}</label>
                    <div class="controls">
                        <div id="txtRequest" readonly="" class="cemporcento wf2_notBlank wf2_notDefaultValue" style="height: 100% !important;">

                        </div>
                    </div>
                </div>

            </div>

            <div class="span6">


                <div class="control-group">
                    <label class="control-label">{{ 'entidade.logeventos.txtResponse'|trans }}</label>
                    <div class="controls">
                        <div id="txtResponse" readonly="" class="cemporcento wf2_notBlank wf2_notDefaultValue" style="height: 100% !important;">
                        </div>
                    </div>
                </div>

            </div>

        </div>


    </fieldset>
    <fieldset style="float: left; margin: 10px;">
        <legend>{{'cabecalho.fieldset.logeventos.mapa'|trans}}</legend>


        {% if entity.hasGeoInformacao or true%}
            {{ form.mount_map(sincronizacao, inclusao, edicao, center ) }}
        {% else %}
            Local indisponível
        {% endif %}


    </fieldset>
    <div class=" div-actions">
        {% if is_granted('ROLE_LOGEVENTOS_LIST') %}
            <a class="btn" href="{{ path('logeventosadmin') }}">
                {{'acao.listar'|trans}}
            </a>
            {% endif %}

    </div>
</form>
</div>


    <script>
        $(document).ready(function(){
            var jjson = '{{ entity.txtRequest|replace({"\\n":'', "\\r":' '})|raw('js') }}';
            var rjson = '{{ entity.txtResponse|replace({"\\n":'', "\\r":' '})|raw('js') }}';

            $("#txtRequest").jJsonViewer(jjson);
            //Bugs
            $('#txtRequest').find('.close').remove();


            $("#txtResponse").jJsonViewer(rjson);
            $('#txtResponse').find('.close').remove();

            $(window).unbind('scroll');
        });


    </script>
{% endblock %}