0:00:01.668,0:00:04.905
Olá, eu sou o Lloyd Jilaiel, a trabalhar com o Marcio Galli na Mozilla Labs.

0:00:04.905,0:00:09.710
Nesta pequena apresentação, vamos dar-vos uma visão geral sobre o projecto Chromeless

0:00:09.710,0:00:13.547
Chromeless é uma experiência que pretende facilitar a materialização

0:00:13.547,0:00:16.917
de novas ideias sobre um interface web

0:00:16.917,0:00:19.122
Tenciona ser um ponto de contacto entre as pessoas,

0:00:19.122,0:00:21.622
acerca de como deve ser um software para browser

0:00:21.622,0:00:23.954
e como era suposto funcionar.

0:00:23.954,0:00:26.828
Tecnicamente Chromless não é realmente nada de novo.

0:00:26.828,0:00:30.130
O que nós fizemos foi tirar o XULrunner e o runtime da aplicação

0:00:30.130,0:00:31.932
no qual o Firefox e o Thunderbird assentam

0:00:31.932,0:00:34.735
e pôr uma fina camada de abstracção por cima.

0:00:34.735,0:00:37.804
o que permite construir rapidamete um browser web

0:00:37.804,0:00:42.509
usando tecnologias web como: html, javascript e css.

0:00:42.509,0:00:45.412
No Chromeless, um simples documento html,

0:00:45.412,0:00:48.588
define o interface de utilizador do próprio browser.

0:00:48.588,0:00:50.517
Para melhor entender , nós estivemos a chamar este

0:00:50.517,0:00:54.152
documento de html como se tratasse do codigo do browser.

0:00:54.152,0:00:57.457
Assim como qualquer conteúdo web pode embeber outros sites e iframes,

0:00:57.457,0:00:59.960
este código no browser também pode

0:00:59.960,0:01:02.696
mas tem maiores privilégios para afectar e monitorizar

0:01:02.696,0:01:05.149
o conteúdo desse iframe.

0:01:05.149,0:01:08.035
Este tema de extrair de conceitos web existentes

0:01:08.035,0:01:10.237
e aumenta-los apenas um pouco

0:01:10.237,0:01:13.106
é a ideia basica por detrás de Chromeless.

0:01:13.106,0:01:17.611
Agora, façamos uma pequena tour sobre algumas coisas que pode fazer.

0:01:17.611,0:01:20.080
O que estamos a ver é na verdade um browser bastante simples

0:01:20.080,0:01:21.816
mas funcional.

0:01:21.816,0:01:24.584
Eis um html básico que renderiza uma caixa de texto

0:01:24.584,0:01:27.788
onde poderás escrever uma URL e um iframe

0:01:27.788,0:01:30.157
que poderá albergar algum conteúdo.

0:01:30.157,0:01:32.395
Com o Chromeless o único codigo necessário

0:01:32.395,0:01:34.328
para construir um browser é este.

0:01:34.328,0:01:35.596
Vamos um pouco mais além.

0:01:35.596,0:01:38.403
E se quisessemos dar a opção de alternar o modo de fullscreen?

0:01:38.403,0:01:40.634
Expandir para fullscreen é algo que

0:01:40.634,0:01:42.903
qualquer pagina web pode fazer.

0:01:42.903,0:01:45.247
Então teremos de de ir buscar uma nova API

0:01:45.247,0:01:47.729
No Chromeless, o global require function

0:01:47.729,0:01:50.629
é a forma como aceder a novas APIs

0:01:50.629,0:01:54.014
Neste caso vamos necessitar da biblioteca "misc"

0:01:54.014,0:01:55.931
O nome "misc" é só um placeholder

0:01:55.931,0:01:58.585
mas expões uma função de ecrã inteiro, a qual podemos utilizar

0:01:58.585,0:02:01.221
para trocar o modo do browser

0:02:01.221,0:02:03.638
invoca esta função dentro de um botão,

0:02:03.638,0:02:05.336
click handler.

0:02:05.336,0:02:07.896
Com apenas mais 4 linhas de código, o nosso browser agora tem

0:02:07.896,0:02:10.931
um modo ecrã total funcional.

0:02:10.931,0:02:12.966
A seguir, vamos tentar algo um pouco mais divertido

0:02:12.966,0:02:14.601
combinando algumas ideias.

0:02:14.601,0:02:16.960
Antes de tudo, o código do browser tem

0:02:16.960,0:02:21.241
privilégios acrescidos pra monitorizar conteúdo web a correr em iframes.

0:02:21.241,0:02:24.878
Um exemplo típico é o evento experimental DOM load

0:02:24.878,0:02:28.682
que dispara quando novo conteúdo é carregado num iframe.

0:02:28.682,0:02:31.418
A outra ferramenta que vamos usar é a biblioteca de DOM shot

0:02:31.418,0:02:34.788
que pode tirar um instantâneo gráfico de um DOM node específico.

0:02:34.788,0:02:37.391
O valor retornado da função é uma data URL que

0:02:37.391,0:02:40.227
contém dados de imagem PNG embebida.

0:02:40.227,0:02:42.629
Agora Marcio combinou estas duas características e um pouco de

0:02:42.629,0:02:44.624
jquery pra construir este browser demonstrativo.

0:02:44.624,0:02:48.072
Deixa-nos ver thumbnails de tabs abertos,

0:02:48.072,0:02:50.938
com um efeito de olho-de-peixe.

0:02:50.938,0:02:53.707
Decerto isto já dá uma boa ideia

0:02:53.707,0:02:55.308
do que o Chromeless é.

0:02:55.308,0:02:56.844
Para aprender mais, recomendamos que vá

0:02:56.844,0:03:00.080
até ao Gihub e comece com o tutorial lá incluído.

0:03:00.080,0:03:03.150
Enquanto algumas das APIs que aqui mostrei. podem ter mudado

0:03:03.150,0:03:06.954
a ideia base por detrás do Chromeless, concerteza que não.

0:03:06.954,0:03:08.989
Se tiver algo a dizer acerca do Chromeless, ou se quiser

0:03:08.989,0:03:11.792
contribuir, junte-se nos locais habituais,

0:03:11.792,0:03:13.933
no IRC e na nossa mailing list.

0:03:13.933,9:59:59.000
OBrigado por assistir.