Julien Desrosiers

Freelance Web developer.

Image uploader script

The problem

I always need to send people screenshots. For this, i used to use LittleSnapper to publish the screenshots on my server (at http://s.juliendesrosiers.ca/*) for other people to see them.

It worked great, but for the sake of learning bash, and because i love to make my own things, i made a small Automator script to accomplish this simple task.

The script

filename=$(basename $1)
public_url="http://s.juliendesrosiers.ca/$filename"
scp $1 tannant:/home/deploy/apps/s_juliendesrosiers_ca/$filename
/usr/local/bin/growlnotify -m "Uploaded: $public_url"
echo $public_url | pbcopy

Explanations (and things to modify)

The first line takes the base name of the file’s name (for example, instead of /home/user/julien/myfile.jpg, it would be myfile.jpg only)

filename=$(basename $1)

Create a variable that will hold the full publicly accessible path, with the file name. Change s.juliendesrosiers.ca for your own web address.

public_url="http://s.juliendesrosiers.ca/$filename"

scp will copy the file from its local location (in your computer) into your remote server (in my case, “tannant” is simply an ssh shortcut for this host, but in your case, you’re likely to replace this for something like “youruser@yourhost.com”). You’ll also want to modify the remote path (/home/deploy/etc…) to reflect the directory structure of your own server.

scp $1 tannant:/home/deploy/apps/s_juliendesrosiers_ca/$filename

The following line will notify you that your upload worked successfully. For this line, you’ll need to install Growl, along with it’s command line utility “growlnotify”. With homebrew, it’s only one brew install growlnotify away.

/usr/local/bin/growlnotify -m "Uploaded: $public_url"

Last but not least, we put the newly-uploaded image’s public address into the clipboard.

echo $public_url | pbcopy

Now the Automator part

  1. Open Automator
  2. File > New > Application
  3. In the actions library, choose “Execute a shell script”, and drag it into the right panel.
  4. In the “input data” select at the right, choose “as arguments”, or something like this (i have the french version).
  5. In the big text field, paste your big (modified to your needs) command.
  6. Save. On your desktop, or in /Applications, or whatever.

Usage

Upload an image

Just drag your images or screenshots over to the Upload Automator script’s icon to upload them to your server and wait for it to return your public URL.

Note

Please note that if you want people to see your uploaded files on your server, you must serve them with a Web server (Apache, nginx, etc). This is outside of the scope of this post.