Archive for category Useful Tools

So I’ve been busy

I haven’t posted in a while. And that’s not because I don’t enjoy my occasional screed against the FCC, or complaining about certain tech companies being jerks.

I’ve been working on this!

https://push-poll.com

PushPoll is an incredibly easy way to quickly ask a bunch of your friends a question and get an answer, summarized, and delivered right to you. We’re currently in Beta testing, which means that if you sign up now, you can start sending polls for free! We’ve also got an Android app that notifies you instantly when you have a pending response.

 You can also watch my lovely intro video:
And yes, we have an Android App, too.

Tags:

Parse and/or Backend-as-a-Service

So I recently wrote a response of our findings with Parse over at YCombinator News. Here it is, since it might be handy and will rapidly cease being available as the thread drops off. So here it is: Read the rest of this entry »

Mirror (Working Title)

Crowd-sourced online media responsibility, whether they like it or not


This is the project write-up for a little something I’m working on. I’d like to hear your feedback.


Executive Summary

There exists online many sources of information. Modern search engines do little to actually validate the information, they merely rank on the popularity of the information. This has given rise to a large number of articles consisting of nothing more than repetition and guesses.
Mirror gives users a way to quantify individual stories for their originality, accuracy, and value. When a user visits an article that others have rated, that rating shows up on the article, prominently displaying things like “Reprinted from elsewhere”, “Copy + Pasted Press Release”, or “Author Doesn’t Understand Subject”. This immediately alerts readers to the nature of the article, and they can then elect to continue reading, or go elsewhere.
Mirror runs as a browser plugin, laying a ranking on top of the page, and offering the user a chance to contribute. A “bookmarklet” function will also exist.
Mirror ranks users and weighs their opinion accordingly. Users who often agree with the general community consensus are rated higher, and their rankings count for more.

Read the rest of this entry »

A Slightly Enhanced TableKit

Hello one and all. Today’s bit of code: an updated and enhanced version of the popular JavaScript library TableKit, created by Andrew Tetlaw at Millstream. TableKit gives you the ability to turn any HTML table into a dynamic object, capable of being intelligently sorted by any column, resizable columns, and even in-place editing, by simply adding “sortable”, “resizable”, and “editable” to the table’s class tag.

I won’t go into extensive detail on why this is awesome. Here’s a little demo to play with though, to get the point. Click on column headers (in-line editing is not included for this, but you can find more about that at the link above):

First Name Last Name Age Teacher
Bill Smith 12 Thompson
Joe Cool 11 Wright
Amy Rogers 12 Wright
Susan Thompson 13 Greggs

After including prototype.js and tablekit.js, all I had to do was define the table like this:

<table class="sortable resizable" width="500">

At this point, the table should be sortable, and you should be able to resize the columns by dragging the barrier between the column headers. You’ll notice alternating row colors remain alternating. All the formatting (including sort color, the up/down arrows, alternating rows) are all defined as CSS properties, so you can modify them easily. We’ll get to the CSS later on.

While that’s cool (and it IS damn cool, admit it), it isn’t why I’m bothering to stay up late and write a post. I extended this library to give it a new property – “linkable”. It combines the “ConvertTableRowtoHyperlink” (CTRtH) script published a few years back and rolls it into the function of TableKit. The script will also scan all rows of a given table for the first link it comes across. It then creates a function which highlights the row on mouseOver, returns to previous state on mouseOut (preserving the pretty alternating colors created by TableKit). Clicking anywhere on the row will take you to the link. If it finds more than one link, it takes the one furthest to the left. Personally, I think lots of links in a single table isn’t the best plan, but if you want it to give up on rows with more than one link rather than picking the furthest left, there’s instructions on line 90 of the script on how to do this.

