Siguenos en ...

Google+facebooktwitter

youtubepinterest RSS aquihayapuntes

Últimos Tutoriales

Licencia

Creative Commons

 

Todo el contenido de este sitio está bajo una licencia de Creative Commons

 

Comandar un PIC a través de Internet

 

Ejemplo Nº1


Ahora que ya tenemos nuestro SitePlayer montado y leída la documentación del fabricante ya estamos listos para realizar el primer ejemplo. Que consistirá en la realización de una página WEB realizada en HTML y que alojaremos en el SitePlayer, después desde un navegador WEB instalado en un PC accederemos a dicha página, la cual permitirá el control del puerto de I/O del SitePlayer.

La aplicación una vez terminada quedará según se muestra en la figura de abajo.

 

Circuito Ejemplo Nº 1

 

Desde la página web mostrada a la izquierda de la imagen de arriba podremos poner a ON/OFF tres salidas digitales representadas por tres diodos Leds, también podremos visualizar el estado de los dos pulsadores colocados sobre la proto-Board.

Para la realización de cualquier proyecto con el SitePlayer deberemos de realizar los siguientes pasos:

 

1)  Crear el archivo de definiciones de nuestro proyecto (.SPD) con el bloc de Notas u otro editor de texto plano.

 

2)  Crear la o las páginas WEBS usando un editor HTML (podéis utilizar cualquiera, siempre que cumpla el estándar).


3)  Ensamblar todo en único archivo binario (.SPB) y descargarlo en el SitePlayer a través del programa SiteLinker.


4)  Acceder a la página cargada en el SitePlayer a través de un navegador WEB.

 

Archivo de Definiciones


El archivo de definiciones para nuestro primer ejemplo es el siguiente:

;Ejemplo1 
 
;SECCIÓN DEFINICIONES 
 
;Nombre o descripción del dispositivo 
$Devicename "AquiHayApuntes.com" 
 
;$DHCP on establece que el SitePlayer obtenga la IP a través de un servidor DHCP 
$DHCP off 
 
;$DownloadPassword password para poder descargar nuevas páginas y actualizaciones del firmware. 
$DownloadPassword "" 
 
;$InitialIP Parámetro para configurar una IP fija 
$InitialIP "192.168.1.250"     
 
;$PostIRQ on genera un nivel bajo (IRQ) en el pin 11.  
$PostIRQ off 
 
;$Sitefile ruta donde se creará el archivo binario con extensión .SPB 
$Sitefile "C:\Program Files\SitePlayer\Ejemplo1.spb" 
 
;$Sitepath Directorio raíz donde está alojada la página WEB 
$Sitepath "C:\Program Files\SitePlayer\Ejemplo1" 
 
 
;SECCIÓN DE OBJETOS 
org    0FF14h 
led1    ds 1 
 
org    0FF15h 
led2    ds 1 
 
org    0FF16h 
led3    ds 1 
 
org    0FF17h 
pulsador1    ds 1 
 
org    0FF18h 
 
pulsador2    ds 1 
 
;SECCIÓN EXPORTACIÓN DE FICHEROS 
;No utilizada en este ejemplo.

 

Lo primero que observamos viendo el contenido del archivo es que se parece mucho a un código escrito en ensamblador, lo que va detrás del “;“ son comentarios. El código se puede dividir en tres secciones: sección de definiciones, declaración de Objetos y una sección de exportación de ficheros.

En la sección de definiciones se establecen los parámetros iniciales del SitePlayer, hay muchas opciones de configuración (están todas explicadas en el manual de referencia), aquí vamos a comentar las utilizadas en este ejemplo:

;$Nombre o descripción del dispositivo 
$Devicename "AquiHayApuntes.com"

Este parámetro es equivalente al “nombre” de un PC que le ponemos para identificarlo dentro de una red local. El nombre puede ser una cadena de hasta 64 caracteres.

;$DHCP on establece que el SitePlayer obtenga la IP a través de un servidor DHCP 
$DHCP off 

Si nuestro Router dispone de servidor DHCP entonces la IP del dispositivo se la dará el Rooter dentro de las que tenga libres en el rango definido por nosotros.

Nota: la mayoría de los Modem-Rooter que proporcionan gratuitamente los proveedores de servicios de Internet llevan incorporado este servicio).

 
 ;$DownloadPassword password para poder descargar nuevas páginas y actualizaciones del firmware. 
$DownloadPassword "" 

En este caso la contraseña está en blanco, se puede especificar una contraseña de hasta 16 caracteres. Si tenemos establecida una contraseña el SiteLinker nos pedirá la contraseña antes de poder cargar una nueva página.

 
 ;$InitialIP Parámetro para configurar una IP fija 
$InitialIP "192.168.1.250"    

