modelo mvc php

1

ESCUELA TÉCNICA SUPERIOR DE INGENIEROS

INFORMÁTICOS

Metodología Modelo-Vista-Controlador para la

Programación Web en PHP

Málaga, Abril de 2008

ESCUELA TÉCNICA SUPERIOR DE INGENIERÍA INFORMÁTICA

INGENIERO TÉCNICO EN INFORMÁTICA DE SISTEMAS

METODOLOGÍA MODELO-VISTA-CONTROLADOR PARA LA PROGRAMACIÓN WEB EN PHP

Realizado por

ANTONIO J. GONZÁLEZ BONILLA

Dirigido por

FRANCISCO R. VILLATORO MACHUCA

Departamento

DEPARTAMENTO DE LENGUAJES Y CIENCIAS DE LA COMPUTACIÓN

UNIVERSIDAD DE MÁLAGA

MÁLAGA, ABRIL 2008

UNIVERSIDAD DE MÁLAGA

ESCUELA TÉCNICA SUPERIOR DE INGENIERÍA INFORMÁTICA

INGENIERO TÉCNICO EN INFORMÁTICA DE SISTEMAS

Reunido el tribunal examinador en el día de la fecha, constituido por:

Presidente Dº;/Dª.______________________________________________________

Secretario Dº;/Dª.______________________________________________________

Vocal Dº;/Dª. _________________________________________________________

para juzgar el proyecto Fin de Carrera titulado: Metodología Modelo-Vista-Controlador para la Programación Web en PHP del alumno Dº;/Dª. Antonio J. González Bonilla dirigido por Dº;/Dª. Francisco R. Villatoro Machuca ACORDÓ POR ______________________ OTORGAR LA CALIFICACIÓN DE ______________________________ Y PARA QUE CONSTE, SE EXTIENDE FIRMADA POR LOS COMPARECIENTES

DEL TRIBUNAL, LA PRESENTE DILIGENCIA.

Málaga, a _____de _____________________de _______

El Presidente ______________El Secretario______________ El Vocal______________ Fdo: ___________________Fdo:____________________ Fdo:____________________

Índice de Contenidos 1. INTRODUCCIÓN.........................................................................................................1

1.1 INTRODUCCIÓN ...................................................................................................1 1.2 OBJETIVOS............................................................................................................1 1.3 CONTENIDO..........................................................................................................2

2. PROGRAMACIÓN TRADICIONAL............................................................................5

2.1 INTRODUCCIÓN ...................................................................................................5 2.2 CONOCIENDO EL LENGUAJE.............................................................................5 2.3 UN EJEMPLO REAL ..............................................................................................6

3. MODELO VISTA CONTROLADOR .........................................................................15

3.1 INTRODUCCIÓN .................................................................................................15 2.2 DEFINICIÓN [3] ...................................................................................................15

4. HERRAMIENTAS UTILIZADAS ..............................................................................19

4.1 INTRODUCCIÓN .................................................................................................19 4.2 SISTEMAS LAMP ................................................................................................19 4.3 SISTEMA OPERATIVO Y SERVICIOS...............................................................21

4.3.1 Linux...............................................................................................................21 4.3.2 La Distribución Debian 3.1 Sarge....................................................................21 4.3.3 Servidor Web Apache......................................................................................21 4.3.4 Servidor Base de datos PostgreSQL.................................................................22 4.3.5 Servidor Proftpd y otros servicios....................................................................23 4.3.6 Librería de ayuda PHPLib ...............................................................................23 4.3.7 Librería gráfica ImageMagick .........................................................................24 4.3.8 Librería fpdf....................................................................................................24

4.4 LENGUAJES A UTILIZAR ..................................................................................25 4.4.1 PHP.................................................................................................................25 4.4.2 HTML y CSS ..................................................................................................26 4.4.3 Otros lenguajes................................................................................................27

4.5 HERRAMIENTAS DE DESARROLLO................................................................27 4.5.1 phpPgAdmin ...................................................................................................28 4.5.2 Mozilla Firefox vs Internet Explorer................................................................28 4.5.3 NVU, Bluefish, Macromedia Dreamwever… ..................................................29

5. ANÁLISIS DE LA ESTRUCTURA Y FUNCIONAMIENTO DE VARIAS PÁGINAS WEB................................................................................................................................31

5.1 INTRODUCCIÓN .................................................................................................31 5.2 ANÁLISIS ............................................................................................................32

5.2.1 Web Inmobiliaria.............................................................................................32 5.2.2 Tienda on-line .................................................................................................35 5.2.3 Catálogo..........................................................................................................37 5.2.4 Hoteles ............................................................................................................39

5.3 CONCLUSIONES Y ESTRUCTURAS A IMPLEMENTAR.................................42 6. ESTRUCTURA DE DIRECTORIOS...........................................................................44

6.1 Introducción...........................................................................................................44 6.2 Organización del código.........................................................................................44

7. EL FICHERO DE RECURSOS Y LAS ETIQUETAS .................................................52

7.1 INTRODUCCIÓN .................................................................................................52 7.2 RECURSOS Y ETIQUETAS.................................................................................52 7.3 RECURSOS.INC.PHP...........................................................................................52 7.4 ETIQUETAS .........................................................................................................54

8. EL 'FRAMEWORK' Y LA CARPETA 'PLANTILLAS' ..............................................58

8.1 INTRODUCCIÓN .................................................................................................58 8.2 FRAMEWORK .....................................................................................................58 8.3 PLANTILLAS .......................................................................................................60

9. FUNCIONES BÁSICAS .............................................................................................64

9.1 INTRODUCCIÓN .................................................................................................64 9.2 FUNCIONALIDAD DE UN MÓDULO COMÚN.................................................64 9.3 FUNCIONALIDAD DEL MÓDULO DE ACCESO ..............................................65 9.4 LIBRERÍA BÁSICA..............................................................................................66 9.5 DESCRIPCIÓN DE CLASES EN CODIGOCOMUN............................................66

9.5.1 Organización general.......................................................................................66 9.5.3 Conceptos básicos sobre los módulos ..............................................................67 9.5.4 Diagramas de las funciones más comunes........................................................70 9.5.5 Módulo de ejemplo (Noticias) .........................................................................79

10. LIBRERÍA BASE....................................................................................................103

10.1 INTRODUCCIÓN .............................................................................................103 10.2 Clase Control - Control.inc.php ..........................................................................103 10.3 Clase ControlFormAlta – ControlFormAlta.inc.php ...........................................108 10.4 Clase ControlFormBaja – ControlFormBaja.inc.php...........................................109 10.5 Clase ControlFormLocaliza – ControlFormLocaliza.inc.php ..............................110 10.6 Clase ControlListado – ControlListado.inc.php ..................................................110 10.7 Clase ControlDoAlta – ControlDoAlta.inc.php...................................................111 10.8 Clase ControlDoBaja – ControlDoBaja.inc.php..................................................112 10.9 Clase ControlDoLocaliza – ControlDoLocaliza.inc.php .....................................112 10.10 Clase GestionTabla – GestionTabla.inc.php .....................................................113 10.11 Clase GestionListado – GestionListado.inc.php ................................................115 10.12 Clase GestionTablaAlta – GestionTablaAlta.inc.php ........................................117 10.13 Clase GestionTablaBaja – GestionTablaBaja.inc.php .......................................118 10.14 Clase GestionTablaLocaliza – GestionTablaLocaliza.inc.php ...........................119 10.15 Clase ControlLogin – ControlLogin.inc.php .....................................................120 10.16 Clase ControlLogout – ControlLogout.inc.php .................................................120 10.17 Clase TablaHtmlFormulario – TablaHtmlFormulario.inc.php ...........................121 10.18 Clase TablaHtmlListado – TablaHtmlListado.inc.php ......................................122 10.19 Clase FormularioHtml – FormularioHtml.inc.php ............................................123 10.20 Clase FormatoHtml – FormatoHtml.inc.php .....................................................124 10.21 Clase CorreoHtml – CorreoHtml.inc.php..........................................................125 10.22 Clase InfoSesion – InfoSesion.inc.php..............................................................127 10.23 Clase Indice – Indice.inc.php............................................................................127

10.24 Clase ListaMensajes – ListaMensajes.inc.php ..................................................128 10.25 Clase ParametrosCGI – ParametrosCGI.inc.php ...............................................129 10.26 Clase Pila – Pila.inc.php ...................................................................................130 10.27 Clase CheckData – CheckData.inc.php.............................................................130 10.28 Clase FuncionesListado – FuncionesListado.inc.php ........................................131 10.29 Clase Util – Util.inc.php ...................................................................................133 10.30 Clase UtilDb – UtilDb.inc.php..........................................................................134 10.31 Clase GestionPDFInforme – GestionPDFInforme.inc.php ................................135 10.32 Script start – start.php.......................................................................................136 10.33 Clase phplib_local – phplib_local.inc.php ........................................................137 10.34 Clase html_mime_mail – html_mime_mail.inc.php ..........................................137 10.35 Clase fpdf – fpdf.inc.php ..................................................................................137 10.36 Clase csv – csv.inc.php.....................................................................................137

11. WEB DE EJEMPLO: GRUPO DE TÉCNICAS COMPUTACIONALES EN LA INGENIERÍA Y METODOLOGÍA DE TRABAJO ......................................................139

11.1 INTRODUCCIÓN .............................................................................................139 11.2 REQUISITOS INICIALES ................................................................................139 11.3 ANÁLISIS .........................................................................................................140 11.4 MODELO DE DATOS Y DIAGRAMAS ENTIDAD RELACIÓN....................142

11.4.1 Normalización y Optimización ....................................................................142 11.4.2 Diseño de Tablas .........................................................................................142 11.4.3 Diagramas Entidad-Relación .......................................................................146

11.5 METODOLOGÍA DE DESARROLLO..............................................................147 11.6 RESULTADO OBTENIDO – ALGUNAS IMÁGENES....................................150

12. CONCLUSIONES Y LÍNEAS FUTURAS ..............................................................155

12.1 CONCLUSIONES .............................................................................................155 12.2 LINEAS FUTURAS ..........................................................................................155

APENDICE A: MANUAL DE USUARIO ....................................................................157 APENDICE B: CONTENIDO DEL CD ........................................................................167 BIBLIOGRAFÍA...........................................................................................................169

Metodología Modelo-Vista-Controlador para la Programación Web en PHP Introducción

Antonio J. González Bonilla 1

1. INTRODUCCIÓN

1.1 INTRODUCCIÓN

Cada vez son más las empresas que se dedican a la creación de sitios web para Internet y para distintos ámbitos de negocio. Desde simples páginas Web puramente informativas que constan de 4 o 5 secciones con texto y varias imágenes hasta intranets corporativas con administración de usuarios, bases de datos documentales, diferentes permisos para cada usuario, facturación, venta online...

Normalmente todo este software se realiza a medida según las necesidades de los clientes: agencias de viaje, tiendas online, inmobiliarias, software de ERP empresarial… los cuales necesitarán de un equipo de desarrollo preparado, capaz de llevar acabo el proyecto y posteriormente, de mantenerlo y ampliarlo según sus necesidades.

Existe una multitud de lenguajes concebidos o no para Internet. Cada uno de ellos explota más a fondo ciertas características que lo hacen más o menos útiles para desarrollar distintas aplicaciones. En el dominio de la red, los lenguajes de lado del servidor más ampliamente utilizados para el desarrollo de páginas dinámicas son ASP, PHP [1] o JSP. En multitud de proyectos no sólo se usará un lenguaje sino que se mezclarán distintas tecnologías como Javascript + PHP + Ajax + ejecución de procesos en el servidor...

El problema para las empresas desarrolladoras de software web es que la creación de dichas páginas Web no siempre sigue una metodología estándar de análisis y programación, con lo que el proceso de desarrollo, muchas veces obligado por la propia naturaleza de la web, puede resultar repetitivo, lento, poco reutilizable y muy costoso en tiempo y dinero.

En la elaboración de una web, incluso siendo ésta muy similar a cualquier otra realizada anteriormente, podemos vernos obligados a realizarla desde cero, o a tener que volver a escribir gran parte de código y todo por motivo de no utilizar un estándar o modelo de trabajo adecuado que muchas veces, en gran cantidad de empresas de software, es inexistente.

La creación de una web en PHP, que será el lenguaje que utilizaremos para el desarrollo de este proyecto, suele ser bastante lineal, mezclando todo el código HTML [2] (párrafos, enlaces, tablas, imágenes, …) con bloques sueltos de código o incluso con sentencias de selección que incluirán uno u otro código extra que hará una u otra acción; por ello, una librería de módulos básicos de programación, así como un conjunto de directivas o modelo de desarrollo puede ser muy útil para los programadores y empresas del sector facilitando así no solo su labor en el presente sino en el futuro.

1.2 OBJETIVOS El objetivo de este proyecto será la creación de un modelo de programación para

aplicaciones web escritas en PHP. Este modelo sigue una arquitectura MVC [3] (Modelo-



Vista-Controlador) y constará de una serie de librerías o módulos básicos de código, que junto con una metodología de programación adecuada facilitará la creación de una web profesional haciendo que el proceso de desarrollo, mantenimiento y ampliación se haga de forma fácil, rápida y con el menor coste posible.

En nuestra propuesta se tratará de separar todo lo posible el diseño y la

programación de la web haciendo la aplicación mucho más eficiente y fácil de mantener. Normalmente este suele ser el punto más conflictivo en los desarrollos web ya que un desarrollo en el que no se cuide este aspecto será mucho menos mantenible y escalable en el futuro. Con esta separación, se reducirá la cantidad de código a programar y aumentará el nivel de reutilización haciendo más fáciles (y en definitiva posibles) futuras modificaciones e implementación de nuevas funcionalidades.

También se facilitarán las funciones más comunes y repetitivas. Validación de

datos en un nivel superior al que nos puede ofrecer cualquier librería de todo lenguaje de programación, lectura de registros de una base de datos cumpliendo unos requisitos, generación de listados, buscadores, documentos en PDF/EXCEL de un listado de usuarios, o simplemente realizar el proceso de alta de un artículo en nuestra base de datos serán algunas de las funcionalidades que ofreceré, y que sin ninguna duda serán de gran ayuda para cualquier programador web.

Realizar un proyecto web totalmente profesional y de calidad será ahora mucho

más fácil para todo programador del sector. Además, el uso de una librería común como la que crearemos en este proyecto junto con la metodología adecuada a la misma, harán posible que distintas personas, aún sin haber trabajado anteriormente en un determinado proyecto, puedan retomarlo para la corrección de errores, la realización de modificaciones y mejoras o ampliaciones con tan solo haber trabajado anteriormente con el mismo modelo de trabajo.

1.3 CONTENIDO

La memoria de este Proyecto Fin de Carrera está dividida en doce capítulos y tres apéndices. El contenido de cada una de estas partes se resume a continuación.

Tras esta introducción, en el segundo capítulo, se realiza una pequeña introducción para mostrar como se realiza la programación tradicional, la forma en la que actualmente hoy en día se sigue programando con PHP y los problemas y desventajas que ello conlleva. Se expone un pequeño ejemplo real y definimos así el punto de partida para mejorar la forma de trabajar con este lenguaje orientado para la Web.

El capítulo 3 es un capítulo breve en el que se expone qué es el patrón de diseño

Modelo-Vista-Controlador y como intenta, como mejora a la problemática expuesta en el capítulo anterior, aislar las unidades funcionales de aplicaciones interactivas para aprovechar todo lo posible la modularidad que se consigue. Nosotros nos basaremos en ese concepto para realizar un conjunto de librerías que consigan esa modularidad y separen lo máximo posible el diseño de la programación, la vista del modelo y controlador de datos y así mejorar la forma de programar para la Web.



El capítulo 4 se expone en qué consiste un sistema LAMP [4], el cual será nuestro sistema de trabajo; qué sistema operativo y servicios son necesarios para que nuestra aplicación funcione de manera correcta. Además se documentará cual va a ser nuestro lenguaje de programación y alguna de sus características, qué librerías usaremos como apoyo y cuales serán las herramientas que nos ayudarán en el trabajo diario con nuestra librería.

Será en el capítulo 5 donde realizaremos nuestros primeros análisis de cómo se están realizando las páginas Web en Internet [5] y cuales son las características comunes de estas. Nuestro único objetivo con éste capítulo es conocer qué funcionalidades se ofrecen en un conjunto de páginas Web (elegidas con el fin de que representen un amplio abanico de tipos de aplicaciones) y facilitar en nuestra librería el realizar esas tareas. No se realiza un análisis ni exhaustivo ni técnico y alguno de los puntos comentados será puramente subjetivo.

Entraremos en materia con el capítulo 6, en el que definiré cual será la estructura de

directorios elegida para nuestra propuesta. Se realiza desde el primer momento un intento de separación entre la parte destinada al diseño de la parte puramente de programación, ambos procesos muy unidos en la creación de una página web.

En los capítulos 7 y 8 se definen cuatro puntos clave en nuestro desarrollo. Los

ficheros de recursos y etiquetas, así como la definición de cual será nuestro ‘framework’ de trabajo y cómo usaremos las plantillas serán puntos importantes y que marcan ya como se realizará todo el proceso de creación de aplicaciones web con nuestra librería de trabajo.

El capítulo 9 es el capítulo más importante de todos ya que se explica en él, cuales

son las funciones básicas que realizaremos. En primer lugar se definen qué funcionalidades se pretenden soportar desde un módulo básico y a continuación se expone cual será nuestra librería y cuales serán las clases principales y más importantes. Ayudados de diagramas UML [6] de actividades y de secuencia se mostrarán como serán realizadas dichas acciones y finalmente con un módulo de ejemplo se expondrán trozos de código y se comentará como se llevan a cabo todos los procesos hasta llegar a construir la aplicación o partes de la aplicación final.

El capítulo 10 está dedicado a exponer la librería base; una a una todas las clases

que la componen serán mostradas al más puro estilo de API (conjunto de funciones que ofrece cierta librería), para que nos sirva de ayuda a la hora de llevar acabo nuestros proyectos.

Usaremos el capítulo 11 para una doble finalidad, la primera será la de mostrar con

un ejemplo real, la creación de la web del Grupo de Técnicas Computacionales en la Ingeniería, como haremos uso de la librería desarrollada. Para ello realizaremos un análisis de los requisitos iniciales, se usará el modelo Entidad-Relación [7] para definir y crear la estructura de tablas de nuestro ejemplo… La otra finalidad será la de mostrar cual es la metodología de desarrollo usada para conseguir llevar acabo dicho desarrollo y otros que pretendamos llevar a cabo en un futuro. Al final de este capítulo se mostrarán algunas imágenes del resultado obtenido.

El capítulo 12 expone las conclusiones y líneas futuras.



El Apéndice A está dedicado a un pequeño manual de usuario, que de forma original nos mostrará las posibilidades de la aplicación web y cómo trabajar con ella.

El Apéndice B se destina a enumerar el contenido del CD adjunto a esta memoria y

finalmente se muestra la bibliografía usada para llevar a cabo este Proyecto de Fin de Carrera.

Metodología Modelo-Vista-Controlador para la Programación Web en PHP Programación Tradicional


2. PROGRAMACIÓN TRADICIONAL

2.1 INTRODUCCIÓN

A continuación pretendemos exponer la problemática de realizar una programación web tal y como se hacía de manera tradicional ya que actualmente son muchas las empresas que aún siguen desarrollando sus aplicaciones web de ésta manera. Conocer bien el punto de partida nos facilitará saber qué queremos mejorar y si finalmente conseguimos nuestro objetivo.

2.2 CONOCIENDO EL LENGUAJE

El lenguaje PHP [1], que será el lenguaje que usaremos en este proyecto, es un lenguaje de programación de estilo clásico; con esto quiero decir que es un lenguaje de programación con variables, sentencias condicionales, bucles, funciones.... No es un lenguaje de marcas como podría ser HTML [2], XML o WML. Está más cercano a Javascript [8] o a C, para aquellos que conocemos estos lenguajes.

A diferencia de Javascript que se ejecuta en el navegador, PHP se ejecutará en el servidor, lo que nos permite acceder a los recursos que tenga el servidor como por ejemplo podría ser una base de datos. El programa PHP es ejecutado en el servidor y el resultado es enviado al navegador. El resultado suele ser normalmente una página HTML pero igualmente podría ser una página WML.

Un navegador realiza la petición de la página web (la cual está escrita en PHP)

alojada en un servidor de Internet. El mismo servidor es el que lee la página PHP y la procesa. El resultado del procesamiento puede haber realizado múltiples tareas internas a nivel de servidor como lectura a bases de datos, ejecución de scripts internos de servidor, generación de ficheros... pero como resultado final obtendremos una página HTML que será la que se mostrará al usuario que realizó la petición.

En la siguiente figura podemos ver un pequeño gráfico que nos mostrará de manera fácil e intuitiva el funcionamiento de una página escrita en PHP.

Figura 2.1 Procesado de una página PHP.



Al ser PHP un lenguaje que se ejecuta en el servidor no es necesario que el navegador lo soporte, es independiente del navegador, pero sin embargo para que las páginas PHP funcionen, el servidor donde están alojadas debe soportar PHP. La ventaja que tiene PHP sobre otros lenguajes de programación que se ejecutan en el servidor (como podrían ser los script CGI Perl), es que nos permite intercalar las sentencias PHP en las paginas HTML, además de ser bastante cómodo y potente; es un concepto algo complicado de entender si no se ha visto nunca como funciona. Ejemplo 2.1. Un ejemplo básico podría ser el siguiente: <html> <head> <title>Ejemplo de PHP</title> </head> <body> ..... ..... <?php echo "Parte de PHP<br>"; for($i=0;$i<10;$i++) { echo "Línea ".$i."<br>"; } ?> </body> </html>

El trozo de código en cursiva representa el código HTML y el código en negrita las

instrucciones en PHP. Simplemente se crea una página HTML con título y como contenido tan solo una línea de texto “Parte de PHP” y debajo 10 líneas con su numeración: Línea 1, Línea 2… unas debajo de otras.

Esta ventaja que acabamos de comentar en el punto anterior, el poder intercalar líneas de HTML con líneas de código PHP, es a su vez nuestra principal fuente de problemas y la que causa la generación de código poco claro y enrevesado que podremos apreciar más claramente en el Ejemplo 2.2.

2.3 UN EJEMPLO REAL

En el mundo de las “aplicaciones web”, que normalmente está formado por diseñadores gráficos, programadores autodidactas, bajos presupuestos y poco tiempo para llevar acabo los proyectos, suele ser normal el uso de lenguajes interpretados como PHP, el cual permite el rápido desarrollo de aplicaciones, pero al mismo tiempo tiende a producir código de difícil mantenimiento y poco eficiente. Evidentemente en el ejemplo anterior ‘Ejemplo 2.1’ no se puede apreciar esta problemática, ya que es un código muy simple. Para que podamos ver un ejemplo real muestro a continuación un fichero perteneciente a una aplicación que hasta hace poco estaba en funcionamiento; se trataba de una aplicación en la que se gestionaban



documentos de clientes y el fichero en cuestión se encargaba de realizar el alta de una asesoría para la cual posteriormente se añadirían documentos, gestión de usuarios… A continuación podemos apreciar como se encuentra todo el código de generación del HTML, imágenes, tablas... mezclado junto con todo el código de la lógica de la aplicación; tanto las conexiones a la base de datos como la verificación de los tipos de datos o como la inserción de los datos en la tabla adecuada. Todo se encuentra mezclado (y en el mismo fichero PHP) creando un código difícilmente reutilizable y/o modificable.

Para que podamos ver que dentro de este trozo de código se hace una gran variedad de funciones sin ningún orden y de manera totalmente despreocupada comentaré algunas líneas de código: − Desde la línea 2 a la 7 se inicia la sesión y se pregunta por la identidad del usuario por

si fuese el administrador. − En las líneas 8, 9 y 10 (al igual que en las líneas 28, 29 y 30) se hace una redirección a

una página de error en el caso de que el usuario no esté ‘logueado’ (identificado en el sistema). Esto se realiza directamente ejecutando código de Javascript.

− En las líneas 15 y 16 se incluyen 2 ficheros PHP que supuestamente incluirán funciones que se usarán en este mismo código (no se ha indagado en este aspecto ya que no es necesario para el fin que buscamos aquí, que es el de mostrar como en un único fichero se puede aglutinar código que realiza diversas funciones).

− En las líneas 23 y 24 se realiza una consulta a la base de datos, para lo cual se está usando directamente las funciones PHP para conectar con dicha base de datos, que en este caso es MySQL.

− En la línea 44 se hace una consulta para ver si se ha subido algún fichero consultando directamente la variable $_FILES cuando se podría usar alguna otra función un poco más elaborada. Si por cualquier motivo la forma de verificar si un fichero ha sido subido o no cambia, tendremos que recorrer todo el código para buscar estas sentencias y modificarlas.

− Desde la línea 76 hasta la 131 se 'construye' un email, desde principio a fin, mezclándose con todo el resto de código perteneciente a la lógica de la aplicación.

− Por último, en la línea 194 podemos apreciar como se indican propiedades de estilo o diseño de forma directa en el elemento <body> cuando lo lógico y más limpio y eficiente sería usar las hojas de estilos CSS [9].

Ejemplo 2.2: 1 2 <?php 3 session_start(); 4 ?> 5 6 <?php 7 if (!isset($_SESSION["admin"])) { // El usuario no esta registrado 8 echo "<script type=\"text/javascript\"> 9 window.location=\"error_index.html\"; 10 </script>"; 11 }else{ 12 13 if (isset($_POST["crear"])){// Vengo de mi mismo, para introducir

aministrador 14



15 require_once("funciones/funciones_php.php"); 16 require_once("funciones/conectar_base_datos.php"); 17 18 $nombre=texto_correcto($_POST["nombre"]); 19 $email=texto_correcto($_POST["email"]); 20 $telefono=texto_correcto($_POST["telefono"]); 21 22 // Compruebo que no haya este usuario ya registrado,solo nombre 23 $sql_comprobar = "Select * from usuarios where nombre_usuario =

'".$nombre."';"; 24 $result_comprobar=mysql_query($sql_comprobar) or die("no puedo"); 25 26 27 if (mysql_num_rows($result_comprobar)>0){ // Ya esta registrado 28 echo "<script type=\"text/javascript\"> 29 window.location=\"ad_error_anadir_admin.php\"; 30 </script>"; 31 }else{ 32 33 // Calculo una clave aleatoria para este nuevo administrador 34 $largo = 8; #8 caracteres. 35 $rango = anc; #Alfanumérico. 36 $case = m; #Mezcla minúsculas y mayúsculas. 37 $clave = clave_aleatoria($largo, $rango, $case); 38 $clave_codificada = md5($clave); 39 40 // Introducir la asesoria en la base de usuarios 41 $sql="INSERT INTO usuarios VALUES ('".$nombre."',

'".$clave_codificada."', '".$email."','asesoria')"; 42 $result=mysql_query($sql); // Introducir asesoria en los usuarios 43 // Comprobar si se ha introducido un documento 44 if ($_FILES["logotipo"]["name"]!=""){ 45

$nombrefichero=texto_correcto("logotipos/".$nombre.$_FILES["logotipo"]["name"]);

46 // Subir el fichero al servidor, en una carpeta determinada 47 copy ($_FILES["logotipo"]["tmp_name"],"$nombrefichero"); 48 49 // Introducir asesoria en la base de asesorias, SI LOGOTIPO 50 $sql="INSERT INTO àsesoria` ( ìd_asesoria` , `nombre` , èmail` ,

`telefono`, `logotipo` ) VALUES ('', '".$nombre."', '".$email."', '".$telefono."', '".$nombre.$_FILES["logotipo"]["name"]."')";

51 $result=mysql_query($sql); // Introducir empresa en los usuarios 52 53 }else{ 54 55 // Introducir asesoria en la base de asesorias, NO LOGOTIPO 56 $sql="INSERT INTO àsesoria` ( ìd_asesoria` , `nombre` , èmail` ,

`telefono`, `logotipo` ) 57 VALUES ('', '".$nombre."', '".$email."','".$telefono."','')"; 58 $result=mysql_query($sql)or die("wew ".$sql); // Introducir empresa

en los usuarios 59 } 60 61 62 63 /***************************************************** 64 Mandar email, a la asesoria indicandole nombre de usurio y

contraseña 65 ****************************************************/



66 67 $para = $email;// e_mail de la empresa 68 $trozos = explode(";",$para); 69 70 for ($i=0;$i<=count($trozos);$i++){ 71 $para=$trozos[$i]; 72 73 74 $asunto = "Creación de cuenta en Audiotoria de Ingenieria"; 75 76 $mensaje="<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01

Transitional//EN\" 77 \"http://www.w3.org/TR/html4/loose.dtd\"> 78 <html> 79 <head> 80 <meta http-equiv=\"Content-Type\" content=\"text/html; charset=iso-

8859-1\"> 81 <title>Documento sin título</title> 82 </head> 83 <body rightmargin=\"0\" topmargin=\"0\" leftmargin=\"0\"> 84 <table width=\"100%\" border=\"0\"> 85 <tr> 86 <td height=\"87\" bgcolor=\"#164D7E\"><div align=\"center\"><img

src=\"http://www.xxxxx.es/imagenes/logotipo.gif\" width=\"313\" height=\"68\"></div></td>

87 </tr> 88 </table> 89 <blockquote> 90 <p> </p> 91 <p><font style=\"FONT-SIZE: 11px\"><SPAN 92 style=\"FONT-SIZE: 10pt\"><font color=\"#164D7E\" face=\"Trebuchet

MS\">La asesoria $nombre ha sido introducida,en el sistema con los siguientes datos:</font></SPAN></font></p>

93 <blockquote> 94 <ul> 95 <li><font color=\"#164D7E\" face=\"Trebuchet MS\" style=\"FONT-

SIZE: 11px\"><SPAN 96 style=\"FONT-SIZE: 10pt\"><strong> </strong>Nombre de Usuario:

$nombre. </SPAN></font></li> 97 <li><strong><font color=\"#164D7E\" face=\"Trebuchet MS\"

style=\"FONT-SIZE: 11px\"><SPAN 98 style=\"FONT-SIZE: 10pt\"></SPAN></font></strong><font

color=\"#164D7E\" face=\"Trebuchet MS\" style=\"FONT-SIZE: 11px\"><SPAN

99 style=\"FONT-SIZE: 10pt\">Pasword de Usuario: $clave.</SPAN></font> </li>

100 <p><font color=\"#164D7E\" face=\"Trebuchet MS\" style=\"FONT-SIZE: 11px\"><SPAN

101 style=\"FONT-SIZE: 10pt\">------------</SPAN></font></p> 102 <blockquote> 103 <p class=\"MsoNormal\" style=\"BACKGROUND: white; MARGIN: 0cm 0cm

0pt\"><font color=\"#164D7E\" size=\"2\" face=\"Trebuchet MS\"><strong>Nota:</strong> Por favor NO responda a este correo electrónico, este es un correo automatizado solo para notificaciones. Si tiene alguna pregunta, contáctenos en: [email protected]\"</font></p>

104 </blockquote> 105 </body> 106 </html>"; 107 ...



108 ... 109 $de = $_SESSION["email"];// e_mail del administrador original 110 $headers = "MIME-Version: 1.0\n"; 111 $headers .= "From: Audiotoria Ingenieria <".$de.">\n"; 112 $headers .= "Content-Type: text/html;"; 113 mail($para, $asunto, $mensaje,$headers); 114 } 115 116 //close database connection 117 mysql_close ($conexion); 118 /*************************************************/ 119 120 echo "<script type=\"text/javascript\"> 121 window.location=\"ad_ok_admin.php\"; 122 </script>"; 123 } // else 124 } 125 ?> 126 127 <html> 128 <head> 129 <title>Añadirasesoria</title> 130 <meta http-equiv="Content-Type" content="text/html; charset=iso-

8859-1"> 131 <link href="estilos.css" rel="stylesheet" type="text/css"> 132 <script type="text/javascript"

src="funciones/calculos.js"></script> 133 <script type="text/javascript"

src="funciones/funciones_javascript.js"></script> 134 <script type="text/javascript"> 135 function cambiar_llave_imagen(valor,formulario){ 136 if (valor=='1'){ 137 if (formulario.nombre.value!=''){ 138 formulario.imagen_nombre.src="imagenes/campo_introducido.gif" 139 }else{ 140

formulario.imagen_nombre.src="imagenes/campo_si_obligatorio.gif" 141 } 142 } 143 144 if (valor=='2'){ 145 if (formulario.email.value!=''){ 146 formulario.imagen_email.src="imagenes/campo_introducido.gif" 147 148 }else{ 149

formulario.imagen_email.src="imagenes/campo_si_obligatorio.gif" 150 } 151 } 152 if (valor=='3'){ 153 if (formulario.telefono.value!=''){ 154

formulario.imagen_telefono.src="imagenes/campo_introducido.gif" 155 }else{ 156

formulario.imagen_telefono.src="imagenes/campo_no_obligatorio.gif" 157 } 158 } 159 }// funcion 160

161 162 function ValidarFormulario(formulario){ 163 mal=false; 164 text="Error:\n"; 165 166 167 if (mal==true){ 168 alert(text) 169 document.ValidarFormulario_return=false; 170 }else{ 171 document.ValidarFormulario_return=true; 172 } 173 }//funcion 174 </script> 175 </head> 176 <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0"

marginwidth="0" marginheight="0"> 177  178 <table width="780" height="560" border="0" align="center"

cellpadding="0" cellspacing="0" id="Tabla_01"> 179 <tr bgcolor="#164D7E"> 180 <td height="87" colspan="3"> 181 <div align="center"><img

src="imagenes/logotipo.gif" width="313" height="68" alt=""></div></td> 182 </tr> 183 <tr> 184 <td height="25"> </td> 185 </tr> 186 <tr> 187 <td><table width="95%" border="0" align="center"

cellpadding="0" cellspacing="10" class="TablaArriba" id="tabla_nav"> 188 <tr> 189 <td><div align="left"><a href="administrador.php"><img

src="imagenes/casita.gif" width="12" height="11" border="0"></a> > <span class="Estilo_Links">Añadir asesoria</span> </div></td>

190 <td><div align="right"><img src="imagenes/flechita_cerrar.gif" width="14" height="13"><a href="cerrar_sesion.php" class="Estilo_Links">Cerrar Sesión</a></div></td>

191 </tr> 192 </table></td> 193 </tr> 194 <tr> 195 <td><table width="80%" border="0" align="center"

cellpadding="0" cellspacing="0" class="Tabla_sin_borde"> 196 <tr> 197 <td colspan="3" valign="bottom"><img

src="imagenes/dot_transparent.gif" width="1" height="1"></td> 198 </tr> 199 <tr> 200 <td colspan="3" valign="bottom"> </td> 201 </tr> 202 <tr> 203 <td width="36%" valign="bottom"><img

src="imagenes/campo_si_obligatorio.gif" width="24" height="24"> Campo si obligatorio </td>

204 <td width="33%" valign="bottom"><img src="imagenes/campo_introducido.gif" width="24" height="24"> Campo introducido </td>

205 <td width="31%" valign="bottom"><img



src="imagenes/campo_no_obligatorio.gif" width="24" height="24"> Campo no obligatorio </td>

206 </tr> 207 </table></td> 208 </tr> 209 <tr> 210 <td width="757"><form action="ad_anadir_asesoria.php"

method="post" enctype="multipart/form-data" name="formulario" target="_self" id="formulario" onSubmit="ValidarFormulario(this);return document.ValidarFormulario_return">

211 <table width="80%" border="0" align="center" cellpadding="3" cellspacing="0" class="Tabla">

212 <tr class="Informacion_tabla_principal"> 213 <td colspan="5">AÑadir nuevA ASESORIA: </td> 214 </tr> 215 <tr> 216 <td width="6%"><div align="center"><img

src="imagenes/campo_si_obligatorio.gif" name="imagen_nombre" width="24" height="24" id="imagen_nombre"></div></td>

217 <td width="82%"><label> </label> 218 <div align="left">Nombre:<br> 219 <input name="nombre" type="text"

class="Estilo_objetos_formularios" id="nombre" size="30" maxlength="25" onBlur="cambiar_llave_imagen(1,this.form)">

220 </div></td> 221 </tr> 222 <tr> 223 <td><div align="center"><img

src="imagenes/campo_si_obligatorio.gif" name="imagen_email" width="24" height="24" id="imagen_email"></div></td>

224 <td><div align="left">Email: <br> 225 <input name="email" type="text"

class="Estilo_objetos_formularios" id="email" size="100" maxlength="255" onBlur="cambiar_llave_imagen(2,this.form)">

226 </div></td> 227 </tr> 228 <tr> 229 <td><div align="center"><img

src="imagenes/campo_no_obligatorio.gif" name="imagen_telefono" width="24" height="24" id="imagen_telefono"></div></td>

230 <td>Teléfono:<br> 231 <input name="telefono" type="text"

class="Estilo_objetos_formularios" id="telefono" size="100" maxlength="255" onBlur="cambiar_llave_imagen(3,this.form) " ></td>

232 </tr> 233 <tr> 234 <td><div align="center"><img

src="imagenes/campo_si_obligatorio.gif" name="imagen_logotipo" width="24" height="24" id="imagen_logotipo"></div></td>

235 <td>Logotipo:<br> 236 <input name="logotipo" type="file"

class="Estilo_objetos_formularios" id="logotipo" size="52" maxlength="50" onBlur="cambiar_llave_imagen(4,this.form)"></td>

237 </tr> 238 <tr> 239 <td> </td> 240 <td colspan="3"><label> 241 <input name="crear" type="submit" id="crear"

value="Crear">

242 </label></td> 243 </tr> 244 </table> 245 </form> </td> 246 </tr> 247 <tr> 248 <td height="50" colspan="3"> </td> 249 </tr> 250 </table> 251  252 </body> 253 </html> 254 <?php }?>

Nota aclaratoria: Este código no ha sido alterado ni modificado en ningún momento para que parezca más lioso o marañado; al contrario, se han eliminado trozos de código para intentar dejar lo más limpio posible el código 'útil' de la página PHP.

Como se puede apreciar no es algo que con un simple vistazo podamos imaginar su funcionalidad. Para entender un poco más de qué se trata adjunto en la Figura 2.2 una captura de pantalla de la vista de diseño del programa Macromedia Dreamwever para que podamos hacernos una idea de que cual es la representación gráfica de toda esta maraña de código. El funcionamiento es bien simple: solicitar unos datos, validarlos y almacenarlos en la base de datos.

Figura 2.2 Representación gráfica del código de ejemplo mostrado.

Tras haber echado un vistazo al ejemplo anterior (Ejemplo 2.2) podemos comprender el porqué es tan importante la realización de una librería básica que siga una buena metodología de trabajo para que nos pueda brindar una base sólida sobre la cual desarrollar aplicaciones concretas y permitir obviar los componentes más triviales y genéricos del desarrollo. Nuestras librerías nos deberán facilitar la separación fundamental entre el diseño y la programación de la aplicación para conseguir así desarrollar productos



que en un futuro cercano puedan ser reutilizados, mejorados y ampliados sin necesidad de volver a programar o rediseñar toda la web desde cero.

Podemos ya definir las 2 partes esenciales en las que dividiremos el desarrollo de un proyecto web: − Programación − Diseño

En una situación real, dicha distinción será esencial y estos 2 puntos serán acometidos por distinto personal dentro de una empresa; cada uno especializado en su labor y trabajando en paralelo sin necesidad de 'mezclar sus caminos' en la mayor parte del trabajo, cosa que no es tan trivial como pueda parecer.

