Oct 22

Raindrop announced; Hacking your email again; Getting personal

Bespin, Mozila, Tech with tags: 2 Comments »

I am really jazzed to see the work of the Mozilla Messaging team (Andy Chung, Bryan Clark, Dan Mosedale, David Ascher, Mark Hammond, and James Burke) out there.

Raindrop was so exciting to me, as it allows me to take ownership of how I handle communications.

Gmail is fantastic in that I have been able to extend my experience via Greasemonkey and the Labs tweaks, but it isn’t really open to me.

With Raindrop, you not only get to scrape out some flexibility in the client, but you get to do it the entire stack down. You can write code that changes BOTH frontend and backend. Have you ever wanted to do more than simple filters? Write handlers for particular content in an email? Help you mashup your email in any way? Raindrop will give you that.

It is early days of course. Mozilla is known for getting something out there early so the community can influence it, so jump in.

I am also excited to see that you can hack on things right int he client via an embedded Bespin. Awesome, I can’t wait to see what happens next guys!

There are a slew of interesting videos to check out too:

Oct 12

Chrome Win Size; Playing with Chrome extension mechanism

Google with tags: , No Comments »

I have been watching the work of Aaron and the Chrome Extensions team for awhile. I love that with that effort and Jetpack we are going to see extension creation made simpler and more approachable for Web developers.

I realized that I hadn’t written a Chrome extension, so I wanted to try it on for size. I thus created an incredibly simple extension that tells you the size of the window on the fly: Chrome Win Size.

chromewinsize

In an ideal world this extension would be as easy as:

  • Create a bit of HTML for the tooltip
  • Attach an onresize handler to the window that changes the HTML

Unfortunately, it wasn’t quite that easy…. but it was pretty close. The only difference involves the fact that you can’t easily get the window object to resize.

Here is the entire extension to show how simple it is:

Web page for the tool strip

For now, I wanted to put the windows size information in the toolstrip. This isn’t ideal, especially if you don’t have other extensions that turn on the toolstrip. It could be nicer to either: have a subtle grey width/height in the background of the URL bar itself; show the info only when a certain keystroke is pressed. That is all for version 0.2 :)

As you will see below, the extension is just a Web page, and the toolstrip is just a div. You could use class="toolstrip-button" but for now a click doesn’t do anything, so I didn’t use that. Instead I have a title attribute that uses plain English to explain the info.

Once you have the HTML itself, you also have some JavaScript to do the work. The init kicks things off the first time, but the interesting code is the chrome.extension.onConnect.addListener piece that sets up the extension so that a content script can talk to it via postMessage.

<html>
<head>
<script>
 
// Query the current window (anyone will do) and set the window size in the toolstrip
function showDimensions() {
    chrome.windows.getCurrent(function(w) {
        var el = document.getElementById("windowsize");
    	el.innerHTML = w.width + " x " + w.height;
    	el.setAttribute("title", "width: " + w.width + "px, height: " + w.height + "px");
    });
}
 
// Listen to the content script and when told there is a change, query again
chrome.extension.onConnect.addListener(function(port, name) {    
  console.assert(name == "resize");
  port.onMessage.addListener(function() {
      showDimensions();
  });
});
 
</script>
</head>
<body onload="showDimensions()">
  <div id="windowsize"></div>
</body>
</html>

Content Script

