1
00:00:02,669 --> 00:00:09,669
Bueno, pues voy a intentar explicar los tres programas que he hecho, que corresponden a las dos lámparas fáciles,

2
00:00:10,710 --> 00:00:17,070
una hecha desde un entorno de servidor web y otra con MQTT.

3
00:00:17,609 --> 00:00:27,570
Y luego he hecho un tercer programa en el que hago la primera lámpara, pero conectándola con, conectando el servidor web con MQTT.

4
00:00:27,570 --> 00:00:36,229
En el primer programa he incorporado alguna cosa de aquí como el deslizador para el brillo

5
00:00:36,229 --> 00:00:42,710
Aquí están los programas que corresponden al programa 5, 6 y 7

6
00:00:42,710 --> 00:00:45,289
Web MQTT y Web más MQTT

7
00:00:45,289 --> 00:00:50,310
Y antes empecé, hay otros porque empecé antes

8
00:00:50,310 --> 00:00:58,090
y el programa de la lámpara fácil con entorno web se parece mucho al que hicimos con el botón verde y rojo de encender y apagar

9
00:00:58,090 --> 00:01:02,530
entonces yo lo que hice fue hacer algo parecido a eso

10
00:01:02,530 --> 00:01:10,129
yo quería hacer esto, no empecé con esto, empecé con cuatro botones, verde, rojo, azul y blanco

11
00:01:10,129 --> 00:01:13,469
y lo que pasa es que quería que los botones

12
00:01:13,469 --> 00:01:20,489
no utilizar el servidor de Sin Dormir

13
00:01:20,489 --> 00:01:23,109
o sea, no quería utilizar iconos a partir de ahí

14
00:01:23,109 --> 00:01:28,469
sino que quería crear el sistema de archivos

15
00:01:28,469 --> 00:01:33,730
y que las imágenes estuvieran dentro del SP32

16
00:01:33,730 --> 00:01:39,049
entonces eso se hacía con una aplicación llamada Spips

17
00:01:39,049 --> 00:01:40,909
que crea una estructura

18
00:01:40,909 --> 00:01:43,650
entonces, bueno, estos son los dos primeros

19
00:01:43,650 --> 00:01:44,969
programas que hice, primero lo hice

20
00:01:44,969 --> 00:01:47,409
con archivos jpg

21
00:01:47,409 --> 00:01:49,390
para hacer eso hay que crear

22
00:01:49,390 --> 00:01:51,430
dentro de donde están

23
00:01:51,430 --> 00:01:53,349
los sketch

24
00:01:53,349 --> 00:01:54,989
hay que crear una carpeta data

25
00:01:54,989 --> 00:01:56,209
con las imágenes

26
00:01:56,209 --> 00:01:59,569
y bueno, pues yo lo intenté hacer y no me salía

27
00:01:59,569 --> 00:02:01,670
luego ya descubrí que los jpg

28
00:02:01,670 --> 00:02:05,290
son demasiado

29
00:02:05,290 --> 00:02:07,090
son demasiado pesados

30
00:02:07,090 --> 00:02:08,930
son como 400 kilobytes, tenía yo

31
00:02:08,930 --> 00:02:12,069
y lo intenté hacer con PNGs

32
00:02:12,069 --> 00:02:13,330
lo hice con GIMP

33
00:02:13,330 --> 00:02:15,229
los hice más pequeños

34
00:02:15,229 --> 00:02:18,270
pero tampoco me salió

35
00:02:18,270 --> 00:02:20,349
entonces no sé exactamente

36
00:02:20,349 --> 00:02:21,490
qué es lo que ha pasado

37
00:02:21,490 --> 00:02:23,310
porque no me ha salido

38
00:02:23,310 --> 00:02:27,770
sí que es verdad que hay veces que conectaba

39
00:02:27,770 --> 00:02:28,830
pero bueno

40
00:02:28,830 --> 00:02:31,849
me da la impresión de que eran

41
00:02:31,849 --> 00:02:33,370
temas de memoria

42
00:02:33,370 --> 00:02:34,650
a veces no reconocía el puerto

43
00:02:34,650 --> 00:02:37,449
eso se arreglaba conectando y desconectando

