Programación en castellano
Inicio > Tutoriales > Cómo hacer el mapa de un sitio web
-Tutoriales

Cómo hacer el mapa de un sitio web


Embellecemos el resultado

Así pues, hemos creado un script que escanea los directorios en búsqueda de ficheros: esta es la funcionalidad más importante y la hemos logrado. Ahora, concentrémonos en los resultados obtenidos. En primer lugar, añadamos una parte que imprima los nombres de los directorios y enlaces a cada uno de los ficheros, además de unos cuantos iconos agradables a la vista. Naturalmente, no lo haremos manualmente – véase Listado 10.

Listado 10: Embellecemos el script
for($y=0; $y<sizeof($sdirs); $y++)
{
   echo "<img align=absmiddle src=folder.gif> <a href=
      \"http://$SERVER_NAME$prefix/$dir1$sdirs[$y]\">$sdirs[$y]</a>";
}
...
for($y=0; $y<sizeof(sfiles); $y++)
{
   echo "<img align=absmiddle src=\"";
   echo $display[get_extension($sfiles[$y])];
   echo "\"> ";
   echo "<a href=\"http://$SERVER_NAME$prefix/$dir1$sfiles[$y]\">$sfiles[$y]</a>";
}

Tal y como hicimos mención anteriormente, el icono correspondiente a cada tipo de fichero es almacenado en un array adecuado. Vale la pena notar la manera en que utilizamos la variable global $SERVER_NAME, la cual contiene la dirección del servidor requerida por el navegador de Internet del usuario (más tarde explicaremos cómo obtener la variable $dir1). Gracias a ella podemos utilizar la dirección correcta, independientemente de si la página es visitada por un usuario en la intranet o desde el exterior. Por supuesto, no es obligatorio el uso de una ruta de acceso absoluta, simplemente es que estoy acostumbrado a ellas.

En este momento la presentación es bastante sencilla. Aunque podría ya ser considerada satisfactoria, vale la pena hacerla más atractiva si también otras personas van a mirarla.

El método adecuado (y frecuentemente utilizado) para representar un sistema de ficheros es la estructura jerárquica. JavaScript da varias posibilidades de presentar la apertura de ramas en una estructura de este tipo; sin embargo, yo decidí hacer uso de HTML puro, pues no me fue posible hacer que todos los navegadores trabajen con mis mejoras en JavaScript.

¿Qué debemos saber antes de crear una presentación así? Por supuesto, el nivel en el cual nos encontramos en la estructura de los directorios. Podemos conocerlo fácilmente contando la cantidad de barras (/) que contiene la ruta:

$dir = getcwd();
$dir1 =
  str_replace($root, "", $dir."/");
$count =
  substr_count($dir1, "/")
    + substr_count($dir1, "\\");

En primer lugar tenemos que obtener la ruta al directorio actual. Si decidimos hacer uso de la ruta suministrada al lanzar opendir(), en vez de cambiar los directorios bastará añadir esta ruta al resultado de la ejecución de getcwd().

La segunda línea elimina el directorio principal del servidor web de la ruta, porque no queremos que los visitantes que miren el mapa del sitio conozcan la estructura interior de los directorios. En los sistemas Unix, la línea eliminada es generalmente /var/www/html/public (así la devuelve getcwd()). Además, de no hacerlo, nuestra presentación podría llegar a contener demasiadas ramas de la estructura jerárquica.

La tercera línea cuenta todos los caracteres “/” (para los sistemas Unix y “\” para la familia Windows). La barra invertida debe ser ignorada porque ella misma es un carácter de escape (inglés: escape character), que enmascara el carácter que le sigue, a no ser que éste último sea también un carácter de control; en la variable $count mantenemos el número de niveles.

El siguiente código nos creará un número apropiado de ramas:

for($z=1; $z<=$count; $z++)
{
  echo "<img align=absmiddle
    src=vertical.gif>&nbsp;&nbsp;&nbsp;";
}

Mostramos n-1 ramas, donde n corresponde al número del nivel. La última rama conduce al fichero/directorio (la “hoja” o extremidad de la rama), para el que necesitaremos un icono diferente. Además, las hojas que se encuentran en la extremidad de la rama deben ser diferenciadas de las que las preceden. Lo comprobamos con la ayuda del siguiente código:

if(is_array($sfiles)) //para los directorios
if($y == ($sizeof($sfiles) -1)) //para los ficheros

Con los directorios, verificamos si contienen algún fichero; en cambio, si encontramos un fichero, comprobamos si éste es el último del array. Finalmente, después de presentar todos los ficheros en el directorio dejaremos una línea vacía antes de pasar a otra rama:

for($z=1; $z<=$count; $z++)
{
  echo "<img align=absmiddle
    src=vertical.gif>&nbsp;&nbsp;
    nbsp;";
}

Esto es casi todo. Agregamos un poco de simple código HTML para colocar todo esto en un array, y nuestro script ya está listo para ser usado. El resultado de la ejecución de este script debe mostrarse más o menos como en la Figura 2.

Figura 2: Script ejecutado en el plug-in de Internet Explorer
 
Patrocinados
 

Copyright © 1999-2007 Programación en castellano. Todos los derechos reservados.
Formulario de Contacto - Datos legales - Publicidad

Hospedaje web y servidores dedicados linux por Ferca Network

red internet: juegos gratis | logos y melodias | hospedaje web linux | registro de dominios | servidores dedicados
más internet: comprar | recursos gratis | posicionamiento en buscadores | decoración web | gifs animados