Metodología Modelo-Vista-Controlador para la Programación Web en PHP Modelo Vista Controlador


3. MODELO VISTA CONTROLADOR

3.1 INTRODUCCIÓN

Cuando las aplicaciones en general comienzan a ser más complejas y grandes, con un gran número de componentes y procedimientos, se comienza a mezclar el código de acceso a las bases de datos, el código referente a la lógica de negocio e incluso el código referente a la presentación como ya hemos visto anteriormente. El resultado de todo esto son aplicaciones difíciles de mantener ya que la relación entre los componentes causa efectos colaterales cada vez que se realiza algún cambio. En definitiva, se dificulta o imposibilita la reutilización del código por causa de las dependencias de muchas clases lo que obliga a recodificar y a rescribir funciones y aplicaciones enteras nuevamente. El patrón de diseño Modelo-Vista-Controlador (MVC) [3] intenta resolver este problema a través de la separación del acceso a los datos, la lógica de la aplicación y la interacción del usuario.

Cuando se construyen aplicaciones interactivas, como con otros programas, la modularidad de componentes tiene enormes beneficios. Aislar las unidades funcionales unas de otras tanto como sea posible hace más fácil para el diseñador de la aplicación entender y modificar cada unidad particular, sin tener que saber todo sobre las otras unidades. El Modelo-Vista-Controlador es una forma de diseñar e implementar aplicaciones software interactivas que aprovecha la ventaja de la modularidad, para ayudar al desarrollo conceptual de las aplicaciones, y para permitir que las piezas ya desarrolladas para una aplicación sean reutilizadas en una nueva aplicación

Pretenderemos, con el patrón MVC, facilitar tanto el proceso de desarrollo de una aplicación (web en nuestro caso) como facilitar los cambios de una aplicación ya construida. Con este modelo, los componentes estarán relacionados de forma que facilitarán esta labor. Se pretende hacer la transición de un modelo en el que todo es realizado por un 'gurú' de la programación a un modelo donde se requieren diferentes conjuntos de habilidades para realizar diferentes tareas.

La principal separación que intentaré realizar en este proyecto será entre la Vista y el Modelo-Controlador dado que dicha separación existe más claramente en la vida cotidiana en el proceso de creación de software; los programadores se dedicarán a realizar su tarea (Modelo y Controlador) y los diseñadores harán lo pertinente en lo referente a todo el diseño gráfico e interfaz del usuario (Vista).

2.2 DEFINICIÓN [3]

Trygve Reenskaug es el creador del patrón Modelo-Vista-Controlador. Durante su estancia en Xerox Parc entre 1978 y 1979 desarrolló las ideas en las que se basa el patrón conocido hoy en día, y sus ideas se usaron para implementar el Modelo-Vista-Controlador en Smalltalk-80.



El objetivo fundamental que perseguía Reenskaug era reducir la distancia entre el

modelo mental del usuario y el modelo computacional. La Figura 3.1 muestra esta idea. Quiere hacer creer al usuario que ve y manipula la información del dominio directamente.

Figura 3.1 Representación gráfica de la idea inicial del modelo MVC

Según uno de los Sistemas de Patrones de Arquitectura más extendido en el mundo: Pattern Oriented Software Architecture, publicado por Buschmann en 1996, el patrón que se analiza en este trabajo (MVC), se sitúa en la tercera de las cuatro categorías en las cuales clasifica a los patrones: Del barro a la estructura (From mud to Structure), Sistemas Distribuidos (Distributed Systems), Sistemas Interactivos (Interactive Systems) y Sistemas Adaptables (Adaptable Systems).

De igual forma si utilizamos otro de los sistemas más difundidos: Pattern of

Enterprise Application Architecture, descrito recientemente por Fowler en el 2003, lo ubica en la tercera de las siete categorías que se mencionan a continuación: Patrones de lógica del dominio (Domain Logia Patterns), Patrones de Mapeo a Bases de Datos Relacionales (Mapping to Relational Database Patterns), Patrones de Presentación Web (Web Presentation Patterns), Patrones de Distribución (Distribution Patterns), Patrones de Concurrencia Offline (Offline Concurrency Patterns), Patrones de Estado de Sesión (Session State Patterns) y Patrones Base (Base Patterns).

El patrón MVC se ve frecuentemente en aplicaciones web, donde la vista es la

página HTML y el código que provee de datos dinámicos a la página. MVC divide una aplicación interactiva en 3 áreas: procesamiento, salida y entrada. Para esto, utiliza las siguientes abstracciones:

− Modelo: Encapsula los datos y las funcionalidades. El modelo es independiente de cualquier representación de salida y/o comportamiento de entrada. es la representación específica de la información con la cual el sistema opera. La lógica de datos asegura la integridad de estos y permite derivar nuevos datos; por ejemplo, no permitiendo comprar un número de unidades negativo, calculando si hoy es el cumpleaños del usuario o los totales, impuestos o portes en un carrito de la compra.

− Vista: Muestra la información al usuario. Pueden existir múltiples vistas del modelo. Cada vista tiene asociado un componente controlador.

− Controlador: Reciben las entradas, usualmente como eventos que codifican los



movimientos o pulsación de botones del ratón, pulsaciones de teclas, etc. Los eventos son traducidos a solicitudes de servicio para el modelo o la vista.

Aunque se pueden encontrar diferentes implementaciones de MVC, el flujo que sigue el control generalmente es el siguiente: • El usuario interactúa con la interfaz de usuario de alguna forma (por ejemplo, el

usuario pulsa un botón, enlace) • El controlador recibe (por parte de los objetos de la interfaz-vista) la notificación de la

acción solicitada por el usuario. El controlador gestiona el evento que llega, frecuentemente a través de un gestor de eventos (handler) o callback.

• El controlador accede al modelo, actualizándolo, posiblemente modificándolo de forma

adecuada a la acción solicitada por el usuario (por ejemplo, el controlador actualiza el carro de la compra del usuario). Los controladores complejos están a menudo estructurados usando un patrón de comando que encapsula las acciones y simplifica su extensión.

• El controlador delega a los objetos de la vista la tarea de desplegar la interfaz de

usuario. La vista obtiene sus datos del modelo para generar la interfaz apropiada para el usuario donde se refleja los cambios en el modelo (por ejemplo, produce un listado del contenido del carro de la compra). El modelo no debe tener conocimiento directo sobre la vista. Sin embargo, el patrón de observador puede ser utilizado para proveer cierta flexibilidad entre el modelo y la vista, permitiendo al modelo notificar a los interesados de cualquier cambio. Un objeto vista puede registrarse con el modelo y esperar a los cambios, pero aun así el modelo en sí mismo sigue sin saber nada de la vista. El controlador no pasa objetos de dominio (el modelo) a la vista aunque puede dar la orden a la vista para que se actualice. Nota: En algunas implementaciones la vista no tiene acceso directo al modelo, dejando que el controlador envíe los datos del modelo a la vista.

• La interfaz de usuario espera nuevas interacciones del usuario, comenzando el ciclo

nuevamente.

Desde los primeros ejemplos de sistemas interactivos de Trygve Reenskaug en el año 1973, hasta una presentación del mismo autor en abril de 2006 se han realizado, por diversos autores pasando incluso por Microsoft y por la Wikipedia, multitud de definiciones y versiones del patrón.

En resumen básicamente, el patrón Modelo-Vista-Controlador debe considerarse un

conjunto de varias ideas, donde hay dos principales. Reducir la distancia humano-máquina y facilitar cambios en la interfaz. Esta es la esencia del Modelo-Vista-Controlador, más que la elección de una u otra arquitectura particular.

Metodología Modelo-Vista-Controlador para la Programación Web en PHP Herramientas utilizadas


4. HERRAMIENTAS UTILIZADAS

4.1 INTRODUCCIÓN

En este capítulo, antes de comenzar a meternos de lleno en nuestra librería, describiremos cual va a ser nuestro sistema de trabajo, que servicios vamos a usar, lenguajes, librerías adicionales y de apoyo y las herramientas de trabajo diario.

Dividiremos por tanto este apartado en 4 subapartados: 4.2 – Sistemas LAMP [4]: una pequeña descripción de en qué consiste y sus

características. 4.3 – Sistema operativo y servicios: Describiremos qué sistema operativo usaremos y los

servicios en los que nos vamos a apoyar para realizar el desarrollo. 4.4 – Lenguajes: se describirán brevemente los lenguajes de programación que usaremos. 4.5 – Herramientas: todas las herramientas que nos ayudaran en la programación y diseño

de nuestra aplicación.

Dado que no se trata aquí de demostrar por qué es mejor un sistema, un lenguaje o una herramienta u otra, expondremos simplemente una descripción y las características más comunes y representativas del elemento en cuestión. La elección de ellos puede ser puramente subjetiva en algunos casos aunque lógicamente basada tanto en mi experiencia personal como en el sentir popular (opiniones de foros sobre los respectivos puntos a tratar)

4.2 SISTEMAS LAMP

LAMP [4] Se trata de una plataforma de tecnologías a partir de la cual, los desarrolladores construyen aplicaciones, reflejando el espíritu Open Source.

Teniendo en cuenta que el mercado de Tecnologías de la Información y

Comunicaciones (TIC) está plagado de términos, acrónimos y siglas, recientemente el concepto de LAMP (Linux, Apache, MySQL y PHP, Perl y Python) se ha sumado a dicho diccionario. Como plataforma de tecnologías interconectadas, su disponibilidad en código abierto avala su popularidad. LAMP es un término acuñado en 1998 por el escritor Michael Kunze para referirse a un grupo de programas gratuitos de código abierto que forman la base de muchos, quizás la mayoría, de los servidores de Internet que se utilizan hoy en día. Consta de cuatro componentes: Linux, Apache, MySQL y Perl, PHP y/o Python.

Aunque estos programas no se diseñaron específicamente para trabajar en conjunción los unos con los otros, el espíritu de código abierto y los trabajos de desarrolladores han convertido su interoperabilidad en uno de sus principales factores. Esto ha ayudado a que esta combinación se haya convertido en una elección cada vez más popular y por la que se está apostando con más fuerza. El valor añadido de ser gratuitos no ha pasado desapercibido.



En cuanto a los elementos que constituyen LAMP, destacan varios términos con entidad propia. Por un lado, resalta Linux [10], que hace referencia al kernel del sistema operativo (SO) de código abierto creado originalmente por Linus Torvalds. Desde sus comienzos Linux ha ganado peso, convirtiéndose en una familia de sistemas operativos fiables, que son utilizados tanto por grandes como pequeñas compañías a nivel mundial y que cada vez gana más terreno a nivel personal. Gracias al desarrollo de la comunidad Open Source, la labor de desarrolladores individuales, así como un buen número de versiones comerciales apoyadas por proveedores, Linux es considerado una elección segura y fiable para muchas aplicaciones servidor.

Apache [11] se ha convertido en el servidor de Internet más usado a nivel mundial.

Nació como una oferta de código abierto en torno a 1995 y, en la actualidad, está controlado por un grupo llamado Fundación Apache Software. Apache sigue siendo la plataforma de referencia que sirve para evaluar a los demás servidores de Internet.

MySQL es un sistema de gestión de base de datos basado en SQL [12], multiusuario y con más de 6 millones de instalaciones. A diferencia de los otros componentes, MySQL no es de código abierto, sino que está protegido con copyright, perteneciendo a una sola empresa desde su concepción en 1995.

PHP, Perl y Python son los lenguajes de programación más elegidos en la mayoría de los desarrollos LAMP. Todos se caracterizan por ser lenguajes de script concisos y compactos que pueden permitir a un usuario ejecutar un programa en el servidor de Internet desde un navegador. El uso de lenguajes script empezó con las interfaces Common Gateway Interface Web (CGI) [8] simplificando el desarrollo de páginas web con contenido dinámico y actualizado que complementa las páginas estáticas e invariables de antes.

Elementos intercambiables: LAMP se ha convertido en una designación general que hace alusión a una plataforma web que los desarrolladores, a menudo, construyen a partir de una variedad de componentes de software. Entre las opciones más habituales, destacan:

• L: Linux, FreeBSD, NetBSD, OpenBSD, Microsoft Windows, Darwin/Mac OS X, Novell NetWare

• A: Apache (el elemento más consistente de este acrónimo)

• M: MySQL, PostgreSQL [13], Firebird SQL u Oracle

• P: PHP, Perl, Python, Ruby o Groovy



4.3 SISTEMA OPERATIVO Y SERVICIOS

4.3.1 Linux

Efectivamente, tal y como hemos expuesto anteriormente en el apartado 4.2 Sistemas LAMP, el sistema operativo que usaremos para el desarrollo de nuestra aplicación (alojamiento de la web y de la base de datos más concretamente) será Linux.

¿Qué ventajas tiene un servidor Linux frente a uno con Windows? Son muchas las

características que podríamos describir de Linux y comparar con Windows, pero simplemente mencionaré una de las más importantes a la hora de decidirnos sobre un sistema u otro. Linux es libre, no necesita licencias; se puede instalar Linux en todos los ordenadores que desee sin preocuparse de licencias y el coste que éstas suponen. Puede conseguir una distribución Linux por el coste del CD que lo contiene. Además se puede copiar libremente el software sin preocuparse de hacer algo ilegal. Se puede acceder al código fuente del programa y cambiarlo, lo que permite que se encuentren y solucionen los fallos de manera mucho más rápida. Además no se depende de la política de una empresa que deje de dar soporte a un programa, sacar nuevas versiones o corregir fallos.

4.3.2 La Distribución Debian 3.1 Sarge Dentro de lo que conocemos como proyecto GNU/Linux existen múltiples

distribuciones. Una distribución Linux es un conjunto de aplicaciones reunidas para permitir la instalación sencilla de un sistema Linux; todas con un punto en común, el núcleo Linux.

Debian GNU/Linux [10] (o para acortar, Debian) es una de las múltiples

distribuciones que a día de hoy podemos encontrar en la red trabajando con el núcleo Linux y basada en el proyecto GNU (la mayoría de sus aplicaciones son software libre) y será esta distribución la que usaremos.

Debian GNU/Linux ofrece más de 18733 paquetes (software precompilado) basados en el concepto de software libre. Todos los servicios de alojamiento web y servidores dedicados funcionan bajo Debian GNU/Linux, con lo que podemos desarrollar nuestro trabajo en esta distribución sin ningún tipo de problema.

4.3.3 Servidor Web Apache

Apache [11] es hoy en día es el servidor web más utilizado del mundo, encontrándose muy por encima de sus competidores, tanto gratuitos como comerciales. Es un software de código abierto que funciona sobre cualquier plataforma. Por supuesto, se distribuye prácticamente con todas las implementaciones de Linux incluida la distribución 3.1 de Debian (Sarge).



Apache es una muestra, al igual que el sistema operativo Linux, de que el trabajo

voluntario y cooperativo dentro de Internet es capaz de producir aplicaciones de calidad profesional difíciles de igualar. La combinación de tres herramientas libres como Apache, PHP y MySQL, son el centro de millones de sitios web dinámicos. La nueva versión 2.0, incorpora un gran grupo de novedades y mejoras, tal y como podemos comprobar en: Overview of New Features in Apache 2.0 (http://httpd.apache.org/docs-2.0/new_features_2_0.html) si se desea profundizar en detalle al respecto.

4.3.4 Servidor Base de datos PostgreSQL Este punto será en el único en el que no coincidiremos con el sistema LAMP comentado anteriormente. El motivo no es otro más que mostrar que no solo existe MySQL como gestor potente de bases de datos y además hacer ver, que un determinado proyecto puede ser acometido utilizando herramientas que a priori no parecen las mejores o no son las más comunes. En mi experiencia personal con este sistema de bases de datos no he tenido ningún tipo de problema y he comprobado su gran similitud con MySQL tanto en simplicidad como en potencia.

A continuación, y dado que este punto puede ser uno de los menos habituales, se expondrá qué es este sistema de bases de datos y alguna de sus características:

4.3.4.1 ¿Qué es PostgreSQL?

PostgreSQL [13] es un sistema de gestión de bases de datos objeto-relacional basado en el proyecto POSTGRES, de la universidad de Berkeley. PostgreSQL es una derivación libre (Open Source) de este proyecto, y utiliza el lenguaje SQL92/SQL99, así como otras características que comentaremos más adelante.

Fue el pionero en muchos de los conceptos existentes en el sistema objeto-relacional actual, incluido, más tarde en otros sistemas de gestión comerciales. PostGreSQL incluye características de la orientación a objetos, como puede ser la herencia, tipos de datos, funciones, restricciones, disparadores, reglas e integridad transaccional. A pesar de esto, PostgreSQL no es un sistema de gestión de bases de datos puramente orientado a objetos.

A continuación se enumeran las principales características de este gestor de bases de datos: 1. Implementación del estándar SQL92/SQL99. 2. Soporta distintos tipos de datos: además del soporte para los tipos base, también

soporta datos de tipo fecha, monetarios, elementos gráficos, datos sobre redes (MAC, IP...), cadenas de bits, etc. También permite la creación de tipos propios.

3. Incorpora una estructura de datos array. 4. Incorpora funciones de diversa índole: manejo de fechas, geométricas, orientadas a

operaciones con redes, etc.



5. Permite la declaración de funciones propias, así como la definición de disparadores. 6. Soporta el uso de índices, reglas y vistas. 7. Incluye herencia entre tablas (aunque no entre objetos, ya que no existen), por lo

que a este gestor de bases de datos se le incluye entre los gestores objeto-relacionales.

8. Permite la gestión de diferentes usuarios, como también los permisos asignados a cada uno de ellos.

4.3.5 Servidor Proftpd y otros servicios

Otro punto importante a tener en cuenta para poder realizar nuestro cometido es la instalación en nuestro sistema de algún gestor de FTP (File Transfer Protocol); un servidor de FTP.

El servicio de FTP es uno de los más viejos y utilizados para la transferencia de archivos, la mayoría de los servidores Web lo necesitan y lo utilizan de alguna u otra forma para actualizar sus páginas, subir imágenes o para permitir la descarga de archivos a sus visitantes. Sea cual sea el verdadero requerimiento, un servidor FTP siempre es necesario.

ProFTPD [14] puede ser uno de los mejores servidores FTP que existen para Linux (también se lo puede utilizar en otros sistemas operativos). Es seguro, flexible, modular y fácil de configurar, permite autenticar usuarios con casi cualquier sistema de autenticación, se pueden utilizar servidores virtuales de FTP, se pueden tener múltiples servidores ofreciendo servicio de FTP anónimo. Además, es modular (lo que permite extender su funcionalidad ampliamente) y su código es libre (está licenciado bajo GPL).

Por supuesto, si hemos partido de la instalación de un sistema limpio y el servidor lo vamos a administrar nosotros, tendremos que instalar otros muchos servicios como por ejemplo un servidor de nombres (DNS) como por ejemplo BIND9 [21] que será esencial. Servidor de correo, firewall... serán ya temas que no necesitamos tratar en este proyecto. Estas tareas no se acometerán aquí, ya que tan sólo se han mencionado los servicios estrictamente necesarios para que nuestro sistema funcione y no es preciso que realicemos nosotros la instalación del servidor. Para llevar acabo la instalación de un servidor completo necesitará de algún manual específico.

4.3.6 Librería de ayuda PHPLib

Una vez instalado nuestro sistema base, o si por el contrario no hemos tenido la necesidad de realizar esto (ya se nos ha dado un sitio web para llevar acabo nuestro desarrollo), es el momento de instalar/revisar que determinadas librerías de ayuda estén instaladas. No son librerías necesarias en todos los proyectos, ni tampoco todos los programadores las usan; es más una cuestión de comodidad o costumbre así como de necesidad para realizar varias tareas no tan comunes o algo más complejas.

En nuestro caso instalaremos la librería PHPLib [15], la cual nos ayudará a gestionar los permisos de nuestros usuarios así como los usuarios mismos de nuestra web.



Inicialmente tan sólo la usaremos para este aspecto aunque está preparada para facilitar múltiples aspectos de la programación en PHP.

PHPLib, permite gestionar sesiones de usuarios y llevar un control de acceso basado en bases de datos, también de forma sencilla poder trabajar con diferentes bases de datos de forma transparente y todo esto sin la necesidad de escribir gran cantidad de código.

4.3.7 Librería gráfica ImageMagick

Otra librería que tendremos que tener instalada en nuestro sistema será ImageMagick [16].

ImageMagick es una colección de herramientas y librerías para leer, escribir y manipular una imagen en diversos formatos. Las operaciones de procesamiento de imágenes están disponibles en línea de comandos.

De las principales opciones que tenemos nos centraremos en el uso de la función convert, que convierte imágenes de un formato a otro. Esta será la función que más usaremos para subir nuestras imágenes a nuestra aplicación y convertirlas a un tamaño adecuado a la representación que deseemos.

4.3.8 Librería fpdf

Por último, la última librería que usaremos, y que no requiere instalación en el sistema sino que la añadiremos a nuestro proyecto en algún directorio correspondiente es ésta, FreePDF [17]. Son muchas las versiones de aplicaciones que hay por internet para la generación de PDF, algunas de pago y otras libres. La versión que nosotros usaremos será la disponible en http://www.fpdf.org/

FPDF es una clase escrita en PHP que permite generar documentos PDF directamente desde PHP, es libre con lo que se puede usar para cualquier propósito y modificarla si lo consideramos necesario.

No necesitaremos instalar ninguna extensión para PHP y funciona con PHP4 y PHP5. Además existe documentación en español que siempre se agradece.

Algunas de las características son:

• Elección de la unidad de medida, formato de página y márgenes

• Gestión de cabeceras y pies de página

• Salto de página automático

• Salto de línea y justificación del texto automáticos

• Admisión de imágenes (JPEG y PNG)

• Colores

• Enlaces

• Admisión de fuentes TrueType, Type1 y codificación



• Compresión de página

Nosotros usaremos esta librería para la generación de nuestros archivos en PDF. La usaremos básicamente para la generación de listados por si deseamos imprimirlos, aunque se podría usar para realizar detalles de noticias, páginas detalladas para imprimir sobre publicaciones,…

4.4 LENGUAJES A UTILIZAR

A continuación expondré qué lenguaje vamos a usar en nuestra librería y alguna de sus características.

4.4.1 PHP 4.4.1.1 Definición

PHP: Hypertext Preprocessor [1] es un lenguaje interpretado de alto nivel que se usa incrustado en páginas HTML y que se ejecuta en el servidor. La mayor parte de su sintaxis ha sido tomada de C, Java y Perl con algunas características específicas de si mismo. Pretende permitir rápidamente a los desarrolladores la generación dinámica de páginas.

Una pequeña cronología de sus versiones es la siguiente:

• El lenguaje PHP surge en 1994 como un conjunto de binarios en C usados para una

página personal de Rasmus Lerdorf (PHP: Personal HomePage) • En 1997 Zeev Suraski & Andi Gutmans reescriben el parser y lo renombran. • En el 2000 aparece PHP 4, siendo la Última versión la 4.4.6 que aún se le brinda

soporte. • PHP 5 aparece en el 2004, con un nuevo motor (Zend Engine II)

4.4.1.2 Por qué PHP y no ASP, PERL, Java...

Una respuesta rápida podría ser que todos los lenguajes indicados tienen ventajas e inconvenientes, y por lo tanto nuestra elección será siempre subjetiva. El mejor lenguaje será aquel que mejor encaje en las preferencias de cada usuario, y sirva mejor al fin que perseguimos.

No obstante, en nuestro proyecto, me he decidido por PHP. En primer lugar, PHP es un lenguaje relativamente nuevo, diseñado desde cero con el fin único de diseñar aplicaciones web. Esto quiere decir que las tareas más habituales en el desarrollo de estas aplicaciones, pueden hacerse con PHP de forma fácil, rápida y efectiva. Otros lenguajes, como ASP, Perl o Java pueden ser mucho más completos y potentes, pero en teoría, no fueron diseñados con este enfoque especializado.



PHP resulta fácil de aprender para personas con pocos conocimientos de programación web, aunque con ciertos conocimientos de programación con otros lenguajes; es fácil escribir rápidamente nuestro primer código PHP y ver los resultados en cualquier navegador. Otros lenguajes como Perl pueden resultar más complejos.

Como algunas de las características de PHP, es un lenguaje multiplataforma, y no propietario. Un script PHP normal puede ejecutarse sin cambiar ni una sola línea de código en cualquier servidor que interprete PHP, ya sean servidores Windows o Linux. Al contrario, ASP es un lenguaje propietario de Microsoft y solo puede ejecutarse en servidores Microsoft. Perl si puede ejecutarse bajo Windows y Linux, pero antes hay que realizar labores de adaptación de cada script al concreto sistema operativo.

PHP al estar en el entorno Open Source, tiene en su desarrollo un proceso de colaboración que hace que tengas inmediatamente disponibles, de forma gratuita, una enorme cantidad de recursos: el lenguaje en sí, el servidor para ejecutarlo, manuales y tutoriales, scripts... Esta abundancia de código ayuda aún más en el proceso de aprendizaje y en la mejora de nuestras aplicaciones incluyendo código nuevo, actualizaciones y correcciones de errores que en otros lenguajes propietarios no se haría de manera tan rápida y por supuesto de forma libre y gratuita.

Usaremos para nuestro proyecto la versión 5.0 de PHP

4.4.2 HTML y CSS

HTML [2] son las siglas de "HyperText Mark-up Language". "Mark-up" es un término de imprenta que significa el conjunto de instrucciones estilísticas detalladas escritas en un manuscrito que debe ser tipografiado. Así, HTML podría ser traducido como "Lenguaje de Formato de Documentos para Hipertexto".

HTML es un lenguaje muy simple. El formato de los documentos se marca mediante etiquetas (tags) que indican el comienzo y el final de los elementos que componen el documento. Cada uno de estos elementos tiene un significado estructural diferente. Por ejemplo, el elemento 'p' contiene un párrafo de texto. El comienzo del párrafo se marca con la etiqueta <p> y el final del párrafo se marca (opcionalmente) con la etiqueta </p>. El elemento 'h1' contiene un encabezado (por ejemplo, el título de un capítulo) y está delimitado por las etiquetas <h1> y </h1>. El elemento 'a' indica un hipervínculo (o más concretamente el origen o el destino de un hipervínculo, según cómo se marque en el documento), etc.

En teoría, el código HTML sólo contiene por tanto información sobre la estructura de los contenidos.

La simplicidad del HTML es un punto a su favor ya que, como los contenidos están estructurados de manera lógica, pueden ser representados de acuerdo con esa estructura por cualquier navegador, según sus capacidades. Él mismo se encargará de escribir los títulos con un tipo más grande que el de los párrafos, de poner el espacio entre párrafos, de dibujar los marcadores de las listas, de dibujar las líneas entre las celdas de una tabla, etc., sin que nosotros tengamos que preocuparnos de esos aspectos.



Sin embargo, un documento escrito solo con HTML carecerá de atractivo visual.

Para este fin actualmente es posible utilizar hojas de estilo para especificar la apariencia de los elementos. Anteriormente ha sido necesario recurrir a trucos y a elementos inventados para ello: por ejemplo, el elemento 'font' para cambiar la fuente de un texto, la utilización de tablas para colocar los elementos en la pantalla en lugar de para contener datos tabulares, o la división de un mismo documento en marcos. Todo esto causa problemas, el HTML generado se complica y los documentos pierden su estructura, lo cual es la base misma del HTML.

La última especificación de HTML, la HTML 4.01 de 1997, declaró todos esos elementos 'presentacionales' como desaprobados, de modo que los nuevos navegadores no se verían obligados a soportarlos. En su lugar, deberían utilizarse hojas de estilo (CSS). Las hojas de estilo en cascada (Cascading Style Sheets, CSS) [9] son un lenguaje formal usado para definir la presentación de un documento estructurado escrito en HTML o XML

La idea que se encuentra detrás de CSS es separar la estructura de un documento de su presentación de manera que el HTML tan solo marca la estructura del documento. La información de estilo separada en una hoja de estilo, especifica cómo se ha de mostrar cada contenido: color, fuente, alineación del texto, tamaño, y otras características no visuales.

El documento HTML en sí mismo será más claro de entender y se consigue reducir considerablemente su tamaño ya que además de poderse indicar los estilos en el mismo documento, la información de estilos se puede adjuntar en un documento separado.

4.4.3 Otros lenguajes

Otros lenguajes como XML, JavaScript, Ajax... no serán aquí comentados ya que, aunque puede haber partes de código, funcionalidades adicionales o mejoras, escritas en estos lenguajes y que por lo tanto pueden formar parte de cualquier aplicación web, no son esenciales para la realización de nuestro conjunto de librerías.

Será evidente que todo aquel código que sea desarrollado para añadir nuevas funcionalidades a nuestras aplicaciones podrá ser añadido a nuestra librería independientemente del lenguaje en el que estén desarrollados siempre que se integren de forma adecuada.

4.5 HERRAMIENTAS DE DESARROLLO

Finalmente comentaremos aquí algunas herramientas que nos ayudarán en el proceso de desarrollo tanto de nuestra librería como de nuestra aplicación de ejemplo. Este conjunto de herramientas se ha intentado que sea lo más representativo posible y además que sean la mayoría de software libre. Principalmente para poder trabajar desde



un sistema Linux completo, aunque esto no es esencial ya que la programación web ofrece mucha flexibilidad a este respecto, pudiéndose realizar una aplicación desde Windows o desde Linux sin importar que la web final o el servidor en el que se trabaje esté montado en un sistema Linux o en Windows. En nuestro caso nuestro servidor estará montado en un sistema Linux como hemos venido explicando hasta ahora y la programación de la librería o de la web ejemplo podrá hacerse desde Windows o desde Linux según estemos más cómodos.

Por desgracia para los usuarios Linux, aún son muchas las aplicaciones que ‘dejan mucho que desear’ cuando se usan bajo Linux en comparación con sus homólogas en Windows. Puede ser este el caso del editor web NVU [18] que comentaremos aquí. Aunque en su versión más reciente se asemeja bastante a su homologo, Macromedia Dreamwever, aún son muchas las acciones que tenemos que realizar con ayuda de otros programas ya que desde el mismo no son tan cómodas o incluso otras no están implementadas.

No obstante, y dado que me gusta ofrecer siempre una alternativa a un sistema Windows, el editor que usaremos será NVU (realmente con cualquier editor de texto podremos realizar nuestro cometido).

4.5.1 phpPgAdmin phpPgAdmin [19] es un cliente web para bases de datos PostgreSQL y que requiere para funcionar un servidor web con PHP. Provee a los usuarios las opciones necearías para crear bases de datos, tablas, vistas... y consultar sus datos usando el estándar SQL. Además de estas funcionalidades básicas dispone de soporte para procedimientos almacenados, triggers y vistas; también se da soporte para algunas características novedosas de las versiones beta de PostgreSQL 8.0, así como un nuevo sistema de navegación y ayuda. Con esta herramienta se pueden suplir algunas carencias que podría presentar PostgreSQL en cuanto a la facilidad de manejar los datos en un escenario de pruebas y desarrollo. Nos será muy fácil comprobar qué datos tenemos en las tablas, hacer copias de estas, ver si el funcionamiento de la web es correcto... ya que la generación de tablas y vistas se hace de manera más gráfica y no mediante la línea de comandos del servidor.

Existe otro producto muy similar llamado phpMyAdmin, que provee las mismas funcionalidades a los usuarios del servidor de base de datos MySQL.

4.5.2 Mozilla Firefox vs Internet Explorer

La principal desventaja de la programación Web en PHP es que no disponemos de un compilador que nos permita corregir los errores y hacer un depurado de nuestro código. Para ello lo tendremos que hacer de forma mecánica y rudimentaria, probando y corrigiendo los errores encontrados.

Para probar nuestra herramienta Web, no tendremos más remedio que visualizar dicha web en el explorador. Actualmente son dos los exploradores que se están afianzando



más en los hogares de los internautas: Internet Explorer, de Microsoft, el cual se encuentra extendido en casi la totalidad de los equipos de los usuarios y Mozilla Firefox, principalmente para los usuarios Linux y cada vez más en usuarios Windows que buscan una alternativa.

¿Para qué explorador van dirigidas nuestras páginas Web? Pues aquí hay un pequeño problema. Principalmente hay que tener un dato en cuenta, casi la totalidad de los equipos que se venden en el mercado vienen con el sistema operativo Windows pre-instalado. Y con este maravilloso sistema operativo viene sin duda otro maravilloso programa, Internet Explorer. ¿Por qué es esto un problema? Pues en principio no tendría que serlo, ya que al venir el sistema operativo con un explorador web ya preinstalado facilita a los usuarios, sobre todo a usuarios con pocos conocimientos informáticos, que puedan entrar en la web de manera fácil y rápida.

Firefox respeta los estándares (o por lo menos en mayor medida), en cambio Internet Explorer no respeta gran parte de las especificaciones. Es más, habrá que gastar cuidado cada vez que Microsoft saque una nueva versión de su propio Explorador ya que, según mi experiencia personal, cada vez que surge una nueva versión de su explorador, aplicaciones que antes funcionaban sin problema, ahora simplemente… no funcionan.

¿Qué implica todo esto? Pues principalmente que una web optimizada para Internet Explorer, seguramente no lo estará para Firefox; y una página optimizada para Firefox, muy posiblemente no se vea nada parecida en Internet Explorer.

Como criterio personal, intentaremos optimizar la web para que se vea lo mejor posible en ambos exploradores, pero siempre dando prioridad a Internet Explorer; simplemente por el echo de que casi todos los usuarios que verán nuestra web lo harán desde este explorador.

Si deseamos saber más sobre estos dos exploradores:

− http://www.mozilla-europe.org/es/products/firefox/ − http://www.microsoft.com/spain/windows/products/winfamily/ie/default.mspx

4.5.3 NVU, Bluefish, Macromedia Dreamwever…

Para la programación de nuestra librería tan solo necesitamos de un editor de texto estándar. Si además incluye funcionalidad para poder subir los ficheros por ftp, gestionar proyectos e incluir opción de vista de diseño pues mejor que mejor. En entornos Windows, el programa más usado es Macromedia Dreamwever dado que incluye todas estas características. Principalmente lo usarán diseñadores ya que les permite usar la vista de diseño obteniendo unos resultados finales muy aceptables. En entornos Linux existen herramientas parecidas como son NVU [18] y Bluefish [20] que también disponen de múltiples utilidades y funcionalidades similares.

Si trabajamos un poco con ellos podemos ver rápidamente que dejan algo que

desear con respecto a su oponente Windows ya que no terminan de incluir todas las



funcionalidades o el trabajo con ellos no es tan intuitivo y cómodo. Para la tarea de programación, que no es tan exigente como la de diseñar una web, nos servirá cualquiera de ellos sin que echemos nada en falta.

Metodología Modelo-Vista-Controlador para la Programación Web en PHP Análisis de varias páginas Web


5. ANÁLISIS DE LA ESTRUCTURA Y FUNCIONAMIENTO DE VARIAS PÁGINAS WEB

5.1 INTRODUCCIÓN En este apartado pretendemos analizar distintas páginas web [5] de distintos ámbitos para llegar a poder identificar qué elementos son los que más se están usando en las páginas Web actuales, así como su organización y servicios prestados. Con este análisis orientaremos nuestra herramienta de programación para que cubra principalmente esos objetivos y facilitar así la programación de los tipos de Web que actualmente se están usando en la red. No trata ser un análisis muy exhaustivo ya que simplemente nos orientará en los elementos que más se están usando en Internet y basarnos en estos para realizar nuestro modelo básico.

Tipos de Web a analizar: • Inmobiliarias • Tiendas on-line • Catálogo de productos • Hoteles

Estas páginas serán elegidas al azar aunque intentando que sean lo más representativas de su sector como sea posible. Para no extendernos mucho en este aspecto, se analizará una web de cada tipo mencionado. Nos daremos cuenta que los elementos que pretendemos realizar serán los más básicos y que todas dispondrán de ellos.

Generalmente todos tenemos las mismas necesidades a la hora de exponer nuestra información, y normalmente se suele hacer siempre de la misma manera. Por ejemplo, para mostrar un listado de artículos que tenemos disponibles en nuestra tienda de juguetes, no tendremos más remedio que mostrar éstos artículos en forma de un listado; artículo por artículo y destacando algunas de sus características. Dado que habrán muchos artículos y no vamos a mostrar una página web infinita hacia abajo, tendremos que añadir números de página para poder pasar de una página a otra. Este simple ejemplo puede hacer ver que... por ejemplo, en una inmobiliaria también dispondremos de muchos artículos que mostrar al público; en este caso las viviendas. Las viviendas se mostraran en un listado, una debajo de otra, mostrando alguna foto y quizás alguna que otra información sobre el artículo en cuestión: 'chalet adosado'.

De aquí vemos que uno de los elementos comunes y que seguramente más se usa es el 'listado de artículos' y es precisamente esto lo que haremos a continuación, identificar estas estructuras, elementos o funcionalidades.



5.2 ANÁLISIS

Para realizar el análisis de las diferentes páginas Web nos fijaremos principalmente en varios aspectos:

− Estructura física de la web; En este apartado intentaremos identificar como está dividida la web, en zonas o secciones para organizar la información que se ofrece a los usuarios; ésto nos ayudará a definir una estructura de organización lo más estándar posible a la hora de realizar nuestro modelo.

− Secciones estáticas y dinámicas (con programación); nos ayudará a identificar las tareas que se realizan de forma estática, y por lo tanto que no requieren intervención de los programadores (serian realizadas por los diseñadores de la web) y las partes puramente de programación. Estas últimas secciones pueden ser difíciles de detectar ya que normalmente se encuentran integradas con el resto de la web.

− Tipo de funcionalidad básica que ofrece la web en cuanto al funcionamiento de la misma (buscadores, listados, detalles, registro de usuarios...); nos ayudará a crear nuestras librerías básicas orientadas a cubrir ese tipo de necesidades. En éste apartado no nos referimos al servicio que ofrezca la empresa sino a cómo usamos la web de cara a un usuario de Internet que desea navegar por ella.

− Como último punto, Anotar algunos aspectos del diseño y la presentación; principalmente para tener esto en cuenta en nuestras librerías y poder realizar la integración de los contenidos dinámicos y los estáticos o puramente de diseño de la manera más cómoda y eficiente posible.

5.2.1 Web Inmobiliaria www.unicasa.es

“Desde el principio, Unicasa puso ilusión y esfuerzo en ofrecer a las familias la mejor gestión en la compra-venta de inmuebles. Tras consolidarse en Málaga ciudad Unicasa comienza su expansión por la provincia, Andalucía, resto de Península y Canarias. Hoy día, con más 800 profesionales especializados y 150 oficinas, es número uno en Red de Agencias Inmobiliarias de España. Unicasa sigue trabajando día a día con la misma ilusión, confianza y compromiso, ofreciendo a las familias españolas todos los servicios de la Gestión Inmobiliaria” a) Estructura básica:

Distinguimos una cabecera superior en la que se encuentra el logotipo de la web y el menú de opciones/apartados.



Margen izquierdo con un buscador de viviendas en la parte superior y un enlace a otra zona de la web dentro del apartado ‘destacados’ en la parte inferior. Una parte central dividida en 2 zonas similares; una llamada ‘oportunidades’ en la que podemos ver 4 viviendas y otra llamada ‘vivienda nueva’ en la que hay 2 promociones.

