abclinuxu.cz AbcLinuxu.cz itbiz.cz ITBiz.cz HDmag.cz HDmag.cz abcprace.cz AbcPráce.cz
AbcLinuxu hledá autory!
Inzerujte na AbcPráce.cz od 950 Kč
Rozšířené hledání
×
včera 09:44 | Upozornění

Byly zveřejněny videozáznamy přednášek z konference LinuxDays 2019, která proběhla 5. a 6. října v Praze. Odkazy na videa společně s prezentacemi naleznete v programu, případně můžete jít rovnou na stránku video. Záznamy pořizovalo Audiovizuální centrum SiliconHill.

Petr Krčmář | Komentářů: 14
17.10. 18:55 | Nová verze

Bylo vydáno OpenBSD 6.6. Opět bez oficiální písně. Z novinek lze zmínit například sysupgrade(8).

Ladislav Hagara | Komentářů: 5
17.10. 08:36 | Nová verze

Vyšla nová verze monitorovacího řešení Centreon 19.10.0. Novinek je spousta (realtime API, podpora JIRA, vylepšený systém notifikací...), ale těmi nejdůležitějšími je pro mnohé uživatele podpora nové verze rrdtool 1.7.x a php 7.2. Systém tak půjde bez problémů provozovat na jiných distribucích než CentOS 7. Kompletní přehled novinek v seznamu změn. Předpřipravená appliance i samotné části jsou k dispozici na oficiálních stránkách.

Max | Komentářů: 0
17.10. 01:00 | Komunita

Dnes vyjde Ubuntu 19.10 s kódovým názvem Eoan Ermine. Přehled novinek v poznámkách k vydání. Ubuntu 20.04 LTS bude Focal Fossa.

Ladislav Hagara | Komentářů: 11
16.10. 22:11 | Zajímavý projekt

Padesátiny Unixu lze oslavit také hrou The Unix Game aneb na unixové roury pomocí Scratche.

Ladislav Hagara | Komentářů: 2
16.10. 21:44 | Komunita

Vývojáři svobodného 3D softwaru Blender oznámili, že nejnovějším firemním sponzorem Blenderu je společnost Adidas. Jedná se o úroveň Corporate Silver, tj. 12 tisíc eur ročně.

Ladislav Hagara | Komentářů: 16
16.10. 18:22 | Komunita

V září proběhla každoroční konference Akademy komunity KDE. Nyní jsou záznamy přednášek dostupné online. Témata se dotýkají aplikací a knihoven KDE, jejich adaptaci pro různá speciální použití (vestavěná zařízení či rozšířená realita) i obecně vývoje a distribuce softwaru.

Fluttershy, yay! | Komentářů: 0
16.10. 09:11 | Zajímavý článek

Mozilla.cz informuje o vylepšování vlastních about: stránek Firefoxu, konkrétně o odstraňování volání funkce eval() z těchto stránek. Tyto stránky mají přístup k interním součástem Firefoxu, ale protože jsou napsané v HTML a JavaScriptu, mohou být cílem podobných útoků jako webové stránky zobrazované v prohlížeči (např. vložení cizího kódu nebo obsahu), jen s potenciálně závažnějším dopadem. Pokud by se někomu skutečně povedlo kód do

… více »
Ladislav Hagara | Komentářů: 3
16.10. 08:55 | Zajímavý projekt

Uživatel GitHubu joeycastillo představil The Open Book Project, jehož cílem je vytvořit open-source čtečku elektronických knih. Projekt se zatím nachází v rané fázi vývoje, už nyní ale obsahuje použitelný návrh hardware prototypu „Feather Wing“, jehož cílem má být ověření konceptu na 4,2palcovém displeji. Tento koncept je postaven na kitu Adafruit Feather M4 Express, který ovládá hlavní desku s displeji a tlačítky. Po úspěšném ověření

… více »
Bystroushaak | Komentářů: 41
16.10. 05:00 | Nová verze

Byla vydána verze 5.0.0 svobodného systému pro detekci a prevenci průniků a monitorování bezpečnosti počítačových sítí Suricata (Wikipedie). Přehled novinek v oficiálním oznámení a v aktualizované dokumentaci.

Ladislav Hagara | Komentářů: 0
Kdy jste naposledy viděli počítač s připojeným běžícím CRT monitorem?
 (20%)
 (4%)
 (11%)
 (39%)
 (24%)
 (2%)
