From the Modernizr source:

var uc_prop = prop.charAt(0).toUpperCase() + prop.substr(1)

I relied on jQuery to handle getting and setting scroll position in BeerCamp 2011, but after taking another look, its pretty easy to do with modern browsers.

// get scroll position
var x = window.scrollX,
    y = window.scrollY;

// set scroll position to x: 140, y: 700
window.scrollTo( 140, 700 );

You might see pageXOffset and pageYOffset, as these properties are the same as scrollX and scrollY. Old IE doesn’t support either.

⌃⇧N (Ctrl + Shift + N) for word count in TextMate.

I’m finding that Flash content inside an element with a CSS transform is a bit buggy across browsers, even for a simple 2D translation translate(20px, 50px). Safari sometimes renders the content, in the example below, the YouTube video is offset. Firefox 4 doesn’t render anything. Chrome and Opera seem to be fine.

View example on jsFiddle

Over the past couple weeks I’ve tried to build a Tumblr / GitHub Pages bridge. It ain’t perfect, but I’m happy with the result. See http://desandro.github.com/dropshado.ws or view the source dropshado.ws on GitHub.

Why bother

I like Tumblr because:

• tags
• hosted externally
• simple templating

I don’t like Tumblr because:

• Have to use web interface to post
• constant outages

If I had to do this blog all over again, I’d use GitHub Pages because:

• lives in TextMate
• Already integrated into GitHub

I discovered the Tumblr Gem which allows me to post content via the command line. So all new content can live on my hard drive.

Now when I publish a post, I run the tumblr Terminal command on a new file. Me likes.

Tumblr API

This prompted me to retrofit all the previous content and back it up locally. There is a Tumblr Backup desktop app, but this generates HTML pages, as opposed to exporting raw content and data.

To get the old content, I built a simple page that pulls in the data from the Tumblr API.

<script src="http://dropshado.ws/api/read/json?filter=none"></script> 

This content was formatted so I could copy / paste it into a new file. Certainly a hack, definitely not the best way to do it, but it worked for me.

Building the Jekyll twin

Since the format of plaintext post for the Tumblr Gem needs to be in YAML, it made perfect sense to generate the site using Jekyll, and then serve it on GitHub Pages. Benefits being:

• View site locally
• Preview new posts locally
• Have a back-up of content when Tumblr is hungover and MIA
• Host asset files on GitHub Pages

The result works, but it isn’t quite a flawless match:

• Markdown content like link description or quote content doesn’t get parsed as Markdown because the Tumblr Gem needs this content to be in the YAML front matter.
• Tags are broken

For now, I’ll stick with this gitted Tumblr workflow so I can be productive posting productivity posts. Eventually, I’d like to make the switch to GitHub Pages, but it ain’t gonna be easy because GitHub Pages does not support any mechanism for 301 redirects. Nor does Jekyll have an easy solution for tags.

Using .slice() with a negative index will return characters from the end of the string.

'alphabet'.slice(-3)
// returns "bet"

I’m using it to grab a file extension from an image URL. A regular expression is more reliable and flexible, but this is quick and easy.

My desktop gets messy. This cleans it up a bit, grouping items by filetype, folders first.

With the desktop focused: Finder › View › Arrange By › Kind. Or by key command ⌘⌃5

Looking into triggering events without jQuery. Turns out you can just use some events as methods, for example .click() or .blur(). I’d love to find a listing reference for these methods, but haven’t found one yet.

I’m using .blur() to dismiss the iOS keyboard once a text input has been focused.

var input = document.getElementById('input'),
    button = document.getElementById('button'),
    onClick = function(){
      input.blur();
    };

button.addEventListener( 'click', onClick, false);

See fiddle: trigger blur to dismiss iOS keyboard

Again, via Phil Dokas.

Hold Control with Cmd+Shift+3 or 4 and your screenshot will be copied to your clipboard without generating an image file on your Desktop. Paste right into Photoshop.

Phil Dokas followed up with:

⌘⇧4, click + drag to make a selection without releasing, now hold down the spacebar and move the cursor.

…

If you instead hold down spacebar + shift, you lock one axis of movement.

After triggering screen capture with ⌘⇧4 (Cmd+Shift+4), you can use additional keys like in Photoshop. Holding down Shift (⇧) will keep lock one dimension, for changes to only the vertical or horizontal dimension. Holding down Option (⌥) will cause the overlay to be sized symmetrically.

Tested only OS X Snow Leopard. Not sure about earlier versions.