Desarrollo de un foro de discucion.

Especificación

El modelo de caso de uso describe los requerimientos funcionales de la aplicación en términos de actores y casos de uso. Cada caso de uso define el comportamiento de algún aspecto de la aplicación sin considerar la estructura interna.

Casos de uso

A- Nombre del Caso de Uso: mostrar los siguientes registros
Pre-condición: la aplicación esta mostrando la pagina de los registros
Resumen: la aplicación muestra los siguientes n registros
Actor: usuario de la aplicación
1- el usuario presiona el botón siguiente
2- el browser envía al servidor el evento siguiente
3- el servidor solicita a la base de datos los siguientes n registros a partir del ultimo que se estaba mostrando
4- la base de datos entrega al servidor los registros que encuentra
5- si la base de datos entrega algún registro el servidor incrementa al numero de pagina
6- el servidor envía al browser los registros y el numero de pagina
7- el browser muestra los registros y el numero de pagina

B- Nombre del Caso de Uso: mostrar los registros anteriores
Similar al mostrar los siguientes registros

C- Nombre del Caso de Uso: borrar alguno de los registros que se están mostrando
Similar al mostrar los siguientes registros

Diagrama de Clases

El diagrama de clases pude ser hecho del diagrama de colaboración. Es fácil determinar la operación del modelo de colaboración. Esto es porque el modelo de colaboración muestra los mensajes y la interacción entre los objetos, y el objeto que envía el mensaje invoca la operación del destinatario del objeto. Los mensajes pasados entre objetos pasivos consisten se traduce como un objeto invoca una operación provista por otro objeto.

A- Coordinator Objects. WebServer
Esta clase oculta los detalles de concurrencia, secuenciación y la lógica de la aplicación. Este objeto activo (tarea) describe como la aplicación responde a los eventos de entrada que recibe y las operaciones que invoca sobre los objetos.

B- Wrapper DataBase. Registros
Esta clase provee una internas a la base de datos, que puede usar el modelo relacional. Oculta los detalle de la base de dato y todas las sentencias SQL, que nos permite abstraernos del motor de base de datos usado. En el ejemplo usaremos sql-server.

D- User Interface. Browser
Esta provee una interfaz virtual que oculta los detalles del html. El impacto de los cambios del html esta limitado a la implementación de las operaciones de esta clase. Esta clase nos abstrae de todo el código html usado para mostrar la página en el browser.

 

Implementacion en DHTML

En esta descomposcion se penso en los cambios.

Los cambios mas comunes que se podrian dar son en la interfaz de usuario y en el motor de base de datos.

A- Coordinator Objects WebServer

$nroFilasPorPagina=2;
$interfazEntradaCliente=new InterfazEntradaCliente();
$nroPagina=$interfazSalidaCliente->NroPagina();
if($nroPagina=='') {
  $nroPagina=1;
}
$interfazSalidaCliente=new InterfazSalidaCliente();
$entityDataBaseTemas=new EntityDataBaseTemas($nroFilasPorPagina);
$tabla=$entityDataBaseTemas->VerPagina($nroPagina);
$maxPagina=$entityDataBaseTemas->MaxPagina();
$interfazSalidaCliente->Mostrar($maxPagina, $nroPagina, $tabla);
 

B – DataBase Wrapper Registros

class EntityDataBaseTemas {
  var $result;
  var $nroFilasPorPagina;
  function EntityDataBaseTemas($nroFilasPorPagina) {
  $this->nroFilasPorPagina=$nroFilasPorPagina;
  $con=mysql_connect("fdb1.awardspace.com","craveromarcos_db","clave");
  if(!$con) {
  }mysql_select_db("craveromarcos_db",$con);
  }
  function MaxPagina() {
    $str="SELECT COUNT(*) AS nroFilas FROM Temas";
    $this->result=mysql_query($str);
    $row=mysql_fetch_array($this->result);
    $maxPagina=ceil($row['nroFilas']/$this->nroFilasPorPagina);
    return $maxPagina;
  }
function VerPagina($nroPagina) {
  $base=($nroPagina-1)*$this->nroFilasPorPagina;
  $str="SELECT * FROM Temas WHERE idTema>".$base." ORDER BY idTema ASC LIMIT ".$this->nroFilasPorPagina;
  $this->result=mysql_query($str);
  while($row=mysql_fetch_array($this->result)) {
    $tabla[]=$row;
  }
  return $tabla;
}
}

C - User Interface Entrada Cliente

class InterfazEntradaCliente {
  function InterfazSalidaCliente() {
}
function NroPagina() {
  $nroPagina=$_GET['nroPagina'];
  return $nroPagina;
}
}
 

D – User Interface Salida Cliente Html