Si no utilizamos un servidor DHCP para obtener la dirección IP, con este parámetro asignaremos una IP fija a nuestro dispositivo. Si utilizamos la opción del DHCP a ON, también deberemos configurar una IP inicial con este parámetro.

 
 ;$PostIRQ on genera un nivel bajo (IRQ) en el pin 11.  
$PostIRQ off 

Esta opción es muy útil cuando utilizamos el SitePlayer junto con un Microcontrolador. Cada vez que desde la página WEB  se modifique algún dato, el SitePlayer pondrá a nivel bajo el PIN 11 durante cinco microsegundos, cuando este parámetro lo configuremos a ON podremos conectar ese PIN a la patilla RB0 del PIC configurado como interrupción externa, de esa manera el Microcontrolador no estará constantemente preguntando el valor de los datos al dispositivo, solo lo hará cuando haya datos nuevos que leer en el SitePlayer.

 
 ;$Sitefile ruta donde se creará el archivo binario con extensión .SPB 
$Sitefile "C:\Program Files\SitePlayer\Ejemplo1.spb" 

La ruta que pongamos aquí será donde se creará el archivo binario Ejemplo1.spb después de ensamblarlo con el programa SiteLinker.

 
 ;$Sitepath Directorio raíz donde está alojada la página WEB 
$Sitepath "C:\Program Files\SitePlayer\Ejemplo1"

Tendremos que crear la carpeta Ejemplo1 en el directorio indicado y dentro de esa carpeta es donde tendremos que guardar nuestra página WEB que puede constar de varias páginas html unidas mediante enlaces.

Sección de Objetos


Aquí es donde está el “Kit” de la cuestión. El SitePlayer dispone de unas direcciones de memoria que van desde la 0000h a 02FFh donde se pueden guardar objetos definidos por nosotros y acceder a su valor a través de diferentes interfaces y protocolos.

Nota: se puede hacer un símil entre lo que es una variable y el concepto de Objeto en el SitePlayer, pero como se verá más adelante los  “SiteObjetos” disponen de modificadores y propiedades que los hacen diferentes a lo que es en sí el concepto de una variable.

Por ejemplo, desde la página WEB utilizando el protocolo http  puedo hacer una petición de lectura o escritura de los objetos (variables) y desde la interfaz serie puedo también leer o escribir en esos objetos.  

Las siguientes líneas:

 
 org    0FF14h 
led1    ds 1 

Declaran el objeto led1 del tipo ds que es un tipo de dato que depende del espacio usado (parecido al tipo Variant en Basic) el 1 indica que es tipo byte., si fuera un dos sería de tipo Integer, etc. Este tipo de dato no admite un valor inicial para el objeto.

El org al igual que en ensamblador sirve para indicar a partir de que posición de memoria empezarán a guardarse los Objetos.

Veamos otro ejemplo:

org    00h 
led1    db 1 
pulsador1    db 1 

Aquí el valor del Objeto led1 se guardará en la dirección 0x00h y pulsador1 en la dirección 0x01h. El dato es de tipo byte (db) y el 1 tiene un significado diferente al ejemplo anterior, en este caso significa el valor inicial que tomará la variable.

Sección de Exportación de Ficheros


No utilizada en este ejemplo. Define cómo y dónde se exportará cualquier fichero durante el proceso de linkado. Útil cuando los datos se tienes que exportar a aplicaciones de escritorio hechas en Visual Basic, C, C++, etc.  

Nota: Una vez creado el archivo de definiciones lo guardamos con el nombre Ejemplo1.SPD, (no olvidarse de modificar la extensión del archivo).

Creación de la página WEB en html


Como hemos comentado ya para crear la página WEB podemos utilizar un simple editor de texto plano como el bloc de notas o ayudarnos de un editor de páginas WEB más avanzado como FrontPage, Dreamweaver u otro cualquiera, si utilizamos está última opción hay que tener en cuenta que aunque estos IDES son de gran ayuda para el que no tiene mucha soltura en programar en este lenguaje de etiquetas como es el html siempre tendremos que editar el código generado por el Wizard y modificar algunas cosas, vamos a ver que cosas son esas con el código del ejemplo que estamos viendo.

 

 
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Documento sin t&iacute;tulo</title></head> 
 
<body> 
<div align="left"> 
 <p><img src="/logo.jpg" width="300" height="85" /></p> 
