Javascript/Firefox: context menu popup

Note: This solution has some side-effects. A better one is provided in my another post here.

The context menu of Firefox behaves differently between the Windows and Linux platform. On Linux, the context menu pops up as soon as you press down the right button of the mouse; While on Windows, it shows after you press down and release the right button.

We can change the Linux style behavior by doing a little hack.

1. Capture the mousedown event and suppress the context menu.

1.1 Capture the mousedown event

addEventListener("mousedown", myMouseDown, true);

function myMouseDown(event)
{
   if (2 == event.button)
   {
      // Capture the pop-up event of the context menu.
      addEventListener("popupshowing", myNoContextMenu, true);
   }
}

1.2 Suppress the context menu

function myNoContextMenu(event)
{
   // Prevent the default action, i.e. popping up
   event.preventDefault();

   // Remove the event handler because we don't want to mess up the
   // popupshowing events triggered by others.
   removeEventListener("popupshowing", myNoContextMenu, true);
}

2. Capture the mouseup event and pop up the context menu.

1.1 Capture the mouseup event

addEventListener("mouseup", myMouseUp, true);

function myMouseUp(event)
{
   if (2 == event.button)
   {
      myShowContextMenu(event);
   }
}

1.2 Pop up the context menu

function myShowContextMenu(event)
{
   if (navigator.platform == "Win32")
      return;  // on Window context menu is already shown on mouseup.

   document.popupNode = event.originalTarget;
   var cm = document.getElementById("contentAreaContextMenu");
   cm.openPopupAtScreen(event.screenX, event.screenY, true);

   // Cancel the event.
   event.preventDefault();
   event.stopPropagation();
}

Linux: search pattern in files

If you want to search a string (e.g. "TheString") or a pattern in all the files under the current directory, you know you can use:
        grep TheString *

It will not search the files under the sub-directories.

When I wanted to search all the files under each directories recursively, I don't know why but, I did this:
        find . -type f | xargs grep TheString
     or
        find . -type f -exec grep -H TheString '{}' \;

Until recently I found that I could do much less typing:
        grep -r TheString *

Is it because grep did not have the -r option in the old days?

Firefox Extension: Take A Break

Addicted to the Web? Don't compromise your health! Continuously staring at the computer can cause headaches, blurred vision, neck pain, fatigue, dry eyes. Take A Break extension tries to help you avoid or reduce these problems. It reminds you when to take a break while you are surfing the Web.

Features
- A little icon on the status bar will be flashing every 15 minutes to remind you a short break. You should sit back and close your eyes, or look outside the window for a while.

- A pop-up dialog will remind you a big break every hour. You should stand up, get a cup of coffee, do some stretching, or go freshen up.

- You can adjust the timers according to your own needs.

Installation
Download and install it here: https://addons.mozilla.org/en-US/firefox/addon/45343

You will need to restart the Firefox browser after the installation.

After the Firefox browser restarts, you will see an icon of a green clock on your status bar. If your status bar is hidden, you could show it by selecting menu View->Status Bar.

How does it work
- The clock icon on the status bar will be flashing in red and yellow every 15 minutes to remind you a short break.

-- Take A Break extension is on.
-- Icon is flashing and reminding you to take a short break.

- A pop-up dialog will remind you a big break every hour. The pop-up window will be automatically closed after 5 minutes. You can click on the colorful text to close it, too. Clicking on the URL will bring you to more Firefox extensions I made.

- A click on the clock icon will switch off and on its function. If the function is turned off, the icon is in gray.

-- Take A Break extension is off.

- Right-click the icon and you can select to open the Options dialog. Here you can adjust the timers to meet your own needs. See the next section for the meanings of the options.

- Move the mouse over the icon and you can see when the next break will come.

- Of course, you can also open the Options dialog through the menu: Tools->Add-ons->Extensions, and click on the Options button of this extension.

Options setting

- Enable Flashing: enable/disable the feature of icon flashing. If it is not checked, the following two timers of Flashing Interval and Flashing Duration are ignored.