class InterfazSalidaCliente {
function InterfazSalidaCliente() {
}
function Mostrar($maxPagina, $nroPagina, $tabla) {
  echo "

<html>
  <head>
  <script languaje='JavaScript'>
  </script>
</head>
<body>
  <b>
  Quieres dar tu opinion en alguno de los siguientes temas
  </b>
  <br>
  <br>
  <table border='1'>
  <tr>
  <th>idTema</th>
  <th>tituloTema</th>
  <th>descripcionTema</th>
  <th>autor</th>
  <th>fecha</th>
  </tr>";

  $i=0;
while($i<count($tabla)+1) {
echo "<tr>";
echo "<td><a href=ForoMensajes.php?isPostBack=true&botonPrecionado=siguientes&limite=0&idTema=".$tabla[$i]['idTema'].">".$tabla[$i]['idTema']."</a></td>";
echo "<td>".$tabla[$i]['tituloTema']."</td>";
echo "<td>".$tabla[$i]['descripcionTema']."</td>";
echo "<td>".$tabla[$i]['autor']."</td>";
echo "<td>".$tabla[$i]['fecha']."</td>";
echo "</tr>";
  $i=$i+1;
}

echo "
  </table>
";

$self=$_SERVER['PHP_SELF'];

if($nroPagina>1) {
  $pagina=$nroPagina-1;
  $prev="<a href='$self?nroPagina=$pagina'>&lt; Anterior</a>&nbsp;&nbsp;";
  $first="<a href='$self?nroPagina=1'>&lt;&lt; Primera Pagina</a>&nbsp;&nbsp;";
} else {
  $prev='&nbsp;';
  $first='&nbsp;';
}
$nav='';

for($pagina=1;$pagina<=$maxPagina;$pagina++) {
  if($pagina==$nroPagina) {
    $nav.="$pagina &nbsp;&nbsp;";
  } else {
    $nav.="<a href='$self?nroPagina=$pagina'>$pagina</a>&nbsp;&nbsp;";
}
}

if($nroPagina<$maxPagina) {
  $pagina=$nroPagina+1;
  $next="<a href='$self?nroPagina=$pagina'>Posterior></a>&nbsp;&nbsp;";
  $last="<a href='$self?nroPagina=$maxPagina'>Ultima pagina>></a>&nbsp;&nbsp;";
} else {
  $next='&nbsp;';
  $last='&nbsp;';
}
echo $first.$prev.$nav.$next.$last;
echo "
<br>
<br>
<br>
<br>
<a href='InsertIntoTemas.html'>
<b>Crea un tema para que los demas opinen</b>
</a>
<br>
<br>
</body>
</html>
";
}
}
 

Implementacion en Flash con ActionScript

En el servidor solo modificamos la implementacion del metodo mostrar de la clase InterfazSalidaCliente. Antes enviabamos los tag Html, ahora enviamos XML conteniendo la informacion necesaria para que en el cliente con ActionScript creemos una interfaz de usuario..

En el cliente recibimos la informacion contenida en XML y luego de extraerla diseñamos con Flash la pagina que se va a mostrar en el browser..

Codigo en el servidor. Solamente modificamos el metodo mostrar de la clase interfaz

D – User Interface. 

class InterfazSalidaCliente {
function InterfazSalidaCliente() {
}
function Mostrar($maxPagina, $nroPagina, $tabla) {

echo "

<?xml version=\"1.0\" encoding=\"ISO-8859-1\" ?>
<head>
<config maxPagina=\"".$maxPagina."\" nroPagina=\"".$nroPagina."\"></config>
<pagina>";

$i=0;
while($i<count($tabla)+1) {
echo "<foro idTema=\"".$tabla[$i]['idTema']."\" tituloTema=\"".$tabla[$i]['tituloTema']."\" descripcionTema=\"".$tabla[$i]['descripcionTema']."\" autor=\"".$tabla[$i]['autor']."\" fecha=\"".$tabla[$i]['fecha']."\"></foro>";
$i=$i+1;
}
echo "
</pagina>
</head>";
}
}

 

Codigo en el cliente en ActionScript

class InterfazEntradaSalida {
    function InterfazEntradaSalida() {
    }
    public function Servidor(nroPagina:Number):Void {

      var miXML:XML = new XML();
      miXML.ignoreWhite=true;
      miXML.load("http://preview2.awardspace.com/craveromarcos.com/ForoTemas.php?nroPagina="+nroPagina);
      trace("hola1");
      miXML.onLoad=function() {
        this.listaElementos();
        var interfazEntradaSalida:InterfazEntradaSalida = new InterfazEntradaSalida();
        interfazEntradaSalida.Cliente(this.firstChild.childNodes[0].attributes.maxPagina, this.firstChild.childNodes[0].attributes.nroPagina,      
        this.firstChild.childNodes[1].childNodes);
     }
  }
  function Pagina(mensaje) {
    var misVariables:LoadVars= new LoadVars();
    getURL("http://preview2.awardspace.com/craveromarcos.com/InsertIntoTemas.html");
  }

