Разработка дополнений FireFox: различия между версиями

Материал из Викиверситета
Содержимое удалено Содержимое добавлено
Строка 37: Строка 37:
</overlay>
</overlay>
</source>
</source>
Это корневой файл, он говорит, что кнопка вообще должна быть и должна быть добавлена по умолчанию на панель инструментов BrowserToolbarPalette.
Это корневой файл, он говорит, что кнопка вообще должна быть и должна быть добавлена по умолчанию на панель инструментов BrowserToolbarPalette. Этот код написан на языке [[w:XUL|XUL]].


=== locale\en-US\overlay.dtd ===
=== locale\en-US\overlay.dtd ===

Версия от 19:22, 24 августа 2011

Семинар «Разработка дополнений FireFox» является частью обучающих материалов кафедры веб-технологий.

Дополнения к FireFox распространяются в виде файлов с расширением xpi. Эти файлы являются zip-архивами. Внутри архива могут находиться javascript, xul, css-файлы и даже jar-архивы. В большинстве случаев файлы структурированы в диретории и эти директории имеют стандартные названия. В-общем, всё довольно человекопонятно и человекодоступно. Давайте попробуем создать простое расширение. Пусть это будет кнопка, которую мы могли бы разместить на произвольной панели инструментов FireFox и по нажатию на неё должно появляться всплывающее окно.

Но мы не будем делать так, как делается в большинстве подобных руководств: сначала сделать описание файлов, а потом дать ссылку на архив. Мы сначала настроимся на работу, скачаем и установим шаблонный проект, а уже потом будем разбираться что там к чему.

Подготовка рабочего пространства

Итак, для начала создадим отдельный FireFox профиль, который не жалко сломать. Для этого закрываем FireFox, нажимаем Win+R и вводим команду

firefox -P

Откроется окно для выбора профиля. Нажимаем кнопку создания профиля и указываем папку для создания нового профиля. Предпочтительно создать папку так, чтобы она была легко доступна, например:

D:\my_experiments\firefox

Далее скачиваем и устанавливаем шаблонный проект helloworld.xpi. На панели управления должна появиться кнопка, по нажатию которой отображается приветствие 'Hello, World!'.

После установки файл окажется в директории

D:\my_experiments\firefox\extensions

с названием

helloworld@ru.wikiversity.org.xpi

Работать с архивом не удобно, поэтому закройте firefox и распакуйте содержимое в

D:\my_experiments\firefox\extensions\helloworld@ru.wikiversity.org\

а исходный файл удалите.

Включите FireFox и убедитесь, что всё по прежнему работает. Если так, то можно приступать к изучению содержимого шаблонного проекта.

Содержимое пакета helloworld.xpi

content\overlay.xul

<?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">
    <toolbarpalette  id="BrowserToolbarPalette">
        <toolbarbutton  id="helloButton" label="&helloworld;" oncommand="alert('Hello, World!');"/>
    </toolbarpalette>
</overlay>

Это корневой файл, он говорит, что кнопка вообще должна быть и должна быть добавлена по умолчанию на панель инструментов BrowserToolbarPalette. Этот код написан на языке XUL.

locale\en-US\overlay.dtd

<!ENTITY helloworld "Hello World!">

Это просто справочник текстовых констант.

skin\...

В этой папке содержатся изображение для кнопки и файл со стилями

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

Очевидно, что это важный файл, который конфигурирует работу приложения. Пока неясно, как надо его интерпретировать.

install.rdf

<?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">
  
    <em:id>helloworld@ru.wikiversity.org</em:id>
    <em:name>Hello World extension for Firefox</em:name>
    <em:version>1.0</em:version>
    <em:description>Demo Hello World extension.</em:description>
    <em:creator>Wikiversity student</em:creator>

    <!-- Firefox -->
    <em:targetApplication>
      <Description>
        <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id>
        <em:minVersion>3.6</em:minVersion>
        <em:maxVersion>8.0.*</em:maxVersion>
      </Description>
    </em:targetApplication>

  </Description>
</RDF>

В соответствии с этим файлом происходит установка дополнения (или не происходит в случае слишком старых или слишком новых версий).