Profile cover photo
Profile photo
Jeffrey Chan (Goofrider)
Jeffrey's posts

Post has attachment
Girl @ OccupyHK Govt HQ

Post has attachment

Post has attachment

Post has attachment

Post has attachment

Post has attachment
So far the best Github repo recommendation tool

Post has attachment

Post has shared content
Got a working version of a chrome and firefox extension I'm developing to bring the sublime text command palette to the web browser. At the moment it adds all of your bookmarks and links on the current page to the palette. You can bring up the palette with a short keycombo and then start typing.

Never leave the keyboard for the mouse!

Post has shared content
Todo.txt Chrome App/Extension Postmortem-like thing

Problem: I use Todo.txt all the time to help me get things done but I wanted to use it from Chrome OS.

Solution: Make my own Chrome app for Todo.txt.

Instead of going a Wunderlist type of presentation, I decided to stay true to the original Todo.txt CLI version and create an emulated terminal(adapted example from HTML5Rocks). Besides modals to confirm deletion of tasks and select files, everything can done on the command line. 

You can check out the code here:

Current Features:
- Basic file syncing using
- Add tasks
- Remove tasks
- Mark As Completed
- List tasks
- Limited search capabilities
- Archive
- Lately plugin

Screenshots of app attached.

Security policy stuff
Sorting of tasks by priority
Full text search
Apply color to prioritized tasks
Implementing other core commands (p, depri, etc)

Technical Details:

I started shortly after I bought a new ARM Samsung Chromebook in December 2012 and it was originally planned as a Chrome packaged app. The new Chrome Packaged App spec supports OAuth2.0 fairly well but OAuth 1.0a isn’t so fun. The official Todo.txt clients use Dropbox for file storage. Unfortunately, it uses OAuth 1.0. 

I was eventually about to get file download working but none of the js OAuth wanted to work with file upload. Next, I decided to test out as its marketing says it’s easier to integrate.

One of the nits with using with a packaged app is that the JavaScript library injects an iframe to do communications. This is expressly against the content security policy (CSP) listed below which restricts embedded iframes. 

frame-src 'self' data: chrome-extension-resource:;

Running the filepicker script in a sandboxed page allowed me to progress a little further but still failed due to CSP. Extensions don’t have that restriction so I decided to temporarily change it to a Chrome extension that surfaces a new tab. Luckily, I wasn’t using any app-specific APIs besides chrome.runtime as an entry-point so moving it to an extension was just a matter of designating a browserAction and swapping out a couple lines of code.

Once the CSP issues were settled, it was a breeze to setup When you select a file to use with your app, uploads it to S3 and creates a URL for it. Any writes to that file will generally propagate back to the original source. So if I decided to move my todo files to Google Drive, I would need new URLs but I could use the same API calls. 

The URLs that generates are public. They seem to be reasonably randomized but if I were doing a production app, I’d make sure I set up some security policies (which does support) to prevent unauthorized access. It should be noted that Dropbox is well supported in the extension space.


Yeoman was helpful in generating JS from all the CoffeeScript code and the server command that could watch for changes was clutch. 

Looking back, I'm glad that I kept the Chrome Packaged App features siloed so that it was easy to port to an extension. Once Dropbox gets their act together, I can make it a full packaged app again.
4 Photos - View album
Wait while more posts are being loaded