  public function Cliente(maxPaginaStr, nroPaginaStr, cont):Void {
    var nuevo:MovieClip;
    _root.createEmptyMovieClip("nuevo",20);
    var nroPagina:Number;
    var maxPagina:Number;
    nroPagina=parseInt(nroPaginaStr);
    maxPagina=maxPaginaStr;
    var i:Number;
    i=0;
    while(i<cont.length) {
    _root.nuevo.createEmptyMovieClip("idTemas"+i,100+i);
    _root.nuevo["idTemas"+i].id=cont[i].attributes.idTema;
    _root.nuevo["idTemas"+i].createTextField("titulo",4+i*3,0,i*25,200,16);
    _root.nuevo["idTemas"+i].titulo.type="input";
    _root.nuevo["idTemas"+i].titulo.text=cont[i].attributes.tituloTema;
    _root.nuevo["idTemas"+i].createTextField("descripcion",5+i*3,200,i*25,200,16);
    _root.nuevo["idTemas"+i].descripcion.type="input";
    _root.nuevo["idTemas"+i].descripcion.text=cont[i].attributes.autor;
    _root.nuevo["idTemas"+i].createTextField("autor",6+i*3,400,i*25,200,16);
    _root.nuevo["idTemas"+i].autor.type="input";
    _root.nuevo["idTemas"+i].autor.text=cont[i].attributes.fecha;
    _root.nuevo["idTemas"+i].onRelease= function() {
      var interfazEntradaSalida:InterfazEntradaSalida = new InterfazEntradaSalida();
      interfazEntradaSalida.Pagina(this.id);
    }
    i=i+1;
}


var x:Number;
var y:Number;
var pagina:Number;
x=0;
y=100;
if(nroPagina>0) {
  pagina=nroPagina-1;
  _root.nuevo.createEmptyMovieClip("anteriorMovieClip",10);
  _root.nuevo.anteriorMovieClip.id=pagina;
  _root.nuevo.anteriorMovieClip.createTextField("anterior",0,x,y,500,16);
  _root.nuevo.anteriorMovieClip.anterior.text=" anterior ";
  _root.nuevo.anteriorMovieClip.onRelease= function() {
  var interfazEntradaSalida:InterfazEntradaSalida = new InterfazEntradaSalida();
  interfazEntradaSalida.Servidor(this.id);

}
}
pagina=0;
while(pagina<maxPagina) {
  _root.nuevo.createEmptyMovieClip("pagina"+pagina,17+pagina);
  _root.nuevo["pagina"+pagina].id=pagina;
  x=70+(30*pagina);
  _root.nuevo["pagina"+pagina].createTextField("pagina",pagina,x,y,50,16);
  _root.nuevo["pagina"+pagina].pagina.text=pagina;

if(pagina==nroPagina) {
} else {
  _root.nuevo["pagina"+pagina].onRelease= function() {
  var interfazEntradaSalida:InterfazEntradaSalida = new InterfazEntradaSalida();
  interfazEntradaSalida.Servidor(this.id);
}
}
pagina=pagina+1;
}

if(nroPagina<maxPagina) {
  x=x+30;
  pagina=nroPagina+1
  _root.nuevo.createEmptyMovieClip("siguienteMovieClip",12);
  _root.nuevo.siguienteMovieClip.id=pagina;
  _root.nuevo.siguienteMovieClip.createTextField("siguiente",0,x,y,500,16);
  _root.nuevo.siguienteMovieClip.siguiente.text=" siguiente ";
  _root.nuevo.siguienteMovieClip.onRelease= function() {

  var interfazEntradaSalida:InterfazEntradaSalida = new InterfazEntradaSalida();
  interfazEntradaSalida.Servidor(this.id);

}
}
  _root.nuevo.createEmptyMovieClip("agregarTemaMovieClip",13);
  _root.nuevo.agregarTemaMovieClip.createTextField("agregarTema",0,0,y+50,500,16);
  _root.nuevo.agregarTemaMovieClip.agregarTema.text=" agregar tema ";
  _root.nuevo.agregarTemaMovieClip.onRelease= function() {
}
}
}
 

Bibliografía

- Fundaments of Software Engineering. Carlo Gehezzi, Mehdi Jazayevi, Dino Mandrioli
- Designing Concurrent, Distributed, and Real-Time Applications with Uml. Hassan Gomaa

marcosgabrielcravero@gmail.com

Developer of applications for Internet freelance
Copyright. Cravero Gabriel. 2006

Permission is granted to copy, distribute and/or modify this document
under the terms of the GNU Free documentation License, Version 1.2 or
any later version published by the Free Software Foundation. A copy of
the license is included in the section entitled "GNU Free
Documentation License