Fox Plugins Live
Last night I could not sleep, and I decided to do something useful (for once, for all). Because you can only benefit others by benefiting yourself, I tried to make my life easier: create a plugin that monitors the change of some numbers on one page (something like “number of unread comments in topics you follow” and “number of letters”, if more than zero - An excuse to go and read these new comments. These numbers are displayed on two well-known collective blogs at the top of the page, but you can learn about their changes in their state only by updating this page - there is no mechanism for mail-rss-etc. Renault. Well, I hope, clearly explained). After an hour and a half, a more or less stable version of the plugin was ready, and I will be happy to tell you how to repeat my feat at any time of the year.
So on the agenda: Create plugins for FireFox quickly and cleanly.
I just want to warn you: I’m not a pro and not a guru in this business, before my plug-in experiences were scripts for GreaseMonkey (well, you all saw my HabraHacker - a gizmo for easy editing comments). However, the plugin seems to be written, and it even works;)
I needed:
')
I began to think about how, in fact, to begin. Looking for tutorials in Google, I found a couple, but somehow I didn’t like them - probably, at 3 o'clock in the morning, I don’t have time to read such opus;) Looking around my interface, I found Habragolik very similar to the intended plugin. He also prints numbers - isn't that what he needs? ;)
Without special moral barriers, I downloaded its distribution kit to a hard disk and, bearing in mind that all the plugins in the XPI format are nothing more than ZIP archives with a bunch of different files , I changed the extension to it: habraholic-0.2.zip . Having unzipped it somewhere and applying item 5 of inventory, I made an inventory of things:
* Is an XML-based language describing interfaces. Supports JS, similar to XHTML - well, everything. The plugin will be written on it.
I started with the install.rdf file . Opening it, I ran through the lines in thought:
Next in line was the chrome.manifest file . In it, I changed only the path to the panel.xul file : I replaced habraholic with my name.
Looking in /defaults/preferences/defaults.js , I found that there are only user configurable variables. I commented out them (//).
Then I deleted the file /chrome/content/prefs.xul as useless (we don’t have any more settings, right?) And replaced /chrome/content/habr.ico with my icon.
It is time for design and layout: /chrome/content/panel.xul . The first thing I did was change all the element IDs and labels: I replaced “habraholic” and “Karma” with various other words. Removed the setting item and the separator (Menuseparator) from the menu (described inside the element) and the word “karma” from the text of the first item. I changed the paths to the icon and the script (and <script ...>) and renamed the called javascript functions to onclick = '' and oncommand = ''.
Here you can play a little: add a couple more icons, a couple of labels and other elements. But you can always play around, but I will go to the code part of the program: /chrome/content/script.js .
I started by renaming all functions (removed habraholic from names, and so on). Then he looked at them all:
Oh. It seems written. Now I packed all the files into plugin.zip and renamed it to plugin.xpi, then dragged it to the browser. He offered to install it, and I am glad - I press the button, and then restart the browser.
The browser did not fall and even showed a panel. The panel, of course, did not show everything as it should, but after some debugging (the alert function worked fine) and I thought everything led to a normal view (for this, I re-pack the plugin each time, rename it and drag it to the browser window - doubtful entertainment;). Hooray!
It was a small matter: I changed the version in /chrome/content/prefs.xul to proud 0.2 and went to upload to addons.mozilla.org . There I had to enter a lot of things, but in the end I received my own plugin page there, of course, without delay, to publish a link to it in places where supposed users gather. After a long correction of quickly found errors, I became the happy author of a good and working plug-in. And you, habrachelovek?
So on the agenda: Create plugins for FireFox quickly and cleanly.
I just want to warn you: I’m not a pro and not a guru in this business, before my plug-in experiences were scripts for GreaseMonkey (well, you all saw my HabraHacker - a gizmo for easy editing comments). However, the plugin seems to be written, and it even works;)
I needed:
- Firefox . I, for example, have a 3rd minefield version.
- Firefox Portable . Maybe, of course, it is not needed, but I put it: for an easy and quick run of the plug-in in the second version.
- Editor I choose Notepad ++. I recommend it to you - it is very fast, easy, convenient, and with a huge number of functions, and it also highlights everything. Well, if you do not like it - take any, it is desirable that he was able to highlight JavaScript and XML.
- JavaScript knowledge . Oddly enough, they will also be needed.
- A little wit and imagination . I do not know why.
')
I began to think about how, in fact, to begin. Looking for tutorials in Google, I found a couple, but somehow I didn’t like them - probably, at 3 o'clock in the morning, I don’t have time to read such opus;) Looking around my interface, I found Habragolik very similar to the intended plugin. He also prints numbers - isn't that what he needs? ;)
Without special moral barriers, I downloaded its distribution kit to a hard disk and, bearing in mind that all the plugins in the XPI format are nothing more than ZIP archives with a bunch of different files , I changed the extension to it: habraholic-0.2.zip . Having unzipped it somewhere and applying item 5 of inventory, I made an inventory of things:
+ chrome
+ content
- panel.xul // the body of our plugin. XUL * description of the panel
- script.js // and this is already a soul. Well, more precisely the mind ... instincts. in short, the entire javascript executable code
- prefs.xul // describes the settings window
- habr.ico // strange picture with a large letter H. probably symbolizes habrabra
+ defaults
+ preferences
- defaults.js // there - default values ​​of variables that the plugin stores in the browser forever. there are usually settings
- install.rdf // strange XML file describing the plugin
- chrome.manifest // apparently, tells the browser about which XUL file to connect when loading the browser
* Is an XML-based language describing interfaces. Supports JS, similar to XHTML - well, everything. The plugin will be written on it.
I started with the install.rdf file . Opening it, I ran through the lines in thought:
I still do not understand what I mean, and I did not try: I just put the name of the plug-in in front of the dog in Latin letters, and after the dog I gave my name and surname.<em: id> habraholic@vladislav.semenov </ em: id>
Version. Just in case, put 0.1<em: version> 0.2 </ em: version>
I only found out later what it is (type: skin, plugin or something else. Well, something like that), but then I decided not to touch it. my plugin is unlikely to be much different - well, I will not change.<em: type> 2 </ em: type>
chrome: // it’s like a link to the directory with all the contents of the / chrome / directories from the plugins. This will point to the /chrome/contents/prefs.xul file. My plugin had no settings, so I commented out this line ()<em: optionsURL> chrome: //habraholic/content/prefs.xul </ em: optionsURL>
<em: targetApplication>
<Description>
<em: id> {ec8030f7-c20a-464f-9b0e-13a3a9e97384} </ em: id>
<em: minVersion> 1.5 </ em: minVersion>
<em: maxVersion> 2.0.0. * </ em: maxVersion>
</ Description>
</ em: targetApplication> Well, everything is clear with them. Changed, saved and closed the file.<em: name> Habragolik </ em: name> and others
Next in line was the chrome.manifest file . In it, I changed only the path to the panel.xul file : I replaced habraholic with my name.
Looking in /defaults/preferences/defaults.js , I found that there are only user configurable variables. I commented out them (//).
Then I deleted the file /chrome/content/prefs.xul as useless (we don’t have any more settings, right?) And replaced /chrome/content/habr.ico with my icon.
It is time for design and layout: /chrome/content/panel.xul . The first thing I did was change all the element IDs and labels: I replaced “habraholic” and “Karma” with various other words. Removed the setting item and the separator (Menuseparator) from the menu (described inside the element) and the word “karma” from the text of the first item. I changed the paths to the icon and the script (and <script ...>) and renamed the called javascript functions to onclick = '' and oncommand = ''.
Here you can play a little: add a couple more icons, a couple of labels and other elements. But you can always play around, but I will go to the code part of the program: /chrome/content/script.js .
I started by renaming all functions (removed habraholic from names, and so on). Then he looked at them all:
- just the code is executed as usual, as soon as it appears. Here he only assigned an event handler to the browser load - so I left it as it is, changing the name of the handler.
- habraholicLoad is just this handler. It starts a function that will update the karma every 5 minutes. The handler did not change, changed the name of the function being run.
- habraholicLeftClick - handles click. If the username is filled in the settings, it causes the update karma. If not, it calls the function that opens the settings. I removed the entire IF, leaving the first branch: now only updated.
- habraholicUpdateKarma is the updater itself. If the settings are configured - creates XMLHttpRequest to habra-api. If not configured, change the contents of the label so that the user understands that it is time to adjust everything. I left only the creation of the object, removing all the checks, and changed the URL that is being accessed.
- habraholicUpdateKarmaRepeatedly is the same function called by habraholicLoad and every 10 minutes calling habraholicUpdateKarma (). I changed the time interval (it is in milliseconds) and proper names (function names).
- habraholicSetKarma - callback from that XMLHttpRequest. It works like this: it creates variables with default values, then in try {} it tries to isolate the values ​​of karma and habrasils from the server response and replace those variables with them. Since I didn’t see any XML, I simply pulled the entire HTML code of the resulting page into a variable and ran through it regularly:
var html = httpRequest.responseText; mythings = / <li id ​​= "things"> <a href="\/my\/"> <span> <em> my things (. +?) <\ / em> /. exec (html); if (mythings) mythings = mythings [1]; else mythings = "';
- habraholicShowPrefs - shows the settings window. Removed.
- habraholicGetUsername, habraholicIsRatingPositionHidden - get permanently saved settings. Removed.
- habraholicLoadProfile - opens a user profile. Modified for their own purposes.
- habraholicLoadPage - awesome useful thing: opens a page (tab) with the address we need. Excellent friends with a click wheel ("open in a new tab"). Renamed and did not touch anymore.
Oh. It seems written. Now I packed all the files into plugin.zip and renamed it to plugin.xpi, then dragged it to the browser. He offered to install it, and I am glad - I press the button, and then restart the browser.
The browser did not fall and even showed a panel. The panel, of course, did not show everything as it should, but after some debugging (the alert function worked fine) and I thought everything led to a normal view (for this, I re-pack the plugin each time, rename it and drag it to the browser window - doubtful entertainment;). Hooray!
It was a small matter: I changed the version in /chrome/content/prefs.xul to proud 0.2 and went to upload to addons.mozilla.org . There I had to enter a lot of things, but in the end I received my own plugin page there, of course, without delay, to publish a link to it in places where supposed users gather. After a long correction of quickly found errors, I became the happy author of a good and working plug-in. And you, habrachelovek?
Source: https://habr.com/ru/post/26773/
All Articles