SmartGeeks: mayo 2020

domingo, 24 de mayo de 2020

Como conectarse a una base de datos con Kotlin, Volley y Arreglos JSON

Video:

Codigo Android Kotlin

val tvResultado = findViewById<TextView>(R.id.tvResultado)
val queue = Volley.newRequestQueue(this)
val url = "http://192.168.1.69/proyectoandroid/listaProductos.php"val stringRequest = StringRequest(Request.Method.GET,url, Response.Listener { response ->    val jsonArray = JSONArray(response)
    for(i in 0 until jsonArray.length()){
        val jsonObject = JSONObject(jsonArray.getString(i))
        var text = jsonObject.get("nombreproducto")
        tvResultado.text = text.toString()
        Toast.makeText(applicationContext,text.toString(),Toast.LENGTH_LONG).show()
    }
},Response.ErrorListener { error ->})
queue.add(stringRequest)

viernes, 22 de mayo de 2020

15. como eliminar un usuario de la base de datos - Curso como hacer un software web con patron MVC, PHP y la plantilla ADMIN LTE

Instrucciones

1. Primero nos aseguraremos que no se puedan registrar dos usuarios iguales, para ello en el input de nuevo usuario colocamos el id nuevoUsuario

2. En el archivo usuarios.js, creamos un bloque de código en el que validamos con ajax si el usuario ya esta registrado

/*=============================================
Validad usuario unico
=============================================*/

$("#nuevoUsuario").change(function(){
$(".alert").remove();
var usuario = $(this).val();
var datos = new FormData();
datos.append("validarUsuario",usuario);
$.ajax({
url:"ajax/usuarios.ajax.php",
method: "POST",
data: datos,
cache:false,
contentType:false,
processData:false,
success:function(respuesta){
console.log("Respuesta",respuesta);
if(respuesta!="false"){
console.log("Respuesta2",respuesta);
$("#nuevoUsuario").parent().after("<div class='alert alert-warning'>Este nombre de usuario ya existe</div>");
$("#nuevoUsuario").val("");
}
}
})
})

3. En el archivo usuarios.ajax.php dentro de la clase creamos la función validar usuario único

/*=============================================
VALIDAR USUARIO UNICO
=============================================*/

public $validarUsuario;

public function ajaxValidarUsuario(){
$item = "usuario";
$valor = $this -> validarUsuario;
$respuesta = ControladorUsuarios::ctrMostrarUsuarios($item,$valor);
echo json_encode($respuesta);

}

4. Fuera de la clase preguntamos que si viene la variable post validarUsuario entonces nos ejecute la función ajaxValidarUsuario

/*=============================================
VALIDAR USUARIO UNICO
=============================================*/

if(isset($_POST['validarUsuario'])){
$validarUsuario = new AjaxUsuarios();
$validarUsuario -> validarUsuario = $_POST['validarUsuario'];
$validarUsuario -> ajaxValidarUsuario();
}

5. En el boton de eliminar usuario se agrega la clase btnEliminarUsuario

6. en el archivo usuarios.js agregamos un bloque de código para eliminar usuario

/*=============================================
Eliminar Usuario
=============================================*/

$(".btnEliminarUsuario").click(function(){

var idUsuario = $(this).attr("idUsuario");
var fotoUsuario = $(this).attr("fotoUsuario");
var usuario = $(this).attr("usuario");

Swal.fire({
title: '¡Estas seguro que deseas eliminar el Usuario?',
text: "Si no es asi puedes presionar el boton cancelar",
icon: 'warning',
showCancelButton: true,
confirmButtonColor: '#3085d6',
cancelButtonColor: '#d33',
confirmButtonText: 'Si, Borrar usuario'
}).then((result) => {
if (result.value) {
window.location = "index.php?ruta=usuarios&idusuario="+idUsuario+"&usuario="+usuario+"&fotousuario="+fotoUsuario;

}
})
})

7. en el archivo usuarios.php al fnal llamamos el controlador borrarUsuario

<?php
$borrarUsuario = new ControladorUsuarios();
$borrarUsuario -> ctrBorrarUsuario();
?>