- Flashing Interval: the time between two flashing. You can set a value between 1 to 999 minutes.

- Flashing Duration: the duration of the flashing. You can set a value between 1 to 999 seconds.

- Enable Pop-up Reminder: enable/disable the feature of pop-up reminding. If it is not checked, the following two timers of Rest Interval and Rest Duration are ignored.

- Rest Interval: the time between two pop-up reminding. You can set a value between 1 to 999 minutes.

- Rest Duration: after this long, the pop-up window will be closed automatically. You can set a value between 1 to 999 minutes.

- No reminding if idle for XXX min: if checked, you can inform the extension that XXX minutes of no mouse movement means you are not browsing. So that the extension would temporary stop when you had left your desk.

You can click on the Restore defaults button to restore all the timers to their default values.


---
If you think this extension is helpful, please share it with your friends.

• Digg this!
• Post to Facebook
• Add to Delicious
• Post to MySpace
• Share on FriendFeed
• Post to Twitter

Google Docs - spreadsheet - set formula for a whole column/row

If you want the column C to be the sum of column A and B, i.e.

   C1 = A1 + B1

   C2 = A2 + B2

   C3 = A3 + B3

   ...

you don't have to click on each cell of column C and add the formula repeatedly. Instead, you can:

1. Set formula for cell C1. And press the Enter button.

2. Select cell C1. You can see a little blue square at the bottom-right corner.

3. Move the mouse over the little blue square until it becomes a cross. Click down and hold the left button (or right button if you are left handed). Drag the little blue square all the way down to the last cell of column C.

4. Now you can see that all the cells of column C are correctly set as the sum of the corresponding cells in column A and B.

Untrusted Connection error of softmoc.com

If you tried to buy stuff at https://www.softmoc.com with Firefox browser, you might encounter the error saying "This Connection is Untrusted". The Technical Details reveal that --

    www.softmoc.com uses an invalid security certificate.

    The certificate is not trusted because the issuer certificate is unknown.

    (Error code: sec_error_unknown_issuer)

You know SoftMoc is a reputable company that you can trust. But the "Add Exception ..." looks scary and you are not sure about doing it.

Here is the safest way to let you use this site worry-free.