Celkem 420 hlasů
 Komentářů: 22, poslední 23.9. 08:36
Rozcestník

www.AutoDoc.Cz

Rozšírte si Firefox a Thunderbird - sami! - 3

15. 8. 2005 | Matej Gagyi | Programování | 8326×

Váš Firefox sa má dnes na čo tešiť! Napíšete pre neho prvé užitočné rozšírenie, urobíte prvé kroky k pochopeniu JavaScriptu a ak ste si dali námahu riešiť domácu úlohu z minulého dielu, možno si zapíšete do žiackej knižky jednotku.

Každý z nás sa už isto teší na nový tutoriál, pretože som sľúbil, že konečne bude užitočný. Na splnenie tejto úlohy je potrebný JavaScript, takže o ňom začneme malú debatu, ktorá bude mať ešte veľa pokračovaní.

LiveScript, JavaScript, JScript, ECMAScript

JavaScript prvotne vyvíjal Brendan Eich v Netscape Communications Corporation pod menom Mocha, neskôr LiveScript. Meno JavaScript získal v časoch, keď Netscape začleňoval do svojho prehliadača interpreter jazyka Java. JavaScript sa na svetlo sveta dostal v roku 1995 v prehliadači Netscape verzie 2.0B3.

Java a JavaScript sú pritom úplne odlišné jazyky. Zatiaľ čo Java je objektovo orientovaný jazyk, JavaScript je prototypový jazyk, podobný jazyku Self. Jediné, čo majú tieto jazyky spoločné, je podobná syntax, zdedená po jazyku C.

Spoločnosť Microsoft implementovala jazyk JScript, ktorý čiastočne pripomínal jazyk kompatibilný s JavaScriptom. Netscape nechala JavaScript štandardizovať organizáciou ECMA. Výsledkom bol ECMAScript (ECMA-262), ktorý zaručil svojim implementáciám (JavaScriptu a JScriptu) zdarnú budúcnosť.

JavaScript je zaujímavý jazyk, ktorý je neprávom opovrhovaný kvôli svojej nízkej rýchlosti a problémom, ktoré niekedy na internetových stránkach spôsobuje. O tom, že JavaScript nie je, ako sa hovorí "internetový jazyk", si porozprávame nabudúce.

Tutoriál

Tutoriál "Abc3" už obsahuje veľa kódu a do článku by sa nezmestil, preto si musíte stiahnúť súbor abc3tutorial.tar.bz2. Ešte pripomeniem, ako tento balík rozbaliť a nainštalovať:

$ tar -xjvf abc3tutorial.tar
$ cd abc3tutorial/
$ make

V adresári abc3tutoriál nám make vytvorí súbor abc3.xpi, ten otvorte cez Firefox a rozšírenie sa nainštaluje samo. Po inštalácii je potrebný reštart Firefoxu.

Čo to bude robiť?

Rozšírenie dnešného tutoriálu je jednoduchý nástroj užitočný pri navigácii na internete. Rozšírenie vytvorí ikonu pre nástrojovú lištu Firefoxu a nový bočný panel. Ikona na nástrojovom paneli otvára bočný panel, v ktorom sa objavia všetky odkazy na práve prezeranej stránke zoradené podľa abecedného poradia.

Priznám sa, že je to môj prvý bočný panel a chvíľu mi trvalo, kým som pochopil chybu, ktorú vypisuje konzola pre JavaScript. Po jej pochopení som bol dosť prekvapený, ako málo vlastne svoj prehliadač poznám.

Preto som sa rozhodol, dať vám ďalšiu domácu úlohu. Zadanie:

Objavte a pochopte, prípadne vyriešte chybu, ktorú rozšírenie vypisuje do konzoly JavaScriptu.

Riešenie bude základom nasledujúceho tutoriálu.

Ako to funguje?

Zanedbateľné zmeny nastaly v súboroch install.rdf. Pribudol adresár chrome/skin/classic/, do ktorého som premiestnil obrázky a CSS štýly a vytvoril som súborcontents.rdf.

Dôležité sú riadky, ktoré pribudli do súboru abc3overlay.xul. Pribudol nám súbor abc3sidebar.html, ktorý tvorí ľahkú kostru bočného panelu, a súbor abc3.js sa zmenil celý.

install.rdf

V súbore install.rdf sa zmenila položka em:id. Id, čiže identifikátor, má oddeliť rozšírenie od zvyšku sveta, a preto by malo mať jedinečnú hodnotu.

