@extends('layouts.app')

<style type="text/css">
.hidden{
    display: none;
}
</style>

@section('content')
<div class="container">
    <div class="row">
        <div>
            <div class="panel panel-default">
                <div class="panel-heading">{{$title}}</div>
                <div class="panel-body">
						<div id="data" class="tab-pane fade in active">
                            @if (count($errors) > 0)
                                <div class="alert alert-danger">
                                    <ul>
                                    @foreach ($errors->all() as $error)
                                        <li>{{ $error }}</li>
                                    @endforeach
                                    </ul>
                                </div>
                            @endif
                            <form method=post action="/{{$action}}">
                                {{ csrf_field() }}
                                <div class="form-group">
                                    <div class="col-md-4">
                                        <label>Etiqueta</label>
                                        <input class="form-control" type=text name="etiqueta" value="">
                                    </div>
                                    <div class="col-md-4">
                                        <label>Marca</label>
                                        <input class="form-control" type=text name="marca" value="">
                                    </div>
                                    <div class="col-md-4">
                                        <label>Modelo</label>
                                        <input class="form-control" type=text name="modelo" value="">
                                    </div>
                                </div>

                                <div class="form-group">
                                    <div class="col-md-3">
                                        <label>IP</label>
                                        <input class="form-control" type=text name="ip" value="">
                                    </div>
                                    <div class="col-md-1">
                                        <label>Puerto</label>
                                        <input class="form-control" type=text name="puerto" value="">
                                    </div>
                                    <div class="col-md-4">
                                        <label>Nº de Serie</label>
                                        <input class="form-control" type=text name="numero_serie" value="">
                                    </div>
                                    <div class="col-md-4">
                                        <label>MAC Address</label>
                                        <input class="form-control" type=text name="mac_address" value="">
                                    </div>
                                </div>

                                <div class="form-group">
                                    <div class="col-md-4">
                                        <label>Cantidad de puertos PON</label>
                                        <select class="form-control" name="cant_pon" id="cant_pon">
                                          <option value="8">8</option>
                                          <option value="16">16</option>
                                        </select>
                                    </div>
                                    <div class="col-md-8">
                                        <label>Coordenadas</label>
                                        <a id="verMapa" href="https://www.google.com.ar/maps/place/" target="_blank"><i class="fa fa-globe" title="Ver en mapa"></i></a>
                                        <input class="form-control" type=text name="coordenadas" id="coordenadas" value="{{ old('coordenadas',(isset($a->coordenadas) ? $a->coordenadas:'')) }}">
                                    </div>
                                </div>

                                <div class="form-group">
                                    <div class="row col-md-offset-10 col-md-2" style="margin-top: 10px;">
                                        <a href="/olts"><button type="button" class="btn btn-default">Cancelar</button></a>
                                        <button type="submit" class="btn btn-success">Crear</button>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

@endsection


@section('scripts')

<script>