Figura 5.1 Web de Unicasa.

Si navegamos por la web podemos apreciar que esta estructura se mantiene constante; cambiando evidentemente el contenido de la parte central y del margen izquierdo adecuándose a la opción/apartado elegida. b) Secciones:

Las secciones de ésta web están claramente definidas en la cabecera de la misma.

Comprar: Buscador en el margen izquierdo con algunos enlaces a información y un enlace a un programa para calcular la hipoteca. Más información estática en la parte central de la web.

Vender: Enlaces estáticos a información estática en el margen izquierdo y más información estática en la parte central. Algunos de los enlaces del margen izquierdo llevan a formularios para solicitar información y para dar de alta tu propiedad.

Financiación: Información estática en la parte central y enlaces en el margen izquierdo.

Naves y suelos: buscador en el margen izquierdo e información estática en el centro.

Quienes somos: información estática sobre la propia web.

Red unicasa: información estática.

Promociones: Margen izquierdo con enlaces estáticos a distintas localidades con promociones. En la parte central se diferencia entre una imagen y un listado de promociones pertenecientes a dicha localidad. Las promociones llevan a páginas estáticas de dicha promoción. Estas páginas de cada promoción se dividen en varias secciones detallando cada promoción.

Noticias: margen izquierdo con un enlace a las noticias que resulta un listado en la página central con opción a ver más detalles.

Empleo: listado de ofertas de empleo y enlace en el margen izquierdo a un formulario para el envío de curriculums. Zonas dinámicas:



Las zonas dinámicas claramente identificadas en esta web son las que contienen los buscadores de 'comprar' y 'naves y suelos'. Dichos apartados, tras realizar alguna búsqueda en el buscador se nos muestra un listado de viviendas las cuales cumplen dichos parámetros de búsqueda. En dicho listado podemos pulsar en cada vivienda para ver un detalle amplio de la misma.

La sección noticias también nos muestra un listado dinámico de noticias pudiendo recurrir a un detalle de las mismas.

La sección de promociones, aún pareciendo dinámica, no está tan clara ya que nos lleva a páginas html y listados que parecen creados para la ocasión y no se detectan componentes dinámicos (aunque guarden una estructura uniforme para cada uno de sus contenidos). c) Funcionalidad que ofrece:

La web principalmente nos da la posibilidad de realizar búsquedas, a través de los buscadores de las distintas secciones y nos ofrece los listados de propiedades que han dado como resultado de dicha búsqueda. Posteriormente en esos listados es posible ver más información de la propiedad que deseemos, mostrándosenos una nueva página con la información más completa de dicha propiedad.

Además, ofrece la posibilidad de rellenar un formulario para solicitar otro tipo de información que no se soporta en la base de datos o también para solicitar datos al usuario. Una de las acciones que se puede hacer con este tipo de formularios es dar de alta tu propia propiedad. El resto de la información en la web será contenido estático. d) Aspectos de diseño:

Tanto los buscadores como los listados de propiedades y los detalles de éstas están perfectamente integrados con el resto de la web. Mantienen los colores principales y se integra correctamente con otros componentes no dinámicos de la misma. No ocurre lo esto cuando intentamos imprimir un detalle de una propiedad ya que se podría haber mejorado un poco. e) Conclusiones:

No es una web en la que un usuario pueda entrar a una zona privada con lo que la única zona privada existente se dejará para la propia administración de los contenidos. Podríamos concluir que necesitaríamos para nuestro modelo, implementar la siguiente secuencia: Buscador à Listado de elementos encontrados à detalle del elemento así como un formulario público a través del cual poder solicitar información o insertar datos en la base de datos.



Formulario --> Solicitud de información --> Insertar datos en Base de datos

5.2.2 Tienda on-line

www.fnac.es

“La Fnac es el primer distribuidor europeo de productos de ocio cultural. Es un ejemplo único de alianza entre el comercio y la cultura que ambiciona dar a sus clientes la mayor información para ayudarles en su elección. Literatura, música, imagen, sonido y todas las tecnologías que se relacionan con estos campos: la Fnac ha desarrollado un concepto único, que descansa sobre tiendas físicas y virtuales, lugares de compra así como de asesoramiento, de descubrimiento, de encuentro y cultura.”

Figura 5.2 Página Web de Fnac a) Estructura básica:

La estructura básica de esta web es fácilmente reconocible y se mantiene así en casi todas sus secciones; disponemos de una cabecera superior, un margen izquierdo, un margen derecho, el cuerpo de la aplicación y un pié.

La cabecera de la web consta del logotipo y de una lista de pestañas que muestran las secciones en las que se divide o la componen. Esta cabecera, al igual que el pié (una pequeña línea de información) se mantienen en todas las secciones.

Se distingue un margen izquierdo, el cual se ofrece inicialmente un pequeño buscador, algunos enlaces estáticos y principalmente un listado de categorías y subcategorías, dependiendo de la sección en la que nos encontremos. Por ejemplo, en la sección música tendremos la categoría discos y las subcategorías: dvd musicales, ofertas para socios…

El margen derecho se dedica a habilitar opciones de una zona restringida y

dependiendo de la sección, un tipo de publicidad y anuncios distintos.

La parte central de la web se organiza en 2 columnas de bloques. Cada bloque es o un listado de artículos o un artículo solo con imagen y demás datos. Estos artículos pertenecen a la sección en la que nos encontramos e incluso pueden dar información de otros artículos readicionados.

La página principal de la web (index) es algo distinta ya que estos bloques con los artículos son de varias secciones distintas. También los bloques con listado de artículos son de distintas secciones pudiéndonos encontrar un bloque bajo el título ‘abajo los precios’ de películas y otro bloque bajo ese mismo título sobre discos o libros. b) Secciones:



Las secciones que componen esta web son:

Home, libros, música, cine, softw y juegos, imagen y sonido, informática y telefonía, revelado digital y espectáculos. Salvo los dos últimos, todos los anteriores presentan una estructura similar ya comentada en el apartado anterior; un listado de las subcategorías donde podemos encontrar los artículos, una parte central con ofertas o artículos destacados (o simplemente elegidos aleatoriamente) y el buscador también en el margen izquierdo.

Si pulsamos en alguna de las subcategorías del margen izquierdo, el cuerpo de la aplicación cambia para ofrecernos un listado con los artículos catalogados en dicha subcategoría. Las subcategorías no tienen un solo nivel sino que dentro de una subcategoría podemos encontrarnos de nuevo varias subcategorías.

A cada artículo, ya sea desde el listado como desde la página principal que sale al entrar en cada sección se puede solicitar más información, de manera que se muestre un detalle del artículo.

Tanto desde el listado de artículos como desde su detalle podremos añadirlo a nuestros artículos favoritos como añadirlo a la cesta de la compra para posteriormente realizar un pedido.

Desde el buscador se nos muestra un listado dividido en secciones de los artículos que cumplen los criterios de búsqueda. c) Funcionalidad que ofrece:

En esta web tendremos que distinguir entre una zona pública y una zona privada en la que se podrá entrar tras habernos registrado.

Desde la zona pública las principales funcionalidades que podemos observar son los listados de artículos y los detalles de estos mismos. Para llegar a ellos podemos hacerlo desde el buscador, desde la elección de secciones y subsecciones en el lateral o incluso desde las páginas principales de cada sección de la web, pinchando en la parte central en la descripción del artículo novedoso o destacado en ese momento. En la parte privada de la web tendremos:

− información del usuario − estado de pedidos que hemos realizado − listado de artículos favoritos que hemos ido visitando previamente desde la

parte pública de la web. − Nuestra cesta de la compra lista para iniciar el pedido

d) Aspectos de diseño:

En todo momento muestra un diseño simple, basado en los colores de cada sección. La web en sí no tiene nada que destacar a nivel de diseño, aunque sí se puede apreciar una gran cantidad de contenido “de golpe”, lo que puede provocar sensación de desorden.



e) Conclusiones:

Esta web dispone de muy pocas secciones estáticas ya que ofrece en todo momento información de los artículos que tiene almacenados en su base de datos. Se dispone de pequeños anuncios por todas las secciones. Se usa un pequeño detalle de determinados artículos que posteriormente nos llevará al detalle en sí del artículo. Estos pequeños detalles pueden suponerse que se harán a productos de forma aleatoria o a algún número de productos destacados (o marcados para salir en portada de cada sección) Podríamos implementar en portada de nuestra web: − Pequeños detalles de artículos destacados --> detalle completo o listado de artículos. − Usar hojas de estilo (CSS) para diferenciar las distintas secciones de nuestra web. − Definir un nivel organizativo de nuestros elementos, como por ejemplo, familias,

subfamilias, subsubfamilias... y finalmente el artículo en sí mismo.

5.2.3 Catálogo

www.leroymerlin.es

“Leroy Merlin es una gran superficie especializada en la venta de artículos de decoración, jardinería, bricolaje y construcción. Se trata de una oferta multiespecialista: el cliente puede encontrar todo lo necesario para el acondicionamiento, reparación y mejora del hogar. Todo bajo un mismo techo y con una extensa oferta de servicios, atención y asesoramiento. En Leroy Merlin, el cliente es nuestro invitado: respeto, consejo, cordialidad y ayuda es lo que los equipos de Leroy Merlin le proporcionamos en cada visita a nuestros centros“

La diferencia entre un catálogo de productos y una tienda online es muy poca. Simplemente, en la tienda se puede realizar un pedido de los productos seleccionados y pagar incluso directamente con tarjeta mediante un TPV (terminal de punto de venta). En el catálogo de productos, tan solo es posible ver qué productos ofrece la empresa incluso ver precios y demás detalles del producto, pero no se le facilita la opción al usuario de realizar una compra online con su correspondiente pago; los motivos de esta diferencia pueden ser la no confianza en ese medio de pago, o la preferencia por parte del empresario de llevar sus cuentas con algún programa determinado o incluso de manera no informatizada y quitarse de complicaciones (como dirían muchos) o también si los pedidos van a ser de grandes cantidades de dinero, un pago por TPV virtual puede no ser lo más aconsejable.

Figura 5.3 Página Web de Leroy Merlin

a) Estructura básica:

La web se divide en una cabecera superior en la que se muestran las secciones, un margen izquierdo que contiene las categorías para las que hay disponibles productos en el



catálogo y una parte central de contenido variable dependiendo de la sección en la que nos encontremos. Opcionalmente aparece un margen derecho. b) Secciones:

En la cabecera se muestran las secciones de la web: La empresa, tiendas, servicios, consejos, promociones, tu opinión y empleo. Todas salvo el apartado de consejos enlazan con páginas estáticas o con flash. Son secciones muy extensas con multitud de opciones anidadas con lo que en un momento dado el usuario puede sentirse un poco desorientado.

El principal contenido dinámico de la web se reparte entre los 'consejos' y el catálogo de productos en sí, el cual se accede desde el margen izquierdo. El margen izquierdo permanece igual en toda la web, sin cambiar al elegir alguna de las categorías.

Los 'consejos' consisten en una serie de documentos explicativos sobre un determinado tema. Se organizan en un primer nivel de ‘Proyectos’ los cuales tienen unas categorías (previsiblemente dinámicas). Dentro de cada categoría hay un número variable de tipos de consejos y dentro de cada tipo ya podemos encontrar un listado con los consejos asociados.

Los consejos pueden ser desde simples documentos pdf a elaboradas páginas web con numerosas imágenes y secciones propias. Dado que éstas páginas no parecen tener un formato común, es probable que se editen independientemente y luego se asignen a una categoría determinada, enlazando con su página principal. El catálogo de artículos parece estar mejor estructurado ya que al pulsar en alguna de las secciones del margen izquierdo, se carga en la parte central de la web una serie de grupos de familias y subfamilias. No todas las subfamilias tienen asignados artículos, pudiendo estar vacía simplemente con una descripción y una imagen o por el contrario contener consejos asociados.

Los consejos así como la familia en la que nos encontramos y sus subfamilias aparecen en el margen derecho.

Cuando una subfamilia posee artículos, estos aparecerán listados en el cuerpo de la web. Existen casos en los que para llegar a dicho listado tendremos que hacer algunas selecciones previamente, eligiendo algunos criterios de selección, con lo que podemos suponer que el artículo final cuelga de numerosos niveles de organización. c) Funcionalidad que ofrece:

La web ofrece principalmente un listado de familias o categorías principales desde las cuales se puede llegar de nuevo a varias familias con sus subfamilias correspondientes. También, una vez llegados a este punto se nos muestran opciones de selección para llegar finalmente al listado de artículos y desde el cual podemos ver un detalle del mismo. Igualmente ofrece un listado de consejos, organizados también en familias y categorías varias.



Finalmente se ofrece un detalle de cada artículo y una descripción detallada (página completa html) para los consejos. El resto del contenido que ofrece la web es estático. d) Aspectos de diseño:

Un diseño bastante simple, usando colores claros (blanco) en contraste con el verde. Intenta ser una web limpia y clara. La organización es correcta estando todo bastante estructurado, aunque en secciones con poco contenido dinámico puede parecer algo vacía. e) Conclusiones:

Presenta una estructura interna mucho más compleja que las anteriores analizadas ya que se puede suponer estructuras/niveles ilimitados en distintos puntos de la organización de la web.

Quizás tantos niveles organizativos puede liar un poco ya que el usuario puede no saber bien donde se encuentra ni como ha llegado ahí!

Para nuestro modelo puede ser una buena idea generar un máximo de 3 niveles de organización (para cuando necesitemos usar algún tipo de catalogo/tienda) 1er nivel: Familias 2do nivel: Subfamilias Familias -> Subfamilias -> Artículos 3er nivel: Artículos

También surge la idea de asociar unos artículos a otros, así como asociarlos con contenido de otro tipo de la web.

5.2.4 Hoteles

http://www.nh-hotels.com

“Los hoteles NH destacan por su calidad tanto en servicios como en instalaciones, con una decoración muy cuidada pensada para agradar a todos los gustos, uniforme y con la que el cliente se siente cómodo. Los establecimientos de NH Hoteles cuentan con las más avanzadas tecnologías para facilitar al cliente tanto la comunicación como el trabajo y el entretenimiento”



Figura 5.4 Página Web de NH Hoteles

Normalmente la web de un hotel será mucho más simple y amigable que la de un catálogo como el visto anteriormente. Su objetivo principal, alquilar habitaciones, requiere que el usuario encuentre rápidamente lo que busca sin marearlo innecesariamente. Además como cada vez hay que ser más competitivo en este sector, se suelen ofrecer servicios de valor añadido, tales como información útil al usuario, restaurantes, lugares que visitar... a) Estructura básica:

La web inicial se divide en una cabecera superior con el logotipo de la empresa y una zona habilitada para hacer login (acceder a la zona privada). Una subcabecera nos indica las secciones de la web. Justo debajo se encuentra lo que sería el cuerpo de la web y finalmente debajo de éste el pie, que consta tan solo de una línea con enlaces referentes a la empresa.

En algunas de las secciones, la subcabecera desaparece y aparece un margen izquierdo con las mismas secciones. También hay alguna sección en la que desaparece también el margen izquierdo dejando toda la zona central libre para el cuerpo de la sección elegida, que normalmente es una nueva página web completa, con sus enlaces propios e independientes de la estructura y secciones de la web principal.

En la parte central de la página nos encontramos con un buscador de hoteles dividido en 2 partes: la búsqueda del hotel y la reserva del hotel buscado por determinados días. Tenemos también un modulo de anuncios, otro de enlaces a información de la web,



varios módulos de enlaces a otras webs de NH Hoteles y un cuadro en el que podemos ver 4 promociones por cada una de las categorías de secciones disponibles. b) Secciones:

Las principales secciones que aparecen en la web son: Reservas, Hoteles, Ofertas y Promociones, NH World, Empresas, Agencias, Salones y Convenciones y una última sección de Restaurantes. De estas secciones comentaremos en primer lugar las 3 secciones centrales: NH World, Empresas y Agencias, junto con una sección que aparece en el lateral izquierdo que es Mi NH. La primera sección es un enlace externo a una web dedicada al mundo de NH y la cual no trataremos en este estudio. Las 3 siguientes secciones que mencionamos son zonas de acceso para usuarios; para Empresas, Agencias y Usuarios normales respectivamente. Estas zonas incluyen la posibilidad de identificarse en el sistema así como darse de alta si aún no se es usuario registrado.

En el margen izquierdo también aparece una sección titulada Ventajas, la cual es completamente estática sin contenidos dinámicos que haya que programar. Las secciones más interesantes para nosotros serán las restantes:

Reservas: El apartado Reservas contiene principalmente el buscador que encontrábamos en la home para realizar reservas de hoteles. También nos posibilitan hacer un seguimiento de nuestra reserva para ver su estado. La acción de reservar está dividida en 3 pasos; inicialmente localizamos el hotel, luego elegimos el tipo de habitación y posteriormente realizamos la reserva. Al buscar el hotel se nos muestra un listado con todos los encontrados y nos posibilitan seleccionar uno, así como ver el detalle del hotel con todos sus datos, una visita virtual e incluso el callejero. También se nos da la posibilidad de realizar una reserva rellenando un formulario.

Hoteles: Esta sección nos ofrece la posibilidad de buscar un hotel, ya sea por nombre o por ciudad. A continuación se nos presenta un listado de los hoteles encontrados, de los cuales podemos ver un detalle del mismo con toda la información e imágenes.

Ofertas y Promociones: una sección bastante llamativa ya que nos ofrece la posibilidad de escoger alguna promoción organizada en 4 secciones principales: escapadas, fines de semana, joven y club 60+ Nuevamente se nos ofrecen múltiples posibilidades según deseemos relax, ocio, cultura... y ofreciéndonos posteriormente información sobre la localidad o el evento en cuestión. Hay que destacar que éste apartado dispone de una maquetación totalmente distinta al resto de la web como si de otra web se tratase.

Salones y Convenciones: Se nos posibilita buscar un tipo de salón determinado y se nos muestra un listado de los salones disponibles para los que podemos solicitar reservas.

Restaurantes: Esta sección parece un aprovechamiento de la sección hoteles. Se puede buscar un restaurante, aunque lo que encontramos es el hotel que tiene el restaurante. Podemos sin embargo, ver detalles del restaurante del mismo. c) Funcionalidad que ofrece:



Básicamente se ofrecen buscadores mediante los cuales buscar hoteles y hacer las

reservas. También listados de hoteles junto con sus respectivos detalles. Se habilita el envío de formularios básicos para recabar cualquier tipo de información que no esté contemplada en la programación de la web. d) Aspectos de diseño:

La web presenta un diseño uniforme en la mayoría de sus secciones, habiendo otras que presentan una estructura y diseño totalmente independientes, incluso saliendo de su propio dominio. Esto no es un aspecto negativo ya que pretende hacer una web más dinámica y moderna. e) Conclusiones: Podemos apreciar al analizar este último tipo de web, que aún siendo totalmente distinta a las anteriores analizadas, presenta grandes similitudes. Definir nuestra librería para tratar objetos de forma general nos posibilitará realizar webs totalmente diferentes pero que comparten la misma estructura y organización. Artículos, Viviendas, hoteles... son distintos usos para un mismo concepto de elemento en nuestra librería.

5.3 CONCLUSIONES Y ESTRUCTURAS A IMPLEMENTAR Según hemos visto en los anteriores análisis, casi todas las Web analizadas presentan de una u otra manera estructuras parecidas. De ellas podemos concluir:

− Nuestra herramienta deberá facilitar la creación de una web dividiéndola en 2

partes; una zona privada de gestión y una parte pública. La zona de gestión tendrá que proporcionar de manera sencilla las herramientas necesarias para abastecer toda nuestra web de información actualizada. Dado que no hemos podido acceder a casi ninguna zona de gestión, trataremos de hacer, para nuestro modelo, una zona de gestión lo más simple posible, de manera que prime la facilidad a la hora de añadir los contenidos. Podrá tener o no el mismo aspecto en cuanto diseño que la zona pública aunque puede ser recomendable que la gestión de los contenidos de la web se vea claramente diferenciado para diferenciar bien ambas partes.

− Asimismo, la zona pública deberá poder presentarse en varios idiomas. En

principio con 2 idiomas será suficiente aunque se intentará que la inclusión de un tercer idioma no sea algo traumático. No todos los contenidos necesitarán ser traducidos e incluso el incluir contenido en cualquier otro idioma puede ser opcional de manera que no sea esto ningún impedimento o tarea difícil.

− Implementar una estructura física de la web (framework) adecuada para soportar la

mayoría de las organizaciones (estructuración) más comunes. Cabecera, cuerpo y pie de página – Cabecera, cuerpo, margen izquierdo y pie o cualquier otro tipo de estructuración.



− Para los contenidos estáticos (puramente páginas html sin programación alguna) no haremos nada en un principio. Estas páginas se crearán y se enlazarán a la página inicial (index). Tan solo nos centraremos en dar soporte a páginas con contenido dinámico, aunque también tendremos en mente la inclusión de pequeños módulos de información dinámica insertados en el código html en forma de pequeños anuncios/notícias/artículos destacados.

− Será también esencial realizar nuestra librería para que desde un primer momento

haga una diferenciación clara entre el diseño y la programación.

− Las estructuras más importantes que tendremos que soportar serán los buscadores de artículos, los listados y las páginas de detalle de dichos artículos. En la zona de administración dispondremos de listados de artículos con buscadores y con sus opciones respectivas para realizar altas, bajas y modificaciones como serían necesarios en cualquier administración de una aplicación.

− Cuando dispongamos de ‘elementos’ organizados en niveles lo haremos tan solo

en 3 niveles para disponer de una organización sencilla y clara: Familia, Subfamilia y Artículo.

Metodología Modelo-Vista-Controlador para la Programación Web en PHP Estructura de Directorios


6. ESTRUCTURA DE DIRECTORIOS

6.1 Introducción Para cumplir nuestro objetivo de generar un código limpio y bien estructurado definiremos una estructura de directorios en la que organizaremos toda nuestra aplicación. Separaremos el diseño de la programación en la medida de lo posible e intentaremos dividir nuestra aplicación en módulos, de manera que cada módulo tenga una estructura bien definida. Además distinguiremos la parte de administración de la Web (parte privada) de la parte visible a los usuarios de Internet (parte pública).

6.2 Organización del código Toda aplicación que generemos deberá tener una estructura principal de directorios que constará de las partes que se indican a continuación: db --> Contendrá todo nuestro código de la aplicación diseno --> Contendrá todos los ficheros de diseño diseno_privado --> Ficheros de diseño de la parte de administración admin --> Carpeta para redirigir al usuario a la zona de

administración index.php --> Página principal de la Web Toda la programación de nuestra web se incluirá en una carpeta llamada 'db'. Este nombre se ha elegido principalmente porque es muy corto (db sería una manera corta de decir 'database' o base de datos) teniendo en cuenta que ese directorio estará en todas las rutas a páginas de nuestra Web, mientras más corto sea menos habrá que escribir en la URL. He dividido la parte de diseño en dos, una para la parte pública de la Web, 'diseno' y otra para la parte privada o de administración 'diseno_privado'. A la hora de realizar una Web, tendremos que centrarnos principalmente en la parte de diseño destinada a la representación de cara al público. La zona de administración en principio puede estar mejor o peor presentada, pudiendo incluso cambiar tan solo en los estilos de un desarrollo a otro y dejarla intacta, lo que nos permite centrarnos en lo que realmente es más importante y distinto en cada proyecto. La carpeta 'admin' tan solo se usa para incluir dentro un fichero 'index.html' el cual hará una redirección a la página de acceso a la zona privada. Esto hará que nuestros usuarios no tengan que escribir rutas de acceso largas y difíciles de memorizar para acceder a la zona de administración de su sitio Web.

Una ruta de acceso a una zona privada podría ser, por ejemplo, como esta: http://www.miwebpersonal.com/db/usuarios/acceso_admin/login.php y con nuestro fichero redirigiendo a ese mismo sitio tan solo tendríamos que escribir: http://www.miwebpersonal.com/admin



Esto mismo puede aplicarse a otras muchas funcionalidades, como por ejemplo, el acceso a la zona de estadísticas de nuestra web. Las estadísticas suelen instalarse en el servidor y dependiendo de la aplicación usada puede tener una ruta más o menos compleja. Para nuestra estructura de directorios sería tan fácil como añadir una nueva carpeta 'estadísticas' y redirigir a la ruta adecuada dentro de su fichero 'index.html' correspondiente (al llamarse así, el servidor Web lo carga por defecto sin que tengamos que escribirlo). El último fichero será el más importante; será el punto de acceso a nuestra web. El documento inicial que será cargado por el servidor, 'index.php', que podrá también hacer alguna redirección o simplemente comenzar a cargar todos los contenidos directamente.

Dentro de nuestro directorio de código 'db', definiremos también una estructura común para todas nuestras aplicaciones. CodigoComun --> Código común para toda la aplicación. ConfiguraciónComun --> Configuración común de la aplicación. js --> carpeta que albergará todo tipo de javascripts, cgi's... modulo A --> Módulos en los que se dividirá la Web. modulo B .... modulo X Usaremos una carpeta en la que se añadirán las principales funciones de nuestra librería, 'CodigoComun'; se puede decir que ésta carpeta es la base de nuestra librería. Toda nuestra aplicación instanciará objetos de las clases que aquí definiremos, usarán las funciones de acceso a la base de datos, funciones de utilidad... en definitiva, será en ésta carpeta donde estarán las funciones más importantes y comunes a todos los módulos. La carpeta 'ConfiguraconComun' será, junto con la carpeta anterior, de las más importantes de nuestra estructura ya que incluirá la configuración básica y por defecto de toda la página Web en general (serán estas dos carpetas las que formarán el 'núcleo' principal de nuestra librería). Todos los módulos cargarán las configuraciones que aquí se definan de manera automática y será aquí donde se definirán los principales recursos y etiquetas que se usarán en la aplicación. 'js' será una carpeta en la que podremos incluir tanto pequeños módulos de Javascript como de cualquier otro lenguaje. Se puede decir que aquí será donde se incluirán los extras o añadidos que vayamos necesitando para nuestros desarrollos. Con las carpetas 'modulo i' nos referiremos a los módulos que formarán la aplicación. No tendrían ese nombre, sino otro más representativo de la funcionalidad del módulo en cuestión. Intentaremos por lo tanto dividir nuestra aplicación en módulos, de manera que podamos hacer una organización de éste tipo sin mezclar módulos ni funcionalidades distintas a nivel de ficheros. La organización interna de las carpetas 'CodigoComun', 'ConfiguracionComun' y 'js' dependerá de la complejidad que se llegue a alcanzar. En principio pueden contener directamente los ficheros que se vayan a incluir en ellas sin necesidad de generar más niveles de organización.



Los módulos que forman la aplicación también podrían ser incluidos en una carpeta previa llamada 'modulos', de manera que ésta los englobase a todos, pero por el contrario los dejaremos fuera, al mismo nivel que 'CodigoComun', 'js'... para no generar una url demasiado larga por culpa de tanta organización. La generación de una url demasiada larga puede ser perjudicial a la hora de posicionar una web en los principales buscadores. Posicionar una web es una técnica que se usa para hacer que dicha web salga más cerca de las primeras posiciones en los resultados de los buscadores cuando se realiza una búsqueda de unas determinadas palabras clave. Este tema no será tratado en éste proyecto. Dentro de cada módulo sí que necesitamos de nuevo otra estructura para organizar su contenido (ya que en cada uno de los módulos también intentaremos aplicar el patrón de diseño Modelo-Vista-Controlador (MVC) visto en capítulos anteriores y que ya desde nuestro primer nivel de organización hemos empezado a aplicar) Contendrán las siguientes carpetas: publica --> parte pública del módulo privada --> parte privada del módulo (destinada a la

administración) datos --> datos del usuario para este módulo imagenes --> imágenes del usuario para este módulo La distinción que hicimos inicialmente para el diseño y el diseño privado la haremos ahora, dentro de cada módulo, para la parte de programación. La carpeta 'publica' contendrá las funciones o funcionalidades que se ofrecerán en la parte pública de la Web y la carpeta 'privada' las respectivas para la zona de administración. Las carpetas 'datos' e 'imagenes' contendrán los datos e imágenes subidas por los usuarios (en caso de que esta funcionalidad exista en el módulo). Si hiciese falta crear una carpeta para subir vídeos o sonidos las crearíamos en este mismo nivel. Estas carpetas deberían estar protegidas a nivel de servidor para que, en el caso de que el contenido de estas sea privado, no sea accesible directamente desde la url. Dentro de las carpetas 'publica' y 'privada' habrá una organización similar: Codigo --> Código privado para este módulo. Configuracion --> Configuración privada para este módulo. Plantillas --> Plantillas correspondientes a este módulo. ficheros.php --> conjunto de ficheros PHP que generen la funcionalidad del módulo .... ficheros.php Si recordamos nuestra exposición en el capítulo 2 sobre el patrón de diseño Modelo-Vista-Controlador (MVC), será en este punto donde también intentaremos continuar la división; nuestro modelo y controlador estará localizado dentro de 'Codigo', carpeta que contendrá todo el código privado del módulo. La vista estará representada por las plantillas incluidas en 'Plantillas', ficheros que harán de unión entre la programación y el diseño (carpetas 'db' y 'diseno'). Para nuestra librería básica nos conformaremos con intentar separar lo máximo posible la vista del modelo y del controlador, ya que estos dos últimos pueden estar mucho más unidos.



Los ficheros .php serán los encargados de iniciar la lógica de control. Como mínimo habrá uno para cada funcionalidad distinta que se quiera ofrecer. Por ejemplo, si deseamos tener un listado, un buscador y un alta de usuarios tendremos los ficheros: listado.php, buscador.php y alta.php sin necesidad de escribir nada más para indicar de qué va a ser ese listado o qué va a buscar ese buscador ya que esa información estará ya indicada en el nombre del módulo en cuestión.

Por ejemplo, podríamos tener la siguiente estructura para un módulo de usuarios mostrada en el Ejemplo 6.1.

Ejemplo 6.1 Usuarios publica privada Codigo Configuracion Plantillas listado.php buscador.php alta.php datos imagenes

Las carpetas 'Codigo' y 'Configuracion' no requerirán más niveles de organización, pero 'Plantillas' la dividiremos nuevamente para recoger cada uno de los idiomas en los que haya contenido en el módulo; si disponemos de contenido en español y en inglés, dispondremos dentro de 'Plantillas' de dos carpetas más: 'es' y 'uk'. Dentro de cada una de ellas, irán los ficheros que harán referencia al contenido de las carpetas de diseño correspondientes. Estos ficheros serán páginas HTML que pueden contener código escrito en PHP; la idea es que sean incluidos por las funciones de la carpeta 'Codigo' y que a su vez estos incluyan los respectivos ficheros HTML correspondientes de las carpetas 'diseno' o 'diseno_restricted'. El porqué de este funcionamiento lo veremos más adelante.

Con esto tendremos la estructura completa para la zona de programación, aunque la zona de diseño, también tendrá que ser organizada de manera similar.

La organización de las 2 carpetas de diseño será paralela y se tratará en definitiva de añadir tantas carpetas como módulos se hayan creado en la parte de programación. Además contendrán carpetas específicas referentes al diseño propio en sí. Así quedarían tanto 'diseno' como 'diseno_privado': imagenes --> imágenes necesarias para el diseño css --> hojas de estilos para la zona correspondiente comunes --> ficheros HTML comunes a toda la zona (publica

o privada) modulo A --> ficheros HTML correspondientes al módulo

correspondiente en la parte de programación modulo B .... modulo X



Dentro de cada módulo existirán ya sólo las carpetas 'es' y 'uk' (en el caso en que ese módulo tuviese contenido en esos dos idiomas).

Para ver un ejemplo en concreto estudiemos el siguiente supuesto, que no es más

que una simplificación de uno de los casos que estudiamos en el Capítulo 5. Análisis de la estructura y funcionamiento de varias Web, apartado 5.2.3 Catálogo.

Ejemplo 6.2: Vamos a desarrollar un catálogo de productos básico en el cual cada

artículo está organizado en familias y subfamilias. La Web contendrá una página principal con algunos artículos en oferta, una página que hable de la empresa, un formulario de contacto y el catálogo de productos (listado de artículos con sus características y precio). Cada artículo dispondrá de su imagen pero no incluirá ningún otro tipo de documentación.

Las familias y subfamilias se generarán de manera dinámica desde la zona de

administración y cada artículo se asignará a una subfamilia concreta. Las acciones disponibles para la zona de administración serán:

− Familias: alta de una nueva familia, baja, modificación y listado de todas las familias

− Subfamilias: alta, baja, modificación y listado − Artículos: alta, baja, modificación, listado y un buscador

La funcionalidad que se mostrará en la zona pública de la Web será:

• Familias: aparecerán en un lateral en forma de listado • Subfamilias: al pinchar en una familia, se cargará en el cuerpo de la página un

listado de subfamilias (las que pertenecen a esa familia) • Artículos: al pinchar en una subfamilia se listarán todos los artículos pertenecientes

a ella. También se podrá pinchar en un artículo para ver un detalle ampliado o buscar un artículo en un pequeño buscador.

La página estará en 2 idiomas, aunque la zona de administración estará solo en

español. Representaremos las carpetas terminadas con la barra '/'. La estructura de nuestro proyecto sería más o menos como sigue.

db/ CodigoComun/ ConfiguracionComun/ js/ <-- no es necesario para este ejemplo Familias/ publica/ Codigo/ Configuracion/ Plantillas/ es/ listado.html uk/ listado.html listado.php <-- única funcionalidad pública privada/ Codigo/ Configuracion/ Plantillas/ es/



alta.html baja.html modifica.html listado.html alta.php baja.php modifica.php listado.php datos/ <-- sin necesidad de uso imagenes/ <-- sin necesidad de uso Subfamilias/ <-- igual que Familias Articulos/ publica/ Codigo/ Configuracion/ Plantillas/ es/ listado.html detalle.html buscador.html uk/ listado.html detalle.html buscador.html listado.php detalle.php buscador.php privada/ Codigo/ Configuracion/ Plantillas/ es/ alta.html baja.html modifica.html listado.html buscador.html alta.php baja.php modifica.php listado.php buscador.php datos/ <-- no es necesario su uso imagenes/ <-- almacenará las imágenes de los

artículos diseno/ imagenes/ css/ comunes/ es/ index.php <-- contendrá código PHP para poner las ofertas empresa.html <-- simple página en HTML contacto.html uk/ index.php empresa.html contacto.html



Familias/ es/ listado.html <-- listado con los textos en

español uk/ listado.html <-- mismo listado pero con textos

en inglés Subfamilias/ es/ listado.html uk/ listado.html Artículos/ es/ listado.html detalle.html buscador.html uk/ listado.html detalle.html buscador.html diseno_privado/ imagenes/ css/ comunes/ es/ Familias/ es/ alta.html baja.html modifica.html listado.html Subfamilias/ es/ <-- igual que Familias Articulos/ es/ alta.html baja.html modifica.html listado.html buscador.html admin/ index.html index.php

Con esta organización se puede ver claramente donde estarán los ficheros con programación PHP y donde estarán los ficheros de contenido puramente gráfico o de diseño HTML.

También podemos localizar rápidamente un fichero escrito en un idioma determinado, a la vez que se hace muy fácil el añadir un tercer idioma.

Podemos apreciar de manera instantánea dónde se encontrarán los ficheros de un determinado módulo, así como saber dónde se encontrarán los ficheros correspondientes a la zona privada de administración o a la zona pública de la Web.

Metodología Modelo-Vista-Controlador para la Programación Web en PHP Recursos y Etiquetas


7. EL FICHERO DE RECURSOS Y LAS ETIQUETAS

7.1 INTRODUCCIÓN Toda la configuración de nuestra aplicación se realizará mediante un fichero de ‘recursos’. Un recurso para nosotros será una variable global, junto con su valor, definida para establecer un determinado comportamiento en algún módulo, definir valores por defecto, etiquetas estándares… y en definitiva, la configuración de nuestra aplicación.

7.2 RECURSOS Y ETIQUETAS Crearemos un fichero de recursos que llamaremos ‘recursos.inc.php’. Estas extensiones nos vienen a indicar que el fichero no es un PHP en el que se vaya a iniciar una determinada acción, sino que tan solo será un fichero que se usará para ser incluido dentro de otro fichero PHP en este caso. Los ficheros de clase de nuestra librería de funciones también tendrán esta misma extensión ya que no podrán ser ejecutados directamente sino usados por algún fichero PHP inicial.

El fichero de recursos principal se almacenará en la carpeta ‘/db/ConfiguracionComun’ y los ficheros de recursos privados correspondientes a cada uno de los diferentes módulos serán almacenados en la carpeta ‘Configuracion’ dentro del módulo concreto.

Haremos una separación entre recursos y etiquetas de manera en el fichero de recursos tan solo haya recursos y todas las etiquetas se almacenen en otro documento, como por ejemplo, ‘etiquetas_es.inc.php’ o ‘etiquetas_uk.inc.php’ para el idioma ‘uk’ si existiese este en nuestra Web. Un documento de etiquetas tan solo contendrá variables en las que se almacene el texto que se va a mostrar en la web para esa etiqueta, ya sea en mensajes concretos, como títulos de secciones, textos descriptivos…

Tanto los recursos como las etiquetas contendrán líneas de la forma

'variable=valor', siendo la variable el nombre de la etiqueta o del recurso y el valor el texto que ésta contiene o el valor del mismo.

7.3 RECURSOS.INC.PHP Para definir los recursos de nuestra aplicación lo que haremos será crear una variable global llamada ‘RECURSOS’. La información que podemos configurar desde el fichero de recursos puede ser muy amplia; a continuación mostraré un ejemplo de un fichero de recursos con diversas secciones (Ejemplo 7.1).

Como podemos ver, la información dentro de un fichero de recursos puede ser bastante amplia y variada; por lo menos en el fichero de configuración común.



Ejemplo 7.1 /* Recursos sobre la aplicación */ $RECURSOS["direccionHttp"] = "http://gtci.uma.es"; /* como se llaman las carpetas principales de nuestra librería */ /* junto con su ruta relativa */ $RECURSOS["Codigo"]="./Codigo"; $RECURSOS["CodigoComun"]="../../CodigoComun"; $RECURSOS["Configuracion"]="./Configuracion"; $RECURSOS["ConfiguracionComun"]="../../ConfiguracionComun"; $RECURSOS["Plantillas"] = "./Plantillas"; /* nombre de las carpetas publicas y privadas de diseño */ $RECURSOS["diseno"] = 'diseno'; $RECURSOS["diseno_privado"] = 'diseno_privado'; /* datos referentes a la base de datos que usaremos */ $RECURSOS["database"] = "gtci"; $RECURSOS["host"] = "localhost"; /* FRAMEWORK y CSS para parte privada */ $RECURSOS["framework_privado"] =

"../../../".$RECURSOS["diseno_privado"]."/comunes/FRAMEWORK.htm"; $RECURSOS["css_privado"] =

"/".$RECURSOS["diseno_privado"]."/css/css_privado.css"; /* FRAMEWORK y CSS para parte publica */ $RECURSOS["framework"] =

"../../../".$RECURSOS["diseno"]."/comunes/FRAMEWORK.htm"; $RECURSOS["css_publico"] =

"/".$RECURSOS["diseno"]."/css/css_publico.css"; /* direcciones url de acceso */ $RECURSOS["url_sinPermiso"] = "../../acceso/publico/login.php"; // URL inicio para los usuarios $RECURSOS["url_inicio"] = "../../inicio/publico/index.php"; // URL inicio para el administrador $RECURSOS["url_inicio_privado"] = "../../inicio/privado/index.php"; …