Jedinečné identifikátory ochotne generuje program uuidgen. Vždy, keď ho spustíte, s najvyššou pravdepodobnosťou vypíše taký reťazec, aký ešte nikdy nevypísal. Preto by ste ho nemali spúšťať často, lebo miniete všetky identifikátory sveta :)

Podľa konvencie by sme mali identifikátor vygenerovaný programom uuidgen obaliť do zložených zátvoriek '{' a '}':

$ uuidgen
32f222bc-8290-4cšb-b36c-3de248fa0ešd

Po nainštalovaní rozšírenia sa v profile už nevytvorí adresár abc3tutorial/, ale {32f222bc-8290-4cšb-b36c-3de248fa0ešd}/.

Pridal som nášmu rozšíreniu skin, vďaka ktorému bude vzhľad nášho rozšírenia flexibilnejší.

<em:skin>skin/classic/</em:skin>

contents.rdf

V tutoriáli z minulého dielu manažér nástrojového panelu nezobrazil ikonu nášho rozšírenia správne. Pridal som teda popis prekrytia okna manažéra nástrojového panelu naším CSS štýlom.

Firefox tentokrát všetko pochopí a ikona sa bude zobrazovať správne.

abc3overlay.xul

Teraz sa sústreďte, musíme si vysvetliť, ako funguje broadcaster.

Broadcaster je objekt, ktorý môžu iné objekty sledovať. Tieto objekty nazveme observermi. Objektom je v našom prípade každý XUL element.

Do elementu <broadcaster> môžete zapísať akékoľvek atribúty, ktoré budú jeho observery zdieľať. Pri zmene zdieľaného atribútu na jednom z observerov sa jeho hodnota prenesie na všetkých ostatných observerov.

Navyše broadcaster notifikuje všetkých observerov o zmene vyslaním udalosti. Náš broadcaster okrem zdielaných atribútov obsahuje aj informácie, ktoré potrebuje Firefox na otvorenie bočného panelu:

<broadcasterset id="mainBroadcasterSet">
  <broadcaster id="viewAbc3Sidebar"
   autoCheck="false"
   label="Abc3 - sumarizacia odkazov"
   type="checkbox"
   group="sidebar"
   sidebarurl="chrome://abc3/content/abc3sidebar.html"
   sidebartitle="Abc3 odkazy"
   oncommand="toggleSidebar('viewAbc3Sidebar');"/>
</broadcasterset>

Observermi som učinil položku v menu "View" a ikonu nástrojového panelu, ktorú sme v minulom diele vytvorili. Pridal som im atribút observes a jeho hodnotu nastavil na hodnotu atribútu id broadcastera:

<menupopup id="viewSidebarMenu">
  <menuitem observes="viewAbc3Sidebar"/>
</menupopup>

Kedže broadcaster zdieľa atribút oncommand a ten sa prenáša aj na položku v menu, aj na ikonu nástrojového panelu. Broadcaster je najlepšie použiť vždy, keď potrebujete zvýšiť znovupoužiteľnosť kódu a redukovať jeho neprehľadnosť.

abc3sidebar.html

Tento súbor je obyčajný prázdny HTML súbor, ktorý sa odkazuje na súbor s JavaScriptom abc3.js. Mohol som použiť aj XUL súbor, ale HTML je jednoduchšie. V jednoduchosti je krása.

Zvyšok o tomto súbore vysvetlím v spojení so súborom abc3.js.

abc3.js

V HTML súbore v elemente <body> nájdete atribút onload. Jeho hodnota je JavaScript, ktorý sa spustí hneď po načítaní stránky. V našom prípade sa odkazuje na funkciu init().

function init() {
  Abc3.showLinks();
}

Prototypový model ECMAScriptu

Aby som ukázal "pravú tvár JavaScriptu", vybral som si konkrétny súbor konvencií, pomocou ktorých demonštrujem jeho odlišnosti od objektovo orientovaných jazykov.

Pokúsim sa načrtnúť hranice štandardu a implementácie jazyka. Preto použijem názov ECMAScript všade tam, kde budem hovoriť o rysoch jazyka, nie o implementácii vo Firefoxe.

Ako prvý vytvorím objekt Abc3. ECMAScript nepozná triedy, len objekty.

Abc3 = new Object();

Objekt má bližšie nešpecifikovaný prototyp, ktorý sa počas chodu programu môže meniť. Prototyp je skupina všetkých premenných objektu, ku ktorým sa pristupuje pomocou notácie objekt.premenná, alebo objekt[kľúč].

