شیوه ساخت add-ons برای موزیلا

فایلهای اصلی

chrome.manifest

ورژن اخیر Firefox فایل ساده و متنی chrome.manifest (که در ورژن های قدیمی فایل گیج کننده contents.rdf بود) را برای تعیین اینکه package چه چیز هایی دارد و چه کارهایی می تواند انجام دهد، مورد استفاده قرار می دهد. ساختار این فایل در مقاله Chrome Registration توضیح داده شده است.

ما برای مثالمان یک فایل نمونه chrome.manifestکه حاوی ساختار دایرکتوری است ایجاد خواهیم کرد.
آن چیزی مانند این خواهد شد (به یاد داشته باشید که نام extension ما "helloworld" است):

کد:

content helloworld content/ overlay chrome://browser/content/browser.xul chrome://helloworld/content/overlay.xul locale helloworld en-US locale/en-US/ skin helloworld classic/1.0 skin/ style chrome://global/content/customizeToolbar.xul chrome://helloworld/skin/overlay.css</pre>
توضیح خطوط فایل:

خط1- نشاندهنده محل فایل ها است.
خط2- یک overlay را به chrome://browser/content/browser.xul منتصب می کند. این کار به شما این امکان را می دهد که در ظاهر پنجره اصلی firefox را با اضافه یا تغییر اجزا از طریق فایل overlay.xul تغییراتی ایجاد کنید.
خط4- زبان انگلیسی را به ثبت می رساند.
خط6- پوسته پیش فرض را معرفی می کند.
خط7- فایل استیل overlay.css را به chrome://global/content/customizeToolbar.xul منتصب می کند.(برای مطالعه مثالی از نحوه اضافه کردن کنترل به نوار ابزار به اینجا مراجعه کنید: creating toolbar buttons ). به جای استیل می توانید یک overlay را به ثبت برسانید که خود حاوی استیل است. برای تعریف استیل در overlay از دستورالعمل <?xml-stylesheet?> استفاده کنید.

هشدار: هرگز اسلش (/) پایانی مسیر ها را فراموش نکنید. "content/" به خوبی کار خواهد کرد ولی "content" دچار مشکل خواهد شد.
نکته: این فایل کمی متفاوت از فایلی است که در زمان ایجاد package یا همان فایل XPI مورد استفاده خواهد بود.

overlay.xul

این یک فایل ساده از نوع XUL می باشد. مطالب بیشتر را در مورد overlay ها در XUL Planet مطالعه کنید، البته آن مقاله کاربرد های مختلف overlay ها را هم توضیح می دهد.
یک overlay نمونه مانند زیر است:

کد:

<?xml version="1.0"?> <?xml-stylesheet href="chrome://helloworld/skin/overlay.css" type="text/css"?> <!DOCTYPE overlay SYSTEM "chrome://helloworld/locale/overlay.dtd"> <overlay id="helloworld-overlay" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <script src="overlay.js"/> <menupopup id="menu_ToolsPopup"> <menuitem id="helloworld-hello" label="&helloworld;" oncommand="HelloWorld.onMenuItemCommand(event);"/> </menupopup> </overlay></pre>
توضیح خطوط فایل:

خط1- این خط مربوط به تعریف XML است و ورژنی از Xml که مورد استفاده قرار خواهد گرفت را تعیین می کند. همچنین می توانید نوع encoding فایلتان را مشخص کنید که البته به ندرت استفاده خواهد شد.
خط2- این خط اختیاری است و جهت تعریف استیل مورد استفاده است.
خط3- این خط نیز اختیاری است، اما اگر برای زبانها مختلف فایل overlay.dtd را تعریف کرده اید این قسمت الزامی می شود. از این خط برای تعیین زبان استفاده کنید.
خط4-5- المنت اصلی را معرفی می کند. این باید یک المنت XUL باشد (<overlay>).
خط6- این خط اختیاری است و جهت اظافه کردن اسکریپت مورد استفاده است. قسمت بعدی را برای اطلاعات بیشتر مطالعه کنید.
خط8-10- یک آیتم منو را به منوی Tools در پنجره اصلی firefox اضافه می کند. برای اطلاعات بیشتر به این مقاله مراجعه کنید: Adding items to menus .

overlay.js

یک نکته مهم که باید بدانید این است که تمامی اسکریپت ها در هر صفحه اینترنتی که ایجاد می شود بارگذاری (load) خواهند شد (اسکریپت ها از طریق پنجره برنامه فقط برای خودش اجرا خواهند شد، اما اسکریپت ها برای هر صفحه توسط overlay ها بارگذاری خواهند شد ). این بدان معنی است که نام های متفاوتی و یکتایی را در تعریف های عمومی به کار برید تا از تداخل با سایر extension ها پرهیز کنید.
یک راه حل این است که تمام معرف های عمومی را با پسوندی از مخفف نام extension خودتان تغییر نام دهید یا با قرار دادن تمامی متغیر ها و توابع در یک آبجکت (object) با نامی یکتا و متفاوت، از تداخل جلوگیری کنید.
نمونه ای JavaScript برای یک overlay مانند زیر است:

کد:

var HelloWorld = { onLoad: function() { // initialization code this.initialized = true; }, onMenuItemCommand: function() { if(this.initialized) alert("Hi!"); } }; window.addEventListener("load", function(e) { HelloWorld.onLoad(e); }, false);</pre>

overlay.dtd

فایلهای DTD برای ایجاد XUL/XBL/XHTML و سایر انواع فایل XML برای تعیین زبانهای مختلف در شرکت Mozilla مورد استفاده است.

در حقیقت بجای استفاده از کدهای پیچیده و مشکل در فایل XUL خود ،از تگهای XML استفاده کنید.
این فایل به extension شما این اجازه را میدهد تا چند زبانه باشد. انتخاب زبان در زمان اجرا و توسط firefox انجام خواهد شد.

در فایل های DTD برای تعریف یک رشته مانند زیر عمل می کنیم:

کد:

<!ENTITY helloworld "Hello World!"></pre>