0:00:01.668,0:00:04.905
Hola! Em dic Lloyd Hilaiel i estic treballant amb Marcio Galli a Mozilla Labs.

0:00:04.905,0:00:09.710
En aquest curt vídeo que hem compilat farem una ullada al projecte Chromeless.

0:00:09.710,0:00:13.547
Chromeless és un experiment que apunta a facilitar el jugar

0:00:13.547,0:00:16.917
amb noves idees al voltant de la interfície d'usuari en la web.

0:00:16.917,0:00:19.122
intenta incluir a més gent en la conversa

0:00:19.122,0:00:21.622
sobre com hauria de ser un programa de navegació web.

0:00:21.622,0:00:23.954
I de com hauria de funcionar

0:00:23.954,0:00:26.828
Tècnicament, Chromeless no és realment res de nou.

0:00:26.828,0:00:30.130
El que hem fet és agafar XULrunner, el temps d'ejecució de aplicació sobre

0:00:30.130,0:00:31.932
els quals Firefox i Thunderbird estàn construïts

0:00:31.932,0:00:34.735
i posar una prima capa d'abstracció per sobre.

0:00:34.735,0:00:37.804
La capa fa possible construir ràpidament un explorador web

0:00:37.804,0:00:42.509
fent servir tecnologies web com html, javascript i css.

0:00:42.509,0:00:45.412
Ara en Chromeless un senzill document html

0:00:45.412,0:00:48.588
defineix la interfície d'usuari de l'explorador mateix.

0:00:48.588,0:00:50.517
Per fer més fàcil la comunicació hem estat anomenant

0:00:50.517,0:00:54.152
el document html inicial "codi d'explorador".

0:00:54.152,0:00:57.457
Ara tal com altre contingut web normal pot integrar llocs i quadres flotants,

0:00:57.457,0:00:59.960
Aquest explorador també ho pot integrar

0:00:59.960,0:01:02.696
però té majors privilegis per a afectar i monitorejar

0:01:02.696,0:01:05.149
contingut dins aquest marc.

0:01:05.149,0:01:08.035
Aquest tema d'agafar conceptos web ja existents

0:01:08.035,0:01:10.237
i augmentar-los una mica

0:01:10.237,0:01:13.106
és la idea bàsica de Chromeless.

0:01:13.106,0:01:17.611
Ara, fem un recorregut per algunes de las cosas que pot fer.

0:01:17.611,0:01:20.080
El que estàs mirant ara és un explorador web[br][br]molt simple,

0:01:20.080,0:01:21.816
però funcional

0:01:21.816,0:01:24.584
Aquí pots veure html bàsic que genera un quadre

0:01:24.584,0:01:27.788
de text on pots introduir una url i un marc

0:01:27.788,0:01:30.157
on anar al contingut web.

0:01:30.157,0:01:32.395
Amb Chromeless és en realitat tot el codi que necessites

0:01:32.395,0:01:34.328
per construir un explorador.

0:01:34.328,0:01:35.596
Portem-lo una mica mes lluny.

0:01:35.596,0:01:38.403
I si volem deixar a l'usuari activar el mode a pantalla completa?

0:01:38.403,0:01:40.634
Expandir-se a pantalla completa és, òbviament, quelcom

0:01:40.634,0:01:42.903
que una pàgina web normal no pot fer.

0:01:42.903,0:01:45.247
Així que hem de obrir una nova API.

0:01:45.247,0:01:47.729
Dintre de Chromeless, el mode d'accedir a noves API's,

0:01:47.729,0:01:50.629
es fa mitjançant la funció "global require".

0:01:50.629,0:01:54.014
En aquest cas farem servir la "biblioteca misc".

0:01:54.014,0:01:55.931
El nom "misc" és només un contenidor

0:01:55.931,0:01:58.585
però exposa una funció de pantalla completa que podem usar

0:01:58.585,0:02:01.221
per canviar el mode de l'explorador.

0:02:01.221,0:02:03.638
Invocarà la funció dintre d'un manejador

0:02:03.638,0:02:05.336
de click de botó.

0:02:05.336,0:02:07.896
Amb 4 línies més de codi el nostre explorador ara te

0:02:07.896,0:02:10.931
un mode de pantalla completa funcional.

0:02:10.931,0:02:12.966
Així que a continuació intentarem alguna cosa una mica més lúdica

0:02:12.966,0:02:14.601
combinant un parell de noves ideas.

0:02:14.601,0:02:16.960
Primer, com mencionarem abans, el codi

0:02:16.960,0:02:21.241
té majors privilegis per a monitorejar el contingut web ejecutant-se en marcs.

0:02:21.241,0:02:24.878
Un exemple és el esdeveniment experimental "dom load"

0:02:24.878,0:02:28.682
que s'activa quan es carrega nou contingut en un marc.

0:02:28.682,0:02:31.418
L'altra ferramenta que usarem serà la biblioteca "dom shot"

0:02:31.418,0:02:34.788
la qual pot obtenir instantànies gràfiques d'un node "dom" específic.

0:02:34.788,0:02:37.391
El valor afegit per la funció és una url que

0:02:37.391,0:02:40.227
contenint dades d'imatge png integrades.

0:02:40.227,0:02:42.629
Ara Marcio combina les dues característiques i una mica de

0:02:42.629,0:02:44.624
jquery per construir aquest explorador de demostració.

0:02:44.624,0:02:48.072
Et deixa veure miniatures de pestanyes obertes,

0:02:48.072,0:02:50.938
amb un efecte d'ull de peix.

0:02:50.938,0:02:53.707
Esperem que això et permetrà comprendre molt bé

0:02:53.707,0:02:55.308
en què consisteix Chromeless.

0:02:55.308,0:02:56.844
Per saber més et recomanem

0:02:56.844,0:03:00.080
obtenir el codi des de github i començar amb el tutorial inclòs.

0:03:00.080,0:03:03.150
Mentre que algunes de les API's que hem mostrat aquí podrien haver canviat,

0:03:03.150,0:03:06.954
les idees bàsiques darrere Chromeless segur que no ho han fet.

0:03:06.954,0:03:08.989
Si tens idees sobre Chromeless, o t'agradaria

0:03:08.989,0:03:11.792
contribuir, pots unir-te a la batalla en els llocs usuals,

0:03:11.792,0:03:13.933
via IRC i a la nostra llista de distribució.

0:03:13.933,9:59:59.000
Gràcies per l'atenció.