Why do we need a content script? Ideally, we would be able to grab a window in the extension and add a resize listener to it and be done. That isn’t the case right now though. In the code above, the window object that we get in w from chrome.windows.getCurrent(function(w) {... isn’t a DOM Window, but just something with a few properties (width, height, etc).

To get an actual DOM window, we need to inject a content script and have that talk to the extension. The code is as simple as below… which does the postMessage() back to the listener that we setup in the extension:

// When the window resizes send a quick message to the extension
window.addEventListener("resize", function() {
	chrome.extension.connect({name: "resize"}).postMessage();
}, false);

Manifest

Now we need to put it all together and that is where the manifest comes in. It is here that we tell Chrome where the files are for the toolstrip and content script, and what permissions they have (e.g. give it the tabs permission), as well as metadata:

{
  "name": "Window Size", 
  "version": "0.1",
  "description": "Displays the size of the main window",
/*  "icons": { "128": "gmail-128x128.png" }, */
  "permissions": [
    "tabs"
  ],
  "toolstrips": [
    "winsize.html"
  ],
  "content_scripts": [
    {
      "matches": ["http://*/*", "https://*/*"],
      "js": ["contentscript.js"]
    }
  ]
}

Caveats

Even with the content script hack, it is pretty easy to do this kind of thing. It would be nice to do more with the window object as the hack has limitations beyond the extra code. For one, if you are on a page such as chrome://extensions/ nothing kicks in (due to the matching). Rather than matching on pages for content scripts to embed, it would be much better to declare that you care about windows themselves.

The toolstrips themselves are a little bulky and ugly, at least on Chrome for Mac (which is very much in beta) and as mentioned earlier…. unless you are using a bunch of extensions, it feels very unChrome-like to use that space.

FYI: To package an extension on Mac/Linux use this handy script as the built-in functionality isn’t there yet.

All in all a decent experience already. Really nice to just work on an HTML document to kick out the functionality. The idealist in me would love to see Jetpack and Chrome Extensions coming together so Web devs had One Way to extend the platform…… The Web is in a fortunate position to have folks like Aaron Boodman, Aza Raskin, Atul Varma and many others on the case of Web extensions.

Oct 06

An intense couple of weeks; Palm Developer Program announced

Palm, Tech 17 Comments »

launchingprogramwithben

The first couple of weeks at Palm have been a whirlwind. We wanted to get a developer program out there, and it happened in short order! Add to that the fact that I had the fortune to see a beautiful new son come into this world. Phew. I need to get my breath back.

Ben and I were incredibly excited to be able to come out with a program that gives a glimpse of our vision. In a kick-off event at the Mighty club, we got to share the vision, along with the details. For the nuts and bolts read here, but for some thoughts on the vision and key elements, read on:

We told the story of why we are so excited about Palm and the mobile Web as a-whole right now. It feels like there is a real convergence happening between: the fact that the mobile device hardware has become the hitchhikers guide to the galaxy, or so it feels; and knowing that browser runtimes have finally become application runtimes. There is a lot of room for both of these technologies to grow, but we have reached a good place already. What’s now happening is that we’re bumping up against the browser sandbox like crazy and we’re all trying to expand out what’s possible on the web. We’re doing this because for all its warts, many of us see in the web the potential to be The Platform that we can use across all of these emerging devices to bring sanity to application development. Imagine a world where you can develop Web applications that you can deploy to a plethora of devices and form factors. We have a real opportunity to make this world a reality, and it will take the entire Web community to make this happen.

What about the program itself?

We announced tonight that we’ve decided to free developers to release and market their applications via the web. When you decide to release your app, it is assigned a URL that you can distribute any way you like. With that URL, the user can install the application on the device. With this mechanism, you skip any review process and get a direct conduit to your users.

But for those who want the catalog experience, we’re investing heavily in the creation of a fantastic application marketplace–one that we carefully manage and organize, and where we review each application. There’s so much innovation that can happen here in terms of providing promotional opportunities for your applications and in making them discoverable, and we’re thrilled to be playing in this space.

We going to charge $50 for each app you submit to this catalog, recognizing its value as a distribution channel and as a friction point to control the flow of apps into it.

We actually want the web to win for distribution. We want to see people innovate in marketing their applications themselves and solving the app discovery problem.

To facilitate that discovery, we’re making raw feeds of all the applications available to help you create your own catalogs of applications. We can’t wait to see what people come up with here, and we’re confident the result will strengthen the app ecosystem.

Open source developer program

Almost every line of code I have written for the last 4 years or so has been open source. The Web itself stands on the shoulders of open source (Mozilla, WebKit, Apache, Dojo, jQuery, etc) and it only felt right that we should have a program for open source developers and projects. If your webOS application is released under open source, the $99 program fee is waived.

This is just the beginning. We are hopeful that a vibrant open source community will grow around the mobile Web and Palm. I would love to see tools and services that help make this happen.

The feedback that we have already gotten has been fantastic. We have gotten great ideas on what we should be doing with the platform itself as well as the program. Not that a vision is set, it is time to build on today’s actions by continuously making good decisions for the community. When Palm brought Ben and I into the fold, they indirectly brought in the Web community that we love to be a part of.

Ok, I have gotten little sleep due to a lovely new baby, and a fantastic new opportunity at work. Now it is time to close the laptop, rest up, and work with you to create some kick arse Web apps for devices.

I want to thank the hard work of my new colleagues at Palm who made this happen in short order, and also the great crowd of Web hackers who came together to help make tonight such a fun event. I can’t wait for the next one, and to keep talking.

What do you want to see from us next? Also, if you are excited about the mobile Web and what we are doing, our group is hiring fast and we would love to have passionate advocates who love the technology as well as working with all kinds of developers!