8. En el archivo usuarios.controlador.php creamos la función ctrBorrarUsuario

static public function ctrBorrarUsuario(){
if(isset($_GET['idusuario'])){
$tabla = "usuarios";
$datos = $_GET['idusuario'];
if($_GET['fotousuario']!=""){
unlink($_GET['fotousuario']);
rmdir("vistas/img/usuarios/".$_GET['usuario']);
}
$respuesta = ModeloUsuarios::mdlBorrarUsuario($tabla,$datos);
if($respuesta=="ok"){
echo"<script>
Swal.fire({
title: 'Success!',
text: '¡El usuario ha sido actualizaddo correctamente!',
icon: 'success',
confirmButtonText:'Ok'
}).then((result)=>{
if(result.value){
window.location = 'usuarios';
}
})
</script>";
}

}
}

9. En el archivo usuarios.modelo.php creamos la funcion mdlBorrarUsuario

static public function mdlBorrarUsuario($tabla,$datos){
$stmt = conexion::conectar()->prepare("DELETE FROM $tabla WHERE id = :id");
$stmt -> bindParam(":id",$datos,PDO::PARAM_STR);
if($stmt->execute()){
return "ok";
}else{
return "error";
}
$stmt -> close();
$stmt = null;

}

lunes, 18 de mayo de 2020

Como hacer un sistema web patron MVC, PHP Admin LTE

Para descargar el proyecto de lo hecho en los videos del 1 al 15 clic

aqui

domingo, 17 de mayo de 2020

Video 14: Como actualizar el estado del usuario y la fecha de ultimo login

Instrucciones

1. Modificamos la tabla para que según el estado del usuario en la base de datos muestre si esta activo o inactivo, agregando la siguiente decisión en php

if($value['estado']!="1"){

echo'<td><button class="btn btn-danger btnprueba btn-xs">Inactivo</button></td>';

}else{

echo'<td><button class="btn btn-success btnprueba btn-xs">Activo</button></td>';

}

2. Se modifica el archivo usuarios.controlador.php de manera que nos pregunte si el usuario esta activo antes de permitirle acceder al sistema, quedando de la siguiente manera

if($respuesta['estado']==1){

$_SESSION['iniciarSesion']="ok";

$_SESSION['nombre']=$respuesta['nombre'];

$_SESSION['usuario']=$respuesta['usuario'];

$_SESSION['foto']=$respuesta['foto'];

$_SESSION['perfil']=$respuesta['perfil'];

echo '<script>

window.location="inicio";

</script>';

}else{

echo("<div class='alert alert-danger'>Usuario inactivo, contacte al administrador del sistema</div>");

}

3. e agrega la clase btnActivar a los botones de activo e inactivo y los atributos estadousuario y idUsuario, quedando de la siguiente manera

if($value['estado']!="1"){

echo'<td><button class="btn btn-danger btnprueba btn-xs btnActivar" idUsuario="'.$value["id"].'" estadoUsuario="1">Inactivo</button></td>';

}else{

echo'<td><button class="btn btn-success btnprueba btn-xs btnActivar" idUsuario="'.$value["id"].'" estadoUsuario="0">Activo</button></td>';

}

4. En el archivo usuarios.js agregamos el siguiente código para que se ejecute cuando presionen uno de los botones

