Archivo

Archivo para la categoría ‘Talleres’

Subidor de Imagenes (Tercera parte): Subir y miniaturizar

Jueves, 25 de Septiembre de 2008

Bueno seguimos con lo del ultimo día. Ahora lo que nos queda hacer es el controlador que se ocupe de subir nuestro fichero en el servidor y luego cree una imagen en miniatura de esta (thumbnail).

Como ya dije en el articulo anterior, usaremos estas dos librerías: File Uploading Class y Image Manipulation Class.

Al ser un solo formulario lo haremos todo en una misma función del controlador. Para empezar necesitaremos subir el archivo al servidor y a su vez almacenar la información en la base de datos:

				$config['upload_path'] = './uploads/';
				$config['allowed_types'] = 'gif|jpg|png';
				$config['max_size']	= '5000';
				$config['encrypt_name'] = TRUE;

				$this->load->library('upload', $config);

				if(!$this->upload->do_upload("imagen"))
				{
					echo $this->upload->display_errors();
				}
				else
				{
					$data = $this->upload->data();
					$this->db->query("INSERT INTO `imagenes` (`imagen`, `fecha`, `ip`) VALUES (?, ?, ?)", array($data['file_name'], time(), $_SERVER['REMOTE_ADDR']));

Como veis es muy fácil de usar, hay que especificar las distintas opciones que queremos en el array config (hay mas opciones disponibles en la guía de usuario de CI). Le pasamos el “name” input del formulario para subir la imagen en la función “do_upload”. Y luego simplemente añadir un registro en la base de datos con la información que nos da “$this->upload->data()”;

Ahora necesitaremos que a partir de esta imagen se cree un thumbnail, lo haremos así:
Leer más…

Lagarto CodeIgniter, Subidor de imagenes , , , , , ,

Subidor de Imagenes (Segunda parte): Base de datos y vistas

Jueves, 18 de Septiembre de 2008

Como siempre, el taller para esta aplicación ira enfocado a conseguir una idea o noción básica sobre el tema, es decir yo os doy una base para que podáis trabajarla y ampliarla según vuestras necesidades.

Dicho esto empezaremos creando la tabla de la base de datos que necesitaremos, como he dicho todo muy simplificado. Necesitaremos un campo que nos diga el nombre de la imagen, otro de ID, uno de fecha y otro de IP para saber desde donde nos suben esas imágenes, por si hubiese abuso esta sería una buena medida de controlarlo.

CREATE TABLE IF NOT EXISTS `imagenes` (
  `id` int(11) NOT NULL auto_increment,
  `imagen` char(255) NOT NULL,
  `fecha` int(11) NOT NULL,
  `ip` char(20) NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=MyISAM  DEFAULT CHARSET=utf8;

Como veis es todo bastante simple. Podríais añadir campos como el nombre original de la imagen (dado que vamos a modificar su nombre por un hash), tamaño, en caso de que lo hagáis con usuarios pues la ID del usuario y un largo etcétera.

Después de crear la base de datos necesitaremos tener las vistas, es decir lo que el usuario verá. Primero crearemos el formulario para subir la imagen, muy simple, con un simple campo de archivo para que nos suban la imagen.

<fieldset>
	<legend>Subir imagen</legend>
	<form action="index.php/imagenes/index/do" method="post" enctype="multipart/form-data">
		<label for="imagen">Imagen</label>
        <input type="file" name="imagen" id="imagen" />
        <br />
        <label></label>
        <input type="submit" value="Subir" />
	</form>
</fieldset>

Luego crearemos la vista donde se informara al usuario del éxito al subir su fichero y la típica información como podría ser el link, el código para los foros (BBCode) para incluir la imagen con su miniatura, etc..

<p><strong>Tu imagen se ha subido correctamente!</strong></p>
<p>
	<strong>Link de tu imagen</strong>
    <br />
    <a href="<?=base_url();?>uploads/< ?=$file_name?>">< ?=base_url();?>uploads/< ?=$file_name?></a>
</p>
<p>
	<strong>Para foro</strong>
    <br />
    <textarea cols="50" rows="5">[url=< ?=base_url();?>uploads/< ?=$file_name?>][img]< ?=base_url();?>uploads/< ?=$file_name?>[/img][/url]</textarea>
</p>
<p>
	<strong>Para foro con miniatura</strong>
    <br />
    <a href="<?=base_url();?>uploads/< ?=$file_name?>"><img src="<?=base_url();?/>uploads/< ?=$raw_name?>_thumb< ?=$file_ext?>" /></a>
    <br />
    <textarea cols="50" rows="5">[url=< ?=base_url();?>uploads/< ?=$file_name?>][img]< ?=base_url();?>uploads/< ?=$raw_name?>_thumb< ?=$file_ext?>[/img][/url]</textarea>
</p>

Como veréis, uso algunas variables como $file_name que son un array de variables que nos devolverá la función de UPLOAD (subir el fichero) de la librería de CodeIgniter, por el momento os lo creéis y lo veremos en el siguiente artículo. Aun así si queréis ver que variables se nos devuelven y como funciona por encima la librería podéis verlo aquí.

Hasta la siguiente parte ;)

Lagarto Subidor de imagenes , , , , ,

Subidor de Imagenes (Primera parte): Planificación

Martes, 16 de Septiembre de 2008

Hay muchas veces que no se me ocurren ideas para publicar artículos de la nada, sino que cuando estoy trabajando en alguna aplicación para mí o para asuntos profesionales pienso: “anda! esto quizá le interesa a alguien que lea el blog”.

Últimamente veo que esta muy de moda páginas como ImagesHack o Photobucket que son páginas que simplemente dejan al usuario subir una imagen de su ordenador a uno de los servidores para que luego se pueda mostrar a cualquier otra persona, normalmente se suele usar para foros y sitios públicos de este tipo.

Así que todo esto me viene muy bien para introduciros dos clases muy importantes en el CodeIgniter: File Uploading Class, que es la que nos ayudará a subir la imagen, controlar todos los parámetros de esta acción y demás. La segunda clase será la Image Manipulation que nos permitirá en este caso crear un thumbnail (una imagen en miniatura) de la versión original para mejor inserción en foros y otros sitios.

La aplicación será muy sencilla y constará de dos grandes pasos:

  • Subir y tratar la imagen
  • Mostrar el link, el bbccode para los foros, etc..

Pues de momento lo dejaré aquí y el próximo articulo empezaremos con el sistema en cuestión. Si queréis venir preparados “a clase”, iros mirando esas dos librerías que son las que usaremos básicamente.

Hasta pronto.

Lagarto CodeIgniter, Subidor de imagenes , , , , ,

Sistema de Usuarios (Tercera parte): Usando la clase

Sábado, 9 de Agosto de 2008

Siguiendo la clase anterior (dónde construimos la clase Centinela), hoy toca acabar el sistema, creando la interfaz web para que los usuarios puedan registrarse, loguearse, desloguearse y acceder (o no) a secciones privadas.

Antes de empezar, deberíamos tocar algo de la configuración: ya que la clase centinela la cargaremos en la gran mayoría de veces, le diremos que nos la cargue siempre para mayor comodidad. Por lo que iremos a config/autoload.php y pondremos algo así como:

/*
| -------------------------------------------------------------------
|  Auto-load Libraries
| -------------------------------------------------------------------
| These are the classes located in the system/libraries folder
| or in your system/application/libraries folder.
|
| Prototype:
|
|	$autoload['libraries'] = array('database', 'session', 'xmlrpc');
*/

$autoload['libraries'] = array('database', 'session', 'centinela');

Una vez tenemos hecho esto, procederemos a crear las diferentes partes de la web dónde usaremos la clase.
Leer más…

Lagarto CodeIgniter, Sistema de usuarios , , , , , , , , ,

Sistema de Usuarios (Segunda parte): Clase ‘Centinela’ II

Jueves, 17 de Julio de 2008

Ahora procederemos a la parte mas importante de este tutorial dónde codificaremos las funciones de login, logout y check (comprobar), que explique a grandes rasgos como funcionarían en el articulo anterior.

Login

La función de login recibirá dos parámetros: usuario y contraseña que normalmente serán los que el usuario nos introduzca mediante un formulario. Pero también se usará para validarse automáticamente mediante las variables SESSION que tendremos almacenadas, asi siempre comprobaremos que las credenciales de los usuarios son siempre validas.

Entonces procederemos a comprobar que el usuario y la contraseña coinciden con la base de datos, si todo esta correcto crearemos las variables sesión (o las actualizaremos).

Aquí esta el código: Leer más…

Lagarto CodeIgniter, Sistema de usuarios , , , , , , ,

Gestor de noticias (Sexta parte): Crear un buscador

Lunes, 30 de Junio de 2008

Aprovechando la aplicación que estamos creando del Gestor de Noticias, voy a intentar satisfacer algunas peticiones de algunos usuarios que me preguntan cómo hacer un buscador en CodeIgniter (aunque en PHP es lo mismo ya que para esto apenas uso nada de CodeIgniter).

Antes de empezar la explicación aclarar que lo que lo que estoy haciendo es un buscador muy simple y funcional, el hacer un buscador tiene muchos caminos y complicaciones extras pero no entraré en ello, al menos hoy, así que si estáis buscando cómo hacer un buscador completo y complejo este no es vuestro articulo, aquí vamos a tratarlo desde un punto de vista de iniciación.

Primero de todo necesitaremos crear unos índices FULLTEXT en nuestra base de datos para que podamos realizar bien la búsqueda con la sintaxis MATCH…AGAINST, para ello lo haremos con este código SQL:

ALTER TABLE `noticias` ADD FULLTEXT(`titulo`, `cuerpo`);

Leer más…

Lagarto CodeIgniter, Gestor de noticias , , , , , , , , ,

Sistema de Usuarios (Segunda parte): Clase ‘Centinela’ I

Domingo, 15 de Junio de 2008

En la primera publicación de este taller planificamos de forma muy genérica como queríamos nuestro sistema de usuarios. Hoy vamos a concretar un poco más y empezaremos a definir como sera nuestra clase ‘Centinela’ que se encargará de controlar nuestro sistema.

Nuestra ‘clase’, será una librería por lo tanto nos miraremos en la fantástica guía de CodeIgniter cómo funcionan las librerías. En definitiva lo que nos interesa es que alojaremos nuestro “Centinela.php” en application/libraries. Nuestro archivo empezará con una mayúscula. Al principio de nuestro php pondremos para que no puedan acceder de manera no controlada a nuestra clase:

	if(!defined('BASEPATH'))
		exit('No direct script access allowed');

Nuestra clase necesitará de unas variables para que podamos almacenar los datos que usaremos:

  • id: será la id de nuestro usuario un valor numerico y único.
  • nick: será el nombre de nuestro usuario.
  • clave: será la contraseña de nuestro usuario (encriptada)
  • nivel: se refiere al nivel del usuario (invitado, operador, administrador, etc..). Como mayor sea el valor más alto será el cargo.
  • auth: será una variable booleana. Si vale “TRUE”, es que el usuario estará bien autentificado.

Leer más…

Lagarto CodeIgniter, Sistema de usuarios , , , , , ,

Sistema de Usuarios (Primera parte): Planificación y estructuras

Domingo, 8 de Junio de 2008

Un elemento siempre importante en una web es el sistema de autentificación, es decir un sistema de control de usuarios, con login, registro de usuarios y todo esto. A diferencia de otros frameworks en PHP, CodeIgniter no tiene uno por defecto así que lo mejor es crear uno suficientemente “genérico” para que nos sirva en todas nuestra aplicaciones.

Nota: si es vuestra primera toma de contacto con CodeIgniter os recomiendo que probéis primero con el Gestor de Noticias, ya que en este tutorial no repetiré aquellas cosas que ya expliqué en ese otro.

En este sistema introduciremos:

  • Crear librerías en CodeIgniter
  • Usar la Session Class
  • Trabajar con el Cookie Helper
  • Enviar emails con Email Class
  • Y seguramente alguna cosa más que ira surgiendo a medida que avancemos.

Leer más…

Lagarto Sistema de usuarios , , , , , , , , , , , ,

Gestor de noticias (Quinta parte): Paginación

Miércoles, 28 de Mayo de 2008

Bueno hoy dedicaré esté post a la paginación en CodeIgniter, ya que es un tema que para una cosa o para otra siempre acaba saliendo y acabamos con un quebradero de cabeza monumental cuando intentamos crear una buena paginación.

Cómo toda aplicación web típica, CodeIgniter nos plantea una solución, así que siempre haced uso de su guía y buscad lo que os haga falta, que os aseguro que la mayor parte del tiempo lo encontraréis. En este caso haremos uso de la “Pagination Class“.

[DEMO] Podéis ver aquí cómo quedará todo después de lo que os explicaré a continuación.

Ojo: si veis que no hay ninguna noticia puesta, probad de añadirlas con el link que hay ya que en un post anterior puse el scaffolding para testear y es posible que alguien lo haya borrado para probarlo.

Para usar la paginación en nuestra web necesitaremos proceder en 3 pasos:

  1. En el controlador: cargar la librería con la configuración que deseemos.
  2. Modificar la consulta de la base de datos para que nos muestre sólo una parte en vez de todos los resultados.
  3. Añadir los enlaces (los números) para que el usuario pueda navegar a través de las páginas generadas.

Leer más…

Lagarto CodeIgniter, Gestor de noticias , , , , ,

Gestor de noticias (Cuarta parte): Formularios y validación

Sábado, 10 de Mayo de 2008

El otro día, en la tercera parte de estos tutoriales os enseñé lo que era el scaffolding y como nos servía para testear rápidamente nuestra aplicaciones, pero realmente no sirve como una herramienta de administración, así que para ello deberemos crear un formulario que nos permita añadir nuevas noticias a la web.

Para ello necesitaremos:

  1. Formulario para añadir los datos
  2. Código que nos valide que los datos del formulario son correctos
  3. Código que nos añada lo que recogemos del “1″ a la base de datos.

Leer más…

Lagarto CodeIgniter, Gestor de noticias , , , , , , ,