Command Line Tumblr

engineering:

A Totally New Interface for Tumblr?

Today, Tumblr is accessible via mobile, web or api—but what if you’re a linux enthusiast? Nerds like you can now access Tumblr completely via command line.

“What about images?” you ask. Displaying an image in command line is not something new. There are already a bunch of existing libs doing this, namely aalib, libcaca and super low level ncurses. And the most interesting project built based on those—p2p video chat—comes from a hackathon.

I picked up a much higher level library called blessed, for least efforts to achieve a best looking interface. As you may seen, blessed is javascript-based and very fancy. It provides you with almost every widget you might need to build an awesome dashboard.

Most of the work has already been done after figuring out the right library, to show tumblr in command line, we just need to

  • Connect the api to fetch image urls.
  • Do some front-end design to show a Tumblrish dashboard.

What? Still need codes?…

var post = blessed.box({
    parent: dashboard,
    top: '15%',
    left: 'center',
    width: '40%',
    height: '80%',
    draggable: true,
    border: {
        type: 'line'
    },
    style: {
        fg: 'white',
        bg: 'white',
        border: {
            fg: '#f0f0f0'
        }
    },
});

var load_post = function() {
    if (index < 0 || index >= posts.length)
        return;

    post.free();
    var post_data = posts[index];
    /** avator */
    blessed.ANSIImage({
        parent: post,
        top: 0,
        left: '-30%',
        width: '20%',
        height: '20%',
        file: post_data.avator,
    });

    /** posts */
    var count = post_data.count;
    // TODO: switch all sizes
    for (var i = 0; i < count; i++) {
        var offset = 100/count * i;
        var width = 100/count;
        blessed.ANSIImage({
            parent: post,
            left: offset + '%',
            width: width + '%',
            height: '98%',
            file: post_data.data[i]
        });
    }

    screen.render();
}

Blessed already provided lots of high level apis. As an example, to display a post as an image, all your input is just an image url, and call

blessed.ASNImage({
    ...
    file: image_url/local_file
})

It supports png and gif, and even, if you’d like to show a video, blessed also provides video. Hypothetically speaking, we can use this library to build almost all components in the dashboard of Tumblr today. Note, it’s not connecting the real api, but I suppose that would be pretty easy. Also there’s a memory optimization issue might need to be addressed if we really want to use this library for something.