$(".btnActivar").click(function(){

var idUsuario = $(this).attr("idUsuario");

var estadoUsuario = $(this).attr("estadoUsuario");

var datos = new FormData();

datos.append("activarId",idUsuario);

datos.append("activarUsuario",estadoUsuario);

$.ajax({

url:"ajax/usuarios.ajax.php",

method: "POST",

data: datos,

cache:false,

contentType:false,

processData:false,

success:function(respuesta){

}

})

5. Se agrega al archivo usuarios.ajax.php e código para cambiar el estado del usuario en el método ajaxActivarUsuario

dentro de la clase Ajaxusuarios se agrega

/*=============================================

ACTIVAR USUARIO

=============================================*/

public $activarUsuario;

public $activarId;

public function ajaxActivarUsuario(){

$tabla = "usuarios";

$item1 = "estado";

$valor1 =$this -> activarUsuario;

$item2 = "id";

$valor2 =$this -> activarId;

$respuesta = ModeloUsuarios::mdlActualizarUsuario($tabla,$item1,$valor1,$item2,$valor2);

}

Fuera de la clase Ajaxusuarios se agrega

/*=============================================

ACTIVAR USUARIO

=============================================*/

if(isset($_POST['activarUsuario'])){

$activarUsuario = new AjaxUsuarios();

$activarUsuario -> activarUsuario=$_POST['activarUsuario'];

$activarUsuario -> activarId=$_POST['activarId'];

$activarUsuario ->ajaxActivarUsuario();

}

6. Se agrega el método mdlActualizarUsuario en el archivo usuarios.modelo.php

static public function mdlActualizarUsuario($tabla,$item1,$valor1,$item2,$valor2){

$stmt = conexion::conectar()->prepare("UPDATE $tabla SET $item1 = :$item1 WHERE $item2 = :$item2");

$stmt -> bindParam(":".$item1,$valor1,PDO::PARAM_STR);

$stmt -> bindParam(":".$item2,$valor2,PDO::PARAM_STR);

if($stmt->execute()){

return "ok";

}else{

return "error";

}

$stmt ->close();

$stmt = null;

}

7. En el archivo usuarios.controlador en la función ctrIngreso modificamos el código de manera que envíe la fecha de login a la base de datos quedando así

//Fecha de login

date_default_timezone_set("America/Bogota");

$fecha = date("y-m-d");

$hora = date("H:i:s");

$fechaActual = $fecha." ".$hora;

$item1 = "ultimo_login";

$valor1 = $fechaActual;

$item2 = "id";

$valor2 = $respuesta['id'];

$actualizarLogin = ModeloUsuarios::mdlActualizarUsuario($tabla,$item1,$valor1,$item2,$valor2);

if($actualizarLogin=="ok"){

echo '<script>

window.location="inicio";

</script>';

}

8. En el archivo usuarios.php modificamos la linea donde imprimimos el ultimo login, dejándolo así

<td>'.$value['ultimo_login'].'</td>

Vídeo 13. Como hacer un update a un registro en la base de datos

Instrucciones

Creamos una nueva columna Acciones, con dos botones, y al botón de editar lo configuramos para que abra un modal. esto con el siguiente código.

<td>

</div>

</td>

2. Creamos el modal de actualización copiando el miso de agregar usuario pero actualizamos el id, y cambiamos los name de los input quedando así

<h5 class="modal-title" id="exampleModalLabel">Agregar usuario</h5>

</button>

</div>

</div>

</div>

</div>

<option value="Administrador">Administrador</option>

<option value="Vendedor">Vendedor</option>

<option value="Especial">Especial</option>

</select>

</div>

<div class="panel">SUBIRFOTO</div>

<p class="center-block">Peso maximo de la foto 2Mb</p>

</div>

<button type="button" class="btn btn-danger" data-dismiss="modal">Salir</button>

<button type="submit" class="btn btn-primary">Guardar</button>

</div>

<?php

$crearusuario = new ControladorUsuarios();

$crearusuario -> ctrCrearUsuario();

</form>

</div>

3. Previamente se agrego la clase btnEditarUsuario y el parámetro idUsuario en el paso 1

ahora colocamos el siguiente código de js

$(".btnEditarUsuario").click(function(){

var idUsuario = $(this).attr("idUsuario");

console.log("idUsuario",idUsuario);

})

1. 4. verificamos que al presionar un registro nos imprima en la consola el id. Utilizamos ajax para traer los datos de la bd para ello en el archivo usuarios.js dejamos el codigo de la siguiente manera

/*=============================================

EDITAR USUARIO

=============================================*/

$(".btnEditarUsuario").click(function(){

var idUsuario = $(this).attr("idUsuario");

var datos = new FormData();

datos.append("idUsuario", idUsuario);

$.ajax({

url:"ajax/usuarios.ajax.php",

method: "POST",

data: datos,

cache: false,

contentType: false,

processData: false,

dataType: "json",

success: function(respuesta){

console.log("Respuesta",respuesta);

}

});

})

5. Creamos el archivo usuarios.ajax.php en la carpeta ajax en la raiz del proyecto.

require_once "../controladores/usuarios.controlador.php";

require_once "../modelos/usuarios.modelo.php";

class AjaxUsuarios{

/*=============================================

EDITAR USUARIO

=============================================*/

public $idUsuario;

public function ajaxEditarUsuario(){

$item = "id";

$valor = $this->idUsuario;

$respuesta = ControladorUsuarios::ctrMostrarUsuarios($item, $valor);

echo json_encode($respuesta);

}

/*=============================================

EDITAR USUARIO

=============================================*/

if(isset($_POST["idUsuario"])){

$editar = new AjaxUsuarios();

$editar -> idUsuario = $_POST["idUsuario"];

$editar -> ajaxEditarUsuario();

}

6. Probar que en la consola muestre todos los datos del registro seleccionado

agregamos un los id editarNombre, editarPassword, editarPerfil, editarUsuario en e modal de editarUsuario

y en el archivo usuarios.js reemplazamos la linea console.log("Respuesta",respuesta); por lo siguiente

$("#editarNombre").val(respuesta['nombre']);

$("#editarUsuario").val(respuesta['usuario']);

$("#editarPerfil").html(respuesta['perfil']);

if(respuesta['foto']!=""){

$(".previsualizar").attr("src",respuesta['foto']);

}

error : function(respuesta) {

console.log("Error",respuesta);

}

7. Se agrega el un input oculto de password de password de la siguiente manera

7. Se agrega un input oculto debajo de la etiqueta img de la foto de la siguiente manera

8. Se modifica el archivo usuarios.js quedando de la sigiente manera

$("#editarNombre").val(respuesta['nombre']);

$("#editarUsuario").val(respuesta['usuario']);

$("#passwordActual").val(respuesta['password']);

$("#editarPerfil").html(respuesta['perfil']);

$("#editarPerfil").val(respuesta['perfil']);

$("#fotoActual").val(respuesta['foto']);

if(respuesta['foto']!=""){

$(".previsualizar").attr("src",respuesta['foto']);

}

error : function(respuesta) {

console.log("Error",respuesta);

}

9. SE llama la funcion editar usuario del controlador con las siguientes lineas al final del form

<?php

$editarUsuario = new ControladorUsuarios();

$editarUsuario -> ctrEditarUsuario();

10. Se crea el metodo ctrEditarUsuario

}

$tabla = "usuarios";

if($_POST['editarPassword']!=""){

if(preg_match('/^[a-zA-Z0-9]+$/',$_POST['nuevoPassword'])){

$salt = md5($_POST['editarPassword']);

$passwordEncriptado = crypt($_POST['editarPassword'],$salt);

}else{

echo"<script>

Swal.fire({

title: 'Error!',

text: '¡No puedes usar caraceres especiales en el campo contraseña!',

icon: 'error',

confirmButtonText:'Ok'

});

</script>";

}

}else{

$passwordEncriptado = $_POST['passwordActual'];

}

$datos = array("nombre"=>$_POST['editarNombre'],

"usuario"=>$_POST['editarUsuario'],

"password"=>$passwordEncriptado,

"perfil"=>$_POST['editarPerfil'],

"ruta"=>$ruta);

$respuesta = ModeloUsuarios::mdlEditarUsuario($tabla, $datos);

if($respuesta=="ok"){

echo"<script>

Swal.fire({

title: 'Success!',

text: '¡El usuario ha sido actualizaddo correctamente!',

icon: 'success',

confirmButtonText:'Ok'

}).then((result)=>{

if(result.value){

window.location = 'usuarios';

}

})

</script>";

}

}else{

echo"<script>

Swal.fire({

title: 'Error!',

text: '¡No puedes usar caracteres especiales en el campo nombre!',

icon: 'error',

confirmButtonText:'Ok'

})

</script>";

}

11. Se crear el metodo mdlEditarUsuario en usuarios.modelo.php

static public function mdlEditarUsuario($tabla,$datos){

$stmt = conexion::conectar()->prepare("UPDATE $tabla SET nombre=:nombre,password=:password,perfil=:perfil,foto=:foto WHERE usuario=:usuario");

$stmt -> bindParam(":nombre",$datos['nombre'],PDO::PARAM_STR);

$stmt -> bindParam(":usuario",$datos['usuario'],PDO::PARAM_STR);

$stmt -> bindParam(":password",$datos['password'],PDO::PARAM_STR);

$stmt -> bindParam(":perfil",$datos['perfil'],PDO::PARAM_STR);

$stmt -> bindParam(":foto",$datos['ruta'],PDO::PARAM_STR);

if($stmt->execute()){

return "ok";

}else{

return "error";

}

$stmt ->close();

$stmt = null;

}

Video 11 - Como usar las variables de sesion

Instrucciones

Se agregan las variables de sesión al momento de autenticar al usuario en el archivo usuarios.controlador en la función ctrIngreso

$_SESSION['iniciarSesion']="ok";

$_SESSION['nombre']=$respuesta['nombre'];

$_SESSION['usuario']=$respuesta['usuario'];

$_SESSION['foto']=$respuesta['foto'];

$_SESSION['perfil']=$respuesta['perfil'];

2. Se agrega una condición en el archivo menú.php y encabezado.php para que coloque el nombre cuando exista un valor en la variable de sesión nombre

//codigo de menu.php

<?php

if($_SESSION['nombre']!=""){

echo'<a class="d-block">'.$_SESSION['nombre'].'</a></div>';

}else{

echo'<a href="#" class="d-block">Nombre de usuario</a>

</div>';

}

//código para encabezado.php

<?php

if($_SESSION['nombre']!=""){

echo ' <span class="dropdown-item dropdown-header">'.$_SESSION["nombre"].'</span>';

}else{

echo '<span class="dropdown-item dropdown-header">Nombre de Usuario</span>';

}

1. 3. Se realiza una decisión que permita colocar la foto en el menú si la variable de sesión foto no viene vacia,

<?php

if($_SESSION['foto']!=""){

echo '<img src="'.$_SESSION["foto"].'" class="img-circle elevation-2" alt="User Image">';

}else{

echo '<img src="vistas/dist/img/user2-160x160.jpg" class="img-circle elevation-2" alt="User Image">';

}

Video 10 - Como encriptar contraseñas

Video 10 – Encriptar contraseñas

1. En el archivo usuarios.controlador.php modificar en la función ctrCrearUsuario, los valores del password y reemplazarlos por $passwordEncriptado, que resulta de lo siguiente

$salt = md5($_POST['nuevoPassword']);

$passwordEncriptado = crypt($_POST['nuevoPassword'],$salt);

$datos = array("nombre"=>$_POST['nuevoNombre'],

"usuario"=>$_POST['nuevoUsuario'],

"password"=>$passwordEncriptado,

"perfil"=>$_POST['nuevoPerfil'],

"ruta"=>$ruta);

2. En la function ctrIngreso modificar el password de la misma manera

$salt = md5($_POST['nuevoPassword']);

$passwordEncriptado = crypt($_POST['nuevoPassword'],$salt);

$respuesta = ModeloUsuarios::mdlMostrarUsuarios($tabla,$item,$valor);

if($respuesta['usuario']==$_POST['ingUsuario']&&$respuesta['password']==$passwordEncriptado){

jueves, 7 de mayo de 2020

Como guardar una foto en la base de datos con PHP MVC y Admin LTE

Video 9 – Como guardar una foto en la base de datos

Instrucciones

Crear el archivo usuarios.js en la carpeta js/vistas y se vincula al final del archivo plantilla.php Con la línea

Se digita los siguiente en usuarios.js y se verifica en la consola que estén los datos de la imagen

style="height: 55px; width: 580px;

Validar el formato y tamaño de la imagen y colocarla en el img agregando el siguiente código en el archivo usuarios.js Se debe agregar la clase previsualizar en la etiqueta <img> del archivo usuarios.php

$(".nuevaFoto").change(function(){

var imagen = this.files[0];

console.log("imagen",imagen["type"]);

//Validar el tamaño de la imagen

/*=============================================

VALIDAMOS EL FORMATO DE LA IMAGEN SEA JPG O PNG

=============================================*/

if(imagen["type"] != "image/jpeg" && imagen["type"] != "image/png"){

$(".nuevaFoto").val("");

Swal.fire({

title: "Error al subir la imagen",

text: "¡La imagen debe estar en formato JPG o PNG!",

type: "error",

confirmButtonText: "¡Cerrar!"

});

}else if(imagen["size"] > 2000000){

$(".nuevaFoto").val("");

Swal.fire({

title: "Error al subir la imagen",

text: "¡La imagen no debe pesar más de 2MB!",

type: "error",

confirmButtonText: "¡Cerrar!"

});

}else{

var datosImagen = new FileReader;

datosImagen.readAsDataURL(imagen);

$(datosImagen).on("load", function(event){

var rutaImagen = event.target.result;

$(".previsualizar").attr("src", rutaImagen);

})

}

})

Crear la carpeta usuarios dentro de la carpeta vistas dentro de img

Validar la imagen en el archivo usuarios.controlador.php con el siguiente código

if(isset($_FILES['nuevaFoto']['tmp_name'])){

$_FILES se puede imprimir con un var_dump para ver la dirección el archivo temporal

Realizar el recorte de la imagen a 500x500, crear la carpeta y gardar la imagen dependiendo si es jpg o png con el siguiente código

$ruta="";

if(isset($_FILES['nuevaFoto']['tmp_name'])){

list($ancho, $alto) = getimagesize($_FILES['nuevaFoto']['tmp_name']);

$nuevoancho = 500;

$nuevoalto = 500;

//Crear directorio

$directorio = "vistas/img/usuarios/".$_POST['nuevoUsuario'];

mkdir($directorio,0755);

//De acuerdo al tipo de imagen se hace el proceso de recorte de la foto

if($_FILES['nuevaFoto']['type']=="image/jpeg"){

$aleatorio = mt_rand(100,999);

$ruta = $directorio."/".$aleatorio.".jpg";

$origen = imagecreatefromjpeg($_FILES['nuevaFoto']['tmp_name']);

$destino = imagecreatetruecolor($nuevoancho, $nuevoalto);

imagecopyresized($destino, $origen, 0, 0, 0, 0, $nuevoancho, $nuevoalto, $ancho, $alto);

imagejpeg($destino,$ruta);

}

if($_FILES['nuevaFoto']['type']=="image/png"){

$aleatorio = mt_rand(100,999);

$ruta = $directorio."/".$aleatorio.".png";

$origen = imagecreatefrompng($_FILES['nuevaFoto']['tmp_name']);

$destino = imagecreatetruecolor($nuevoancho, $nuevoalto);

imagecopyresized($destino, $origen, 0, 0, 0, 0, $nuevoancho, $nuevoalto, $ancho, $alto);

imagepng($destino,$ruta);

}

Almacenar la url de la foto en la base de datos, se agrega la variable ruta en el array del archivo usuarios.controlador.php quedando de la siguiente manera

stmt = conexion::conectar()->prepare("INSERT INTO $tabla (nombre,usuario,password,perfil,foto) VALUES (:nombre,:usuario,:password,:perfil,:foto)");

$stmt -> bindParam(":nombre",$datos['nombre'],PDO::PARAM_STR);

$stmt -> bindParam(":usuario",$datos['usuario'],PDO::PARAM_STR);

$stmt -> bindParam(":password",$datos['password'],PDO::PARAM_STR);

$stmt -> bindParam(":perfil",$datos['perfil'],PDO::PARAM_STR);

$stmt -> bindParam(":foto",$datos['ruta'],PDO::PARAM_STR);