Python, Firefox programming and Irish Whiskey.

Tuesday, November 17, 2009

extending pageinfo

In our SEOProfesional Toolbar firefox extension I considered, how I should present some web-page related information to the user. Of course the easiest but quite stupid way to do it would be to make my own information box with the requested information. But in principle, the info we wanted to show was something about the page, therefore logically belonging to the Page Info dialog. I did not find much information on developer.mozilla.org, so I dived into the source code. Let's start with chrome.manifest of our testbed add-on: which simply says that the browser's pageInfo.xul should be overlayed with our pageInfoOverlay.xul. The overlay should look like this: The important parts are:
  • The radiogroup overlay with an item with id somethingTab and the oncommand="showTab('something');"
  • The deck overlay with a vbox called again somethingPanel
Now you should see your page in the pageinfo. The real fun hasn't started yet. We need to add some functionality. You have probably noticed the link to pageinfo.js in our xul. Until now we expected it was empty. Let's start filling it with stuff. If you look into chrome://browser/content/pageinfo/pageInfo.js you will see that Firefox developers have helped us with building a framework for extending page info. There is a bunch of callbacks to help us set the contents of our page. Following are javascript arrays of functions to be called for certain events.
  • onLoadRegistry
  • onResetRegistry
  • onProcessFrame
  • onProcessElement
  • onFinished
  • onUnloadRegistry
We will just look at onLoadRegistry and onProcessFrame here as they are the only 2 I have used. onLoadRegistry functions will be called whenever page info is displayed. That's the good place to decide whether we want to display our page or not. The code of our pageinfo.js could look like this: That will hide our page for pages retrieved through https. The second one, onProcessFrame, gets all the frames the page consists of. If we want to enumerate them, we can do something like this: 2 last pieces of the puzzle are missing. The first one: how to assign a headline image for our page. Easy! Through css. You have noticed link to chrome://testbed/skin/overlay.css in our xul. Those 2 images should be 32x32px. And the last thing: what if we also want to invoke the page info dialog from our UI and switch directly to our page? Again, that's something Firefox developers thought about. Very basic: Not ideal though. There is a possibility, that the page info for this page has already been opened. Therefore it is better to look and in such case, focus the existing window: The best news at the end: I have created a test-bed for my experiments. You can install this add-on and see pretty much everything I have been writing about today...

Sunday, November 15, 2009

seoprofesional toolbar

Seo-Profesional's and my joint project is nearing to release. It is a Firefox extension called SEO Profesional Toolbar, which is in a way similar to other seo firefox extension, yet, it is superior. Similarly to its competitors it displays page rank and s-rank (for Czech search engine Seznam), but unlike them, it remembers history and displays it in nice colorful charts. After all, everybody likes colors. Go and see YouTube SEOProfesional's Channel to learn more. I am not a SEO person. I am a programmer. I wrote, or I should rather say put together the code and I can say, there are a few nice ideas. In next few posts you will learn how to do a few things in javascript/firefox.
  • How to extend PageInfo
  • How to high-light words or other stuff in the html page
  • How to make charts with flot
  • How to access fav-icons
  • Bits about a xul tree
  • You might have already read about word count (II)
You English speakers will probably need this link to install it...

word count II

In the course of time I found out that the approach I described in here is not ideal. Namely, getting the words from scripts didn't work when there were more scripts in the page. It looks like returns the string value of the first script only. So what we have to do is to take each script one by one and process them separately:

Originally at wordpress, 2009-11-08.

word count

How do you count words in a html document? In javascript? When you have got the HTML's DOM, javascript and whole Firefox at your disposal? Of course, there is a bruteforce method of going through all DOM nodes, but that's rather silly. I found this: (source)
Nice, but it has got 2 problems. It doesn't split words well, e.g. if you have something like word1,word2,word3, it is considered to be a single word. So let us not split by spaces but by something more complex: Unfortunately this is still not enough for it will include words from between the script tags. What now? Let's simply substract the scripts and we are done. Now, the trouble is, this lot can also contain spaces now. But it does not bother me much as I need to go through all words one by one and I can remove unsuitables then.

Originally at wordpress, 2009-10-06.

ff3sudoku plans

I always wanted to keep the ff3sudoku firefox add-on as simple as possible. Now, that's quite a difficult thing, if you want to make everyone happy. So options are comming up! The first thing I'll to is I'll make it possible to turn off the tooltips. Any more ideas? Share them in the comments please... Lately I have been busy with another project which I am not at liberty to disclose yet, and which probably won't be of any interest of you, sudoku gamers. That's just to explain, why the updates are not rolling in as often as they used to. Anyway, when my schedule allows for it, I want to make a complete write of the underlying algorithms to allow players invoke various types of hints, like: find all naked pairs, ... Also the generator deserves some care. I should at least be able to differentiate between easy and medium puzzles.

Originally published at wordpress, 2009-10-5.

Testing the syntax highlighting

So it looks like I am ditching wordpress and coming back to Google for one simple reason: I cannot make wordpress decently display source code. This post is just to test that it can be done: What about some python? Now I would like to give credit to Alex Gorbatchev for his Syntax Highlighter and Carter Cole for his explanation how to use it in blogger.