$(document).ready(function() {
    $('#borrar').click(function() {
        bootbox.confirm("Est&aacute; seguro de borrar este nodo? No hay deshacer!",function(answer) {
                if(answer) {
                    $.ajax({
                        url: '/nodo/'+$('#id').val(),
                        type: "DELETE",
                        dataType: "json",
                        contentType: "application/json",
                        success: function(result) {
                            if(result.status=='ok') {
                                $.unblockUI();
                                window.location.href='/nodos';
                            }
                        },
                        error: function(e) {
                            alert("Error 003");
                        }

                 });
                }
            });
    });

    $("#coordenadas").keyup(function() {
        link = $("#coordenadas").val();
        if (link.includes('https://www.google.com/maps/place/')){
            link_partes = link.split("@");
            coordenadas = link_partes[1].split(",");
            $("#coordenadas").val(coordenadas[0] + "," + coordenadas[1]);
            $("#verMapa").removeClass('hidden')
        }
    });

    $('#aparatos_list').DataTable( {
        "order": [[ 1, "asc" ]],
        stateSave: true,
        "ajax":{
        "url": "/aparatos_unassigned_list",
        "type": "GET"
        },
        "columns": [
            {"data":"nombre"},
            {"data":"rol"},
			{"data":"ip"},
        ],
        "language": {
            "url":"/js/Spanish.json"
        },
        "columnDefs": [
            {
                "orderable":false,
                "targets" : 1,
                "render": function ( data, type, row ) {
                    if(row.rol==1)
                        return 'PTP';
                    else if(row.rol==2)
                        return 'Router';
                    else if(row.rol==3)
                        return 'Switch';
                    else if(row.rol==4)
                        return 'AP';
		    else if(row.rol==5)
                        return 'Test220';
		    else if(row.rol==6)
                        return 'Servidor';
                    else if(row.rol==7)
                        return 'Otro';
                }
            },
        ]
    });

    $('#aparatos_list tbody').on( 'click', 'tr', function () {
        $(this).toggleClass('active');
    });

    $('#agregar_aparatos').click(function() {
        $.each($('#aparatos_list').DataTable().rows('.active').data(),function(k,value) {
            $.ajax({
                url: '/nodo_add_aparato/'+$('#id').val()+'/'+value.id,
                type: "POST",
                dataType: "json",
                contentType: "application/json",
                success: function(result) {
                },
                error: function(e) {
                    alert("Error 003");
                }
            });
        });
        reload_datatables();
    });

    $('#aparatos_list_ptps').DataTable( {
        "order": [[ 1, "asc" ]],
        stateSave: true,
        "ajax":{
        "url": '/nodo_ptps/'+$('#id').val(),
        "type": "GET"
        },
        "columns": [
            {"data":"id"},
            {"data":"nombre"},
			{"data":"ip"},
			{"data":"puerto"},
        ],
        "language": {
            "url":"/js/Spanish.json"
        },

        "columnDefs": [
			{
                "orderable":false,
                "targets" : 0,
                "render": function ( data, type, row ) {
                    return '<a href="http://'+nagios+'/site02/nagvis/frontend/nagvis-js/index.php?mod=Map&act=view&show='+row.nodo.nombre.replace(/ /g,"_")+'&search='+row.nombre.replace(/ /g,"_")+'" target="_blank"><i class="fa fa-sitemap" title="Mapa Nagvis"></i></a>';
                }
            },
            {
                "orderable":false,
                "targets" : 1,
                "render": function ( data, type, row ) {
                    return '<a href="/aparato/'+row.id+'" target="_blank">'+row.nombre+'<a>';
                }
            },
			{
                "orderable":false,
                "targets" : 2,
                "render": function ( data, type, row ) {
					if(row.puerto==80)
						return '<a href="http://'+row.ip+':'+row.puerto+'" title="Acceso Web" target="_blank">'+row.ip+'</a>';
					else if(row.puerto == 443)
						return '<a href="https://'+row.ip+':'+row.puerto+'" title="Acceso Web" target="_blank">'+row.ip+'</a>';
					else
						return row.ip;
                }
            },
            {
                "orderable":false,
                "targets" : 3,
                "render": function ( data, type, row ) {
                    return '<a href=# onClick="quitar_aparato($(this).parents(\'tr\'),$(this).parents(\'table\'))" ><i class="fa fa-trash-o"></i><a>';
                }
            }

        ]
    });

    $('#aparatos_list_routers').DataTable( {
        "order": [[ 1, "asc" ]],
        stateSave: true,
        "ajax":{
        "url": '/nodo_routers/'+$('#id').val(),
        "type": "GET"
        },
        "columns": [
            {"data":"id"},
            {"data":"nombre"},
			{"data":"ip"},
			{"data":"puerto"},
        ],
        "language": {
            "url":"/js/Spanish.json"
        },

        "columnDefs": [
			{
                "orderable":false,
                "targets" : 0,
                "render": function ( data, type, row ) {
                    return '<a href="http://'+nagios+'/site02/nagvis/frontend/nagvis-js/index.php?mod=Map&act=view&show='+row.nodo.nombre.replace(/ /g,"_")+
                    '&search='+row.nombre.replace(/ /g,"_")+'" target="_blank"><i class="fa fa-sitemap" title="Mapa Nagvis"></i></a>';
                }
            },
            {
                "orderable":false,
                "targets" : 1,
                "render": function ( data, type, row ) {
                    return '<a href="/aparato/'+row.id+'" target="_blank">'+row.nombre+'<a>';
                }
            },
			{
                "orderable":false,
                "targets" : 2,
                "render": function ( data, type, row ) {
					if(row.puerto==80)
						return '<a href="http://'+row.ip+':'+row.puerto+'" title="Acceso Web" target="_blank">'+row.ip+'</a>';
					else if(row.puerto == 443)
						return '<a href="https://'+row.ip+':'+row.puerto+'" title="Acceso Web" target="_blank">'+row.ip+'</a>';
					else
						return row.ip;
                }
            },
            {
                "orderable":false,
                "targets" : 3,
                "render": function ( data, type, row ) {
                    return '<a href=# onClick="quitar_aparato($(this).parents(\'tr\'),$(this).parents(\'table\'))" ><i class="fa fa-trash-o"></i><a>';
                }
            }

        ]
    });

    $('#aparatos_list_switches').DataTable( {
        "order": [[ 1, "asc" ]],
        stateSave: true,
        "ajax":{
        "url": '/nodo_switches/'+$('#id').val(),
        "type": "GET"
        },
        "columns": [
            {"data":"id"},
            {"data":"nombre"},
			{"data":"ip"},
			{"data":"puerto"},
        ],
        "language": {
            "url":"/js/Spanish.json"
        },

        "columnDefs": [
			{
                "orderable":false,
                "targets" : 0,
                "render": function ( data, type, row ) {
                    return '<a href="http://'+nagios+'/site02/nagvis/frontend/nagvis-js/index.php?mod=Map&act=view&show='+row.nodo.nombre.replace(/ /g,"_")+'&search='+row.nombre.replace(/ /g,"_")+'" target="_blank"><i class="fa fa-sitemap" title="Mapa Nagvis"></i></a>';
                }
            },
            {
                "orderable":false,
                "targets" : 1,
                "render": function ( data, type, row ) {
                    return '<a href="/aparato/'+row.id+'" target="_blank">'+row.nombre+'<a>';
                }
            },
			{
                "orderable":false,
                "targets" : 2,
                "render": function ( data, type, row ) {
					if(row.puerto==80)
						return '<a href="http://'+row.ip+':'+row.puerto+'" title="Acceso Web" target="_blank">'+row.ip+'</a>';
					else if(row.puerto == 443)
						return '<a href="https://'+row.ip+':'+row.puerto+'" title="Acceso Web" target="_blank">'+row.ip+'</a>';
					else
						return row.ip;
                }
            },
            {
                "orderable":false,
                "targets" : 3,
                "render": function ( data, type, row ) {
                    return '<a href=#  onClick="quitar_aparato($(this).parents(\'tr\'),$(this).parents(\'table\'))" ><i class="fa fa-trash-o"></i><a>';
                }
            }

        ]
    });

    $('#aparatos_list_aps').DataTable( {
        "order": [[ 1, "asc" ]],
        stateSave: true,
        "ajax":{
        "url": '/nodo_aps/'+$('#id').val(),
        "type": "GET"
        },
        "columns": [
            {"data":"id"},
            {"data":"nombre"},
			{"data":"ip"},
			{"data":"puerto"},
        ],
        "language": {
            "url":"/js/Spanish.json"
        },

        "columnDefs": [
			{
                "orderable":false,
                "targets" : 0,
                "render": function ( data, type, row ) {
                    return '<a href="http://'+nagios+'/site02/nagvis/frontend/nagvis-js/index.php?mod=Map&act=view&show='+row.nodo.nombre.replace(/ /g,"_")+'&search='+row.nombre.replace(/ /g,"_")+'" target="_blank"><i class="fa fa-sitemap" title="Mapa Nagvis"></i></a>';
                }
            },
            {
                "orderable":false,
                "targets" : 1,
                "render": function ( data, type, row ) {
                    return '<a href="/aparato/'+row.id+'" target="_blank">'+row.nombre+'<a>';
                }
            },
			{
                "orderable":false,
                "targets" : 2,
                "render": function ( data, type, row ) {
					if(row.puerto==80)
						return '<a href="http://'+row.ip+':'+row.puerto+'" title="Acceso Web" target="_blank">'+row.ip+'</a>';
					else if(row.puerto == 443)
						return '<a href="https://'+row.ip+':'+row.puerto+'" title="Acceso Web" target="_blank">'+row.ip+'</a>';
					else
						return row.ip;
                }
            },
            {
                "orderable":false,
                "targets" : 3,
                "render": function ( data, type, row ) {
                    return '<a href=# onClick="quitar_aparato($(this).parents(\'tr\'),$(this).parents(\'table\'))" ><i class="fa fa-trash-o"></i><a>';
                }
            }

        ]
    });

	$('#aparatos_list_test220').DataTable( {
        "order": [[ 1, "asc" ]],
        stateSave: true,
        "ajax":{
        "url": '/nodo_test220/'+$('#id').val(),
        "type": "GET"
        },
        "columns": [
            {"data":"id"},
            {"data":"nombre"},
			{"data":"ip"},
			{"data":"puerto"},
        ],
        "language": {
            "url":"/js/Spanish.json"
        },

        "columnDefs": [
			{
                "orderable":false,
                "targets" : 0,
                "render": function ( data, type, row ) {
                    return '<a href="http://'+nagios+'/site02/nagvis/frontend/nagvis-js/index.php?mod=Map&act=view&show='+row.nodo.nombre.replace(/ /g,"_")+'&search='+row.nombre.replace(/ /g,"_")+'" target="_blank"><i class="fa fa-sitemap" title="Mapa Nagvis"></i></a>';
                }
            },
            {
                "orderable":false,
                "targets" : 1,
                "render": function ( data, type, row ) {
                    return '<a href="/aparato/'+row.id+'" target="_blank">'+row.nombre+'<a>';
                }
            },
			{
                "orderable":false,
                "targets" : 2,
                "render": function ( data, type, row ) {
					if(row.puerto==80)
						return '<a href="http://'+row.ip+':'+row.puerto+'" title="Acceso Web" target="_blank">'+row.ip+'</a>';
					else if(row.puerto == 443)
						return '<a href="https://'+row.ip+':'+row.puerto+'" title="Acceso Web" target="_blank">'+row.ip+'</a>';
					else
						return row.ip;
                }
            },
            {
                "orderable":false,
                "targets" : 3,
                "render": function ( data, type, row ) {
                    return '<a href=# onClick="quitar_aparato($(this).parents(\'tr\'),$(this).parents(\'table\'))" ><i class="fa fa-trash-o"></i><a>';
                }
            }

        ]
    });

});

