Give a Buck, and share the love.

“Look, If you had one buck or one opportunity. To share a magical dollar with someone for something they’ve always wanted, in one moment, would you hash-tag it or just let it slip?”

This holiday Season Angie Lim, Darius Bashar, and Andrew Peek are challenging you to inspire a friend to kick start a dream, project, or something they’ve always wanted to do. Your mission is to donate a thought, an inspiration, a moment to someone other than yourself.

Who would you give a magical dollar to? Think about it, it could be a tough choice. When you’re ready to Give a Buck follow these steps:

1. Log onto your www.twitter.com account
2. @reply to someone you know, care about, believe in and want to encourage
3. Hashtag #giveabuck on your tweet to have it show up on the site
4. Check out www.giveabuck.ca to hear about others who’ve decided to #giveabuck

Why give a buck?

If they can inspire 1000 #giveabuck’s by the end of the 2009 year, they pledge to do a polar bear swim in January.

I have already put forward my name to join them in their polar bear swim. So be sure to #giveabuck.

Giving is not an act. It’s a way of life and a mentality.  In the remaining days of 2009, let’s see how many times we can spend a thought on someone else other than ourselves. -- #GiveaBuck

How To: Using jTweetr plugin for jQuery

Ever find yourself wishing that your tweets could be easily displayed on your website? Surprisingly enough when I went looking for a tool to do this, there was a very slim selection.  I wanted something that would be easy to use, had clean [html] code, and was easy to style with css so that I could have multiple looks and feels with very little code.

At first glance a twitter feed looks like it would be best represented as an unordered list or ordered list, item after item that contains a picture and some text. This is the practise that was found throughout all of the twitter feed tools I found on the web. However, I didn't agree with the (un)ordered list approach, I wanted more, I needed my tweets to have a title so I knew what they were about. After putting some thought into the possibilities and the benefits of different tags, I decided upon the definition list tag. With using the definition list keeping each of the elements can be styled easily as the title is a separate tag than the tweets.

I had been learning how to use jQuery for a while as it definately speeds up javascript development. What better way would there be to implement the ajax then using jQuery?  Which lead me to think, what if I made this a plugin so I could quickly and easily display a list of tweets of all the different topics I tweet about. Thus, jTweetr was born.

Ok, Ok, I know what you're thinking, what's with all the back story.. GET TO THE CODE!

Anatomy of a jTweetr Call

Don't get scared, you don't need a Medical degree in order to use jTweetr.  It's simple, There are just a few parts to it.

jQuery Selector: The jQuery Selector is how you identify the html element you wish to use as a container for the jTweetr Feed. jQuery has done an amazing job with this selector functionality. You are able to select any element on a page using CSS-Like selectors. Options like:

• #Container - For ID's
• .Container - For Classes
• #ContainerSpace > div - For any child div contained in an element with ID="ContainerSpace"
• more selelctors...

jTweetr Query:  The Query is what you want to show up in your jTweetr feed. This is plan text with no special characters. Searching against users, hashtags, and more is covered in the next section. [the Query for the photo to the left is 'CoffeeAndCode']

jTweetr Options:  This is what makes jTweetr so unique, Every aspect of jTweetr is customizable.  You can change everything from the names of the CSS classes that are on the elements, to how many tweets it is to search for, to how long between requests to Twitter.

Options Overview

• [TweetTypes] SearchType
  • Search (Searches for tweets containing a word in plain text)
  • From (Searches for tweets from a particular user)
  • To (Searches for tweets to a particular user)
  • Mention (Searches for tweets mentioning a user [includes to and from])
  • SearchHash (Searches for tweets containing a particular hashtag. [Default])
  • AppFilter (Searches for tweets that were sent using a particular Twitter Client)
• [String] Title
  • [Query] (A replacement token that subs in your Query text)
• [String] ListClass (CSS class placed on the DL Tag)
• [String] TitleClass (CSS class placed on the DT Tag)
• [String] TweetConClass (CSS class placed on the DD Tag)
• [String] TweetClass (CSS class placed on the DIV Tag which is wrapping the Tweet Text)
• [String] AvatarClass (CSS class placed on the IMG Tag which displays the users picture)
• [String] ProfileClass (CSS class placed on a link of to a Users Profile)
• [String] LinkClass (CSS class placed on a link in a tweet)
• [String] EvenClass (CSS class placed on even DD Tags)
• [String] OddClass (CSS class placed on odd DD Tags)
• [LoadingType] LoadType
  • Text (Displays Text from the 'LoadObj' variable while the tweet feed is loading. [Default])
  • Image (Displays an Image from the url in 'LoadObj' variable while the tweet feed is loading)
• [String] LoadObj
  • LoadingType.Text (HTML Formatted Text)
  • LoadingType.Image (URL to Loading Image)
• [String] LoadError (The Text that displays if an error occurs while requesting tweets)
• [Integer] NumResults (The number of tweets to get from the Twitter API. [Default=20])
• [Integer] FeedRefresh (The amount of time, in seconds, between API Searches. [MinValue=60])
• [String] Language (The two character language code for the Langage to search against. [Default='en'])

Future Features

If you see any places where jTweetr needs to be enhanced please comment on this post, and I will work towards implementing them.  Here are some of the current ideas I have for enhancements.

• API Time Stamping - Getting the Time Stamp from the API will allow jTweetr to update only the most recent items, no longer refreshing the entire list.
• Themes - Currently there is only the Official jTweetr Look. Please don't feel as if you need to stick to it. I will eventually work on rolling out some themes for easy adoption into any website.
• CMS Modules - I will be working towards creating modules/plugins for the most popular CMS software so that jTweetr can be installed and configured in a CMS with little to no coding.

Downloads

• jQuery
  • http://docs.jquery.com/Downloading_jQuery [jTweetr Built using v1.3.1]
• jTweetr
  • http://tinyurl.com/jTweetr
  • http://syntaxc4.net/downloads/jquery.jtweetr.zip
  • http://plugins.jquery.com/project/jtweetr