::usb PIC18f2550::interface html::

[pajaro]

Hola compañeros

ya marchan las grullas... ya viene el frio...

El propósito de este mensaje es comunicar un pic 18F2550 o 18F4550 por usb con el ordenador,

la idea es muy simple encender o apagar un led mediante el ordenador, la primera idea era hacerlo con QT y el modulo de puerto serie
la cosa esta chunga de momento gana el...no se deja meter mano..

La otra idea es sustituir el programa en  basic o Borland C o otro semejante por el de html, es decir mediante un html pulsar un botton y que se encienda el pin en el pic.

¿alguna idea de como hacer eso?

 controlar el pic mediante un html, es necesario eso del server web o el websocket?
sigo pegándome con el asunto..

un cordial saludo

[gera]

Buenas! Efectivamente, si querés controlar tu pic por web, vas a necesitar hacer un webserver. Los pic que mencionas no te van a servir. Necesitas uno con interfaz ethernet (podes usar la herramienta de selección de microchip para buscar un pic que te sirva). O bien utilizar un enc28j60 para dotar a tu pic de ethernet (hay muchos ejemplos de su uso en internet).
La otra opción, es usar una PC como servidor, enviar el comando vía html a la PC, y que ésta mande el comando por USB (o puerto serie) a tu pic. Pero no creo que se justifique tener toda una PC para esto.


Saludos!

[pajaro]

Hola Gera
Que tal...?

exprese mal la idea, la idea es usar el usb del pic18 pero en vez de usarlo con un programa hecho en basic o  Borland o Qt hacerlo en html
por ser mas fácil (o eso pienso yo) y de paso ver el código, con la primera idea era hacerlo con Qt pero de momento lo tengo en tablas.




sustituir esto por html:

Código: HTML

1. Option Explicit
2.  
3. Private Sub Caracter1_Click()
4.     If MSComm1.PortOpen = False Then
5.         MSComm1.PortOpen = True
6.     End If
7.     MSComm1.Output = "x"
8. End Sub
9.  
10. Private Sub Caracter2_Click()
11.     If MSComm1.PortOpen = False Then
12.         MSComm1.PortOpen = True
13.     End If
14.     MSComm1.Output = "a"
15. End Sub
16.  
17. Private Sub conectar_Click()
18. 'comprueva que el puerto este cerrado para poder abrirlo
19.     If MSComm1.PortOpen = False Then
20.         'determina el puerto que hemos seleccionado.
21.         If COM_sel.ListIndex = 0 Then
22.             MSComm1.CommPort = 1
23.             End If
24.         If COM_sel.ListIndex = 1 Then
25.             MSComm1.CommPort = 2
26.             End If
27.         If COM_sel.ListIndex = 2 Then
28.             MSComm1.CommPort = 3
29.             End If
30.         If COM_sel.ListIndex = 3 Then
31.             MSComm1.CommPort = 4
32.             End If
33.         If COM_sel.ListIndex = 4 Then
34.             MSComm1.CommPort = 5
35.             End If
36.         If COM_sel.ListIndex = 5 Then
37.             MSComm1.CommPort = 6
38.             End If
39.         If COM_sel.ListIndex = 6 Then
40.             MSComm1.CommPort = 7
41.             End If
42.         If COM_sel.ListIndex = 7 Then
43.             MSComm1.CommPort = 8
44.             End If
45.         If COM_sel.ListIndex = 8 Then
46.             MSComm1.CommPort = 9
47.             End If
48.         If COM_sel.ListIndex = 9 Then
49.             MSComm1.CommPort = 10
50.             End If
51.         If COM_sel.ListIndex = 10 Then
52.             MSComm1.CommPort = 11
53.             End If
54.             End If
55.            
56. MSComm1.OutBufferSize = 1 'tamaño del dato a transmitir.
57.     MSComm1.InBufferSize = 23
58.     MSComm1.InputMode = comInputModeText 'los datos se recuperan en modo texto.
59.     MSComm1.InputLen = 23  ' Buffer de entrada.
60.     MSComm1.PortOpen = True
61.     MSComm1.RThreshold = 23 'son 23 caracteres.
62. End Sub
63.  
64. Private Sub Form_Load()
65. COM_sel.AddItem "COM1"
66. COM_sel.AddItem "COM2"
67. COM_sel.AddItem "COM3"
68. COM_sel.AddItem "COM4"
69. COM_sel.AddItem "COM5"
70. COM_sel.AddItem "COM6"
71. COM_sel.AddItem "COM7"
72. COM_sel.AddItem "COM8"
73. COM_sel.AddItem "COM9"
74. COM_sel.AddItem "COM10"
75. COM_sel.AddItem "COM11"
76. End Sub
77.  
78. Private Sub Form_Unload(Cancel As Integer)
79. If MSComm1.PortOpen = True Then
80.     MSComm1.PortOpen = False
81. End If
82. End Sub
83.  
84. Private Sub MSComm1_OnComm()
85. Dim InBuff As String
86. Select Case MSComm1.CommEvent
87.     Case comEvReceive
88.     InBuff = MSComm1.Input
89.     Debug.Print InBuff
90.     Texto.Text = ""
91.     Texto.Text = Left$(InBuff, 23)  ' se recorta los caracteres basura
92.     MSComm1.PortOpen = False  'cierra el puerto y vacia el buffer
93. End Select
94. End Sub

