SalarSoft
دوشنبه 11 مهر 1384, 10:18 صبح
این مقاله مراحل ساختextensions را به طور مقدماتی توضیح می دهد. در دو قسمت آخر نکاتی در این مورد بحث قرار گرفته و همچنین نحوه ساخت package مطرح شده است.
Extension هایی که از این طریق ایجاد می شوند فقط در firefox ورژن 1.5 یا بالاتر کار خواهند کرد، البته با اندکی تغییر می توانید آن را مطابق با ورژن 1 در بیاورید.
لیست مطالب ارائه شده:
1- ایجاد محیط extension
2- ایجاد فایلهای اصلی
2-1- ساختار دایرکتوری
2-2- فایلهای اصلی
chrome.manifest
overlay.xul
overlay.js
overlay.dtd
install.rdf
3- ثبت extension خودتان در Extension Manager
4- چرخه تولید
5- ایجاد فایل نهایی
6- منابع تحقیق
ایجاد محیط extension
این مقاله بر روی ساخت extension برای firefox متمرکز است، اما می توان از طریق این مقاله برای سایر برنامه های mozilla ، extension طراحی کرد؛ مانند hunderbird.
اولین چیزی که احتیاج خواهید داشت، دانلود آخرین ورژن برنامه است. می توانید آخرین نسخه firefox را از اینجا (http://ftp.mozilla.org/pub/mozilla.org/firefox/releases/) دانلود کنید. برای اینکه این مقاله قابل استفاده باشد باید نسخه Deer Park Alpha (http://ftp.mozilla.org/pub/mozilla.org/firefox/releases/deerpark/alpha2/) را دریافت نمایید.
برای اطلاعات بیشتر به این آدرس مراجعه کنید: Setting up extension development environment (http://kb.mozillazine.org/Setting_up_extension_development_environment).
ایجاد فایلهای اصلی
مطمئنا میدانید که extension ها ظاهر(UI) برنامه را تحت تاثیر قرار می دهند (ظاهر برنامه با اصطلاح chrome شناخته می شود ) و قابلیت تغییر ظاهر با استفاده از overlay در صفحات و پنجره ها گنجانده شده است.
اینoverlay ها به عنوان قسمتی از package شما خواهند شد. اغلب extension ها حاوی یک یا چند locales و skinsهستند. (locales حاوی فایلهایی جهت چندزیانه بودن است؛ و skins حاوی فایلهایی جهت اعمال پوسته به extension شما. برای درک بهتر مفهوم آنها توصیه می کنیم که فصل XUL Structure (http://xulplanet.com/tutorials/xultu/xulfile.html) را از سری مقالات XULPlanet's XUL Tutorialو Configurable Chrome (http://www.mozilla.org/xpfe/ConfigChromeSpec.html) مطالعه کنید).
این قسمت فایلهای مورد نیاز جهت اینکه extension شما معتبر شناخته شده و در firefox ثبت شود را معرفی می کند.
می توانید یک فایل فشرده نمونه را که حاوی تمامی فایلهای مورد نیاز برای ساخت و به ثبت رساندن extension در Extension Manager است، دریافت نمایید. از اینجا: http://mozilla.doslash.org/stuff/helloworld.zip.
برای درک نحوه کارکرد هر یک از فایل ها شما را به خواند ادامه مقاله دعوت می کنم.
ساختار دایرکتوری
در زیر ساختار دایرکتوری است که ما استفاده خواهیم کرد. ممکن است ساختار شما کمی متفاوت باشد، در این صورت باید فایل chrome.manifest را تغییر
دهید. این فایلها را در شاخه ای ایجاد کنید که قصد توسعه پروژه خودتان را دارید.
helloworld/
chrome.manifest
install.rdf
content/
overlay.js
overlay.xul
locale/
en-US/
overlay.dtd
skin/
overlay.css
نام دایرکتوری ها عبارتند از "Content" ، "locals" و "skin" که این شاخه ها و فایل های آنها اجباری هستند و شما باید حتما آنها را ایجاد نمایید. این فایلها در مراحل بعدی مورد استفاده قرار خواهند گرفت.(مثلا در chrome.manifest و install.rdf).
نکته: این ساختار دایرکتوری فقط در مرحله توسعه و برنامه نویسی مورد استفاده خواهد بود و در مرحله ایجاد فایل package از ساختار دیگری استفاده خواهد شد.
فایلهای اصلی
chrome.manifest
ورژن اخیر Firefox فایل ساده و متنی chrome.manifest (که در ورژن های قدیمی فایل گیج کننده contents.rdf (http://kb.mozillazine.org/Contents.rdf) بود) را برای تعیین اینکه package چه چیز هایی دارد و چه کارهایی می تواند انجام دهد، مورد استفاده قرار می دهد. ساختار این فایل در مقاله Chrome Registration (http://developer.mozilla.org/en/docs/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
توضیح خطوط فایل:
خط1- نشاندهنده محل فایل ها است.
خط2- یک overlay را به chrome://browser/content/browser.xul منتصب می کند. این کار به شما این امکان را می دهد که در ظاهر پنجره اصلی firefox را با اضافه یا تغییر اجزا از طریق فایل overlay.xul تغییراتی ایجاد کنید.
خط4- زبان انگلیسی را به ثبت می رساند.
خط6- پوسته پیش فرض را معرفی می کند.
خط7- فایل استیل overlay.css را به chrome://global/content/customizeToolbar.xul منتصب می کند.(برای مطالعه مثالی از نحوه اضافه کردن کنترل به نوار ابزار به اینجا مراجعه کنید: creating toolbar buttons (http://kb.mozillazine.org/Creating_toolbar_buttons) ). به جای استیل می توانید یک overlay را به ثبت برسانید که خود حاوی استیل است. برای تعریف استیل در overlay از دستورالعمل <?xml-stylesheet?> استفاده کنید.
هشدار: هرگز اسلش (/) پایانی مسیر ها را فراموش نکنید. "content/" به خوبی کار خواهد کرد ولی "content" دچار مشکل خواهد شد.
نکته: این فایل کمی متفاوت از فایلی است که در زمان ایجاد package یا همان فایل XPI مورد استفاده خواهد بود.
overlay.xul
این یک فایل ساده از نوع XUL می باشد. مطالب بیشتر را در مورد overlay ها در XUL Planet (http://xulplanet.com/tutorials/xultu/overlay.html) مطالعه کنید، البته آن مقاله کاربرد های مختلف 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>
توضیح خطوط فایل:
خط1- این خط مربوط به تعریف XML است و ورژنی از Xml که مورد استفاده قرار خواهد گرفت را تعیین می کند. همچنین می توانید نوع encoding فایلتان را مشخص کنید که البته به ندرت استفاده خواهد شد.
خط2- این خط اختیاری است و جهت تعریف استیل مورد استفاده است.
خط3- این خط نیز اختیاری است، اما اگر برای زبانها مختلف فایل overlay.dtd را تعریف کرده اید این قسمت الزامی می شود. از این خط برای تعیین زبان استفاده کنید.
خط4-5- المنت اصلی را معرفی می کند. این باید یک المنت XUL باشد (<overlay>).
خط6- این خط اختیاری است و جهت اظافه کردن اسکریپت مورد استفاده است. قسمت بعدی را برای اطلاعات بیشتر مطالعه کنید.
خط8-10- یک آیتم منو را به منوی Tools در پنجره اصلی firefox اضافه می کند. برای اطلاعات بیشتر به این مقاله مراجعه کنید: Adding items to menus : http://kb.mozillazine.org/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);
overlay.dtd
فایلهای DTD برای ایجاد XUL/XBL/XHTML و سایر انواع فایل XML برای تعیین زبانهای مختلف در شرکت Mozilla مورد استفاده است.
در حقیقت بجای استفاده از کدهای پیچیده و مشکل در فایل XUL خود ،از تگهای XML استفاده کنید.
این فایل به extension شما این اجازه را میدهد تا چند زبانه باشد. انتخاب زبان در زمان اجرا و توسط firefox انجام خواهد شد.
در فایل های DTD برای تعریف یک رشته مانند زیر عمل می کنیم:
<!ENTITY helloworld "Hello World!">
install.rdf
این فایل توسط Extension Manager زمانی که یک فایل XPI نصب و ثبت میشود، مورد استفاده است. در firefox ورژن 1.5 یا بالاتر از این فایل فقط برای تعیین اطلاعات مورد نیاز Extension Manager مانند ID ، شماره نگارش ، توضیحات ، نویسنده و غیره کاربرد دارد. برای اطلاعات بیشتر به این آدرس مراجعه کنید: http://kb.mozillazine.org/Install.rdf.
ثبت extension خودتان در Extension Manager
ایجاد فایلها و ایجاد آنها با توجه به توضیحات داده شده و سپس ثبت آن در Extension Manager کار آسانی است. فقط کافی است که یک فایل "pointer" با نام id مربوط به extension را در شاخه مربوطه ایجاد نمایید. سپس آدرس فولدری را که حاوی فایلهای install.rdf و chrome.manifest است، در داخل آن تایپ کنید و آن را ذخیره کنید.
برای نمونه در مثال helloworld ، id آن {71e95839-6f7e-470d-be54-77012fec6313} است و می خواهیم آن را به آدرس X:\Dev\helloworld\ ثبت کنیم (در این آدرس فایل install.rdf و سایر فایلها وجود دارد)، فقط کافی است که یک خط به فایل با نام {71e95839-6f7e-470d-be54-77012fec6313} اظافه کنیم و آن خط این است:
X:\Dev\helloworld
چرخه تولید
پس از به ثبت رساندن فایل با توجه به توضیحات داده شده، متوجه سادگی کار با extension ها خواهید شد. پس از مطالعه مقاله http://kb.mozillazine.org/Setting_up_extension_development_environment چرخه توسعه شما مانند زیر خواهد بود:
1- ایجاد فایلهای extension.
2- باز کردن پنجره یا پنجره هایی که extension بر آن اثر می کند.
2-1- اگر فایل chrome.manifest را تغییر داده اید باید از برنامه خارج و دوباره آن را اجرا نمایید.
2-2- اگر فایل install.rdf را تغییر داده اید باید فایل pointer که همنام با id است را باز کرده و دوباره ذخیره کنید؛ بدون هیچ تغییری در محتویات آن. ( این کار جهت به روز رسانی تاریخ آخرین تغییر فایل است).
نکته: اگر فایل install.rdf را تغییر داده اید حتما لازم است که زمان آخرین تغییر دایرکتوری نیز به روز شود. برای این کار یک راه ساده این است که یک شاخه جدید در فولدر مربوط به extension ایجاد کنید و سپس آن را حذف کنید! در لینوکس باید از دستورات استفاده نمایید.
ایجاد فایل نهایی
همانطور که قبلا گفته شد باید در فایل chrome.manifest قبل از ایجادpackage تغییراتی را اعمال نمایید.
در هنگام توسعه:
ساختار فایلها:
helloworld/
chrome.manifest
install.rdf
components/
defaults/
preferences/
mydefaults.js
content/
overlay.js
overlay.xul
locale/
en-US/
overlay.dtd
skin/
overlay.css
ساختار فایل chrome.manifest :
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
جهت ایجاد فایل پکیج(xpi):
ساختار فایلها:
helloworld.xpi/
chrome.manifest
install.rdf
components/
defaults/
preferences/
mydefaults.js
chrome/
helloworld.jar
content/
overlay.js
overlay.xul
locale/
en-US/
overlay.dtd
skin/
overlay.css
ساختار فایل chrome.manifest که در"jar:chrome/helloworld.jar!/" خواهد بود:
content helloworld jar:chrome/helloworld.jar!/content/
overlay chrome://browser/content/browser.xul chrome://helloworld/content/overlay.xul
locale helloworld en-US jar:chrome/helloworld.jar!/locale/en-US/
skin helloworld classic/1.0 jar:chrome/helloworld.jar!/skin/
style chrome://global/content/customizeToolbar.xul chrome://helloworld/skin/overlay.css
مجبور نیستید که فایلها را در هنگام ایجاد package در داخل یک فایل jar قرار دهید، ولی جهت گرفتن نتایج بهتر این کار را توصیه میکنیم.
جهت یادگرفتن نحوه ایجاد package به این آدرس بروید: http://kb.mozillazine.org/Packaging_extensions .
[مترجم]
جهت کامل شدن این مقاله نحوه ساخت فایل xpi با استفاده از winrar توضیح داده میشه:
1- قبل از هر کاری ساختار دایرکتوری و فایل chrome.manifest خود را مانند آنچه که توضیح داده شده دربیاورید. برای این کار دایرکتوری های content و locale و skin را به شاخه chrome انتقال دهید.
2- فایل winrar.exe را به آدرس C:\WINXP\system32 کپی کنید.
3- فایل build.bat را در کنار فایل install.rdf ایجاد کنید و در داخل آن این کد ها را تایپ کنید:
set x=%cd%
md build\chrome
cd chrome
winrar.exe a -r -ibck -m0 -afzip -n@"..\list.txt" "%x%.jar"
move "%x%.jar" "..\build\chrome\"
cd ..
copy install.rdf build
cd build
winrar.exe a -s -ibck -r -m5 -afzip "%x%.xpi"
move "%x%.xpi" ..\
cd ..
rd build /s/q
4- فایل متنی list.txt را هم در کنار فایل Install.rdf ایجاد کنید متن آن مانند زیر است:
*.rdf
*.js
*.properties
*.xul
*.dtd
*.png
*.css
5- بدین ترتیب فایل xpi شما با نام دایکتوری موجود در آن ایجاد می شود.
منابع تحقیق
* در مورد توسعه extension ها بیشتر یاد بگیرید: http://kb.mozillazine.org/Extension_development .
* نگاهی به منابع توسعه extension ها: http://kb.mozillazine.org/Development_resources .
* حل مشکلات برنامه نویسی تحت XUL/JS/XPCOM در این آدرس: http://kb.mozillazine.org/Category:Example_code .
* دریافت فایل حاوی مثال مطرح شده در این مقاله: http://mozilla.doslash.org/stuff/helloworld.zip .
* دریافت firefox ورژن 1.5 نسخه بتا: ftp://ftp.mozilla.org/pub/mozilla.org/firefox/releases/1.5b1 .
* در مورد مشکلات خودتان در این مورد اینجا بحث کنید: http://forums.mozillazine.org/viewforum.php?f=19 .
* ترجمه شده از مقاله Getting started with extension development در سایت http://kb.mozillazine.org
http://www.salarsoft.somee.com/magaleh/m_firefox_extensions.htm
Extension هایی که از این طریق ایجاد می شوند فقط در firefox ورژن 1.5 یا بالاتر کار خواهند کرد، البته با اندکی تغییر می توانید آن را مطابق با ورژن 1 در بیاورید.
لیست مطالب ارائه شده:
1- ایجاد محیط extension
2- ایجاد فایلهای اصلی
2-1- ساختار دایرکتوری
2-2- فایلهای اصلی
chrome.manifest
overlay.xul
overlay.js
overlay.dtd
install.rdf
3- ثبت extension خودتان در Extension Manager
4- چرخه تولید
5- ایجاد فایل نهایی
6- منابع تحقیق
ایجاد محیط extension
این مقاله بر روی ساخت extension برای firefox متمرکز است، اما می توان از طریق این مقاله برای سایر برنامه های mozilla ، extension طراحی کرد؛ مانند hunderbird.
اولین چیزی که احتیاج خواهید داشت، دانلود آخرین ورژن برنامه است. می توانید آخرین نسخه firefox را از اینجا (http://ftp.mozilla.org/pub/mozilla.org/firefox/releases/) دانلود کنید. برای اینکه این مقاله قابل استفاده باشد باید نسخه Deer Park Alpha (http://ftp.mozilla.org/pub/mozilla.org/firefox/releases/deerpark/alpha2/) را دریافت نمایید.
برای اطلاعات بیشتر به این آدرس مراجعه کنید: Setting up extension development environment (http://kb.mozillazine.org/Setting_up_extension_development_environment).
ایجاد فایلهای اصلی
مطمئنا میدانید که extension ها ظاهر(UI) برنامه را تحت تاثیر قرار می دهند (ظاهر برنامه با اصطلاح chrome شناخته می شود ) و قابلیت تغییر ظاهر با استفاده از overlay در صفحات و پنجره ها گنجانده شده است.
اینoverlay ها به عنوان قسمتی از package شما خواهند شد. اغلب extension ها حاوی یک یا چند locales و skinsهستند. (locales حاوی فایلهایی جهت چندزیانه بودن است؛ و skins حاوی فایلهایی جهت اعمال پوسته به extension شما. برای درک بهتر مفهوم آنها توصیه می کنیم که فصل XUL Structure (http://xulplanet.com/tutorials/xultu/xulfile.html) را از سری مقالات XULPlanet's XUL Tutorialو Configurable Chrome (http://www.mozilla.org/xpfe/ConfigChromeSpec.html) مطالعه کنید).
این قسمت فایلهای مورد نیاز جهت اینکه extension شما معتبر شناخته شده و در firefox ثبت شود را معرفی می کند.
می توانید یک فایل فشرده نمونه را که حاوی تمامی فایلهای مورد نیاز برای ساخت و به ثبت رساندن extension در Extension Manager است، دریافت نمایید. از اینجا: http://mozilla.doslash.org/stuff/helloworld.zip.
برای درک نحوه کارکرد هر یک از فایل ها شما را به خواند ادامه مقاله دعوت می کنم.
ساختار دایرکتوری
در زیر ساختار دایرکتوری است که ما استفاده خواهیم کرد. ممکن است ساختار شما کمی متفاوت باشد، در این صورت باید فایل chrome.manifest را تغییر
دهید. این فایلها را در شاخه ای ایجاد کنید که قصد توسعه پروژه خودتان را دارید.
helloworld/
chrome.manifest
install.rdf
content/
overlay.js
overlay.xul
locale/
en-US/
overlay.dtd
skin/
overlay.css
نام دایرکتوری ها عبارتند از "Content" ، "locals" و "skin" که این شاخه ها و فایل های آنها اجباری هستند و شما باید حتما آنها را ایجاد نمایید. این فایلها در مراحل بعدی مورد استفاده قرار خواهند گرفت.(مثلا در chrome.manifest و install.rdf).
نکته: این ساختار دایرکتوری فقط در مرحله توسعه و برنامه نویسی مورد استفاده خواهد بود و در مرحله ایجاد فایل package از ساختار دیگری استفاده خواهد شد.
فایلهای اصلی
chrome.manifest
ورژن اخیر Firefox فایل ساده و متنی chrome.manifest (که در ورژن های قدیمی فایل گیج کننده contents.rdf (http://kb.mozillazine.org/Contents.rdf) بود) را برای تعیین اینکه package چه چیز هایی دارد و چه کارهایی می تواند انجام دهد، مورد استفاده قرار می دهد. ساختار این فایل در مقاله Chrome Registration (http://developer.mozilla.org/en/docs/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
توضیح خطوط فایل:
خط1- نشاندهنده محل فایل ها است.
خط2- یک overlay را به chrome://browser/content/browser.xul منتصب می کند. این کار به شما این امکان را می دهد که در ظاهر پنجره اصلی firefox را با اضافه یا تغییر اجزا از طریق فایل overlay.xul تغییراتی ایجاد کنید.
خط4- زبان انگلیسی را به ثبت می رساند.
خط6- پوسته پیش فرض را معرفی می کند.
خط7- فایل استیل overlay.css را به chrome://global/content/customizeToolbar.xul منتصب می کند.(برای مطالعه مثالی از نحوه اضافه کردن کنترل به نوار ابزار به اینجا مراجعه کنید: creating toolbar buttons (http://kb.mozillazine.org/Creating_toolbar_buttons) ). به جای استیل می توانید یک overlay را به ثبت برسانید که خود حاوی استیل است. برای تعریف استیل در overlay از دستورالعمل <?xml-stylesheet?> استفاده کنید.
هشدار: هرگز اسلش (/) پایانی مسیر ها را فراموش نکنید. "content/" به خوبی کار خواهد کرد ولی "content" دچار مشکل خواهد شد.
نکته: این فایل کمی متفاوت از فایلی است که در زمان ایجاد package یا همان فایل XPI مورد استفاده خواهد بود.
overlay.xul
این یک فایل ساده از نوع XUL می باشد. مطالب بیشتر را در مورد overlay ها در XUL Planet (http://xulplanet.com/tutorials/xultu/overlay.html) مطالعه کنید، البته آن مقاله کاربرد های مختلف 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>
توضیح خطوط فایل:
خط1- این خط مربوط به تعریف XML است و ورژنی از Xml که مورد استفاده قرار خواهد گرفت را تعیین می کند. همچنین می توانید نوع encoding فایلتان را مشخص کنید که البته به ندرت استفاده خواهد شد.
خط2- این خط اختیاری است و جهت تعریف استیل مورد استفاده است.
خط3- این خط نیز اختیاری است، اما اگر برای زبانها مختلف فایل overlay.dtd را تعریف کرده اید این قسمت الزامی می شود. از این خط برای تعیین زبان استفاده کنید.
خط4-5- المنت اصلی را معرفی می کند. این باید یک المنت XUL باشد (<overlay>).
خط6- این خط اختیاری است و جهت اظافه کردن اسکریپت مورد استفاده است. قسمت بعدی را برای اطلاعات بیشتر مطالعه کنید.
خط8-10- یک آیتم منو را به منوی Tools در پنجره اصلی firefox اضافه می کند. برای اطلاعات بیشتر به این مقاله مراجعه کنید: Adding items to menus : http://kb.mozillazine.org/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);
overlay.dtd
فایلهای DTD برای ایجاد XUL/XBL/XHTML و سایر انواع فایل XML برای تعیین زبانهای مختلف در شرکت Mozilla مورد استفاده است.
در حقیقت بجای استفاده از کدهای پیچیده و مشکل در فایل XUL خود ،از تگهای XML استفاده کنید.
این فایل به extension شما این اجازه را میدهد تا چند زبانه باشد. انتخاب زبان در زمان اجرا و توسط firefox انجام خواهد شد.
در فایل های DTD برای تعریف یک رشته مانند زیر عمل می کنیم:
<!ENTITY helloworld "Hello World!">
install.rdf
این فایل توسط Extension Manager زمانی که یک فایل XPI نصب و ثبت میشود، مورد استفاده است. در firefox ورژن 1.5 یا بالاتر از این فایل فقط برای تعیین اطلاعات مورد نیاز Extension Manager مانند ID ، شماره نگارش ، توضیحات ، نویسنده و غیره کاربرد دارد. برای اطلاعات بیشتر به این آدرس مراجعه کنید: http://kb.mozillazine.org/Install.rdf.
ثبت extension خودتان در Extension Manager
ایجاد فایلها و ایجاد آنها با توجه به توضیحات داده شده و سپس ثبت آن در Extension Manager کار آسانی است. فقط کافی است که یک فایل "pointer" با نام id مربوط به extension را در شاخه مربوطه ایجاد نمایید. سپس آدرس فولدری را که حاوی فایلهای install.rdf و chrome.manifest است، در داخل آن تایپ کنید و آن را ذخیره کنید.
برای نمونه در مثال helloworld ، id آن {71e95839-6f7e-470d-be54-77012fec6313} است و می خواهیم آن را به آدرس X:\Dev\helloworld\ ثبت کنیم (در این آدرس فایل install.rdf و سایر فایلها وجود دارد)، فقط کافی است که یک خط به فایل با نام {71e95839-6f7e-470d-be54-77012fec6313} اظافه کنیم و آن خط این است:
X:\Dev\helloworld
چرخه تولید
پس از به ثبت رساندن فایل با توجه به توضیحات داده شده، متوجه سادگی کار با extension ها خواهید شد. پس از مطالعه مقاله http://kb.mozillazine.org/Setting_up_extension_development_environment چرخه توسعه شما مانند زیر خواهد بود:
1- ایجاد فایلهای extension.
2- باز کردن پنجره یا پنجره هایی که extension بر آن اثر می کند.
2-1- اگر فایل chrome.manifest را تغییر داده اید باید از برنامه خارج و دوباره آن را اجرا نمایید.
2-2- اگر فایل install.rdf را تغییر داده اید باید فایل pointer که همنام با id است را باز کرده و دوباره ذخیره کنید؛ بدون هیچ تغییری در محتویات آن. ( این کار جهت به روز رسانی تاریخ آخرین تغییر فایل است).
نکته: اگر فایل install.rdf را تغییر داده اید حتما لازم است که زمان آخرین تغییر دایرکتوری نیز به روز شود. برای این کار یک راه ساده این است که یک شاخه جدید در فولدر مربوط به extension ایجاد کنید و سپس آن را حذف کنید! در لینوکس باید از دستورات استفاده نمایید.
ایجاد فایل نهایی
همانطور که قبلا گفته شد باید در فایل chrome.manifest قبل از ایجادpackage تغییراتی را اعمال نمایید.
در هنگام توسعه:
ساختار فایلها:
helloworld/
chrome.manifest
install.rdf
components/
defaults/
preferences/
mydefaults.js
content/
overlay.js
overlay.xul
locale/
en-US/
overlay.dtd
skin/
overlay.css
ساختار فایل chrome.manifest :
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
جهت ایجاد فایل پکیج(xpi):
ساختار فایلها:
helloworld.xpi/
chrome.manifest
install.rdf
components/
defaults/
preferences/
mydefaults.js
chrome/
helloworld.jar
content/
overlay.js
overlay.xul
locale/
en-US/
overlay.dtd
skin/
overlay.css
ساختار فایل chrome.manifest که در"jar:chrome/helloworld.jar!/" خواهد بود:
content helloworld jar:chrome/helloworld.jar!/content/
overlay chrome://browser/content/browser.xul chrome://helloworld/content/overlay.xul
locale helloworld en-US jar:chrome/helloworld.jar!/locale/en-US/
skin helloworld classic/1.0 jar:chrome/helloworld.jar!/skin/
style chrome://global/content/customizeToolbar.xul chrome://helloworld/skin/overlay.css
مجبور نیستید که فایلها را در هنگام ایجاد package در داخل یک فایل jar قرار دهید، ولی جهت گرفتن نتایج بهتر این کار را توصیه میکنیم.
جهت یادگرفتن نحوه ایجاد package به این آدرس بروید: http://kb.mozillazine.org/Packaging_extensions .
[مترجم]
جهت کامل شدن این مقاله نحوه ساخت فایل xpi با استفاده از winrar توضیح داده میشه:
1- قبل از هر کاری ساختار دایرکتوری و فایل chrome.manifest خود را مانند آنچه که توضیح داده شده دربیاورید. برای این کار دایرکتوری های content و locale و skin را به شاخه chrome انتقال دهید.
2- فایل winrar.exe را به آدرس C:\WINXP\system32 کپی کنید.
3- فایل build.bat را در کنار فایل install.rdf ایجاد کنید و در داخل آن این کد ها را تایپ کنید:
set x=%cd%
md build\chrome
cd chrome
winrar.exe a -r -ibck -m0 -afzip -n@"..\list.txt" "%x%.jar"
move "%x%.jar" "..\build\chrome\"
cd ..
copy install.rdf build
cd build
winrar.exe a -s -ibck -r -m5 -afzip "%x%.xpi"
move "%x%.xpi" ..\
cd ..
rd build /s/q
4- فایل متنی list.txt را هم در کنار فایل Install.rdf ایجاد کنید متن آن مانند زیر است:
*.rdf
*.js
*.properties
*.xul
*.dtd
*.png
*.css
5- بدین ترتیب فایل xpi شما با نام دایکتوری موجود در آن ایجاد می شود.
منابع تحقیق
* در مورد توسعه extension ها بیشتر یاد بگیرید: http://kb.mozillazine.org/Extension_development .
* نگاهی به منابع توسعه extension ها: http://kb.mozillazine.org/Development_resources .
* حل مشکلات برنامه نویسی تحت XUL/JS/XPCOM در این آدرس: http://kb.mozillazine.org/Category:Example_code .
* دریافت فایل حاوی مثال مطرح شده در این مقاله: http://mozilla.doslash.org/stuff/helloworld.zip .
* دریافت firefox ورژن 1.5 نسخه بتا: ftp://ftp.mozilla.org/pub/mozilla.org/firefox/releases/1.5b1 .
* در مورد مشکلات خودتان در این مورد اینجا بحث کنید: http://forums.mozillazine.org/viewforum.php?f=19 .
* ترجمه شده از مقاله Getting started with extension development در سایت http://kb.mozillazine.org
http://www.salarsoft.somee.com/magaleh/m_firefox_extensions.htm