Por explicar alguna de las líneas de nuestro ejemplo, estos 3 últimos recursos que se han definido se refieren a la ruta a la que habrá que saltar en el proceso de acceso a la zona privada de la aplicación. Si el usuario no está ‘logueado’, en el intento de acceder a la aplicación, se leerá el recurso ‘url_sinPermiso’ el cual tiene la ruta del fichero para hacer ‘login’ en la aplicación. Si el usuario ya está ‘logueado’ (lo acaba de hacer) se le redirigirá al inicio público para usuarios registrados y si fuese un administrador se le redirigirá al inicio privado.

Todas las rutas han de indicarse de forma relativa para que nuestra aplicación funcione correctamente. Esto hace que los recursos puedan ser usados desde cualquier parte de la aplicación; por ejemplo, si intentamos acceder al listado de un módulo de la aplicación y el usuario no está ‘logueado’, ese módulo leerá el recurso url_sinPermiso y el resultado que obtendrá será que el usuario tiene que ser redirigido a la dirección ../../acceso/publico/login.php. Si tenemos en cuenta que hemos accedido al listado privado de un módulo A, nos encontraremos en esta



ruta /db/moduloA/privado/listado.php con lo que si bajamos 2 niveles ../../ nos encontraremos al mismo nivel que moduloA y a ese mismo nivel deberá existir el módulo encargado de los accesos a la aplicación, es decir, la estructura deberá ser la siguiente: /db/

acceso/ publico/ login.php privado/ moduloA/ publico/ privado/ listado.php

Si fuese necesario indicar alguna configuración específica para cada módulo, esto se indicará en el fichero de recursos de cada módulo que se encontrará dentro de la carpeta ‘Configuracion’ que habrá dentro del mismo. Evidentemente una de las principales acciones que tendrá que realizar el módulo, antes de comenzar a ejecutar ninguna acción, será la de cargar los ficheros de recursos. Primero tendrá que cargar el fichero de recursos común, y luego cargará el fichero de recursos específico para el módulo, por si algún recurso debe ser modificado, al llamarse igual, simplemente será sobrescrito por el valor requerido para ese módulo.

Un pequeño fichero de recursos para un módulo en concreto podría ser el siguiente. Ejemplo 7.2 <?php // CONTROL DE ACCESO - Acceso a los módulos $RECURSOS["datos_bRequiereAuth"] = "true"; // se requiere autenticac. $RECURSOS["datos_bNobodyOk"] = "false"; //nobody no puede entrar //admin tiene acceso a todo sin necesidad de este recurso; los // usuarios normales no tienen acceso a este módulo $RECURSOS["USUARIO"]="NO"; // tabla que se usará en el módulo, campo clave de la tabla y // variable que se pasará por la url (campoClaveCGI) $RECURSOS["db_tablaBD"] = "noticias"; $RECURSOS["db_campoClaveTabla"] = "clave"; $RECURSOS["db_campoClaveCGI"] = "c_noticia"; ?>

7.4 ETIQUETAS Las etiquetas tienen una función muy similar a los recursos, aunque con ellas no se configurará el funcionamiento de la aplicación sino que tan solo se definirán los textos que se van a usar. Esto es de gran utilidad ya que es muy habitual definir los textos directamente en el documento PHP y cuando posteriormente es necesario cambiar algún mensaje, algún texto de un menú, o simplemente parte de contenido de la web, habrá que recorrer todos los ficheros PHP que puedan contener dicho texto para modificarlos.



Al estar todos los textos (normalmente todos los que se usarán en las zonas dinámicas de la web ya que los textos en páginas estáticas no modificables con el uso de la aplicación se escribirán directamente en los documentos HTML) definidos en un único documento, cualquier modificación de dichos textos implica únicamente modificar el fichero de etiquetas y no tendremos que recorrernos toda la aplicación buscando los textos en el código. Asimismo, podemos entregar nuestro fichero de etiquetas a un traductor y traducirlas a cualquier idioma; posteriormente renombraremos el fichero con el sufijo adecuado ('uk', 'it', 'de'...) y dispondremos de nuestra aplicación traducida sin necesidad de tocar ni una sola línea de código.

Un ejemplo de un fichero de etiquetas en español será: Ejemplo 7.3 $ETIQUETAS["form_nombre"] = "Nombre Proyecto:"; $ETIQUETAS["form_cif"] = "CIF:"; $ETIQUETAS["form_b_baja"] = "Dar proyecto de baja"; $ETIQUETAS["form_localidad"] = "Localidad:"; $ETIQUETAS["form_provincia"] = "Provincia:"; $ETIQUETAS["form_persona_contacto"] = "Persona de contacto:"; $ETIQUETAS["form_cp"] = "CP:"; $ETIQUETAS["form_fecha_inicio"] = "Fecha inicio:"; $ETIQUETAS["form_fecha_fin"] = "Fecha fin estimada:"; $ETIQUETAS["alta_ok"] = "Alta realizada con éxito"; $ETIQUETAS["no_alta"] = "El alta no ha podido ser realizada"; $ETIQUETAS["modificacion_ok"] = "Modificación realizada con

éxito"; $ETIQUETAS["no_modificacion"] = "La modificación no ha podido ser

realizada"; $ETIQUETAS["eliminacion_ok"] = "Baja realizada con éxito"; $ETIQUETAS["reg_no_existe"] = "Registro no encontrado"; ...

Las etiquetas que empiezan por form_ serán las que se usen para los formularios de alta, baja o modificación. Las demás serán para mensajes informativos en este caso.

Al inicio de la aplicación cargaremos todas las etiquetas y posteriormente usaremos una función que llamaremos getRecurso($nombre) que nos servirá para obtener un recurso ya cargado. Será tan simple como: function getRecurso($nombre){ $ret = $this->RECURSOS["$nombre"]; if ($this->RECURSOS["$nombre"] == "") $ret = "Recurso \"$nombre\" no encontrado"; return $ret; } Y para cargar previamente todos los recursos llamaremos a cargaRecursos().Con esta función primero cargamos los recursos comunes y posteriormente los privados y los asignaremos a nuestro array de recursos.



Recursos y etiquetas nos facilitarán el trabajo diario, e incluso, llegados a un nivel de automatización elevado, se podrían crear módulos completos tan solo cambiando los ficheros de recursos y de etiquetas.

Metodología Modelo-Vista-Controlador para la Programación Web en PHP Framework y Plantillas


8. EL 'FRAMEWORK' Y LA CARPETA 'PLANTILLAS'

8.1 INTRODUCCIÓN A continuación se explicará cómo separaremos la programación del diseño utilizando un 'framework' y la carpeta 'Plantillas' cuya funcionalidad quedó sin explicar en el capítulo anterior. Ésta separación es a su vez el nexo de unión entre estas 2 partes ya que será éste el medio por el que se indicará desde programación qué parte de diseño usar.

8.2 FRAMEWORK Nosotros usaremos el término 'framework' en el sentido de 'esqueleto' o estructura organizativa mediante la cual ordenaremos los contenidos de nuestra web. Para nosotros 'framework', término que se usa también para definir un tipo de arquitectura de software, será tan solo un documento HTML con código PHP incrustado (o directamente un documento PHP). La idea es que nuestra aplicación, al igual que vimos en el Capítulo 5. Análisis de la estructura y funcionamiento de varias Web, esté dividida en secciones organizativas como podrían ser: cabecera, margen izquierdo, parte principal de la aplicación (que se situará en el centro y la llamaremos main) y pié. Dado que cada aplicación que vayamos a desarrollar puede tener una estructura diferente, será en éste documento, y solo en éste donde se definirá dicha estructura.

El documento framework será común a toda a aplicación ya que normalmente la estructura de la web se mantendrá constante. Si esto no fuese así, por lo menos será común a alguna de sus partes (parte pública o parte privada) por lo que este documento podrá estar almacenado en la carpeta /diseno/comunes o /diseno_privado/comunes o incluso en ambas si definimos 2 estructuras distintas para ambas zonas. El fichero donde definiremos toda ésta estructura se llamará framework.html.

El documento framework podrá hacer esta división con tablas o con elementos 'div', ambos son elementos comunes de HTML; un ejemplo de división de una web en cabecera, main y pié podría verse en un fichero framework con el código del Ejemplo 8.1. Este fichero está simplificado y sin indicar ningún tipo de estilos, colores, tamaños... Básicamente el resultado que obtendríamos al visualizarlo en un explorador serían los textos siguientes:

cabecera main pie



Ejemplo 8.1 <html> <head> </head> <body> <table> <tr> <td>cabecera </td> </tr> <tr> <td>main </td> </tr> <tr> <td>pie </td> </tr> </body> </html>

Podemos igualmente realizar el 'framework' con 'div' y tendríamos la siguiente estructura: Ejemplo 8.2 <html> <head></head> <body> <div>cabecera</div> <div>main</div> <div>pie</div> </body> </html> Obtendríamos un resultado por pantalla similar, pero no igual. Los elementos 'div' de HTML son elementos más avanzados que las tablas y requieren que se indiquen valores para algunas de sus diversas propiedades. Estos valores se los indicaremos mediante las hojas de estilos CSS [9] y mediante estas mismas podremos definir dónde queremos que salga su contenido (al principio de la página, al pié...), con qué organización (uno encima del otro, al lado...), si disponen de márgenes, colores, tamaños determinados... Para nuestro proyecto podremos usar indistintamente una forma u otra, aunque la opción de utilizar 'div' es más limpia, potente y actual.

La figura 8.1 muestra cómo podría ser nuestro ‘framework’, habiendo muchas más posibilidades. La opción (E) será la que usemos ya que es la que puede darnos mejores resultados. Ocasionalmente se podrá usar un margen derecho o en otras ocasiones usar solo el margen derecho y no el izquierdo.



Figura 8.1. Diferentes tipos de ‘Frameworks’

8.3 PLANTILLAS La manera en la que indicaremos qué contenido es el que irá en cada una de las secciones de nuestro 'framework' será mediante la inclusión de un fichero u otro en dicho lugar. Estos ficheros son las plantillas de las que hablábamos anteriormente; una plantilla será básicamente un trozo de la página, generalmente realizada por los diseñadores y que nos entregarán para que las usemos en nuestras páginas dinámicas para formar en conjunto el diseño de web que tan mimosamente habrán realizado. Esta inclusión la haremos con la instrucción include de PHP y el fragmento de código que se crearía seria como el siguiente: Ejemplo 8.3 ... <tr> <td> <?php include(“/diseno/comunes/cabecera.html”); ?> </td> </tr> ... Rápidamente nos daremos cuenta que si nuestro 'framework' va a ser común para toda nuestra aplicación, e incluimos las plantillas de esta manera, indicando la ruta directamente a la parte de diseño correspondiente, nos podemos encontrar con un problema. En éste ejemplo, si indicamos que la cabecera será ese fichero (dentro de diseno), lo será para toda la aplicación; algo que puede parecer completamente correcto, pero si por el contrario el fichero que hubiese indicado fuera /diseno/comunes/main.html, ¿significa esto que toda nuestra aplicación tendrá la misma parte central?



Cada módulo tiene que tener la posibilidad de indicar qué ficheros van a formar las partes del 'framework' para especificar una u otra función. Por ejemplo si estamos haciendo un listado, en la parte central de la aplicación (main) habrá un listado de elementos, pero si estamos realizando el alta de algún dato, posiblemente en la parte central, lo que haya sea un formulario. Crearemos una función cuyo objetivo será devolver la ruta de la plantilla adecuada a ser cargada en ese módulo llamada getPlantilla(“nombre_plantilla”). De esta manera, nuestro fichero 'framework' quedará así (lo veremos ahora con elementos div): Ejemplo 8.4 ... <div><?php include(getPlantilla("cabecera"))?></div> <div><?php include(getPlantilla("main"))?></div> <div><?php include(getPlantilla("pie"))?></div> ...

Como la función getPlantilla pertenecerá a alguna clase, la llamada final a ella será del estilo: ...include($this->getPlantilla(“cabecera”))... aunque esto ya lo definiremos en la librería de funciones.

De este modo nuestro fichero 'framework.html' no tiene porqué cambiar y podemos olvidarnos un poco de su existencia, ya que tan solo lo crearemos al principio de nuestro desarrollo y no tendremos que tocarlo en ningún otro momento.

Aquí entra ahora en juego la carpeta 'Plantillas' que se incluirá dentro de cada módulo. Ésta carpeta será la encargada de facilitar la tarea a la función 'getPlantilla' ya que será aquí donde ésta función tendrá que consultar para saber que cabecera, margen izquierdo o pié utilizar. Para conseguirlo lo que haremos será muy simple; crearemos una función dentro del código de control de nuestro módulo, la cual se encargue de indicar cual de los ficheros almacenados en el directorio 'Plantillas' es el que corresponde con cada una de las secciones definidas en el 'framework'. De éste modo cada módulo puede poner una cabecera, margen o pié distintos sin tener que cambiar el fichero 'framework', sin necesidad de indicar un 'framework' para cada módulo y realizando esta asignación en una única función. Llamaremos a esta función 'inicializa()' y contendrá un código similar a este: Ejemplo 8.5 function inicializa() $this->infoPlantilla["cabecera"] = "cabecera.htm"; $this->infoPlantilla["menu_izquierdo"] = "margen_izquierdo.htm"; $this->infoPlantilla["cabecera_main"] = "cabecera_main.htm"; $this->infoPlantilla["main"] = "listado.htm"; $this->infoPlantilla["pie_main"] = "pie_main.htm"; $this->infoPlantilla["pie"] = "pie.htm"; }



Crearemos un array asociativo llamado 'infoPlantilla' el cual almacenará los nombres de los ficheros (que se encuentran dentro de 'Plantillas') correspondientes a cada una de las partes definidas en nuestro 'framework'. La función 'getPlantilla' leerá este array.

En el código del ejemplo podemos ver que para la parte correspondiente del menú izquierdo, habrá que incluir en el fichero 'framework' el documento HTML llamado 'margen_izquierdo.htm'.

He querido diferenciar estos ficheros HTML situados en la carpeta 'Plantillas' de los situados en las carpetas de diseño. A los ficheros de 'Plantillas' los nombraremos con extensión '.htm' y a los ficheros dentro de 'diseno' o 'diseno_restricted' con extensión '.html'. Ambos formatos son considerados por los exploradores como documentos HTML y de idénticas características, pero para nosotros, a nivel lógico serán documentos distintos. La función de los ficheros dentro de 'Plantillas' será tan solo la de incluir el fichero correspondiente de las carpetas de diseño y contendrán código como sigue: <?php include ("../../../diseno/comunes/cabecera.htm"); ?> Con esto seleccionamos qué documento HTML de la carpeta 'diseno' usaremos. Puede parecernos que hacemos un pequeño rodeo para leer el documento HTML final, pero si intentásemos hacer que la función 'getPlantilla' leyera directamente de las carpetas de diseño, tendríamos que indicarle si queremos leer los HTML de la parte pública o de la privada, además del idioma del documento a cargar. También tendríamos que complicar algo más la función 'inicializa' definiendo cabecera_publica y cabecera_privada o incluso cabecera_publica_es, cabecera_publica_uk, cabecera_privada_es, cabecera_privada_uk...

Con el funcionamiento que hemos descrito, nuestra función 'getPlantilla' tan solo necesitará saber en qué idioma nos encontramos para localizar rápidamente que documento tiene que leer. Ejemplo 8.6 function getPlantilla($plantilla){ return “./Plantillas/”. $this->idioma . "/".

$this->infoPlantilla["$plantilla"]; }

Usaremos una variable global '$idioma' para que almacene en cada momento el idioma en el que hay que mostrar la página. Así, según el idioma en el que nos encontremos, la función generará una u otra ruta para cargar el archivo adecuado: Idioma 'es' --> ./Plantillas/es/cabecera.htm Idioma 'uk' --> ./Plantillas/uk/cabecera.htm

Como los ficheros dentro de 'Plantillas' siempre se llamarán igual, toda esta lógica de control permanecerá igual y no será necesario hacer ninguna modificación, por ejemplo, si deseáramos añadir un tercer idioma. Será en estos ficheros donde realizaremos los cambios que necesitemos y tan solo tendremos que asegurarnos que el fichero que intentamos cargar desde las carpetas de diseño existan realmente, ya que la creación de éstos puede no correspondernos a nosotros. Tanto con el 'Framework' como con las plantillas tendremos la estructura de nuestra página creada y bien definida en cada módulo.

Metodología Modelo-Vista-Controlador para la Programación Web en PHP Funciones básicas


9. FUNCIONES BÁSICAS

9.1 INTRODUCCIÓN En éste capítulo explicaremos cuales van a ser las funciones básicas que vamos a implementar en nuestra librería. Para el desarrollo tan solo nos bastará definir las clases necesarias para crear una pequeña aplicación Web, es decir, para que podamos crear un módulo básico como esquema de referencia a partir del cual podamos 'clonar' y generar los otros muchos módulos que necesitaremos en nuestros desarrollos. Definiremos que funciones deberá implementar un módulo común, uno para facilitar el acceso a la zona de administración y en general todas las clases básicas necesarias para ello.

9.2 FUNCIONALIDAD DE UN MÓDULO COMÚN Nuestro módulo básico, del cual partiremos, necesitará implementar funciones tanto para la zona de gestión de la aplicación como de la parte pública de la Web:

Para la zona de gestión de la aplicación Web realizaremos:

− Alta de un elemento: Se facilitará la tarea de mostrar un formulario para realizar el alta de un elemento en nuestra aplicación. Este elemento puede ser desde un artículo de una tienda hasta un hotel o un documento de una revista. Evidentemente el alta de un elemento finalizará con la creación de este elemento en la base de datos que usemos para nuestra aplicación.

− Modificación de los datos ya almacenados de un elemento: Esta tarea es similar al alta, pero con la peculiaridad de que los datos ya estarán cargados y tan solo tendremos que modificarlos.

− Baja de un elemento: Debemos tener la posibilidad de eliminar un elemento de la base de datos.

− Listado de los elementos almacenados: Podremos listar los elementos que hemos ido creando; se listarán algunas de sus características y otras por motivo de espacio quedarán ocultas para ser mostradas en una vista más detallada del artículo. Dado que se trata de una zona de gestión, esta vista más detallada puede ser ni más ni menos que la misma visualización de los datos del elemento a la hora de realizar una modificación.

− Buscador de elementos: En casos en los que la cantidad de elementos almacenados en nuestra base de datos es muy elevada, necesitaremos poder realizar búsquedas de nuestros elementos con el fin de poder consultar algún dato o modificarlos.

Funciones secundarias: • Realizar un listado en formato imprimible de los elementos: Puede ser de gran utilidad

tener la posibilidad de realizar una impresión de los datos que tenemos almacenados. Posiblemente si usamos las opciones del explorador para realizar una impresión de pantalla, los resultados no sean muy buenos. Posibilitaremos el realizar un listado en PDF o en EXCEL para realizar la impresión o el uso de estos datos desde otras aplicaciones.



Para la parte pública de la Web necesitaremos:

− Listado de los elementos del módulo: Dado que estamos en la zona pública, ésta puede ser muy diferente a la zona de administración. Se necesitará generar un listado con una maquetación diferente y más 'vistosa' de los elementos de nuestro sistema.

− Detalle de los elementos: Por el mismo motivo, generaremos una vista detallada de un articulo pero con una maquetación algo más cuidada para que los usuarios puedan consultar todos los datos de un elemento de una manera más cómoda y sin posibilidad de modificar nada.

− Búsqueda de elementos: Al igual que la búsqueda de la zona de administración, se generará un buscador de elementos el cual será más o menos complejo y que podrá estar en cualquier posición.

9.3 FUNCIONALIDAD DEL MÓDULO DE ACCESO El módulo de acceso tan solo tendrá parte pública, ya que será usado para 'loguearse' en la aplicación y hasta ese momento el usuario no tiene permisos para acceder a las partes privadas. Los datos del 'login' se guardarán en variables de sesión del explorador y se perderán al cerrar la ventana o al cerrar la sesión. Se definirán 2 acciones básicas para este módulo: − Login: Se posibilitará a los usuarios el introducir su 'login' (su nombre de acceso) y su

'password' para acceder al sistema. Una vez que el usuario es validado, será redirigido a la zona de inicio de la parte de administración de la aplicación.

− Logout: Una vez que el usuario desee terminar de usar la aplicación se le dará la posibilidad de cerrar la sesión, con lo que se eliminan todas sus variables de sesión y se sale de la zona de gestión para permitir que otro usuario acceda a ella. Nuestra aplicación permitirá múltiples accesos para un mismo usuario, con lo que con un único usuario pueden entrar a administrar la aplicación varias personas incluso en el mismo momento.

Si un usuario intenta acceder al sistema pero no introduce correctamente los datos de acceso, o simplemente no los conoce, será redirigido a una página para indicarle que no tiene permisos adecuados. Esta página será muy similar a la página inicial de 'login'. Se podrá implementar el acceso de usuarios con distintos niveles de privilegio dentro de una aplicación, de manera que un usuario administre una sección de la Web y otros otra (o las mismas pero con más o menos funcionalidades). El método de acceso será el mismo, pero cambiará la comprobación de los datos de acceso de manera que se detectará qué permisos dispone el usuario y se le redirigirá a una u otra zona de inicio privada.



9.4 LIBRERÍA BÁSICA Las funciones que han de ofrecerse desde la base de nuestra librería han de ser amplias y muy variadas, ya que tienen que dar soporte a las funciones de cada uno de los módulos a implementar mencionados anteriormente. Formarán el núcleo de nuestra librería, se incluirán en la carpeta 'CodigoComun' y estarían compuestas por todas las clases de más bajo nivel que crearemos. Se tendrán que tratar los siguientes temas: − Controlar el inicio de la aplicación en lo referente a variables de sesión, phplib y

autenticación. − Realizar las funciones básicas para el manejo de recursos, plantillas, idiomas, manejo

de url y saltos y errores. − Clases necesarias para la generación de formularios y listados y para realizar su

tratamiento adecuado. Alta de datos, bajas, modificaciones, búsquedas y listados han de ser implementados.

− Clases para facilitar el chequeo de datos, funciones de utilidad, funciones de bases de datos...

− Clases para la creación de documentos PDF, ficheros EXCEL y envíos de emails desde el PHP.

− Cualquier otra clase o función necesaria para realizar las tareas anteriormente mencionadas.

9.5 DESCRIPCIÓN DE CLASES EN CODIGOCOMUN A continuación, y con el fin de no incluir aquí miles de líneas de código, se comentará cómo he dividido las tareas mencionadas en el punto anterior 8.4 y la correspondencia con las clases que he realizado e incluido dentro de /db/CodigoComun.

9.5.1 Organización general

Usaremos una estructura inicial de ficheros como la siguiente: * Control.inc.php <-- Clase principal ->ControlLogin.inc.php --- | <-- Clases para el Modulo de acceso ->ControlLogout.inc.php --- | ->ControlListado.inc.php --- ->ControlFormAlta.inc.php | <-- Clases para los módulos ->ControlFormBaja.inc.php | (controlador) ->ControlFormLocaliza.inc.php | | ->ControlDoAlta.inc.php | ->ControlDoBaja.inc.php | ->ControlDoLocaliza.inc.php --- * GestionListado.inc.php <-- Clase principal * GestiónTabla.inc.php <-- Clase principal



->GestionTablaAlta.inc.php --- ->GestionTablaBaja.inc.php | <-- Clases para los módulos ->GestionTablaLocaliza.inc.php --- (modelo) TablaHtmlFormulario.inc.php --- TablaHtmlListado.inc.php | <-- Clases de ayuda para la

| generación de FormularioHtml.inc.php | formularios y listados FormatoHtml.inc.php --- ->CorreoHtml.inc.php --- ->InfoSesion.inc.php | <-- Clases de ayuda de bajo nivel ->Indice.inc.php | ->ListaMensajes.inc.php | ->ParametrosCgi.inc.php | ->Pila.inc.php --- CheckData.inc.php --- FuncionesListado.inc.php | <-- Clases de utilidad para usar en Util.inc.php | cualquier otra clase UtilDb.inc.php | GestionPDFInforme.inc.php | start.php --- phplib_local.inc.php --- html_mime_mail.inc.php |<-- Clases de utilidad - externas fpdf.inc.php |(clases incorporadas al 'núcleo' pero csv.inc.php --- generadas por otras entidades/personas) Estos serán los 37 archivos que formarán parte de nuestro núcleo principal y a partir de los cuales crearemos los módulos necesarios para construir una aplicación totalmente funcional. La otra parte de nuestro núcleo será la carpeta /db/ConfiguracionComun que incluirá los recursos necesarios. La idea es implementar de una manera básica todas las clases principales para posteriormente instanciarlas y redefinir los métodos necesarios para modificar el comportamiento estándar y especializarse en una tarea concreta.

9.5.3 Conceptos básicos sobre los módulos Para que tengamos ya una idea más o menos clara de como vamos a usar todas estas clases que hemos definido en el punto anterior, explicaremos cuales a son grandes rasgos la funcionalidad de las mismas. En el listado anterior se han señalado 3 clases como principales y varias como clases para módulos (4 para modulo de accesos, 7 como controlador y 3 como modelo). Las demás clases se comentarán posteriormente. Nos centraremos principalmente en las 3 clases principales y en las 7 de controlador y 3 de modelo, dejando también de momento la explicación del modulo de acceso. Se han definido 3 clases principales las cuales contendrán las variables de clase y métodos básicos necesarios para toda la aplicación:



- Control - GestionListado - GestionTabla

Estas tres clases son la base para cualquier funcionalidad de nuestra aplicación. Control es la clase principal, definiéndose en ella métodos para distintas tareas 'clave' y necesarias en cada otra clase que usemos posteriormente. GestionTabla es otra de las clases principales, pero a diferencia de Control, ésta clase se usará para realizar la gestión de la información en tareas como el alta, baja, modificación o buscadores. GestionListado es algo diferente a GestionTabla ya que su función será la de gestionar la información para posteriormente generar un listado, tarea que no requiere procesar la información sino simplemente mostrarla. De GestionTabla se instanciarán otras clases que se especializarán en cada una de las tareas mencionadas, pero de GestionListado no será necesario ya que ésta ya incluye todos los métodos que se usarán para realizar los listados. Con esto se pretende separar lo que sería el controlador del modelo de datos según veíamos en capítulos anteriores; Control representa el controlador y Gestion el modelo de datos. Para conseguir esto he separado las clases que construyen la aplicación (o que inician la construcción) de las clases que se encargan de la gestión de los datos una vez que la aplicación está formada. Obtenemos así las 7 clases para módulos (formarían parte del controlador):

- Control - ControlListado - ControlFormAlta - ControlFormBaja - ControlFormLocaliza - ControlDoAlta - ControlDoBaja - ControlDoLocaliza

y las 3 clases más para módulos (formarían parte del modelo de datos):

- GestionListado - GestionTabla - GestionTablaAlta - GestionTablaBaja - GestionTablaLocaliza

Todas las clases que extienden de Control tendrán que redefinir dos métodos que en Control quedaban sin definir; estos son 'inicializa' y 'doAccion'. Definiendo cada uno de estos dos métodos como necesitemos, podremos diferenciar la funcionalidad de una y otra clase. Por ejemplo, para realizar un listado de artículos, tendremos las 2 clases principales: ControlListado y GestiónListado. ControlListado se encargará principalmente de sobrescribir las 2 acciones que indicábamos anteriormente, estas serán la de inicializar la estructura de la aplicación y la de definir una acción a realizar (inicializa() y doAccion() respectivamente). 'Inicializa' se encargará de definir cuales van a ser las partes del 'framework' cargando la cabecera, margen izquierdo, pié, main... De todas estas tareas la más compleja será siempre la generación del cuerpo de la aplicación (main). En el caso de



un listado, en 'main' tan solo tendremos que generar y mostrar un listado de elementos. La tarea de generar el listado, o sobre todo, de iniciar o 'guiar' esa acción la hará el método 'doAccion' dentro de ControlListado (en este ejemplo). El método DoAccion de ControlListado será el encargado de ejecutar las acciones que realizará la clase GestiónListado y para ello creará una instancia de GestiónListado y le indicará que realice su acción predeterminada. Por otro lado, las clases que extienden de GestionTabla (GestionListado no tendrá clases herederas a este nivel de librería) se tendrán que especializar para realizar cada una de las tareas mencionadas, de forma que habrá una clase para realizar el alta (y modificación) de datos, otra para realizar la baja y otra para realizar búsquedas. Dentro de cada una de ellas pueden haber métodos parecidos, como por ejemplo un nuevo método doAccion que guiará la acción a realizar para gestionar el tratamiento de los datos del formulario; pero pueden haber otras muchas funciones destinadas a ayudar a realizar la acción final, como por ejemplo los métodos 'creaForm()' y 'creaBotonesForm()' que serán los encargados de definir el 'action' del formulario y la etiqueta del botón del mismo respectivamente. Siguiendo el ejemplo del listado, GestionListado se encargará de definir todos los métodos necesarios para terminar con éxito la construcción del listado; para ello construirá la sentencia SQL necesaria, leerá los registros de la base de datos, definirá la estructura a mostrar y las funciones y estilos aplicables a cada dato y finalmente formará un listado HTML para que pueda ser impreso en su correspondiente zona 'main'. Como es de esperar, al crear el 'framework', el código indicado en la parte central (main) será el necesario para imprimir el resultado de todos los procesos realizados por GestionListado, y por consiguiente, imprimirá el listado de elementos. La acción de realizar un listado es más simple que la de realizar el alta, baja, modificación y búsqueda de elementos por una simple razón; para realizar éstas tareas necesitamos antes construir un formulario de entrada para el caso del alta, de la modificación y del buscador, ya que se necesita en éstos casos la captación de información por parte del usuario. En la baja de un elemento en principio no es necesario mostrar ningún formulario para introducir información alguna, pero sí puede ser buena idea, mostrarlo para pedir una confirmación de que esos son los datos que desea eliminar. Ésta tarea de mostrar el formulario requiere que nuestras clases ControlFormAlta, ControlFormBaja, ControlFormLocaliza no realicen la acción que se puede suponer en un primer momento, sino que tienen que mostrar antes los formularios correspondientes y luego tienen que tratarlos, para finalmente poder realizar la acción que pretendían. De ahí que el nombre elegido para estas clases haya sido ControlFormxxx para indicar que se encargan de realizar el control del formulario. En el momento en el que el formulario está creado y se han cargado los datos en sus campos en el caso de tratarse de una modificación (tarea de ControlFormxxx) y el usuario introduce la información o la modifica, serán varias las tareas que habrán de realizarse. En primer lugar tenemos que recordar que cuando se crea un formulario, se indica una acción a realizar cuando el usuario pulse el botón del mismo. Esa acción ha de ser tal que permita que continuemos con el proceso que estábamos realizando. Para ello hemos creado 3 clases más, las cuales se encargarán de retomar ese control, de validar que los datos introducidos son válidos y de realizar la acción en GestiónTablaxxx que ya sí realizará el tratamiento



correspondiente de los datos, almacenándolos en la base de datos, eliminándolos o en el caso del buscador, realizando un salto a otra URL, como por ejemplo al listado para mostrar los datos encontrados según los parámetros de búsqueda que le hayamos pasado. Finalmente las clases ControlLogin y ControlLogout son las encargadas de manejar el acceso a la aplicación controlando cuando el usuario va a iniciar la sesión o va a abandonarla. No requieren instanciar ninguna clase de GestionTabla ya que el control lo realizan directamente y no se requiere ningún otro tipo de tratamiento de los datos. Llegados a este punto podemos ver que desde nuestra librería se pueden ya realizar las acciones básicas que hemos venido identificando desde capítulos anteriores, y también que las funcionalidades ofrecidas por ésta a este nivel serán muy simples. El alta de datos no podemos terminar de realizarlo a este nivel de clases ya que no conocemos nada sobre los datos a almacenar. Igualmente ocurre a la hora de realizar un listado, ya que no podemos listar más la clave de un elemento almacenado en una base de datos (y suponiendo que éste campo exista). Será ahora necesario explicar el siguiente paso, el cual mostrará como usar nuestras clases básicas de la manera adecuada para la generación de nuestro primer módulo.

9.5.4 Diagramas de las funciones más comunes

Antes de comenzar a meternos de lleno en un ejemplo en concreto se expondrán a continuación los diagramas de actividades correspondientes a las principales funciones de un módulo genérico. También se incluirán 3 diagramas de secuencia simplificados correspondientes al proceso de alta y listado, para ampliar un poco el como sería el funcionamiento de estas acciones, siendo el resto muy similares.

9.5.4.1 Diagrama para el proceso de Alta

En este diagrama podemos ver como se realizaría el proceso de alta de un elemento (una notícia en el ejemplo del punto siguiente). En primer lugar se crea el formulario, el cual estará vacío. Se dejará que el usuario introduzca los datos y posteriormente al pulsar el boton de ‘enviar’ estos datos serán validados. Si hay errores se le volverá a mostrar el formulario, esta vez con los datos que había introducido y se le muestra un error por pantalla. En el caso en que los datos sean correctos procederemos a realizar la escritura en la base de datos para almacenar la información. Finalmente podremos redirigir al usuario a cualquier otra página.



Figura 9.1 Diagrama de Actividades para el proceso de Alta

9.5.4.2 Diagrama para el proceso de Modificación

El proceso de modificación es muy similar al proceso de Alta; tanto que se implementa dentro de la misma clase. La única diferencia reside en que justo después de crear el formulario, en la modificación se hace una lectura de la base de datos para cargar los datos actuales del elemento que deseamos modificar. Por lo demás el proceso es idéntico. Finalmente en lugar de saltar a otra página, volveremos a cargar el formulario para hacer que el usuario verifique visualmente el cambio que acaba de realizar.

Figura 9.2: Diagrama de Actividades para el proceso de Modificación



9.5.4.3 Diagrama para el proceso de Baja

El proceso de baja se corresponde cuando deseamos eliminar un elemento de la base de datos. El elemento será seleccionado desde un listado o tras haber realizado una búsqueda, y posteriormente se habrá pulsado en algún enlace o boton etiquetado como ‘baja’ (‘borrar’ o ‘eliminar’ podrían ser otras etiquetas adecuadas). La acción que haremos en este caso será la de mostrar parte o toda la información del elemento que deseamos eliminar con el fin de que el usuario corrobore la acción seleccionada antes de proceder a la eliminación del elemento de la base de datos; acción que se realizará a continuación.

Figura 9.3: Diagrama de Actividades para el proceso de Baja

9.5.4.4 Diagrama para el proceso de Búsqueda

Una búsqueda consiste en mostrar un formulario vacío, esperar que el usuario lo rellene con datos correctos y posteriormente realizar una búsqueda siguiendo los parámetros indicados por el usuario. Si por cualquier motivo esa búsqueda no da resultados evitaremos que el usuairo tenga que ver un listado vacío y posteriormente pulsar ‘atras’ en el navegador. Lo que haremos será dejarlo en el mismo formulario de búsqueda avisandolo que no se han encontrado elementos. Si la búsqueda da resultados, se saltará al listado para que los muestre. Ésto lo podemos ver en el siguiente gráfico de la Figura 9.4.



Figura 9.4: Diagrama de Actividades para el proceso de Búsqueda

9.5.4.5 Diagrama para el proceso de Listado

El proceso de listado es bastante simple. Se realizará una búsqueda en la base de datos para obtener todos los elementos que cumplan con una determinada condición. La condición puede ser vacía o si por el contrario se nos han pasado parámetros de búsqueda (desde el proceso de búsqueda descrito en el punto anterior) existirán unas determinadas condiciones que definirán qué elementos se mostraran en el listado y cuales no. Desde el listado no se saltará a ninguna página ya que se pretende que se visualicen los elementos mostrados. Ésta distinción la vamos a ver gráficamente en la Figura 9.5.

9.5.4.6 Diagrama para el proceso de Login

Por último mostraremos como se realiza el proceso de acceso al sistema (Login). Para iniciar este proceso podemos hacerlo desde dos situaciones distintas. La primera será accediendo directamente a la página de autenticación y la segunda se corresponde con el intento de acceso a una página para la cual es necesario haberse autenticado en el sistema previamente. En esta segunda situación, el usuario será redirigido a la página inicial de acceso al sistema para que introduzca sus datos de usuario. Hasta que el usuario no introduzca unos datos de acceso válidos no se le mostrará la página correspondiente en la zona de gestión de la aplicación.



Figura 9.5: Diagrama de Actividades para el proceso de Listado

Figura 9.6: Diagrama de Actividades para el proceso de Login

9.5.4.7 Diagramas de secuencia para el proceso de Alta y Listado

A continuación, y a título meramente visual, se muestran 2 diagramas de secuencia corespondientes al proceso de Alta descrito de forma simplificada en el punto 9.5.4.1 y uno referente al proceso de listado descrito en el punto 9.5.4.5.

Solo se pretende que se pueda observar como interactuan las distintas clases entre sí

para, en el caso del primer gráfico, mostrar la creación del formulario inicial vacío; y en el



segundo de los casos, mostrar el proceso que se realiza tras pulsar el boton ‘enviar’ para procesar la información y realizar el ‘alta’ del elemento en cuestión. Para el proceso de listado simplemente se muestra las partes que intervienen en la generación del mismo de forma muy simplificada.

Para entender como ocurren ambos procesos puede recurrir al punto 9.5.5 Módulo de Ejemplo (Noticias), donde se explica las partes más importantes de todo lo mostrado en los gráficos.



Figura 9.7: Diagrama de Secuencia para el proceso de Alta/Modificación (construcción formulario)



Figura 9.8: Diagrama de Secuencia para el proceso de Alta/Modificación (almacenamiento de datos)



Figura 9.9: Diagrama de Secuencia para el proceso de Listado



9.5.5 Módulo de ejemplo (Noticias)

Para explicar cómo sería el proceso de generación de un módulo de nuestra aplicación, realizaremos uno de ejemplo, que no será ni más ni menos que el módulo de Noticias que usaremos en la Web de ejemplo 'Grupos de Técnicas Computacionales en la Ingeniería'. Se trata de un módulo que tendrá una representación destacada en la página inicial, mostrándose 2 pequeños módulos en un lateral en los que se mostrarán las dos últimas noticias introducidas. También habrá una sección destacada dedicada a las noticias y en la que se mostrarán todas las noticias almacenadas en la base de datos. La parte de la programación dedicada a las zonas públicas puede ser bastante distinta a la dedicada en la zona de administración, obligado por la propia naturaleza de la Web y la necesidad de mostrar al usuario toda la información lo mejor posible. Por ello, por ejemplo en nuestro módulo de noticias, el código que genera las 2 últimas noticias en la página principal no guarda similitud con la organización de clases y funcionamiento comentados anteriormente. Esto no será ningún problema para nosotros, aunque quizás pueda ser una tarea a tratar para futuras mejoras de nuestra librería. Nos centraremos por lo tanto en las acciones a realizar para la parte de administración, así como en las secciones públicas, dejando un poco de lado la página principal. Las tareas básicas a realizar en la parte de administración serán: − Alta de noticias − Modificación de noticias ya almacenadas − Baja o eliminación de noticias − Buscador de noticias − Listado de todas las noticias generadas Para ello, generaremos la carpeta correspondiente para este módulo y para que nos ubiquemos a continuación mostraré como sería nuestra estructura de directorios hasta este momento: /html /admin /db /acceso /CodigoComun /ConfiguracionComun /js /noticias <-- Módulo de noticias /secciones <-- Módulo de secciones de las noticias /diseno /diseno_restricted index.html Un módulo de noticias completo estará formado por 2 elementos básicos; la noticia en sí y la sección a la que pertenece dicha noticia. Así podremos generar diferentes noticias y posteriormente dar de alta una u otra noticia en éstas secciones. Dado que comentado un módulo quedarán comentados todos por su similitud, no comentaremos el módulo de secciones y nos centraremos en el de noticias.