luego pongo la interface:

en el post 4 de este mismo hilo.



he mirado la opción de cdc : por lo que he leido emula el usb como puerto serie:

enlaces:
con QT;
http://www.disca.upv.es/aperles/qt/port_serie_Qt/port_serie_Qt.html

con html
http://solocodigo.com/36198/enviar-y-recibir-por-el-puerto-serie/

low level
http://www.rastersoft.com/articulo/pserie.html

pic usb qt ejemplo:
http://www.aquihayapuntes.com/indice-practicas-pic-en-c/comunicacion-usb-pic-con-hid.html

comunicación WEB-PIC mediante Websocket HTML5, nodejs y serproxy

explicacion websocket

**Lo del ethernet también lo tengo pendiente pero ese para mas adelante..

[KILLERJC]

HTML solo no vas a poder..
Vas a tener que usar alguna otra cosa, como PHP, o haciendo un CGI en python, JS(no se si se puede, ya que esto se ejecutaria del lado del cliente, implicando una falla importante de seguridad), no se.. hay varias opciones.


Lo que dice gera es tener la pagina en el microcontrolador, conectarse al mismo via ethernet y que muestre una pagina web.

Aqui migsantiago da un ejemplo y el codigo que iria en el PIC, e incluye el driver para usarlo como un puerto serie virtual CDC, asi te comunicas con ese puerto.
http://www.todopic.com.ar/foros/index.php?topic=43661.0

Ya con esos tendrias todo lo del PIC via USB y el puerto como serie, solo quedaria hacer el programa en la PC,

[pajaro]

Hola KillerJR

pero la idea no es utilizar ethernet sino usb,
y la parte de la gráfica que hacen en visual Basic o C# o Qt lo quiero implementar en html o html5

el programa para el pc en html ...

por ejemplo: apago led desde boton html y en la protoboar se apaga.

en html seria algo asi, pero con javascrip ..

Código: HTML

