-
Olá, eu sou o Lloyd Jilaiel, a trabalhar com o Marcio Galli na Mozilla Labs.
-
Nesta pequena apresentação, vamos dar-vos uma visão geral sobre o projecto Chromeless
-
Chromeless é uma experiência que pretende facilitar a materialização
-
de novas ideias sobre um interface web
-
Tenciona ser um ponto de contacto entre as pessoas,
-
acerca de como deve ser um software para browser
-
e como era suposto funcionar.
-
Tecnicamente Chromless não é realmente nada de novo.
-
O que nós fizemos foi tirar o XULrunner e o runtime da aplicação
-
no qual o Firefox e o Thunderbird assentam
-
e pôr uma fina camada de abstracção por cima.
-
o que permite construir rapidamete um browser web
-
usando tecnologias web como: html, javascript e css.
-
No Chromeless, um simples documento html,
-
define o interface de utilizador do próprio browser.
-
Para melhor entender , nós estivemos a chamar este
-
documento de html como se tratasse do codigo do browser.
-
Assim como qualquer conteúdo web pode embeber outros sites e iframes,
-
este código no browser também pode
-
mas tem maiores privilégios para afectar e monitorizar
-
o conteúdo desse iframe.
-
Este tema de extrair de conceitos web existentes
-
e aumenta-los apenas um pouco
-
é a ideia basica por detrás de Chromeless.
-
Agora, façamos uma pequena tour sobre algumas coisas que pode fazer.
-
O que estamos a ver é na verdade um browser bastante simples
-
mas funcional.
-
Eis um html básico que renderiza uma caixa de texto
-
onde poderás escrever uma URL e um iframe
-
que poderá albergar algum conteúdo.
-
Com o Chromeless o único codigo necessário
-
para construir um browser é este.
-
Vamos um pouco mais além.
-
E se quisessemos dar a opção de alternar o modo de fullscreen?
-
Expandir para fullscreen é algo que
-
qualquer pagina web pode fazer.
-
Então teremos de de ir buscar uma nova API
-
No Chromeless, o global require function
-
é a forma como aceder a novas APIs
-
Neste caso vamos necessitar da biblioteca "misc"
-
O nome "misc" é só um placeholder
-
mas expões uma função de ecrã inteiro, a qual podemos utilizar
-
para trocar o modo do browser
-
invoca esta função dentro de um botão,
-
click handler.
-
Com apenas mais 4 linhas de código, o nosso browser agora tem
-
um modo ecrã total funcional.
-
A seguir, vamos tentar algo um pouco mais divertido
-
combinando algumas ideias.
-
Antes de tudo, o código do browser tem
-
privilégios acrescidos pra monitorizar conteúdo web a correr em iframes.
-
Um exemplo típico é o evento experimental DOM load
-
que dispara quando novo conteúdo é carregado num iframe.
-
A outra ferramenta que vamos usar é a biblioteca de DOM shot
-
que pode tirar um instantâneo gráfico de um DOM node específico.
-
O valor retornado da função é uma data URL que
-
contém dados de imagem PNG embebida.
-
Agora Marcio combinou estas duas características e um pouco de
-
jquery pra construir este browser demonstrativo.
-
Deixa-nos ver thumbnails de tabs abertos,
-
com um efeito de olho-de-peixe.
-
Decerto isto já dá uma boa ideia
-
do que o Chromeless é.
-
Para aprender mais, recomendamos que vá
-
até ao Gihub e comece com o tutorial lá incluído.
-
Enquanto algumas das APIs que aqui mostrei. podem ter mudado
-
a ideia base por detrás do Chromeless, concerteza que não.
-
Se tiver algo a dizer acerca do Chromeless, ou se quiser
-
contribuir, junte-se nos locais habituais,
-
no IRC e na nossa mailing list.
-
OBrigado por assistir.