Added benefit! In the old CTRtH, you had to explicitly give the ID of each table, invoke separately, and ask the script to do the row conversion. This broke with a number of things, including AJAX updates (ended up including the JS in a partial on one project). Mostly though, it meant I couldn’t have a nice, clean table with TableKit and CTRtH running in tandem. So, I spent a flight from DC to Denver figuring out what was conflicting where, and getting the two to play nicely. Now you have an extended TableKit, which will also happily convert table rows to links when given the property “linkable”, like this:

<table class="sortable resizable linkable" width="600">


First Name Last Name Age Search Engine
Bill Smith 12 Google
Joe Cool 11 Yahoo
Amy Rogers 12 Bing
Susan Thompson 13 Google

Usage

Alright, down to business.

1) Download prototype.js and my new tablekit.js file. Include these in your header, ideally.

2) Make sure you add sortable, resizable, or linkable to the CSS class of any table you want to behave this way. You can give it an ID, but you don’t have to. However, like with many JS functions, if you have multiple elements with the same ID, you’ll only affect the first one. If you don’t give it an ID, one will be assigned in sequential order.

3) Here’s what you’ll need to add to your CSS to make it look like mine and behave as you’d expect. You’ll almost certainly want to change the colors, but other than that you should be good, I’ve tried to keep the CSS as minimal as possible so as not to interfere with your other stuff.. Notice the up and down arrows are also just background elements, so point them at your own up.png/down.png location.

/**********Table Sorting Stuff****************/

tr.rowodd {
}

tr.roweven {
    background-color: #F2F2F2;
}

tr.highlight {
    background-color: #F2F29F;
    cursor: pointer;
}

tr a{
    text-decoration: none;   
}

.sortcol {
    cursor: pointer;
    padding-right: 20px;
    background-repeat: no-repeat;
    background-position: right center;
}
.sortasc { 
    background-color: #DDFFAC;
    background-image: url(images/up.png);
}
.sortdesc {
    background-color: #B9DDFF;
    background-image: url(images/down.png);
}
.nosort {
    cursor: default;
}

th.resize-handle-active {
    cursor: e-resize;
}

div.resize-handle {
    cursor: e-resize;
    width: 2px;
    border-right: 1px dashed #1E90FF;
    position:absolute;
    top:0;
    left:0;
}

/********* END Table Sorting Stuff *********/

Tags: ,

Flickr and Picasa – Easy Photo Sharing

Those of you in a hurry can read the “17 Second Version” by scrolling to the end.

I’m gonna break with tradition and actually post something useful here, rather than my usual meandering ravings about how copyright extensions are harming innovation, or how your government is trying to give control of hardware you bought to a few powerful companies, despite that they didn’t build or sell it.

Nope, it’s a new year, it’s time to intersperse “practical” with “complainy-pants”. Thus I present the first in my new series of useful articles: How to easily manage and share your photos by combining two powerful tools: Flickr and Picasa. First, the components…

flickr_logo

Flickr is a powerful online photo sharing tool. I won’t go into it in too much detail, just why I use it to share my photos. Here’s the reasons I love it:

  • Storage – I can upload as many photos as I want. With the $25/yr premium account, I get unlimited storage and it even saves the full, uncompressed photos. This means people don’t email me asking for “originals” that they can download and print.
  • Control – I can set very specific rules around who sees what. I can hide everything from the world and share locked-down access to them. I can give out “guest passes” for specific galleries, or (if your friends use it) categorize as “friend” or “family”
  • Ease – 99% of the time, I take pictures of a trip or event and people wanna see them. Sending a link in an email that says “Click here for my photos from Scotland” is just stupid-easy. They can even comment on them, download them, etc.

There are lots of other services out there, but I like Flickr best. I also like the very open API. That might not matter to most of you, but when it comes to integrating into other things (like we’re about to do), it’s exactly what you want. So go ahead, sign up for a free Flickr account. If you’ve got a Yahoo! account, that works because Yahoo! owns Flickr. Once you’re all signed up, head to the next component…

picasa_logo