1. <html>
2. <head>
3. <title> PIC18F</title>
4. </head>
5.  
6. <body>
7. <table border="1">
8. <tr>
9. <td align="center">
10. <input type="button" name="pin01" value="PA01"><input type="button" name="pin01" value="1"><input type="button" name="pin01" value="01"><br>
11. <input type="button" name="pin02" value="PA02"><input type="button" name="pin01" value="1"><input type="button" name="pin01" value="02"><br>
12. <input type="button" name="pin03" value="PA03"><input type="button" name="pin01" value="1"><input type="button" name="pin01" value="03"><br>
13. <input type="button" name="pin04" value="PA04"><input type="button" name="pin01" value="1"><input type="button" name="pin01" value="04"><br>
14. <input type="button" name="pin05" value="PA05"><input type="button" name="pin01" value="1"><input type="button" name="pin01" value="05"><br>
15. <input type="button" name="pin06" value="PA06"><input type="button" name="pin01" value="1"><input type="button" name="pin01" value="06"><br>
16. <input type="button" name="pin07" value="PA07"><input type="button" name="pin01" value="1"><input type="button" name="pin01" value="07"><br>
17. <input type="button" name="pin08" value="PA08"><input type="button" name="pin01" value="1"><input type="button" name="pin01" value="08"><br>
18. <input type="button" name="pin09" value="PB09"><input type="button" name="pin01" value="1"><input type="button" name="pin01" value="09"><br>
19. <input type="button" name="pin10" value="PB10"><input type="button" name="pin01" value="1"><input type="button" name="pin01" value="10"><br>
20. <input type="button" name="pin11" value="PB11"><input type="button" name="pin01" value="1"><input type="button" name="pin01" value="11"><br>
21. <input type="button" name="pin12" value="PB12"><input type="button" name="pin01" value="1"><input type="button" name="pin01" value="12"><br>
22. <input type="button" name="pin12" value="PB13"><input type="button" name="pin01" value="1"><input type="button" name="pin01" value="13"><br>
23. <input type="button" name="pin12" value="PB14"><input type="button" name="pin01" value="1"><input type="button" name="pin01" value="14"><br>
24. </td>
25. <td>
26. PIC18F2550
27. </td>
28. <td align="center">
29. <input type="button" name="pin01" value="28"><input type="button" name="pin01" value="1"><input type="button" name="pin01" value="PA01"><br>
30. <input type="button" name="pin01" value="27"><input type="button" name="pin01" value="1"><input type="button" name="pin02" value="PA02"><br>
31. <input type="button" name="pin01" value="26"><input type="button" name="pin01" value="1"><input type="button" name="pin03" value="PA03"><br>
32. <input type="button" name="pin01" value="25"><input type="button" name="pin01" value="1"><input type="button" name="pin04" value="PA04"><br>
33. <input type="button" name="pin01" value="24"><input type="button" name="pin01" value="1"><input type="button" name="pin05" value="PA05"><br>
34. <input type="button" name="pin01" value="23"><input type="button" name="pin01" value="1"><input type="button" name="pin06" value="PA06"><br>
35. <input type="button" name="pin01" value="22"><input type="button" name="pin01" value="1"><input type="button" name="pin07" value="PA07"><br>
36. <input type="button" name="pin01" value="21"><input type="button" name="pin01" value="1"><input type="button" name="pin08" value="PA08"><br>
37. <input type="button" name="pin01" value="20"><input type="button" name="pin01" value="1"><input type="button" name="pin09" value="PB09"><br>
38. <input type="button" name="pin01" value="19"><input type="button" name="pin01" value="1"><input type="button" name="pin10" value="PB10"><br>
39. <input type="button" name="pin01" value="18"><input type="button" name="pin01" value="1"><input type="button" name="pin11" value="PB11"><br>
40. <input type="button" name="pin01" value="17"><input type="button" name="pin01" value="1"><input type="button" name="pin12" value="PB12"><br>
41. <input type="button" name="pin01" value="16"><input type="button" name="pin01" value="1"><input type="button" name="pin12" value="PB13"><br>
42. <input type="button" name="pin01" value="15"><input type="button" name="pin01" value="1"><input type="button" name="pin12" value="PB14"><br>
43. </td>
44. </tr>
45.  
46.  
47. </body>
48.  
49.  
50. </html>

[PalitroqueZ]

también está la opción de usar basic o C++ y usar alguna libreria socket (o winsocket en vb) y mediante una conexión UDP o TCP puedas controlar un led, sin escribir una sola línea de html

[KILLERJC]

Te entendi, el tema es que HTML solo no vas a poder, y JS a no ser que uses Node.js no vas a poder. Ya que JS se ejecuta del lado del cliente y tiene limitaciones.

Sino imaginate un simple codigo javascript que se ponga a husmear en tus archivos, o se ponga a jugar con tu puerto USB o serie/paralelo, seria caotico, entras a una pagina y se pone a imprimir cualquier cosa... ( un ejemplo )

Pero basicamente estarias programando en Node.js , PHP, python, ASP.NET, JAVA, etc. HTML solo es un lenguaje de marcas, no podes ejecutar nada con eso. Cuando entras a esa pagina, el lenguaje que uses abrira el puerto y se comunicaran con el dispositivo y a cambio te mostrara segun el estado de las salidas distinto codigo html.

Para hacerlo facil, el html le da el formato, el contenido esta manejado por el lenguaje de programacion. De ahi tenes que elegir, solo HTML + JS no vas a poder hacer las cosas,