The Reason
(skip this section and go directly to the solution if you don't care about the technical details.)

The reason why you have encountered such an error is that to encrypt their transactions, softmoc.com use a certificate signed by a Chained/Intermediate Certificate from VeriSign (one of the major certificate authorities). This Chained/Intermediate Certificate is named VeriSign Class 3 Secure Server CA - G2. By default, it is not added to Firefox's Certificate Manager. However, if the website were configured properly, it would send the whole certificate chain to Firefox so that Firefox could trust the Chained Certificate. Apparently, softmoc.com is not properly set up.

The good news is that Firefox can automatically add those intermediate certificates it trusts. So if we have ever visited a website which properly uses the certificate of VeriSign Class 3 Secure Server CA - G2, our Firefox would know this certificate is good. Consequently, Firefox would trust softmoc.com. I have done a little search and found the website that correctly uses this missing intermediate certificate.

The Solution

Go to one of the web page of the famous Sun Microsystems company: https://getupdates2.sun.com/. The web page will prompt you a dialogue to ask for user name and password. We don't want to do anything with this website, so just click the Cancel button. After that, the required issuer certificate is known and added by Firefox.

Now you can enjoy your shopping at softmoc.com.

Capture screen shots with Windows Vista Snipping Tool

In the old days, if you want to capture some pictures on your screen, you have to use the Print Screen button of your keyboard and save the image from the clipboard. Now, if you are using Windows Vista Home Premium edition, or other editions of Business, Ultimate or Enterprise, you can use the free Snipping Tool to capture screen shots.

The Snipping Tool can be accessed from the Start button at the desktop's left-buttom corner: All Programs->Accessories->Snipping Tool.

If you are like me who could not see it, you should add it via the Control Panel: select  Programs->Programs and Features->Turn Windows feature on or off (you need Administrator privilege to do it). In the dialogue, check the Tablet PC Optional Components.

Now you have the Snipping Tool installed.

See? We should not blame ourselves not having this useful tool installed. Who would know that a regular PC should install Tablet PC optional components? I guess only Microsoft knows.

GTA major cities MLS listing number trend (chart)

Updated daily.

Only shows 3+ bedrooms detached houses in some cities with a price range.



Note: Data or chart should not be used for making any kind of decisions. They are collected in a random time of a day and may not be accurate.

Reference

Toronto(below 350k)	Brampton(below 350k)	Vaughan
Mississauga(below 500k)	Brampton(350k-450k)	Richmond Hill
Mississauga(500k-1m)	Brampton(over 450k)	Markham
Mississauga(over 1m)

GTA resale home price trend (chart)

Updated twice a month.

Learn how to create a Firefox extension in 10 minutes

Note: This article explains the source code of  Simple Boss Key version 1.0.1, not the latest version.

Is it complicated to create a Firefox extension? No. After reading this little tutorial, you will see how easy it is. Here I am using the Firefox extension of Simple Boss Key I built as the example to show you how simple a Firefox extension could be.

The Simple Boss Key extension add a shortcut key F12 to the browser. You can download the extension from Mozilla Add-ons website.

The Firefox extension package file has a filename extension of .xpi. You can extract it with WinZip, WinRAR, or the zip command if you are using Linux. If you extract the Simple Boss Key extension, you would see there are only a handful files in the package. Some of them are necessary, the others are optional.

Essential files

• install.rdf
• chrome.manifest
• chrome/content/simplebosskey.xul

Optional files

• chrome/content/options.xul
• chrome/skin/sbk.png

These two files help to make the extension more user-friendly. They can be neglected.

install.rdf

This file contains the information and description of the extension. You can start it from a template on Mozilla developer website.

<?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>simplebosskey@ttt-jl.blogspot.com</em:id>
        <em:name>Simple Boss Key</em:name>
        <em:version>1.0</em:version>
        <em:description>Press F12 to minimize your window.</em:description>
        <em:creator>James L.</em:creator>
        <!-- optional items -->
        <em:homepageURL>http://ttt-jl.blogspot.com/</em:homepageURL>
        <em:optionsURL>chrome://simplebosskey/content/options.xul</em:optionsURL>
        <em:iconURL>chrome://simplebosskey/skin/sbk.png</em:iconURL>
        <em:type>2</em:type> <!-- type=extension --> 

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

</RDF>

The file is pretty straightforward, you just need to fill in your own data to the fields I highlight.

chrome.manifest

This file tells where your code is.

content simplebosskey chrome/content/
skin simplebosskey classic chrome/skin/
overlay chrome://browser/content/browser.xul chrome://simplebosskey/content/simplebosskey.xul

The content line resolves the URI chrome://simplebosskey/content/, whose physical location will be chrome/content/. If you look again at the install.rdf file, you will know that chrome://simplebosskey/content/options.xul is pointed to file chrome/content/options.xul

The skin line resolves the URI chrome://simplebosskey/skin/, whose physical location will be chrome/skin/. So em:iconURL in the install.rdf file points to file chrome/skin/sbk.png.

The overlay line tells that the browser.xul file will be overlaid by chrome/content/simplebosskey.xul.

chrome/content/simplebosskey.xul

For more information of what XUL is, visit Mozilla developer website.

This file overlays browser.xul. In another word, it changes the default behavior of the browser. If you look inside the file:

<?xml version="1.0"?>

<overlay id="simplebosskey" 
         xmlns:html="http://www.w3.org/1999/xhtml"
         xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
   <keyset id="mainKeyset">

      <key id="sbkMinimizeWin"
           keycode="VK_F12"
           oncommand="gBrowser.selectedTab = gBrowser.tabContainer.childNodes[0]; setTimeout(function() { window.minimize(); }, 0);" />

   </keyset>
</overlay>

you can see it just does a little change to the shortcut key set. The rest of the browser's behavior remain unchanged.

The file defines a new behavior for key F12 whose keycode is VK_F12. The oncommand line defines what commads should be run when key F12 is pressed:

1. gBrowser.selectedTab = gBrowser.tabContainer.childNodes[0];
   Tell the browser to select/focus the first tab.

2. setTimeout(function() { window.minimize(); }, 0);
   Minimize the browser window. The function setTimeout() is used because we need to wait for the browser bringing the first tab to the front.

This file is the soul of the extension.

You can try different keycode to make your own shortcut key.

chrome/content/options.xul

This file implements the em:optionsURL of the install.rdf file. When the user click the Options button in the extension (from menu Tools->Add-ons->Extensions), em:optionsURL will be brought up. The options.xul file of our extension pops up a dialogue with some instructions of how to use the shortcut key.

<?xml version="1.0"?>

<?xml-stylesheet href="chrome://global/skin/global.css" type="text/css"?>

<dialog id="sbkOption" title="Instruction"
   xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
   buttons="accept">
    
    <dialogheader title="Simple Boss Key Instruction" />
    <description width="350" style="margin:10px">Press F12 to minimize the current browser window.</description>
    <description width="350" style="margin:10px">The first tab is focused so even somebody peeks at your taskbar, he may not know what you were browsing.</description>
    <seperator />
    <label style="font-size:1.2em; font-weight:bold">Tips</label>
    <description width="350" style="margin:10px">1. Open a work-related page on the first tab. When the window is minimized, the title of the first tab will be shown in the taskbar.</description>
    <description width="350" style="margin:10px">2. Work best with Tabbed browsing. In the browser's Options/Preferences dialogue, set "Tabs->New pages should be opened in:" to "a new tab".</description>

</dialog>

The <label> and <description> tags are called XUL controls.

You can use the XUL controls to create a verify complex options dialogue, like all the other fancy Firefox extensions. But my opinion is, life is already full of choices, that sometimes people would feel relieved if they were told there are no options. :)