44
00:02:37,449 --> 00:02:40,169
pero yo creo que era un tema más bien de la gestión de la memoria

45
00:02:40,169 --> 00:02:43,909
por lo visto el SPIPS tiene un tamaño que se puede modificar

46
00:02:43,909 --> 00:02:47,250
pero bueno, yo no fui capaz

47
00:02:47,250 --> 00:02:53,330
otra de las cosas que descubrí es que el SPIPS necesita una herramienta

48
00:02:53,330 --> 00:02:55,490
que está aquí, la tuve que descomprimir, la bajé de Github

49
00:02:55,490 --> 00:03:03,629
es este ejecutable y no funcionaba con los arduino 2.0 o lo que fuera

50
00:03:03,629 --> 00:03:06,629
funcionaba con los arduino 1.0

51
00:03:06,629 --> 00:03:09,849
también me bajé el Arduino 1.8

52
00:03:09,849 --> 00:03:12,150
19 y en herramientas

53
00:03:12,150 --> 00:03:12,930
esto

54
00:03:12,930 --> 00:03:15,169
que no aparece en el 2.0

55
00:03:15,169 --> 00:03:16,469
es debido a que es ejecutable

56
00:03:16,469 --> 00:03:18,030
pero bueno, tampoco lo conseguí

57
00:03:18,030 --> 00:03:18,870
entonces resumiendo

58
00:03:18,870 --> 00:03:22,629
que estuve ahí un buen rato

59
00:03:22,629 --> 00:03:23,250
con eso

60
00:03:23,250 --> 00:03:25,889
y también intenté hacerlo

61
00:03:25,889 --> 00:03:28,710
de pasarlo a base 64 pero tampoco me funcionaba

62
00:03:28,710 --> 00:03:30,110
yo no sé si es que como toqué mucho

63
00:03:30,110 --> 00:03:31,870
el tema de la memoria flash

64
00:03:31,870 --> 00:03:34,370
a lo mejor dejé algo mal

65
00:03:34,370 --> 00:03:36,250
en la tarjeta, entonces me bajé un archivo

66
00:03:36,250 --> 00:03:38,610
que hacía borrado, pero bueno, lo dejé

67
00:03:38,610 --> 00:03:40,430
lo reseté y ya

68
00:03:40,430 --> 00:03:41,349
volví a

69
00:03:41,349 --> 00:03:44,370
bueno, a avanzar porque no había hecho nada

70
00:03:44,370 --> 00:03:46,330
llevaba un montón de tiempo y no había hecho nada todavía

71
00:03:46,330 --> 00:03:47,689
entonces bueno, pues

72
00:03:47,689 --> 00:03:50,650
el código como digo

73
00:03:50,650 --> 00:03:52,590
es muy parecido

74
00:03:52,590 --> 00:03:53,990
al que tuvimos, entonces

75
00:03:53,990 --> 00:03:56,590
pues nada, en las librerías necesarias

76
00:03:56,590 --> 00:03:57,750
y

77
00:03:57,750 --> 00:04:00,189
lo que hice fue, pues el server

78
00:04:00,189 --> 00:04:02,330
on este que creamos, pues como tenía

79
00:04:02,330 --> 00:04:03,710
cuatro botones yo en principio

80
00:04:03,710 --> 00:04:09,610
lo que hice fue crear cuatro funciones, cuatro páginas web

81
00:04:09,610 --> 00:04:15,650
y como había código común, utilicé una variable llamada neopixel

82
00:04:15,650 --> 00:04:20,889
que calculaba el brillo, a partir del brillo que yo quisiera darle

83
00:04:20,889 --> 00:04:24,910
que eso lo hice después con este deslizador

84
00:04:24,910 --> 00:04:28,889
entonces el deslizador lo que hace es, pasas de 0 a 127

85
00:04:28,889 --> 00:04:32,689
y ese 127, bueno, es con la regla de 3

86
00:04:32,689 --> 00:04:34,389
lo metí aquí, estos son variables

87
00:04:34,389 --> 00:04:35,910
tuve que poner unas variables

88
00:04:35,910 --> 00:04:38,329
globales, porque claro

