<?php
include("conexion.php");
$conexion =new MySQLi($host,$user,$pw,$bd)or die("Problema con el host");
$resultado = mysqli_query($conexion,"SELECT * FROM productos"); //Consulta select para seleccionar datos

 while ($fila = mysqli_fetch_array($resultado)) //Recorro todos los proyectos y los asigno a la variable $fila
 {//En la parte de abajo Al frente de la variable fila coloco unos corchetes asi []
 // Dentro de esos corchetes especifico el nombre que quiero que coloque
   //Esto depende del nombre de la fila en la Base de datos
   //En mi base de datos tengo id, nombreproyecto y nombreintegrantes.

//En las lineas siguientes comparo el numero id de distribuidor para despues traer el nombre y colocarlo
//Antes salia el numero id y se colocaba en la tabla, pero no sabia que distribuidor o lugar era solo aparecia
//un numero, por eso es que comparo el id busco en la tabla y traigo el nombre
$result = mysqli_query($conexion,"SELECT marca FROM distribuidor WHERE id_distribuidor='$fila[id_distribuidor]'");
$row = mysqli_fetch_assoc($result);//Como es un array toca con este metodo"mysqli_fetch_assoc($result)" para almacenar la Variable
$distribuidor=$row['marca'];//Guardo la Variable del array a otra, para que no me salga error STRING algo...

$resulta = mysqli_query($conexion,"SELECT nombre_ubicacion FROM lugar WHERE id_lugar='$fila[id_lugar]'");
$row = mysqli_fetch_assoc($resulta);
$lugar=$row['nombre_ubicacion'];

 echo "<tr class='pro'>";
 echo "<td>$fila[id_productos]</td>
 <td>$fila[detalle]</td>
 <td>$fila[precio_entrada]</td>
 <td>$fila[precio_salida]</td>
 <td>$fila[cantidad]</td>
 <td>$fila[iva]</td>
 <td>$fila[fecha_ingreso]</td>
 <td>$fila[fecha_vencimiento]</td>
 <td>$lugar</td>
 <td>$fila[estado]</td>
 <td>$distribuidor</td>";
 echo "<tr>";
}
 ?>

<div class="col-md-12 tablaproductos">

                     <table> <!-- Tabla para mostrar los Productos -->

                        <tr> <!-- Columna de titulos -->
                           <th width="60px"><b>Id</b></th><!-- Filas con titulos -->
                           <th width="300px"><b>Nombre</b></th>
                           <th width="300px"><b>Precio Entrada</b></th>
                           <th width="300px"><b>Precio salida</b></th>
                           <th width="300px"><b>Cantidad</b></th>
                           <th width="300px"><b>Iva</b></th>
                           <th width="300px"><b>Fecha Ingreso</b></th>
                           <th width="300px"><b>Fecha Vencimiento</b></th>
                           <th width="300px"><b>Lugar</b></th>
                           <th width="300px"><b>Estado</b></th>
                           <th width="300px"><b>Distribuidor</b></th>
                        </tr>

                        <tbody class="tablaproductosinfo">
                        <?php
                           include("traerproducto.php"); // Traigo la tabla. OJO no sirve el btn elimnar
                        ?>
                        </tbody>

                     </table>

               </div>

