3174 lines
161 KiB
Plaintext
3174 lines
161 KiB
Plaintext
<%@ Page Title="" Language="VB" MasterPageFile="~/SiteGPS.master" AutoEventWireup="false" ValidateRequest="false" EnableEventValidation="false" CodeFile="Rastreo2.aspx.vb" Inherits="GPS_Rastreo2" %>
|
|
|
|
<asp:Content ID="Content1" ContentPlaceHolderID="CP" runat="Server">
|
|
</asp:Content>
|
|
<asp:Content ID="Content2" ContentPlaceHolderID="Css" runat="Server">
|
|
<link href="../Metronic/assets/global/plugins/jquery-minicolors/jquery.minicolors.css" rel="stylesheet" />
|
|
<style type="text/css">
|
|
.ADScroller-body {
|
|
max-height: 400px;
|
|
}
|
|
|
|
.dataTables_scrollHeadInner > table {
|
|
background: lightgray;
|
|
}
|
|
|
|
html, body {
|
|
width: 100%;
|
|
height: 100%;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
table.dataTable th.focus, table.dataTable td.focus {
|
|
outline: 3px solid #3366ff00;
|
|
outline-offset: -1px;
|
|
}
|
|
|
|
.CustomSpinner {
|
|
position: fixed;
|
|
background-image: url(/Imagenes/Loading.gif);
|
|
background-repeat: no-repeat, repeat;
|
|
background-size: contain;
|
|
top: 60px;
|
|
right: 25px;
|
|
z-index: 500000;
|
|
height: 40px;
|
|
width: 40px;
|
|
}
|
|
/*.page-head {
|
|
display: none;
|
|
}
|
|
|
|
.page-breadcrumb .breadcrumb {
|
|
display: none;
|
|
}
|
|
#barradenavegacion {
|
|
display:none;
|
|
}*/
|
|
|
|
#showdiv1 {
|
|
left: 0 !important;
|
|
width: 100% !important;
|
|
}
|
|
|
|
#ShowDiv3:hover {
|
|
line-height: 34px !important;
|
|
-webkit-transition: line-height ease 1s;
|
|
-moz-transition: line-height ease 1s;
|
|
-o-transition: line-height ease 1s;
|
|
transition: line-height ease 1s;
|
|
}
|
|
|
|
#map {
|
|
position: fixed !important;
|
|
}
|
|
|
|
.pac-container.pac-logo {
|
|
z-index: 100000;
|
|
}
|
|
|
|
#iw-container {
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
#iw-container .iw-title {
|
|
font-family: 'Open Sans Condensed', sans-serif;
|
|
font-size: 22px;
|
|
font-weight: 400;
|
|
padding: 10px;
|
|
background-color: #48b5e9;
|
|
color: white;
|
|
margin: 0;
|
|
border-radius: 2px 2px 0 0;
|
|
}
|
|
|
|
#iw-container .iw-content {
|
|
font-size: 13px;
|
|
line-height: 18px;
|
|
font-weight: 400;
|
|
margin-right: 1px;
|
|
padding: 15px 5px 20px 15px;
|
|
max-height: 140px;
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
.iw-content img {
|
|
float: right;
|
|
margin: 0 5px 5px 10px;
|
|
}
|
|
|
|
.iw-subTitle {
|
|
font-size: 16px;
|
|
font-weight: 700;
|
|
padding: 5px 0;
|
|
}
|
|
|
|
.iw-bottom-gradient {
|
|
position: absolute;
|
|
width: 326px;
|
|
height: 25px;
|
|
bottom: 10px;
|
|
right: 18px;
|
|
background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
|
|
background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
|
|
background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
|
|
background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
|
|
}
|
|
|
|
.modal.fade:not(.in).left .modal-dialog {
|
|
-webkit-transform: translate3d(-25%, 0, 0);
|
|
transform: translate3d(-25%, 0, 0);
|
|
}
|
|
|
|
.modal.fade:not(.in).right .modal-dialog {
|
|
-webkit-transform: translate3d(25%, 0, 0);
|
|
transform: translate3d(25%, 0, 0);
|
|
}
|
|
|
|
.modal.fade:not(.in).bottom .modal-dialog {
|
|
-webkit-transform: translate3d(0, 25%, 0);
|
|
transform: translate3d(0, 25%, 0);
|
|
}
|
|
|
|
/* Alternative Angles */
|
|
.modal.fade:not(.in).top-left .modal-dialog {
|
|
-webkit-transform: translate3d(-25%, -25%, 0);
|
|
transform: translate3d(-25%, -25%, 0);
|
|
}
|
|
|
|
.modal.fade:not(.in).top-right .modal-dialog {
|
|
-webkit-transform: translate3d(25%, -25%, 0);
|
|
transform: translate3d(25%, -25%, 0);
|
|
}
|
|
|
|
.modal.fade:not(.in).bottom-left .modal-dialog {
|
|
-webkit-transform: translate3d(-25%, 25%, 0);
|
|
transform: translate3d(-25%, 25%, 0);
|
|
}
|
|
|
|
.modal.fade:not(.in).bottom-right .modal-dialog {
|
|
-webkit-transform: translate3d(25%, 25%, 0);
|
|
transform: translate3d(25%, 25%, 0);
|
|
}
|
|
|
|
.minicolors {
|
|
position: relative;
|
|
MARGIN-TOP: 10PX;
|
|
WIDTH: 20%;
|
|
}
|
|
|
|
table.dataTable,
|
|
table.dataTable th,
|
|
table.dataTable td {
|
|
-webkit-box-sizing: content-box;
|
|
-moz-box-sizing: content-box;
|
|
box-sizing: content-box;
|
|
}
|
|
|
|
.dataTables_scrollBody > .dataTable > thead {
|
|
display: none !important;
|
|
}
|
|
|
|
tr td:nth-child(4) {
|
|
text-align: center;
|
|
}
|
|
|
|
.form-horizontal .control-label {
|
|
text-align: left;
|
|
}
|
|
</style>
|
|
</asp:Content>
|
|
<asp:Content ContentPlaceHolderID="H" ID="Content9" runat="server">
|
|
<li>
|
|
<asp:UpdatePanel runat="server" UpdateMode="conditional">
|
|
<ContentTemplate>
|
|
<asp:LinkButton ID="BtnLast" Text="<i class='fa fa-map-marker'></i><span>Última Posición</span>" CommandArgument="Last" runat="server">
|
|
</asp:LinkButton>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
</li>
|
|
<li>
|
|
<asp:UpdatePanel runat="server" UpdateMode="conditional">
|
|
<ContentTemplate>
|
|
<asp:LinkButton ID="BtnAll" CommandArgument="All" Text="<i class='fa fa-book'></i><span>Histórico</span>" runat="server">
|
|
</asp:LinkButton>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
</li>
|
|
<li>
|
|
<asp:UpdatePanel runat="server" UpdateMode="conditional">
|
|
<ContentTemplate>
|
|
<asp:LinkButton ID="BtnWatch" CommandArgument="Watch" Text="<i class='fa fa-refresh'></i><span>Rastreo Continuo</span>" runat="server">
|
|
</asp:LinkButton>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
</li>
|
|
<li>
|
|
<asp:UpdatePanel runat="server" UpdateMode="conditional">
|
|
<ContentTemplate>
|
|
<asp:LinkButton ID="BtnIdle" CommandArgument="Idle" Text="<i class='fa fa-clock-o'></i><span>Tiempo Muerto</span>" runat="server">
|
|
</asp:LinkButton>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
</li>
|
|
<li>
|
|
<asp:UpdatePanel runat="server" UpdateMode="conditional">
|
|
<ContentTemplate>
|
|
<asp:LinkButton ID="BtnPasajeros" CommandArgument="TPS" Text="<i class='fa fa-users' aria-hidden='true'></i><span>Contador Pasajeros</span>" runat="server">
|
|
</asp:LinkButton>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
</li>
|
|
<li>
|
|
<asp:UpdatePanel runat="server" UpdateMode="conditional">
|
|
<ContentTemplate>
|
|
<asp:LinkButton ID="BtnSpeed" CommandArgument="Speed" Text="<i class='fa fa-forward '></i><span>Excesos de Velocidad</span>" runat="server"></asp:LinkButton>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
</li>
|
|
<li>
|
|
<asp:UpdatePanel runat="server" UpdateMode="conditional">
|
|
<ContentTemplate>
|
|
<asp:LinkButton ID="BtnEv" OnClientClick="" Text="<i class='fa fa-exclamation-triangle'></i><span>Eventos</span>" CommandArgument="Eventos" runat="server">
|
|
</asp:LinkButton>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
</li>
|
|
<li>
|
|
<asp:UpdatePanel runat="server" UpdateMode="conditional">
|
|
<ContentTemplate>
|
|
<asp:LinkButton ID="BtnRalenti" CommandArgument="Ralenti" Text="<i class='fa fa-tachometer'></i><span>Ralentí</span>" runat="server">
|
|
</asp:LinkButton>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
</li>
|
|
<li>
|
|
<asp:UpdatePanel runat="server" UpdateMode="conditional">
|
|
<ContentTemplate>
|
|
<asp:LinkButton ID="LnkKM" CommandArgument="KM" Text="<i class='fa fa-line-chart'></i><span>Reporte de Kilometraje</span>" runat="server">
|
|
</asp:LinkButton>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
</li>
|
|
<li>
|
|
<asp:UpdatePanel runat="server" UpdateMode="conditional">
|
|
<ContentTemplate>
|
|
<asp:LinkButton ID="LnkDibujo" OnClientClick="PreparaDibujado();" CommandArgument="KM" Text="<i class='fa fa-pencil-square-o'></i><span>Dibujar GeoReferencia</span>" runat="server">
|
|
</asp:LinkButton>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
</li>
|
|
</asp:Content>
|
|
<asp:Content ID="Content6" ContentPlaceHolderID="C" runat="Server">
|
|
<asp:UpdatePanel ID="UpFiltros" runat="server" UpdateMode="conditional">
|
|
<ContentTemplate>
|
|
<asp:Timer runat="server" ID="TimmerRefresh" Enabled="false" Interval="30000" OnTick="TimmerRefresh_Tick"></asp:Timer>
|
|
<asp:HiddenField ID="CommandArg" runat="server" ClientIDMode="Static" />
|
|
<asp:HiddenField ID="CommandArgHistorico" runat="server" ClientIDMode="Static" />
|
|
<asp:HiddenField ID="HdnCveDipositivo" runat="server" ClientIDMode="Static" />
|
|
<asp:HiddenField ID="HdnKM" runat="server" ClientIDMode="Static" />
|
|
<asp:HiddenField ID="HdnTipo" Value="Geocerca" runat="server" ClientIDMode="Static" />
|
|
<asp:HiddenField ID="GeoCerca" runat="server" ClientIDMode="Static" />
|
|
<asp:HiddenField ID="GeoRutaHistorico" runat="server" ClientIDMode="Static" />
|
|
<asp:HiddenField ID="HdnOpcion" ClientIDMode="static" runat="server" />
|
|
<asp:HiddenField ID="HdnDirecciones" ClientIDMode="static" runat="server" />
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
<asp:UpdatePanel ID="UpDatosMapa" runat="server" UpdateMode="Conditional">
|
|
<ContentTemplate>
|
|
<asp:HiddenField ID="HdnJSScript" runat="server" ClientIDMode="Static" Value="[]" />
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
<div id="map"></div>
|
|
<div id="divComandos" class="modal ADS fade" role="dialog">
|
|
<div class="modal-dialog">
|
|
<asp:UpdatePanel ID="UpAgregar" class="modal-content rowpadding" tabindex="-1" runat="server" UpdateMode="Conditional">
|
|
<ContentTemplate>
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
|
<span aria-hidden="true">×</span>
|
|
</button>
|
|
<h4 class="modal-title" id="myModalLabel">Comandos para vehículo: </h4>
|
|
</div>
|
|
<div class="modal-body">
|
|
<asp:UpdatePanel ID="UpBodyTipoEquipo" UpdateMode="Conditional" runat="server">
|
|
<ContentTemplate>
|
|
<asp:Button runat="server" ID="BtnCargaComandos" Style="display: none" />
|
|
<asp:GridView ID="GvComandos" runat="server" DataKeyNames="CveComando, RequiereValor" Style="table-layout: fixed" AutoGenerateColumns="False" ShowHeader="True" EmptyDataText="No se encontraron comandos para este modelo" GridLines="none" ToolTip="Listado de Comandos" data-sort="false" CssClass="table table-striped table-hover Widthall ScrollAD">
|
|
<Columns>
|
|
<asp:TemplateField ItemStyle-Width="10%" ItemStyle-HorizontalAlign="Center">
|
|
<ItemTemplate>
|
|
<asp:Button ID="BtnEnviar" runat="server" CssClass="btn btn-primary" CommandName="EnviarComando" CommandArgument="<%# CType(Container, GridViewRow).RowIndex %>" Text="Enviar" />
|
|
</ItemTemplate>
|
|
</asp:TemplateField>
|
|
<asp:BoundField HeaderText="Comando" DataField="Comando" ItemStyle-Width="40%" FooterStyle-HorizontalAlign="Left" />
|
|
<asp:TemplateField ItemStyle-Width="20%" ItemStyle-HorizontalAlign="Center">
|
|
<HeaderTemplate>Valor</HeaderTemplate>
|
|
<ItemTemplate>
|
|
<asp:TextBox ID="TxtValor" Visible="false" Width="99px" runat="server" Text=""></asp:TextBox>
|
|
</ItemTemplate>
|
|
</asp:TemplateField>
|
|
<asp:BoundField DataField="UltimaFechaEjecucion" ItemStyle-Width="20%" HeaderText="Última Ejecución" ItemStyle-HorizontalAlign="center" />
|
|
<asp:BoundField DataField="FechaRespuesta" ItemStyle-Width="20%" HeaderText="Última Respuesta" ItemStyle-HorizontalAlign="center" />
|
|
</Columns>
|
|
</asp:GridView>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
<%-- <asp:UpdatePanel ID="UpBodyTipoEquipo" UpdateMode="Conditional" runat="server">
|
|
<ContentTemplate>
|
|
<div class="row" style="margin-left: 0px; margin-top: 5px; margin-bottom: 15px;">
|
|
<div class="col-md-4">
|
|
<asp:LinkButton runat="server" Style="width: 150px; text-align: center" ID="BtnApagarMotor" CssClass="btn btn-danger" Text="Apagar Motor" />
|
|
</div>
|
|
|
|
<div class="col-md-4" style="padding-right: 0px">
|
|
<asp:TextBox ID="TxtTelefonoPanico" runat="server" Style="width: 150px; height: 100%; float: right;" Type="number" MaxLength="10" />
|
|
<asp:RequiredFieldValidator ID="RFVTelefonoPanico" runat="server" ControlToValidate="TxtTelefonoPanico" Display="None" ErrorMessage="<b><span style='text-decoration: underline'>ERROR:</span></b><br />El campo <b>''Telefono''</b> es necesario, por favor ingréselo." ValidationGroup="GrpBotonPanico"></asp:RequiredFieldValidator>
|
|
<ajax:ValidatorCalloutExtender ID="VCETelefonoPanico" runat="server" HighlightCssClass="vco" TargetControlID="RFVTelefonoPanico" Width="350px"></ajax:ValidatorCalloutExtender>
|
|
</div>
|
|
|
|
<div class="col-md-4">
|
|
<asp:LinkButton runat="server" Style="width: 150px; text-align: center" ID="BtnTelefonoPanico" CssClass="btn btn-danger" Text="Telefono Panico" ValidationGroup="GrpBotonPanico" />
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row" style="margin-left: 0px; margin-top: 5px; margin-bottom: 15px;">
|
|
<div class="col-md-4">
|
|
<asp:LinkButton runat="server" Style="width: 150px; text-align: center" ID="BtnEncenderMotor" CssClass="btn btn-success" Text="Encender Motor" />
|
|
</div>
|
|
|
|
<div class="col-md-4" style="padding-right: 0px">
|
|
<asp:DropDownList CssClass="form-control input-sm" Style="float: right; height: 100%;" ID="DdlTipoBateria" runat="server" Width="150px">
|
|
<asp:ListItem Value="0" Text="ST Solo en Movimiento"></asp:ListItem>
|
|
<asp:ListItem Value="1" Text="Intervalos de Tiempo" Selected="True"></asp:ListItem>
|
|
</asp:DropDownList>
|
|
</div>
|
|
|
|
<div class="col-md-4">
|
|
<asp:LinkButton runat="server" Style="width: 150px; text-align: center" ID="BtnAhorroBateria" CssClass="btn btn-success" Text="Ahorro Bateria" />
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row" style="margin-left: 0px; margin-top: 5px; margin-bottom: 15px;">
|
|
<div class="col-md-4">
|
|
<asp:LinkButton runat="server" Style="width: 150px; text-align: center" ID="BtnProbarEncendido" CssClass="btn btn-primary" Text="Abrir Compuerta" />
|
|
</div>
|
|
|
|
<div class="col-md-4">
|
|
<asp:LinkButton runat="server" Style="width: 150px; text-align: center" ID="BtnInfoDispositivo" CssClass="btn btn-primary" Text="Cerrar Compuerta" />
|
|
</div>
|
|
|
|
<div class="col-md-4">
|
|
<asp:LinkButton runat="server" Style="width: 150px; text-align: center" ID="BtnReinicio" CssClass="btn btn-primary" Text="Reiniciar" />
|
|
</div>
|
|
</div>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>--%>
|
|
</div>
|
|
<%--<div class="modal-footer">
|
|
<asp:UpdatePanel ID="UpFooter" runat="server" UpdateMode="Conditional">
|
|
<ContentTemplate>
|
|
<asp:LinkButton ID="BtnBuscarEquipoC" runat="server" CssClass="btn btn-primary" ValidationGroup="GrpObligatorio"> <i class='fa fa-search '></i> Buscar</asp:LinkButton>
|
|
<button id="btnCancelar" class="btn btn-default" data-dismiss="modal">Cancelar</button>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
</div>--%>
|
|
</div>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
</div>
|
|
</div>
|
|
<asp:UpdatePanel runat="server" UpdateMode="Conditional" ID="UPModalBusqueda">
|
|
<ContentTemplate>
|
|
<div id="dvConsulta" class="modal ADS fade" role="dialog">
|
|
<div class="modal-dialog">
|
|
<asp:UpdatePanel ID="UPConsulta" class="modal-content rowpadding" tabindex="-1" runat="server" UpdateMode="Conditional">
|
|
<ContentTemplate>
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
|
<span aria-hidden="true">×</span>
|
|
</button>
|
|
<h4 class="modal-title" id="myModalLabel2" runat="server">Rastreo Vehícular</h4>
|
|
</div>
|
|
<div class="modal-body">
|
|
<asp:UpdatePanel runat="server" ID="upFechas" UpdateMode="Conditional">
|
|
<ContentTemplate>
|
|
<div runat="server" id="dvFechas">
|
|
<ul class="list-inline" style="font-size: 12px; margin-top: 15px; margin-left: 0px; margin-bottom: 20px;">
|
|
<li>Fecha Inicio:
|
|
<div class="input-group input-sm date date-picker " data-date-format="dd/mm/yyyy hh:mm" style="display: inline-block;">
|
|
<asp:TextBox ID="txtFechaI" runat="server" CssClass="form-control input-sm ADDateTimePicker" CausesValidation="true" MaxLength="18" Width="132px "></asp:TextBox>
|
|
<asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ControlToValidate="txtFechaI" Display="None" ErrorMessage="<b><span style='text-decoration: underline'>ERROR:</span></b><br />El campo <b>''Fecha Inicio''</b> es necesario, por favor seleccione uno." ValidationGroup="GrpFechas"></asp:RequiredFieldValidator>
|
|
<ajax:ValidatorCalloutExtender ID="ValidatorCalloutExtender1" runat="server" HighlightCssClass="vco" TargetControlID="RequiredFieldValidator4" Width="350px"></ajax:ValidatorCalloutExtender>
|
|
</div>
|
|
</li>
|
|
<li>Fecha Fin:
|
|
<div class="input-group input-sm date date-picker " data-date-format="dd/mm/yyyy" style="display: inline-block;">
|
|
<asp:TextBox ID="txtFechaF" runat="server" CssClass="form-control input-sm ADDateTimePicker" CausesValidation="true" MaxLength="18" Width="132px "></asp:TextBox>
|
|
<asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" ControlToValidate="txtFechaF" Display="None" ErrorMessage="<b><span style='text-decoration: underline'>ERROR:</span></b><br />El campo <b>''Fecha Fin''</b> es necesario, por favor seleccione uno." ValidationGroup="GrpFechas"></asp:RequiredFieldValidator>
|
|
<ajax:ValidatorCalloutExtender ID="ValidatorCalloutExtender2" runat="server" HighlightCssClass="vco" TargetControlID="RequiredFieldValidator5" Width="350px"></ajax:ValidatorCalloutExtender>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
<%--<div class="row" style="margin-top: 10px; margin-bottom: 20px;">
|
|
<div class="col-md-1">Fecha</div>
|
|
<div class="col-md-5">
|
|
|
|
</div>
|
|
<div class="col-md-1">Fecha</div>
|
|
<div class="col-md-5">
|
|
|
|
</div>
|
|
</div>--%>
|
|
<div class="row" style="margin-left: 0px; margin-top: 5px; margin-bottom: 15px;">
|
|
<div class="col-md-4">
|
|
<asp:LinkButton runat="server" Style="width: 150px; text-align: center" ID="BtnUltimas2" OnClientClick="ConsultaFecha('2'); return false;" CssClass="btn default" Text="Últimas dos horas" />
|
|
</div>
|
|
<div class="col-md-4">
|
|
<asp:LinkButton runat="server" Style="width: 150px; text-align: center" ID="BtnUltimas8" OnClientClick="ConsultaFecha('8'); return false;" CssClass="btn default" Text="Últimas ocho horas" />
|
|
</div>
|
|
<div class="col-md-4">
|
|
<asp:LinkButton runat="server" Style="width: 150px; text-align: center" ID="BtnHoy" OnClientClick="ConsultaFecha('24'); return false;" CssClass="btn default" Text="Hoy" />
|
|
</div>
|
|
</div>
|
|
<div class="row" style="margin-left: 0px; margin-top: 5px; margin-bottom: 25px;">
|
|
<div class="col-md-4">
|
|
<asp:LinkButton runat="server" Style="width: 150px; text-align: center" ID="BtnAyer" OnClientClick="ConsultaFecha('48'); return false;" CssClass="btn default" Text="Ayer" />
|
|
</div>
|
|
<div class="col-md-4">
|
|
<asp:LinkButton runat="server" Style="width: 150px; text-align: center" ID="BtnSemana" OnClientClick="ConsultaFecha('Week'); return false;" CssClass="btn default" Text="Última Semana" />
|
|
</div>
|
|
<div class="col-md-4">
|
|
<asp:LinkButton runat="server" Style="width: 150px; text-align: center" ID="BtnMes" OnClientClick="ConsultaFecha('Month'); return false;" CssClass="btn default" Text="Mes en Curso" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
<asp:UpdatePanel runat="server" ID="UpTrazo" UpdateMode="Conditional">
|
|
<ContentTemplate>
|
|
<div class="row">
|
|
<div class="col-md-3">
|
|
<div runat="server" visible="False" id="dvTrazo" class="form-group form-md-line-input input-iconright">
|
|
<label>Trazar Línea: </label>
|
|
<br />
|
|
<asp:CheckBox ID="chkTrazarLinea" Text=" " runat="server" CssClass="chksino" Width="250px"></asp:CheckBox>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div runat="server" visible="False" id="dvTrazoGeo" class="form-group form-md-line-input input-iconright">
|
|
<label>Trazar Geocercas: </label>
|
|
<br />
|
|
<asp:CheckBox ID="ChkTrazarGeocercas" Text=" " runat="server" CssClass="chksino" Width="250px"></asp:CheckBox>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
</div>
|
|
</div>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
<asp:UpdatePanel runat="server" ID="UpMinutos" UpdateMode="Conditional">
|
|
<ContentTemplate>
|
|
<div class="row" id="dvMinutos" runat="server" visible="false" style="margin-top: 10px; margin-bottom: 20px;">
|
|
<div class="col-md-3">Minutos Tiempo Muerto:</div>
|
|
<div class="col-md-5">
|
|
<div class="input-group input-sm date date-picker " data-date-format="dd/mm/yyyy hh:mm" style="display: inline-block;">
|
|
<asp:TextBox ID="TxtMinutos" runat="server" CssClass="form-control input-sm" Text="5" CausesValidation="true" MaxLength="18" Width="132px "></asp:TextBox>
|
|
<asp:RequiredFieldValidator ID="RFVMinutos" runat="server" ControlToValidate="TxtMinutos" Display="None" ErrorMessage="<b><span style='text-decoration: underline'>ERROR:</span></b><br />El campo <b>''Minutos''</b> es necesario, por favor seleccione uno." ValidationGroup="GrpFechas"></asp:RequiredFieldValidator>
|
|
<ajax:ValidatorCalloutExtender ID="VCOProveedor" runat="server" HighlightCssClass="vco" TargetControlID="RFVMinutos" Width="350px"></ajax:ValidatorCalloutExtender>
|
|
<ajax:FilteredTextBoxExtender ID="FTBSerie" runat="server" TargetControlID="TxtMinutos" FilterType="Numbers" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
<div id="dvDispositivos" runat="server">
|
|
<div class="row" style="margin-left: 0px; margin-top: 5px; margin-bottom: 5px; text-align: right" align="left">
|
|
<div style="margin-right: 15px">
|
|
<input type="text" id="TxtBusqueda" class="form-control input-sm" onkeyup="<%= String.Format("FiltrarTabla('TxtBusqueda','{0}')", GvDispositivos.ClientID) %>" style="display: inline-block; margin-right: -20px; width: 150px;" />
|
|
<a href="javascript:;" onclick="<%= String.Format("FiltrarTabla('TxtBusqueda','{0}')", GvDispositivos.ClientID) %>" style="margin-top: -3px;" class="btn btn-circle btn-sm label-info"><i class="icon-magnifier"></i></a>
|
|
</div>
|
|
</div>
|
|
<asp:GridView ID="GvDispositivos" runat="server" GridLines="None" DataKeyNames="CveDispositivo,SerieVehiculo,DevID,NoEconomico,NombreVehiculo" CssClass="table table-striped table-advance table-hover Widthall ScrollAD" data-sort="true" BorderWidth="1" BorderColor="#D3D3D3" CellSpacing="0" Width="100%" AutoGenerateColumns="False" data-heighterror="800" EmptyDataText="No se encontraron registros">
|
|
<Columns>
|
|
<asp:TemplateField ItemStyle-HorizontalAlign="center" ItemStyle-Width="10%" ItemStyle-CssClass="NoClick">
|
|
<HeaderTemplate>
|
|
<asp:CheckBox runat="server" ID="chkSelectAll" CssClass="ChkAllClick" />
|
|
</HeaderTemplate>
|
|
<ItemTemplate>
|
|
<asp:CheckBox runat="server" ID="chkDis" CssClass="ChkAllEvt" />
|
|
</ItemTemplate>
|
|
</asp:TemplateField>
|
|
<asp:BoundField DataField="NoEconomico" ItemStyle-Width="25%" HeaderText="Número Económico" ItemStyle-HorizontalAlign="Left" />
|
|
<asp:BoundField DataField="ModeloVehiculo" ItemStyle-Width="25%" HeaderText="Modelo Vehículo" ItemStyle-HorizontalAlign="Left" />
|
|
<asp:BoundField DataField="AñoVehiculo" ItemStyle-Width="15%" HeaderText="Año Vehículo" ItemStyle-HorizontalAlign="center" />
|
|
<asp:BoundField DataField="PlacasVehiculo" ItemStyle-Width="25%" HeaderText="Placas Vehículo" ItemStyle-HorizontalAlign="center" />
|
|
</Columns>
|
|
</asp:GridView>
|
|
</div>
|
|
<asp:UpdatePanel ID="upEventos" runat="server" UpdateMode="Conditional">
|
|
<ContentTemplate>
|
|
<div id="dvEventos" runat="server" visible="false">
|
|
<div class="row" style="margin-left: 0px; margin-top: 5px; margin-bottom: 5px; text-align: right" align="left">
|
|
<div style="margin-right: 15px">
|
|
<input type="text" id="TxtBusquedaEventos" class="ChkAllClick2 form-control input-sm" onkeyup="<%= String.Format("FiltrarTabla('TxtBusquedaEventos','{0}')", GvEventos.ClientID) %>" style="display: inline-block; margin-right: -20px; width: 150px;" />
|
|
<a href="javascript:;" onclick="<%= String.Format("FiltrarTabla('TxtBusquedaEventos','{0}')", GvEventos.ClientID) %>" style="margin-top: -3px;" class="btn btn-circle btn-sm label-info"><i class="icon-magnifier"></i></a>
|
|
</div>
|
|
</div>
|
|
<asp:GridView ID="GvEventos" runat="server" GridLines="None" DataKeyNames="CveEvento,Evento,Imagen" CssClass="table table-striped table-advance table-hover Widthall ScrollAD" data-heightfijo="100" data-height="100" data-sort="true" BorderWidth="1" BorderColor="#D3D3D3" CellSpacing="0" Width="100%" AutoGenerateColumns="False" EmptyDataText="No se encontraron registros">
|
|
<Columns>
|
|
<asp:TemplateField ItemStyle-HorizontalAlign="center" ItemStyle-Width="5%">
|
|
<ItemTemplate>
|
|
<asp:CheckBox runat="server" ID="chkEv" CssClass="ChkAllEvt" />
|
|
</ItemTemplate>
|
|
</asp:TemplateField>
|
|
<asp:BoundField DataField="Evento" ItemStyle-Width="35%" HeaderText="Evento" ItemStyle-HorizontalAlign="Left" />
|
|
<asp:ImageField ControlStyle-Width="28" ControlStyle-Height="28" DataImageUrlField="Imagen" DataImageUrlFormatString="~\Imagenes\{0}" ItemStyle-Width="20%" HeaderText="Imagen" ItemStyle-HorizontalAlign="Center" />
|
|
</Columns>
|
|
</asp:GridView>
|
|
</div>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<asp:LinkButton ID="BtnRastrear" runat="server" Text="Rastreo" CssClass="btn btn-primary"></asp:LinkButton>
|
|
<button data-dismiss="modal" class="btn btn-default">Cancelar</button>
|
|
</div>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
</div>
|
|
</div>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
<div class="modal fade bottom in" style="bottom: unset; z-index: 539" id="h">
|
|
<div class="modal-dialog" style="position: fixed; bottom: 0; margin: 0px,0px,0px,0px; width: 100%; padding: 0px, 0px, 0px, 0px; border-style: solid; border-color: rgb(68, 77, 88); z-index: 539;">
|
|
<div class="modal-content">
|
|
<div class="modal-body" style="padding: 5px;">
|
|
<asp:UpdatePanel runat="server" ID="UPGV" UpdateMode="Conditional">
|
|
<ContentTemplate>
|
|
<div id="DivFechasGVBarra" runat="server" visible="false">
|
|
<div class="row">
|
|
<div class="col-md-4">
|
|
<ul class="list-inline" style="font-size: 12px; margin-top: 15px; margin-left: 0px;">
|
|
<li>Fecha I.:
|
|
<div class="input-group input-sm date date-picker " data-date-format="dd/mm/yyyy" style="display: inline-block;">
|
|
<asp:TextBox ID="TxtFechaGVI" runat="server" CssClass="form-control input-sm ADDateTimePicker" CausesValidation="true" MaxLength="10" Width="110px "></asp:TextBox>
|
|
</div>
|
|
</li>
|
|
<li>Fecha F.:
|
|
<div class="input-group input-sm date date-picker " data-date-format="dd/mm/yyyy" style="display: inline-block;">
|
|
<asp:TextBox ID="TxtFechaGVF" runat="server" CssClass="form-control input-sm ADDateTimePicker" CausesValidation="true" MaxLength="10" Width="110px "></asp:TextBox>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<asp:Button ID="BtnFiltrarFechaGV" OnClick="BtnFiltrarFechaGV_Click" Text="Consultar Historial" runat="server" Style="margin-top: 15px" CssClass="btn btn-primary" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row" id="DivSeguimiento" visible="false" runat="server" style="width: 300px">
|
|
<div class="col-md-6">
|
|
<label>Realizar Seguimiento</label>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<asp:CheckBox ID="ChkSeguimiento" ClientIDMode="Static" Text=" " runat="server" CssClass="chksino"></asp:CheckBox>
|
|
</div>
|
|
</div>
|
|
<div id="DvPaginacion" runat="server" class="row" visible="false">
|
|
<div class="col-md-11">
|
|
<asp:Label ID="LblRegistros" runat="server" style="display:inline-block;"></asp:Label>
|
|
</div>
|
|
<div class="col-md-1" style="display:inline-block;position:relative">
|
|
<asp:HiddenField ID="HdnIndexPage" runat="server" ClientIDMode="Static" Value="0" />
|
|
<asp:LinkButton ID="btnPagePrev" runat="server" style="vertical-align:top;" Text="<i class='fa fa-angle-left' style='font-size:24px' aria-hidden='true'></i> Anterior" OnClick="btnPagePrev_Click" Enabled="false"/>
|
|
<asp:LinkButton ID="btnPageNext" runat="server" style="vertical-align:top;" Text="Siguiente <i class='fa fa-angle-right' aria-hidden='true' style='font-size:24px'></i>" OnClick="btnPageNext_Click" />
|
|
</div>
|
|
</div>
|
|
<asp:GridView ID="GvBarra" runat="server" GridLines="None" PageSize="1000" AllowPaging="true" AllowCustomPaging="true" DataKeyNames="Vehiculo, Posicion,Fecha,Velocidad, CveDispositivo" CssClass="table table-striped table-advance table-hover Widthall ADScrollPaginator2" data-sort="true" data-height="150px;" BorderWidth="1" BorderColor="#D3D3D3" CellSpacing="0" Width="100%" AutoGenerateColumns="False" EmptyDataText="No se encontraron registros">
|
|
<Columns>
|
|
<asp:BoundField DataField="Vehiculo" ItemStyle-Width="15%" HeaderText="Vehículo" ItemStyle-HorizontalAlign="center" />
|
|
<asp:BoundField DataField="Fecha" ItemStyle-Width="15%" HeaderText="Fecha Reporte" ItemStyle-HorizontalAlign="center" />
|
|
<asp:TemplateField ItemStyle-Width="30%" HeaderText="Dirección" ItemStyle-HorizontalAlign="center">
|
|
<ItemTemplate>
|
|
<asp:Literal runat="server" Text="Haga click para ver Dirección" ID="ltlDireccion"></asp:Literal>
|
|
</ItemTemplate>
|
|
</asp:TemplateField>
|
|
<asp:BoundField DataField="TiempoDetenido" ItemStyle-Width="25%" DataFormatString="{0} Minutos" HeaderText="Tiempo Detenido" ItemStyle-HorizontalAlign="center" />
|
|
<asp:BoundField DataField="Evento" ItemStyle-Width="25%" HeaderText="Eventos" ItemStyle-HorizontalAlign="center" />
|
|
<asp:BoundField DataField="Velocidad" ItemStyle-Width="10%" DataFormatString="{0:N2} KM/H" HeaderText="Velocidad" ItemStyle-HorizontalAlign="center" />
|
|
</Columns>
|
|
<PagerSettings Mode="NextPrevious" Visible="true" Position="Top" />
|
|
</asp:GridView>
|
|
<asp:HiddenField ID="HdnIndexGvBarra" runat="server" ClientIDMode="Static" Value="-1" />
|
|
<asp:HiddenField ID="HdnTextFilter" runat="server" ClientIDMode="Static" Value="" />
|
|
<div runat="server" id="rowImpresionesKM" visible="false" class="row" style="margin: 0px 10px 10px 0px; text-align: right;">
|
|
<a onclick="doScaledCLick('#C_btnImprimirKM');;" class="btn btn-circle btn-sm grey"><i class='fa fa-print' aria-hidden='true'></i></a>
|
|
<a onclick="doScaledCLick('#C_BtnImprimirEXKM');" class="btn btn-circle btn-sm green"><i class='fa fa-file-excel-o' aria-hidden='true'></i></a>
|
|
</div>
|
|
<div id="DivGvKM" runat="server" class="row" style="margin-left: 0px; margin-top: 5px; margin-bottom: 5px; text-align: right" align="left">
|
|
<div style="margin-right: 15px">
|
|
<input type="text" id="TxtBusquedaKM" class="form-control input-sm" onkeyup="<%= String.Format("FiltrarTabla('TxtBusquedaKM','{0}')", GVKm.ClientID) %>" style="display: inline-block; margin-right: -20px; width: 150px;" />
|
|
<a href="javascript:;" onclick="<%= String.Format("FiltrarTabla('TxtBusquedaKM','{0}')", GVKm.ClientID) %>" style="margin-top: -3px;" class="btn btn-circle btn-sm label-info"><i class="icon-magnifier"></i></a>
|
|
</div>
|
|
</div>
|
|
<asp:GridView ID="GVKm" runat="server" GridLines="None" Visible="false" DataKeyNames="CveDispositivo" CssClass="table table-striped table-advance table-hover Widthall ScrollAD" data-sort="true" data-heighterror="800" BorderWidth="1" BorderColor="#D3D3D3" CellSpacing="0" Width="100%" AutoGenerateColumns="False" EmptyDataText="No se encontraron registros">
|
|
<Columns>
|
|
<asp:BoundField DataField="Vehiculo" ItemStyle-Width="40%" HeaderText="Vehículo" ItemStyle-HorizontalAlign="left" />
|
|
<asp:BoundField DataField="TiempoOperativo" ItemStyle-Width="25%" DataFormatString="{0:F2}" HeaderText="Tiempo Operativo" ItemStyle-HorizontalAlign="center" />
|
|
<asp:BoundField DataField="Dist" ItemStyle-Width="25%" DataFormatString="{0:F2} KM" HeaderText="Kilometros Recorridos" ItemStyle-HorizontalAlign="center" />
|
|
</Columns>
|
|
</asp:GridView>
|
|
</ContentTemplate>
|
|
<Triggers>
|
|
<asp:PostBackTrigger runat="server" ControlID="BtnFiltrarFechaGV" />
|
|
</Triggers>
|
|
</asp:UpdatePanel>
|
|
|
|
<asp:UpdatePanel UpdateMode="conditional" runat="server">
|
|
<ContentTemplate>
|
|
<asp:Button runat="server" OnClick="BtnCargaRecorrido_Click" ID="BtnCargaRecorrido" Style="display: none"></asp:Button>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
</div>
|
|
</div>
|
|
<!-- /.modal-content -->
|
|
</div>
|
|
<!-- /.modal-dialog -->
|
|
</div>
|
|
<div id="divAgregarGeoreferencia" class="modal ADS fade" role="dialog">
|
|
<div class="modal-dialog">
|
|
<asp:UpdatePanel ID="UpAgregarGeo" class="modal-content rowpadding" tabindex="-1" runat="server" UpdateMode="Conditional">
|
|
<ContentTemplate>
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
|
<span aria-hidden="true">×</span>
|
|
</button>
|
|
<h4 class="modal-title" id="myModalLabel5">Agregar Georeferencia</h4>
|
|
</div>
|
|
<div class="modal-body">
|
|
<asp:UpdatePanel ID="UpBodyAgregar" UpdateMode="Conditional" runat="server">
|
|
<ContentTemplate>
|
|
<div class="form-group form-md-line-input input-iconright">
|
|
<asp:TextBox ID="TxtNombre" runat="server" CssClass="form-control" CausesValidation="true"></asp:TextBox>
|
|
<asp:RequiredFieldValidator ID="RFVEstatusOS" runat="server" CssClass="help-block errorimput" ControlToValidate="TxtNombre" ErrorMessage="<b><span style='text-decoration: underline'>ERROR:</span></b><br />El campo <b>''Nombre''</b> es necesario, por favor ingréselo." ValidationGroup="GrpObligatorio"></asp:RequiredFieldValidator>
|
|
<label for="<%= TxtNombre.ClientID.ToString()%>">Nombre GeoReferencia:</label>
|
|
</div>
|
|
<%--<div class="form-group form-md-line-input input-iconright">
|
|
<asp:DropDownList ID="DdlEquipo" Width="230px" runat="server" DataTextField="Display" DataValueField="CveDispositivo" CssClass="form-control input-sm select2me">
|
|
</asp:DropDownList>
|
|
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" CssClass="help-block errorimput" InitialValue="-1" ControlToValidate="DdlEquipo" ErrorMessage="<b><span style='text-decoration: underline'>ERROR:</span></b><br />El campo <b>''Equipo''</b> es necesario, por favor ingréselo." ValidationGroup="GrpObligatorio"></asp:RequiredFieldValidator>
|
|
<label for="<%= DdlEquipo.ClientID.ToString()%>">Equipo:</label>
|
|
</div>--%>
|
|
<div class="form-group form-md-line-input input-iconright">
|
|
<input type="hidden" onchange="CambiaColor();" id="hidden-input" class="demo" value="#0088FF" style="margin-top: 10PX; width: 20%;">
|
|
<asp:TextBox ID="TxtColor" runat="server" Style="display: none" CssClass="form-control" MaxLength="50" CausesValidation="true" Text="#0088FF"></asp:TextBox>
|
|
<label style="margin-top: -6px" for="<%= TxtColor.ClientID.ToString()%>">Color Georeferencia:</label>
|
|
</div>
|
|
<div class="form-group form-md-line-input input-iconright">
|
|
<asp:TextBox ID="TxtTolerancia" runat="server" Style="width: 50%; display: inline-block" CssClass="form-control" CausesValidation="true"></asp:TextBox><asp:Literal runat="server" Text="mts"></asp:Literal>
|
|
<asp:RequiredFieldValidator ID="RFVTxtTolerancia" runat="server" CssClass="help-block errorimput" ControlToValidate="TxtTolerancia" ErrorMessage="<b><span style='text-decoration: underline'>ERROR:</span></b><br />El campo <b>''Tolerancia''</b> es necesario, por favor ingréselo." ValidationGroup="GrpObligatorio"></asp:RequiredFieldValidator>
|
|
<ajax:FilteredTextBoxExtender ID="FilteredTextBoxExtender1" runat="server" TargetControlID="TxtTolerancia" FilterType="Numbers" />
|
|
<label for="<%= TxtTolerancia.ClientID.ToString()%>" style="width: 50%">Tolerancia:</label>
|
|
</div>
|
|
<ul class="list-inline" style="font-size: 12px; margin-top: 15px; margin-left: 0px;">
|
|
<li>Fecha I.:
|
|
<div class="input-group input-sm date date-picker " data-date-format="dd/mm/yyyy" style="display: inline-block;">
|
|
<asp:TextBox ID="TxtFechaIG" runat="server" CssClass="form-control input-sm ADDateTimePicker" CausesValidation="true" MaxLength="10" Width="82px "></asp:TextBox>
|
|
</div>
|
|
<%-- <ajax:MaskedEditExtender ID="MEEFechaI" runat="server" TargetControlID="TxtFechaIG" Mask="99/99/9999 99:99" MaskType="Date" DisplayMoney="Left" AcceptNegative="Left"></ajax:MaskedEditExtender>
|
|
<asp:CompareValidator ID="cvFechaI" runat="server" ControlToValidate="TxtFechaIG" Display="None" ErrorMessage="El campo <b>''Fecha Inicial''</b> no tienes el formato correcto, por favor intente de nuevo con el siguiente formato: (dd/mm/yyyy)." Operator="DataTypeCheck" Type="Date" ValidationGroup="GrpObligatorio"></asp:CompareValidator>
|
|
<ajax:ValidatorCalloutExtender ID="vcoCvFI" runat="server" HighlightCssClass="vco" TargetControlID="cvFechaI" Width="350px"></ajax:ValidatorCalloutExtender>
|
|
--%></li>
|
|
<li>Fecha F.:
|
|
<div class="input-group input-sm date date-picker " data-date-format="dd/mm/yyyy" style="display: inline-block;">
|
|
<asp:TextBox ID="TxtFechaFG" runat="server" CssClass="form-control input-sm ADDateTimePicker" CausesValidation="true" MaxLength="10" Width="82px "></asp:TextBox>
|
|
</div>
|
|
<%-- <ajax:MaskedEditExtender ID="MEEFechaF" runat="server" TargetControlID="TxtFechaFG" Mask="99/99/9999 99:99" MaskType="Date" DisplayMoney="Left" AcceptNegative="Left"></ajax:MaskedEditExtender>
|
|
<asp:CompareValidator ID="cvFechaF" runat="server" ControlToValidate="TxtFechaFG" Display="None" ErrorMessage="El campo <b>''Fecha Final''</b> no tienes el formato correcto, por favor intente de nuevo con el siguiente formato: (dd/mm/yyyy)." Operator="DataTypeCheck" Type="Date" ValidationGroup="GrpObligatorio"></asp:CompareValidator>
|
|
<ajax:ValidatorCalloutExtender ID="vcoCvFF" runat="server" HighlightCssClass="vco" TargetControlID="cvFechaF" Width="350px"></ajax:ValidatorCalloutExtender>
|
|
--%></li>
|
|
</ul>
|
|
<ul class="list-inline" style="font-size: 12px; margin-top: 15px; margin-left: 0px;">
|
|
<li>Aplica Días:
|
|
</li>
|
|
<li>
|
|
<asp:CheckBox runat="server" CssClass="geo" Text="L" ID="chkLunes" />
|
|
</li>
|
|
<li>
|
|
<asp:CheckBox runat="server" CssClass="geo" Text="M" ID="chkMartes" />
|
|
</li>
|
|
<li>
|
|
<asp:CheckBox runat="server" CssClass="geo" Text="M" ID="chkMiercoles" />
|
|
</li>
|
|
<li>
|
|
<asp:CheckBox runat="server" CssClass="geo" Text="J" ID="chkJueves" />
|
|
</li>
|
|
<li>
|
|
<asp:CheckBox runat="server" CssClass="geo" Text="V" ID="chkViernes" />
|
|
</li>
|
|
<li>
|
|
<asp:CheckBox runat="server" CssClass="geo" Text="S" ID="chkSabado" />
|
|
</li>
|
|
<li>
|
|
<asp:CheckBox runat="server" CssClass="geo" Text="D" ID="chkDomingo" />
|
|
</li>
|
|
</ul>
|
|
<div class="row">
|
|
<div class="col-md-3">
|
|
<div class="form-group form-md-line-input input-iconright">
|
|
<asp:DropDownList ID="DdlGrupo" Width="230px" runat="server" DataTextField="Nombre" DataValueField="CveDispositivosGrupos" CssClass="form-control select2me">
|
|
</asp:DropDownList>
|
|
<asp:RequiredFieldValidator ID="RequiredFieldValidator7" runat="server" CssClass="help-block errorimput" InitialValue="-1" ControlToValidate="DdlGrupo" ErrorMessage="<b><span style='text-decoration: underline'>ERROR:</span></b><br />El campo <b>''Equipo''</b> es necesario, por favor ingréselo." ValidationGroup="GrpAgregarGrupo"></asp:RequiredFieldValidator>
|
|
<label for="<%= DdlGrupo.ClientID.ToString()%>">Grupo:</label>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3" style="margin-top: 12px; text-align: right;">
|
|
<asp:LinkButton ID="LnkAgregarGrupo" runat="server" CssClass="btn btn-sm btn-success" OnClick="LnkAgregarGrupo_Click" ValidationGroup="GrpAgregarGrupo"><i class='fa fa-plus' aria-hidden='true'></i></asp:LinkButton>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div class="form-group form-md-line-input input-iconright">
|
|
<asp:DropDownList ID="DdlEquipoD" Width="230px" runat="server" DataTextField="Display" DataValueField="CveDispositivo" CssClass="form-control select2me">
|
|
</asp:DropDownList>
|
|
<asp:RequiredFieldValidator ID="RFVEquipoD" runat="server" CssClass="help-block errorimput" InitialValue="-1" ControlToValidate="DdlEquipoD" ErrorMessage="<b><span style='text-decoration: underline'>ERROR:</span></b><br />El campo <b>''Equipo''</b> es necesario, por favor ingréselo." ValidationGroup="GrpAgregarVehiculo"></asp:RequiredFieldValidator>
|
|
<label for="<%= DdlEquipoD.ClientID.ToString()%>">Equipo:</label>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3" style="margin-top: 12px; text-align: right;">
|
|
<asp:LinkButton ID="LnkAgregarDisp" runat="server" CssClass="btn btn-sm btn-success" OnClick="LnkAgregarDisp_Click" ValidationGroup="GrpAgregarVehiculo"><i class='fa fa-plus' aria-hidden='true'></i></asp:LinkButton>
|
|
</div>
|
|
</div>
|
|
<br />
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<asp:GridView ID="GvEquiposDetalle" runat="server" GridLines="None" data-height="200" DataKeyNames="CveDispositivo, NoEconomico" CssClass="table table-striped table-advance table-hover Widthall ScrollAD" data-sort="true" BorderWidth="1" BorderColor="#D3D3D3" CellSpacing="0" Width="100%" AutoGenerateColumns="False" OnRowDeleting="GvEquiposDetalle_RowDeleting" EmptyDataText="Seleccione el vehiculo y presione agregar.">
|
|
<Columns>
|
|
<asp:BoundField DataField="NoEconomico" ItemStyle-Width="20%" HeaderText="NoEconomico" ItemStyle-HorizontalAlign="Left" />
|
|
<asp:TemplateField HeaderText="Acciones" ItemStyle-Width="10%" ItemStyle-HorizontalAlign="Center">
|
|
<ItemTemplate>
|
|
<asp:LinkButton ID="BtnBorrarDispositivo" runat="server" AlternateText="Eliminar" CausesValidation="False" CommandName="Delete" CssClass="btn btn-circle btn-sm red" Text="<i class='icon-trash'></i>" data-toggle="confirmation" data-popout="true" data-original-title="¿Desea eliminar este dispositivo?" data-btn-ok-label="si" />
|
|
</ItemTemplate>
|
|
</asp:TemplateField>
|
|
</Columns>
|
|
</asp:GridView>
|
|
</div>
|
|
</div>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
<div class="modal-footer">
|
|
<asp:UpdatePanel ID="UpFooter" runat="server" UpdateMode="Conditional">
|
|
<ContentTemplate>
|
|
<asp:LinkButton ID="BtnAgregarGeoreferencia" runat="server" CssClass="btn btn-primary" ValidationGroup="GrpObligatorio"> <i class='material-icons'>done_all</i> Agregar</asp:LinkButton>
|
|
<button id="btnCancelarTE" class="btn btn-default" data-dismiss="modal" value="Cancelar">Cancelar </button>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
</div>
|
|
</div>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="divAgregarGeoreferenciaHistorico" class="modal ADS fade" role="dialog">
|
|
<div class="modal-dialog">
|
|
<asp:UpdatePanel ID="UpGeoreferencia" class="modal-content rowpadding" tabindex="-1" runat="server" UpdateMode="Conditional">
|
|
<ContentTemplate>
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
|
<span aria-hidden="true">×</span>
|
|
</button>
|
|
<h4 class="modal-title">Agregar Georeferencia</h4>
|
|
</div>
|
|
<div class="modal-body">
|
|
<asp:UpdatePanel ID="UpNodalGeoHistorico" UpdateMode="Conditional" runat="server">
|
|
<ContentTemplate>
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div class="form-group form-md-line-input input-iconright">
|
|
<asp:TextBox ID="TxtNombreHis" runat="server" CssClass="form-control" CausesValidation="true"></asp:TextBox>
|
|
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" CssClass="help-block errorimput" ControlToValidate="TxtNombreHis" ErrorMessage="<b><span style='text-decoration: underline'>ERROR:</span></b><br />El campo <b>''Nombre''</b> es necesario, por favor ingréselo." ValidationGroup="ValidaH"></asp:RequiredFieldValidator>
|
|
<label for="<%= TxtNombreHis.ClientID.ToString()%>">Nombre GeoReferencia:</label>
|
|
</div>
|
|
<div class="form-group form-md-line-input input-iconright">
|
|
<asp:DropDownList ID="DdlEquipoHis" Width="230px" runat="server" DataTextField="Display" DataValueField="CveDispositivo" CssClass="form-control input-sm select2me">
|
|
</asp:DropDownList>
|
|
<asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" CssClass="help-block errorimput" InitialValue="-1" ControlToValidate="DdlEquipoHis" ErrorMessage="<b><span style='text-decoration: underline'>ERROR:</span></b><br />El campo <b>''Equipo''</b> es necesario, por favor ingréselo." ValidationGroup="ValidaH"></asp:RequiredFieldValidator>
|
|
<label for="<%= DdlEquipoHis.ClientID.ToString()%>">Equipo:</label>
|
|
</div>
|
|
<div class="form-group form-md-line-input input-iconright">
|
|
<input type="hidden" onchange="CambiaColorH();" id="hidden-input-Hist" class="demo" value="#0088FF" style="margin-top: 10PX; width: 20%;">
|
|
<asp:TextBox ID="TxtColorH" runat="server" Style="display: none" CssClass="form-control" MaxLength="50" CausesValidation="true" Text="#0088FF"></asp:TextBox>
|
|
<label style="margin-top: -6px" for="<%= TxtColorH.ClientID.ToString()%>">Color Georeferencia:</label>
|
|
</div>
|
|
<div class="form-group form-md-line-input input-iconright">
|
|
<asp:TextBox ID="TxtToleHis" runat="server" Style="width: 50%; display: inline-block" CssClass="form-control" CausesValidation="true"></asp:TextBox><asp:Literal runat="server" Text="mts"></asp:Literal>
|
|
<asp:RequiredFieldValidator ID="RequiredFieldValidator6" runat="server" CssClass="help-block errorimput" ControlToValidate="TxtToleHis" ErrorMessage="<b><span style='text-decoration: underline'>ERROR:</span></b><br />El campo <b>''Tolerancia''</b> es necesario, por favor ingréselo." ValidationGroup="ValidaH"></asp:RequiredFieldValidator>
|
|
<ajax:FilteredTextBoxExtender ID="FilteredTextBoxExtender2" runat="server" TargetControlID="TxtToleHis" FilterType="Numbers" />
|
|
<label for="<%= TxtToleHis.ClientID.ToString()%>" style="width: 50%">Tolerancia:</label>
|
|
</div>
|
|
<ul class="list-inline" style="font-size: 12px; margin-top: 15px; margin-left: 0px;">
|
|
<li>Fecha I.:
|
|
<div class="input-group input-sm date date-picker " data-date-format="dd/mm/yyyy" style="display: inline-block;">
|
|
<asp:TextBox ID="TxtFechaIHis" runat="server" CssClass="form-control input-sm ADDateTimePicker" CausesValidation="true" MaxLength="10" Width="82px "></asp:TextBox>
|
|
</div>
|
|
</li>
|
|
<li>Fecha F.:
|
|
<div class="input-group input-sm date date-picker " data-date-format="dd/mm/yyyy" style="display: inline-block;">
|
|
<asp:TextBox ID="TxtFechaFHis" runat="server" CssClass="form-control input-sm ADDateTimePicker" CausesValidation="true" MaxLength="10" Width="82px "></asp:TextBox>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
<ul class="list-inline" style="font-size: 12px; margin-top: 15px; margin-left: 0px;">
|
|
<li>Aplica Días:
|
|
</li>
|
|
<li>
|
|
<asp:CheckBox runat="server" CssClass="geo" Text="L" ID="ChkLunesH" />
|
|
</li>
|
|
<li>
|
|
<asp:CheckBox runat="server" CssClass="geo" Text="M" ID="ChkMartesH" />
|
|
</li>
|
|
<li>
|
|
<asp:CheckBox runat="server" CssClass="geo" Text="M" ID="ChkMiercolesH" />
|
|
</li>
|
|
<li>
|
|
<asp:CheckBox runat="server" CssClass="geo" Text="J" ID="ChkJuevesH" />
|
|
</li>
|
|
<li>
|
|
<asp:CheckBox runat="server" CssClass="geo" Text="V" ID="ChkViernesH" />
|
|
</li>
|
|
<li>
|
|
<asp:CheckBox runat="server" CssClass="geo" Text="S" ID="ChkSabadoH" />
|
|
</li>
|
|
<li>
|
|
<asp:CheckBox runat="server" CssClass="geo" Text="D" ID="ChkDomingoH" />
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<asp:LinkButton ID="LnkAgregarGeoHist" runat="server" CssClass="btn btn-primary" ValidationGroup="ValidaH" OnClick="LnkAgregarGeoHist_Click1"> <i class='material-icons'>done_all</i> Agregar</asp:LinkButton>
|
|
<button id="btnCancelarTEH" class="btn btn-default" data-dismiss="modal" value="Cancelar">Cancelar </button>
|
|
</div>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
</div>
|
|
</div>
|
|
<div runat="server" class="row" style="margin: 0px 0px 10px 0px; display: none">
|
|
<asp:Button runat="server" OnClick="btnImprimir_Click" ID="btnImprimir" CommandArgument="PDF" ToolTip="Imprimir en PDF" CssClass="btn btn-circle mysmallbtn grey" Text="<i class='fa fa-print' aria-hidden='true'></i>"></asp:Button>
|
|
<asp:Button runat="server" OnClick="btnImprimir_Click" ID="BtnImprimirEX" CommandArgument="EXCEL" ToolTip="Imprimir en EXCEL" CssClass="btn btn-circle btn-xs mysmallbtn green" Text="<i class='fa fa-file-excel-o' aria-hidden='true'></i>"></asp:Button>
|
|
<asp:Button runat="server" OnClick="btnImprimir_ClickKM" ID="btnImprimirKM" CommandArgument="PDF" ToolTip="Imprimir en PDF" CssClass="btn btn-circle btn-sm grey" Text="<i class='fa fa-print' aria-hidden='true'></i>"></asp:Button>
|
|
<asp:Button runat="server" OnClick="btnImprimir_ClickKM" ID="BtnImprimirEXKM" CommandArgument="EXCEL" ToolTip="Imprimir en EXCEL" CssClass="btn btn-circle btn-sm green" Text="<i class='fa fa-file-excel-o' aria-hidden='true'></i>"></asp:Button>
|
|
</div>
|
|
<div class="CustomSpinner" style="display: none;"></div>
|
|
</asp:Content>
|
|
<asp:Content ID="Content7" ContentPlaceHolderID="JS" runat="Server">
|
|
<%-- <script src="../Metronic/assets/global/scripts/jquery.dataTables.min.js"></script>
|
|
<script src="../Metronic/assets/global/plugins/datatables/extensions/Scroller/js/dataTables.scroller.js"></script>
|
|
<script src="../Metronic/assets/global/plugins/datatables/extensions/KeyTable/js/dataTables.keyTable.js"></script>--%>
|
|
<script src="../Metronic/assets/global/plugins/datatables2/datatables.min.js"></script>
|
|
<script src="../Metronic/assets/global/plugins/datatables2/extensions/Scroller/js/dataTables.scroller.js"></script>
|
|
<script src="../Metronic/assets/global/plugins/datatables2/extensions/KeyTable/js/dataTables.keyTable.js"></script>
|
|
<script>
|
|
|
|
jQuery(document).ready(function () {
|
|
|
|
loaderinit = function () {
|
|
setTimeout(
|
|
function () {
|
|
$('.CustomSpinner').show();
|
|
}, 10);
|
|
}
|
|
loaderEnd = function () {
|
|
setTimeout(
|
|
function () {
|
|
$('.CustomSpinner').hide();
|
|
}, 10);
|
|
}
|
|
|
|
|
|
});
|
|
|
|
var image = '/Imagenes/rsz_11rsz_car.png';
|
|
var geocoder;
|
|
var map;
|
|
var directionsService;
|
|
var directionsDisplay;
|
|
var polylinesRoute = [];
|
|
var directionsDisplayArray = [];
|
|
|
|
var retorno;
|
|
$('body').on('click', '.ChkAllClick input', function () { $(".ChkAllEvt input").not(this).prop('checked', $('.ChkAllClick input').is(':checked')); });
|
|
$('body').on('click', '.ChkAllClick2 input', function () { $(".ChkAllEvt input").not(this).prop('checked', $('.ChkAllClick2 input').is(':checked')); });
|
|
function initMap() {
|
|
map = new google.maps.Map(document.getElementById('map'), {
|
|
center: { lat: 24.6345, lng: -102.5528 },
|
|
zoom: 6
|
|
});
|
|
|
|
var ShowDiv1 = document.createElement('div');
|
|
var ShowDivControl = new ShowDiv(ShowDiv1, map);
|
|
|
|
|
|
ShowDiv1.index = 1;
|
|
ShowDiv1.id = "showdiv1"
|
|
|
|
map.controls[google.maps.ControlPosition.BOTTOM_CENTER].push(ShowDiv1);
|
|
|
|
|
|
var upControlDiv = document.createElement('div');
|
|
var upControl = new ControlLabels(upControlDiv, map);
|
|
|
|
upControlDiv.index = 1;
|
|
map.controls[google.maps.ControlPosition.TOP_LEFT].push(upControlDiv);
|
|
|
|
var upGeoDiv = document.createElement('div');
|
|
var upGeo = new ControlGeocercas(upGeoDiv, map);
|
|
|
|
map.controls[google.maps.ControlPosition.TOP_LEFT].push(upGeoDiv);
|
|
|
|
geocoder = new google.maps.Geocoder();
|
|
|
|
google.maps.event.addListener(map, "click", function (event) {
|
|
closeLastOpenedInfoWindow();
|
|
});
|
|
|
|
directionsService = new google.maps.DirectionsService;
|
|
directionsDisplay = new google.maps.DirectionsRenderer;
|
|
directionsDisplay.setOptions({ suppressMarkers: true });
|
|
directionsDisplay.setMap(map);
|
|
|
|
//directionsDisplayArray.push(directionsDisplay);
|
|
}
|
|
|
|
var polylines = [];
|
|
var coordspoly = [];
|
|
function creaPolyline(coords, color, info, lastcoord, nomequipo, Imagen, valueEquipo, Continuo) {
|
|
var lineSymbol = {
|
|
path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW,
|
|
strokeWeight: 1,
|
|
strokeOpacity: 1,
|
|
scale: 3,
|
|
fillOpacity: 0.6
|
|
};
|
|
var polyline = new google.maps.Polyline({
|
|
path: coords,
|
|
strokeColor: color,
|
|
strokeOpacity: 0.6,
|
|
strokeWeight: 6,
|
|
fillOpacity: 0.35,
|
|
icons: [{
|
|
icon: lineSymbol,
|
|
offset: '0',
|
|
repeat: '80px'
|
|
}]
|
|
});
|
|
polyline.setMap(map);
|
|
polylines.push(polyline);
|
|
if (coordspoly.length <= 0 && typeof (Continuo) === "undefined") {
|
|
FitBoundsToCoords(coords);
|
|
|
|
} else {
|
|
coordspoly.push(coords[coords.length - 1]);
|
|
//if (polylines.length = 1 ) {
|
|
// FitBounds();
|
|
//}
|
|
}
|
|
if (lastcoord != "") {
|
|
var geo = {
|
|
NombreEquipo: nomequipo,
|
|
ValueEquipo: valueEquipo,
|
|
UltimaPos: lastcoord,
|
|
Cordenadas: coords
|
|
};
|
|
geoRutasHistoricas.push(geo);
|
|
CreaMarcador(lastcoord, nomequipo, info, Imagen);
|
|
ConsultaDireccionesRutasHistoricas(geo);
|
|
//var flag = 1;
|
|
//var i, j, temparray, chunk = 23;
|
|
//for (i = 1, j = coords.length; flag > 0; i += chunk) {
|
|
// flag = j - i;
|
|
|
|
// if ((i + chunk) >= j) {
|
|
// temparray = coords.slice(i, flag - 1);
|
|
// } else {
|
|
// temparray = coords.slice(i, i + chunk);
|
|
// }
|
|
|
|
// if (temparray !== "undefined") {
|
|
|
|
// var directionsDisplayRoute = new google.maps.DirectionsRenderer();
|
|
// directionsDisplayRoute.setOptions({ suppressMarkers: true });
|
|
// directionsDisplayRoute.setMap(map);
|
|
// directionsDisplayArray.push(directionsDisplayRoute);
|
|
|
|
// CalculaRutaHistorica2(temparray, directionsService, directionsDisplayRoute);
|
|
|
|
// //var millisecondsToWait = 500;
|
|
// //setTimeout(function () {
|
|
|
|
// //}, millisecondsToWait);
|
|
// }
|
|
//}
|
|
|
|
//CalculaRutaHistorica(coords, lastcoord);
|
|
}
|
|
//var directionsServicePoly = new google.maps.DirectionsService;
|
|
//var directionsDisplay = new google.maps.DirectionsRenderer;
|
|
|
|
}
|
|
|
|
var direccionesHistoricas = ""
|
|
function ConsultaDireccionesRutasHistoricas(geo) {
|
|
direccionesHistoricas = "";
|
|
var coords = [];
|
|
var c = geo.Cordenadas;
|
|
c.push(geo.UltimaPos);
|
|
coords = coords.concat(c);
|
|
|
|
for (var j = 0; j < coords.length; j++) {
|
|
var ejecutar = ((coords.length - 1) == j);
|
|
var coord = coords[j];
|
|
CalculaDireccionHistorica(coord, j, ejecutar)
|
|
}
|
|
}
|
|
function CalculaDireccionHistorica(coord, j, ejecutar) {
|
|
setTimeout(function () {
|
|
$.getJSON('http://adsistemasof.sytes.net/nominatim/reverse.php?format=jsonv2&lat=' + coord.lat + '&lon=' + coord.lng, function (data) {
|
|
if (typeof (data.error) === 'undefined') {
|
|
direccionesHistoricas = direccionesHistoricas + data.display_name + ";";
|
|
} else {
|
|
direccionesHistoricas = direccionesHistoricas + "No se encontró la dirección;";
|
|
}
|
|
if (ejecutar == true) {
|
|
$("#HdnDirecciones").val(direccionesHistoricas);
|
|
}
|
|
});
|
|
}, timeout + (j));
|
|
}
|
|
function CalculaRutaHistorica(coordenadasRuta, lastCoord) {
|
|
if (coordenadasRuta.length > 0) {
|
|
var flag = 1;
|
|
var i, j, temparray, chunk = 23;
|
|
for (i = 1, j = coordenadasRuta.length; flag > 0; i += chunk) {
|
|
flag = j - i;
|
|
|
|
if ((i + chunk) >= j) {
|
|
temparray = coordenadasRuta.slice(i, flag - 1);
|
|
} else {
|
|
temparray = coordenadasRuta.slice(i, i + chunk);
|
|
}
|
|
|
|
var puntos = [];
|
|
for (var k = 0; k < temparray.length; k++) {
|
|
if (i == 1 && k < temparray.length - 2) {
|
|
var waypoint = {
|
|
location: new google.maps.LatLng(temparray[k].lat, temparray[k].lng),
|
|
stopover: false
|
|
};
|
|
puntos.push(waypoint);
|
|
} else if ((i + chunk) >= j && k < temparray.length - 2) {
|
|
var waypoint = {
|
|
location: new google.maps.LatLng(temparray[k + 1].lat, temparray[k + 1].lng),
|
|
stopover: false
|
|
};
|
|
puntos.push(waypoint);
|
|
|
|
} else if (i > 1 && k < temparray.length - 3) {
|
|
var waypoint = {
|
|
location: new google.maps.LatLng(temparray[k + 1].lat, temparray[k + 1].lng),
|
|
stopover: false
|
|
};
|
|
puntos.push(waypoint);
|
|
}
|
|
}
|
|
|
|
var start, end;
|
|
|
|
var directionsServiceRoute = new google.maps.DirectionsService;
|
|
var directionsDisplayRoute = new google.maps.DirectionsRenderer;
|
|
|
|
directionsDisplayRoute.setOptions({ suppressMarkers: true });
|
|
directionsDisplayRoute.setMap(map);
|
|
|
|
if (i == 1) {
|
|
start = new google.maps.LatLng(coordenadasRuta[0].lat, coordenadasRuta[0].lng);
|
|
end = new google.maps.LatLng(temparray[temparray.length - 1].lat, temparray[temparray.length - 1].lng);
|
|
} else if ((i + chunk) >= j) {
|
|
start = new google.maps.LatLng(temparray[0].lat, temparray[0].lng);
|
|
end = new google.maps.LatLng(lastCoord.lat, lastCoord.lng);
|
|
} else {
|
|
start = new google.maps.LatLng(temparray[0].lat, temparray[0].lng);
|
|
end = new google.maps.LatLng(temparray[temparray.length - 1].lat, temparray[temparray.length - 1].lng);
|
|
}
|
|
|
|
directionsServiceRoute.route({
|
|
origin: start,
|
|
destination: end,
|
|
travelMode: 'DRIVING',
|
|
waypoints: puntos,
|
|
optimizeWaypoints: false,
|
|
provideRouteAlternatives: false
|
|
}, function (response, status) {
|
|
if (status === 'OK') {
|
|
directionsDisplayRoute.setDirections(response);
|
|
directionsDisplayArray.push(directionsDisplayRoute);
|
|
} else if (status == google.maps.GeocoderStatus.ZERO_RESULTS) {
|
|
alert("no encontrado");
|
|
}
|
|
else if (status == google.maps.GeocoderStatus.OVER_QUERY_LIMIT) {
|
|
var wait = true;
|
|
setTimeout("wait = true", 2000);
|
|
} else {
|
|
window.alert('Directions request failed due to ' + status);
|
|
}
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
function CalculaRutaHistorica2(stops_new, directionsService, dirdis) {
|
|
var batches = [];
|
|
var itemsPerBatch = 21; // google API max = 10 - 1 start, 1 stop, and 8 waypoints
|
|
var itemsCounter = 0;
|
|
var wayptsExist = stops_new.length > 0;
|
|
var time = [];
|
|
while (wayptsExist) {
|
|
var subBatch = [];
|
|
var subitemsCounter = 0;
|
|
for (var j = itemsCounter; j < stops_new.length; j++) {
|
|
subitemsCounter++;
|
|
subBatch.push({
|
|
location: new window.google.maps.LatLng(stops_new[j].Lat, stops_new[j].lng),
|
|
stopover: true
|
|
|
|
});
|
|
if (subitemsCounter == itemsPerBatch)
|
|
break;
|
|
}
|
|
|
|
itemsCounter += subitemsCounter;
|
|
batches.push(subBatch);
|
|
wayptsExist = itemsCounter < stops_new.length;
|
|
// If it runs again there are still points. Minus 1 before continuing to
|
|
// start up with end of previous tour leg
|
|
itemsCounter--;
|
|
}
|
|
|
|
// now we should have a 2 dimensional array with a list of a list of waypoints
|
|
var combinedResults;
|
|
var unsortedResults = [{}]; // to hold the counter and the results themselves as they come back, to later sort
|
|
var directionsResultsReturned = 0;
|
|
|
|
for (var k = 0; k < batches.length; k++) {
|
|
var lastIndex = batches[k].length - 1;
|
|
var start = batches[k][0].location;
|
|
var end = batches[k][lastIndex].location;
|
|
|
|
// trim first and last entry from array
|
|
var waypts = [];
|
|
waypts = batches[k];
|
|
waypts.splice(0, 1);
|
|
waypts.splice(waypts.length - 1, 1);
|
|
|
|
var request =
|
|
{
|
|
origin: start,
|
|
destination: end,
|
|
waypoints: waypts,
|
|
travelMode: window.google.maps.TravelMode.WALKING
|
|
};
|
|
|
|
(function (kk) {
|
|
var wait = true;
|
|
setTimeout("wait = true", 2000);
|
|
directionsService.route(request, function (result, status) {
|
|
if (status == window.google.maps.DirectionsStatus.OK) {
|
|
var polyline = new google.maps.Polyline({
|
|
path: [],
|
|
strokeColor: "#783425",
|
|
strokeOpacity: 0.6,
|
|
strokeWeight: 6,
|
|
fillOpacity: 0.35,
|
|
icons: [{
|
|
icon: lineSymbol,
|
|
offset: '0',
|
|
repeat: '80px'
|
|
}]
|
|
});
|
|
polylinesRoute.push(polyline);
|
|
//polylinesRoute[0] = new google.maps.Polyline({
|
|
// path: [],
|
|
// strokeColor: '#FFFF00',
|
|
// strokeWeight: 3
|
|
//});
|
|
|
|
var unsortedResult = { order: kk, result: result };
|
|
unsortedResults.push(unsortedResult);
|
|
|
|
directionsResultsReturned++;
|
|
|
|
if (directionsResultsReturned == batches.length) // we've received all the results. put to map
|
|
{
|
|
// sort the returned values into their correct order
|
|
unsortedResults.sort(function (a, b) { return parseFloat(a.order) - parseFloat(b.order); });
|
|
var count = 0;
|
|
for (var key in unsortedResults) {
|
|
if (unsortedResults[key].result != null) {
|
|
if (unsortedResults.hasOwnProperty(key)) {
|
|
if (count == 0) // first results. new up the combinedResults object
|
|
combinedResults = unsortedResults[key].result;
|
|
else {
|
|
// only building up legs, overview_path, and bounds in my consolidated object. This is not a complete
|
|
// directionResults object, but enough to draw a path on the map, which is all I need
|
|
combinedResults.routes[0].legs = combinedResults.routes[0].legs.concat(unsortedResults[key].result.routes[0].legs);
|
|
combinedResults.routes[0].overview_path = combinedResults.routes[0].overview_path.concat(unsortedResults[key].result.routes[0].overview_path);
|
|
|
|
combinedResults.routes[0].bounds = combinedResults.routes[0].bounds.extend(unsortedResults[key].result.routes[0].bounds.getNorthEast());
|
|
combinedResults.routes[0].bounds = combinedResults.routes[0].bounds.extend(unsortedResults[key].result.routes[0].bounds.getSouthWest());
|
|
}
|
|
count++;
|
|
}
|
|
}
|
|
}
|
|
dirdis.setDirections(combinedResults);
|
|
|
|
var legs = combinedResults.routes[0].legs;
|
|
var path = combinedResults.routes[0].overview_path;
|
|
|
|
|
|
for (var i = 0; i < legs.length; i++) {
|
|
var markerletter = "A".charCodeAt(0);
|
|
markerletter += i;
|
|
markerletter = String.fromCharCode(markerletter);
|
|
|
|
if (i == 0) {
|
|
}
|
|
|
|
var steps = legs[i].steps;
|
|
|
|
for (j = 0; j < steps.length; j++) {
|
|
|
|
var nextSegment = steps[j].path;
|
|
|
|
for (k = 0; k < nextSegment.length; k++) {
|
|
polyline[0].getPath().push(nextSegment[k]);
|
|
//bounds.extend(nextSegment[k]);
|
|
}
|
|
}
|
|
|
|
}
|
|
// Marker for start point
|
|
|
|
var i = legs.length;
|
|
var markerletter = "A".charCodeAt(0);
|
|
markerletter += i;
|
|
markerletter = String.fromCharCode(markerletter);
|
|
|
|
// marker for End Point
|
|
|
|
polylinesRoute[0].setMap(map);
|
|
|
|
}
|
|
} else {
|
|
window.alert('Directions request failed due to ' + status);
|
|
}
|
|
});
|
|
})(k);
|
|
}
|
|
}
|
|
|
|
|
|
|
|
function FitBoundsToCoords(pCoords) {
|
|
var bounds = new google.maps.LatLngBounds();
|
|
for (var i = 0; i < pCoords.length; i++) {
|
|
bounds.extend(pCoords[i]);
|
|
}
|
|
map.fitBounds(bounds)
|
|
}
|
|
|
|
function FitBounds() {
|
|
var bounds = new google.maps.LatLngBounds();
|
|
for (var i = 0; i < coordspoly.length; i++) {
|
|
bounds.extend(coordspoly[i]);
|
|
}
|
|
map.fitBounds(bounds)
|
|
}
|
|
window.addEventListener("keydown", function (e) {
|
|
// space and arrow keys
|
|
if ([32, 37, 38, 39, 40].indexOf(e.keyCode) > -1) {
|
|
e.preventDefault();
|
|
}
|
|
}, false);
|
|
$(document).ready(function () {
|
|
GvBarraPaginator();
|
|
if (typeof ($('#C_GVKm')) !== 'undefined') {
|
|
$('#C_GVKm').dataTable({
|
|
"pagingType": "scrolling",
|
|
"lengthMenu": [[4, 8, 10], [4, 8, 10]]
|
|
});
|
|
}
|
|
|
|
initMap();
|
|
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
|
|
function EndRequestHandler(sender, args) {
|
|
$("#C_GvBarra_filter > div > input").on("keypress", function (e) {
|
|
HdnTextFilter.value = $(this).val() + String.fromCharCode(e.which);
|
|
});
|
|
CargaPickers();
|
|
CargaVehiculosHistoricos();
|
|
//if (args.get_error() != undefined) {
|
|
// args.set_errorHandled(true);
|
|
//}
|
|
}
|
|
});
|
|
function addDate(date, interval, units) {
|
|
var ret = new Date(date); //don't change original date
|
|
var checkRollover = function () { if (ret.getDate() != date.getDate()) ret.setDate(0); };
|
|
switch (interval.toLowerCase()) {
|
|
case 'year': ret.setFullYear(ret.getFullYear() + units); checkRollover(); break;
|
|
case 'quarter': ret.setMonth(ret.getMonth() + 3 * units); checkRollover(); break;
|
|
case 'month': ret.setMonth(ret.getMonth() + units); checkRollover(); break;
|
|
case 'week': ret.setDate(ret.getDate() + 7 * units); break;
|
|
case 'day': ret.setDate(ret.getDate() + units); break;
|
|
case 'hour': ret.setTime(ret.getTime() + units * 3600000); break;
|
|
case 'minute': ret.setTime(ret.getTime() + units * 60000); break;
|
|
case 'second': ret.setTime(ret.getTime() + units * 1000); break;
|
|
default: ret = undefined; break;
|
|
}
|
|
return ret;
|
|
}
|
|
var dateFormat = function () {
|
|
var token = /d{1,4}|m{1,4}|yy(?:yy)?|([HhMsTt])\1?|[LloSZ]|"[^"]*"|'[^']*'/g,
|
|
timezone = /\b(?:[PMCEA][SDP]T|(?:Pacific|Mountain|Central|Eastern|Atlantic) (?:Standard|Daylight|Prevailing) Time|(?:GMT|UTC)(?:[-+]\d{4})?)\b/g,
|
|
timezoneClip = /[^-+\dA-Z]/g,
|
|
pad = function (val, len) {
|
|
val = String(val);
|
|
len = len || 2;
|
|
while (val.length < len) val = "0" + val;
|
|
return val;
|
|
};
|
|
|
|
// Regexes and supporting functions are cached through closure
|
|
return function (date, mask, utc) {
|
|
var dF = dateFormat;
|
|
|
|
// You can't provide utc if you skip other args (use the "UTC:" mask prefix)
|
|
if (arguments.length == 1 && Object.prototype.toString.call(date) == "[object String]" && !/\d/.test(date)) {
|
|
mask = date;
|
|
date = undefined;
|
|
}
|
|
|
|
// Passing date through Date applies Date.parse, if necessary
|
|
date = date ? new Date(date) : new Date;
|
|
if (isNaN(date)) throw SyntaxError("invalid date");
|
|
|
|
mask = String(dF.masks[mask] || mask || dF.masks["default"]);
|
|
|
|
// Allow setting the utc argument via the mask
|
|
if (mask.slice(0, 4) == "UTC:") {
|
|
mask = mask.slice(4);
|
|
utc = true;
|
|
}
|
|
|
|
var _ = utc ? "getUTC" : "get",
|
|
d = date[_ + "Date"](),
|
|
D = date[_ + "Day"](),
|
|
m = date[_ + "Month"](),
|
|
y = date[_ + "FullYear"](),
|
|
H = date[_ + "Hours"](),
|
|
M = date[_ + "Minutes"](),
|
|
s = date[_ + "Seconds"](),
|
|
L = date[_ + "Milliseconds"](),
|
|
o = utc ? 0 : date.getTimezoneOffset(),
|
|
flags = {
|
|
d: d,
|
|
dd: pad(d),
|
|
ddd: dF.i18n.dayNames[D],
|
|
dddd: dF.i18n.dayNames[D + 7],
|
|
m: m + 1,
|
|
mm: pad(m + 1),
|
|
mmm: dF.i18n.monthNames[m],
|
|
mmmm: dF.i18n.monthNames[m + 12],
|
|
yy: String(y).slice(2),
|
|
yyyy: y,
|
|
h: H % 12 || 12,
|
|
hh: pad(H % 12 || 12),
|
|
H: H,
|
|
HH: pad(H),
|
|
M: M,
|
|
MM: pad(M),
|
|
s: s,
|
|
ss: pad(s),
|
|
l: pad(L, 3),
|
|
L: pad(L > 99 ? Math.round(L / 10) : L),
|
|
t: H < 12 ? "a" : "p",
|
|
tt: H < 12 ? "am" : "pm",
|
|
T: H < 12 ? "A" : "P",
|
|
TT: H < 12 ? "AM" : "PM",
|
|
Z: utc ? "UTC" : (String(date).match(timezone) || [""]).pop().replace(timezoneClip, ""),
|
|
o: (o > 0 ? "-" : "+") + pad(Math.floor(Math.abs(o) / 60) * 100 + Math.abs(o) % 60, 4),
|
|
S: ["th", "st", "nd", "rd"][d % 10 > 3 ? 0 : (d % 100 - d % 10 != 10) * d % 10]
|
|
};
|
|
|
|
return mask.replace(token, function ($0) {
|
|
return $0 in flags ? flags[$0] : $0.slice(1, $0.length - 1);
|
|
});
|
|
};
|
|
}();
|
|
|
|
// Some common format strings
|
|
dateFormat.masks = {
|
|
"default": "ddd mmm dd yyyy HH:MM:ss",
|
|
shortDate: "m/d/yy",
|
|
mediumDate: "mmm d, yyyy",
|
|
longDate: "mmmm d, yyyy",
|
|
fullDate: "dddd, mmmm d, yyyy",
|
|
shortTime: "h:MM TT",
|
|
mediumTime: "h:MM:ss TT",
|
|
longTime: "h:MM:ss TT Z",
|
|
isoDate: "yyyy-mm-dd",
|
|
isoTime: "HH:MM:ss",
|
|
isoDateTime: "yyyy-mm-dd'T'HH:MM:ss",
|
|
isoUtcDateTime: "UTC:yyyy-mm-dd'T'HH:MM:ss'Z'"
|
|
};
|
|
|
|
// Internationalization strings
|
|
dateFormat.i18n = {
|
|
dayNames: [
|
|
"Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat",
|
|
"Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"
|
|
],
|
|
monthNames: [
|
|
"Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec",
|
|
"January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"
|
|
]
|
|
};
|
|
|
|
function ConsultaFecha(Opcion) {
|
|
var today = new Date();
|
|
switch (Opcion) {
|
|
case "2":
|
|
var FechaI = addDate(today, "hour", -2);
|
|
var FechaF = today;
|
|
|
|
$("#C_txtFechaI").val(dateFormat(FechaI, "dd/mm/yyyy HH:mm"));
|
|
$("#C_txtFechaF").val(dateFormat(FechaF, "dd/mm/yyyy HH:mm"));
|
|
break;
|
|
case "8":
|
|
var FechaI = addDate(today, "hour", -8);
|
|
var FechaF = today;
|
|
|
|
$("#C_txtFechaI").val(dateFormat(FechaI, "dd/mm/yyyy HH:mm"));
|
|
$("#C_txtFechaF").val(dateFormat(FechaF, "dd/mm/yyyy HH:mm"));
|
|
break;
|
|
case "24":
|
|
$("#C_txtFechaI").val(dateFormat(today, "dd/mm/yyyy") + " 0:00");
|
|
$("#C_txtFechaF").val(dateFormat(today, "dd/mm/yyyy") + " 23:59");
|
|
break;
|
|
case "48":
|
|
var FechaI = addDate(today, "day", -1);
|
|
|
|
$("#C_txtFechaI").val(dateFormat(FechaI, "dd/mm/yyyy") + " 0:00");
|
|
$("#C_txtFechaF").val(dateFormat(FechaI, "dd/mm/yyyy") + " 23:59");
|
|
break;
|
|
case "Week":
|
|
var FechaI = addDate(today, "day", -7);
|
|
|
|
$("#C_txtFechaI").val(dateFormat(FechaI, "dd/mm/yyyy") + " 0:00");
|
|
$("#C_txtFechaF").val(dateFormat(today, "dd/mm/yyyy HH:mm"));
|
|
break;
|
|
case "Month":
|
|
//var FechaI = addDate(today, "month", -1);
|
|
var FechaI = '01/' + (today.getMonth() + 1) + '/' + today.getFullYear() + " 0:00";
|
|
$("#C_txtFechaI").val(FechaI);
|
|
$("#C_txtFechaF").val(dateFormat(today, "dd/mm/yyyy HH:mm"));
|
|
break;
|
|
|
|
default:
|
|
}
|
|
//PageMethods.WsCalculaFechas(Opcion,OnSucceededFechas);
|
|
}
|
|
function OnSucceededFechas(result, userContext, methodName) {
|
|
if (methodName == 'WsCalculaFechas') {
|
|
var fechas = JSON.parse(result);
|
|
$("#C_txtFechaI").val(fechas.FechaI);
|
|
$("#C_txtFechaF").val(fechas.FechaF);
|
|
}
|
|
}
|
|
var markers = [];
|
|
|
|
var lastOpenedInfoWindow;
|
|
var direcciones = [];
|
|
|
|
function CreaMarcador(coords, nomEquipo, ContentString, imagen) {
|
|
if (typeof imagen === 'undefined') { imagen = image; }
|
|
|
|
var markerIcon = {
|
|
url: imagen,
|
|
labelOrigin: new google.maps.Point(26, 43)
|
|
};
|
|
|
|
var marker = new google.maps.Marker({
|
|
position: coords,
|
|
title: nomEquipo,
|
|
map: map,
|
|
icon: markerIcon
|
|
});
|
|
|
|
var infowindow = new google.maps.InfoWindow({
|
|
content: ContentString
|
|
});
|
|
marker.addListener('click', function () {
|
|
closeLastOpenedInfoWindow();
|
|
GetDirecciones(coords, infowindow, marker)
|
|
infowindow.open(map, marker);
|
|
lastOpenedInfoWindow = infowindow;
|
|
});
|
|
marker.Nombre = nomEquipo
|
|
markers.push(marker);
|
|
//map.setCenter(coords);
|
|
if (markers.length > 1 && coordspoly.length < 1) {
|
|
fitBoundsToVisibleMarkers()
|
|
} else if (markers.length === 1 && coordspoly.length < 1) {
|
|
map.setZoom(15);
|
|
map.setCenter(coords);
|
|
}
|
|
}
|
|
|
|
function CreaMarcadorWatch(coords, nomEquipo, ContentString, imagen) {
|
|
if (typeof imagen === 'undefined') { imagen = image; }
|
|
|
|
var markerIcon = {
|
|
url: imagen,
|
|
labelOrigin: new google.maps.Point(26, 43)
|
|
};
|
|
|
|
var label;
|
|
if (visible) {
|
|
label = {
|
|
text: nomEquipo,
|
|
fontSize: "12px",
|
|
color: 'black',
|
|
fontWeight: 'bolder'
|
|
}
|
|
} else {
|
|
label = null;
|
|
}
|
|
|
|
var marker = new google.maps.Marker({
|
|
position: coords,
|
|
title: nomEquipo,
|
|
map: map,
|
|
icon: markerIcon
|
|
});
|
|
var infowindow = new google.maps.InfoWindow({
|
|
content: ContentString
|
|
});
|
|
marker.addListener('click', function () {
|
|
closeLastOpenedInfoWindow();
|
|
GetDirecciones(coords, infowindow, marker)
|
|
infowindow.open(map, marker);
|
|
lastOpenedInfoWindow = infowindow;
|
|
});
|
|
marker.Nombre = nomEquipo
|
|
marker.setLabel(label)
|
|
markers.push(marker);
|
|
|
|
}
|
|
|
|
function fitBoundsToVisibleMarkers() {
|
|
|
|
var bounds = new google.maps.LatLngBounds();
|
|
|
|
for (var i = 0; i < markers.length; i++) {
|
|
if (markers[i].getVisible()) {
|
|
bounds.extend(markers[i].getPosition());
|
|
}
|
|
}
|
|
|
|
map.fitBounds(bounds);
|
|
|
|
}
|
|
|
|
function closeLastOpenedInfoWindow() {
|
|
if (lastOpenedInfoWindow) {
|
|
lastOpenedInfoWindow.close();
|
|
}
|
|
}
|
|
|
|
var marker2;
|
|
|
|
//function CreaRutaMarcadorHistorico(lastcoord, coords, nomEquipo, ContentString, click, imagen2, indice) {
|
|
// if (typeof imagen === 'undefined') { imagen = image; }
|
|
|
|
// var Circle = new google.maps.Circle({
|
|
// strokeColor: '#b2dbff',
|
|
// strokeOpacity: 0.8,
|
|
// strokeWeight: 2,
|
|
// fillColor: '#b2dbff',
|
|
// fillOpacity: 0.35,
|
|
// map: map,
|
|
// center: coords,
|
|
// radius: 10
|
|
// });
|
|
|
|
// var infowindow2 = new google.maps.InfoWindow({
|
|
// content: ContentString
|
|
// });
|
|
// Circle.addListener('click', function () {
|
|
// if (typeof marker2 != 'undefined') { marker2.setMap(null); }
|
|
// marker2 = new google.maps.Marker({
|
|
// position: coords,
|
|
// title: nomEquipo,
|
|
// map: map,
|
|
// icon: imagen2
|
|
// });
|
|
// marker2.addListener('click', function () {
|
|
// if ($("#HdnOpcion").val() != "Play") {
|
|
// GetDirecciones(coords, infowindow2, Circle, indice)
|
|
// }
|
|
// closeLastOpenedInfoWindow();
|
|
// infowindow2.open(map, marker2);
|
|
// lastOpenedInfoWindow = infowindow2;
|
|
// });
|
|
// google.maps.event.trigger(marker2, 'click')
|
|
// infowindow2.open(map, marker2);
|
|
// lastOpenedInfoWindow = infowindow2;
|
|
// });
|
|
// if (click === 1) {
|
|
// google.maps.event.trigger(Circle, 'click', {})
|
|
// }
|
|
// coordspoly.push(coords);
|
|
// if (lastcoord != "") {
|
|
// var start = new google.maps.LatLng(lastcoord.lat, lastcoord.lng);
|
|
// var end = new google.maps.LatLng(coords.lat, coords.lng);
|
|
// var directionsServiceRoute = new google.maps.DirectionsService;
|
|
// directionsServiceRoute.route({
|
|
// origin: start,
|
|
// destination: end,
|
|
// travelMode: 'DRIVING'
|
|
// }, function (response, status) {
|
|
// if (status === 'OK') {
|
|
// debugger;
|
|
// directionsDisplay.setDirections(response);
|
|
// } else if (status == google.maps.GeocoderStatus.ZERO_RESULTS) {
|
|
// // debugger;
|
|
|
|
// }
|
|
// else if (status == google.maps.GeocoderStatus.OVER_QUERY_LIMIT) {
|
|
// debugger;
|
|
// var wait = true;
|
|
// setTimeout("wait = true", 2000);
|
|
// //alert("OQL: " + status);
|
|
// } else {
|
|
// window.alert('Directions request failed due to ' + status);
|
|
// }
|
|
// });
|
|
// }
|
|
|
|
|
|
// //markers.push(marker);
|
|
// //map.setCenter(coords);
|
|
//}
|
|
function CreaMarcadorHistorico(coords, nomEquipo, ContentString, click, imagen2, indice) {
|
|
if (typeof imagen === 'undefined') { imagen = image; }
|
|
|
|
var Circle = new google.maps.Circle({
|
|
strokeColor: '#b2dbff',
|
|
strokeOpacity: 0.8,
|
|
strokeWeight: 2,
|
|
fillColor: '#b2dbff',
|
|
fillOpacity: 0.35,
|
|
map: map,
|
|
center: coords,
|
|
radius: 10
|
|
});
|
|
|
|
var infowindow2 = new google.maps.InfoWindow({
|
|
content: ContentString
|
|
});
|
|
Circle.addListener('click', function () {
|
|
if (typeof marker2 != 'undefined') { marker2.setMap(null); }
|
|
marker2 = new google.maps.Marker({
|
|
position: coords,
|
|
title: nomEquipo,
|
|
map: map,
|
|
icon: imagen2
|
|
});
|
|
marker2.addListener('click', function () {
|
|
if ($("#HdnOpcion").val() != "Play") {
|
|
GetDirecciones(coords, infowindow2, Circle, indice)
|
|
}
|
|
closeLastOpenedInfoWindow();
|
|
infowindow2.open(map, marker2);
|
|
lastOpenedInfoWindow = infowindow2;
|
|
});
|
|
google.maps.event.trigger(marker2, 'click')
|
|
infowindow2.open(map, marker2);
|
|
lastOpenedInfoWindow = infowindow2;
|
|
});
|
|
if (click === 1) {
|
|
google.maps.event.trigger(Circle, 'click', {})
|
|
}
|
|
coordspoly.push(coords);
|
|
//markers.push(marker);
|
|
//map.setCenter(coords);
|
|
}
|
|
|
|
var indiceAnterior = 0;
|
|
function CargaDatosSeleccionados(indice, valor, latLng, OpcionHistorico) {
|
|
//var columnaSeleccionada = 1 + indice;
|
|
HdnIndexGvBarra.value = indice;
|
|
if ($("#C_GvBarra").DataTable().row(indiceAnterior).node() != null) {
|
|
$("#C_GvBarra").DataTable().row(indiceAnterior).node().style.backgroundColor = 'initial';
|
|
}
|
|
if ($("#C_GvBarra").DataTable().row(indice).node() != null) {
|
|
$("#C_GvBarra").DataTable().row(indice).node().style.backgroundColor = '#F5B27A'
|
|
}
|
|
|
|
indiceAnterior = indice;
|
|
map.setCenter(latLng);
|
|
map.setZoom(15);
|
|
if (visible) {
|
|
for (var i = 0; i < markers.length; i++) {
|
|
markers[i].setMap(null);
|
|
}
|
|
for (var i = 0; i < markers.length; i++) {
|
|
markers[i].setMap(map);
|
|
}
|
|
}
|
|
|
|
if (OpcionHistorico != 2) {
|
|
find_closest_marker(latLng, OpcionHistorico);
|
|
}
|
|
}
|
|
|
|
function CargaRecSeleccionados(indice) {
|
|
var columnaSeleccionada = 2 + indice;
|
|
$('#C_GVKm tr').filter(':nth-child(' + indiceAnterior + ')').css('background-color', 'initial');
|
|
$('#C_GVKm tr').filter(':nth-child(' + columnaSeleccionada + ')').css('background-color', '#F5B27A');
|
|
//indiceAnterior = columnaSeleccionada;
|
|
}
|
|
|
|
|
|
var timeout = 1500;
|
|
|
|
function GetDireccionesGV(posicion, indice, multiplicador) {
|
|
|
|
setTimeout(function () {
|
|
var columnaSeleccionada = 2 + indice;
|
|
var tr = $("#C_GvBarra").DataTable().row(indice).node();
|
|
var lat = posicion.lat;
|
|
var lng = posicion.lng;
|
|
var largo;
|
|
if ($("#HdnOpcion").val() === 'All' || $("#HdnOpcion").val() === 'TPS') { largo = 37 } else { largo = 74 }
|
|
if ($())
|
|
$.getJSON('http://adsistemasof.sytes.net/nominatim/reverse.php?format=jsonv2&lat=' + lat + '&lon=' + lng, function (data) {
|
|
if (typeof (data.error) === 'undefined') {
|
|
if (multiplicador > 0) {
|
|
if (typeof (markers[indice]) !== 'undefined') {
|
|
markers[indice].formatted_addressrow = data.display_name
|
|
}
|
|
}
|
|
if (data.display_name.length > largo) {
|
|
tr.cells[2].innerHTML = data.display_name.substring(0, largo) + '...';
|
|
} else {
|
|
tr.cells[2].innerHTML = data.display_name;
|
|
}
|
|
tr.cells[2].title = data.display_name;
|
|
//$("#HdnDirecciones").val($("#HdnDirecciones").val() + data.display_name + ';');
|
|
} else {
|
|
tr.cells[2].innerHTML = "No se encontró la dirección";
|
|
//$("#HdnDirecciones").val($("#HdnDirecciones").val() + 'No se encontró la dirección;');
|
|
}
|
|
});
|
|
|
|
|
|
}, timeout + (indice));
|
|
}
|
|
|
|
|
|
///VIEJO GEOCODER. NO BORRAR.
|
|
|
|
/*geocoder.geocode({ 'location': posicion }, function (results, status) {
|
|
if (status === 'OK') {
|
|
if (results[0]) {
|
|
markers[indice].formatted_addressrow = results[0].formatted_address
|
|
tr.cells[2].innerHTML = results[0].formatted_address;
|
|
$(s).val(results[0].formatted_address);
|
|
} else {
|
|
tr.cells[2].innerHTML = "Cargando..."
|
|
}
|
|
} else {
|
|
tr.cells[2].innerHTML = "Cargando..."
|
|
}
|
|
}); */
|
|
|
|
///TERMINA VIEJO GEOCODER.
|
|
|
|
|
|
//document.onkeydown = checkKey;
|
|
var countdown = 1;
|
|
var countup = 1;
|
|
var pixels = 0;
|
|
|
|
//$(".dataTables_scrollBody").keydown(function (e) {
|
|
// debugger;
|
|
// e = e || window.event;
|
|
// count = parseInt(indiceAnterior)
|
|
// var RowID = ""
|
|
// if (open) {
|
|
// if (e.keyCode == '38') {
|
|
// // flecha arriba
|
|
// if (indiceAnterior > 0) {
|
|
// RowID = "#row" + (parseInt(indiceAnterior) - 1);
|
|
// $(RowID).click();
|
|
// //pixels = $(".dataTables_scrollBody").scrollTop();
|
|
// //pixels = pixels - 26;
|
|
// //$(".dataTables_scrollBody").scrollTop(pixels);
|
|
// if (countup < 2) countup = countup + 1;
|
|
// count = count - 1
|
|
// if (countdown > 0) countdown = countdown - 1
|
|
// if (countup >= 2) {
|
|
// debugger;
|
|
// pixels = $(".dataTables_scrollBody").scrollTop();
|
|
// pixels = pixels - 26;
|
|
// $(".dataTables_scrollBody").scrollTop(pixels);
|
|
// //$(".dataTables_scrollBody").scrollTop(25.6 * (count - 4));
|
|
|
|
// }
|
|
// return false;
|
|
// }
|
|
// } else if (e.keyCode == '40') {
|
|
// // flecha abajo
|
|
// var NoRows = $("#C_GvBarra").DataTable().rows().nodes().length;
|
|
// if (indiceAnterior <= NoRows) {
|
|
// RowID = "#row" + (parseInt(indiceAnterior) + 1)
|
|
// //$(RowID).click();
|
|
// //pixels = $(".dataTables_scrollBody").scrollTop();
|
|
// //pixels = pixels + 26;
|
|
// $(".dataTables_scrollBody").scrollTop(pixels);
|
|
// if (countdown < 2) countdown = countdown + 1
|
|
// if (countup > 0) countup = countup - 1
|
|
// count = count + 1;
|
|
// if (countdown >= 2) {
|
|
// debugger;
|
|
// pixels = $(".dataTables_scrollBody").scrollTop();
|
|
// pixels = pixels + 26;
|
|
// $(".dataTables_scrollBody").scrollTop(pixels);
|
|
// }
|
|
// return false;
|
|
// }
|
|
// }
|
|
// }
|
|
//});
|
|
//function checkKey(e) {
|
|
|
|
//}
|
|
|
|
function GetDireccionesGVClick(posicion, indice) {
|
|
if (typeof (markers[indice].formatted_addressrow) === 'undefined') {
|
|
setTimeout(function () {
|
|
var columnaSeleccionada = 2 + indice;
|
|
var tr = $("#C_GvBarra").DataTable().row(indice).node()
|
|
geocoder.geocode({ 'location': posicion }, function (results, status) {
|
|
if (status === 'OK') {
|
|
if (results[0]) {
|
|
if (typeof (markers[indice]) !== 'undefined') {
|
|
|
|
markers[indice].formatted_addressrow = results[0].formatted_address
|
|
if (typeof (tr) !== 'undefined') {
|
|
tr.cells[2].innerHTML = results[0].formatted_address;
|
|
}
|
|
} else {
|
|
console.log("Ocurrio un error al obtener la direccion del punto: " + posicion + "en el indice: " + indice)
|
|
}
|
|
} else {
|
|
markers[indice].formatted_addressrow = "Direccion no encontrada"
|
|
tr.cells[2].innerHTML = "Direccion no encontrada;"
|
|
}
|
|
} else {
|
|
markers[indice].formatted_addressrow = "Cargando..."
|
|
tr.cells[2].innerHTML = "Cargando..."
|
|
}
|
|
});
|
|
}, timeout);
|
|
}
|
|
}
|
|
|
|
function GetDirecciones(posicion, infowindow, marker, indice) {
|
|
var lat = posicion.lat
|
|
var lng = posicion.lng
|
|
$.getJSON('http://adsistemasof.sytes.net/nominatim/reverse.php?format=jsonv2&lat=' + lat + '&lon=' + lng, function (data) {
|
|
if (typeof (data.error) === 'undefined') {
|
|
marker.formatted_address = data.display_name;
|
|
var contenido = infowindow.getContent();
|
|
debugger;
|
|
if (contenido.indexOf("direccion") >= 0) {
|
|
var html = $($.parseHTML(contenido));
|
|
var dir = html.filter(".direccion");;
|
|
dir.text("Dirección: " + data.display_name);
|
|
var htmlstring = "";
|
|
for (var i = 0; i < html.length; i++) {
|
|
htmlstring = htmlstring.concat(html[i].outerHTML);
|
|
}
|
|
infowindow.setContent(htmlstring);
|
|
} else {
|
|
infowindow.setContent(contenido + "<div class='direccion' style='margin-left:5px'>" + "Dirección: " + data.display_name + "</div>");
|
|
}
|
|
if (indice > -1) {
|
|
if (data.display_name.length > 74) {
|
|
if (typeof (tr) !== 'undefined') {
|
|
tr.cells[2].innerHTML = data.display_name.substring(0, 74) + '...'
|
|
}
|
|
} else {
|
|
if (typeof (tr) !== 'undefined') {
|
|
tr.cells[2].innerHTML = data.display_name
|
|
}
|
|
}
|
|
}
|
|
} else {
|
|
marker.formatted_address = "Dirección no encontrada";
|
|
if (contenido.indexOf("direccion") >= 0) {
|
|
var html = $($.parseHTML(contenido));
|
|
var dir = html.filter(".direccion");;
|
|
dir.text("Dirección no encontrada");
|
|
var htmlstring = "";
|
|
for (var i = 0; i < html.length; i++) {
|
|
htmlstring = htmlstring.concat(html[i].outerHTML);
|
|
}
|
|
infowindow.setContent(htmlstring);
|
|
} else {
|
|
infowindow.setContent(infowindow.getContent() + "<div style='margin-left:5px'> Dirección: No Encontrada </div>");
|
|
}
|
|
|
|
if (indice) {
|
|
var col = indice + 1
|
|
var tr = $('#C_GvBarra tr').filter(':nth-child(' + col + ')')
|
|
tr.find("td").filter(':nth-child(3)').html(results[0].formatted_address);
|
|
}
|
|
}
|
|
});
|
|
//if (marker.formatted_address) { return false; }
|
|
//else if (marker.formatted_addressrow) {
|
|
// infowindow.setContent(infowindow.getContent() + "<div style='margin-left:5px'>" + "Dirección: " + marker.formatted_addressrow + "</div>");
|
|
// marker.formatted_address = marker.formatted_addressrow
|
|
//} else if ($("#C_GvBarra").DataTable().row(indice).node().cells[2].innerHTML.trim() != "Haga click para ver Dirección") {
|
|
// marker.formatted_address = $("#C_GvBarra").DataTable().row(indice).node().cells[2].innerHTML.trim();
|
|
// infowindow.setContent(infowindow.getContent() + "<div style='margin-left:5px'>" + "Dirección: " + $("#C_GvBarra").DataTable().row(indice).node().cells[2].innerHTML.trim() + "</div>");
|
|
//}
|
|
//else {
|
|
|
|
//}
|
|
|
|
}
|
|
|
|
|
|
var multiplicador = 1;
|
|
function doScaledTimeout(i, newPlay) {
|
|
if (newPlay) {
|
|
if (multiplicador >= 1 && multiplicador < i) {
|
|
multiplicador++;
|
|
} else {
|
|
multiplicador = 1;
|
|
}
|
|
} else {
|
|
multiplicador = i;
|
|
}
|
|
var to = setTimeout(function () {
|
|
pauseIndex = i;
|
|
$("#C_GvBarra").DataTable().rows(i).nodes().to$("#row0").click()
|
|
}, multiplicador * 250);
|
|
ejecuciones.push(to);
|
|
}
|
|
var indiceAnteriorKM = 0;
|
|
function doScaledCLickKM(boton, i) {
|
|
|
|
setTimeout(function () {
|
|
if (typeof ($("C_GVKm")) !== 'undefined') {
|
|
if ($("[idgv='" + i + "']") != null) {
|
|
$("[idgv='" + indiceAnteriorKM + "']").css("background-color", 'initial');
|
|
$("[idgv='" + i + "']").css("background-color", '#F5B27A');
|
|
}
|
|
}
|
|
indiceAnteriorKM = i;
|
|
$(boton).click();
|
|
}, 250);
|
|
}
|
|
function doScaledCLick(boton) {
|
|
|
|
setTimeout(function () {
|
|
$(boton).click();
|
|
}, 250);
|
|
}
|
|
|
|
function rad(x) { return x * Math.PI / 180; }
|
|
|
|
function find_closest_marker(LatLng, Opcion) {
|
|
var lat = LatLng.lat;
|
|
var lng = LatLng.lng;
|
|
var R = 6371; // radius of earth in km
|
|
var distances = [];
|
|
var closest = -1;
|
|
for (i = 0; i < markers.length; i++) {
|
|
var mlat = markers[i].position.lat();
|
|
var mlng = markers[i].position.lng();
|
|
var dLat = rad(mlat - lat);
|
|
var dLong = rad(mlng - lng);
|
|
var a = Math.sin(dLat / 2) * Math.sin(dLat / 2) +
|
|
Math.cos(rad(lat)) * Math.cos(rad(lat)) * Math.sin(dLong / 2) * Math.sin(dLong / 2);
|
|
var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
|
|
var d = R * c;
|
|
distances[i] = d;
|
|
if (closest == -1 || d < distances[closest]) {
|
|
closest = i;
|
|
}
|
|
}
|
|
if (Opcion === 0) {
|
|
if (markers[closest].getAnimation() != google.maps.Animation.BOUNCE) {
|
|
markers[closest].setAnimation(google.maps.Animation.BOUNCE);
|
|
} else {
|
|
markers[closest].setAnimation(null);
|
|
}
|
|
|
|
stopAnimation(markers[closest])
|
|
}
|
|
//else if (Opcion === 1) {
|
|
// google.maps.event.trigger(markers[closest], 'click')
|
|
//}
|
|
}
|
|
|
|
function stopAnimation(marker) {
|
|
setTimeout(function () {
|
|
marker.setAnimation(null);
|
|
}, 750);
|
|
}
|
|
|
|
function DeleteMarkers() {
|
|
for (var i = 0; i < markers.length; i++) {
|
|
markers[i].setMap(null);
|
|
}
|
|
markers = [];
|
|
for (var i = 0; i < polylines.length; i++) {
|
|
polylines[i].setMap(null);
|
|
}
|
|
polylines = [];
|
|
coordspoly = [];
|
|
}
|
|
|
|
function calculateAndDisplayRoute(origin, destination) {
|
|
directionsService.route({
|
|
origin: origin,
|
|
destination: destination,
|
|
travelMode: 'DRIVING'
|
|
}, function (response, status) {
|
|
if (status === 'OK') {
|
|
directionsDisplay.setDirections(response);
|
|
directionsDisplay.setMap(map);
|
|
} else {
|
|
window.alert('Directions request failed due to ' + status);
|
|
}
|
|
});
|
|
}
|
|
|
|
function fitBoundsToVisibleMarkers() {
|
|
|
|
var bounds = new google.maps.LatLngBounds();
|
|
|
|
for (var i = 0; i < markers.length; i++) {
|
|
if (markers[i].getVisible()) {
|
|
bounds.extend(markers[i].getPosition());
|
|
}
|
|
}
|
|
|
|
map.fitBounds(bounds);
|
|
|
|
}
|
|
|
|
function ShowDiv(controlDiv, map) {
|
|
// Set CSS for the control border.
|
|
var controlUI = document.createElement('div');
|
|
controlUI.style.backgroundColor = '#444d58';
|
|
controlUI.style.border = '2px solid #444d58';
|
|
controlUI.style.borderRadius = '3px';
|
|
controlUI.style.width = '100%'
|
|
controlUI.style.boxShadow = '0 2px 6px rgba(0,0,0,.3)';
|
|
controlUI.style.cursor = 'pointer';
|
|
controlUI.style.marginRight = '5px';
|
|
controlUI.style.marginTop = '5px';
|
|
controlUI.style.marginBottom = '0px';
|
|
controlUI.style.textAlign = 'center';
|
|
// controlUI.title = 'Click para borrar el último punto dibujado';
|
|
controlDiv.appendChild(controlUI);
|
|
|
|
// Set CSS for the control interior.
|
|
var controlText = document.createElement('div');
|
|
controlText.style.color = '#ebebeb';
|
|
controlText.id = "ShowDiv3"
|
|
controlText.style.fontFamily = ' "Open Sans", sans-serif; ';
|
|
controlText.style.fontSize = '14px';
|
|
controlText.style.lineHeight = '20px';
|
|
controlText.style.paddingLeft = '5px';
|
|
controlText.style.paddingRight = '5px';
|
|
controlText.innerHTML = '<i class="fa fa-angle-up" aria-hidden="true"></i>';
|
|
controlUI.appendChild(controlText);
|
|
|
|
// Setup the click event listeners: simply set the map to Chicago.
|
|
controlUI.addEventListener('click', function () {
|
|
FNShowDiv();
|
|
});
|
|
}
|
|
|
|
var open = false;
|
|
var pause = true;
|
|
var startPlay = true;
|
|
var pauseIndex = 0;
|
|
var ejecuciones = [];
|
|
function stopTimeout() {
|
|
for (var i = 0; i < ejecuciones.length; i++) {
|
|
if (ejecuciones[i] != null) {
|
|
clearTimeout(ejecuciones[i]);
|
|
}
|
|
}
|
|
}
|
|
function Play() {
|
|
var NoRows = $("#C_GvBarra").DataTable().rows().nodes().length;
|
|
$("#HdnOpcion").val("Play");
|
|
for (var i = pauseIndex; i < NoRows; i++) {
|
|
var newPlay = false;
|
|
if (pauseIndex > 0) {
|
|
newPlay = true;
|
|
} else {
|
|
newPlay = false;
|
|
}
|
|
doScaledTimeout(i, newPlay);
|
|
}
|
|
if (pauseIndex == (NoRows - 1)) {
|
|
pause = true;
|
|
startPlay = true;
|
|
pauseIndex = 0;
|
|
}
|
|
}
|
|
function OpcionesHistorico() {
|
|
if ($("#HdnOpcion").val() === 'All' || $("#HdnOpcion").val() === 'Idle' || $("#HdnOpcion").val() === 'Ralenti') {
|
|
$('#btnPlay').css('display', '');
|
|
$('#btnPrintExcel').css('display', '');
|
|
$('#btnPrintPDF').css('display', '');
|
|
$("#btnPlay").click(function () {
|
|
pause = !pause;
|
|
if (pause) {
|
|
stopTimeout();
|
|
} else {
|
|
if (startPlay) {
|
|
startPlay = false;
|
|
Play();
|
|
} else {
|
|
Play();
|
|
}
|
|
}
|
|
if ($('#btnPlay > i').hasClass("fa-pause")) {
|
|
$('#btnPlay > i').removeClass("fa-pause").addClass("fa-play");
|
|
} else if ($('#btnPlay > i').hasClass("fa-play")) {
|
|
$('#btnPlay > i').removeClass("fa-play").addClass("fa-pause");
|
|
}
|
|
|
|
});
|
|
$("#btnPrintExcel").click(function () {
|
|
var s;
|
|
for (var i = 0; i < $("#C_GvBarra").DataTable().rows().nodes().length; i++) {
|
|
s = s + $("#C_GvBarra").DataTable().row(i).node().cells[2].title.trim() + ';';
|
|
}
|
|
//$("#HdnDirecciones").val(s);
|
|
doScaledCLick("#C_BtnImprimirEX")
|
|
});
|
|
$("#btnPrintPDF").click(function () {
|
|
var s = "";
|
|
for (var i = 0; i < $("#C_GvBarra").DataTable().rows().nodes().length; i++) {
|
|
s = s + $("#C_GvBarra").DataTable().row(i).node().cells[2].title.trim() + ';';
|
|
}
|
|
//$("#HdnDirecciones").val(s);
|
|
doScaledCLick("#C_btnImprimir")
|
|
});
|
|
}
|
|
}
|
|
function FNShowDiv() {
|
|
if (open === false) {
|
|
//$("#ChkSeguimiento").appendTo("#DivSeguimiento");
|
|
//$("#ChkSeguimiento").appendTo("#DivSeguimiento");
|
|
$("#h").modal()
|
|
$("#ShowDiv3").css("line-height", "34px")
|
|
open = true
|
|
$("#ShowDiv3").html('<i class="fa fa-angle-down" aria-hidden="true"></i>')
|
|
setTimeout(function () {
|
|
$('.table.ADScrollPaginator2').DataTable().draw();
|
|
}, 150);
|
|
if ($("#HdnOpcion").val() === 'All' || $("#HdnOpcion").val() === 'Idle' || $("#HdnOpcion").val() === 'Ralenti') {
|
|
$('#btnPlay').css('display', '');
|
|
$('#btnPrintExcel').css('display', '');
|
|
$('#btnPrintPDF').css('display', '');
|
|
$("#btnPlay").click(function () {
|
|
pause = !pause;
|
|
if (pause) {
|
|
stopTimeout();
|
|
} else {
|
|
if (startPlay) {
|
|
startPlay = false;
|
|
Play();
|
|
} else {
|
|
Play();
|
|
}
|
|
}
|
|
if ($('#btnPlay > i').hasClass("fa-pause")) {
|
|
$('#btnPlay > i').removeClass("fa-pause").addClass("fa-play");
|
|
} else if ($('#btnPlay > i').hasClass("fa-play")) {
|
|
$('#btnPlay > i').removeClass("fa-play").addClass("fa-pause");
|
|
}
|
|
|
|
});
|
|
$("#btnPrintExcel").click(function () {
|
|
var s;
|
|
for (var i = 0; i < $("#C_GvBarra").DataTable().rows().nodes().length; i++) {
|
|
s = s + $("#C_GvBarra").DataTable().row(i).node().cells[2].title.trim() + ';';
|
|
}
|
|
$("#HdnDirecciones").val(s);
|
|
doScaledCLick("#C_BtnImprimirEX")
|
|
});
|
|
$("#btnPrintPDF").click(function () {
|
|
var s = "";
|
|
for (var i = 0; i < $("#C_GvBarra").DataTable().rows().nodes().length; i++) {
|
|
s = s + $("#C_GvBarra").DataTable().row(i).node().cells[2].title.trim() + ';';
|
|
}
|
|
$("#HdnDirecciones").val(s);
|
|
doScaledCLick("#C_btnImprimir")
|
|
});
|
|
}
|
|
} else {
|
|
$("#h").modal('hide')
|
|
$("#ShowDiv3").css("line-height", "20px")
|
|
open = false
|
|
$("#ShowDiv3").html('<i class="fa fa-angle-up" aria-hidden="true"></i>')
|
|
}
|
|
}
|
|
|
|
function CargaComandos(Vehiculo, CveDispositivo) {
|
|
// if (open) { FNShowDiv(); }
|
|
$("#HdnCveDipositivo").val(CveDispositivo)
|
|
$("#myModalLabel").text("Comando para vehículo: " + Vehiculo)
|
|
closeLastOpenedInfoWindow();
|
|
$("#divComandos").modal()
|
|
$("#C_BtnCargaComandos").click()
|
|
}
|
|
|
|
|
|
//Region GEOREFERENCIAS
|
|
var mcoords = [];
|
|
var markersg = [];
|
|
var s = "";
|
|
var nextSegment;
|
|
|
|
function PreparaDibujado(index) {
|
|
if ($("#ULTIMOPUNTODV").length <= 0) {
|
|
var upControlDiv = document.createElement('div');
|
|
var upControl = new ControlUltimoPunto(upControlDiv, map);
|
|
upControlDiv.index = 1;
|
|
upControlDiv.id = "ULTIMOPUNTODV"
|
|
map.controls[google.maps.ControlPosition.TOP_RIGHT].push(upControlDiv);
|
|
}
|
|
if ($("#DVSELECT").length <= 0) {
|
|
var SelectControlDiv = document.createElement('div');
|
|
var SelectControl = new ControlSelect(SelectControlDiv, map);
|
|
SelectControlDiv.id = "DVSELECT"
|
|
SelectControlDiv.index = 1;
|
|
map.controls[google.maps.ControlPosition.TOP_LEFT].push(SelectControlDiv);
|
|
map.addListener('click', addLatLng);
|
|
}
|
|
|
|
if ($("#DvGuardar").length <= 0) {
|
|
var routeControlDiv = document.createElement('div');
|
|
var routeControl = new ControlGuardarRuta(routeControlDiv, map);
|
|
routeControlDiv.id = "DvGuardar"
|
|
if (typeof (index) !== 'undefined') {
|
|
routeControlDiv.index = index;
|
|
}
|
|
map.controls[google.maps.ControlPosition.TOP_RIGHT].push(routeControlDiv);
|
|
}
|
|
|
|
}
|
|
function PreparaDibujadoHistorico() {
|
|
if ($("#DvGuardarHistorico").length <= 0) {
|
|
var routeControlDiv = document.createElement('div');
|
|
var routeControl = new ControlGuardarRutaHistorico(routeControlDiv, map);
|
|
routeControlDiv.id = "DvGuardarHistorico"
|
|
routeControlDiv.index = 2;
|
|
map.controls[google.maps.ControlPosition.TOP_RIGHT].push(routeControlDiv);
|
|
}
|
|
}
|
|
|
|
function TerminaDibujado() {
|
|
if ($("#ULTIMOPUNTODV").length > 0) {
|
|
$("#ULTIMOPUNTODV").remove()
|
|
}
|
|
if ($("#DVSELECT").length > 0) {
|
|
$("#DVSELECT").remove()
|
|
google.maps.event.clearListeners(map, 'click');
|
|
DeleteMarkersG();
|
|
}
|
|
if ($("#DvGuardar").length > 0) {
|
|
$("#DvGuardar").remove()
|
|
}
|
|
}
|
|
|
|
function ControlUltimoPunto(controlDiv, map) {
|
|
|
|
// Set CSS for the control border.
|
|
var controlUI = document.createElement('div');
|
|
controlUI.style.backgroundColor = '#fff';
|
|
controlUI.style.border = '2px solid #fff';
|
|
controlUI.style.borderRadius = '3px';
|
|
controlUI.style.width = '165px'
|
|
controlUI.style.boxShadow = '0 2px 6px rgba(0,0,0,.3)';
|
|
controlUI.style.cursor = 'pointer';
|
|
controlUI.style.marginRight = '5px';
|
|
controlUI.style.marginTop = '5px';
|
|
controlUI.style.marginBottom = '22px';
|
|
controlUI.style.textAlign = 'center';
|
|
controlUI.title = 'Click para borrar el último punto dibujado';
|
|
controlDiv.appendChild(controlUI);
|
|
|
|
// Set CSS for the control interior.
|
|
var controlText = document.createElement('div');
|
|
controlText.style.color = 'rgb(25,25,25)';
|
|
controlText.style.fontFamily = ' "Open Sans", sans-serif; ';
|
|
controlText.style.fontSize = '14px';
|
|
controlText.style.lineHeight = '38px';
|
|
controlText.style.paddingLeft = '5px';
|
|
controlText.style.paddingRight = '5px';
|
|
controlText.innerHTML = 'Borrar Último Punto';
|
|
controlUI.appendChild(controlText);
|
|
|
|
// Setup the click event listeners: simply set the map to Chicago.
|
|
controlUI.addEventListener('click', function () {
|
|
EliminarUltimoPunto();
|
|
});
|
|
|
|
}
|
|
|
|
function ControlSelect(controlDiv, map) {
|
|
|
|
// Set CSS for the control border.
|
|
var controlUI = document.createElement('div');
|
|
controlUI.style.marginLeft = '10px';
|
|
controlUI.style.zIndex = '0';
|
|
controlUI.style.cursor = 'pointer';
|
|
// controlUI.style.position = 'absolute';
|
|
controlUI.style.left = "0px";
|
|
controlUI.style.width = "150px";
|
|
controlUI.style.marginTop = "10px"
|
|
controlUI.style.top = "0px";
|
|
controlUI.className = 'gmnoprint';
|
|
|
|
controlDiv.appendChild(controlUI);
|
|
|
|
var ControlSub1 = document.createElement('div')
|
|
ControlSub1.style.float = 'left';
|
|
ControlSub1.className = 'gm-style-mtc'
|
|
controlUI.appendChild(ControlSub1)
|
|
|
|
var ControlSub2 = document.createElement('div')
|
|
ControlSub2.style.direction = 'ltr';
|
|
ControlSub2.style.overflow = 'hidden';
|
|
ControlSub2.id = "Geocerca"
|
|
ControlSub2.style.textAlign = 'center';
|
|
ControlSub2.style.position = 'relative';
|
|
ControlSub2.style.color = 'rgb(0,0,0)';
|
|
ControlSub2.style.fontFamily = ' "Open Sans", sans-serif; ';
|
|
ControlSub2.style.msUserSelect = 'none;';
|
|
ControlSub2.style.fontSize = '11px'
|
|
ControlSub2.style.backgroundColor = 'rgb(255,255,255)'
|
|
ControlSub2.style.padding = '11px'
|
|
ControlSub2.style.backgroundClip = 'padding-box'
|
|
ControlSub2.style.minWidth = '28px'
|
|
ControlSub2.style.fontWeight = '500'
|
|
ControlSub2.style.boxShadow = '0 1px 4px -1px rgba(0,0,0,.3)';
|
|
ControlSub2.innerHTML = 'Geocerca'
|
|
ControlSub1.appendChild(ControlSub2)
|
|
|
|
var ControlSub3 = document.createElement('div')
|
|
ControlSub3.style.float = 'left';
|
|
ControlSub3.className = 'gm-style-mtc'
|
|
controlUI.appendChild(ControlSub3)
|
|
|
|
var ControlSub4 = document.createElement('div')
|
|
ControlSub4.style.direction = 'ltr';
|
|
ControlSub4.style.overflow = 'hidden';
|
|
ControlSub4.style.textAlign = 'center';
|
|
ControlSub4.id = "Georuta"
|
|
ControlSub4.style.position = 'relative';
|
|
ControlSub4.style.color = 'rgb(86,86,86)';
|
|
ControlSub4.style.fontFamily = ' "Open Sans", sans-serif; ';
|
|
ControlSub4.style.msUserSelect = 'none;';
|
|
ControlSub4.style.fontSize = '11px'
|
|
ControlSub4.style.backgroundColor = 'rgb(255,255,255)'
|
|
ControlSub4.style.padding = '11px'
|
|
ControlSub4.style.backgroundClip = 'padding-box'
|
|
ControlSub4.style.minWidth = '38px'
|
|
ControlSub4.style.fontWeight = '500'
|
|
ControlSub4.style.boxShadow = '0 1px 4px -1px rgba(0,0,0,.3)';
|
|
ControlSub4.style.borderLeft = '0px;'
|
|
ControlSub4.innerHTML = 'Georuta'
|
|
ControlSub3.appendChild(ControlSub4)
|
|
|
|
|
|
// Setup the click event listeners: simply set the map to Chicago.
|
|
ControlSub3.addEventListener('click', function () {
|
|
CambiaTipo('Georuta');
|
|
});
|
|
|
|
ControlSub1.addEventListener('click', function () {
|
|
CambiaTipo('Geocerca');
|
|
});
|
|
|
|
}
|
|
|
|
function ControlColor(controlDiv, map) {
|
|
|
|
// Set CSS for the control border.
|
|
var controlUI = document.createElement('div');
|
|
controlUI.style.backgroundColor = '#fff';
|
|
controlUI.style.border = '2px solid #fff';
|
|
controlUI.style.borderRadius = '3px';
|
|
controlUI.style.pointer = '3px';
|
|
controlUI.style.boxShadow = '0 2px 6px rgba(0,0,0,.3)';
|
|
controlUI.style.cursor = 'pointer';
|
|
controlUI.style.marginLeft = '10px';
|
|
controlUI.style.marginTop = '5px';
|
|
controlUI.style.marginBottom = '22px';
|
|
controlUI.style.textAlign = 'center';
|
|
controlUI.style.color = 'rgb(25,25,25)';
|
|
controlUI.style.fontFamily = ' "Open Sans", sans-serif; ';
|
|
controlUI.style.fontSize = '14px';
|
|
controlUI.style.paddingLeft = '5px';
|
|
controlUI.style.paddingRight = '5px';
|
|
controlUI.innerHTML = 'Cambiar Color '
|
|
controlUI.title = 'Click para cambiar el color del polygono';
|
|
controlDiv.appendChild(controlUI);
|
|
|
|
// Set CSS for the control interior.
|
|
var controlText = document.createElement('input');
|
|
controlText.type = 'hidden';
|
|
controlText.id = 'hidden-input'
|
|
controlText.className = 'demo'
|
|
controlText.value = '#0088FF'
|
|
controlText.onchange = function () { CambiaColor(); };
|
|
controlUI.appendChild(controlText);
|
|
|
|
// Setup the click event listeners: simply set the map to Chicago.
|
|
controlUI.addEventListener('click', function () {
|
|
ComponentsColorPickers.init();
|
|
});
|
|
|
|
|
|
}
|
|
|
|
function ControlGuardarRuta(controlDiv, map) {
|
|
|
|
// Set CSS for the control border.
|
|
var controlUI = document.createElement('div');
|
|
controlUI.id = "btnGuardarRuta"
|
|
controlUI.style.display = 'none';
|
|
controlUI.style.backgroundColor = '#4B77BE';
|
|
controlUI.style.color = "#fff";
|
|
controlUI.style.borderRadius = '3px';
|
|
controlUI.style.width = '165px'
|
|
controlUI.style.boxShadow = '0 2px 6px rgba(0,0,0,.3)';
|
|
controlUI.style.cursor = 'pointer';
|
|
controlUI.style.marginRight = '5px';
|
|
controlUI.style.marginTop = '5px';
|
|
controlUI.style.marginBottom = '22px';
|
|
controlUI.style.textAlign = 'center';
|
|
controlUI.title = 'Guardar la ruta trazada como georeferencia';
|
|
controlDiv.appendChild(controlUI);
|
|
|
|
// Set CSS for the control interior.
|
|
var controlText = document.createElement('div');
|
|
controlText.style.color = '#fff';
|
|
controlText.style.fontFamily = ' "Open Sans", sans-serif; ';
|
|
controlText.style.fontSize = '14px';
|
|
controlText.style.lineHeight = '38px';
|
|
controlText.style.paddingLeft = '5px';
|
|
controlText.style.paddingRight = '5px';
|
|
controlText.innerHTML = 'Guardar GeoReferencia';
|
|
controlUI.appendChild(controlText);
|
|
|
|
// Setup the click event listeners: simply set the map to Chicago.
|
|
controlUI.addEventListener('click', function () {
|
|
var r = polygon.getPath();
|
|
var s = "";
|
|
r.forEach(function (xy, i) { s += xy.lng() + ' ' + xy.lat() + ',' })
|
|
s += r.b[0].lng() + ' ' + r.b[0].lat();
|
|
$("#GeoCerca").val(s);
|
|
|
|
$("#divAgregarGeoreferencia").modal();
|
|
$("#C_TxtNombre").val("")
|
|
$("#C_TxtTolerancia").val("")
|
|
$("#C_TxtFechaFG").val("")
|
|
$("#C_TxtFechaIG").val("")
|
|
$(".geo").checked = false
|
|
});
|
|
|
|
}
|
|
function CargaVehiculosHistoricos() {
|
|
var data = [];
|
|
for (var i = 0; i < geoRutasHistoricas.length; i++) {
|
|
var dato = {
|
|
id: geoRutasHistoricas[i].ValueEquipo,
|
|
text: geoRutasHistoricas[i].NombreEquipo
|
|
};
|
|
data.push(dato);
|
|
}
|
|
|
|
$("#C_DdlEquipoHis").select2({
|
|
data: data
|
|
});
|
|
|
|
$('#C_DdlEquipoHis').on('select2:select', function (e) {
|
|
var geoRuta = geoRutasHistoricas.filter(function (item) { return (item.ValueEquipo == parseInt($("#C_DdlEquipoHis").val())); })
|
|
if (geoRuta.length = 1) {
|
|
$("#GeoRutaHistorico").val(JSON.stringify(geoRuta[0]));
|
|
}
|
|
|
|
});
|
|
$("#C_TxtNombreHis").val("")
|
|
$("#C_TxtToleHis").val("")
|
|
$("#C_TxtFechaIHis").val("")
|
|
$("#C_TxtFechaFHis").val("")
|
|
$(".geo").checked = false
|
|
}
|
|
var geoRutasHistoricas = [];
|
|
function ControlGuardarRutaHistorico(controlDiv, map) {
|
|
|
|
// Set CSS for the control border.
|
|
var controlUI = document.createElement('div');
|
|
controlUI.id = "btnGuardarRutaHistorico"
|
|
//controlUI.style.display = 'none';
|
|
controlUI.style.backgroundColor = '#4B77BE';
|
|
controlUI.style.color = "#fff";
|
|
controlUI.style.borderRadius = '3px';
|
|
controlUI.style.width = '165px'
|
|
controlUI.style.boxShadow = '0 2px 6px rgba(0,0,0,.3)';
|
|
controlUI.style.cursor = 'pointer';
|
|
controlUI.style.marginRight = '5px';
|
|
controlUI.style.marginTop = '5px';
|
|
controlUI.style.marginBottom = '22px';
|
|
controlUI.style.textAlign = 'center';
|
|
controlUI.title = 'Guardar la ruta trazada como georeferencia';
|
|
controlDiv.appendChild(controlUI);
|
|
|
|
// Set CSS for the control interior.
|
|
var controlText = document.createElement('div');
|
|
controlText.style.color = '#fff';
|
|
controlText.style.fontFamily = ' "Open Sans", sans-serif; ';
|
|
controlText.style.fontSize = '14px';
|
|
controlText.style.lineHeight = '38px';
|
|
controlText.style.paddingLeft = '5px';
|
|
controlText.style.paddingRight = '5px';
|
|
controlText.innerHTML = 'Guardar Ruta';
|
|
controlUI.appendChild(controlText);
|
|
|
|
// Setup the click event listeners: simply set the map to Chicago.
|
|
controlUI.addEventListener('click', function () {
|
|
|
|
CargaVehiculosHistoricos();
|
|
|
|
$("#divAgregarGeoreferenciaHistorico").modal('show');
|
|
|
|
if (geoRutasHistoricas.length > 0) {
|
|
$('#C_DdlEquipoHis').val(geoRutasHistoricas[0].ValueEquipo).trigger('change.select2');
|
|
$("#GeoRutaHistorico").val(JSON.stringify(geoRutasHistoricas[0]));
|
|
}
|
|
});
|
|
|
|
}
|
|
function AddGeo() {
|
|
//if ($("#HdnTipo").val() === 'Geocerca') {
|
|
// if (markers.length === 0) {
|
|
// alert('Dibuje los vértices de la geocerca haciendo click en el mapa.');
|
|
// } else if (markers.length < 3) { alert('Debe dibujar por lo menos 3 vértices para la creación de la geocerca'); }
|
|
// else {
|
|
// $('#divAgregarTipo').modal();
|
|
// }
|
|
//} else if ($("#HdnTipo").val() === 'Georuta') {
|
|
// if (markers.length === 0) {
|
|
// alert('Traza la ruta click en el mapa.');
|
|
// } else if (markers.length < 2) { alert('Debe dibujar por lo menos 2 puntos en el mapa para la creación de la ruta'); }
|
|
// else {
|
|
// $('#divAgregarTipo').modal();
|
|
// }
|
|
//}
|
|
}
|
|
|
|
function CambiaTipo(Tipo) {
|
|
DeleteMarkersG();
|
|
if (Tipo === 'Geocerca') {
|
|
$("#HdnTipo").val('Geocerca')
|
|
$("#Geocerca").css("font-weight", "bold")
|
|
$("#Georuta").css("font-weight", "normal")
|
|
} else if (Tipo === 'Georuta') {
|
|
$("#HdnTipo").val('Georuta')
|
|
$("#Geocerca").css("font-weight", "normal")
|
|
$("#Georuta").css("font-weight", "bold")
|
|
}
|
|
}
|
|
|
|
function addLatLng(event) {
|
|
// var path = poly.getPath();
|
|
// path.push(event.latLng);
|
|
var lat = event.latLng.lat();
|
|
var lng = event.latLng.lng();
|
|
mcoords.push(event.latLng)
|
|
|
|
var info = new google.maps.InfoWindow({
|
|
content: "(" + lat + " " + lng + ")"
|
|
});
|
|
|
|
var marker = new google.maps.Marker({
|
|
position: event.latLng,
|
|
title: 'Punto',
|
|
map: map
|
|
});
|
|
markersg.push(marker);
|
|
marker.addListener('click', function () {
|
|
info.open(map, marker);
|
|
});
|
|
if ($("#HdnTipo").val() === 'Georuta') {
|
|
if (markersg.length > 1) {
|
|
CreaRuta();
|
|
$("#btnGuardarRuta").css("display", "")
|
|
}
|
|
}
|
|
else if ($("#HdnTipo").val() === 'Geocerca') {
|
|
var h = $('#GeoCerca').val() + lng + " " + lat + ","
|
|
$('#GeoCerca').val(h)
|
|
if (markersg.length == 1) {
|
|
$('#CommandArg').val(lng + " " + lat)
|
|
}
|
|
if (markersg.length === 3) {
|
|
creaPoligono();
|
|
$("#btnGuardarRuta").css("display", "")
|
|
} else if (markersg.length > 3) {
|
|
var path = polygon.getPath();
|
|
path.push(event.latLng)
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
function creaPoligono() {
|
|
polygon = new google.maps.Polygon({
|
|
paths: mcoords,
|
|
strokeColor: "#0088FF",
|
|
strokeOpacity: 0.8,
|
|
strokeWeight: 2,
|
|
fillColor: "#0088FF",
|
|
fillOpacity: 0.35,
|
|
editable: true
|
|
});
|
|
polygon.setMap(map);
|
|
$("#C_BtnCrear").prop('disabled', false);
|
|
}
|
|
|
|
function CreaRuta() {
|
|
var start = markersg[0].position;
|
|
var end = markersg[markersg.length - 1].position;
|
|
var waypts = [];
|
|
s = ""
|
|
|
|
for (var i = 1; i < markersg.length - 1; i++) {
|
|
waypts.push({
|
|
location: markersg[i].position,
|
|
stopover: true
|
|
});
|
|
}
|
|
directionsService.route({
|
|
origin: start,
|
|
destination: end,
|
|
travelMode: 'DRIVING',
|
|
waypoints: waypts
|
|
}, function (response, status) {
|
|
if (status === 'OK') {
|
|
directionsDisplay.setDirections(response);
|
|
directionsDisplay.setMap(map);
|
|
|
|
var legs = response.routes[0].legs;
|
|
for (i = 0; i < legs.length; i++) {
|
|
var steps = legs[i].steps;
|
|
for (j = 0; j < steps.length; j++) {
|
|
var nextSegment = steps[j].path;
|
|
for (k = 0; k < nextSegment.length; k++) {
|
|
s = s + nextSegment[k] + '+'
|
|
}
|
|
}
|
|
}
|
|
$('#CommandArg').val(s);
|
|
} else {
|
|
window.alert('Directions request failed due to ' + status);
|
|
}
|
|
});
|
|
}
|
|
|
|
function EliminarUltimoPunto() {
|
|
if (markersg.length > 0) {
|
|
markersg[markersg.length - 1].setMap(null)
|
|
markersg.splice((markersg.length - 1), 1);
|
|
mcoords.splice((mcoords.length - 1), 1);
|
|
if ($("#HdnTipo").val() === 'Georuta') {
|
|
if (markersg.length >= 2) {
|
|
CreaRuta();
|
|
} else { directionsDisplay.setMap(null); $("#btnGuardarRuta").css("display", "none"); }
|
|
}
|
|
else if ($("#HdnTipo").val() === 'Geocerca') {
|
|
if (typeof polygon != 'undefined') {
|
|
polygon.setMap(null);
|
|
if (markersg.length >= 3) {
|
|
creaPoligono($("#hidden-input").val());
|
|
} else {
|
|
$("#btnGuardarRuta").css("display", "none")
|
|
}
|
|
}
|
|
var h;
|
|
$('#GeoCerca').val('')
|
|
for (var i = 0; i < mcoords.length; i++) {
|
|
var lat = mcoords[i].lat()
|
|
var lng = mcoords[i].lng()
|
|
h = $('#GeoCerca').val() + lng + " " + lat + ","
|
|
$('#GeoCerca').val(h)
|
|
if (i === 0) {
|
|
$('#CommandArg').val(lng + " " + lat)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
function DeleteMarkersG() {
|
|
for (var i = 0; i < markersg.length; i++) {
|
|
markersg[i].setMap(null);
|
|
}
|
|
markersg = [];
|
|
directionsDisplay.setMap(null);
|
|
mcoords = [];
|
|
$('#GeoCerca').val('')
|
|
if (typeof polygon != 'undefined') {
|
|
polygon.setMap(null);
|
|
}
|
|
$("#btnGuardarRuta").css("display", "none")
|
|
}
|
|
|
|
function CambiaColor() {
|
|
$("#C_TxtColor").val($("#hidden-input").val())
|
|
}
|
|
function CambiaColorH() {
|
|
$("#C_TxtColorH").val($("#hidden-input-Hist").val())
|
|
}
|
|
|
|
function Limpieza() {
|
|
DeleteMarkersG();
|
|
//$('#C_TxtHoraI').datetimepicker({
|
|
// datepicker: false,
|
|
// lang: 'es',
|
|
// format: 'H:i',
|
|
// formatDate: 'H:i',
|
|
// step: 30
|
|
//});
|
|
//$('#C_TxtHoraF').datetimepicker({
|
|
// datepicker: false,
|
|
// lang: 'es',
|
|
// format: 'H:i',
|
|
// formatDate: 'H:i',
|
|
// step: 30
|
|
//});
|
|
$('#divAgregarGeoreferencia').modal('hide');
|
|
}
|
|
function ControlLabels(controlDiv, map) {
|
|
|
|
// Set CSS for the control border.
|
|
var controlUI = document.createElement('div');
|
|
controlUI.style.marginLeft = '10px';
|
|
controlUI.style.zIndex = '0';
|
|
controlUI.style.cursor = 'pointer';
|
|
// controlUI.style.position = 'absolute';
|
|
controlUI.style.left = "0px";
|
|
controlUI.style.width = "150px";
|
|
controlUI.style.marginTop = "10px"
|
|
controlUI.style.top = "0px";
|
|
controlUI.className = 'gmnoprint';
|
|
|
|
controlDiv.appendChild(controlUI);
|
|
|
|
var ControlSub1 = document.createElement('div')
|
|
ControlSub1.style.float = 'left';
|
|
ControlSub1.className = 'gm-style-mtc'
|
|
controlUI.appendChild(ControlSub1)
|
|
|
|
var ControlSub2 = document.createElement('div')
|
|
ControlSub2.style.direction = 'ltr';
|
|
ControlSub2.style.overflow = 'hidden';
|
|
ControlSub2.id = "LnkEtiquetas"
|
|
ControlSub2.style.textAlign = 'center';
|
|
ControlSub2.style.position = 'relative';
|
|
ControlSub2.style.color = 'rgb(0,0,0)';
|
|
ControlSub2.style.fontFamily = ' "Open Sans", sans-serif; ';
|
|
ControlSub2.style.msUserSelect = 'none;';
|
|
ControlSub2.style.fontSize = '11px'
|
|
ControlSub2.style.backgroundColor = 'rgb(255,255,255)'
|
|
ControlSub2.style.padding = '11px'
|
|
ControlSub2.style.backgroundClip = 'padding-box'
|
|
ControlSub2.style.minWidth = '28px'
|
|
ControlSub2.style.fontWeight = '500'
|
|
ControlSub2.style.boxShadow = '0 1px 4px -1px rgba(0,0,0,.3)';
|
|
ControlSub2.innerHTML = 'Mostrar Etiquetas'
|
|
ControlSub1.appendChild(ControlSub2)
|
|
|
|
ControlSub1.addEventListener('click', function () {
|
|
EscondeLabels();
|
|
});
|
|
|
|
}
|
|
function ControlGeocercas(controlDiv, map) {
|
|
|
|
// Set CSS for the control border.
|
|
var controlUI = document.createElement('div');
|
|
controlUI.style.marginLeft = '10px';
|
|
controlUI.style.zIndex = '0';
|
|
controlUI.style.cursor = 'pointer';
|
|
// controlUI.style.position = 'absolute';
|
|
controlUI.style.left = "0px";
|
|
controlUI.style.width = "150px";
|
|
controlUI.style.marginTop = "10px"
|
|
controlUI.style.top = "0px";
|
|
controlUI.className = 'gmnoprint';
|
|
|
|
controlDiv.appendChild(controlUI);
|
|
|
|
var ControlSub1 = document.createElement('div')
|
|
ControlSub1.style.float = 'left';
|
|
ControlSub1.className = 'gm-style-mtc'
|
|
controlUI.appendChild(ControlSub1)
|
|
|
|
var ControlSub2 = document.createElement('div')
|
|
ControlSub2.style.direction = 'ltr';
|
|
ControlSub2.style.overflow = 'hidden';
|
|
ControlSub2.id = "LnkMostarGeocercas"
|
|
ControlSub2.style.textAlign = 'center';
|
|
ControlSub2.style.position = 'relative';
|
|
ControlSub2.style.color = 'rgb(0,0,0)';
|
|
ControlSub2.style.fontFamily = ' "Open Sans", sans-serif; ';
|
|
ControlSub2.style.msUserSelect = 'none;';
|
|
ControlSub2.style.fontSize = '11px'
|
|
ControlSub2.style.display = 'none'
|
|
ControlSub2.style.backgroundColor = 'rgb(255,255,255)'
|
|
ControlSub2.style.padding = '11px'
|
|
ControlSub2.style.backgroundClip = 'padding-box'
|
|
ControlSub2.style.minWidth = '28px'
|
|
ControlSub2.style.fontWeight = '500'
|
|
ControlSub2.style.boxShadow = '0 1px 4px -1px rgba(0,0,0,.3)';
|
|
ControlSub2.innerHTML = 'Mostrar Geocercas'
|
|
ControlSub1.appendChild(ControlSub2)
|
|
|
|
ControlSub1.addEventListener('click', function () {
|
|
VerGeocercas();
|
|
});
|
|
|
|
}
|
|
var visible = false
|
|
function EscondeLabels() {
|
|
|
|
if (visible) {
|
|
for (var i = 0; i < markers.length; i++) {
|
|
markers[i].setLabel(null);
|
|
}
|
|
visible = false
|
|
} else {
|
|
for (var i = 0; i < markers.length; i++) {
|
|
var label = {
|
|
text: markers[i].Nombre,
|
|
fontSize: "12px",
|
|
color: 'black',
|
|
fontWeight: 'bolder'
|
|
}
|
|
markers[i].setLabel(label);
|
|
}
|
|
visible = true
|
|
}
|
|
for (var i = 0; i < markers.length; i++) {
|
|
markers[i].setMap(null);
|
|
}
|
|
for (var i = 0; i < markers.length; i++) {
|
|
markers[i].setMap(map);
|
|
}
|
|
}
|
|
|
|
//END REGION
|
|
|
|
//REGION GEOCERCAS
|
|
var polygonsGeocercas = [];
|
|
var markersGeo = [];
|
|
|
|
var IsGeoVisibles = false;
|
|
|
|
function VerGeocercas() {
|
|
if (IsGeoVisibles) {
|
|
HideGeocercas();
|
|
IsGeoVisibles = false;
|
|
} else {
|
|
CargaGeocercas();
|
|
IsGeoVisibles = true;
|
|
}
|
|
}
|
|
function CargaGeocercas() {
|
|
for (var i = 0; i < polygonsGeocercas.length; i++) {
|
|
polygonsGeocercas[i].setMap(map);
|
|
}
|
|
for (var j = 0; j < markersGeo.length; j++) {
|
|
markersGeo[j].setMap(map);
|
|
}
|
|
}
|
|
|
|
function DeleteGeocercas() {
|
|
for (var i = 0; i < polygonsGeocercas.length; i++) {
|
|
polygonsGeocercas[i].setMap(null);
|
|
}
|
|
for (var j = 0; j < markersGeo.length; j++) {
|
|
markersGeo[j].setMap(null);
|
|
}
|
|
polygonsGeocercas = [];
|
|
markersGeo = [];
|
|
}
|
|
function HideGeocercas() {
|
|
for (var i = 0; i < polygonsGeocercas.length; i++) {
|
|
polygonsGeocercas[i].setMap(null);
|
|
}
|
|
for (var j = 0; j < markersGeo.length; j++) {
|
|
markersGeo[j].setMap(null);
|
|
}
|
|
}
|
|
function creaPoligonoGeocerca(coords, color, Geocerca) {
|
|
var polygon = new google.maps.Polygon({
|
|
paths: coords,
|
|
strokeColor: color,
|
|
strokeOpacity: 0.8,
|
|
strokeWeight: 2,
|
|
fillColor: color,
|
|
fillOpacity: 0.35
|
|
});
|
|
polygonsGeocercas.push(polygon);
|
|
CreaMarcadorPoligonoGeocerca(coords, Geocerca);
|
|
}
|
|
function CreaMarcadorPoligonoGeocerca(coords, GeoCerca) {
|
|
var bounds = new google.maps.LatLngBounds();
|
|
for (i = 0; i < coords.length; i++) {
|
|
bounds.extend(coords[i]);
|
|
}
|
|
|
|
var marker = new google.maps.Marker({
|
|
position: bounds.getCenter(),
|
|
title: GeoCerca
|
|
});
|
|
|
|
var infowindow = new google.maps.InfoWindow({
|
|
content: '<h4><b>' + GeoCerca + '</b></h4>'
|
|
});
|
|
|
|
marker.addListener('click', function () {
|
|
closeLastOpenedInfoWindow();
|
|
infowindow.open(map, marker);
|
|
lastOpenedInfoWindow = infowindow;
|
|
});
|
|
|
|
markersGeo.push(marker);
|
|
}
|
|
//END REGION
|
|
|
|
//REGION PARADAS
|
|
var polygonsParadas = [];
|
|
var markersParadas = [];
|
|
|
|
function creaPoligonoParada(coords, color, Geocerca) {
|
|
var polygon = new google.maps.Polygon({
|
|
paths: coords,
|
|
strokeColor: color,
|
|
strokeOpacity: 0.8,
|
|
strokeWeight: 2,
|
|
fillColor: color,
|
|
fillOpacity: 0.35
|
|
});
|
|
polygon.setMap(map);
|
|
polygonsParadas.push(polygon);
|
|
CreaMarcadorPoligonoParada(coords, Geocerca);
|
|
}
|
|
|
|
function CreaMarcadorPoligonoParada(coords, GeoCerca) {
|
|
var bounds = new google.maps.LatLngBounds();
|
|
for (i = 0; i < coords.length; i++) {
|
|
bounds.extend(coords[i]);
|
|
}
|
|
|
|
var marker = new google.maps.Marker({
|
|
position: bounds.getCenter(),
|
|
title: GeoCerca,
|
|
map: map
|
|
});
|
|
|
|
var infowindow = new google.maps.InfoWindow({
|
|
content: '<h4><b>' + GeoCerca + '</b></h4>'
|
|
});
|
|
|
|
marker.addListener('click', function () {
|
|
closeLastOpenedInfoWindow();
|
|
infowindow.open(map, marker);
|
|
lastOpenedInfoWindow = infowindow;
|
|
});
|
|
|
|
markersParadas.push(marker);
|
|
}
|
|
function DeletemarkersParadas() {
|
|
for (var i = 0; i < markersParadas.length; i++) {
|
|
markersParadas[i].setMap(null);
|
|
}
|
|
markersParadas = [];
|
|
for (var j = 0; j < polygonsParadas.length; j++) {
|
|
if (typeof polygonsParadas[j] != 'undefined') {
|
|
polygonsParadas[j].setMap(null);
|
|
}
|
|
}
|
|
polygonsParadas = [];
|
|
|
|
}
|
|
//END REGION
|
|
|
|
//REGION GEOCERCAS EN RASTREO CONTINUO
|
|
var polygonsGeoRastreo = [];
|
|
var markersGeoRastreo = [];
|
|
|
|
function creaPoligonoGeoRastreo(coords, color, Geocerca) {
|
|
var polygon = new google.maps.Polygon({
|
|
paths: coords,
|
|
strokeColor: color,
|
|
strokeOpacity: 0.8,
|
|
strokeWeight: 2,
|
|
fillColor: color,
|
|
fillOpacity: 0.35
|
|
});
|
|
polygon.setMap(map);
|
|
polygonsGeoRastreo.push(polygon);
|
|
CreaMarcadorPoligonoGeoRastreo(coords, Geocerca);
|
|
}
|
|
|
|
function CreaMarcadorPoligonoGeoRastreo(coords, GeoCerca) {
|
|
var bounds = new google.maps.LatLngBounds();
|
|
for (i = 0; i < coords.length; i++) {
|
|
bounds.extend(coords[i]);
|
|
}
|
|
|
|
var marker = new google.maps.Marker({
|
|
position: bounds.getCenter(),
|
|
title: GeoCerca,
|
|
map: map
|
|
});
|
|
|
|
var infowindow = new google.maps.InfoWindow({
|
|
content: '<h4><b>' + GeoCerca + '</b></h4>'
|
|
});
|
|
|
|
marker.addListener('click', function () {
|
|
closeLastOpenedInfoWindow();
|
|
infowindow.open(map, marker);
|
|
lastOpenedInfoWindow = infowindow;
|
|
});
|
|
|
|
markersGeoRastreo.push(marker);
|
|
}
|
|
function DeletemarkersGeoRastreo() {
|
|
for (var i = 0; i < markersGeoRastreo.length; i++) {
|
|
markersGeoRastreo[i].setMap(null);
|
|
}
|
|
markersGeoRastreo = [];
|
|
for (var j = 0; j < polygonsGeoRastreo.length; j++) {
|
|
if (typeof polygonsGeoRastreo[j] != 'undefined') {
|
|
polygonsGeoRastreo[j].setMap(null);
|
|
}
|
|
}
|
|
polygonsGeoRastreo = [];
|
|
|
|
}
|
|
//END REGION
|
|
function myfunction() {
|
|
var arrayOfStrings = HdnTextFilter.value.split("");
|
|
for (var i = 0; i < arrayOfStrings.length; i++) {
|
|
var e = jQuery.Event("keypress");
|
|
e.which = arrayOfStrings[i].charCodeAt(0);; // m code value
|
|
e.altKey = true; // Alt key pressed
|
|
$("#C_GvBarra_filter > div > input").trigger(e);
|
|
}
|
|
}
|
|
|
|
function CargaHistorico() {
|
|
debugger;
|
|
var datos = JSON.parse(HdnJSScript.value);
|
|
|
|
eval(datos.MarcadoresScript);
|
|
eval(datos.PolylineScript);
|
|
}
|
|
|
|
function GvBarraPaginator() {
|
|
$('.table.PaginarGV').each(function () {
|
|
var Tthis = $(this);
|
|
if (!$.fn.DataTable.isDataTable(Tthis) && Tthis.find("th").length > 0) {
|
|
Tthis.prepend(("<thead></thead>"));
|
|
Tthis.find('thead').append($("#C_GvBarra").find("tr:first"));
|
|
var table = Tthis.DataTable({
|
|
//data: datasource,
|
|
//columns: [
|
|
// { title: "Vehiculo" },
|
|
// { title: "Fecha" },
|
|
// { title: "TiempoDetenido" },
|
|
// { title: "Extn." },
|
|
// { title: "Start date" },
|
|
// { title: "Salary" }
|
|
//],
|
|
deferRender: true,
|
|
deferLoading: 100,
|
|
scrollY: 130,
|
|
scrollCollapse: true,
|
|
scroller: {
|
|
displayBuffer: 20
|
|
},
|
|
ordering: true
|
|
});
|
|
var tkeys = new $.fn.dataTable.KeyTable(table, {
|
|
// options
|
|
});
|
|
var parent = Tthis.parent().parent().parent()
|
|
$('.dataTables_scrollHeadInner > .table.ADScrollPaginator2').find('th').addClass('importantth');
|
|
parent.find(".dataTables_paginate").css("display", "none")
|
|
parent.find(".dataTables_length").css("display", "none")
|
|
}
|
|
});
|
|
}
|
|
</script>
|
|
<script
|
|
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAJnZ1CoEUX425C20aqzFw4dYxFL_LfThk&libraries=places">
|
|
</script>
|
|
<script src="../Metronic/assets/global/plugins/jquery-minicolors/jquery.minicolors.min.js"></script>
|
|
<script src="../Metronic/assets/global/plugins/jquery-minicolors/components-color-pickers.min.js"></script>
|
|
</asp:Content>
|
|
|