Picasa is one of Google’s little toys. Like most things, it’s free, as long as you don’t mind Google having a bunch of info. Me personally? I don’t so much. Basically, Picasa is a “collection manager”. It’s not a photo editor like Photoshop, though it does have a good amount of minor retouching tools. Picasa scans your hard drive and pulls out all the photos. It even tries to see if it recognizes people from photo to photo, and groups those. You can group by date, folder on your hard drive, etc. It does make it easier to look at all the photos and save the ones you want to share.

Again, I won’t go on and on about why it’s awesome. What I will say is that scans your hard drive and puts up a TON of thumbnails, making it easier to find the photos you want without clicking through all your subfolders, hunting for a photo.

Go ahead, download it, set it to scan your “My Photos” folder or wherever you keep ‘em, and then we move on to the complicated stuff…

Flickr Uploadr

Flickr Uploadr is exactly what it sounds like – it uploads files to Flickr. Sure, you CAN go through the website, which is just fine for handling a picture or two at a time. Flickr Uploader gives you a box that you can drag photos into, and then classify. You can assign them to Sets in Flickr. Think of a Set like a folder on your computer, except that a photo can exist in more than one Set. I typically group my Sets around what they’re of – say a particular event. I also have a set called “Photos I’m Proud Of” – my best-of, made up of photos I particularly like.

Download Flickr Uploadr and install. Once you’ve opened it up, click the “sign in” button and enter your account info. What’s neat is that for many people you can stop here. If you keep your photos well organized and just want to drag them into the Uploadr’s “drop photos here” box and classify them, you’re all set. But if you’re anything like me, being able to select a bunch of photos in Picasa and click one button is awesome. Enter…Picasa2Flickr!

Picasa2Flickr Button

Here’s where the magic happens. Basically, this is a button which will take a bunch of your photos, convert them (using Picasa) to a Flickr-friendly format (JPG), then send them over to the Flickr Uploadr. Any titles you’ve added will be included for you. All you need to do is add them to a set and then click “Upload”.

Click this link and then Picasa will load up. Once the install is done, you’ll get the option to add the new button to your toolbar. Add it wherever you like. You’re done!

‘But wait! Where did such a handy button come from?’ you ask. Well, some extremely clever programmers were kind enough to connect these two awesome tools for you. All YOU have to do is click a link. Pretty sweet, huh? Here’s some more info on that. Basically, Google and Yahoo aren’t exactly buddies, but because they both support open APIs, cool things can happen without complex corporate relationships. Yay, progress!

Take It Out For a Spin

You’re all set, now let’s take it for a test drive.

In Picasa, select one or more photos you want to upload. Don’t go overboard – this is a test. Select multiple photos by holding down CTRL and clicking on photos. If you want to do a bunch in a row, use SHIFT instead. Either way, once you’ve got a few, click on the “Send To flickr!” button you added in the last step. Picasa will pause for a moment while it does some magic behind the scenes (you’ll see a progress bar in the bottom right corner pop up). Then the Flickr Uploadr will open. Select your photos (CTRL + A) and add them to a set. If you don’t have any sets, you can create one directly in the editor. You can also change the visibility of these photos, either one at a time or all at once. Any way you do it, you can click “Upload!”. Once you’re finished, the Flickr Uploadr will ask if you want to go to Flickr to see your photos. Click “Yes” and you’ll get taken to a page where you can finalize any details. At this point, I usually just hit save.

17 Second Version – Configuring Picasa and Flickr to play nice.

1 ) Sign up for Flickr, it rocks

2 ) Download Picasa, it also rocks

3 ) Download and authorize the Flickr Uploadr

4 ) Install the Picasa2Flickr button from Sourceforge.

send_to_flickr5 ) Add button to Picasa (click the [Add >] button)

6 ) Select some photos, click the Send To flickr! button

7 ) Add your photos to one or more sets

8 ) Click upload!

And that’s how you upload your Picasa photos to Flickr!

Tags: , ,