$(".tablaproductosinfo tr").on("contextmenu", function(e){ //Cuando haga click derecho sobre la tablaproductos,

   id= $(this).find('td').eq(0).html(); // Asi captura un array de los elementos de selecciono en td en la posicion 0
   nombre= $(this).find('td').eq(1).html(); // Asi captura un array de los elementos de selecciono en td en la posicion 1
   pentrada = $(this).find('td').eq(2).html();//Precio entrada
   psalida= $(this).find('td').eq(3).html();//Precio salida
   cantidad = $(this).find('td').eq(4).html();
   iva = $(this).find('td').eq(5).html();
   fingreso= $(this).find('td').eq(6).html();//Fecha Ingreso
   fvencimineto = $(this).find('td').eq(7).html();//Fecha vencimientos
   lugar = $(this).find('td').eq(8).html();
   estado= $(this).find('td').eq(9).html();
   distribuidor = $(this).find('td').eq(10).html();

   // alert("Esto que es "+ id);
   // alert("SOLICITO.....x: "+e.pageX+" y: "+e.pageY);  Este alert es para ver las cordenadas en x y y del clik derecho

   //En la siguienes variables capturo alto y ancho de la tabla y del menu, con el fin de ubicar de una manera correcta
   // el menu. Porque tenia problemas al dar click en un esquina de la tabla provocando que el menu dañara el esquema de la
   // web, genraba sroll, porque mostraba el menu corrido. Debido a eso me toco hacer un algoritmo para evitar eso
   // me toco sumar la altura los dos container que estaban arriba de la tabla(logo y herramientas). porque eso genereba
   // que la cordenada y del menu apareciera muy arriba.

   var anchotablaproductos = $(".tablaproductos").width(); //Capturo el ancho de la tabla
   var altotablaproductos = $(".tablaproductos").height(); // Capturo el alto de la tabla
   var anchomenu = $("#menucliderecho").width(); // Capturo el ancho del menu
   var altomenu = $("#menucliderecho").height();// Capturo el alto del menu
   var altologo=$(".logo").height();// Capturo el alto del logo
   var altoherramientas=$(".herramientas").height();// Capturo el alto de herramientas
   var sumaaltos= altologo+altoherramientas+10; //Ese 30 son los margenes de logo, herramientas y titulo-principal
   var pasoeny = altotablaproductos+sumaaltos; // ACA LE RESTO A LA TABLA EL ALTO DEL MENU
   // SIN LA SUMA + SUMAALTOS EL MENU ME APARECIA MUY ARRIBA, ES POR ESO QUE DECIDO TRAER LA ALTURA DE LOS CONTENEDORES DE arriba
   // Una vez sumada la posicion del menu sale correcta
   var pasoenx = anchotablaproductos+35; //Aca solo le asigno el ancho de la tabla para que no se salga de la tabla. NOSE COMO ??? ajjajaja

   // ACA VERIFICO SI AL DARLE CLICK SE PASO DE LOS LIMITES, Y HAGO QUE NO ROMPA LA web
   // Si este algoritmo el menu se mostraba rompiendo la web

   if (e.pageY>pasoeny && e.pageX>pasoenx) // Si se paso en X y en Y
   {
      // alert("Se paso en X y Y ohhh my god tio");
      $("#menucliderecho").css({'display':'block', 'left':pasoenx, 'top':pasoeny, 'background-color':'orange'});
   }

   else if (e.pageX>pasoenx)//Si se pasa en y ponga el menu mas arriba
      {
         // alert("Se paso en X tio");
         $("#menucliderecho").css({'display':'block', 'left':pasoenx, 'top':e.pageY, 'background-color':'red'});
      }
         else if (e.pageY>pasoeny) //Si se pasa en y ponga el menu mas arriba
               {
               // alert("Se paso en Y tio");
               $("#menucliderecho").css({'display':'block', 'left':e.pageX, 'top':pasoeny, 'background-color':'red'});
               }
               else //Si no pasa nada coloquelo normarl, en posicion que solicito el usuario
               {
               // alert("No se  paso tio");
               $("#menucliderecho").css({'display':'block', 'left':e.pageX, 'top':e.pageY, 'background-color':'green'});
               }

               //  alert('TABLA_INFO.....el ancho es '+anchotablaproductos+ ' el alto es '+altotablaproductos );
               //  alert('MENU_INFO.....el ancho es '+anchomenu+ ' el alto es '+altomenu );

   });

//Con estas variables verifico que opcion selecciono el usuario
var menuId = "menucliderecho";
var menu = $("#"+menuId);

//Si selecciono un opcion de menu contextal haga las siguientes funciones
$("#menucliderecho").click(function(e){
   //Si no selecciono ninguna opcion NO PASA NADA
   if(e.target.className == "disabled"){
        return false;
   }
   //si esta activada, gestionamos cada una y sus acciones
   // OPciones para elegir del menu
   else{
        switch(e.target.id){
            case "Eliminar":
                var eliminarproducto=confirm('Seguro que quiere eliminar: ' + nombre );

               if (eliminarproducto==true) { // Si presiona que si hace la funcio  Ajax que hize para borrar
                  alert("Presiono que siiiiiiii para eliminar");
                  var parametros =
                  {
                     'borrar'   : id
                  }
                  $.ajax({
                    type        : 'POST',          //Tipo de dato, Aqui va POST o GET
                    url         : 'borrar.php',      // Url de archovo.php
                    data        :  parametros,     // Esta esla variable JSON donde estan todos los archivos

                    success: function (data) { // success me informa que cuando todo se halla echo que hago
                     // document.getElementById("respuesta").innerHTML = "bien Hecho";
                     alert("Se acaba de borrar:"+id+"..."+nombre+"..esto es data:  "+data);
                     $(".tablaproductosinfo").load("traerproducto.php"); // Recargo la tabla, trayendo en archivo donde esta la tabla
                    },
                    error: function (r) {
                     //   document.getElementById(".respuesta").innerHTML = "MAL Hecho";
                        alert("Error del servidor");
                     }
                  });
               }
               else {
                  alert("Presiono que noooooooo para eliminar");
               }
                break;
            case "Editar":
                  

                break;
            }
   
   }
});