Para cada acción a realizar tendremos un fichero PHP diferente, con lo que tendremos en principio los siguientes ficheros PHP: form_alta.php form_baja.php form_modifica.php form_localiza.php listado.php

Recordemos que dentro de un módulo se definirá tanto las acciones a realizar en la parte pública como en la privada, con lo que tendremos para éste la siguiente estructura: /noticias /publica <-- Código para la parte pública /privada /Codigo <-- Código privado del módulo /Configuracion <-- Configuración privada /Plantillas /es <-- Plantillas en español /uk <-- Plantillas en inglés form_alta.php --- form_baja.php | form_modifica.php | Funciones del módulo form_localiza.php | listado.php --- /imagenes <-- Fotos de las noticias Los ficheros form_xxx.php serán a los que llamaremos desde la zona de administración cuando nos refiramos a las noticias. Ejecutaremos form_alta.php o listado.php para dar de alta una noticia o para listar las ya creadas respectivamente. La función de cada fichero será clara, la de crear una instancia de la clase Control para que podamos iniciar nuestra aplicación, o más concretamente de ControlFormAlta tal y como hemos visto en la sección anterior.

Ya tenemos definido cual va a ser nuestro modelo de datos, serán las noticias y estarán formadas por los siguientes campos (simplificados) en la base de datos: ----- Descripción ------------------------------------ Nombre del campo ----------- − Clave única interna de cada noticia --> clave − Título de la noticia --> cabecera − Texto de descripción --> detalle − Clave de la sección a la que pertenece --> c_noticias_secciones − Imagen representativa --> no requiere campo en la base de datos

Como en ControlFormAlta no hay conocimiento de estos datos (al igual que le ocurre a GestionTablaAlta y ControlDoAlta), crearemos dentro de 'Codigo' en este mismo módulo las clases correspondientes a la realización del alta pero ya especializadas en tratar el objeto 'noticia': /Codigo ControlFormAltaNoticia.inc.php ControlDoAltaNoticia.inc.php GestionTablaAltaNoticia.inc.php



Nos encontramos ya en disposición de ver qué código incluyen algunas de nuestras

clases o ficheros:

9.5.5.1 Proceso de alta o modificación (similar a la baja y la búsqueda)

A continuación describiremos el proceso de alta, el cual comienza con la llamada al fichero 'form_alta.php' y que mostramos a continuación. form_alta.php <?php require_once("../../incConfiguracionComun/recursos.inc.php"); $incCodigo=$RECURSOS["incCodigo"]; require_once("$incCodigo/ControlFormAltaNoticia.inc.php"); $control = new ControlFormAltaNoticia($bAlta = true); $control->start(); if (!$control->haySalto()){ include($control->getRecurso("file_framework_restricted")); } $control->stop(); ?> Se realizarán los siguientes pasos: − Inicialmente cargaremos los recursos comunes, los cuales se encuentran en

ConfiguracionComun − Instanciamos la clase ControlFormAltaNoticia.inc.php indicándole que se trata del alta

de una noticia y no de una modificación ($bAlta=true). − Inicializamos nuestra librería llamando al método 'start' de la clase 'Control' (en este

caso de ControlFormAltaNoticia). Más adelante se comentarán los métodos incluidos en cada clase de nuestra librería.

− Si el proceso de inicialización ha sido el adecuado no tendremos necesidad de saltar a otra página (posiblemente la página para solicitar la identificación del usuario) y por lo tanto estaremos en condiciones de cargar el fichero 'framework' adecuado para iniciar a mostrar la página.

− Finalmente, cuando hayamos acabado se cerrará la sesión y finalizará la aplicación llamando al método 'stop' de la clase 'Control'.

Éste será el proceso que seguirían todos los ficheros PHP que inicien alguna acción dentro de todos y cada uno de los módulos creados. En algunos casos habrá alguna que otra modificación para especificar un funcionamiento distinto al genérico, pero básicamente en todos los ficheros a este mismo nivel se especificará el mismo funcionamiento, ya que es exactamente lo primero que nuestra aplicación necesita realizar. Cada uno de los ficheros correspondientes al la baja de noticias, modificaciones, listado y búsquedas harán el mismo proceso, claramente diferenciándose en la instanciación de su clase correspondiente.



La funcionalidad de la clase ControlFormAltaNoticia es exactamente la misma que indicábamos para ControlFormAlta, la de definir el método 'inicializa' y 'doAccion' adecuados para inicializar la estructura de la página Web y mostrar el formulario de alta, y definir la acción a realizar. Dado que esto es exactamente lo que hace ControlFormAlta, en este caso no necesitaremos redefinir ninguno de estos métodos, dejando el funcionamiento de la clase padre. Por ello el código de ésta clase tan solo será: ControlFormAltaNoticia.inc.php <?php $incCodigoComun=$RECURSOS["incCodigoComun"]; $incCodigo=$RECURSOS["incCodigo"]; require_once("$incCodigoComun/ControlFormAlta.inc.php"); require_once("$incCodigo/GestionTablaAltaNoticia.inc.php"); class ControlFormAltaNoticia extends ControlFormAlta{ function ControlFormAltaNoticia($bAlta){ $this->ControlFormAlta($bAlta); $this->addTablaSecundaria("noticias_secciones","clave",

"clave","b_baja=false"); $this->addTablaSecundaria("propietario"); } function creaGestionTablaAlta(){ $this->gestionTabla = new GestionTablaAltaNoticia(); } } ?> Simplemente llamamos al constructor del padre y creamos 2 tablas secundarias que nos ayudarán más adelante. Una tabla secundaria no es más que la carga en un array de los datos de una tabla de la base de datos, para posteriormente usarla para mostrar elementos, por ejemplo, en un desplegable de datos, o hacer alguna traducción de claves por su valor de texto correspondiente.

La única clase que redefinimos será evidentemente 'creaGestionTablaAlta' para que se instancie la clase GestionTablaAltaNoticia en lugar de GestionTablaAlta como era la acción definida en la clase padre. A continuación mostraré el código generado para la clase GestionTablaAltaNoticia. Para tranquilidad de los lectores no se incluirán muchos más trozos de código de estas dimensiones en este documento, pero lo haremos aquí ya que no se ha mostrado aún y es interesante para que terminemos de comprender la dinámica de todo el proceso de alta. Esta dinámica se repetirá para cada módulo de nuestra aplicación y además mostrará grandes similitudes a las otras acciones a realizar en este mismo módulo: GestionTablaAltaNoticias.inc.php <?php $CodigoComun=$RECURSOS["CodigoComun"]; require_once("$CodigoComun/GestionTablaAlta.inc.php"); require_once("$CodigoComun/FormularioHtml.inc.php"); require_once("$CodigoComun/UtilDb.inc.php"); require_once("$CodigoComun/CheckData.inc.php");



class GestionTablaAltaNoticia extends GestionTablaAlta{ function GestionTablaAltaNoticia(){ $this->GestionTablaAlta(); } function inicializaInfoForm(){ global $control; $this->infoRegistro["fecha"] = array( "nombreCampoForm" => "form_fecha", "tipo" => "fecha", "estilo" => 'class="formulario-campo" size=15'); $listaSecciones = $control->

getArraySelectText("noticias_secciones", "clave","nombre_seccion","Seleccione una sección"); $this->infoRegistro["c_noticias_secciones"] = array( "nombreCampoForm" => "form_c_noticias_secciones", "tipo" => "select", "elementos" => $listaSecciones, "estilo" => 'class="formulario-campo" size=1'); $this->infoRegistro["cabecera"] = array( "nombreCampoForm" => "form_cabecera", "tipo" => "text", "estilo" => 'class="formulario-campo" size=55'); $this->infoRegistro["cabecera_uk"] = array( "nombreCampoForm" => "form_cabecera_uk", "tipo" => "text", "estilo" => 'class="formulario-campo" size=55'); $this->infoRegistro["detalle"] = array( "nombreCampoForm" => "form_detalle", "tipo" => "textareaformato", "estilo" => 'class="formulario-campo" cols=57 rows=8'); $this->infoRegistro["detalle_uk"] = array( "nombreCampoForm" => "form_detalle_uk", "tipo" => "textareaformato", "estilo" => 'class="formulario-campo" cols=57 rows=8'); ... imágenes el código necesario para la generación de 2 campos para leer las imágenes del disco duro ha sido eliminado ya que no era necesario para la compresión del funcionamiento de esta clase... } function creaHiddenForm(){ global $control; if (!$this->bAlta) $this->formulario->addHidden("c_noticia", $control->getParametroCGI($this->campoClaveCGI)); } function valida(){ if ($this->bAlta) $this->validaAlta(); else $this->validaModifica();



$this->validaRestoAltaYModicacion(); } function validaAlta(){ global $control; $utilDb = new UtilDb; if (trim($this->registro["c_noticias_secciones"]) == 0){ $bError = true; $control->setError($bError); $control->addMensaje("seccion_vacio", $bError); } if (trim($this->registro["cabecera"]) == ""){ $bError = true; $control->setError($bError); $control->addMensaje("titulo_vacio", $bError); }else{ $sensql = " SELECT * FROM ". $this->tablaBD . " WHERE LOWER(cabecera) ='".

strtolower($this->registro["cabecera"]) ."'"; if ($utilDb->getRegistroUniversal($this->database,$sensql,"")){ $bError = true; $control->setError($bError); $control->addMensaje("titulo_noticia_duplicado", $bError); } } } function validaModifica(){ ...codigo similar a validaAlta pero eliminado para simplificar... } function validaRestoAltaYModicacion() { ...codigo similar a validaAlta pero eliminado para simplificar... } function doAccion(){ if ($this->bAlta) $this->doAccionAlta(); else $this->doAccionModifica(); } function doAccionAlta(){ global $control; $utilDb = new UtilDb; $fechaDefecto = $control->getRecurso("fecha_defecto"); if ($this->registro["fecha"] == "")

$this->registro["fecha"]= $fechaDefecto; if (trim($this->registro["tipo"]) == 0) $tipo = 1; else $tipo=$this->registro["tipo"]; $sensql = sprintf(" INSERT into %s" .

"(fecha,c_noticias_secciones,cabecera, cabecera_uk,detalle,detalle_uk,tipo) " .

" VALUES ('%s','%s','%s','%s','%s','%s',%d)",



$this->tablaBD, $this->registro["fecha"],

$this->registro["c_noticias_secciones"], $this->registro["cabecera"],$this->registro["cabecera_uk"], $this->registro["detalle"],

$this->registro["detalle_uk"],$tipo); $claveNuevaArt = $utilDb->insertaRegistroSerie($this->database, $sensql,"noticias", $this->campoClaveTabla); if($claveNuevaArt != ""){ $this->guardaImagen($this->registro["imagen1"], $claveNuevaArt); $this->guardaImagenConNumero($this->registro["imagen2"], $claveNuevaArt,2); }else{ $bError=true; $control->setError($bError); $control->addMensaje("no_alta"); } } function doAccionModifica(){ global $control; $utilDb = new UtilDb; if (trim($this->registro["tipo"]) == 0) $tipo = 1; else $tipo=$this->registro["tipo"]; $claveArticulo = $control->getParametroCGI($this->campoClaveCGI); $sensql = sprintf(" UPDATE %s" . " SET fecha = '%s', " . " c_noticias_secciones = '%s', " . " cabecera = '%s', " . " cabecera_uk = '%s', " . " detalle = '%s', " . " detalle_uk = '%s', " . " tipo = %d ". " WHERE clave = '%s'", $this->tablaBD, $this->registro["fecha"],

$this->registro["c_noticias_secciones"], $this->registro["cabecera"],$this->registro["cabecera_uk"], $this->registro["detalle"],$this->registro["detalle_uk"],

$tipo,$claveArticulo); $claveNueva = $utilDb->ejecutaConsulta(

$this->database, $sensql); if ($claveNueva != ""){ $this->guardaImagen($this->registro["imagen1"],$claveArticulo); $this->guardaImagenConNumero($this->registro["imagen2"],

$claveArticulo,2); if ($this->registro["borraimg1"] == 'TRUE')

$this->eliminaImagen($claveArticulo); if ($this->registro["borraimg2"] == 'TRUE')

$this->eliminaImagenConNumero($claveArticulo,2); }else{ $bError = true; $control->setError($bError); $control->addMensaje("no_modificacion"); }



} function cargaRegistroDesdeBD($claveRegistro = ""){ global $control; $utilDb = new UtilDb; $bOk = true; $this->registro = ""; if ($claveRegistro == "") $claveRegistro = $control->getParametroCGI($this->campoClaveCGI); $this->registro = $utilDb->getRegistro($this->database,

$this->tablaBD,$this->campoClaveTabla,$claveRegistro,false);

$sensql = " SELECT * FROM noticias WHERE c_noticia = " . $claveRegistro . " ORDER BY fecha DESC";

$bOk = $this->validaCargaRegistro(); return $bOk; } } ?> Comentaremos a continuación cual es la función de cada método por orden de aparición, no siendo éste el orden de ejecución. Se ha suprimido algún código ya que dejaba de ser relevante para ver el funcionamiento de esta clase. Lo primero que tenemos que comentar es respecto al constructor de la clase, dicho constructor llama al constructor del padre de la clase extendida GestionTablaAlta; ésta clase que a su vez extiende a GestionTabla, tan solo redefine 2 métodos de ésta para establecer los botones del formulario (para indicar si es un alta o una modificación) y el valor para el 'action' del mismo que hará que llamemos a un fichero llamado 'do_alta.php' o a otro llamado 'do_modifica.php' para que realicen la acción determinada con los datos del formulario. Estas clases son respectivamente 'creaBotonesForm' y 'creaForm'. Dado que aquí es esa precisamente la acción que queremos realizar con estos 2 métodos no será necesario redefinirlos, aunque si por algún motivo, los ficheros a los que deseásemos llamar para realizar la acción fuesen otros o quisiéramos cambiar el nombre de los botones, podríamos redefinir estos métodos en esta clase. Después del constructor, el método que nos encontramos es inicializaInfoForm. Éste método se definía por primera vez en GestionTabla, aunque allí tan solo se ponía el valor de la variable infoRegistro a vacío. Aquí se definirá su valor ya que ahora conocemos sobre qué modelo de datos vamos a trabajar (noticias). La función de este método es generar un array, infoRegistro, el cual contendrá otro array de datos para cada uno de los campos que vayamos a crear en el formulario. Este array de datos será usado posteriormente para generar dicho formulario, creando una tabla de 2 columnas que contendrá a un lado las etiquetas y al otro el campo en sí, del tipo que se haya definido. Para cada campo definiremos su nombre (nombreCampoForm), su tipo (tipo) pudiendo ser este: text, hidden, select, textarea, textareaformato, submit, label, button, password, noedit, checkbox y file (Estos tipos pueden verse en la clase 'FormularioHtml' dentro de CodigoComun); además podemos indicar también un valor por defecto (valor) o si se trata



de un tipo select, podremos indicar los elementos que lo forman (elementos) y finalmente se podrá indicar incluso el estilo a usar (estilo).

Para la carga de las imágenes usaremos un campo tipo 'file', aunque incluiremos algo más de lógica de control para detectar si ya existe un fichero cargado, en lugar de mostrar el botón de examinar, lo que haremos será mostrar un 'check' para eliminar dicho fichero, en el caso de querer cambiarlo o simplemente eliminarlo. Si deseásemos subir un fichero o documento, usaríamos la misma lógica que la usada para las imágenes, aunque llamaremos a funciones distintas para comprobar la existencia del documento, subirlo e incluso eliminarlo. Éste método será evidentemente distinto para cada módulo de nuestra aplicación. La siguiente función que nos encontramos es 'creaHiddenForm'; función que usaremos para, en el caso de que estemos realizando una acción de modificar, pasar como campo oculto en el formulario la clave de la noticia que estamos modificando, para que posteriormente sea recuperada por la clase ControlDoAltaNoticia y no se pierda al llamar al fichero 'do_modifica.php' correspondiente. En este método usamos la variable '$this->campoClaveCGI', cuyo valor estará definido en los recursos; esta variable estará definida en todos los módulos y tiene la finalidad de indicar como se va a llamar el campo 'clave' que se usará en ese módulo concreto para referirnos a la 'clave' de los elementos que se crearán. Normalmente este campo se llamará 'clave' aunque en otras ocasiones podemos referirnos a esta misma clave como 'c_noticia', 'clave_noticia'... A continuación vienen definidos los métodos de validación de los datos del formulario. Diferenciaremos entre 2 tipos de validaciones, una para cuando estamos realizando un alta de datos y otra para cuando estamos realizando una modificación, ya que puede que en estos casos se requieran comprobaciones distintas. Ocasionalmente se puede llamar a continuación a un método mixto, en el cual se validen los datos que son comunes para ambas situaciones, tanto alta como modificación. Aquí se validarán que determinados campos clave no estén vacíos, que los campos numéricos realmente contengan números, que los campos de fechas sean correctos... Se pueden hacer comprobaciones complejas como verificar que un email está escrito correctamente o que un DNI es válido. En caso de que alguna de las comprobaciones falle haremos las tres acciones siguientes: $bError = true; $control->setError($bError); $control->addMensaje("seccion_vacio", $bError);

De esta manera indicaremos que hay un error (dos primeras líneas) y añadiremos el texto descriptivo correspondiente a ese error concreto, el cual le será mostrado al usuario. El que un formulario contenga errores implicará que dicho formulario vuelva a mostrarse para solicitar al usuario que corrija los errores. Se le facilitará esta tarea haciendo que no tenga que introducir de nuevo todos los datos, sino que estos se cargarán automáticamente y tan solo se esperará a que el usuario corrija los errores que se le han indicado para proseguir con la acción que deseábamos realizar. Todo esto no se realiza automáticamente, sino que tendremos que hacerlo nosotros. La clase encargada de realizar esto no puede ser otra que ControlDoAltaNoticia, ya que es la clase que instanciará el php 'do_alta.php' o 'do_modifica.php' que si no recordamos mal, son los ficheros php que hemos definido en nuestra clase GestionTablaAltaNoticia (o en las clases instanciadas).



ControlDoAltaNoticia, o en su defecto la clase padre ControlDoAlta, definirá en su método 'doAccion' el proceso a realizar con el formulario cuando hemos pulsado el botón de 'enviar datos'. Aquí normalmente habrá un código similar a este: function doAccion(){ global $infoSesion; $this->creaGestionTablaAlta(); $this->gestionTabla->inicializa(); $this->gestionTabla->cargaRegistroDesdeCGI(); $this->gestionTabla->valida(); if (!$this->isError()){ $this->gestionTabla->doAccion(); if (!$this->isError()){ $label = $this->isAlta() ? "alta_ok" : "modificacion_ok"; $this->addMensaje($label); if ($this->isAlta()) $this->infoPlantilla["main"] = "form_alta.htm"; else $this->infoPlantilla["main"] = "form_modifica.htm"; $this->doAccionForm($bLoadDeCgi = false); } }else{ if ($this->isAlta()) $this->infoPlantilla["main"] = "form_alta.htm"; else $this->infoPlantilla["main"] = "form_modifica.htm"; $this->doAccionForm($bLoadDeCgi = true); } } Éste código viene a realizar la inicialización de la nueva página que se va a mostrar, la carga de los datos que se han pasado en el formulario previo y la ejecución de la validación que mencionábamos anteriormente. En el caso de que la validación sea correcta (no hay errores) añadiremos un mensaje indicando que el alta o la modificación han sido realizadas correctamente; posteriormente volveremos a cargar de nuevo en el 'main' el formulario de alta o de modificación. Si se trataba de la realización de una acción de alta, no cargaremos de nuevo los datos en el formulario, pero si se trata de una modificación si que se vuelven a cargar (para volver a mostrar el mismo formulario que se estaba modificando) aunque no se cargarán estos datos del CGI sino que el método 'doAccionForm' realizará esta carga desde la base de datos. En caso de que exista error el proceso es muy similar, pero con la diferencia que ahora sí rellenaremos el formulario con los datos que se han pasado del formulario anterior y no de la base de datos (que si la acción fuese una alta no existirían dichos datos aun en la base de datos). A continuación encontramos definido el método 'doAccion' y seguidamente 'doAccionAlta' y 'doAccionModifica' para los casos de alta y modificación respectivamente. Este método 'doAccion' es exactamente el que se ejecutará desde el código que acabamos de mostrar y será el encargado de introducir o modificar los datos en la base de datos, así como de almacenar las imágenes o documentos en el disco duro.



Por último tenemos el método 'cargaRegistroDesdeBD' el cual será el encargado, en el caso de la modificación, de leer el registro correspondiente de la base de datos para que se carguen todos los datos en el formulario y permitir la modificación.

Así, siguiendo la misma dinámica, ocurrirán todos los procesos de alta y modificaciones de todos los módulos de la página Web. También, como ya habíamos mencionado anteriormente, será un proceso muy similar al proceso de baja o al de búsqueda. El proceso de listado será algo distinto y lo mostraremos en el siguiente punto.

9.5.5.2 Proceso de listado

Comenzaremos con la llamada al PHP 'listado.php' cuyo código es prácticamente igual al del fichero 'alta.php' que mostrábamos anteriormente: listado.php <?php require_once("../../ConfiguracionComun/recursos.inc.php"); $Codigo=$RECURSOS["Codigo"]; require_once("$Codigo/ControlListadoNoticias.inc.php"); $control = new ControlListadoNoticias; $control->start(); if (!$control->haySalto()){ include($control->getRecurso("file_framework_privado")); } $control->stop(); ?> Como vemos el código es prácticamente igual con la salvedad que instanciamos la clase ControlListadoNoticias. La principal diferencia entre el listado y las demás acciones es que para el listado no hay que mostrar un formulario previo, con lo que no necesitaremos realizar ningún tratamiento de los datos ni saltar a otro php (como do_alta.php), sino que directamente se mostrará el listado de artículos correspondiente.

Para realizar el listado serán necesarios los siguientes pasos: − Generar las columnas a mostrar realizando formateo de datos si fuese necesario. − Leer los registros de la base de datos, una vez generada la consulta necesaria y

adecuada − Generar la cabecera de la tabla (mostraremos los datos del listado en una tabla) − Imprimir el listado de datos, mostrando una columna por cada dato leído − Imprimir el índice en el caso de que hubieran muchos datos y necesitara paginación. Al igual que ocurría en el alta, la clase ControlListadoNoticias contendrá el siguiente código, donde tan solo creamos otras 2 tablas secundarias y creamos el objeto 'gestionListado' instanciado de GestionListadoNoticias. Será necesario de nuevo mostrar algo de código, ya que ésta clase será básica para todos los listados y no ha sido mostrada anteriormente.



ControlListadoNoticias.inc.php <?php $CodigoComun=$RECURSOS["CodigoComun"]; $Codigo=$RECURSOS["Codigo"]; require_once("$CodigoComun/ControlListado.inc.php"); require_once("$Codigo/GestionListadoNoticias.inc.php"); class ControlListadoNoticias extends ControlListado{ function ControlListadoNoticias(){ $this->ControlListado(); $this->addTablaSecundaria("noticias_secciones", "clave","clave","b_baja=false"); $this->addTablaSecundaria("propietario"); } function creaGestionListado(){ $this->gestionListado = new GestionListadoNoticias; } } ?> GestionListadoNoticias.inc.php <?php $CodigoComun=$RECURSOS["CodigoComun"]; $Codigo=$RECURSOS["Codigo"]; require_once("$CodigoComun/GestionListado.inc.php"); require_once("$CodigoComun/FuncionesListado.inc.php"); require_once("$CodigoComun/UtilDb.inc.php"); require_once("$CodigoComun/Util.inc.php"); require_once("$Codigo/GestionPDFInforme.inc.php"); require_once("$CodigoComun/csv.inc.php"); class GestionListadoNoticias extends GestionListado{ var $codigoSubfamilia; var $tipo; function GestionListadoNoticias(){ global $control; $this->GestionListado(); $this->tipo = $control->getParametroCGI("tipo"); $this->fecha_desde = $control->getParametroCGI("fecha_desde"); $this->fecha_hasta = $control->getParametroCGI("fecha_hasta"); $this->seccion = $control->getParametroCGI("seccion"); ....... } function generaMetaColumnas(){ global $control; $masParametros = "idioma=$control->idioma&tipo=$this->tipo"; $ruta = $control->getRecurso("imagenesEstaticas_privado"); $urlModificar = "<a href=\"form_modifica.php?_patron_&

$masParametros\"> <img src=\"$ruta/ico_modificar.gif\"



width=\"22\" height=\"16\" border=\"0\" hspace= \"27\"></a>"; $urlBaja = "<a href=\"form_baja.php?_patron_&$masParametros\">

<img src=\"$ruta/papelera.gif\" width=\"18\" height=\"19\" border=\"0\" hspace=\"10\"></a>";

$this->metaColumnas = array( "fecha" => "muestraFecha('fecha')", "imagen" => "muestraImagenMini()", "imagen2" => "muestraImagenMiniConNumero('clave',2)", "cabecera" => "", "cabecera_uk" => "", "c_noticias_secciones" =>

"traduceCampoClaveSecundario ('noticias_secciones',' c_noticias_secciones','nombre_seccion')",

"modificar" => "muestraLinkDetalle(\"". addslashes($urlModificar). "\", \"c_noticia\", \"clave\")",

"baja" => "muestraLinkDetalle(\"".addslashes($urlBaja)."\", \"c_noticia\",\"clave\")"); } function creaHiddenForm(){ global $control; $this->formulario->addHidden("tipo",$this->tipo); } function getCamposListado(){

return array("fecha","clave","clave","cabecera","cabecera_uk", "c_noticias_secciones","detalle");

} function getCondicionListado(){ global $control; if ($this->fecha_desde != "") $cond .= " AND fecha >= '".$this->fecha_desde."' "; if ($this->fecha_hasta != "") $cond .= " AND fecha <= '".$this->fecha_hasta."' "; if ($this->seccion != 0) $cond .= " AND c_noticias_secciones= $this->seccion "; if ($this->cabecera != "")

$cond .= " AND lower(cabecera) LIKE '%". trim(strtolower($this->cabecera))."%' ";

if ($this->detalle != "") $cond .= " AND lower(detalle) LIKE

'%".trim(strtolower($this->detalle))."%' "; // Comprobacion para el pdf if ($this->cabecera_noticias_pdf != "") $cond .= " AND lower(cabecera) LIKE '%".trim(strtolower(

$this->cabecera_noticias_pdf))."%' "; $cond = "WHERE TRUE $cond"; $sensql = "SELECT * FROM $this->tablaBD $cond"; return $cond; } function getOrdenListado(){ global $control; if ($this->tipo == "fecha") return "order by fecha desc";



else if ($this->tipo == "cabecera") return "order by cabecera"; else if ($this->tipo == "seccion") return "order by nombre_seccion"; else return "order by fecha desc"; } function generaSqlListado(){ $campos = $this->getCamposListado(); $cond = $this->getCondicionListado(); $orden = $this->getOrdenListado(); $this->sql = sprintf("select %s from %s %s %s",

implode(",", $campos),"noticias",$cond,$orden); } function getCabecera() { global $control; $utilDb = new UtilDb; $url = "listado.php"; $estiloTabla = $control->getRecurso("estilo_tabla_formulario"); $estiloCabecera = $control->getRecurso("estilo_listado_cabecera"); $masParametros = "?idioma=$control->idioma"; $masParametros .= "&fecha_desde=$this->fecha_desde&

fecha_hasta=$this->fecha_hasta" ."&seccion=$this->seccion" ."&cabecera=$this->cabecera&detalle=$this->detalle" ."&c_propietario=$this->c_propietario"; $abreCeldaIni = "<td class=\"$estiloCabecera\">"; $abreCelda = $abreCeldaIni . "<a href=\"$url$masParametros\""; $cierraCeldaIni = "</td>"; $cierraCelda = "</a>" . $cierraCeldaIni; $estiloMensajeListado= $control->getRecurso("estilo_mensaje_listado"); $html = "<table class=\"$estiloMensajeListado\"><tr><td>"; $numRegistrosTotal=$utilDb->calculaNumFilas($this->database,

$this->sql); if ($numRegistrosTotal == 1){ if ($control->idioma != "uk") $html .= "Se ha encontrado 1 noticia"; else $html .= "We have found one notice"; }else{ if ($control->idioma != "uk") $html .= "Se han encontrado " .$numRegistrosTotal . " noticias"; else $html .= "We have found " .$numRegistrosTotal . " notices"; } if ($control->idioma != "uk") $tituloListado = "LISTADO DE NOTICIAS"; else $tituloListado = "LIST OF NOTICES"; $html .= "</td></tr></table>"; $html .= "<table class=\"$estiloTabla\"><tr>";



$html .= $abreCelda . "&tipo=fecha\">Fecha" . $cierraCelda; $html .= $abreCeldaIni . "Imagen Ppal" . $cierraCeldaIni; $html .= $abreCeldaIni . "Imagen Secundaria" . $cierraCeldaIni; $html .= $abreCelda . "&tipo=cabecera\">Título" . $cierraCelda; $html .= $abreCelda . "&tipo=cabecera\">Título Inglés". $cierraCelda; $html .= $abreCelda . "&tipo=seccion\">Sección" . $cierraCelda; $html .= $abreCeldaIni . "Modificar" . $cierraCeldaIni; $html .= $abreCeldaIni . "Borrar" . $cierraCeldaIni; $this->listado->html = $html . "</tr>"; } function getHtml(){ $this->html = ""; if (!empty($this->registros)){ $this->getCabecera(); $this->listado->generaListado(); $this->html .= ("</table>\n"); } return $this->listado->html; } function getTablaHtmlListado(){ global $control; $hidden .= "<input type=hidden name=\"tipo\" value=\"" .

$this->tipo . "\">"; $hidden .= "<input type=hidden name=\"idioma\" value=\"" .

$control->idioma . "\">"; $hidden .= "<input type=hidden name=\"fecha_desde\"

value=\"" . $this->fecha_desde . "\">"; $hidden .= "<input type=hidden name=\"fecha_hasta\"

value=\"" . $this->fecha_hasta . "\">"; $hidden .= "<input type=hidden name=\"seccion\"

value=\"" . $this->seccion . "\">"; ...... $html = sprintf("<form action=\"listado.php\"

method=post target=_blank>\n" . "%s\n"."%s\n"."%s"."</form>\n", $hidden, $this->getHtml(),$this->getHtmlBotones());

return $html; } function getTablaHtmlIndice(){ return $this->indice->getHtml(); } function getHtmlBotones(){ global $control; if ($control->idioma != "uk") $textoBoton = "GENERAR INFORME"; else $textoBoton = "CREATE REPORT"; if (!empty($this->registros)) { $html = "<table align=\"center\"

class=\"fondo-fila-boton\">\n<tr><td>\n"; $htmlCampo = sprintf("<input type=submit name=\"%s\"

value=\"%s\" " ."class=\"formulario-boton\">", "crear_pdf","$textoBoton");



$htmlCampo .= " " . sprintf("<input type=submit name=\"%s\" value=\"%s\" " ."class=\"formulario-boton\">", "crear_xls", "Generar EXCEL");

$html .= "$htmlCampo</td></tr></table>"; return $html; } } function doAccion(){ global $control; $utilDb = new UtilDb; //Si pulsa el boton damos un salto a la url del pdf if (isset($GLOBALS["crear_pdf"])){ $this->generaRegistrosPDF(); $this->generaPDF(); }else if (isset($GLOBALS["crear_xls"])) { $this->generaRegistrosPDF(); $this->getCabecera(); $this->generaExcel(); }else{// En caso contrario se genera el listado en pantalla $this->generaMetaColumnas(); $this->generaFunciones(); if (empty($this->registros)){ $this->generaRegistros(); } $this->generaCabeceraTabla(false); $this->generaFormatosTabla(); $this->listado = new TablaHtmlListado($this->metaColumnas,

$this->funciones, $this->registros, $control->getPlantilla ("cabecera_tabla_listado"),

$this->formatoPar,$this->formatoImpar, $this->listaFormatosTD);

$this->indice = new Indice($control->getUrl(), $control->getRecurso("nombre_bloque"), $this->numRegistros, $this->bloque,$this->sizeBloque, $control->getRecurso("size_superbloque"), $control->getRecurso("label_anterior"), $control->getRecurso("label_siguiente")); } } function generaPDF(){ global $control; global $b_apaisado; global $anchoLimite; global $anchosColumnas; global $tipoColumnas; global $cabecera; global $registrosAMostrar; global $tituloInforme; $utilDb = new UtilDb; $pdf = new GestionPDFInforme; $tituloInforme ="LISTADO DE NOTICIAS"; $cabecera[]="Fecha";



$cabecera[]="Img ppal"; $cabecera[]="Img sec"; $cabecera[]="Titulo"; $cabecera[]="Titulo Inglés"; $cabecera[]="Sección"; $tipoColumnas[]="fecha"; $tipoColumnas[]="imagen"; $tipoColumnas[]="imagen"; $tipoColumnas[]="string"; $tipoColumnas[]="string"; $tipoColumnas[]="string"; $anchosColumnas[]=8; $anchosColumnas[]=15; $anchosColumnas[]=15; $anchosColumnas[]=25; $anchosColumnas[]=25; $anchosColumnas[]=15; $ancho = array_sum($anchosColumnas); $anchoLimite = 190; $b_apaisado = 'f'; if ($ancho > $anchoLimite) { $pdf->DefOrientation="landscape"; $b_apaisado = 't'; $anchoLimite = 280; } $pdf->Open(); $pdf->AddPage(); $pdf->AliasNbPages(); $pdf->SetFont('Courier','B',10); $registrosAMostrar = $this->registros; $pdf->TablaMejoradaColoresInformes(); //Obtengo la carpeta donde se guardan los pdf temporales $pdfcarpeta = $control->getRecurso("pdf_carpeta"); //Borro todos los ficheros temporales mas antiguos $pdf->CleanFiles($pdfcarpeta); //primero se genera en un fichero y luego //se redirecciona a esa fichero. Esto es asi porque //no se puede generar directamene el pdf dentro del navegador $file=basename(tempnam('$pdfcarpeta','tmp')); $file = "$pdfcarpeta/$file.pdf"; $pdf->Output($file); $urlSalto ="$file"; $control->setSalto(true); $control->setUrlSalto($urlSalto); } function generaExcel() { .... } function generaRegistrosPDF(){ $utilDb = new UtilDb; $util = new Util; $this->generaSqlListado();



$reg = $utilDb->getConsultaEnArrayAsoc($this->database, $this->sql, "clave" , 0,0,$dummy);

$clave = "clave"; $sensql="SELECT * FROM noticias_secciones WHERE true ORDER BY clave "; $seccion = $utilDb->getConsultaEnArrayAsoc($this->database, $sensql,

"clave" , 0,0,$dummy); if (!empty($reg)){ while (list($clave,$reg_actual)=each($reg)){ $reg_fin[0] = $reg_actual[0]; $reg_fin[1] = $reg_actual[1]; $reg_fin[2] = $reg_actual[2]; $reg_fin[3] = $reg_actual[3]; $reg_fin[4] = $reg_actual[4]; $est=$seccion[$reg_actual[5]]['nombre_seccion']; $reg_fin[5] = $est; $c=$reg_actual["clave"]; $this->registros[$c]=$reg_fin; } } } } ?> Al igual que en el caso anterior, comentaremos uno a uno los métodos aquí mostrados. Ahora intentare hacerlo de manera algo más ordenada. En GestionListadoNoticias se sobrescribirán casi todos los métodos declarados en la clase GestionListado que acabamos de extender. El motivo es simple, en GestionListado no teníamos ninguna información sobre el modelo de datos y aquí si.

GestionListado intenta formar un listado de elementos realizando los pasos que mencionábamos, los cuales se pueden ver claramente en el método 'doAccion' de GestionListado. No muestro aquí el código de este mismo método en la clase GestionListadoNoticias ya que ha sido modificado para permitir que se generen ficheros PDF o EXCEL al pulsar en dos botones que hemos creado justo debajo del listado. Esto lo pasaremos por alta para explicar más claramente el funcionamiento del listado, por lo tanto, el código quedará así: doAccion() global $control; $this->generaMetaColumnas(); $this->generaFunciones(); if (empty($this->registros)){ $this->generaRegistros(); } $this->generaCabeceraTabla(); $this->generaFormatosTabla(); $this->listado = new TablaHtmlListado($this->metaColumnas,

$this->funciones,$this->registros, $control->getPlantilla("cabecera_tabla_listado"), $this->listaFormatosTD,$this->formatoPar, $this->formatoImpar);

$this->indice = new Indice($control->getUrl(),



$control->getRecurso("nombre_bloque"),$this->numRegistros, $this->bloque,$this->sizeBloque,$control->getRecurso("size_superbloque"), $control->getRecurso("label_anterior"), $control->getRecurso("label_siguiente")); } Lo primero que hacemos es generar las columnas llamando a 'generaMetaColumnas', método encargado de definir el array 'metaColumnas', cuya finalidad es la de almacenar las columnas que hay que mostrar en el listado y si hay que aplicarle alguna función o no para formatear el dato en concreto. Por ejemplo, si en la base de datos tenemos almacenado un campo booleano para definir si una noticia está o no de baja (para no ser mostrada en la Web), dicho campo en la base de datos contendrá 'true' o 'false', 't' o 'f', pero no es éste el dato que debemos mostrar al usuario; realizaremos entonces una función (que incluiremos en la clase 'funcionesListado' dentro de CodigoComun) la cual transformará ese valor de 'true' o 't' a un valor más lógico para el usuario como puede ser 'SI', y en caso contrario 'NO'.

También para ese mismo fin será aquí donde usaremos las tablas secundarias que hemos cargado en alguna ocasión, llamando a la función 'traduceCampoClaveSecundario' que lo que viene a realizar es la sustitución de un valor de 'clave' por su correspondiente valor 'texto'; esto se entiende mejor viendo la siguiente situación. En la base de datos, almacenaremos la noticia con todos sus datos. La noticia pertenece a una sección, la cual estará definida en otra clase y cuyos datos serán como mínimo, una clave identificativa y única para cada sección y su correspondiente nombre de sección. En la tabla de la noticia almacenaremos a qué sección pertenece, pero guardando el campo clave de ésta, en lugar de guardar directamente el nombre. A la hora de mostrar el listado de nada nos sirve mostrar la clave de la sección, cuando lo que queremos mostrar es precisamente el nombre de la misma, traducción que realizará esta función. La siguiente llamada al método 'generaFunciones' tan solo instanciará la clase 'FuncionesListado' que es precisamente la que contendrá todas las funciones posibles a aplicar a los elementos de una columna. 'generaRegistros' será el método encargado de leer de la base de datos todos los registros correspondientes al listado que queremos mostrar. Ese listado no tiene porqué ser un listado completo de todos los elementos almacenados, ya que si hacemos antes una búsqueda, el listado resultante tendrá que cumplir los parámetros que se indicaron a la hora de realizar esa búsqueda. Podemos ver como haremos esto: generaRegistros() global $control; $utilDb = new UtilDb; $this->generaSqlListado(); $this->bloque = $control->getBloqueActual(); $this->calculaSizeBloque(); $this->registros = $utilDb->getConsultaEnArrayAsoc(

$this->database,$this->sql,$this->campoClave,$this->bloque, $this->sizeBloque,$this->numRegistros);

