XUL-YMPÄRISTÖ JA MOZILLA FIREFOX -LAAJENNOSTEN KEHITTÄMINEN Tuomas Heittola Opinnäytetyö Toukokuu 2011 Ohjelmistotekniikan koulutusohjelma Tekniikan ja liikenteen ala 2 Tekijä(t) Julkaisun laji Päivämäärä HEITTOLA, Tuomas Opinnäytetyö 16.5.2011 Sivumäärä Julkaisun kieli 22 Suomi Luottamuksellisuus Verkkojulkaisulupa myönnetty ( ) saakka ( X ) Työn nimi XUL-YMPÄRISTÖ JA MOZILLA FIREFOX -LAAJENNOSTEN KEHITTÄMINEN Koulutusohjelma Ohjelmistoteniikka Työn ohjaaja(t) MIESKOLAINEN, Matti Toimeksiantaja(t) Tuomas Heittola Tiivistelmä Opinnäytetyössä tutkittiin XUL-ympäristöä ja sen käyttöä Mozilla Firefox -selaimen laajennosten tekemisessä. Tavoitteena oli kehittää Firefox-selaimeen laajennos, jolla pystyy helposti siirtämään kuvia internetsivuilta kuvapalvelimelle ja jakamaan linkkejä keskustelualueilla tai internetkeskusteluissa eli chateissa. Laajennoksen kehittämisen ohessa tutustuttiin tukeen, jota Mozilla antaa laajennosten kehittäjille. Ensimmäisenä tutustuttiin Firefox-selaimen laajennosten kehittämiseen. Laajennos kehitettiin ja julkaistiin. Laajennoksen kehittämisen jälkeen selvitettiin XUL-ympäristön tarkempi toiminnallisuus ja perusta. Opinnäytetyön tuloksena oli PhyreFile Transloader -laajennos Firefox-selaimeen ja suuntaa antava suunnitelma laajennoksen jatkokehitykselle. Laajennos julkaistiin vapaasti ladattavaksi Mozillan Add-ons sivustolle. Käyttäjien palaute laajennoksesta on ollut positiivista. Tuloksena syntyi myös XUL:n perusteitä käsittelevä tutkimus. Avainsanat (asiasanat) Mozilla Firefox, XUL, selain, laajennos Muut tiedot 3 Author(s) Type of publication Date HEITTOLA, Tuomas Bachelor's Thesis 16.5.2011 Pages Language 22 Finnish Confidential Permission for web publication ( ) Until ( X ) Title XUL-ENVIRONMENT AND DEVELOPMENT OF MOZILLA FIREFOX ADD-ONS Degree Programme Information and Communications Technology Tutor(s) MIESKOLAINEN, Matti Assigned by Tuomas Heittola Abstract XUL-environment and its usage with add-ons for Mozilla Firefox -browser was studied in this thesis. The goal was to develop an add-on that would help users to transfer images from web pages to an image hosting server and to help share links to the transferred images in internet forums and chat services. The support that Mozilla offers for add-on developers was also familiarized with during the development. The thesis started with studying how add-ons for Firefox are made. Then the add-on itself was developed and released. After the add-on was released the XUL-environment was studied more in- depth to find out how it works. The thesis was written with this information and experience in mind. The thesis produced an add-on called PhyreFile Transloader and a preliminary plan for continued development. The add-on was released on Mozilla's add-on site where it can be freely downloaded. The feedback from users has been positive. In addition to the add-on, the thesis also produced a study of the basic functionality of XUL. Keywords Mozilla Firefox, XUL, browser, add-on Miscellaneous 4 SISÄLTÖ 1 WEB-SELAINTEN LAAJENNOKSET JA TEKNOLOGIAT..............................................6 1.1 Web-selaimet ja laajennokset modernissa käyttötilanteessa....................................6 1.2 Kuvat Internetissä.....................................................................................................7 1.3 Yleistä XUL:stä...........................................................................................................7 1.4 Historia.....................................................................................................................7 1.5 Toimintaperiaate.......................................................................................................8 2 XUL OHJELMOINTI................................................................................................8 2.1 XUL ohjelmoinnin perusteet......................................................................................8 2.2 Yleisimmin käytettyjä elementtejä............................................................................9 2.3 Ulkoasun muokkaaminen CSS:llä.............................................................................10 2.4 Logiikan ohjelmointi................................................................................................11 3 MOZILLA FIREFOX -LAAJENNOSTEN KEHITTÄMINEN...........................................11 3.1 Mozilla Developer Network.....................................................................................11 3.2 Addons.mozilla.org eli AMO....................................................................................11 3.3 Jetpack eli Add-on SDK............................................................................................12 3.4 Laajennosten kehittäminen käytännössä................................................................12 3.5 Laajennoksen tiedostot ja hakemistorakenne.........................................................13 4 PHYREFILE TRANSLOADER..................................................................................14 4.1 Lähtökohdat............................................................................................................14 4.2 Käytettävät teknologiat ja palvelut.........................................................................15 4.3 Toiminnallisuuden vaatimukset..............................................................................15 4.4 Toiminnallisuus käytännössä...................................................................................16 4.5 Versiot.....................................................................................................................18 4.6 Palaute....................................................................................................................19 4.7 Jatkokehitys............................................................................................................19 5 5 LOPPUPÄÄTELMÄT.............................................................................................19 5.1 XUL-ympäristö ja laajennosten kehittäminen..........................................................19 5.2 Phyrefile Transloader..............................................................................................21 LÄHTEET...............................................................................................................22 KUVIOT KUVIO 1. PhyreFile Transloader-laajennoksen hakemistorakenne ja tiedostot..........14 KUVIO 2. Kuvan siirron aloitus......................................................................................16 KUVIO 3. Ilmoitus onnistuneesta kuvan siirrosta.........................................................17 KUVIO 4. PhyreFile Transloaderin historiatoiminto, jossa esikatselukuvat aiemmin siirretyille kuville...........................................................................................................17 KUVIO 5. PhyreFile Transloader -asetukset..................................................................18 KUVIO 6. W3Schools-sivuston käyttöjärjestelmät -tilastosta luotu kaavio..................20 6 1 WEB-SELAINTEN LAAJENNOKSET JA TEKNOLOGIAT Opinnäytetyössä tutkitaan XUL-ympäristön käyttöä yleisesti ja tarkemmin Mozilla Fi- refox-selaimen laajennoksien kehityksessä. Opinnäytetyön tuloksena oli saada katta- va kuvaus XUL-ympäristöstä ja luoda laajennos, joka helpottaa kuvien siirtämistä ku- vapalveluun ja niiden edelleen linkittämistä esim. Internet-keskusteluihin. Kyseisen tyyppiselle laajennokselle on tarvetta Internetissä, koska kuvien suora linkittäminen ei ole hyväksyttävä tapa. Suora linkittäminen käyttää palvelimen resursseja luvatta tästä syystä on parempi käyttää kuvien jakamiseen tarkoitettuja palvelimia. Myös ku- vien siirtämisen helpottaminen oli toivottua, jotta kynnys siirtämiseen olisi pienempi. XUL-ympäristö valittiin osaksi opinnäytetyön aihealuetta, koska se on olennainen teknologia Firefox-selaimen laajennoksien kehittämisessä. 1.1 Web-selaimet ja laajennokset modernissa käyttötilanteessa Web-selaimet ovat sovelluksia, jotka ovat tärkeässä asemassa nykymaailmassa. Inter- net on tärkeä kommunikaatioväline. Selaimien käyttäjiä on paljon ja useat käyttäjät haluavat muokata selaimensa ulkoasua ja toiminnallisuutta heille itselleen sopivaksi. Selaimen muokkausta varten lähes kaikki yleisesti käytetyt selaimet tukevat laajen- noksia. Näitä laajennoksia voi käyttäjä ladata tai tehdä itse. Laajennoksia on saatavil- la useisiin eri käyttötarkoituksiin. Mozilla (Frequently Asked Questions n.d.) jakaa laa- jennokset kuuteen eri pääkategoriaan: • Extensions: laajennokset, jotka lisäävät uusia tai muokkaavat selaimen toi- mintoja. • Themes: teemat, jotka muokkaavat selaimen ulkoasua suuressa määrin. • Personas: teemojen yksinkertaisempi muoto, jotka sisältävä vain taustakuvia selaimen käyttöliittymälle. • Search Providers: hakukoneita selaimen hakuun. 7 • Dictionaries & Language Packs: uusien kielten tuki selaimeen. • Plugins: tuki medioille esim. Adobe Flash. Selainten laajennosten kehitys riippuu käytetystä selaimesta. Mozilla Firefox-selai- men laajennosten kehityksessä käytetään XUL-ympäristöä. 1.2 Kuvat Internetissä Kuvia käytetään Internetissä joka paikassa. Nopeiden Internet-yhteyksien vuoksi si- vustot voivat sisältää runsaasti kuvia. Internet on nykyään erittäin sosiaalinen, joten omia ja muiden tekemiä kuvia jaetaan usein käyttäjien kesken. Kuvien suoraan linkit- täminen (hotlinking) muilta kuin käyttäjän omilta palvelimilta ei ole kuitenkaan suosi- teltavaa. Tämä vie palvelimen resursseja ja palvelimen