Entregable 10: pantalla de detalles

En esta pantalla se le mostrará al usuario la descripción completa del artículo que él ha dado click para poder así, si es de su conveniencia y gusto, comprarlo. El contenido principal de esta sección estará dividido en una imagen (por el momento, y a la izquierda) y la descripción de ese artículo (a la derecha) justo abajo de la descripción hay un botón con el que el usuario puede comprar dicho artículo y así le llegarán los datos del vendedor al correo que haya registrado.

A continuación se presenta una imagen de esta sección:

Entregable 9: Busqueda por facultades

Nuestra página web será capaz de buscar los productos que hayan publicado los usuarios pero en este caso dividiendolos por las diferentes facultades con las que cuenta el campus de ciudad universitaria. Para realizar esto se deben seguir casi los mismos pasos que los descritos en el entregable anterior con excepción de la consulta a la base de datos que se hará, ahora la busqueda será realizada con la siguiente línea de código:

$query = mysql_query("SELECT *FROM productos WHERE facultad=$facultad");

En dónde la variable $facultad es recibida desde otra sección de la página a través del método GET y así poder ubicar en que facultad es la que el usuario quiere buscar los articulos, a continuación se presenta el resultado de este entregable:

Se observa los parámetros que se envían a través del método GET

Aquí el resultado de la búsqueda por facultad, en este caso fue por FIME.

Entregable 8: Cargar artículos

En este entregable se resolverá un problema que teníamos desde un inicio que es el de como los usuarios podrán ver la lista de los artículos disponibles, el cual desplegará información sobre cada artículo y contará con la posibilidad de que el usuario al dar un click sobre el nombre del artículo lo lleve con un hipervínculo hacía otra sección dónde podrá ver el detalle del artículo.

Primero debemos hacer la conexión con el servidor (en este caso un localhost), luego seleccionaremos la base de datos con la que estaremos trabajando, después habrá que hacer la consulta para recuperar la información de cada artículo que hay almacenado en la base de datos y por último aplicarle un buen estilo para hacer un poco llamativo la interfaz al usuario.

Después de hacer los pasos descritos anteriormente se llegó al siguiente resultado:

Entregable 7: Subir artículos

Para esta entrada se realizo la sección de subir un artículo en dónde lo que se le pide al usuario es rellenar un pequeño formulario y subir una imagen del artículo que piensa vender y dar click en el botón subir para así guardar esa información en la base de datos. Los campos están validados desde HTML5 con la propiedad required que ya habíamos usado antes para los formularios de logging y de nuevo usuario.

A continuación una imagen de la sección:

Entregable 6: Botón de Búsqueda

Para este entregable, modificamos el campo de búsqueda, el cual se ubica en la esquina superior derecha de nuestra página.

Como motor de búsqueda predefinimos a Google, las búsquedas ingresadas las realizara en facebook, solo como prueba. Más adelante lo modificaremos para que solo lo haga dentro de mercado universitario.

Por ejemplo, si buscamos el libro de Piensa en C de Cairo, solo nos arrojará resultados ligados a facebook, aquí la muestra:

Como mencionamos antes, más adelante solo realizará las búsquedas dentro de nuestra página.

Entregable 5: Entrada de Usuario

En este avance creamos una ventana pop-up (con el mismo estilo que la ventana de registro) en la cual los usuarios podrán loguearse a nuestra página. 

Basta con ingresar el nombre de usuario y su respectiva contraseña para poder acceder a la página.

Cabe destacar que esta validada con la propiedad required de HTML5, la cuál si detecta un campo vacío, le avisará al usuario de esto y le pedirá que llene el campo incompleto, he aquí una muestra: