bit.lyify – A bit.ly extension for Safari 5

» 09 June 2010 » In development, tech »

Safari 5 was released yesterday, and with it came extensions – YEY. So I decided to see how easy it would be to create a simple extension for everyone’s favourite URL shortening service – bit.ly.

Turns it it was super-dooper simple. In fact, the obligatory home page took about twice as long to build as the extension!

Here’s the code (a bit stripped down), which is placed in a script block within the global HTML file. Feel free to poach, abuse or point out improvements:

    // Handle context menu command
    function handleCommand(/* Command */ event) {
        if (event.command === "net.telliott.bitlyify")
            var currentTab = safari.application.activeBrowserWindow.activeTab;
            var url = currentTab.url;
            
            if (typeof url !== "undefined") {
                minimize(url);
            }            
            else {
                alert("There was an error processing your request. Could not find the URL of the current tab.");
            }
    }
        
    function minimize(/* String */ url) {
        var request = new XMLHttpRequest();
        var login = safari.extension.settings.getItem("login");
        var apikey = safari.extension.settings.getItem("apikey");
        
        if (login == null || apikey == null) {
            alert("You must have an bit.ly login name and API Key to use this extension. See http://bit.ly/ for more information");
            alert("login: " + login + " apikey: " + apikey);
        }
        else {
            var encodedUrl = escape(url);
            var showInfoTab = safari.extension.settings.getItem("showInfoTab");
        
            request.open("GET", "http://api.bit.ly/v3/shorten?login=" + login + "&apiKey=" + apikey + "&longUrl=" + encodedUrl + "&format=txt");
            request.setRequestHeader("Cache-Control", "no-cache");
            request.onload = function() {
                var status = request.status;
                
                switch(status) {
                    case 200:
                        var minUrl = request.responseText;
                        if (showInfoTab === true) {
                            var newTab = safari.application.activeBrowserWindow.openTab();
                            newTab.url = minUrl+"+"
                        }
                        alert('Your minified URL is ' + minUrl);
                        break;
                    default: 
                        alert('Oh Noes, there was a problem with your request: We received status ' + status + ", " + request.responseText);
                        break;
                }
            }
            request.send();
        }        
    }

    // Listen for the context menu command
    safari.application.addEventListener("command", handleCommand, false);

There are a few extensions I’d like to add to this, particularly getting rid of all the alert()‘s, but for half an hours work I’m pretty pleased :)

The API seems really nice and well thought out (so far, I’ve not tried to do anything complicated) – particularly adding settings. Really simple and works really well IMO. Setting up auto-updating extensions should be a breeze too, although I’m not convinced I’ve got it working quite yet (for once Apple have failed at UX design here. The extensions section in Safari preferences has a box which tells you if updates are available for your extensions, but doesn’t seem to give any indication of if and when it’s gone off to find an update, if it failed to parse the update.plist file or to allow you to force look for an update. So I’m left in the dark as to whether or not it’s actually working – but I’ve had an update sitting there for half an hour without being told about it).

Also I think I’ve found a bug. On any Google site (and only Google sites, out of the 10 or so big name sites I’ve tried) the SafariBrowserTab instance doesn’t have it’s page or url properties set, meaning you can’t sniff the URL or access the SafariWebPageProxy. Very weird. I’m going to do some more investigations and will raise a bug with Apple if I think it’s needed.

Until then, enjoy bit.lyify, but don’t try and use it for Google sites :(

Tags: , ,

Trackback URL

4 Comments on "bit.lyify – A bit.ly extension for Safari 5"

  1. mrtom
    Samic
    21/11/2010 at 1:40 pm Permalink

    Great article.

    I have try to develop an Safari extension but I have the same problem to get the current tab URL (url is undefined). Did you found a solution?

    Thanks,

    Samic

  2. mrtom
    mrtom
    21/11/2010 at 11:21 pm Permalink

    Thanks Samic.

    Unfortunately I’ve not looked at this since I posted the original post. It’s on my todo list but it works well enough for now. I’ll you know when (if) I figure this out.

    Glad you liked it!

    Tom

  3. mrtom
    Alois
    24/01/2011 at 4:16 pm Permalink

    @ Samic

    I had the same problem and i stumbled over this in the apple/dev:

    “Note: Be sure to set your extension’s website access to Some or All in Extension Builder before working with tabs—most tab properties return undefined unless your extension has access to the domain of the URL loaded in the tab.”

    Solved the undefined problem for me.

    Greetz!

  4. mrtom
    mrtom
    24/01/2011 at 4:56 pm Permalink

    Cheers Alois, I’ll be sure to have a play with this too…

    Not sure why it worked on other sites tho. It’s been a while since I looked at this, I’ll have to remind myself what was/wasn’t working.

    Thanks for the tip!

    Tom

Hi Stranger, leave a comment:

ALLOWED XHTML TAGS:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Subscribe to Comments