if (empty($this->registros)) { $bError = true; $control->setError($bError);



$control->addMensaje("registros_no_existen"); } Lo que haremos será construir la sentencia SQL para posteriormente hacer la consulta a la base de datos. También aprovechamos aquí para ver cual es el bloque de datos actual; con este bloque de datos nos referimos en el caso en el que haya varias páginas de datos (para no mostrar todos los datos en una misma página haremos este listado por páginas, cada una de ellas contendrá un número determinado de elementos definido por 'calculaSizeBloque') al número de bloque en el que nos encontraríamos si ya hemos seleccionado otra página de resultados. De todo esto destacaremos la creación de la consulta, ya que se usarán métodos los cuales se sobrescribirán todos en GestionListadoNoticias. generaSqlListado() $campos = $this->getCamposListado(); $cond = $this->getCondicionListado(); $orden = $this->getOrdenListado(); $this->sql = sprintf("select %s from %s %s %s", implode(",", $campos), $this->tablaBD, $cond, $orden); Construimos la sentencia separando primero los campos que se van a leer de la base de datos, la condición y el orden a aplicar al resultado. Posteriormente se realiza la sentencia completa y se almacena en la variable global 'SQL' para que sea usada por otros métodos. En la construcción de la condición se tendrán en cuenta los elementos indicados en una posible búsqueda posterior para mostrar solo los elementos que se pretendían mostrar. Si no se hubiese realizado búsqueda previa, simplemente se mostrará un listado completo. El orden del listado puede servir no solo para mostrar los elementos según un orden inicial, sino que durante la ejecución de la aplicación podremos cambiar ese orden, por ejemplo, pinchando en la cabecera de una columna. A continuación se genera la cabecera de la tabla que contendrá el listado. Esta cabecera contendrá el nombre de cada una de las columnas a mostrar. Podemos leer la cabecera de un fichero o podemos construirla desde el mismo método. En listados públicos habrá que tener en cuenta aquí el idioma en el que se vaya a mostrar la información para generar una u otra cabecera. Si deseamos hacer que cuando se haga click sobre un nombre de esta cabecera, se ordene el listado por ese campo, tendremos que crear también algo más de lógica para pasar esa información extra y regenerar el listado. Posteriormente podremos generar los formatos para cada columna. Esto es algo que se usará principalmente para la zona pública ya que ahí habrá que mostrar principal interés en mostrar los datos con unos u otros estilos (en la zona privada no hay necesidad de maquetar tanto los datos ya que será algo más simple y se requerirá que sea más rápida).

El método encargado de ello no se muestra en la clase GestionListadoNoticias de la zona de gestión, pero lo añadiremos aquí para mostrar que tan solo se definen unos formatos para cada nombre de columna:



function generaFormatosTabla(){ // el id coincide con el de la metacolumna $this->listaFormatosTD["c_noticias_secciones"] =

new FormatoHtml("class=titulo_seccion"); $this->listaFormatosTD["fecha"] = new FormatoHtml("class=fecha_noticias"); $this->listaFormatosTD["imagen"]=new FormatoHtml("class=imagen_noticias"); $this->listaFormatosTD["cabecera"]= new FormatoHtml("class=cabecera"); $this->listaFormatosTD["detalle"]=new FormatoHtml("class=texto_noticias"); $this->listaFormatosTD["nombre_seccion_uk"] = new FormatoHtml("class=seccion_noticias"); $this->listaFormatosTD["cabecera_uk"] = new FormatoHtml("class=cabecera"); $this->listaFormatosTD["detalle_uk"]=new

FormatoHtml("class=texto_noticias"); $this->listaFormatosTD['div'] = 1; $this->formatoTRPar = ""; $this->formatoTRImpar = ""; } Simplemente destacar la línea '$this->listaFormatosTD['div'] = 1;' ya que aquí indicamos que para la parte pública (el código pertenece a publica/GestionListadoNoticias) se mostraran las líneas del listado usando elementos 'DIV' de manera que pueden mostrarse los datos con una mejor presentación. FormatoHtml será una clase que tan solo se encargará de añadir las etiquetas correspondientes alrededor del dato a 'formatear', añadiéndole la clase que se le indica. Será en la hoja de estilos CSS donde habrá que indicar todas las propiedades (colores, tamaños, espaciado...) a aplicar a cada elemento. Habrá que intentar no indicar estos estilos directamente en el HTML de las columnas, de la cabecera, de los botones... ya que sino, no estaremos separando una parte importante de la vista de nuestro modelo y controlador, que es lo que intentamos conseguir siguiendo el patrón MVC. Los dos últimos pasos serán generar el HTML correspondiente al listado, usando todos los elementos que hemos ido creando, y generar los números del índice. Estos dos pasos los haremos creando dos nuevos objetos de 'TablaHtmlListado' y de 'Incide'. Finalmente se imprimirá todo el HTML generado, dando lugar al listado de los datos con su cabecera, estilos e índices correspondientes.

9.5.5.3 Proceso de login (acceso al sistema de gestión)

El proceso de login o identificación de usuarios es algo diferente a los procesos de alta y listado comentados en los puntos anteriores. Principalmente porque es independiente de los módulos que hayan en la aplicación y se realiza completamente desde la librería base (CodigoComun). El paso de autenticación puede comenzar desde dos lugares distintos, uno desde la página de login en sí, y otro intentando acceder a una zona a la que no tenemos acceso. Si intentamos acceder a alguna zona de nuestra herramienta para la cual hace falta



autenticarse, se nos redirigirá a la zona de login para que lo hagamos y posteriormente se nos retornará a donde deseábamos entrar (la URL se guarda en una pila para poder realizar este proceso de redirección).

Para iniciar el proceso de login lo haremos cargando el fichero 'db/acceso/publica/login.php' cuyo código mostraremos aquí: login.php <?php require_once("../../ConfiguracionComun/recursos.inc.php"); $Codigo=$RECURSOS["Codigo"]; require_once("$Codigo/ControlLogin.inc.php"); $control = new ControlLogin(); $control->start(); if (!$control->haySalto()){ include($control->getRecurso("file_framework_privado")); } $control->stop(); ?> Este fichero realiza el mismo proceso que todos, inicializa la aplicación con $control->start(), proceso que ya por defecto comprueba la identidad del usuario y que tan sólo si el usuario ya se encuentra identificado no mostrará el formulario para realizar el login. Aquí, al ejecutar el método 'inicializa' de ControlLogin se generará dicho formulario para permitir introducir el nombre de usuario y su contraseña. Dado que todo el proceso de control del usuario se realiza en la clase Control, no necesitaremos generar ninguna otra clase para que haga esta función y por lo tanto, el fichero 'login.php' así como el fichero 'logout.php' y 'sin_permiso.php' serán independientes, mostrando solo el formulario de acceso y volviéndose a llamar a ellos mismos para volver a iniciar el sistema, pero ahora ya con un usuario y una contraseña que Control tendrá que validar.

Dentro de la ejecución del método 'start' se ejecutaba un paso primordial, llamar al método 'checkSeguridad' el cual es el encargado de verificar si el nombre de usuario y la contraseña son válidos o no, y en caso de que sean correctos, dirigir al usuario a alguna página o simplemente permitir o no su acceso a un determinado módulo u otro. Para ver como hacemos esto veamos el siguiente código: checkSeguridad() global $auth; $utilDb = new UtilDb(); $bOk = false; if ($this->bNobodyOk){ $bOk = true; }else{ if ($this->isSesionCaducada()){ $this->addMensaje("sesion_caducada"); $this->setVarSesion("mensaje", $this->listaMensajes->getHtml()); }else{

$sensql = " SELECT * FROM auth_user WHERE username = '" . $auth->auth["uname"] . "'"; $permiso = $utilDb->getRegistroUniversal($this->database,

$sensql,""); $user=$permiso["perms"];



witch($user) { case "admin": $bOk = true; break; case "usuario": if ($this->getRecurso("USUARIO") == "SI") $bOk = true; break; } } } $this->bSeguridadOk = $bOk; return $this->bSeguridadOk; El proceso de seguridad es fácil, se comprueba si el usuario y el password introducidos corresponden con alguno de los usuarios almacenados en nuestro sistema de base de datos. Si el intento de login no es correcto, la función actualizará y devolverá la variable 'bSeguridadOk' con 'false'. Si es correcto devolverá 'true'. Además de esto haremos otra serie de comprobaciones para permitir o no el acceso, ya que recordemos que siempre ejecutaremos el método 'start' de Control, con lo que siempre verificará si el acceso es permitido o no. ¿Que haremos para permitir que se accedan a las páginas públicas? pues o no llamamos a '$control->start()' (esto se hará así en páginas en las que tan solo es necesario incluir un pequeño PHP para mostrar algún dato, pero como módulo insertado dentro de HTML) o lo llamamos pero indicamos que no requerimos autenticación en ese módulo cosa que haremos añadiendo en el fichero de recursos del módulo en cuestión la siguiente línea: $RECURSOS["datos_bNobodyOk"] = "true"; con lo que en este caso, se comprobará inicialmente si 'nobody' tiene acceso sin autenticarse (nobody será el usuario anónimo que no se a autenticado en el sistema). En caso de ser así no se seguirá verificando nada y se permitirá el acceso. En caso contrario lo que haremos será buscar en nuestra base de datos ese usuario y con esa clave. Si no se encuentra no se permite el acceso, pero si se encuentra, haremos de nuevo otra comprobación extra.

Cada usuario será almacenado en el sistema indicándole un nivel de permiso. El caso por defecto será el administrador del sistema, el cual tendrá permiso 'admin' y al cual se le está permitido el acceso a todos los módulos. Si el usuario no es 'admin' tendrá otros permisos, como por ejemplo en este trozo de código, 'usuario'. El nivel de acceso que permitamos a los usuarios registrados en el sistema con permisos 'usuario' lo decidiremos en los recursos de cada módulo, indicando que tipo de usuarios pueden o no entrar. Para ello de nuevo añadiremos en los recursos de ese módulo una línea como esta: $RECURSOS["USUARIO"]="SI"; De esta manera, al entrar en un módulo y verificar la seguridad, se leerá este recurso y se verificará que el usuario que está intentando acceder, junto con su clave, sea un usuario con permiso 'usuario' y además el acceso a ese módulo para ese determinado tipo de usuarios esté habilitado (SI).



Ciertamente con esto tan solo tenemos controlado que tipo de usuarios entran en determinados módulos, pero no que dentro de un mismo módulo puedan tener funcionalidades distintas un tipo u otro de usuarios. Esto lo haremos duplicando dicho módulo, realizando las modificaciones en código para permitir o limitar ciertas funcionalidades y definiendo los recursos de manera adecuada. Por ejemplo, en el módulo de noticias, el administrador puede dar de alta noticias, pero además se les permite a los usuarios, añadir sus propias noticias (pero solo pueden ver y modificar o eliminar las suyas en propiedad). Para esto tendremos la siguiente estructura de directorios dentro de '/db/noticias': Imagenes publica <-- $RECURSOS["datos_bNobodyOk"] = "true"; privado <-- $RECURSOS["USUARIO"]="NO"; privado_usuarios <-- $RECURSOS["USUARIO"]="SI"; Esta duplicidad de código es necesaria ya que el código no será exactamente igual ya que para los usuarios se habrá limitado el listado para que solo muestre sus propios artículos, se habrá limitado la eliminación de noticias a las suyas únicamente, e incluso pueden modificarse los campos que se permite dar de alta. Podría pensarse que sería más simple hacer estas limitaciones dentro del mismo código, y quizás así lo fuera, pero he escogido esta opción para que prime la limpieza de código antes que ahorrarnos unos pocos kilobytes en el almacenamiento de la Web en el servidor. Por último, una vez que un usuario ha sido identificado correctamente haremos algo muy simple, que será ni más ni menos que dirigirlo a la zona privada de gestión adecuada a sus privilegios. Según los permisos del usuario que accede, se mostrará una cabecera con más o menos opciones, un margen, un pié... Simplemente tendremos que gastar cuidado en enlazar bien las opciones disponibles a su zona privada correspondiente (por ejemplo a privado_usuarios en lugar de a privado) y la zona de gestión para cada uno de los tipos de usuarios estará lista. Con el proceso de alta (siendo similar a la baja, la modificación y el buscador), listado y acceso a la zona de gestión comentados habremos expuesto todos los posibles escenarios que realizaremos con nuestra librería y estaremos ya capacitados en realizar una aplicación con cualquier número de módulos funcionales obteniendo así una aplicación completa.

Metodología Modelo-Vista-Controlador para la Programación Web en PHP Librería Base


10. LIBRERÍA BASE

10.1 INTRODUCCIÓN A continuación comentaré y explicare brevemente cual es la función de cada una de las clases que forman el conjunto de funciones básicas, las cuales serán las que formen nuestra librería base y que se situarán en la carpeta 'CodigoComun'. En el futuro, se podrán sustituir por nuevas versiones, así como añadir nuevas clases que aumenten la capacidad de nuestro conjunto de librerías y mejoren las aplicaciones Web resultantes.

10.2 Clase Control - Control.inc.php

Descripción: Clase principal encargada de todo el proceso de autenticación de usuarios, al inicio de la aplicación en lo referente a variables de sesión y además incluye algunas funciones de utilidad básicas sobre idioma, etiquetas, recursos, URL y errores. Variables de clase: pathGlobal Path a la carpeta de configuración global

pathParticular Path a la carpeta de configuración particular

RECURSOS Array con todos los recursos y etiquetas

database Nombre de la base de datos a usar

host Host donde esta la base de datos (IP o nombre de máquina)

infoPhplib Array pasado a page_open con información para phplib

bRequiereAuth Booleano - Si la pagina requiere o no autenticación

bLogout Booleano - Si se ha cerrado la sesión

bNobodyOk Booleano - Si el usuario nobody puede entrar en el módulo

bSesionCaducada Booleano - Indicación de sesión caducada

usuario Char – Identificación del usuario actual

bSalto Booleano - Si hay que saltar a otra dirección

urlSalto Cadena - Dirección de salto

infoPlantilla Array asociativo con los nombre de plantilla a incluir

tituloPagina Título de la pagina web

listaMensajes Lista de mensajes a mostrar

bHayError Booleano – Indicación de si hay o no error

tablasSecundarias Array asociativo con tablas secundarias



Métodos: Constructor:

Control($pathGlobal, $pathParticular) Constructor de la clase; se encargará de inicializar las variables principales, así como de crear el inicio de sesión y la carga de los recursos principales. Se le pueden pasar 2 parámetros para inicializar el path tanto de la configuración global como de la particular a usar en el módulo en cuestión.

Métodos Start, Stop y funciones de phplib:

start() Con esta función se iniciará nuestra aplicación; se cargará las librerías de phplib, las variables de sesión, el idioma, se comprobará la seguridad (si el usuario tiene o no permisos) y en caso afirmativo, inicializará la estructura de nuestra aplicación a nivel de framework y realizaremos la acción determinada para cada módulo. En caso contrario se guardará la URL que estábamos pidiendo y se realizará un salto para pedir al usuario que se identifique correctamente.

stop() Detenemos el proceso de construcción de la página y saltamos a una URL de fin.

phplibStart() Iniciamos las variables de phplib para que funcione la autenticación de usuarios.

phplibStop() Detenemos la sesión de phplib.

getInfoPhplib() Nos devuelve los datos actuales del phplib

setPathPhplib() Indicamos el path donde se encontraran los ficheros de phplib en caso de no usar los definidos en el servidor web por defecto

Métodos para tratamiento de sesiones:

cierraSesion($bNobody = false) Cierra una sesión si no es 'nobody' el usuario en el sistema (algún usuario se ha logueado)

isSesionCaducada() Devuelve 'true' si la sesión ha caducado

setSesionCaducada($b) Pone una sesión a caducada según el valor de la variable booleana $b

getVarSesion($label, $bBorrar = true) Obtiene el valor de una variable de sesión indicada en la etiqueta $label; si se indica 'true' en el booleano $bBorrar, la variable de sesión será puesta a vacío después de haber leído el valor.

setVarSesion($label, $val) Actualiza el valor de la variable de sesión indicada en la etiqueta $label con el valor $val; esta variable de sesión ha de existir.



Métodos de idioma:

cargaIdioma($idioma = "") Función que definirá qué idioma es el actual. Ésto estará marcado en la variable global &idioma. Inicialmente intentamos coger el idioma de la variable pasada a la función, aunque si no se nos pasa ninguna información sobre el idioma que queremos establecer, intentamos adquirirlo de las variables de sesión o del CGI. El idioma por defecto en el caso de que no se detecte esta variable será 'es' Español. Además esta función se encarga de cargar las etiquetas (globales y locales) en el idioma que se esté cargando. Parámetros de idioma válidos: 'es', 'uk', 'de', 'fr'...

Inicialización y Realización de la Acción:

inicializa() Se inicializarán las estructuras de la web; dado que esto dependerá de cada módulo, dejaremos que esta función sea implementada por las clases herederas.

doAccion() Se realizará la acción pertinente para cada módulo, dejaremos que esta función sea implementada por las clases herederas.

Métodos para tratar la URL y los saltos entre estas:

guardaInformacionSitio() Guarda la URL a la que estamos intentando acceder.

clearAndPushUrl($url) Limpia la pila de URLs y almacena la nueva.

getUrl() Obtenemos la URL de la pila

popUrl() Sacamos de la pila de URLs la última.

getParametroCGI($nombre) Obtenemos el valor del parámetro indicado por $nombre; el parámetro se habrá pasado por la URL.

getHttpPostFiles($nombre) Obtenemos el fichero indicado por $nombre de los subidos y almacenados en la variable POST correspondiente.

generaSalto() Por defecto se inicializa la variable urlSalto con el valor de la URL sin_permiso para saltar a la autenticación.

haySalto() Nos devuelve si hay un salto pendiente o no.

setSalto($b) Indicamos que hay que realizar un salto de URL

getUrlSalto() Obtenemos la URL a la que hay que saltar en ese momento.

setUrlSalto($u) Actualizamos el sitio donde hay que realizar el salto. Métodos para la autenticación y la seguridad:

requiereAuth() Se nos indica si se requiere autenticación en el módulo o



no.

isLogout() Indicación sobre si estamos autenticados o no.

isNobody() Devuelve 'true' si el usuario actual en la aplicación es 'nobody'

cambiaUsuario($user, $pass) Si el usuario y password existen, se realiza un cambio del usuario actual por el indicado. Este cambio se hace a nivel de phplib actualizando las variables de sesión correspondientes.

getUsuario() Recupera todos los datos del usuario actualmente logueado.

recuperaUsuario() Recupera todos los datos del usuario actualmente logueado.

checkSeguridad() Función muy importante. En esta función se realiza la comprobación del usuario y contraseña que el usuario introduce. Se verifica que se encuentra registrado en el sistema y posteriormente se verifica que nivel de acceso/seguridad cumple, permitiéndole el acceso a un modulo u otro. Para permitir o denegar el acceso a un módulo, será tan simple como añadir un recurso con los tipos de usuarios que hay en nuestra aplicación e indicar si se le permite el acceso o no. Se verifica que usuario es el que ha entrado y su tipo (o nivel de acceso) y se comprueba que indica el recurso de ese módulo para dejarlo entrar o fallar la autenticación.

Métodos para tratar los recursos:

getRecurso($nombre) Obtiene el recurso indicado en $nombre.

cargaRecursos() Carga todos los recursos tanto los globales como los particulares de un módulo.

Métodos para el tratamiento de errores y los mensajes que se muestran por pantalla:

setError($b) Pone la variable booleana 'bHayError' a true/false dependiendo de $b

isError() Retorna 'true' o 'false' según el valor de 'bHayError'

addMensaje($mensaje, $bError = false) Añade un mensaje a la lista de mensajes indicando si es un mensaje de error o no para mostrarlo con un formato u otro. El mensaje será uno indicado en los recursos con el mismo nombre.

addMensajeLibre($mensaje, $bError = false)

Igual que el método anterior pero con la diferencia que el texto del mensaje no se lee de los recursos sino que se usa directamente



el texto indicado en $mensaje.

addMensajeConPlantilla($mensaje, $valores, $bError = false)

El mensaje se forma sustituyendo los $valores en el texto del $mensaje que vendrá indicado en los recursos.

getFormatoMensaje($bError) Devuelve el formato adecuado para cuando el mensaje indica un error o cuando es un texto afirmativo o de verificación.

getTablaHtmlMensaje() Devuelve todos los mensajes que hayan almacenado en la lista de mensajes.

Otros Métodos:

getPlantilla($zona) Forma la ruta adecuada hacia la plantilla indicada en $zona

getTituloPagina() Retorna el título de la página

setTituloPagina($t) Actualiza el título de la página

addTablaSecundaria($nombreTabla, $campoClave, $orden, $filtroSql)

Se genera una tabla secundaria en nuestro array de tablas secundarias. Esto no es más que una array de valores leidos de la base de datos, de la tabla $nombreTabla, leyendo el campo $campoClave, en el orden indicado por $orden y añadiendo la sentencia WHERE si se indica algo en $filtroSql. Todo esto se almacena en otro array de datos.

getTablaSecundaria($nombreTabla) Retorna la tabla secundaria indicada.

getCampoTablaSecundaria($nombreTabla, $valorCampoClave, $campoEtiqueta)

Devuelve un campo específico de una tabla secundaria ya creada. El campo $valorCampoClave indica la clave del elemento a sacar de la tabla secundaria y $campoEtiqueta el registro en concreto dentro de la fila seleccionada.

getArraySelect($nombreTablaSecundaria, $campoClave, $campoEtiqueta)

Crea los valores para un elemento 'select' de un formulario basándonos en el contenido de una tabla secundaria cargada previamente. Se le indica la tabla, el campo clave de la misma para que sirva de valor para cada uno de los subelementos 'option' del elemento 'select' y se le indica la columna a leer que formará el texto de cada 'option'.



getArraySelectText($nombreTablaSecundaria,$campoClave,$campoEtiqueta, $valorAdicional,$esAlta)

Igual que la función anterior salvo que se toma un valor por defecto para el primer elemento del 'select' el cual se usará solo si estamos realizando un alta de datos.

10.3 Clase ControlFormAlta – ControlFormAlta.inc.php

Descripción: Extiende de: Control.inc.php Clase extendida de Control para realizar la función de 'Alta' en la aplicación. Sobrescribimos los métodos necesarios para realizar tanto el Alta como la modificación aunque su función más concreta es la de preparar el formulario y cargar los datos si es una modificación. Variables de clase: gestionTabla Objeto que se encargará de la gestión de todo el proceso de alta. Tendrá

que ser instanciado por clases herederas que extiendan a GestionTabla.

bAlta Indicación de si estamos realizando un alta o una modificación. Métodos: Constructor:

ControlFormAlta($bAlta) Se actualiza el valor de $bAlta y se llama al constructor del padre (de la clase Control)

Otros Métodos:

isAlta() Indicación de si estamos realizando una acción de alta o modificación

inicializa() Sobreescribimos este método. Indicamos qué ficheros formarán parte del framework para el módulo de alta.

doAccion() Sobreescribimos este método. Realiza la acción por defecto que será el crear un formulario de alta o modificación.

doAccionForm($bLoadDeCGI = false)

Realiza la acción por defecto cargando los datos de la URL si se le indica en el parámetro.

creaGestionTablaAlta() Método para ser sobreescrito por clases herederas.

getTablaHtmlFormulario() Devuelve el html formado en GestionTabla a través del objeto gestionTabla



10.4 Clase ControlFormBaja – ControlFormBaja.inc.php

Descripción: Extiende de: Control.inc.php Clase extendida de Control para realizar la función de 'Baja' en la aplicación. Sobreescribimos los métodos necesarios para realizar una tarea doble, mostrar los datos como si de una modificación se tratase (pero sin posibilidad de editar nada) para pedir una confirmación, y realizar la baja del elemento. Variables de clase: gestionTablaBaja Objeto encargado de la gestión del proceso de baja

gestionTablaDetalle Objeto encargado de mostrar un detalle de confirmación Métodos: Constructor:

ControlFormBaja() Se llama al constructor del padre (de la clase Control) Otros Métodos:

inicializa() Sobreescribimos este método. Indicamos qué ficheros formarán parte del framework para el módulo de baja.

doAccion() Sobreescribimos este método. Realiza la acción por defecto que será el crear un formulario de confirmación para realizar la baja.

doAccionForm($bLoadDeCGI = false) Realiza la acción por defecto.

getTablaHtmlFormularioBaja() Devuelve el html generado para el formulario de baja, que puede contener simplemente un botón 'eliminar' u otra información extra.

getTablaHtmlFormularioDetalle() Devuelve el detalle del elemento a eliminar

getRegistro() Devuelve el registro con todos los datos cargados.

creaGestionTablas() Método para ser sobreescrito por clases herederas



10.5 Clase ControlFormLocaliza – ControlFormLocaliza.inc.php

Descripción: Extiende de: Control.inc.php Clase extendida de Control para realizar la función de 'Búsqueda' en la aplicación. Sobreescribimos los métodos necesarios para mostrar un formulario de búsqueda. Variables de clase: gestionTabla Objeto que se encargará de la gestión de todo el proceso de

búsqueda. Es instanciado de la clase GestionTablaLocaliza.

tipoAccion Indicación del tipo de acción que por defecto será 'modifica' Métodos: Constructor:

ControlFormLicaliza($tipoAccion = "modifica")

Se actualiza el valor de $tipoAccion y se llama al constructor del padre (de la clase Control)

Otros Métodos:

getTipoAccion() Indicación de si estamos realizando una acción de modificación

inicializa() Sobreescribimos este método. Indicamos qué ficheros formarán parte del framework para el módulo de búsqueda.

doAccion() Sobreescribimos este método. Realiza la acción por defecto que será el crear un formulario de búsqueda.

doAccionForm($bLoadDeCGI = false) Realiza la acción por defecto.

getTablaHtmlFormulario() Devuelve el formulario html generado

creaGestionTablaLocaliza() Creamos el objeto 'gestionTabla' de la clase GestionTablaLocaliza

10.6 Clase ControlListado – ControlListado.inc.php

Descripción: Extiende de: Control.inc.php Clase extendida de Control para realizar la función de 'Listado' en la aplicación. Sobreescribimos los métodos necesarios para generar el listado de datos.



Variables de clase: gestionListado Objeto que se encargará de la gestión de todo el proceso de listado. Es

instanciado de la clase GestionListado. Métodos: Constructor:

ControlListado() Se llama al constructor del padre (de la clase Control) Otros Métodos:

inicializa() Sobreescribimos este método. Indicamos qué ficheros formarán parte del framework para el módulo de listado.

doAccion() Sobreescribimos este método. Realiza la acción por defecto que será el crear un listado de datos.

getTablaHtmlListado() Devuelve el html generado con el listado de datos

creaGestionListado() Creamos el objeto 'gestionListado' de la clase GestionListado

getTablaHtmlIndice() Obtenemos el html generado para mostrar los índices de las páginas del listado

getBloqueActual() Obtenemos el bloque de datos en el que nos encontramos. Se corresponderá con el número de índice.

10.7 Clase ControlDoAlta – ControlDoAlta.inc.php

Descripción: Extiende de: ControlFormAlta.inc.php Clase extendida de ControlFormAlta para realizar la función de 'Alta'. Esta clase es la que hace realmente que se ejecute la acción ya que ControlFormAlta tan solo preparaba el formulario de alta. Aquí se maneja más la lógica del alta, inicializando el formulario si es necesario, validando los datos y si todo es correcto realizando la acción de alta. Cargará una u otra plantilla dependiendo de la acción adecuada. Podría incluso realizar el salto a otra URL distinta tras realizar la acción.


ControlDoAlta($bAlta) Se llama al constructor del padre (de la clase ControlFormAlta) Otros Métodos:

inicializa() Sobreescribimos este método. Indicamos qué ficheros formarán parte del



framework para el módulo de listado.


10.8 Clase ControlDoBaja – ControlDoBaja.inc.php

Descripción: Extiende de: ControlFormBaja.inc.php Clase extendida de ControlFormBaja para realizar la función de 'Baja'. Esta clase es la que hace realmente que se ejecute la acción ya que ControlFormBaja tan solo preparaba el formulario de baja. Aquí se maneja más la lógica de la baja, inicializando el formulario si es necesario y realizando la acción de baja. Realiza el salto a otra URL distinta tras realizar la acción Métodos: Constructor:

ControlDoBaja() Se llama al constructor del padre (de la clase ControlFormBaja) Otros Métodos:

inicializa() Sobreescribimos este método. Indicamos qué ficheros formarán parte del framework para el módulo de listado.


10.9 Clase ControlDoLocaliza – ControlDoLocaliza.inc.php

Descripción: Extiende de: ControlFormLocaliza.inc.php Clase extendida de ControlFormLocaliza para realizar la función de 'Búsqueda'. Esta clase es la que hace realmente que se ejecute la acción ya que ControlFormLocaliza tan solo preparaba el formulario de búsqueda. Aquí se maneja la lógica del buscador, inicializando el formulario si es necesario, validando los datos y si todo es correcto realizando la acción de búsqueda. Cargará una u otra plantilla dependiendo de la acción adecuada y se saltará al listado de elementos si la búsqueda ha dado algún resultado. Nota: Inicialmente por defecto, si se indica una acción (como alta o modificación) el buscador puede saltar, una vez encontrado el elemento, a su ficha para modificarlo o para eliminarlo, aunque este funcionamiento por defecto podría eliminarse al mezclarse conceptos! Para futuras mejoras estudiar este último punto




ControlDoLocaliza() Se llama al constructor del padre (de la clase ControlFormLocaliza) indicándole inicialmente una acción por defecto a realizar.

Otros Métodos:

inicializa() Sobreescribimos este método. Indicamos qué ficheros formarán parte del framework para el módulo de búsqueda.

doAccion() Sobreescribimos este método. Realiza la acción por defecto que será la de saltar al elemento encontrado para modificarlo o para eliminarlo. Ésto es solo posible si la búsqueda da como resultado un único elemento, por lo que esta acción será sobreescrita para que se salte directamente al listado de artículos.

10.10 Clase GestionTabla – GestionTabla.inc.php

Descripción: Clase principal encargada de la creación de los formularios de alta, bajas y modificaciones. Esta clase pone la base para que se cree el formulario, inicializarlo y cargar los datos de la base de datos o de los parámetros del CGI. Se creará una tabla con dicho formulario. Variables de clase: database Variable que contendrá el nombre de la base de datos actual.

tablaBD Nombre de la tabla que usaremos por defecto

campoClaveTabla

Nombre del campo 'clave' para identificar los elementos en la tabla

campoClaveCGI Nombre del campo que se pasará por la URL para referirnos al campo clave

formulario Objeto que contendrá el formulario con sus etiquetas básicas.

registro Registro con todos los datos que se cargarán desde la base de datos. Principalmente se usará en las modificaciones, bajas y búsquedas.

infoRegistro Array que contendrá la información necesaria para crear los registros que contendrá el formulario.

tablaHtml Objeto que formará todo le formulario así como contenido HTML extra.

Métodos:



Constructor:

GestionTabla() Inicializará las variables básicas. Métodos para preparar el formulario

preparaForm Realiza la creación de todo el formulario llamando a los métodos necesarios

creaHiddenForm Crea los campos ocultos de un formulario, dejaremos que esta función sea implementada por las clases herederas.

addCamposForm Añade campos a un formulario basándose en el array de datos infoRegistro creado previamente

setValorCampoForm($nombre, $valor)

Añade al campo indicado por $nombre el valor indicado en $valor.

creaBotonesForm Crea los botones que llevará el formulario, dejaremos que esta función sea implementada por las clases herederas.

inicializaTablaHtml Creará la tabla completa con el formulario.

getTablaHtml Se devuelve el formulario completo ya creado. Otros Métodos

inicializa() Crea el formulario y lo inicializa llamando a los dos métodos siguientes, dejaremos que esta función sea implementada por las clases herederas.

creaForm() Crea el formulario indicando la acción a realizar, dejaremos que esta función sea implementada por las clases herederas.

inicializaInfoForm() Inicializa el array de datos infoRegistro a vacío inicialmente, dejaremos que esta función sea implementada por las clases herederas.

doAccion() Define la acción a realizar, dejaremos que esta función sea implementada por las clases herederas.

valida() Valida los datos introducidos en un formulario, dejaremos que esta función sea implementada por las clases herederas.

cargaRegistroDesdeBD($claveRegistro)

Se encarga de cargar el registro correspondiente al elemento con clave $claveRegistro en el formulario actual. Principalmente para modificaciones o bajas.

validaCargaRegistro() Realiza la validación del registro cargado principalmente para ver si su campo clave



contiene algún dato.

cargaRegistroDesdeCGI() Función similar a cargaRegistroDesdeDB pero leyendo el registro de los parámetros de la URL

getRegistro() Nos retorna el registro recién leído y cargado en la variable 'registro'

10.11 Clase GestionListado – GestionListado.inc.php

Descripción: Clase principal encargada de la creación de los listados. Esta clase pone la base para que se cree el listado, creando la sentencia SQL, leyendo los datos de la base de datos y generando el listado y todas sus partes: Cabecera, lineas y columnas y hasta el índice inferior. Variables de clase: database Variable que contendrá el nombre de la base de datos actual.

tablaBD Nombre de la tabla que usaremos por defecto

campoClaveTabla

Nombre del campo 'clave' para identificar los elementos en la tabla

campoClaveCGI Nombre del campo que se pasará por la URL para referirnos al campo clave

listado Objeto que generará el listado de elementos

indice Objeto que generará el índice a mostrar bajo el listado

registros Array que contendrá todos los registros leídos de la base de datos y que serán los que formen el listado.

numRegistros Número de registros cargado en la variable registros

bloqueActual Número de bloque de datos en el que nos encontramos tras habernos movido por los índices

sizeBloque Tamaño del bloque de datos a mostrar en una página

listaFormatosTD Lista de formatos a aplicar a cada columna de datos

formatoPar Formato a aplicar a las filas pares

formatoImpar Formato a aplicar a las filas impares

metaColumnas Contendrá el array que se usará para generar las columnas del listado y aplicar las funciones de maquetado necesarias.

funciones Array con funciones a aplicar a cada columna de datos

sql Variable que contendrá la sentencia SQL construida para generar el listado.




GestionListado() Inicializará las variables básicas. Métodos para construir el listado

doAccion() Método encargado de construir el listado paso a paso llamando a los métodos siguientes

generaMetaColumnas() Generamos las columnas a mostrar en el listado. Esta función será redeclarada por las clases herederas para adecuarse a los campos necesarios a mostrar.

generaFunciones() Aquí se crearán las funciones que se vayan a usar para aplicar a cada campo del listado.

getTablaHtmlListado() Método que genera el listado por completo.

getTablaHtmlIndice() Método encargado de calcular el número índice correspondiente según los datos leídos y la página en la que nos encontremos.

generaFormatosTabla() Generará los formatos de estilos a aplicar a cada columna

generaCabeceraTabla() Generar la cabecera de la tabla que contiene al listado Métodos para generación de la sentencia SQL

generaSqlListado() Método que generará la sentencia SQL llamando a los métodos siguientes.

getCamposListado() Generación de los campos a leer de la base de datos, estas funciones serán redeclaradas por las clases herederas

getCondicionListado() Generación de la condición para la sentencia SQL, estas funciones serán redeclaradas por las clases herederas

getOrdenListado() Generación del orden y otros parámetros opcionales, estas funciones serán redeclaradas por las clases herederas

Otros Métodos

generaRegistros() Cargaremos dentro de la variable 'registros' los datos leídos de la base de datos usando la sentencia SQL, así como otros datos generados previamente.

getCampoRegistro($clave, $campo)

Método que nos ayudará a obtener un campo del conjunto de registros cargado

calculaSizeBloque() Actualiza la variable 'sizeBloque' con el valor actual del bloque indicado en los recursos.

getRecursoSizeBloque() Obtiene de los recursos el tamaño del bloque definido



10.12 Clase GestionTablaAlta – GestionTablaAlta.inc.php

Descripción: Extiende de: GestionTabla.inc.php Clase extendida de GestionTabla para especificar las acciones necesarias para realizar el alta o la modificación de un elemento. Usaremos la misma clase para realizar los altas y las modificaciones ya que la diferencia entre ambos es muy pequeña (cargar en el formulario los datos ya almacenados o no). Nota: En esta clase se han creado funciones para el tratamiento de imágenes y ficheros funciones las cuales se podrían sacar y crear en alguna clase ya existente como por ejemplo 'Util'. Permanecerán aquí en la primera versión de esta librería. Variables de clase: bAlta Variable en la que se indicará si estamos realizando un alta o una modificación Métodos: Constructor:

GestionTablaAlta() Se llama al constructor del padre (de la clase GestionTabla) y se actualiza la variable booleana bAlta

Métodos:

creaForm() Sobreescribimos éste método para indicar una acción por defecto para el alta y para la modificación

creaBotonesForm() Sobreescribimos éste método para poner un botón adecuado dependiendo de si es un alta o una modificación

Métodos para guardar imágenes o ficheros

guardaImagen($infoPostImagen, $clavePrimaria)

Método para guardar en el disco una imagen pasándole toda la información de esta en la variable $infoPostImagen y una clave $clavePrimaria para que sea almacenada con ésta por nombre.

eliminaImagen($clavePrimaria) Eliminar una imagen con nombre $clavePrimaria

existeImagen($clavePrimaria) Comprobación sobre la existencia de una imagen

guardaImagenConNumero($infoPostImagen,$clavePrimaria,$numImagen)

Igual que su análoga pero añadiéndole una segunda clave de imagen al nombre del fichero. Para casos en los que puede haber dos o tres imágenes asociadas a un elemento.

eliminaImagenConNumero($clavePri Eliminación de la imagen correspondiente



maria,$numImagen)

existeImagenConNumero($clavePrimaria,$numImagen)

Comprobación de la existencia de la imagen correspondiente

guardaImagenConNombre($infoPostImagen, $nombre)

Guarda una imagen al disco pero esta vez con un nombre específico. Se requerirá almacenamiento de los nombres de las imágenes en la base de datos

eliminaImagenConNombre($nombre) Eliminación de una imagen con un nombre det.

existeImagenConNombre($nombre) Comprobación de la existencia de la imagen.

guardaFichero($infoPostFichero, $referencia)

Almacenamiento de un fichero en el disco usando una referencia (o clave) por nombre.

eliminaFichero($referencia) Eliminación de un fichero del disco

existeFichero($referencia) Comprobación de la existencia de un fichero

guardaFicheroConNombre($infoPostFichero, $nombre)

Almacenamiento de un fichero en disco usando un nombre especifico

eliminaFicheroConNombre($nombre,$extension)

Eliminación del fichero correspondiente a un nombre y una extensión

existeFicheroConNombre($nombre,$extension)

Comprobación de la existencia de un fichero con un nombre y extensión específicos.

10.13 Clase GestionTablaBaja – GestionTablaBaja.inc.php