function reload_datatables() {
    //manda reload al ajax de todas las DT, tb cuando borras un aparato
    $('#aparatos_list_ptps').DataTable().ajax.reload();
    $('#aparatos_list_routers').DataTable().ajax.reload();
    $('#aparatos_list_switches').DataTable().ajax.reload();
    $('#aparatos_list_aps').DataTable().ajax.reload();
    $('#aparatos_list').DataTable().ajax.reload();

}

function quitar_aparato(dom_row,table) {
   var dt_row=$(table).DataTable().row(dom_row);
   var data = dt_row.data();
    bootbox.confirm("Est&aacute; seguro de quitar este aparato del nodo? No hay deshacer!",function(answer) {
            if(answer) {
                $.ajax({
                    url: '/nodo_del_aparato/'+data.id,
                    type: "DELETE",
                    dataType: "json",
                    contentType: "application/json",
                    success: function(result) {
                        if(result.status=='ok') {
                            reload_datatables();
                        }
                    },
                    error: function(e) {
                        alert("Error 003");
                    }

             });
            }
        });
}
	$(document).ready(function(){
        @if(!Auth::guest())
          @if(Auth::user()->role!=1)
              $('input').prop('disabled',true);
              $('button').prop('disabled',true);
              $('select').prop('disabled',true);
              $('[name="_token"]').prop('disabled',false);
          @endif
        @endif
    });
</script>
@endsection