Aj funkcie sú objekty. Vytvoríme teda jednu premennú objektu Abc3 a nastavíme ju ako funkciu:

Abc3.linkList = function() {
  this.linkAry = null;

  this.create = function(node) {
    var nodes = node.evaluate(".//a", node, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
    this.linkAry = new Array(nodes.snapshotLength);

    for(var i = 0; i < nodes.snapshotLength; i++) {
      var a = nodes.snapshotItem(i);
      this.linkAry[i] = new Object();
      this.linkAry[i].name = a.innerHTML;
      this.linkAry[i].url = a.href;
    }

    this.linkAry.sort(function(a, b) { return b.name - a.name; });
  }
}

Funkcia linkList() je konštruktor. To neznamená v ECMAScripte vlastne nič špeciálne. Konštruktor len vytvára premenné v špeciálnej premennej this. Ak zavoláte konštruktor z funkcie, ktorá patrí nejakému objektu A, premenná this je objekt A. Ak pred volanie konštruktoru vložíte slovo new, this je nový objekt.

Späť k tutoriálu

linkList() môžeme použiť na vytvorenie nového objektu, ktorý obsahuje premennú linkAry a funkciu create(). create() očakáva argument node a ten by mal byť reprezentácia XML elementu, pretože s ním tak narába.

Prvý riadok funkcie create() urobí XPath výber všetkých elementov <a> (odkazov) v XML podstrome premennej node. ďalej vytvorí pole, ktoré má rovnaký počet prvkov ako počet vybraných odkazov, a nakoniec do poľa vloží všetky vybrané odkazy, aby ich mohol zotriediť.

Posledná funkcia showLinks() vytvára obsah HTML stránky. Pretože sme v bočnom paneli, musíme k otvorenému dokumentu pristupovať cez objekt window.content.document. Práve prezeranú stránku predáme funkcii create(), ktorá vytvorí zoradené pole odkazov, a z neho vyskladáme HTML kód do reťazca.

Reťazec vložíme do HTML stránky v bočnom paneli priamo cez objekt document:

Abc3.showLinks = function() {
  var links = new Abc3.linkList();
  var doc = window.content.document;
  links.create(doc);
  var htmlStr = "<dl>";

  for(var i = 0; i < links.linkAry.length; i++) {
    var url = links.linkAry[i].url;
    var name= links.linkAry[i].name;
    htmlStr += "<dt><a style='color: #0000ff;' href='" + url + "'>" + name + "</a></dt>";
    htmlStr += "<dd style='font-family: monospace;'>" + url + "</dd>";
  }

  htmlStr += "</dl>";
  document.write(htmlStr);
}

Záver

Dnes sa mi sumarizácia píše nezvyčajne ťažko. Článok je aj nezvyčajne zložitý. Niet divu, pretože som za tému dňa zvolil JavaScript. Amatérskym dizajnérom internetových stránok nerobí žiadne problémy, ale skúsení programátori, ktorý sa snažia preniknúť do jeho tajov, majú z neho hlavu často v smútku.

Stretol som sa už aj z bizarnejšími jazykmi, ako napríklad Haskell, ale JavaScript u mňa stále zostáva na prvom mieste v originalite a použiteľnosti.

Záver záveru

Konečne máme prvé použiteľné rozšírenie a môžeme sa pustiť do ozajstnej práce. Rozobrali sme len najdôležitejšie časti tutoriálu, pretože sa stáva priveľkým.

Nabudúce by sme si už mali porozprávať o JavaScripte a o jeho prepojeniu s Firefoxom viac, preto tutoriál vynecháme. Najbližší diel série sa bude niesť v ľahšej, no o to príjemnejšej atmosfére. Dúfam, že sa naňho tešíte rovnako ako ja.

Nejčtenější články posledního měsíce

Windows 10 jen za 9,62 EUR a mnoho dalšího od Microsoftu!
Distribuční novinky 37-38/2019
VSHosting masivně rozšíří pozice pro budoucí linux administrátory

Nejkomentovanější články posledního měsíce

Cardano: promarněná příležitost, nebo blockchain budoucnosti?
Týden na ITbiz: Nahradí české absolventy import inženýrů z východu?
Jaderné noviny – přehled za září 2019
  všechny statistiky »

Seriál Rozšírte si Firefox a Thunderbird - sami! (dílů: 8)

Rozšírte si Firefox a Thunderbird - sami! (první díl)
<—« Rozšírte si Firefox a Thunderbird - sami! - II
»—> Rozšírte si Firefox a Thunderbird - sami! - 4 (JavaScript)
Rozšírte si Firefox a Thunderbird - sami! - 8 (Záver) (poslední díl)

Související články

Rozšírte si Firefox a Thunderbird - sami!
Rozšírte si Firefox a Thunderbird - sami! - II
Rozšírte si Firefox a Thunderbird - sami! - 4 (JavaScript)
Rozšírte si Firefox a Thunderbird - sami! - 5 (Nastavenia)
Rozšírte si Firefox a Thunderbird - sami! - 6 (Lokalizácia)
Rozšírte si Firefox a Thunderbird - sami! - 7 (XHTML)
Rozšírte si Firefox a Thunderbird - sami! - 8 (Záver)
Rozšiřte si Firefox!
Rozšiřte si Thunderbird!
Rozhovor s Pavlem Cvrčkem z týmu CZilla
Sunbird
Thunderbird I
Thunderbird II
Firefox
Liber Mozillae aneb tajemná Kniha Mozilly
Kde známé projekty ke svým jménům přišly...

Odkazy a zdroje

Extension Developer's Extension
Firefox Application Extensions
Extension development
Mozilla Update

Další články z této rubriky

LLVM a Clang – více než dobrá náhrada za GCC
Ze 4 s na 0,9 s – programovací jazyk Vala v praxi
Reverzujeme ovladače pro USB HID zařízení
Linux: systémové volání splice()
Programování v jazyce Vala - základní prvky jazyka
       

Hodnocení: 83 %

        špatnédobré        

Nástroje: Tisk bez diskuse

Tiskni Sdílej: Linkuj Jaggni to Vybrali.sme.sk Google Del.icio.us Facebook

Komentáře

Vložit další komentář

15.8.2005 08:20 petr_p
Rozbalit Rozbalit vše document.write()
Rad bych upozornil, ze pouziti funkce document.write() je ponekud nevhodne, protoze neni dopredne kompatibilni s XML DOM.

Je to tomu tak, protoze document.write() umoznuje vkladat libovolny kod, a tedy v pripade XML vytvorit non-wellformed dokument z dokumentu, ktery byl spravne utvoreny.

Proto byla funkce document.write() v XML modu zrusena a misto ni je nutne pouzvat metody vytvareni DOM uzlu. Ostatne tento novejsi pristup funguje i na klasicke HTML dokumenty. Navic v prave chystane verzi ECMAscriptu se pripravuji nove konstrukce, ktere by mely vyracne zjednodust praci s DOM stromem.
Yin avatar 15.8.2005 15:00 Yin | skóre: 39 | blog: Yinotopia | Slovesnko, Košice
Rozbalit Rozbalit vše Re: document.write()

Áno, viem... lenže document.write() pozná zatiaľ viac, ľudí a nechcel som článok veľmi predĺžiť. 5-ty diel bude už opravený.

4-tý diel o ECMAScripte budeme kecať a kecať, tak mi môžete prísť urobiť kritiku :)

Nikdy nie je tak zle, aby to jeden poharik nemohol ešte zhorsiť.
15.8.2005 11:22 Lukáš Zapletal | skóre: 42 | blog: lzapův svět | Olomouc
Rozbalit Rozbalit vše Znovu apeluji
Mohl by autor v příštích dílech udělat rozšíření, které by ve status baru zobrazovalo, jaký server podal daný dokument? Všechna doporučovaná rozšíření, která měla mít tuto funkčnost a byla mi zde doporučena, ji neměla.
Yin avatar 15.8.2005 14:55 Yin | skóre: 39 | blog: Yinotopia | Slovesnko, Košice
Rozbalit Rozbalit vše Re: Znovu apeluji
Vieme sa dohodnut, ze vyhladam informacie o tom, ako sa to robi a napisem neodladene rozsirenie. To je minimum, co stiham. kontakt ICQ: 320 670 287, Jabber: yin@jabber.sk (len vecer, fw), Mail: yin {aatt} atom {ddoott} sk
Nikdy nie je tak zle, aby to jeden poharik nemohol ešte zhorsiť.

Založit nové vláknoNahoru

ISSN 1214-1267   www.czech-server.cz
© 1999-2015 Nitemedia s. r. o. Všechna práva vyhrazena.