Archivo

Archivo para la categoría ‘Subidor de imagenes’

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 , , , , ,