<!DOCTYPE html>
<?php
ob_start();
?>
<html>
<head>
<!--*Falta revisar ortografia y gramatica
*Falta hacer Funcional el formulario
*Falta crear pagina de destino-->
<title>Nuevo Reporte | PtPlanet</title>
<link rel="stylesheet" type="text/css" href="tools/w3.css">
<style type="text/css">
html, body{
background: rgb(239, 236, 242);
background-image: url(images/fondo.png);
}
#logo{
width: 272px;
}
@media(max-width: 100%;){
#logo{
width: 100%;
}
}
#map_canvas{
width: 100%;
height: 400px;
margin-top: 10px;
margin-bottom: 30px;
border:1px solid gray;
}
input[data-readonly]{
pointer-events: none;
}
</style>
<script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAjU0EJWnWPMv7oQ-jjS7dYxSPW5CJgpdgO_s4yyMovOaVh_KvvhSfpvagV18eOyDWu7VytS6Bi1CWxw"type="text/javascript"></script>
<script type="text/javascript">
var map = null;
var geocoder = null;
function initialize() {
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("map_canvas"));
map.setCenter(new GLatLng(37.4419, -122.1419), 1);
map.setUIToDefault();
geocoder = new GClientGeocoder();
}
}
function showAddress(address) {
if (geocoder) {
geocoder.getLatLng(
address,
function(point) {
if (!point) {
alert(address + " not found");
} else {
map.setCenter(point, 15);
var marker = new GMarker(point, {draggable: true});
map.addOverlay(marker);
GEvent.addListener(marker, "dragend", function() {
marker.openInfoWindowHtml(marker.getLatLng().toUrlValue(6));
var lat = map.getCenter().lat();
var lng = map.getCenter().lng();
document.getElementById('latitud').value = lat;
document.getElementById('longitud').value = lng;
});
GEvent.addListener(marker, "click", function() {
marker.openInfoWindowHtml(marker.getLatLng().toUrlValue(6));
var lat = map.getCenter().lat();
var lng = map.getCenter().lng();
document.getElementById('latitud').value = lat;
document.getElementById('longitud').value = lng;
});
GEvent.trigger(marker, "click");
}
}
);
}
}
</script>
</head>
<body onload="initialize()" onunload="GUnload()">
<div id="toolbar" class="w3-card w3-white">
<div class="w3-container">
<image class="w3-padding" id="logo" src="images/logo.png"/>
</div>
<ul class="w3-navbar w3-large w3-white w3-text-grey w3-left-align">
<li class="w3-hide-medium w3-hide-large w3-white w3-opennav w3-right">
<a href="javascript:void(0);" onclick="myFunction()">☰</a>
</li>
<li><a href="index.html">Inicio</a></li>
<li class="w3-hide-small"><a href="#">Nuevo reporte</a></li>
<li class="w3-hide-small"><a href="donar.html">Donar</a></li>
<li class="w3-hide-small"><a href="segui.html">Seguimiento</a></li>
<li class="w3-hide-small"><a href="faq.html">Preguntas Frecuentes</a></li>
</ul>
<div id="demo" class="w3-hide w3-hide-large w3-hide-medium">
<ul class="w3-navbar w3-text-grey w3-left-align w3-large w3-white">
<li><a href="#">Nuevo Reporte</a></li>
<li><a href="donar.html">Donar</a></li>
<li><a href="segui.html">Seguimiento</a></li>
<li><a href="faq.html">Preguntas Frecuentes</a></li>
</ul>
</div>
</div>
<div class="w3-container w3-leftbar w3-white w3-card-4 w3-margin-8 w3-large">
<p><i>Si eres testigo de una daño hacia el medio ambiente <b>REPORTALO!</b>.</i></p>
</div>
<div class="w3-row-padding">
<div class="w3-half w3-card-4 w3-border w3-white">
<div class="w3-padding">
<h2><b>Paso 1</b></h2>
<div class="w3-container">
<form action="#" onsubmit="showAddress(this.address.value); return false">
<p class="w3-label">
Ingrese la direccion del lugar del delito(si la direccion no se encuentra ingrese una aproximada).
</p>
<p>
<input type="text" class="w3-input w3-border w3-sand" name="address" value="1600 Amphitheatre Pky, Mountain View, CA" />
<input type="submit" class="w3-btn w3-blue w3-right" value="Buscar!" />
</p>
<p class="w3-label">Puede arrastrar el marcador hacia la ubicacion exacta.</p>
<div id="map_canvas"></div>
<small class="w3-label w3-text-black w3-right">Mapa proporcionado por <i>Goolge maps.</i></small>
</form>
</div>
</div>
</div>
<div class="w3-half w3-card-4 w3-border w3-white">
<div class="w3-padding">
<h2><b>Paso 2</b></h2>
<h6 class="w3-text-grey">Rellena los siguientes campos con la informacion de tu denuncia.</h6>
<form action="" method="post" enctype="multipart/form-data">
<label class="w3-label w3-text-brown">Titulo del Reporte:</label>
<input type="text" class="w3-margin-4 w3-input w3-border w3-sand" name="title" required>
<label class="w3-label w3-text-brown">Tipo de daño:</label>
<select list="tipo" class="w3-select w3-margin-4 w3-border w3-sand" name="tipo" required>
<datalist id="tipo">
<option value="" disabled selected>Seleccione una opcion.</option>
<option value="1">Contaminacion.</option>
<option value="2">Tala de arboles.</option>
<option value="3">Maltrato Animal.</option>
<option value="4">Trafico de animales.</option>
<option value="5">Incendio Forestal.</option>
<option value="6">Desperdicio de Agua.</option>
<option value="7">Otro.</option>
</datalist>
</select>
<label class="w3-label w3-text-brown" title="Para obtener la latitud, ubique en el mapa el lugar del delito.">Latitud:</label>
<input type="text" style="width:100%;" title="Para obtener la latitud, ubique en el mapa el lugar del delito." id="latitud" class="w3-margin-4 w3-input w3-border w3-sand" name="latitud" value="kdjfd" onfocus="blur();" required>
<label class="w3-label w3-text-brown" title="Para obtener la longitud, ubique en el mapa el lugar del delito.">Longitud:</label>
<input type="text" style="width:100%;" title="Para obtener la longitud, ubique en el mapa el lugar del delito." id="longitud" class="w3-margin-4 w3-input w3-border w3-sand" name="longitud" value="ldkfd" onfocus="blur();" required>
<label class="w3-label w3-text-brown">Descripcion:</label>
<textarea class="w3-input w3-border w3-sand w3-margin-4" name="description" required></textarea>
<label class="w3-label w3-text-brown">Imagenes(<small><i>Si es que las tiene</i></small>):</label>
<input type="file" name="img1" class="w3-input w3-sand w3-border w3-margin-4">
<input type="file" name="img2" class="w3-input w3-sand w3-border w3-margin-4">
<input type="file" name="img3" class="w3-input w3-sand w3-border w3-margin-4">
<label class="w3-label w3-text-brown">Aque otras instancias a notificado(<small>separe con una coma</small>):</label>
<input type="text" class="w3-input w3-border w3-margin-4 w3-sand" name="estancias">
<input type="submit" name="submit" class="w3-btn w3-grey w3-margin-8" value="Enviar Reporte">
<center><h6><b>Recuerda TU DENUNCIA ES ANONIMA!</b></h6></center>
</form>
</div>
</div>
</div>
<footer class="w3-container w3-white w3-card-4 w3-margin-8">
<h5><b>Pt Planet</b></h5>
<p>Protection the Planet es un servicio ofrecido por <i>OVC studio</i>.</p>
</footer>
<script>
function myFunction() {
document.getElementById("demo").classList.toggle("w3-show");
}
</script>
<?php
if(isset($_POST['submit'])){
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "ptplanet";
// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
$title = $_POST['title'];
$tipo = $_POST['tipo'];
$lat = $_POST['latitud'];
$lng = $_POST['longitud'];
$desc = $_POST['description'];
$img1 = $_POST['img1'];
$img2 = $_POST['img2'];
$img3 = $_POST['img3'];
$estancias = $_POST['estancias'];
$fecha = date("Y-m-d");
$caracteres = "1234567890abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ"; //posibles caracteres a usar
$numerodeletras=10; //numero de letras para generar el texto
$code = ""; //variable para almacenar la cadena generada
for($i=0;$i<$numerodeletras;$i++)
{
$code .= substr($caracteres,rand(0,strlen($caracteres)),1); /*Extraemos 1 caracter de los caracteres
entre el rango 0 a Numero de letras que tiene la cadena */
}
$sql = "INSERT INTO reports (code_segui, title, tipo, latitud, longitud, description, img1, img2, img3, estancias, fecha) VALUES ('$code', '$title', '$tipo', '$lat', '$lng', '$desc', '$img1', '$img2', '$img3', '$estancias', '$fecha')";
if ($conn->query($sql) === TRUE) {
$dirmake = mkdir("reports/$code", 0777);
header('Location:reports_send.php?c='.$code);
ob_end_flush();
} else {
echo "Error: " . $sql . "<br>" . $conn->error;
}
$conn->close();
}
?>
</body>
</html>