Why can't we play today…

2008 yazında Turkuvaz Holding ‘de yaptığım stajda, verilen bir görev için Firefox eklentisi nasıl yapılır onu incelemiştim. Öğrendiklerimi uygulamak içinde çok kolay bir eklenti yazmıştım.

Eklentinin yaptığı iş ise; EkşiSözlük, SesliSözlük ve TDKSözlük te arama yapması. Stajda istedikleri bu değildi tabiiki ama iyi bir öğretici oldu benim için. Ayrıca en çok kullandığım 3 sözlük için, hemen adres çubuğunun altında, işlerimi kolaylaştıran bir eklenti oldu. Yani söylemek istediğim, aslında bu eklentiyi kendi kişisel zevklerim için hazırladım ve yaklaşık 1 yıldır sürekli kullanıyorum.

Aslında bir Firefox eklentisi yapmak o kadarda zor değil. Bilinmesi gereken Mozilla Vakfının geliştirmiş olduğu XUL teknolojisi ve birazda Javascript bilgisi yeterli.

Birazda Bu eklentinin detaylarından bahsedeyim;

Öncelikle bu xpi dosyası bir zip arşivi. Bunu /SearchBar dizinine çıkardığımızdaki yapı şu şekilde;

$ tree SearchBar
|– chrome.manifest
|– content
|   |– EksiBar.js
|   |– EksiBar.xul
|   |– TDK.png
|   |– Thumbs.db
|   |– eksi.png
|   `– sesli.png
`– install.rdf

chrome.manifest ; Eklentiyi oluşturan dosyaların konumunu bildiren dosyadır.

content EksiBar content/
overlay chrome://browser/content/browser.xul chrome://EksiBar/content/EksiBar.xul

install.rdf ; Eklentiyle ilgili bilgileri içeren bir XML dosyasıdır (Install-Manifest).

<?xml version=”1.0″?><RDF xmlns=”http://www.w3.org/1999/02/22-rdf-syntax-ns#”     xmlns:em=”http://www.mozilla.org/2004/em-rdf#”><Description about=”urn:mozilla:install-manifest”>

<!– Required Items –>
<em:id>kaanozdincer{[at]}gmail.com</em:id>
<em:name>EksiBar</em:name>
<em:version>1.0</em:version>

<em:targetApplication>
<Description>
<em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id>
<em:minVersion>1.5</em:minVersion>
<em:maxVersion>3.0.*</em:maxVersion>
</Description>
</em:targetApplication>

<!– Optional Items –>
<em:creator>Kaan Ozdincer</em:creator>
<em:description>Eksi Sozluk Arama Tarama</em:description>
<em:homepageURL>http://kaan.ozdincer.com</em:homepageURL>
</Description></RDF>

EksiBar.xul ; Mozilla Vakfının geliştirmiş olduğu XUL biçimi (XML User Interface Language)

<?xml version=”1.0″?>
<overlay id=”Scrapper-Overlay”
xmlns=”http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul”>
<script type=”application/x-javascript” src=”chrome://EksiBar/content/EksiBar.js” />
<toolbox id=”navigator-toolbox”>
<toolbar id=”EksiBar” toolbarname=”EksiBar” >
<hbox align=”center”>
<label id=”EksiTitle” value=” “/>
<image src=”chrome://EksiBar/content/eksi.png” ondblclick=”EksiAnaSayfa(event)”/>
<label id=”EksiTitle2″ value=” “/>
<textbox id=”EksiQuery” cols=”1″ size=”20″ onkeypress=”if(event.which == 13) { EksiGet(event); }”/>
<toolbarbutton id=”Getir” label=”Getir” oncommand=”EksiGet(event)” />
<toolbarbutton id=”Ara” label=”Ara” oncommand=”EksiSearch(event)” />
</hbox>
<hbox align=”center”>
<label id=”SesliTitle” value=” “/>
<label id=”SesliTitle” value=” “/>
<image src=”chrome://EksiBar/content/sesli.png” ondblclick=”SesliAnaSayfa(event)”/>
<label id=”SesliTitle2″ value=” “/>
<textbox id=”SesliQuery” cols=”1″ size=”20″ onkeypress=”if(event.which == 13) { SesliGet(event); }”/>
<toolbarbutton id=”Getir” label=”Ara” oncommand=”SesliGet(event)” />
</hbox>
<hbox align=”center”>
<label id=”TDKTitle” value=” “/>
<label id=”TDKTitle” value=” “/>
<image src=”chrome://EksiBar/content/TDK.png” ondblclick=”TDKAnaSayfa(event)”/>
<label id=”TDKTitle2″ value=” “/>
<textbox id=”TDKQuery” cols=”1″ size=”20″ onkeypress=”if(event.which == 13) { TDKGet(event); }”/>
<toolbarbutton id=”Getir” label=”Ara” oncommand=”TDKGet(event)” />
</hbox>
</toolbar>
</toolbox>

</overlay>

EksiBar.js ; Olaylara göre tanımlanmış fonksyonlar barındıran bir Javascript dosyası.

function EksiGet(event){
var query = document.getElementById(”EksiQuery”).value;
window._content.document.location  = “http://sozluk.sourtimes.org/show.asp?t=” + encodeURI(query);
}
function EksiSearch(event){
var query = document.getElementById(”EksiQuery”).value;
window._content.document.location  = “http://sozluk.sourtimes.org/index.asp?a=sr&kw=” + encodeURI(query);
}
function EksiAnaSayfa(event){
gBrowser.selectedTab = gBrowser.addTab(”http://www.eksisozluk.com”);
}
function SesliGet(event){
var query = document.getElementById(”SesliQuery”).value;
window._content.document.location  = “http://www.seslisozluk.com/?word=” + encodeURI(query);
}
function SesliAnaSayfa(event){
gBrowser.selectedTab = gBrowser.addTab(”http://www.seslisozluk.com”);
}
function TDKGet(event){
var query = document.getElementById(”TDKQuery”).value;
window._content.document.location  = “http://tdk.org.tr/TR/SozBul.aspx?F6E10F8892433CFFAAF6AA849816B2EF4376734BED947CDE&Kelime=” + encodeURI(query);
}
function TDKAnaSayfa(event){
gBrowser.selectedTab = gBrowser.addTab(”http://www.tdksozluk.com/”);
}

SearchBar eklentisini buradan indirebilirsiniz…