-
Hallo, ik ben Lloyd Hilaiel met Marcio Galli in Mozilla Labs.
-
In deze korte video die we hebben gemaakt geven we je een overzicht van het Chromeless project.
-
Chromeless is een experiment dat zich er op richt het makkelijker te maken om te sleutelen
-
met nieuwe ideeën met betrekking tot het uiterlijk van de webbrowser.
-
Het probeert meer mensen te betrekken bij de discussie
-
over hoe web browsers eruit zouden moeten zien.
-
En hoe het zou moeten werken.
-
Technisch gezien is Chromeless niet echt nieuw.
-
We hebben XULrunner, de applicatie-runtime waar
-
Firefox en Thunderbird op gebouwd zijn, gepakt
-
en er een kleine laag software bovenop gedaan.
-
Deze laag maakt het mogelijk om snel een webbrowser te maken
-
met technologieën als HTML, javascript en CSS.
-
In Chromeless bepaalt een enkel HTML document
-
hoe het uiterlijk van de browser eruit ziet.
-
Om het wat makkelijker te maken noemen we
-
dit HTML document de 'browser code'.
-
Net zoals normale web-content andere sites en iframes kan insluiten
-
kan deze 'browser code' dat ook
-
maar het heeft meer rechten om de content
-
in dat iframe te bewerken en beheren.
-
Dit principe, het pakken van bestaande web-concepten
-
en ze een klein beetje aan te passen,
-
is het idee achter Chromeless.
-
Laten we eens kijken naar wat je kunt doen.
-
Waar je nu naar kijkt is een hele simpele,
-
maar werkende webbrowser.
-
Hier zie je eenvoudige HTML wat een invoerveld
-
maakt waar je een URL kan intypen en een iframe
-
waar deze web-content komt te staan.
-
Met Chromeless is dit echt alle code die je moet schrijven om
-
een browser te maken.
-
Laten we een stapje verder gaan.
-
Wat als we de gebruiker volledig-scherm modus willen laten gebruiken.
-
Uitbreiden naar volledig scherm is natuurlijk
-
iets wat een gemiddelde pagina niet kan doen.
-
Dus moeten we er een nieuwe API bij halen.
-
Binnen Chromeless is de algemene 'Require' functie
-
de manier om nieuwe API's te bereiken.
-
In dit geval hebben we de 'misc' library nodig.
-
De naam 'misc' is gewoon een tijdelijke aanduiding
-
maar het stelt een volledig - scherm functie bloot die we kunnen gebruiken
-
om de mode van de browser te activeren.
-
Het zal deze functie aanroepen in een knop,
-
klik-handler.
-
Met 4 extra regels code heeft onze browser nu
-
een functionele volledig-scherm mode.
-
Laten we nu iets meer speels proberen
-
waarbij we een paar nieuwe ideeën combineren.
-
Zoals we al eerder gezegd hebben, heeft de 'browser code'
-
meer voorrechten om de content in iframes te beheren.
-
Een voorbeeld hiervan is de experimentele 'dom load',
-
die wordt gebruikt als er nieuw content in een iframe wordt geladen.
-
De andere tool die we gaan gebruiken is de 'dom shot' library,
-
wat een grafische momentopname van een 'dom node' kan maken.
-
De teruggekeerde waarde van de functie is een data-URL die
-
ingesloten PNG afbeelding-data bevat.
-
Marcio heeft deze en een beetje
-
jquery gecombineerd om deze demonstratie browser te maken.
-
Het laat je thumbnails van geopende tabbladen zien,
-
met een fisheye effect.
-
Hopelijk geeft dit je een goed idee over
-
wat Chromeless nou eigenlijk is.
-
Om meer te leren raden we je aan
-
de code van github te halen en te beginnen met de bijgesloten handleiding.
-
Hoewel sommige API's die ik je heb laten zien misschien veranderd zijn,
-
zijn de basis ideeën achter Chromeless dat zeker niet.
-
Als je ideeën hebt over Chromeless, of zou willen
-
bijdragen, kan je je bij de groep aansluiten op de gebruikelijke plaatsen,
-
op IRC en onze mailing list.
-
Bedankt voor het kijken.