89
00:04:38,329 --> 00:04:39,610
el programa como hace un bucle

90
00:04:39,610 --> 00:04:42,490
se me encendía, pero no me mantenía encendido

91
00:04:42,490 --> 00:04:44,050
el LED

92
00:04:44,050 --> 00:04:45,689
sino que se apagaba

93
00:04:45,689 --> 00:04:48,110
entonces tuve que jugar con unas variables internas

94
00:04:48,110 --> 00:04:49,930
en NeoPixel, RGB

95
00:04:49,930 --> 00:04:51,930
y RGBBB

96
00:04:51,930 --> 00:04:54,550
que están con la regla de 3 del brillo

97
00:04:54,550 --> 00:04:56,350
y bueno

98
00:04:56,350 --> 00:04:58,290
pues aquí están las funciones

99
00:04:58,290 --> 00:05:10,970
rojo, verde, azul, blanco, apagar y la de brillo. La de brillo utilizo la función map, quería yo meter el porcentaje, pero no he sido capaz de esta variable porcentaje de brillo

100
00:05:10,970 --> 00:05:25,009
sacarla de aquí y ponerla en la página web. Otra de las cosas que quería hacer yo era que al pulsar en la página web, si pulsaba verde, pues que se quedara verde,

101
00:05:25,009 --> 00:05:27,689
pero se queda solo el tiempo del primer

102
00:05:27,689 --> 00:05:30,149
del ciclo, lo que tarda en soltar

103
00:05:30,149 --> 00:05:31,750
en soltar el botón

104
00:05:31,750 --> 00:05:32,589
y eso

105
00:05:32,589 --> 00:05:35,589
bueno, pues tampoco

106
00:05:35,589 --> 00:05:38,149
fui capaz, ni con las variables

107
00:05:38,149 --> 00:05:39,790
ni con las variables globales

108
00:05:40,790 --> 00:05:41,110
y

109
00:05:41,110 --> 00:05:44,149
como lo hace la página web

110
00:05:44,149 --> 00:05:45,310
es con esto, que es

111
00:05:45,310 --> 00:05:46,930
un código de javascript

112
00:05:46,930 --> 00:05:48,449
¿dónde está?

113
00:05:51,079 --> 00:05:53,060
no, no, es que

114
00:05:53,060 --> 00:05:54,199
claro, aquí está el código

115
00:05:54,199 --> 00:05:55,839
aquí está la página web

116
00:05:55,839 --> 00:05:59,019
y la página web tiene aquí esto

117
00:05:59,019 --> 00:06:03,360
lo que hace es, bueno, esto lo he sacado de W3Schools

118
00:06:03,360 --> 00:06:05,279
igual que los estilos

119
00:06:05,279 --> 00:06:08,079
para darle formato

120
00:06:08,079 --> 00:06:13,600
y esto lo que hace es un Javascript que al hacer el evento onClick

121
00:06:13,600 --> 00:06:15,160
pues cambia el fondo

122
00:06:15,160 --> 00:06:19,060
lo que pasa es que como el programa está haciendo bucles con el loop

123
00:06:19,060 --> 00:06:21,779
pues lo pierdo

124
00:06:21,779 --> 00:06:24,920
entonces bueno, aquí tengo mis cuatro pestañas

125
00:06:24,920 --> 00:06:27,819
y a ver, vamos a probarlo

126
00:06:27,819 --> 00:06:29,939
entonces, bueno, pues verde

127
00:06:29,939 --> 00:06:32,579
rojo

128
00:06:32,579 --> 00:06:34,540
va descendiendo

129
00:06:34,540 --> 00:06:35,600
y los bits

130
00:06:35,600 --> 00:06:37,620
o sea, los LEDs van de uno en uno

131
00:06:37,620 --> 00:06:39,800
no he querido que fueran todos a la vez para que se notara

132
00:06:39,800 --> 00:06:41,720
el cambio, sobre todo, bueno, en color se nota

133
00:06:41,720 --> 00:06:43,639
perfectamente, pero sobre todo

134
00:06:43,639 --> 00:06:45,300
con el brillo

135
00:06:45,300 --> 00:06:47,899
entonces yo pongo azul y cambio el brillo