</div> 
<table width="309" border="1"> 
 <tr> 
 <th colspan="2" bgcolor="#0066FF" scope="col">Contol E/S Site Player</th> 
 </tr> 
 <tr> 
 <td width="124" rowspan="3" bgcolor="#99CC00"><div align="center"><strong>Salidas Digitales</strong></div></td> 
 <td bgcolor="#FFFFFF"><div align="center"><a href="/Ejemplo1.SPI ?led1=led1~1">Toggle Led 1</a>&nbsp;&nbsp;<img src="/led^led1.gif" width="40" height="20" /></div></td> 
 </tr> 
 <tr> 
 <td bgcolor="#FFFFFF"><div align="center"><a href="/Ejemplo1.SPI ?led2=led2~1">Toggle Led 2</a>&nbsp;&nbsp;<img src="/led^led2.gif" width="40" height="20" /></div> 
 <div align="center"></div></td> 
 </tr> 
 <tr> 
 <td bgcolor="#FFFFFF"><div align="center"><a href="/Ejemplo1.SPI ?led3=led3~1">Toggle Led 3</a> &nbsp;&nbsp;<img src="/led^led3.gif" width="40" height="20" /></div> 
 <div align="center"></div></td> 
 </tr> 
 <tr> 
 <td bgcolor="#CCFF00"><p align="center"><strong>Entradas Digitales</strong></p>    </td> 
 <td><p><strong>estable/strong></p> 
 <p><strong>Pulsador 2 = ^pulsador2</strong></p></td> 
 </tr> 
</table> 
 
<p>&nbsp;</p> 
<p>&nbsp;</p> 
</body> 
</html> 


De todo este código y quitando el código que le da formato a la página, lo que nos interesa son las líneas que lleven código como este:

div align="center"><a href="/Ejemplo1.SPI?led1=led1~1">Toggle Led 1</a>&nbsp;&nbsp;<img src="/led^led1.gif" width="40" height="20" /></div> 
 
Pulsador 2 = ^pulsador2

El fabricante nos da la posibilidad de poder enviar o recibir datos al SitePlayer desde la página web de varias formas. Por ejemplo podemos utilizar el método GET desde un formulario y también podemos como en este caso enviar o recibir datos a través de un enlace.

Para establecer un enlace en HTML necesitamos un destino en este caso el destino es el archivo Ejemplo1.SPI que tendremos que crear y guardar en el directorio raíz que hayamos elegido en la creación del proyecto. El contenido de este archivo es el siguiente:

HTTP/1.0 302 Found 
Location: /index.htm 
<cr><lf>

Y para lo único que sirve es para hacer un re direccionamiento a la página index.htm con la información actualizada. Es muy importante no olvidarse de dejar una línea en blanco al final del fichero, si no lo hacemos no funcionará.

 

¿Cómo accedo a los Objetos desde html? Pues debemos de poner el símbolo (“^”) seguido del nombre del Objeto, en el ejemplo:

Pulsador 2 = ^pulsador2

^pulsador2 será sustituido por el valor que tenga en memoria el Objeto pulsador2.  

Y la parte del código html que modifica el valor de un Objeto es esta:
<a href="/Ejemplo1.SPI?led1=led1~1">Toggle Led 1</a>


En este caso led1=led~1 le asigna al objeto led1 su valor negado, con lo que se consigue el efecto Toggle en el led.

 

¿Y ahora Que..?

 

Pues ya tenemos todos los archivos que componen nuestro proyecto creados, nos queda unificarlos en un único archivo binario, para ello abrimos la aplicación SiteLinker hacemos clic sobre File-> Open y seleccionamos el archivo de definiciones que habíamos creado anteriormente (Ejemplo1.SPD). Una vez abierto hacemos clic sobre Download -> Make Download File. Si todo ha ido bien en el cuadro de texto de la aplicación nos mostrará el tamaño en bytes que ocupará el archivo en la memoria Flash del dispositivo y un mensaje de que el archivo binario (Ejemplo1.SPB) se ha creado correctamente.

 

Probando nuestro proyecto


En teoría ya tenemos nuestro proyecto listo para cargarlo en el SitePlayer, pero no sabemos si funciona correctamente, para depurar nuestro programa de posibles errores disponemos del programa SitePlayerPCDemo que ya habíamos visto anteriormente. Para ello abrimos la aplicación y hacemos clic en File->Open y seleccionamos el archivo Ejemplo1.SPB, después hacemos clic sobre Browser para que se nos habrá el navegador y podamos probar nuestra aplicación.

Nota: si intentamos abrir directamente las páginas WEB creadas con el navegador, no se mostrarán correctamente, ya que el navegador no sabrá interpretar los símbolos que son específicos y necesarios para el funcionamiento del servidor WEB del SitePlayer.

Cargando nuestra aplicación en el SitePlayer


Una vez probada nuestra aplicación en local solo nos queda transferir el archivo binario al SitePlayer, para ello abrimos de nuevo la aplicación SiteLinker pulsamos sobre Download->Download SitePlayer y descargamos el archivo Ejemplo1.SPB a la memoria Flash del Site player. Si todo ha ido bien podremos abrir el navegador y acceder a la página WEB a través de la IP que hayamos definido previamente en el archivo de definiciones.  

Aquí tenéis un vídeo de la aplicación funcionando.

 

 

© 2007-2017 AquiHayapuntes.com