Descripción: Extiende de: GestionTabla.inc.php Clase que especificará las acciones necesarias para realizar la baja de un elemento. Con esta clase ya se puede realizar la eliminación de un elemento simplemente usando la clave de este. Para realizar eliminaciones más complejas y elaboradas habrá que instanciar esta clase. Nota: Aquí también se incluyen método para la eliminación de ficheros e imágenes. Se tendrá esto en cuenta para eliminarlos en la siguiente versión de la librería. Métodos: Constructor:

GestionTablaBaja() Se llama al constructor del padre. Métodos para la eliminación

creaForm() Sobreescribimos éste método para crear el formulario de confirmación.

creaHiddenForm() Creamos los campos ocultos necesarios. Por defecto la clave.



creaBotonesForm() Sobreescribimos éste método para poner un botón adecuado dependiendo de si es un alta o una modificación

valida() Validación del registro a eliminar. Comprobación de su existencia

doAccion() Realizamos la eliminación del registro según la sentencia SQL construida por el método siguiente.

getSql() Generamos la sentencia SQL de la eliminación Otros Métodos – eliminación de ficheros

eliminaFichero($nombre) Método para eliminar un fichero con un nombre específico del disco.

eliminaImagen($clavePrimaria) Método para eliminación de una imagen.

eliminaImagenConNumero($clavePrimaria,$numImagen)

Método para eliminación de imágenes secundarias marcadas con un numero extra '$numImagen'

eliminaDocumento($clavePrimaria) Método para eliminar un documento con una clave específica por nombre. - Se comprobará similitud con el método 'eliminaFichero' para unificación.

10.14 Clase GestionTablaLocaliza – GestionTablaLocaliza.inc.php

Descripción: Extiende de: GestionTabla.inc.php Clase para especificar las acciones necesarias para realizar la búsqueda de un elemento. Con esta clase ya se puede realizar la búsqueda de un elemento simplemente usando la clave de este; dado que esto no será de gran utilidad para la mayoría de los casos habrá que instanciar esta clase para crear un formulario de búsqueda adecuado a nuestras necesidades. Métodos: Constructor:

GestionTablaLocaliza() Se llama al constructor del padre. Métodos

creaForm() Sobrescribimos éste método para crear el formulario de búsqueda e indicar la acción a realizar. Éste método será redeclarado por las clases herederas

creaBotonesForm() Sobrescribimos éste método para poner un botón 'Localizar'. Éste método será redeclarado por las clases herederas

inicializaInfoForm() Método para construir el formulario de búsqueda. Éste método será redeclarado por las clases herederas



valida() Método para validar los datos del formulario, éste método será redeclarado por las clases herederas

getCampoClaveRegistro() Retorna el campo clave

10.15 Clase ControlLogin – ControlLogin.inc.php

Descripción: Extiende de: Control.inc.php Clase extendida de Control para realizar la función de Login en la aplicación. El método doAcción se especializa para obtener los datos del usuario y verificar si es válido; Si es un usuario válido cambiamos las variables de sesión y el usuario quedará logueado y se redirige a la página indicada en el recurso 'url_inicio'; en caso contrario se le volverán a pedir los datos de acceso. Métodos: Constructor:

ControlLogin() Se llama al constructor del padre (la clase Control) y se actualiza la variable booleana 'bNobodyOk' a 'true' para permitir inicialmente el acceso al módulo.

Otros Métodos:

inicializa() Sobrescribimos este método. Indicamos qué ficheros formarán parte del framework para el módulo de login.

doAccion() Sobrescribimos este método. Realiza la acción por defecto que será la de comprobar si los datos de usuario introducidos son válidos para redirigir al mismo a una zona de la aplicación o volver a pedir su autenticación.

10.16 Clase ControlLogout – ControlLogout.inc.php

Descripción: Extiende de: Control.inc.php

Clase extendida de Control para realizar la función de Logout y cerrar la sesión. Métodos: Constructor:

ControlLogout() Se llama al constructor del padre (la clase Control) y se actualiza la variable booleana 'bNobodyOk' a 'true' para permitir inicialmente el



acceso al módulo. Otros Métodos:

inicializa() Sobrescribimos este método. Indicamos qué ficheros formarán parte del framework para el módulo de logout.

doAccion() Sobrescribimos este método. Realiza la acción por defecto que será la de cerrar la sesión.

10.17 Clase TablaHtmlFormulario – TablaHtmlFormulario.inc.php Descripción: Creación línea a línea de cada uno de los campos que formarán parte del formulario. Dependiendo del tipo de datos a crear se añadirá un complemento distinto. Los complementos corresponden a los distintos elementos que pueden componer un formulario: textos, select, checkbox, campos hidden... Nota: Se crea el formulario con formato de tabla; si se desea mejorar usando 'div' será en este fichero donde tendremos que modificarlo. Variables de clase: formulario Objeto del tipo ‘formularioHtml’ que contendrá el

formulario y con el que crearemos la tabla HTML final.

formatoTabla Información del formato de la tabla (estilos)

listaFormatosTDEtiquetas Array con la información del formato de cada etiqueta

listaFormatosTDCampos Array con la información del formato de cada campo Métodos: Constructor:

TablaHtmlFormulario($formulario,$formatoTabla,$listaFormatosTDE, $listaFormatosTDC)

Se inicializan las variables iniciales

TablaHtmlFormulario($formulario) Segundo constructor al que no se le pasan los formatos

Otros Métodos:

getFormatoTabla() obtenemos el formato que hemos dado a la tabla anteriormente

setFormatoTD($tipo, $nombre, $formato)

Método que actualiza el formato de un campo o etiqueta (tipo indicado por $tipo) de nombre $nombre

getFormatoTD($tipo, Método que nos devuelve el formato de un campo o



$nombre, $nombreAlternativo) etiqueta indicado. Si no se encuentra devuelve el formato del campo indicado en $nombreAlternativo.

getHtmlSinForm() Método que devuelve todo el HTML generado pero sin la etiqueta ‘Form’ inicial y final.

getHtml($bBotonesEnFila ) Método similar al anterior devolviendo todo el contenido HTML generádo. Se le puede indicar si se añaden los botones al formulario.

getFilaCampoHtml($atributos, $bIncluirBotones)

Método que crea fila a fila cada uno de los campos del formulario. Cada fila contendrá 2 columnas una con la etiqueta y otra con el campo propiamente dicho.

10.18 Clase TablaHtmlListado – TablaHtmlListado.inc.php Descripción: Creación de cada uno de las líneas que formarán parte del listado. Variables de clase: cabeceraTabla Variable que contendrá la cabecera del listado

formatoTRPar Formatos para los TR pares de la tabla resultante

formatoTRImpar Formatos para los TR impares de la tabla resultante

listaFormatosTD Información del formato de la tabla (estilos)

registros Registros leídos de la base de datos

metaColumnas Array con las columnas a generar para formar el listado

instanciaClaseFunciones Referencia al objeto que contendrá las funciones a aplicar a cada columna del listado.

registroActual Registro para el que se está generando HTML actualmente

numFilas Número de filas leidas de la base de datos

filaActual Variable usada para ver si la fila es par o impar

html Variable que contendrá todo el HTML generado Métodos: Constructor:

TablaHtmlListado($metaColumnas,&$instanciaClaseFunciones,$registros,$cabeceraTabla,$listaFormatosTD, $formatoTRPar,$formatoTRImpar)

Se inicializarán todos las variables básicas y se definen los formatos.

Otros Métodos:



getHtml() Retorna todo el HTML generado (todo el listado incluyendo la cabecera)

getCabecera() Genera la cabecera de la tabla del listado

generaListado() Genera el contenido del listado llamando a los métodos siguientes

generaListadoUnaLinea() Genera el listado de lineas usando elementos DIV

generaListadoUnaLineaTabla() Genera el listado de lineas usando elementos TD

getFormatoTD($nombre) Retorna el formato para ese campo de la tabla

getRegistroActual() Devuelve el registro actual completo

getCampo($nombre) Devuelve un campo del registro actual

10.19 Clase FormularioHtml – FormularioHtml.inc.php Descripción: Clase independiente usada para la generación de todos y cada uno de los distintos tipos de componentes que pueden formar parte de un formulario. Text, checbox, button, campos hidden, textarea... serán los componentes que aqui se crearán, basándonos en el array creado previamente en la función GestiónTablaAlta. El botón del formulario, el valor del action, los campos ocultos e incluso el método de envío o encriptacion se generarán en esta clase. Variables de clase: name Nombre del formulario a crear

target Destino de la nueva página al pulsar en el formulario

action Acción a realizar al pulsar el boton de ‘submit’

method Método de envío de datos ‘GET’ o ‘POST’

enctype Tipo de encriptación para el envio de datos

listaCampos Lista de campos a añadir al formulario Métodos: Constructor:

FormularioHtml($a= "", $n = "__form1", $t = "_top", $m="POST", $e = "")

Define los valores iniciales por defecto

Otros Métodos:

Add($infoCampo, $val = "") Añade a la lista de campos un nuevo campo



addHidden($nombre, $valor) Añade a la lista de campos un nuevo campo oculto

addBoton($nombre, $valor, $tipo = "submit",$estilo = 'class="formulario-boton"')

Añade a la lista de campos un nuevo boton

setAtributoCampo($nombreCampo, $nombreAtributo, $valor)

Método que modifica un atributo de un campo en la lista de campos

getAtributoCampo($nombreCampo, $nombreAtributo)

Obtiene el valor de un atributo de un campo de la lista de campos

getCabeceraFormHtml() Genera la cabecera del formulario usando los valores actuales de las variables de clase

getHidden() Obtiene/Genera los campos ocultos

getBotones() Obtiene/Genera los botones

getCampoHtml($nombreCampo, $bSoloValor = false)

Obtiene/Genera el HTML correspondiente a un campo del formulario. En caso de tratarse de un campo tipo ‘select’, si se indica ‘bSoloValor’ a ‘true’ tan solo se obtendrá el valor actual del campo y no todo el desplegable.

generaOpcionesSelect($lista, $valor, $encabezado)

Genera todas las etiquetas internas de un elemento tipo ‘select’. Se añadirá una primera opción con texto $encabezado. Se llama al método siguiente para generar las líneas ‘option’.

generaOpcionSelect($valorElemento, $etiquetaElemento, $valor)

Genera las líneas ‘option’ que componen un select

showHtml($bBotonesEnFila = false) Devuelve todo el HTML del listado

getCampos() Devuelve el listado completo de campos

10.20 Clase FormatoHtml – FormatoHtml.inc.php Descripción: Con esta clase creamos los formatos para los distintos elementos. Nos referimos con formato a los estilos que se usarán y lo separaremos en las etiquetas iniciales, el contenido de la etiqueta y el cierre de la misma. Variables de clase: formatoPre Etiquetas de apertura de formatos

formatoPost Etiquetas de cierre de formatos

patron Patrón a formatear (añadirles las etiquetas de apertura y cierre)




FormatoHtml( $formatoPre = "", $formatoPost = "", $patron = "_patron_")

Define los valores por defectos para las 3 variables de la clase

Otros Métodos:

creaFormato($formatoPre, $formatoPost, $patron = "_patron_")

Actualiza los valores de formato (pre, post y patrón) llamando a los métodos siguientes

setFormatoPre($f) Actualiza el valor de la variable ‘formatoPre’

setFormatoPost($f) Actualiza el valor de la variable ‘formatoPost’

setPatron($p) Actualiza el valor de la variable ‘patron’

getPatron() Retorna el valor de la variable ‘patron’

getFormatoPre() Retorna el valor de la variable ‘formatoPre’

getFormatoPost() Retorna el valor de la variable ‘formatoPost’

getPlantilla() Forma una plantilla formateada (pre, patron y post)

getTextoFormateado($texto) Formatea un texto añadiendole los formatos pre y post alrededor

printTextoFormateado($texto) Imprime por pantalla un texto formateado

printStart() Imprime por pantalla la variable ‘formatoPre’

printEnd() Imprime por pantalla la variable ‘formatoPost’

10.21 Clase CorreoHtml – CorreoHtml.inc.php Descripción: Clase independiente destinada a la creación de un correo HTML y proceder al envío. Es un nivel superior para facilitar el uso de la librería 'html_mime_mail'. Variables de clase: from Variable ‘from’ del correo (email de origen)

fromAlias Nombre asignado a la variable ‘from’

to Variable ‘to’ del correo (email de destino)

toAlias Nombre asignado a la variable ‘to’

html HTML que queremos enviar por correo

file Array que contendrá los ficheros a enviar adjuntos en el correo

numFiles Número de ficheros incluidos en el correo



images Array que contendrá las imágenes a enviar adjuntas en el correo

numImages Número de imágenes incluidas en el correo

subject Asunto del correo

mail Objeto que conendrá el contenido completo del email (con todas las etiquetas y cabeceras) (instanciado de la clase html_mime_mail)


CorreoHtml()

CorreoHtml($from, $fromAlias, $to, $toAlias, $subject, $html, $bNoEnviar = false)

Inicia la construcción del correo usando los datos pasados como parámetros.

Otros Métodos:

reset() Resetea todos los campos del correo

setFrom($email, $alias = "") Actualiza la variable ‘from’

setTo($email, $alias = "") Actualiza la variable ‘to’

setSubject($txt) Actualiza la variable ‘subject’

setHtml($html) Actualiza la variable ‘html’

addFile($fileName, $etiqueta)

Añade un fichero al array de ficheros

addImage($fileName, $srcName)

Añade una imagen al array de imágenes

procesaImagenes() Añade el HTML necesario para añadir las imágenes al contenido del email (al objeto mail)

procesaAdjuntos() Añade el HTML necesario para añadir los ficheros adjuntos al contenido del email (al objeto mail)

procesaHtml() Se procesa todo el HTML generado y se añade al objeto mail para su posterior envío.

send() Genera toda la información necesaria usando los métodos anteriores y ejecuta el método ‘send’ del objeto mail para realizar el envío del correo.

leeFichero($fileName) Método que lee el contenido de un fichero



10.22 Clase InfoSesion – InfoSesion.inc.php Descripción: Clase independiente usada para manejar la información de la sesión. Se mantendrán tanto los datos de la sesión, como una pila para la URL. Variables de clase: classname = “InfoSesion” Nombre de la sesion

data Array de datos (variables de sesión)

pilaUrl Pila para almacenar las URL (instancia de la clase ‘Pila’) Métodos: Constructor:

No se ha definido ningún constructor Otros Métodos:

start($nombreSesion, $vars) Registra un nombre de sesión $nombreSesion y almacena en el array ‘data’ las variables indicadas en $var

setVar($key, $value) Añade al array ‘data’ una nueva variable $key con su valor

getVar($key) Obtiene una variable

isDefVar($key) ‘true’ si la variable está definida

extraeVar($key) Obtiene el valor de una variable y borra su contenido

pushUrl($url) Añade una URL a la pila

popUrl() Saca una URL de la pila

getUrl() Obtiene la URL actual (la que está encima de la pila)

clearPilaUrl() Limpia la pila de URL

clearAndPushUrl($url) Limpia la pila y añade una nueva

showPilaUrl() Muestra el contenido de la pila

10.23 Clase Indice – Indice.inc.php Descripción: Clase encargada de la creación de los índices en los listados. Esta clase será instanciada en GestiónListado para crear el índice.



Variables de clase: query Parámetros que se le pasaron a la URL

label Etiqueta usada para pasar el bloque por la URL

numFilas Número de filas leídas de la base de datos

sizeBloque Tamaño del bloque de datos a mostrar

bloqueActual Bloque en el que nos encontramos

superBloque Cantidad de números a mostrar en el índice

formatoCeldaTexto Estilo a aplicar al texto del enlace

formatoCeldaEnlace Estilo a aplicar a la celda que contiene al enlace

formatoEnlace Estilo a aplicar al enlace

url URL a saltar cuando se pulse en un índice

textoAnterior Texto para la etiqueta ‘anterior’

textoSiguiente Texto para la etiqueta ‘siguiente’ Métodos: Constructor:

Indice($urlCompleta, $l, $nf, $b, $sizeb, $superb = 20, $ta = "Anterior", $ts = "Siguiente")

Inicializa todas las variables iniciales.

Otros Métodos:

getHtml() Retorna todo el HTML para imprimir los índices

generaIndice() Método que construye los índices

getBloqueInicial() Define el bloque de datos inicial

10.24 Clase ListaMensajes – ListaMensajes.inc.php Descripción: Clase independiente usada para generar una lista de mensajes. Estos mensajes serán los errores o avisos que llegados un momento se imprimirán por pantalla. Hasta que no se crea conveniente se irán almacenando. Pueden añadirse indicando el formato que se usará para mostrar dicho mensaje. (Por ejemplo, verde para los mensajes afirmativos o positivos y rojo para los errores o alertas) Variables de clase: lista Array de mensajes



indice Número de mensajes en ‘lista’ Métodos: Constructor:

ListaMensajes() Inicializa la variable ‘indice’ a cero Otros Métodos:

Add($labelMensaje, $formato) Añade un nuevo mensaje a la lista de mensajes indicando también el formato en el que se mostrará. El texto del mensaje se leerá de los recursos.

addLibre($labelMensaje, $formato)

Añade un nuevo mensaje a la lista de mensajes indicando el formato. Se indica el texto a añadir directamente.

addConPlantilla($labelPlantilla, $valores, $formato)

Añade un nuevo mensaje a la lista de mensajes. El mensaje se añade con una plantilla en la que habrá que sustituir los valores.

getHtml() Obtiene el HTML con todos los mensajes

show() Imprime la tabla con todos los mensajes.

10.25 Clase ParametrosCGI – ParametrosCGI.inc.php Descripción: Clase independiente usada para la generación de las URL con parámetros. Será la que usaremos a bajo nivel para pasar parámetros por la URL o también de obtenerlos/quitarlos. Métodos: Constructor:

No se ha definido constructor Otros Métodos:

quitaOpcionHTTP_GET($cadena, $opcion)

Quia de una cadena dada (URL) el parámetro pasado $opcion junto con su valor asignado.

ponOpcionHTTP_GET($cadena, $opcion, $valor)

Añade a una cadena $cadena (URL) un nuevo conjunto $opcion=$valor como parámetro

generaParametroURL($label, $val) Genera HTML de la forma $label=$val para añadir a una URL



10.26 Clase Pila – Pila.inc.php Descripción: Implementación básica de una pila, de utilidad para alguna de nuestras clases. Variables de clase: classname = "Pila"

data Array de datos (variables de sesión) Métodos: Constructor:

Pila() Limpia la pila Otros Métodos:

push($valor) Añade un elemento en la pila

pop() Saca un elemento de la pila

getActual() Obtiene el elemento actual (la que está encima de la pila)

clear() Limpia la pila

show() Muestra el contenido de la pila

10.27 Clase CheckData – CheckData.inc.php Descripción: Clase encargada comprobación de los datos introducidos en los formularios o en cualquier función que requiera la validación de algún tipo de datos. Validaciones de email, teléfono, cif, campos numéricos... serán las funciones aquí implementadas. Métodos: Constructor:

No se define constructor para esta clase. Otros Métodos:

esEntero($a) Comprueba si el dato $a es un entero

esEnteroPosNeg($a) Comprueba si el dato $a es un entero positivo o negativo

esReal($a) Comprueba si el dato $a es un real



esRealPosNeg($a) Comprueba si el dato $a es un real positivo o negativo

fechaCorrecta($fecha) Comprueba si la $fecha tiene formato correcto

horaCorrecta($hora) Comprueba si la $hora tiene formato correcto

validaEmail($emailTest)

Comprueba si el email indicado es válido

checkDocumentoValida($nombreDocumento)

Comprueba si el documento pasado como parámetro es correcto (dentro de un tipo especifico y de tamaño adecuado)

checkImagenValida( $nombreDocumento)

Comprueba si la imagen pasada como parámetro es válida (dentro de un tipo específico y de tamaño adecuado)

validaCIF($cif) Comprobación del CIF

validaNIF($nif) Comprobación del NIF

10.28 Clase FuncionesListado – FuncionesListado.inc.php Descripción: Clase independiente usada para definir funciones las cuales se usaran desde GestiónListado o sus herederas. Serán las funciones que se cargarán en GestiónListado y se aplicarán a cada columna del listado que se esté formando. Nota: NO se definirán aquí funciones de utilidad para distintos fines. Variables de clase: ptListado Referencia a un objeto del tipo 'TablaHtmlListado'

html Variable que contiene el HTML que se va generando para el listado Métodos: Constructor:

No se define constructor para esta clase. Otros Métodos:

evalua($ptListado, $metodo) Realiza la ejecución de un método sobre el listado

muestraLinkDetalle($plantillaUrl, $etiquetaParametro, $nombreCampoClave)

Genera un link dentro de un campo del listado, añadiéndole el parámetro indicado por $etiquetaParametro y con el valor indicado por la columna $nombreCampoClave (habrá que recuperar ese valor)

muestraLinkDetalleDoble( $plantillaUrl,

Igual que la función anterior pero añadiendo al enlace generado 2 parámetros.



$etiquetaParametro1, $nombreCampoClave1, $etiquetaParametro2, $nombreCampoClave2)

Ambas se usarán añadiendo un icono en la plantilla de URL (cadena común para crear un link: <a href=”...”) para que se pulse sobre el.

muestraLinkDetalleTexto( $plantillaUrl, $etiquetaParametro, $nombreCampoClave, $nombreCampo)

Genera un enlace basándose en una plantilla URL pero sin usar iconos sino el texto de alguna columna.

muestraLinkDetalleDobleTexto($plantillaUrl, $etiquetaParametro1, $nombreCampoClave1, $etiquetaParametro2, $nombreCampoClave2, $nombreCampo)

Igual que la anterior pero añadiendo 2 parámetros.

muestraLinkDetalleImagenMini($plantillaUrl, $etiquetaParametro, $nombreCampoClave)

Igual que las anteriores pero usando como botón para pinchar en el enlace, la imagen pequeña asociada al elemento en cuestión.

muestraLinkDetalleDobleImagenMini($plantillaUrl, $etiquetaParametro1, $nombreCampoClave1, $etiquetaParametro2, $nombreCampoClave2,$nombreCampoClave = "clave")

Igual que la anterior pero pasándole 2 parámetros.

traduceCampoClaveSecundario($tabla, $campoClave, $campoTraducido)

Función que sustituye un valor clave $campoClave, por su correspondiente valor de texto (descriptivo) $campoTraducido, de la tabla indicada.

muestraImagenMini( $nombreCampoClave)

Función que muestra una imagen pequeña de un elemento indicandole la clave del mismo

muestraImagenMiniConNumero($nombreCampoClave, $numImagen)

Función que muestra una imagen pequeña de un elemento pero indicando además de la clave, una subclave (o numero de secuencia) para imágenes secundarias.

muestraFecha($nombreCampo) Muestra una fecha en el formato correcto.

muestraFechasInicioFin( $nombreCampo ="fecha_inicio", $nombreCampo2="fecha_fin")

Muestra un rango de fechas

muestraBoolean($nombreCampo)

Muestra un booleano de manera legible

muestraTextoAbreviadoSinHtml Muestra un texto limitando el número de caracteres del



($nombreCampo, $num_caracteres)

mismo, sin etiquetas HTML

muestraTextoAbreviado( $nombreCampo, $num_caracteres)

Muestra un texto limitando el número de caracteres del mismo incluyendo etiquetas HTML que hubiesen en el mismo.

10.29 Clase Util – Util.inc.php Descripción: Clase independiente usada para definir funciones las cuales se usaran desde cualquier clase. Puede haber funciones similares a las indicadas en FuncionesListado, pero se diferencian en que las anteriores retornaban sus resultados dentro de la variable html y en esta clase de utilidad, se retornan de manera normal. Nota: NO se definirán aquí funciones de utilidad para la aplicación a los campos de los listados generados en GestionListado y sus herederas. Métodos: Constructor:

No se define constructor para esta clase Otros Métodos:

creaListaDeClaveValor(&$arr, $nameColCodigo, $nameColValor)

Genera un array de datos del tipo clave -> valor, en el que la clave será la columna del array $arr llamada $nameColCodigo y el valor será la columna llamada $nameColValor. Esto es usado para los formularios, en el campo de tipo 'select'

creaListaDeClaveValorText(&$arr,$nameColCodigo,$nameColValor,$valorAdicional,$esAlta)

Igual que la anterior pero añadiendo un valor inicial adicional.

formateaMoneda($moneda, $idioma="es", $numDec = 2)

Mormatea un tipo numérico decimal a moneda según el idioma.

leeFichero($fichero) Método que lee un fichero.

getValorArray(&$matrix, $key) Retorna el valor correspondiente al campo $key del array de datos $matrix

redirect($url) Método que hace una redirección HTML hacia $url

muestraImagenDetalle($campoClave)

Muestra una imagen de detalle. Se retorna todo el HTML necesario para ello.

muestraImagenDetalleConNumero($campoClave,$numImagen)

Muestra una imagen secundaria de detalle. Se retorna todo el HTML necesario para ello.

muestraImagenMini($campoClav Muestra una imagen pequeña de un elemento cuya



e,$plus="") clave es $campoClave.

getTextoAbreviado($cadena, $num_caracteres=0)

Retorna un texto abreviado en el número de caracteres.

quitaHtml($cadena) Elimina toda etiqueta HTML de una cadena de texto.

getMes($mes) Retorna el mes indicado por $mes en modo texto.

muestraImagenDetalleSlice( $claveActividad)

Función mejorada para mostrar varias imágenes en el mismo espacio. Se habilita un enlace para pulsar y mostrar la imagen siguiente.

hallaExtension ($documento) Nos devuelve la extensión de un fichero o documento

muestraTablaDocumentos( $claveActividad)

Genera una tabla HTML con documentos asociados al elemento cuya clave es $claveActividad

10.30 Clase UtilDb – UtilDb.inc.php Descripción: Clase independiente usada para definir funciones que trabajarán con la base de datos del sistema. Aquí se abre la base de datos, se ejecutarán las sentencias y se cerrará la misma. Nota: Estas funciones están definidas para ser usadas con la base de datos PosgreSql. La librería phplib incluye funciones independientes de la base de datos ya que se usan en un nivel superior y por debajo de implementan las funciones para cada una de las distintas bases de datos. En principio no estamos usando esa facilidad aunque se dejará como mejoras futuras. Métodos: Constructor:


getConsultaEnArrayAsoc($db, $consulta, $campoClave,$bloque, $sizeBloque, &$numFilas)

Realiza una consulta usando la base de datos $db. Utilizará $bloque y $sizeBloque para limitar la consulta a un número concreto de registros (ver indices) y retorna en $numFilas el número de filas leidos totales sin tener en cuenta los bloques. El resultado se devuelve en un array de arrays asociativos.

getConsultaEnArray($db, $consulta)

Método similar al anterior pero que no tiene en cuenta los bloques y retorna el resultado en un array de arrays.

rellenaTabla($db, $tabla, $codigo Realiza una consulta y genera un array asociativo



= "clave", $orden = "clave", $filtro = "")

como resultado.

existeRegistro($db, $tabla, $codigo, $valor, $bEsCadena)

Comprueba la existencia de un registro

getRegistro($db, $tabla, $codigo, $valor, $bEsCadena)

Obtiene un registro de la base de datos tras ejecutar una consulta genérica con la condición $codigo=$valor. $bEsCadena indicará si el valor es un campo de tipo texto o numérico en caso contrario.

getRegistroUniversal($db, $consulta, $condicion)

Genera un registro tras ejecutar una consulta. Solo se genera un registro que se devuelve en un array asociativo para facilitar la lectura.

abreBaseDeDatos($db) Abre la conexión a la base de datos

cierraBaseDeDatos($conn) Cierra la conexión a la base de datos

ejecutaSentencia($conn, $consulta)

Ejecuta una sentencia simple.

ejecutaConsulta($db, $consulta) Ejecuta una consulta completa llamando al método anterior.

insertaRegistroSerie($db, $consulta, $tabla, $clave)

Inserta un registro según la consulta $consulta en la tabla $tabla.

getLastCodigo($conn, $tabla, $clave)

Método usado por el anterior para obtener el último valor del campo 'clave' de una tabla, tras haber realizado alguna inserción. Ese campo clave será autonumérico.

numeroDeTuplas($db, $consulta) Devuelve el número de resultados de una consulta.

calculaNumFilas($db, $sql) Calcula el número de filas

calculaNumFilasDistinct($db, $sql)

Calcula el número de filas distintas

10.31 Clase GestionPDFInforme – GestionPDFInforme.inc.php Descripción: Extiende de: fpdf.inc.php Clase extendida de fpdf para la creación de PDF estilo informes básicos; líneas simples sin ninguna floritura con los datos generados en los listados de la aplicación. Fpdf es una librería para la generación de PDF e incluye funciones básicas. Aquí se sube un nivel en la arquitectura ofreciendo funciones de un nivel algo más alto, generando el PDF finalmente.



Variables de clase: columnasAMostrar Columnas a mostrar en el PDF Métodos: Constructor:


Header() Método que crea la cabecera del PDF

Footer() Método que crea el pié del PDF

TablaSimple($cabecera,$registros) Realiza una tabla simple con cabecera y registros

TablaMejorada($cabecera,$registros,$anchosColumnas)

Mejora el método anterior añadiendo anchos a cada columna

getCabecera() Genera la cabecera de la tabla de datos del PDF

TablaMejoradaColoresInformes() Método mejorado para generar una tabla mejorada pero con colores. No dibuja la cabecera.

TablaMejoradaColores($cabecera,$registros,$anchosColumnas)

Método similar al anterior pero pasándole los parámetros. Quizás seria conveniente unificarlos en una siguiente versión de esta clase.

SetWidths($w) Actualiza el ancho de la tabla

Row($data,$numCampos, $plus) Método que genera cada celda, dependiendo del tipo del campo lo genera de una u otra manera.

CheckPageBreak($h) Calcula cuando hay que hacer un salto de página

NbLines($w,$txt) Calcula el número de líneas para un textarea

