Banderas del Mundo

Logotipo de banderas

Es una base de datos MySQL que contiene banderas de países actuales y del pasado, de organizaciones internacionales, etc.

Las banderas se almacenan en formato SVG. Este formato es una descripción en XML de una imagen vectorial

Para consultar las banderas se utiliza una aplicación AJAX que utiliza: Prototype o jQuery + MySQL + PHP

Las banderas

Hay - banderas en total

    ···

    ver bandera

    Banderas a pantalla completa con más información y más filtros

    Utilización de la aplicación

    1. Al cargar la página se obtiene un listado aleatorio de 20 banderas
    2. Al seleccionar un elemento de la lista se carga la bandera y los datos de la ficha
    3. Al realizar una búsqueda se obtiene un nuevo listado de 20 banderas acorde al filtro. La búsqueda se realiza en:
      • El nombre del país
      • El nombre oficial del país
      • El nombre en inglés del país
      • La capital del país
      • Un año en que ya existía el país

    XML

    Los datos transmitidos del servidor al cliente por cada petición AJAX.

    Listado aleatorio de banderas — server/banderas.php

    Se produce al cargar la página o al buscar sin indicar ningún valor. El listado está ordenado por país.

    <banderas aleatorio="true">
    <bandera id="6" inicio="1975" fin="">Angola</bandera>
    <bandera id="158" inicio="1918" fin="">Estonia</bandera>
    <bandera id="209" inicio="1991" fin="">Tayikistán</bandera>
    ...
    </banderas>

    Listado filtrado de banderas — server/banderas.php?filter=ab

    El filtro busca en varios campos simultáneamente. Del resultado encontrado retorna un máximo de 20 banderas. Se toma una muestra aleatoria del resultado si es que hay más de 20 banderas.

    <banderas filtro="ab">
    <bandera id="300" inicio="1992" fin="">Abjasia</bandera>
    <bandera id="48" inicio="-1" fin="">Adís Abeba —Etiopía—</bandera>
    <bandera id="302" inicio="1992" fin="">Alto Karabaj</bandera>
    ...
    </banderas>

    Ficha de una bandera — server/banderas.php?id=150

    <ficha id="150">
    <pais>Zimbabue</pais>
    <inicio>1965</inicio>
    <fin/>
    <oficial>República de Zimbaue</oficial>
    <country>Zimbabwe</country>
    <continente>África</continente>
    <gobierno>Democracia Parlamentaria</gobierno>
    <idiomas>Inglés,Shona,Ndebele</idiomas>
    <capital>Harare</capital>
    <moneda>Dólar zimbabuense</moneda>
    <poblacion>11271314</poblacion>
    <extension>390580</extension>
    </ficha>

    La bandera

    La bandera es un archivo XML en formato SVG que está almacenada en la BD. Se trata de una imagen vectorial. Este fichero no se transmite en las peticiones AJAX.

    Para visualizar la bandera hay el siguiente código en el documento HTML:

    <object id="bandera" data="server/bandera.php?id=" type="image/svg+xml" >

    La bandera se toma del archivo bandera.php que la busca en la BD. Cuando llega los datos XML de una ficha se toma el valor del atributo id para modificar el parámetro data del código anterior.

    Por ejemplo, para mostrar la bandera de Zimbaue, el código quedaría así:

    <object id="bandera" data="server/bandera.php?id=150" type="image/svg+xml" >

    El formato SVG en los navegadores web

    El archivo SVG tiene problemas de visualización en algunos navegadores web.

    • En Microsoft Internet Explorer no se visualiza si no es mediante un plugin.
    • En Google Chrome y Safari no sale directamente pero sí que se ve al visualizar la bandera a pantalla completa.
    • En Mozilla Firefox y en Opera funciona bien.

    SQL

    Obtener una bandera a partir del id.

    SELECT bandera FROM banderas WHERE id = id?

    Listado aleatorio de 20 banderas

    SELECT * FROM (
      SELECT pais AS bandera, id, inicio, fin
      FROM banderas
      ORDER BY rand()
      LIMIT 20
    ) a ORDER BY bandera

    Listado filtrado y aleatorio de hasta 20 banderas

    SELECT * FROM (
      SELECT
        CASE
          WHEN pais LIKE filter? THEN pais
          WHEN oficial LIKE filter? THEN oficial
          WHEN country LIKE filter? THEN country
          WHEN capital LIKE filter? THEN concat(capital,' —',pais,'—')
          ELSE pais
        END AS bandera,
        id,
        inicio,
        fin
      FROM
        banderas
      WHERE
        pais LIKE filter? OR
        oficial LIKE filter? OR
        country LIKE filter? OR
        capital LIKE filter? OR
        year? BETWEEN inicio AND coalesce(fin,9999)
      ORDER BY
        rand()
      LIMIT 20
    ) a ORDER BY bandera

    Ficha de una bandera a partir del id

    SELECT
        pais, inicio, fin, oficial, country, continente, gobierno,
        idiomas, capital, moneda, poblacion, round(extension) as extension
      FROM banderas
      WHERE id = id?

    Archivos utilizados

    • Base de datos:

      La base de datos mundo en MySQL. Dentro está la tabla banderas. El campo bandera es de tipo texto y almacena la bandera en formato SVG.

    • Servidor (carpeta server):
      • conexion.php — Paŕametros de conexión con la BD: servidor, base de datos, usuario y contraseña.
      • db.php — Clase para obtener arrays a partir de una sentencia SQL parametrizada.
      • xml.php — Clase que convierte arrays en cadenas XML.
      • bandera.php — Retorna la bandera en formato SVG según el parámetro id. Por ejemplo: bandera.php?id=46
      • banderas.php — Recibe las peticiones del cliente y responde en XML. Ejemplo de peticiones: banderas.php — Listado aleatorio de banderas banderas.php?filter=fr — Las banderas seleccionadas. banderas.php?id=46 — Ficha de una bandera.
    • Cliente 1 (versión Prototype):
      • banderas1.html — Estructura del documento.
      • banderas1.js — Código cliente que realiza las peticiones al servidor, obtiene las respuestas en XML y altera la estructura del documento mediante DOM.
      • banderas.css — Estilos en cascada.
      • prototype.js — Ampliación de Javascript prototypejs.org
    • Cliente 2 (versión jQuery):
      • banderas2.html — Estructura del documento.
      • banderas2.js — Código cliente que realiza las peticiones al servidor, obtiene las respuestas en XML y altera la estructura del documento mediante DOM.
      • banderas.css — Estilos en cascada.
      • jquery.js — Framework de Javascript
      • mustache.js — Plantillas en Javascript

    Bibliografía

    Base de datos

    En el archivo banderas.sql.7z hay 399 fichas en MySQL.

    Comentarios

    Proinf.net, ©2003-2017 ci 3.1.5 (CC) Esta obra está bajo una licencia de Creative Commons Este software está sujeto a la CC-GNU GPL