136
00:06:47,899 --> 00:06:51,319
al soltarlo se ve como va bajando

137
00:06:51,319 --> 00:06:53,899
aquí, bueno, está todo con 127

138
00:06:53,899 --> 00:06:55,420
en vez de 255

139
00:06:55,420 --> 00:06:57,180
por lo que nos dijo Jorge

140
00:06:57,180 --> 00:06:59,259
de que el neopixel es muy brillante

141
00:06:59,259 --> 00:07:02,079
aquí sí que se nota

142
00:07:02,079 --> 00:07:03,600
cuando yo lo bajo mucho

143
00:07:03,600 --> 00:07:05,779
pero por esta parte sigue siendo

144
00:07:05,779 --> 00:07:07,420
muy brillante

145
00:07:07,420 --> 00:07:09,459
lo puedo apagar poniendo el brillo a 0

146
00:07:09,459 --> 00:07:11,680
es una regla de 3, multiplica por 0

147
00:07:11,680 --> 00:07:14,800
o con el

148
00:07:14,800 --> 00:07:16,300
botón apagar

149
00:07:16,300 --> 00:07:17,899
y bueno pues

150
00:07:17,899 --> 00:07:19,220
en principio

151
00:07:19,220 --> 00:07:21,620
pues no tiene

152
00:07:21,620 --> 00:07:24,019
no tiene nada de especial

153
00:07:24,019 --> 00:07:26,540
lo más interesante

154
00:07:26,540 --> 00:07:28,600
aquí está el código del Spears

155
00:07:28,600 --> 00:07:30,639
que era el que creaba el sistema

156
00:07:30,639 --> 00:07:32,660
que lo he dejado de recuerdo

157
00:07:32,660 --> 00:07:34,779
y nada, lo más especial

158
00:07:34,779 --> 00:07:36,680
que hay aquí es lo de meter el brillo

159
00:07:36,680 --> 00:07:38,759
en la regla

160
00:07:38,759 --> 00:07:40,459
de tres y aquí

161
00:07:40,459 --> 00:07:42,339
el código de

162
00:07:42,339 --> 00:07:44,879
aquí están los botones

163
00:07:44,879 --> 00:07:46,579
los cuatro botones que están creados

164
00:07:46,579 --> 00:07:48,699
por página web y aquí está

165
00:07:48,699 --> 00:07:51,220
el código del deslizador

166
00:07:51,220 --> 00:07:59,040
en el bloque edit este

167
00:07:59,040 --> 00:08:00,360
el slider

168
00:08:00,360 --> 00:08:02,279
y bueno

169
00:08:02,279 --> 00:08:02,699
el

170
00:08:02,699 --> 00:08:07,939
el resto de

171
00:08:07,939 --> 00:08:10,600
bueno, aquí está

172
00:08:10,600 --> 00:08:12,019
el programa 6

173
00:08:12,019 --> 00:08:14,699
que corresponde al mqtt

174
00:08:14,699 --> 00:08:17,540
el código

175
00:08:17,540 --> 00:08:27,350
el código está aquí

176
00:08:27,350 --> 00:08:29,589
y no tiene nada de particular

177
00:08:29,589 --> 00:08:30,930
es un ejercicio que ya hicimos

178
00:08:30,930 --> 00:08:33,110
con el neopixel

179
00:08:33,110 --> 00:08:36,889
y bueno, yo he llamado emergencia y lo que hace es

180
00:08:36,889 --> 00:08:40,629
lo que quería era que fuera, que al pulsar el botón

181
00:08:40,629 --> 00:08:45,309
bueno, está conectado aquí al MQTT

182
00:08:45,309 --> 00:08:47,870
se ve aquí que está descargado

183
00:08:47,870 --> 00:08:55,090
y lo que hace es que al apretar el botón

184
00:08:55,090 --> 00:08:58,830
pues es una emergencia

185
00:08:58,830 --> 00:09:03,730
entonces durante un serie de pulsos

186
00:09:03,730 --> 00:09:05,870
pues va encendiendo y apagando

187
00:09:05,870 --> 00:09:09,169
yo quería que al pulsar el botón

188
00:09:09,169 --> 00:09:10,529
se pudiera apagar