10.32 Script start – start.php Descripción: Script creado con la única finalidad de instanciar Control y poder usar sus métodos desde ficheros PHP que no sigan la estructura general de todos los ficheros PHP de nuestros módulos (ficheros PHP generados directamente por los diseñadores, que realmente son solo HTML renombrados a PHP para que se incluya alguna función PHP que retorne un resultado rápido. Dado que estas páginas no iniciaban la sesión, no se podían usar la clase UtilDb ni cualquiera otra. Con esta clase instanciada al principio de estos ficheros PHP ya podemos hacer uso de toda nuestra librería.



10.33 Clase phplib_local – phplib_local.inc.php Descripción: Extiende de: DB_Sql, CT_Sql, Session, User, Perm... (funciones de phplib) Clase obtenida de las funciones de phplib que se instalan en el sistema. Extiende clases que se cargarán al iniciarse el apache y que se indican en la configuración del PHP (php.ini). Se ha copiado aquí ya que de las funciones de phplib inicialmente usaremos tan solo las referentes a la autenticación de usuarios y por eso se indica aquí el host que contiene la base de datos, la base de datos usada, si hace falta indicar usuario y contraseña, la tabla donde se almacenan los usuarios así como algunos otros parámetros de la sesión. El resto de clases será ignorado aunque será una opción de futuro aprovechar todas las características que nos puede ofrecer esta librería.

10.34 Clase html_mime_mail – html_mime_mail.inc.php Descripción: Clase extendida de Control para realizar la función de Login en caso de que se intente acceder a una zona no permitida para usuarios no logueados. Se saltará a la página de login para posteriormente regresar a donde intentábamos acceder. Nota: Dado que esta clase es usada solo para mostrar un mensaje de acceso denegado, podría eliminarse y realizar esto con las dos clases anteriores.

10.35 Clase fpdf – fpdf.inc.php Descripción: Clase gratuita para la creación de emails. Se trata de una librería básica pero con la que se consiguen resultados aceptables. Contiene funciones de bajo nivel para ir formando poco a poco el email. Nosotros la usaremos a través de la clase 'CorreoHtml' que usa alguna de estas funciones para hacer el envío del email. Para más información sobre todas las posibilidades que puede ofrecernos consultar la Web del creador.

Nota: No se ha modificado ninguna de las funciones originales existentes. Me gustaría dar unos agradecimientos al creador de esta librería de gran utilidad!!

10.36 Clase csv – csv.inc.php Descripción: Clase independiente usada para la generación de ficheros EXCEL. Se trata de una clase adaptada para que la generación del fichero EXCEL sea más simple incluso que la



del fichero PDF. De esta manera generaremos líneas de celdas con los datos de manera compatible con EXCEL.

Metodología Modelo-Vista-Controlador para la Programación Web en PHP Web ejemplo y metodología


11. WEB DE EJEMPLO: GRUPO DE TÉCNICAS COMPUTACIONALES EN LA INGENIERÍA Y METODOLOGÍA DE TRABAJO

11.1 INTRODUCCIÓN En éste capítulo se expondrán los puntos más importantes para realizar el desarrollo de la Web del Grupo de Técnicas Computacionales en la Ingeniería, la que nos servirá como web de ejemplo para poner en práctica y uso nuestra librería. Al final de éste capítulo se incluirá un breve tutorial de manejo de la Web.

11.2 REQUISITOS INICIALES Pretendemos realizar una página Web que sustituya la actual del Grupo de Investigación, Grupo TIC 0118, Grupo de Técnicas Computacionales en la Ingeniería. Se intentará mejorar sustancialmente dicha página Web y hacer que se convierta en una Web útil para los miembros del grupo así como más vistosa y funcional.

La Web actual es una de fondo blanco con 4 enlaces al inicio del documento. Se expone en la misma página inicial un breve documento sobre los 'Chorros Líquidos Anulares' y en uno de los cuatro enlaces, se enlaza a una página de presentación del Grupo de Investigación con todos los datos principales del Grupo y una explicación más o menos extensa de cuales son las Líneas de Investigación del grupo.

Algo así deja mucho que desear ya que no permite añadir ningún contenido de forma dinámica lo que hace costosa su actualización (actualmente lleva sin actualizarse desde el 18 de Enero de 2003). Esto provoca que la Web no sea visitada y que carezca de utilidad. La información mostrada es muy escasa y se hace de una manera muy poco cuidada. Por estos motivos se pretende realizar una nueva página Web para dicho grupo. Tras la reunión mantenida con el Dr. D. Francisco Román Villatoro Machuca concluimos que la nueva se necesitaría: − Una introducción donde poder mostrar algunas imágenes y un poco de historia. − Destacar en la página principal alguna de las líneas de investigación que lleva el grupo. − Realizar un buscador potente que busque en todos los contenidos de la web, además de

uno para cada sección de ésta. − Añadir la posibilidad de incluir noticias destacadas o anuncios sobre reuniones,

conferencias... − Que la Web estuviese en 2 idiomas, español e inglés. − Incluir una sección para mencionar los miembros del grupo, una para mostrar los

proyectos del grupo, otra para mostrar las líneas de investigación así como las publicaciones que se realicen (tanto pre-prints, artículos en revista...). También se vio interesante añadir una sección de enlaces a otros sitios de interés.



11.3 ANÁLISIS Según los requisitos expuestos, intentaremos realizar nuestra aplicación lo más simple posible en cuanto a su organización, de manera que esa simplicidad se vea reflejada posteriormente en el uso de la misma. Separaremos, tal y como hemos venido haciendo hasta ahora, la parte que será mostrada a los usuarios de la Web, de la parte de gestión destinada a los administradores de la misma. Esto nos permitirá centrarnos en cada momento en lo que realmente requiere nuestra atención. Por ello comenzaremos definiendo primero el modelo de datos que usaremos y como lo vamos a organizar. Dividiremos la aplicación en módulos, uno para cada sección claramente diferenciada y de contenido dinámico, y que según los requisitos iniciales serán: • Módulo de Usuarios o miembros del grupo • Módulo para los Proyectos • Módulo para las Líneas de Investigación • Módulo para las Publicaciones • Módulo de Noticias o Avisos • Módulo de Enlaces hacia otras páginas Éstos serán los 6 módulos que compondrán nuestra aplicación. Nótese que no hemos mencionado para nada un Módulo para añadir un poco de historia y algunas imágenes! Esto es evidente ya que no será necesario añadir un módulo para realizar esto; para ese fin se realizará una página HTML estática con ese contenido y se enlazará en la home de la página. Lo mismo ocurre con el buscador avanzado que busque en todo los contenidos del sitio; para ello realizaremos un pequeño fichero PHP que hará esta función. Este se adjuntará en algún lugar de la zona pública de la Web para realizar dichas acciones. A la hora de realizar una aplicación nos encontraremos con este aspecto, secciones que serán implementadas directamente en las páginas HTML (o PHP) en la zona pública de la web y otras secciones que requerirán de un desarrollo más avanzado, y para lo cual haremos uso de toda la potencia de nuestra librería. Profundizaremos ahora un poco más en cada uno de los 6 módulos que implementaremos. − Módulo de Usuarios Será necesario distinguir entre 2 tipos de usuarios. Los administradores de la herramienta (normalmente uno) y los usuarios o miembros del grupo. Los administradores podrán gestionar todos los módulos de la aplicación, pero los miembros del grupo tan solo podrán añadir noticias o enlaces; para esto se generarán 2 zonas de administración diferenciadas para ambos tipos de usuarios.

También será necesario organizar los miembros del grupo en categorías, para lo cual crearemos un pequeño submódulo en el que podamos crear éstas categorías y asignar cada miembro a una de ellas.



A nivel de código, se creará un nuevo módulo para realizar la gestión de las categorías; este módulo se generará exactamente igual que todos los módulos de la aplicación usando nuestro conjunto de librerías y nuestra metodología. A nivel lógico, este módulo será considerado un submódulo del módulo de Usuarios y será gestionado desde éste mismo. − Módulo de Proyectos El módulo de proyectos será muy simple, proyectos con una fecha de inicio y fin, una descripción y poco más. Cada proyecto estará formado por una serie de miembros, los cuales serán enlazados con éste módulo. Realizaremos por tanto un pequeño módulo de asignación de miembros a un proyecto que enlazará un proyecto con varios miembros del grupo. − Módulo de Líneas de Investigación Aquí realizaremos también un módulo de asignación de imágenes, para asignar imágenes a cada línea de investigación; imágenes descriptivas que merezcan la pena resaltar. A su vez, cada línea de investigación estará organizada en categorías con lo que generaremos otro submódulo para administrarlas. − Módulo de Publicaciones Las publicaciones irán relacionadas con las líneas de investigación, ya que pueden ir asociadas a alguna de ellas. Esto se hará seleccionando de un desplegable la línea a la que va asociada, pero no se requerirá ningún submódulo para gestionar esto. Sí será necesario uno para gestionar los tipos de publicaciones que podemos registrar; pre-prints, artículos en revistas... serán gestionados desde un submódulo. Inicialmente se pensó en asignar a cada publicación un grupo de autores, los cuales serían los mismos miembros del grupo, pero finalmente hemos descartado esto ya que una publicación generalmente estará realizada por personal ajeno al grupo de investigación (pertenecientes a otros grupos) y se ha visto conveniente introducirlos en un campo de texto libre. − Módulo de Noticias Un módulo siempre útil para mostrar avisos, noticias de interés o acontecimientos recientes. Se añadirá un submódulo para gestionar las secciones en las que se publicaran dichas noticias. Por lo demás es un módulo bastante básico. − Módulo de Enlaces Módulo simple para generación de enlaces a otras páginas. También incluirá un submódulo para generar las categorías en las que organizaremos dichos enlaces. Cada uno de estos módulos tendrá su correspondiente apartado en la zona pública de la web para poder mostrar sus contenidos, aunque la representación será muy distinta a la mostrada en la zona de gestión.



11.4 MODELO DE DATOS Y DIAGRAMAS ENTIDAD RELACIÓN

11.4.1 Normalización y Optimización

Uno de los puntos más importantes en la creación de páginas Web dinámicas es el decidir cual va a ser nuestro Modelo de Datos y por consiguiente el diseño de las tablas que usaremos en la base de datos. Se usará la normalización para la eliminación de redundancias y dependencias entre aquellos atributos, proporcionando así una estructura más regular y proporcionando el soporte para el diseño de bases de datos relacionales. El código PHP será más simple a la hora de realizar las consultas a la base de datos. Una entidad está en Primera Forma Normal (1FN) si no tiene grupos repetitivos, es decir, un atributo sólo puede tomar un único valor de un dominio simple. La tabla contiene una clave primaria y no contiene atributos nulos. Una entidad está en Segunda Forma Normal (2FN) si está en 1FN y todos los atributos que no forman parte de alguna clave tienen dependencia funcional completa respecto de éstas, es decir, cada uno de los atributos de una entidad depende de toda la clave. No existen dependencias parciales; si se varía la clave se varían los atributos. En nuestro caso, todas las tablas tienen una única clave primaria, con lo que estando en 1FN también lo estarán en 2FN. Una entidad está en Tercera Forma Normal (3FN) si está en 2FN y todos sus atributos no principales dependen directamente de la clave primaria, es decir, no hay dependencias funcionales transitivas de atributos no principales respecto de las claves (cuando un atributo que no pertenece a la clave primaria permite conocer el valor de otro atributo). Tras la normalización se procede a la optimización, cuyo objetivo es reestructurar el modelo físico de datos con el fin de asegurar que satisfaga los requisitos de rendimiento establecidos y conseguir una adecuada eficiencia del sistema. La optimización es una desnormalización controlada del modelo físico de datos, que se aplica para reducir o simplificar el número de accesos a la base de datos.

11.4.2 Diseño de Tablas A continuación se muestran las sentencias de creación de cada tabla después de aplicar las técnicas de normalización y optimización. Todas las tablas tienen una única clave primaria normalmente llamada 'clave' y de tipo serial (valor numérico autoincremental, único y no nulo). Módulo Usuarios Para el módulo de usuarios se requerirán como mínimo estas dos primeras tablas, 'auth_user' será la encargada de almacenar los datos de cada miembro del grupo así como información para la autenticación (datos de acceso y permisos) y la tabla 'active_session' que será usada para almacenar datos de la sesión del usuario necesarios. La tabla



'usuarios_categorias' contendrá simplemente las categorías en las que podemos organizar éstos usuarios. Además un usuario estará en un estado dentro del grupo y éste estado se almacenará en 'usuarios_estados' CREATE TABLE auth_user ( clave serial NOT NULL, uid character varying(50) NOT NULL, username character varying(100) NOT NULL, password character varying(100) DEFAULT '' NOT NULL, perms character varying(50) DEFAULT 'usuario', nombre character varying(100), direccion character varying(100), localidad character varying(50), provincia character varying(50), cp character varying(20), telefono character varying(100), email character varying(100), movil character varying(12), observaciones text, b_baja boolean DEFAULT 'f', c_categoria integer DEFAULT 0, estado integer DEFAULT 1 ); CREATE TABLE active_sessions ( sid character varying(32) DEFAULT '' NOT NULL, name character varying(100) DEFAULT '' NOT NULL, val text, changed character varying(14) DEFAULT '' NOT NULL ); CREATE TABLE usuarios_categorias ( clave serial NOT NULL, nombre_seccion character varying(50), nombre_seccion_uk character varying(50), b_baja boolean DEFAULT 'f', orden integer DEFAULT 0 ); CREATE TABLE usuarios_estados ( clave integer, nombre character varying(50) ); Módulo Proyectos Una tabla para almacenar los proyectos y todos sus datos y la tabla 'proyectos_usuarios' que relacionará los usuarios con los proyectos para indicar que usuarios del grupo participan en cada proyecto. CREATE TABLE proyectos ( clave serial NOT NULL, nombre character varying(100), fecha_inicio date DEFAULT now(), fecha_fin date, descripcion text, b_baja boolean DEFAULT false ); CREATE TABLE proyectos_usuarios ( clave serial NOT NULL, c_usuario integer,



c_proyecto integer ); Módulo Líneas de Investigación Las líneas de investigación se almacenarán en 'lineas_investigacion' y las categorías en las que podemos organizarlas se almacenarán en 'lineas_secciones'. Tan solo será necesario un campo de tipo numérico 'c_lineas_secciones' para indicar la sección a la que pertenece una línea de investigación. Además se añade un pequeño módulo de imágenes para añadir imágenes a una línea, con lo que se incluirá su tabla. CREATE TABLE lineas_investigacion ( clave serial NOT NULL, c_lineas_secciones integer, titulo character varying(200), titulo_uk character varying(200), detalle text, detalle_uk text, fecha date, palabras text ); CREATE TABLE lineas_secciones ( clave serial NOT NULL, nombre_seccion character varying(50), nombre_seccion_uk character varying(50), b_baja boolean ); CREATE TABLE imagenes ( clave serial NOT NULL, c_evento integer, titulo character varying(100), titulo_uk character varying(100), nombre_fichero character varying(100) ); Módulo Publicaciones Al igual que en el caso anterior, se tendrán dos tablas una para almacenar las publicaciones y otra para almacenar los tipos de publicaciones existentes para asignar a cada publicación. CREATE TABLE publicaciones ( clave serial NOT NULL, c_tipo integer, director character varying(300), titulo character varying(200), fecha date DEFAULT now(), medio character varying(200), abstract text, b_baja boolean DEFAULT false, c_linea_investigacion integer, palabras_clave character varying(300), lugar_publicacion character varying(200), editores character varying(200), editorial character varying(200), volumen character varying(50), numero character varying(50),



pagina_inicio integer, pagina_fin integer, anno character varying(4), isbn character varying(100), issn character varying(100), url character varying(200), indicios_calidad text, ); CREATE TABLE tipos_publicaciones ( clave serial NOT NULL, nombre character varying(100), nombre_uk character varying(100), b_baja boolean DEFAULT 'f' ); Módulo de Noticias Una tabla para almacenar las noticias y otra 'noticias_secciones' para las secciones existentes en las que dar de alta noticias y organizarlas. CREATE TABLE noticias ( clave serial NOT NULL, c_noticias_secciones integer, cabecera character varying(200), cabecera_uk character varying(200), detalle text, detalle_uk text, propietario integer DEFAULT 1, imagen character varying(100), imagen2 character varying(100), fecha date, tipo integer DEFAULT 1 ); CREATE TABLE noticias_secciones ( clave serial NOT NULL, nombre_seccion character varying(50), b_baja boolean, nombre_seccion_uk character varying(50) ); Módulo de Enlaces Para el pequeño módulo de enlaces haremos lo mismo, dividiéndolos también en secciones para una mejor organización. CREATE TABLE enlaces ( clave serial NOT NULL, c_secciones_enlaces integer, texto character varying(200), alt character varying(100), url character varying(200), fecha date, c_propietario integer DEFAULT 1 ); CREATE TABLE secciones_enlaces ( clave serial NOT NULL,



nombre_seccion character varying(50), b_baja boolean DEFAULT 'f', nombre_seccion_uk character varying(50) );

11.4.3 Diagramas Entidad-Relación El modelo Entidad/Relación describe con un alto nivel de abstracción la distribución de datos almacenados en un sistema. Existen dos elementos principales: entidades y relaciones. Las extensiones al modelo básico añaden además los atributos de las entidades y la jerarquía entre éstas aportando una mayor capacidad expresiva. Los elementos fundamentales del modelo son los siguientes: ENTIDAD Es aquel objeto acerca del cual se desea almacenar información en la base de datos. La estructura genérica de un conjunto de entidades con las mismas características se denomina “tipo de entidad”. Existen dos tipos de entidades: regulares (existen por sí mismas) y débiles (su existencia depende de otra entidad). Las entidades deben cumplir las siguientes tres reglas: − Tienen que tener existencia propia. − Cada ocurrencia de un tipo de entidad debe poder distinguirse de las demás. − Todas las ocurrencias de un tipo de entidad deben tener los mismos atributos. RELACION Es una asociación existente entre una o varias entidades. Una relación se caracteriza por un nombre, que lo distingue unívocamente del resto de relaciones del modelo, y un tipo de correspondencia, que es el número máximo de ocurrencias de cada tipo de entidad que pueden intervenir en una ocurrencia de la relación. Se pueden identificar tres clases de relaciones:

− Relaciones 1:1, donde cada ocurrencia de una entidad se relaciona con una y sólo una ocurrencia de la otra entidad.

− Relaciones 1:M, donde cada ocurrencia de una entidad puede estar relacionada con cero, una o múltiples ocurrencias de otra entidad.

− Relaciones N:M, donde cada ocurrencia de una entidad puede estar relacionada con cero, una o múltiples ocurrencias de la otra entidad y viceversa.

Se denomina cardinalidad al número máximo y mínimo de ocurrencias de un tipo de entidad que pueden estar interrelacionadas con una ocurrencia de otro tipo de entidad. La cardinalidad máxima coincide con el tipo de correspondencia. Según la cardinalidad, una relación es obligatoria, cuando para toda ocurrencia de un tipo de entidad existe al menos una ocurrencia del tipo de entidad asociado, y es



opcional cuando, para toda ocurrencia de un tipo de entidad, puede existir o no, una o múltiples ocurrencias del tipo de entidad asociado.

La notación usada será la siguiente: − Una entidad regular es un rectángulo etiquetado con el nombre del tipo de

entidad. − Una entidad débil se representa con dos rectángulos concéntricos con su

nombre en el interior. − Una relación se representa con un rombo unido a las entidades relacionadas por

dos líneas rectas a los lados.

El tipo de correspondencia se representa gráficamente con una etiqueta 1:1, 1:M ó N:M, cerca de alguno de los vértices del rombo o de la entidad correspondiente.

La representación gráfica de las cardinalidades se realiza mediante una etiqueta del tipo (0,1), (1,1), (0,n) ó (1,n), que se coloca en el extremo de la entidad que corresponda. Si se representan las cardinalidades, la representación de tipo de correspondencia es redundante.

La figura 10.1 muestra el diagrama Entidad-Relación de esta aplicación; tan solo se

muestran las relaciones entre los módulos de la misma. No se ha generado ningún diagrama para las acciones que un usuario, como elemento u objeto dentro del sistema, realizaría con cada uno de los módulos ya que se corresponderá evidentemente con el uso de cada uno de los módulos implementados.

11.5 METODOLOGÍA DE DESARROLLO Para crear la página Web seguiremos la siguiente metodología a aplicar para todos nuestros próximos desarrollos. Esto podrá variar según su experiencia personal, pero inicialmente seguiremos los siguientes pasos: 1 – Preparamos el servidor para alojar una nueva página (esta tarea no será aquí explicada, ya que no es éste el objetivo del presente proyecto, y puede que esa tarea no nos corresponda a nosotros). Simplemente deberemos disponer de un espacio donde hacer FTP y alojar nuestras páginas. 2 – Copiamos en la raíz de nuestro sitio (directorio principal) las carpetas de nuestra librería base que aquí se indican: − 'admin' con todo su contenido − 'db' con todo su contenido inicial:

− acceso − CodigoComun − ConfiguracionComun − inicio − js



Figura 10.1 Diagrama Entidad-Relación de la aplicación

− 'diseno' con todo su contenido inicial:

− acceso − comunes



− css − imagenes

− 'diseno_privado' con todo su contenido inicial: − acceso − comunes − css − imagenes

− fichero 'index.html' principal, el cual incluirá un contenido estándar para iniciar la aplicación y para que podamos ver en el navegador algún contenido público.

Éstos serán los ficheros con los que inicialmente partiremos para la creación de la aplicación. Realizan únicamente el acceso a la parte de administración a un módulo vacío, con algunas pestañas y opciones de ejemplo para que el usuario comience ya de inmediato a programar su aplicación sin tener que preocuparse de estas acciones iniciales, las cuales serán comunes en todos sus proyectos. Para ello se crean también, para permitir el acceso a la zona privada, los formularios de 'login' y 'logout'. La aplicación estará preparada inicialmente para permitir el acceso de un usuario administrador. 3 – Creamos una nueva base de datos con las tablas 'auth_user' y 'active_sessions' como mínimo. Añadimos un usuario con permisos 'admin' para poder entrar posteriormente al módulo de gestión de la aplicación. La tabla 'active_sessions' estará vacía inicialmente. 4 – Modificar en los ficheros 'CodigoComun/phplib_local.inc.php' y 'CofiguracionComun/recursos.inc.php' el recurso 'database' y el recurso 'host' para indicar la base de datos que vamos a leer y en que equipo está dicha base de datos. 5 – En este punto, tendremos que probar que nuestra página inicial es accesible y que podemos acceder al módulo de administración (y entrar) poniendo en la URL /admin a continuación de la dirección de la Web. 6 – A partir de aquí, iremos creando módulo a módulo todos los que hayamos definido para nuestra aplicación, siguiendo los requisitos iniciales, el análisis de cuales serán nuestros módulos, creando las tablas correspondientes a cada módulo... No nos preocuparemos en este punto de su representación de cara al usuario de Internet, sino únicamente en la funcionalidad de cada módulo y su correcto funcionamiento. Nota: Como referencia y ayuda podemos usar el módulo de ejemplo que se incluye junto con nuestra librería base, el cual no es ni más ni menos que el módulo de noticias usado como ejemplo en esta documentación y que se corresponde exactamente con el usado en nuestra aplicación. 7 – Tras haber completado todos los módulos y toda la zona de gestión es la hora de elegir qué 'framework' usaremos para mostrar todos los contenidos. Esto se hará realizando un diseño de toda la Web y ajustándolo posteriormente a alguno de los que exponíamos en el capítulo 7. Esta tarea puede ser algo tediosa para una persona poco experimentada en éste aspecto ya que hay realizar un diseño con alguna herramienta como Freehand, Photoshop, The Gimp... posteriormente hay que 'cortar' los trozos que corresponderán con la cabecera, el pié, el margen izquierdo... y meter cada uno dentro de su plantilla correspondiente.



Aquí también entra en juego la destreza del diseñador en cuestión, ya que habrá dibujado tablas con bordes, texto con imágenes... y muchas se quedarán como gráficos y otras muchas se realizarán con las hojas de estilo CSS. También será la hora de realizar todas las páginas estáticas que vayamos a incorporar en nuestra web, así como de enlazarlas adecuadamente dejando tan solo por terminar las páginas o zonas en las que haya que incluir contenido dinámico (y que ya dispondremos en la base de datos tras haberlos insertado desde la zona de gestión). Recomiendo que este punto se deje en manos de un buen diseñador. 8 – Crearemos los listados, buscadores y pequeños módulos de información 'incrustables' que necesitemos exponer al público. Los listados y buscadores los realizaremos tal y como hemos realizado en la zona privada, pero con la diferencia de que usaremos el 'framework' que hemos diseñado en lugar del que usábamos por defecto para la zona de gestión. También habrá que habilitar en los recursos de esos módulos, que el usuario 'nobody' pueda acceder, osea que no hace falta identificarse para ver estas páginas. Lo único que haremos de forma 'tradicional' será esos pequeños módulos incrustables, que imprimen información dinámica en una página que aparentemente (o inicialmente) era totalmente estática. Éstos consisten en un pequeño fichero PHP que consulta la base de datos en busca de una información concreta, para posteriormente imprimir el resultado en el lugar donde se encuentra 'incrustado'. 9 – Como detalle final, ajustaremos la hoja de estilos CSS de la zona de gestión para que, aún manteniendo un aspecto y estructura muy similar, refleje en algunos aspectos los colores y estilos usados en la zona pública. 10 – Para completar los 10 puntos a seguir, podemos comprobar que las carpetas que almacenarán ficheros e imágenes tengan los permisos adecuados, realizar una pequeña revisión para asegurar que no nos está fallando nada y lo más importante, proveer de contenido real y actualizado. Una vez realizado nuestro proyecto nos daremos cuenta de la gran cantidad de tareas que hemos visto simplificadas y facilitadas al usar nuestra librería, y también nos daremos cuenta del resultado tan limpio y profesional que hemos obtenido. Posteriormente cualquier tarea de modificación o corrección nos será mucho más simple y fácil de realizar y veremos así nuestro objetivo inicial más que cumplido.

11.6 RESULTADO OBTENIDO – ALGUNAS IMÁGENES A continuación comentaremos algunos aspectos y se mostrarán capturas para documentarlos. Se muestran para que vea el resultado de algunos conceptos o ideas que hemos comentado a lo largo de toda la documentación.

Como principal figura mostraremos como no, la página inicial de nuestra Web de Ejemplo, destinada al Grupo de Técnicas Computacionales en la Ingeniería. Se puede ver cómo está dividida en los diferentes módulos principales que han querido ser destacados: Líneas de Investigación, información del grupo (enlace a página estática), Noticias, Proyectos y Publicaciones.



La página inicial no tiene porqué seguir la misma estructura indicada en el

framework, ya que normalmente será muy distinta que las demás secciones. Además esto es necesario para mostrar información más variada correspondiente a distintas secciones de la Web.

Figura 11.1 Página inicial – Visualización de los módulos PHP incrustados.

Para visualizar el framework que hemos usado lo podemos hacer en la siguiente figura. Corresponde a una de las secciones del menú principal y mantendrá el mismo framework que el resto de secciones. Aquí no hemos usado margen izquierdo, sino simplemente el margen derecho y el ‘pie main’ permanecerá vacío.

También podemos ver el listado de publicaciones, aunque en este caso tan solo hay una publicación de prueba introducida en el sistema.



Figura 11.2 Página pública – Listado – Visualización del framework usado.

El módulo de gestión, que será lo que veremos a continuación no mantendrá el mismo aspecto gráfico que la parte pública de la aplicación. Esto es lógico dado que no se requiere un diseño espectacular y lo que se pretende es que sea principalmente funcional.

Podemos ver en el gráfico siguiente la página principal de la zona de gestión, en la

que se muestra información variada de interés para el administrador del sitio y el menú superior mediante el cual accederemos a la administración de cada módulo. Recordemos que los miembros del grupo también pueden acceder a la administración de la Web, pero para ellos tan solo se le mostrarán 2 pestañas correspondientes al módulo de Noticias y al de Enlaces, estando el resto bloqueados para uso exclusivo del administrador.



Figura 11.3 Página inicial del módulo de gestión – Visualización general.

En el gráfico siguiente se mostrará como se disponen las opciones dentro de uno de

los módulos de la aplicación así como un listado de elementos.

Figura 11.4 Listado del módulo de Proyectos y opciones disponibles.

Metodología Modelo-Vista-Controlador para la Programación Web en PHP Conclusiones y Líneas Futuras


12. CONCLUSIONES Y LÍNEAS FUTURAS

A continuación expondré cuales han sido mis conclusiones sobre el proyecto realizado y algunas mejoras y ampliaciones para actualizaciones futuras.

12.1 CONCLUSIONES

Con la elaboración de este proyecto se ha conseguido crear una nueva metodología que permite a cualquier programador Web realizar sus proyectos de una manera mucho más eficiente y profesional. El resultado obtenido no es el óptimo dado que puede mejorarse aún mucho más, pero sí considero que es un muy buen punto de partida para seguir mejorándolo con el uso.

Nos orienta y encamina a una forma de trabajar mucho más colaborativa y

pensando más en el futuro, que nos hará mucho más fácil realizar cambios posteriores en las soluciones Web que implementemos, así como permitirnos reutilizar los trabajos realizados con anterioridad usando estas librerías.

Personalmente ha significado un gran reto y creo que he conseguido lo que me

propuse como meta personal, que era la elaboración de un método distinto y mejorado, más moderno y dinámico que me permitiera dar un paso más en la creación de páginas Web y dejar atrás las formas tradicionales y obsoletas de creación de aplicaciones Web en PHP. Aún así se podrán dar muchos pasos más, y conseguir poco a poco una herramienta mejorada y más trabajada, pudiéndose realizar muchas mejoras de cara al futuro.

12.2 LINEAS FUTURAS Las mejoras que podemos hacer al conjunto de librerías y a la forma de realizar la

programación pueden ser muchas. Con la creación del nuevo modelo de programación hemos conseguido hacer un gran cambio y se han abierto muchas nuevas posibilidades que debemos intentar abarcar para mejorar aún más lo que se podría convertir en nuestra herramienta de trabajo diario.

Desde mi posición como creador de esta metodología considero que para futuras

ampliaciones o modificaciones serian convenientes las siguientes:

- Revisión de las librerías básicas para simplificar aún más algunas clases. Durante la documentación se han realizado algunas anotaciones indicando varios cambios o mejoras que se podrían hacer en esos puntos en concreto.

- Estudio más a fondo sobre la librería phpLib, la cual ha sido usada muy 'por encima' y no se han aprovechado todas las posibilidades que nos ofrece. Quizás incluso pueda buscarse alguna otra librería de características similares pero que fuese más actual.

Metodología Modelo-Vista-Controlador para la Programación Web en PHP Conclusiones y Líneas Futuras


- Mejorar los Listados que se generan, sobre todo para la parte pública, ya que hay partes en las que se usan tablas y seria mucho mejor el uso siempre de las etiquetas '<div>'.

- Mejorar la creación de los PDF y los ficheros EXCEL. Actualmente uso la librería fpdf de una manera muy básica y se generan unos ficheros PDF muy elementales, cuando realmente se pueden hacer mucho más vistosos y complejos. Con los ficheros Excel, las posibilidades son menores pero quizás se puedan mejorar.

- Al igual que se incluye un módulo de ejemplo (el módulo de Noticias de nuestra Web de ejemplo), sería buena idea incluir una serie de módulos ya realizados para las funciones más usadas. Esto seria otro nivel más de abstracción, pasando de librería de clases básicas a librería de módulos básicos.

- Como reto final, se podría intentar optimizar más aún cada módulo, para que la

creación del mismo se limitase simplemente a indicar determinados parámetros en los ficheros de Recursos y que la aplicación se formase automáticamente basándose en estos ficheros.

Metodología Modelo-Vista-Controlador para la Programación Web en PHP APENDICE A


APENDICE A: MANUAL DE USUARIO El uso de la herramienta que hemos creado es bastante simple e intuitivo con lo que no necesitará de grandes explicaciones ni trucos para su uso. A continuación se comentarán diferentes apartados para iniciar al usuario al manejo de nuestra aplicación web. Es recomendable una vez iniciada su lectura, leer completamente ya que aprovecho la explicación de distintos módulos para ir introduciendo distintos aspectos comunes a todos los módulos y no explico completamente cada módulo en cada apartado.

Aspectos Generales

Nuestra aplicación se encuentra desarrollada para 2 idiomas; no todas las secciones pero sí algunas. Por lo tanto en determinados módulos deberemos incluir el contenido en los 2 idiomas. Sólo la parte pública de la Web se traducirá en 2 idiomas, quedando la zona de gestión únicamente en español. En los módulos de la página principal se incluirán 2 noticias, una línea de investigación, 1 o 2 proyectos y 1 o 2 publicaciones. Éstos saldrán por fecha de inserción, es decir, el último insertado. Si actualizamos contenidos y añadimos una noticia nueva, ésta saldrá en portada y una de las 2 que se mostraban anteriormente dejará de hacerlo. Para ver el resto de contenidos de ese tipo (noticias, proyectos...) habrá que hacerlo desde la sección específica para ello. En cada una de las secciones dinámicas se mostrará un listado de los elementos que la componen ordenados también por fecha y en ocasiones se mostrará en el margen derecho, un listado de secciones (si el contenido que se muestra está organizado por ellas) y un buscador. El buscador sólo buscará elementos de esa sección (líneas de investigación, publicaciones...) ya que para buscar elementos en varias secciones habrá que usar el buscador avanzado. Buscador avanzado y página de contacto serán accesibles desde sus enlaces respectivos desde la cabecera de la página (iconos de un sobre y una lupa) o desde el pié de página donde también se muestran enlaces a las distintas secciones. Para cambiar de idioma habrá que pulsar en el icono de la bandera situado en la cabecera de la página. En las páginas en español se encontrará el icono de ingles, y en las páginas en inglés se encontrará el icono con la bandera en español para pasar de un idioma a otro.

Para volver a la página de inicio puede hacerse pulsando en toda la imagen de la cabecera. Los usuarios que no pertenecen al grupo de investigación no podrán realizar ninguna acción con la página que no sea la habitual, ver contenidos.



Tipos de accesos

Existen dos tipos de acceso a la zona de gestión; un acceso para administrador y otro para miembros del grupo. La página de acceso es la misma para ambos, siendo la web la que habilita o no las opciones determinadas para cada uno. Para acceder a la administración tendremos que añadir '/admin' a la ruta de la página Web (no se indica aquí la ruta en concreto ya que aún no se ha definido pero será de la forma: www.gtci.com/admin suponiendo que nuestra Web se accediese poniendo www.gtci.com ) Cuando accede un miembro del grupo tan solo tendrá opción a añadir noticias y enlaces, por lo que en lo que restan de anotaciones solo nos referiremos a las opciones del administrador del sitio que será el que tenga acceso a todos los módulos. En la base de datos un usuario administrador tendrá en el campo 'perms' la cadena de texto 'admin' y un usuario normal (miembro del grupo) la cadena 'usuario'. Se mostrará una ventana de login y si el acceso es correcto se saltará a la pantalla inicial de la zona de gestión. Podemos ver esto en la siguiente captura.

Figura A.1 – Página de Acceso a la zona de gestión.

Nota: las capturas de pantalla se han realizado con la aplicación en entorno de

pruebas y por lo tanto puede contener poca información y con texto simulado.

Zona de Gestión – Inicio y Módulos

La página principal de la zona de gestión mostrará, en la parte central, una serie de enlaces rápidos para facilitar el acceso a las opciones más usadas, varios datos de estadísticas con la única función de informar al administrador sobre el número de proyectos, noticias, usuarios... que hay almacenados. Debajo encontraremos un pequeño módulo que muestra las dos últimas noticias creadas en el sistema y las dos últimas publicaciones.

Esto puede modificarse y ajustar a las necesidades y gustos de cada administrador pero no de forma dinámica.



Incluir una página inicial con esta información puede ser una forma elegante de dar la bienvenida a los usuarios y no mostrar directamente listados de datos u opciones. En la parte superior se mostrará en forma de lista, los botones correspondientes a cada módulo de la aplicación, cuya funcionalidad es únicamente organizar la herramienta y permitir rápidamente el acceso a las opciones de cada módulo.

Todo esto podemos verlo en la siguiente captura.

Figura A.2. – Zona de gestión - página inicial

Módulo Usuarios

La organización de cada módulo será muy similar con lo que se explicará aquí más a fondo y posteriormente se comentarán otros detalles. En cada módulo incluiremos justo debajo de la lista principal de módulos, opciones específicas para el módulo que estamos tratando. Normalmente se incluirán accesos a los listados, ya que desde los listados podremos realizar el resto de operaciones. También se incluirá en el margen derecho más opciones para el mismo módulo o para algún submódulo de éste. En este caso, en el submenú superior disponemos de las opciones: Listado de Administradores | Miembros | Categorías los cuales listarán respectivamente a los



administradores, los miembros del grupo no administradores y las categorías en las que podemos organizar a dichos miembros. El listado de administradores y miembros será similar, diferenciándose en los datos que se muestran. El listado de categorías es totalmente distinto ya que pertenece a un submódulo y el contenido a mostrar es muy distinto. Algo que destacar de los listados es el orden en el que se muestran; inicialmente se mostrarán en orden descendente por la fecha de inserción. Posteriormente se puede pinchar en la cabecera del mismo para ordenar por esa columna en particular, permitiendo incluso pinchar 2 veces para cambiar el orden de manera ascendente o descendente. Todos los submódulos mantendrán tanto el submenú superior como las opciones del margen izquierdo iguales a las del módulo principal que lo contiene para no marear demasiado al usuario. El margen derecho añade las opciones: Alta de nuevo administrador, Alta de nuevo miembro, listado y localizar miembros y luego las opciones del submódulo: Alta de nueva categoría y listado de categorías. Cada opción hace lo que su nombre indica, con lo que no requieren muchas más explicaciones.

Figura A.3. – Opciones módulo usuarios

Evidentemente usaremos éste módulo para dar de alta a los miembros del grupo, así como a 1 o 2 administradores. También las categorías en las que organizaremos a los miembros del grupo.



Módulo Noticias

Se gestionarán aquí las noticias que deseen publicar en la Web, así como las secciones en las que las organizaremos.

La estructura es igual a la de cada módulo y nos centraremos en el formulario de alta de una noticia. Esto se hará pinchando en el enlace del menú derecho que pone 'Alta nueva noticia' y nos llevará al formulario de alta de la misma.

Nos aparecerán una serie de campos a rellenar de diferentes formatos:

− Campos fecha: es necesario introducir una fecha válida en formato dd/mm/aaaa y esto se puede hacer pinchando en el icono de calendario que habrá justo al lado y elegir una.

− Campos de texto: simplemente escribir un texto. Pueden haber varios campos que no sean obligatorios. Si nos falta algún campo obligatorio se nos indicará con un mensaje de error.

− Campos desplegables: Se obliga a elegir una de las opciones que aparezcan. − Campos de texarea: Incluyen a veces un editor HTML para los más experimentados,

pudiendo poner el texto en negrita o cursiva, añadir enlaces e incluso listas. Si no se sabe usar se recomienda incluir solo texto y no pulsar ninguna opción.

− Campos para subir ficheros: Dispondremos de 2 tipos de campos, uno para subir imágenes (se admiten para mayor compatibilidad ficheros .jpg) y campos para subir documentos (se admiten .pdf). En el caso del alta de noticias no aparece este último.

− Campos numéricos: De aparecer se insertaran valores numéricos sin coma o indicando la coma ( , ) como signo decimal seguido de 2 números.

− Campos tipo check: Tan solo habrá que marcarlos en caso necesario. A veces para eliminar una imagen ya subida, se muestra un campo check para confirmar la eliminación de esta, teniendo posteriormente que pulsar el botón determinado del formulario para realizar las operaciones.

− Botón del formulario: Se pulsará para realizar la acción del formulario; mientras tanto no se realiza ninguna acción.

Figura A.4. – Alta de noticias



Módulo Enlaces

Este módulo es muy simple y como ya preveemos servirá para dar de alta enlaces a otros sitios de Internet y sus secciones para organizarlos. Aquí tan solo mostraremos como podemos modificar o eliminar un elemento, en este caso un enlace. En el listado de enlaces, al igual que en todos los listados, pueden aparecer junto con los datos, algunos iconos que nos permitirán realizar determinadas acciones sobre el elemento que estamos listando. En este caso podremos modificar y borrar. Si pulsamos a modificar saltaremos a un formulario similar al mostrado en el alta de un enlace, pero con los datos ya cargados para que modifiquemos el que deseemos. En el caso de borrar saltaremos a una página de confirmación, en la que se nos mostraran los datos (sin permitirnos modificar ninguno) y un botón de confirmación, que tras pulsarlo nos volverá al listado de enlaces pero habiendo borrado previamente el enlace seleccionado.

Figura A.5. – Eliminación de un enlace. Se muestra un recorte de la página de

confirmación, la cual saldría en una ventana independiente.

Módulo Proyectos

En este módulo daremos de alta proyectos y asignaremos a estos miembros del grupo. La asignación se realiza desde el listado, pulsando en el Botón 'alta miembros' el cual nos llevará a un formulario en el que podemos elegir varios usuarios para el mismo proyecto. Si un proyecto tiene más miembros asignados de los que se pueden seleccionar en ese formulario podemos volver a pulsar en 'alta miembros' y asignar otros miembros. Esto se hace aditivamente, de manera que cada vez que volvamos a rellenar ese formulario se añadirán más miembros a ese proyecto.



Ésta es la misma forma en la que añadimos imágenes a una línea de investigación, permitiéndonos asignar imágenes ilimitadas a una línea.

Figura A.6. – Alta de miembros para un proyecto.

Módulo Publicaciones

Podremos dar de alta las publicaciones que dispongamos así como los tipos de estas. Destacaremos aquí la manera de localizar una publicación cuando el listado de publicaciones sea muy amplio. En este caso aparecerán los índices de los listados y podremos navegar entre páginas. El problema es que si hay muchas páginas esto puede ser tedioso y necesitaremos usar el formulario de búsqueda para localizar la publicación que deseamos. El formulario de búsqueda o localización es similar a los ya mostrados, tan solo que con menos campos. Las búsquedas se realizarán con la cláusula 'AND' con lo que si no rellenamos ningún parámetro de búsqueda se mostrará el listado completo y si rellenamos todos los parámetros de búsqueda se hará una búsqueda más refinada.

Si una búsqueda no encuentra resultados no se saltará al listado sino que se mostrará un mensaje de error indicando que no se han encontrado elementos y permitiendo que se vuelvan a introducir nuevas opciones de búsqueda sin tener que retroceder. Una vez se encuentren elementos se saltará al listado de los mismos.



Figura A.7.- Localizar publicaciones

Módulo Líneas de Investigación

Éste módulo es similar a los anteriores y se usará para dar de alta las líneas de investigación, las secciones en las que las organizaremos y las imágenes asociadas a cada línea de investigación. La forma de dar de alta las imágenes asociadas a cada línea, como ya comentamos anteriormente es a través de un formulario. En este caso, y para no llenar el listado de botones he optado por añadir dentro del formulario de modificación 2 botones más. Uno para añadir imágenes y otro par listar todas las imágenes de una línea. Al pulsar en el Botón se salta al formulario del que hablamos. Se podrá añadir un texto a la imagen, el cual se mostrará en la zona pública bajo la misma, con lo que se pueden añadir pequeñas descripciones a las mismas.

Figura A.8.- Botones inferiores en el formulario de modificación de línea



Informes PDF y Excel

Hay dos aspectos que no hemos comentado de los listados. Cuando estamos visualizando el listado de una sección o categoría podremos ver junto a los iconos de modificar y eliminar otro icono que pondrá 'listar xxx'. Esto no es más que el acceso rápido al listado de elementos de ese módulo que estén asignados a esa categoría y los he añadido para aumentar la versatilidad de éstos listados. El otro aspecto que no hemos comentado es sobre los 2 botones que aparecen en la parte inferior del listado, justo debajo del mismo. Podemos ver dos botones con las etiquetas: 'Generar Informe' y 'Generar Excel'. Efectivamente estos dos botones se usarán para generar un documento PDF o EXCEL del listado que estamos mostrando; el listado se mostrará completo, no solo de la página actual. Actualmente sólo se realizan unos listados muy básicos pero que dan mayor juego a la hora de poder imprimir el listado o usar los datos del mismo para otros fines.

Figura A.9. - Ejemplo de PDF

Figura A.10. - Ejemplo de Excel



Con esto damos por terminado el tutorial.

Metodología Modelo-Vista-Controlador para la Programación Web en PHP APENDICE B


APENDICE B: CONTENIDO DEL CD

A continuación se listan los elementos que componen el CD adjunto a este

proyecto.

- Copia de la memoria en formato PDF, que incluye un pequeño manual de usuario para el administrador de la web: archivo Memoria.pdf

- Imágenes y diagramas usados para realizar la memoria, tanto en su formato original

como en el usado en la memoria: directorio Gráficos - Código fuente de la Web de ejemplo: Grupos de Técnicas Computacionales en la

Ingeniería - Grupo TIC 0118: directorio Web_Grupos_TIC0118 - Código fuente de la librería base generada para usar en nuevos proyectos: directorio

Librería_Base_1.0 - Código fuente de módulo de ejemplo – Noticias (usado en la web de ejemplo):

directorio Módulo_Ejemplo_Noticias

Metodología Modelo-Vista-Controlador para la Programación Web en PHP APENDICE B


Metodología Modelo-Vista-Controlador para la Programación Web en PHP Bibliografía


BIBLIOGRAFÍA [1] Andi Gutmans, Stig Bakken, Derick Rethans, “PHP 5 Power Programming”, Prentice Hall Part of the Bruce Peren’s Open Source Series, 27 Oct 2004 (versión electrónica) Manuales en español de la Página oficial de PHP: http://www.php.net [2] Alvarez Garcia, Alonso & Morales Grela, Jose Angel, “HTML 4.1”, Anaya Multimedia, 2003 [3] David H. Jonassen, “Operationalizing Mental Models: Strategies for assessing Mental Models to Suport Meaningful Learning and Design-Supportive Learning Environments”, Información disponible via Web en: http://www.ittheory.com/jonassen2.htm Joseph Bergin, “Building Graphical User Interfaces with the MVC Pattern”, Información disponible via Web en: http://csis.pace.edu/~bergin/mvcgui.html [4] Información disponible en O’Relly OnLamp.com “The Open Source Web Plataform”: www.onlamp.com Pequeña guia en español en: http://ciberaula.com/curso/lamp/que_es/ Guia de instalación en: http://lamphowto.com [5] Steve Krug, “No me hagas pensar. Una aproximación a la usabilidad Web. Segunda Edición”, Pearson Educación, S.A. Madrid, 2006 [6] Craig Larman, “Applying UML and Patterns. An introduction to Object-Oriented Análisis and Desing – second edition –“, Prentice may Newjersey, 2001 Pequeño tutorial en español en: www.programacion.net/tutorial/uml/ [7] Elmasri y Navathe. “Fundamentos de los Sistemas de Base de Datos. Tercera Edición”, The Benjamin/Cummings Publishing Company Inc, 2001. [8] “Perl, CGI y Javascript”, Ediciones Anaya Multimedia (Grupo Anaya, S.A.), 2000 [9] Manual breve en www.w3c.es/divulgacion/guiasbreves/HojasEstilo [10] Información disponible en la Web oficial de la distribución de Linux Debian: http://www.debian.org [11] Información disponible en la Web oficial de Apache: http://www.apache2.org [12] James R. Groff & Paul N. Weinberg, “Guía LAN TIMES de SQL”, McGraw-Hill Interamericana de España, S.A.U., 1994 [13] Información disponible en la Web oficial de PostgreSQL: http://www.postgresql.org/ [14] Información disponible en la Web oficial de Proftpd: http://www.proftpd.org

Metodología Modelo-Vista-Controlador para la Programación Web en PHP Bibliografía


[15] Información disponible en la Web de Sourceforte, proyecto dedicado al conjunto de librerias PHPLib: https://sourceforge.net/proyects/phplib [16] Información disponible en la Web oficial de ImageMagick: http://www.imagemagick.org/script/index.php [17] Información disponible en la Web oficial de fpdf: http://www.fpdf.org [18] Información disponible en la Web oficial de Proyectonave: http://www.proyectonave.es/productos/nvu [19] Información disponible en la Web de Sourceforge, proyecto phpPgAdmin: http://phppgadmin.sourceforge.net [20] Información disponible en la Web oficial de Bluefish: http://bluefish.openoffice.nl/index.html [21] Internet Systems Consortium: http://www.isc.org/index.pl

modelo mvc php

Documents

modelo vista controlador

php mlaga

programacin web

informtica de sistemas

programacin tradicional

gonzlez bonilla dirigido

php realizado

sistemas lamp