Перейти к содержанию

лолоблог

  • запись
    1
  • комментариев
    0
  • просмотров
    11 255

Opera extension . . . начало


kos1nus

1 508 просмотров

Хочу поделиться опытом разработки своего первого дополнения для самого лучшего браузера. Кто так не считает - покиньте аудиторию 8). К сожалению мое дополнение слишком специфично и врятли им воспользуется еще кто то кроме меня. Да и к тому же я не собираюсь выставлять его на всеобщее обозрение. Позориться не хочу =))

 

Для того чтобы понять о чем пойдет речь, стоить посетить эту ссылку. Это свободная операционная система для сетевого хранилища (англ. Network-Attached Storage). FreeNAS основан на ОС FreeBSD с использованием Samba и PHP, поддерживает software RAID; к нему можно получить доступ по протоколам CIFS (SMB), Apple Mac AFP, FTP, SSH, iSCSI и NFS. Она не имеет обычного интерфейса, только командную строку. Управляется она через Web интерфес. Он то мне и нужен.

 

Идея дополнения заключается в том чтоб оно показывало состоянии FreeNAS: температуру, занятое место на дисках и т.п. Вообщем все тоже самое что я могу увидеть через веб-интерфес, только более компактно и сокращенно, к примеру мне совершенно незачем каждый раз видеть версию FreeNAS'a, а вот температура важна, особенно сейчас.

 

Надо заметить что у меня вообще не было опыта как и что делать. был какой то небольшой навык HTML, JavaScript. А вот чтобы разобраться в работе PHP я вообще голову сломал. В PHP можно одно и тоже написать несколькими способами, и это не слабо выносило моск. Ну просто мне лень читать все эти скучные мауналы, гораздо проще методом тыка =)).

 

И так дополнение состоит из двух частей: клиентской и серверной.

 

Серверная. На фринасе создается отдельный PHP файлик в котором формируется ответ на запрос. В моем случае в этом файлике фактический полностью формируется та страница, которую мы увидим в опере. Я бы не сказал что составление этого файла принесло мне массу удовольствий, перелопачивать чужой код всегда неудобно.

 

Клиентская часть. Тут первая задача была в том чтобы понять как же можно выдрать данные из сервера. И тут было много подводных камней, особенно в опере. Я на начал сталкиваться с ограничениями безопасности. дело в том чтоб мне надо было обмениваться данными с разными доменами (кроссдоменный обмен). И тут Опера показала себя настоящим параноиком - она не давала мне выполнять простые действия, когда остальные браузеры вполне спокойно на это реагировали. Хорошо это или плохо я судить не будут, но было это крайне неудобно.

 

В итоге в дополнения для оперы у меня вошли следующие файлы:

index.html - это главный и обязательный фаил для любого дополнения или виджета

popup.html - страничка которая открывается при нажатии на кнопку на панели. в нем содержится собственно код всего дополнения

config.xml - фаил конфигурации. обязательный фаил. в нем прописываются настройки безопасности.

script.js - название говорит само за себя. содержит скрипты

gui.css - фаил стиля. PHP страничка содержит переделанный код веб-интерфеса. ну и соответственно мне не зачем было писать свой фаил стиля, я просто скопировал стиль веб-интерфейса.

 

ну и скриншот чтоб было наглядно видно что получилось. Сверху справа есть кнопочка (черная), при нажатии на нее появляется небольшое окно, которое так же на скриншоте. кракозябры это время работы. мне пока не хотелось работать над кодировкой. потом поправлю.

a7c9d5aa1d5at.jpg

 

Как я уже сказал это создавалось не для общего обозрения, а что то вроде пробы. Попробовал - получилось, испытал чувство удовлетворения! задача была не легкая (для меня), но интересная. Думаю в дальнейшем еще что нибудь напишу, но уже для всех.

 

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

0 Комментариев


Рекомендуемые комментарии

Комментариев нет

Гость
Добавить комментарий...

×   Вставлено с форматированием.   Вставить как обычный текст

  Разрешено использовать не более 75 эмодзи.

×   Ваша ссылка была автоматически встроена.   Отображать как обычную ссылку

×   Ваш предыдущий контент был восстановлен.   Очистить редактор

×   Вы не можете вставлять изображения напрямую. Загружайте или вставляйте изображения по ссылке.

×
×
  • Создать...