189
00:09:10,529 --> 00:09:13,210
pero no lo he conseguido

190
00:09:13,210 --> 00:09:14,929
porque lo intenté

191
00:09:14,929 --> 00:09:17,250
lo intenté con un while

192
00:09:17,250 --> 00:09:18,669
pero claro, el while se queda

193
00:09:18,669 --> 00:09:21,090
es imposible

194
00:09:21,090 --> 00:09:23,169
entrar en él porque no cambia la condición

195
00:09:23,169 --> 00:09:24,210
y

196
00:09:24,210 --> 00:09:27,070
y bueno, pues con un bucle

197
00:09:27,070 --> 00:09:28,809
se lo fui capaz de que

198
00:09:28,809 --> 00:09:31,090
pulsara 5 o 6 veces y que

199
00:09:31,090 --> 00:09:33,350
y parara

200
00:09:33,350 --> 00:09:34,549
porque si no

201
00:09:34,549 --> 00:09:36,230
no era capaz de

202
00:09:36,230 --> 00:09:37,669
con una segunda pulsación

203
00:09:37,669 --> 00:09:39,210
tengo que verlo

204
00:09:39,210 --> 00:09:41,289
y el último programa

205
00:09:41,289 --> 00:09:45,429
el 7

206
00:09:45,429 --> 00:09:46,649
que es

207
00:09:46,649 --> 00:09:50,409
prácticamente es igual que

208
00:09:50,409 --> 00:09:52,690
el 1

209
00:09:52,690 --> 00:09:54,490
que el que he hecho

210
00:09:54,490 --> 00:09:55,330
con cliente web

211
00:09:55,330 --> 00:09:57,169
lo único que conecta

212
00:09:57,169 --> 00:09:59,309
el serveron

213
00:09:59,309 --> 00:10:00,690
lo que hace es

214
00:10:00,690 --> 00:10:02,509
en vez de ser comandos barra rojo

215
00:10:02,509 --> 00:10:03,769
y la función rojo

216
00:10:03,769 --> 00:10:04,950
tiene esto

217
00:10:04,950 --> 00:10:07,210
que es, se llama

218
00:10:07,210 --> 00:10:09,649
bueno lo he aprendido

219
00:10:09,649 --> 00:10:11,429
trasteando, que es una lambda

220
00:10:11,429 --> 00:10:13,789
que es una función que se define sobre la marcha

221
00:10:13,789 --> 00:10:15,490
esta función tiene rojo

222
00:10:15,490 --> 00:10:16,370
que era lo que tenía antes

223
00:10:16,370 --> 00:10:19,610
y una conexión con el cliente para ver

224
00:10:19,610 --> 00:10:21,509
para poder lanzarlo

225
00:10:21,509 --> 00:10:23,250
entonces si yo lo

226
00:10:23,250 --> 00:10:26,070
si yo lo ejecuto

227
00:10:26,070 --> 00:10:28,049
a través de la

228
00:10:28,049 --> 00:10:29,309
de la página web

229
00:10:29,309 --> 00:10:30,909
poner aquí también el

230
00:10:30,909 --> 00:10:39,480
si pulso verde

231
00:10:39,480 --> 00:10:40,799
se ve que se enciende

232
00:10:40,799 --> 00:10:42,259
pero además

233
00:10:42,259 --> 00:10:44,600
estoy enviando

234
00:10:44,600 --> 00:10:47,779
el topic de verde

235
00:10:47,779 --> 00:10:51,019
o el topic de rojo

236
00:10:51,019 --> 00:10:53,539
o el topic de azul

237
00:10:53,539 --> 00:10:55,559
y a la vez que va cambiando

238
00:10:55,559 --> 00:10:56,559
la pulsación

239
00:10:56,559 --> 00:10:58,519
con el brillo no he conseguido hacerlo

240
00:10:58,519 --> 00:11:00,080
es un poco más complicado

241
00:11:00,080 --> 00:11:02,299
porque hay que coger

242
00:11:02,299 --> 00:11:03,179
bueno

243
00:11:03,179 --> 00:11:07,659
hay que enviar este valor de alguna manera que no he sido capaz