aunque encontre esto: https://github.com/billhsu/jUART
De todas formas tenes que "instalar" un plugin, pero eso lleva al mismo problema de siempre... Tener algo que instalar.

O esto:
https://developer.chrome.com/apps/app_serial
http://www.fabiobiondi.com/blog/2014/02/html5-chrome-packaged-apps-and-arduino-bidirectional-communication-via-serial/

Pero no es una pagina HTML como imagino que vos queres y termina siendo una aplicacion visual de lo que verias con otros lenguajes.

también está la opción de usar basic o C++ y usar alguna libreria socket (o winsocket en vb) y mediante una conexión UDP o TCP puedas controlar un led, sin escribir una sola línea de html

Pero no estas entendiendo lo que el quiere hacer, el quiere mostrarlo en HTML / HTML5 asi puede abrirlo desde cualquier navegador (Puee hacer la parte visual con cualquier lenguaje, pero quiere mostrarlo en HTML). Aunque si o si va a tener un programa atras, ejemplo apache/php ( apache para el web server y php hace las llamadas a el puerto serial, el mismo php cuando lo abris desde el navegador se conecta y segun el estado de las salidas pones tu codigo html que quieras ).

Si no te gusta el tema de recargar la pagina para que se actualizen los datos o enviar datos nuevos. Utilizas AJAX , seria algo asi: Un codigo JS (inmmerso en un HTML) le pide los datos a un php aparte no vinculado a la pagina, ese codigo hace sus cosas y le devuelve al codigo JS ciertos valores, el cual actualiza el estado de los botones o lo que tengas en la pagina HTML sin recargar la pagina. Creo que es lo que mas se aproxima a lo que el quiere. Y por mi con JS y HTML solo no va a poder.

[gera]

Bien, entiendo lo que querés hacer, pero la verdad no tengo idea si es posible hacerlo ni cómo. Se puede acceder a un puerto USB desde un navegador de internet?
Si querés hacer una interfaz gráfica sin mucho esfuerzo, yo te recomendaría usar visual basic, java o processing. Estos son los lenguajes que yo manejo, pero no sé con qué estarás más familiarizado vos.
Saludos.

[KILLERJC]

Se puede acceder a un puerto USB desde un navegador de internet?

Si es de forma serial:
http://stackoverflow.com/questions/16496259/arduino-and-php-via-serial-incomingbyte-read

Parecido a lo que expuse en el ultimo parrafo de mi anterior post, nomas que sin JS ( AJAX ) resultando en cada vez que presionas la tecla se recarga la pagina.
Lo que si, para que funcione .php/.cgi un siempre un WebServer tenes que tener, apache es el mas conocido, vienen paquetes con apache + php + mysql como Wamp entre otros.
Pero hacer todo esto para una pagina es el quien decide, si quiere ponerse a aprender JS / php / o el lenguaje que sea para mostrarlo en html. Sino optar por un lenguaje como todos le dijeron.
Por que al fin es solamente eso, es cambiar la parte grafica.

[pajaro]

PalitroqueZ  que tal?

la primera idea que tenia era usar el Qt con eso que es multiplataforma,
me anime a empezar con él, ademas admite ser programado en C++
pero cuando empece con la grafica, vi que le faltaban recursos, por ejemplo
shapes, y otras cosas.

He intentado hacer una pequeña interface grafica con qt para interactual con el pic
mediante el pc u otro dispositivo "inteligente", lo del qt lo tengo aun en pañales, estoy empezando...
lo de las clases es como en otros lenguajes, y lo de la gráfica mas de lo mismo, pero estoy en fase de conocimineto en QT


me mire  lo de manipular el puerto serie, pero cuando vi como se complicaba
ufff... busque otra alternativa.. lo del html...me parecio mas sencillo, html o php no me asusta ya los he visto...

pero no quería montar un servidor, pero como dice el compañeros KILLERJC
esta vez no me libro de montarlo....

Compañeros la idea era montarlo en algo que me fuera sencillo y que pudiera cacharrear, manipular, y experimentar
probar como funciona .....y jugar con ello.....y hacer mas cosas...
pero una vez mas los inicios siempre cuestan un poco.....

Compañero KILLERJC
he visto tus enlaces

http://stackoverflow.com/questions/16496259/arduino-and-php-via-serial-incomingbyte-read