chrome/skin/sbk.png

A small icon to make the extension look fancy.


Now, after we have all these files and directories created, just pack and compress them together with WinZip (or zip if on Linux). Then rename the zip file with a different filename extension xpi.

To install a Firefox extension locally, you can drag and drop it into Firefox Extensions dialogue (from menu Tools->Add-ons->Extensions). It is all done and you can now try your own Firefox extension!


If you think this article is helpful, please help to share the Simple Boss Key extension:

• Digg this!
• Post to Facebook
• Add to Delicious
• Post to MySpace
• Share on FriendFeed
• Post to Twitter

Firefox extension: Simple Boss Key

When people come over to your desk, maybe you do not want them to see what you are browsing. This extension helps you quickly minimize your browser to the taskbar.

When the key F12 is pressed, the browser will first bring the first tab to the front and then get minimized to the taskbar. If the first tab was opened with a serious page, its title would be shown by the Firefox's icon in the taskbar. So even somebody peeks at your taskbar, he could not tell what you were actually browsing.

This Firefox extension has been submitted to https://addons.mozilla.org/en-US/firefox/addon/14646.

After you install it, it will appear in the Extensions tab of the Add-ons dialogue (accessed from Menu Tools->Add-ons->Extensions).

The extension is very simple and does not need configurations. If you click the Options button, you will see a dialogue with brief instruction and tips.

Does writing a Firefox extension have to be complicated? This one gives an example of how simple it could be. You are encouraged to read and play with the code. Read my another post Learn how to create a Firefox extension in 10 minutes to see how I built it.


---
If you think this article is helpful, please share it with your friends:

• Digg this!
• Post to Facebook
• Add to Delicious
• Post to MySpace
• Share on FriendFeed
• Post to Twitter

---
Is the computer ruining your health? Try my new extension Take A Break.

GTA new home price trend (chart)

Updated monthly.

Privacy! The information your browser sends

You may be suprised to see how much information your browser reveals --



The code in this page only prints out the data and does not send it to anywhere. But some other web page can use the same code to gather these information. We can also see Firefox reveals less information than IE because it doesn't support some of those parameters. :)