http://www.fabiobiondi.com/blog/2014/02/html5-chrome-packaged-apps-and-arduino-bidirectional-communication-via-serial/

parecen muy rico, los voy a mirar con mas detenimiento, parecen funcionales.
muy buen aporte... si señor muy bueno...es algo a tener en cuenta. pero entiendo que también necesitan de servidor....
los voy a analizar ....

Compañero Gera java lo e visto y no me termina de gustar es muy pesado, visual basic tambien lo he visto y hice algunas cosas chulas
pero el C y el C++ simpre me gusto mas y siempre termino volviendo a el, por eso elegi el QT, admite C++ y dicen que es multiplataforma, eso aun estoy por verlo.
Vos que me recomienda, me gustaría hace la aplicación y me sirviera tanto para el windows como para linux, linux cada dia me gusta mas,
y por que no si funciona en android ya preparo una fiesta...

no se... o lo hago con qt la interface gráfica y me olvido del servidor o
lo hago con html , php y alguna otra cosa y le tengo que hacer con el servidor...

voy a evaluar pros y contras
que harían ustedes

alguna recomendación....?

[Picuino]

En la parte del PIC, lo más sencillo es comunicarle por medio de alguna librería USB - RS232 o por medio del protocolo HID.
Más sencillo aún es sacar el interface USB del micro. Por ejemplo utilizando un conversor USB - RS232 (en ebay los tienes por 1 euro) y así sacas del micro toda la lógica USB. Con esta solución no puedes utilizar el interface HID

Otra alternativa es utilizar un módulo Bluetooth (funciona como un puerto COM en el PC y como un interface USART en el microcontrolador).


En la parte del PC ¿Por qué te resulta tan complicado comunicarte con un puerto RS232 (puerto COM)?
No debería ser complicado en la mayoría de los lenguajes.


En el caso de optar por comunicación por Ethernet, necesitas un micro que tenga esa opción o un módulo que te sirva de interface.
Tienes varias opciones, ethernet por cable o módulos wifi.
Esta creo que es la solución más compleja y cara. Como parte positiva, con esta comunicación puedes controlar el pic desde cualquier sitio conectado a internet, no sólo desde el PC que está al lado del microcontrolador.

Saludos.

[pajaro]

Picuino que tal?

tu en esto estarás puesto seguro....
 ahora que lo sacas relucir ....
algún conocido pic con, ethernet, wifi, usb y comunicacion serie ?

de los mas conocidos...

por cierto esto del usb veo que tiene limite de dispositivos, imagino que tambien tendra de recursos de corriente...

investigando sigo..

[Picuino]

Hola pajaro.
No conozco demasiado del tema. Sobre todo conozco los módulos para acoplar al PIC.

Si lo que quieres es sólo encender un led desde el ordenador, te recomiendo la solución más simple:
Un módulo USB - RS232 nivel TTL. Lo conectas por un lado al USB del ordenador. Por el otro a las patillas RX y TX del micro y a tirar. La programación en ambos lados es muy facil.
En el PC sólo necesitas un driver para el módulo USB y un emulador de terminal que se conecte al puerto COM, con el que vas a enviar los comandos.
En el PIC sólo necesitas enviar y recibir datos por la UART.
Todo muy sencillo.


Un módulo Bluetooth funciona igual, pero se conecta de forma inalámbrica.


Si te quieres complicar con un PIC que realice la comunicación, aquí puedes seleccionar uno:
http://www.microchip.com/ParamChartSearch/chart.aspx?branchID=1005


Saludos.

[jhozate]

como entiendo yo, la intención de pajaro es encontrar alguna plataforma de desarrollo en la que se codifique en HTML y se maneje el puerto serial en ese lenguaje. Los link que ha puesto KILLERJC quizá sea lo mas parecido a lo que busca pajaro.

[Picuino]

Con arduino es sencillo y barato (unos 20 euros placa UNO + ethernet shield)

El arduino + shield actúan como servidor html que puede servirte páginas interactivas (igual que cuando te conectas al router para configurarlo)

En el lado del PC sólo necesitas un navegador y conectar PC y el Arduino al mismo switch o router.

Aquí lo explican:
http://diymakers.es/crear-servidor-web-con-arduino

Saludos.