St. Francis Society Animal Rescue

One of my side-projects is the development of the St. Francis Society Animal Rescue web site.  My friend Brian Burridge and I originally converted the site from a static web site to a Ruby on Rails site several years ago (2008 timeframe).  I believe it was initially a Rails 1.2 project.  Besides the public site, it includes a fairly involved back-end administration component that beyond just allowing content management of the web site, performs all the animal rescue administration functions (detailed animal information with health records, adoption records, etc.).  At the time we were both fairly new to Ruby on Rails and we decided to use ActiveScaffold to build this administration component.

At some point we upgraded to Rails 2.1 and then in 2010, Brian left the project to be able to better focus on his other numerous projects and I further upgraded it to Rails 2.3.x.  These Rails version upgrades were more effort than a typical Rails upgrades may be due to various gem dependencies, most specifically ActiveScaffold.  ActiveScaffold is really a pretty nice framework for admin sites, but it had limitations that required work-arounds and those work-arounds often didn't work when upgrading.

During the end of 2011 to the beginning of 2012, I did a more drastic upgrade.  I migrated to Rails 3.1.x.  However, this wasn't just a simple migration, I decided to re-write the entire application.  The most involved part of this re-write is what most people will never see, the administration area.  I decided to totally abandon ActiveScaffold.  Brian told me about ActiveAdmin that he was using on some of his other projects, but after fighting with ActiveScaffold for long, I opted to stay clear of such a major framework dependency and just wrote the entire admin from scratch with straight Rails.

Comparisons of the old and new administration pages.

Here's a comparison of the listing of the cats.  I reduced the amount of information displayed on the list to reduce some clutter, and I've made some of the frequently changed values available to be changed directly on the list (save instantly via Ajax) to eliminate the need to open the edit form just to change a status.

Filtering the list required an extension to ActiveScaffold that was problematic to upgrade, and it resulted in a very large area added to the top of the list.  Now it uses a jQuery UI dialog.

ActiveScaffold constructed its forms very vertically which didn't utilize the space well.  I now have full control of the layout allowing me to organize things better.

Responsive Web Design

Last summer at the 2011 front-end design conference I had the privilege of having Ethan Marcotte introduce me to the idea of responsive web design.  So, I took that to heart and designed both the public site and the admin area to be responsive.  So, if we look at the cat listing page again and compare it between a browser and an iPhone, you can see that the navigation menu has collapsed and the table has dropped several columns.

There are also intermediate changes for tablets, but it's time I wrap this up.

I'm only touching on a very few of the page layouts and features.  Beyond a new look and feel, the re-write of the application also brought performance improvements.  Here is a New Relic report on the week I switched it over from the old to the new.

Note: Thursday was the transition day, so it should be ignored.  The jump in CPU percentage is due to also switching from a shared hosting environment on DreamHost to a Linode slice since DreamHost doesn't support Rails 3.1 at this time -- at least not on my server)

I encourage you to take a look at the St. Francis Society Animal Rescue public site, particularly if you're in the Tampa Bay area and are interested in a new pet.  Be sure to try it out in different sizes to see how the responsive layout works, and please let me know what you think of it.

Bluetooth Proximity Monitor (improved)

About a month ago, a friend of mine pointed out a bluetooth proximity program for windows which would lock your desktop when you walked away by polling your mobile phone's proximity to your computer. I thought that sounded fun to try as I have a bluetooth enabled phone and laptop, however, I'm running Linux, not Windows. After a quick search on Google I found a Bluetooth Proximity Monitor script for Linux. It worked pretty well as it was, but I've made a few adjustments to it to improve it for my purposes.

1. The original script is written for KDE or other window managers that use xscreensaver. Since I'm currently running in Gnome, I had to switch the commands to use gnome-screensaver instead.


2. While changing the screensaver commands, I also added the ability to toggle my instant messenger (Pidgin) from 'available' to 'away'


3. The original script has a single THRESHOLD value to toggle between being near and far. I decided I needed separate NEAR and FAR thresholds. This is due to the wide variance of proximity I can have while I'm sitting at my desk. Just turning in my chair so that my body was between the phone and the laptop could change my RSSI (proximity value) from -1 to -18, so I need a fairly high threshold to prevent that. On the other hand, setting the threshold high could allow my system to unlock when I'm still 30 feet away. So making separate thresholds allows the proximity monitor not to trigger just because I turned in my chair, but also not unlock until I've actually returned to my desk.


4. With the higher away threshold, it's possible (though uncommon) to totally leave the bluetooth range before it triggers that you've gone away. So, I also added a little logic to trigger the change in proximity if you were previously in near proximity, but now your bluetooth can no longer be pinged (out of range, turned off, etc).


5. Finally, I alter the proximity check interval depending on if you're near or far. The motivation for this was an attempt to reduce power demands a little in order to prolong the battery life. I haven't done any actual tests to determine if it helped or not. Basically, if you're at your desk, it only checks every 5 seconds to make sure you're still there. If you've walked away it switches to check every 2 seconds in order to be more responsive to when you return.

In the end, my version of the bluetooth proximity monitor script looks like:

#!/bin/sh

DEVICE="00:1A:8A:61:6C:FE"
CHECK_INTERVAL=5
NEAR_THRESHOLD=-1
FAR_THRESHOLD=-22
PID=0
START_CMD='/usr/bin/gnome-screensaver'
FAR_CMD='/usr/bin/gnome-screensaver-command -l && purple-remote setstatus?status=away '
NEAR_CMD='/usr/bin/gnome-screensaver-command -d &&  purple-remote setstatus?status=available'
HCITOOL="/usr/bin/hcitool"
DEBUG="/var/log/btproximity.log"

connected=0

function msg {
    echo "$1" >> $DEBUG
}

function msgn {
    echo -n "$1" >> $DEBUG
}

function check_connection {
    connected=0;
    found=0
    for s in `$HCITOOL con`; do
        if [[ "$s" == "$DEVICE" ]]; then
            found=1;
        fi
    done
    if [[ $found == 1 ]]; then
        connected=1;
    else
#       msgn 'Attempting connection...'
        if [ -z "`$HCITOOL cc $DEVICE 2>&1`" ]; then
#            msg 'Connected.'
            connected=1;
        else
            msg "ERROR: Could not connect to device $DEVICE."
        fi
    fi
}

function check_xscreensaver {
    PID=`ps -C gnome-screensaver --no-heading | awk '{ print $1 }'`
    if [ "$PID" == "" ];  then
        $START_CMD &
    fi
}

check_connection

while [[ $connected -eq 0 ]]; do
    check_connection
    sleep 1
done

name=`$HCITOOL name $DEVICE`
msg "Monitoring proximity of \"$name\" [$DEVICE]";

state="near"
while /bin/true; do

    check_xscreensaver
    check_connection

    if [[ $connected -eq 1 ]]; then
        rssi=`$HCITOOL rssi $DEVICE | sed -e 's/RSSI return value: //g'`

        if (( $rssi <= $FAR_THRESHOLD )); then
            if [[ "$state" == "near" ]]; then
                msg "*** Device \"$name\" [$DEVICE] has left proximity (signal: $rssi)"
                state="far"
                $FAR_CMD > /dev/null 2>&1
   CHECK_INTERVAL=2
            fi
        elif (( $rssi >= $NEAR_THRESHOLD )); then
            if [[ "$state" == "far" ]]; then
                msg "*** Device \"$name\" [$DEVICE] is within proximity (signal: $rssi)"
                state="near"
                $NEAR_CMD > /dev/null 2>&1
                $START_CMD &
   CHECK_INTERVAL=5
            fi
        fi
#        msgn "RSSI = $rssi, "
    elif [[ "$state" == "near" ]]; then     
            msg "*** Device \"$name\" [$DEVICE] is no longer detectable"
            state="far"
            $FAR_CMD > /dev/null 2>&1
            CHECK_INTERVAL=2
    fi
#    msg "state = $state, PID = $PID, sleep = $CHECK_INTERVAL"

    sleep $CHECK_INTERVAL
done

Tips for new Samsung Sync Users

As I mentioned earlier, I recently acquired a Samsung A707 which is provided by at&t/Cingular. In this article I'm going to recommend some software and other customizations to make it more useful.

1. Access high-speed Internet everywhere I described this in my earlier article, Enjoying High Speed Wireless Connectivity Anywhere, so I won't do so again, but the important tip from that article is to download at&t Communications Manager to connect your laptop to the Internet via Bluetooth or USB.
2. Easily manage address book, calendar, email, multimedia, and more You may think you need to buy a USB cable in order to connect with your phone and synchronize your address book, appointments, music library, etc., but the good news is that you don't! If you're laptop is equipped with Bluetooth (like mine is), simply download Samsung PC Studio (it's free!). It will run through a simple wizard to connect to your phone either via Bluetooth or USB (it also supports Infrared and Serial connections, but since the phone doesn't, that doesn't help). Once you're connected you can manually manage your address book, email, etc. or you can synchronize them with Outlook/Outlook Express. You can use this application to configure an Internet connection as well, but it's easier with the at&t application (see tip 1). The "Manage Multimedia Files" option allows you to copy music, photos, and videos to/from the phone -- including Podcasts.
3. Add useful apps to your phone
   • Google Maps Other than making phone calls, one of the most useful thing a cell phone can do for you is help you find businesses while on the road. Google Maps is a "must have" application for this. Not only can if find local businesses by name or keywords, with a click of a button you can call them You can get directions to them including step-by-step instructions to get you there. It also adds real-time traffic information, can display satellite imagery, and provide navigation to move around the map and zoom in/out.
   • GMail Yes, the Sync comes with a mobile email program which connects to Yahoo!, AOL, Windows Live Mail (aka Hotmail), Juno, NetZero, and more. However, the one service it lacks it my preference, GMail. Fortunately, Google has provided their own application which can be installed on your phone to access GMail accounts. Unfortunately, I haven't found anyway to make it the default email program so that your phone will tell you when you get new mail like it will for the other email types.
   • Opera Mini The built in browser works fine for WAP/WML content, but when you need a more powerful browser, Opera Mini is the way to go. If you have iPhone envy and want a browser like it demonstrates showing the whole page and zooming in on pertinent sections, try the beta of version 4 which can do that too.
   • mWebPlayer The Sync includes "XM Radio Mobile" which allows you to stream XM Radio content to your phone. The only problem is, you have to pay for the service. As an alternative, mWebPlayer will stream radio stations off the Internet (for free!). The free version of mWebPlayer doesn't save changes you make to the station list, however, since you can load your Live365.com favorites, it's quick and easy to just load that list each time you start the application.
   • Instant Messaging (http://www.getjar.com/software/Samsung/SGH_A707/Applications/Messengers) The Sync includes an instant messaging application which can connect to either AIM, MSN, or Yahoo! However, it has two drawbacks. You can only connect to one at a time, and it uses your text messaging count for each message (which when you have unlimited data but limited text messages is rather stupid). Fortunately, there are a large number of IM clients out there which can connect to multiple IM communities at once and don't waste your messaging total. The biggest drawback is that, like the email, when you're using one of these apps you won't get notified when you're not using the phone and you get a message. You have to be running the application at the time. Since there are lots to choose from, I'm not specifying a particular one since I haven't evaluated them all, just follow the link and pick the one that sounds best to you.
   • Games There's going to be plenty of times when you're waiting in some lobby and need something to do to pass the time. Here are a few staple games that are both free and well done.
     • Backgammon This is a nice implementation of an old favorite. The LITE version is free and fully functional except that you can't play against other people online.
     • Chess (http://www.cellufun.com/Games/games.asp?game=Chess) Another nice (and free) rendition of a timeless classic.
     • Tetris A good way to waste time.
4. Add useful URLs to add to your browser favorites
   • Google Who can surf the net without Google?
   • YouTube You too can watch everyone's homevideos on your cell phone (who needs an iPhone? -- the Sync can toggle between portrait and landscape too!)
   • TV Guide Who wants to flip through a paper guide and translate it to the correct station number? Get a customized list of what's on right now for your TV provider.
   • Bible Don't want to carry the Bible with you to church, no problem, get it online.
   • Weather (NOAA) I happen to live in a hurricane zone, so when a hurricane it coming, I want to be able to get up-to-date weather reports.
   • Java Applications (http://wireless.getjar.com/mobile/software/) Many of those aforementioned Java application, and many more can be downloaded from GetJar.com
   • Palm Mobile Portal (http://mobile.palmone.com/us/) True, this isn't a Palm, but Palm does have a nice portal site for other mobile sites.
5. Free 411 Information Add a contact to your address book for 1-800-GOOG-411 (1-800-466-4411) to get local business information.
6. Customize appearance Using pictures you take or upload with PC Studio (tip 2), be sure to set the "Caller ID" field for your address book contacts to pictures of them which will show up when they call. Until you get a picture of your friend, the Dilbert characters work nicely. Also, customize your ring tone and wallpaper. To the right is a picture I took at Clearwater Beach (Florida) which has been resized to fit the screen (240x320) in case you don't have a picture of your own.

Enjoying High-Speed Wireless Connectivity Anywhere

In the interest of providing other technology posts other than just JavaScript code snippets, I thought I'd summarize my experience using at&t's 3G+ network. More than basic 3G, I actually get to utilize their HSDPA network here in Tampa where I live. What's the difference? Well, according to the Wikipedia sources I linked to above, the standard 3G allows the transmission of 384 kbit/s for mobile systems whereas current HSDPA deployments support down-link speeds of 1.8, 3.6, 7.2 and 14.4 Mbit/s. I recently acquired a Samsung A707 (aka Samsung Sync) which is a considerable improvement over my prior Motorola V180 -- though the V180 served me well as a basic phone, and even survived a fall into a river. I don't intend to review the A707 as there are plenty of other reviews out there (1, 2, 3, 4, 5), nor do I care to discuss the merits of one carrier's wireless technology over another's (ex HSDPA vs. EV-DO). All I want to talk about is my experience utilizing my phone to access the internet, particularly on my laptop and PocketPC through my phone, and what kind of performance I've seen. Once I got the phone, I signed up for a MEdia Max bundle which gave me unlimited data on the phone. I plan on doing LOTS of data with the phone, so I can't have some sort of puny 1MB or 5MB limit. To see what kind of bandwidth I could get on the cell phone, I pointed my Opera Mini browser to The Speed Test* and got results such as: In the interest of full disclosure, that was one of the higher scores, however several other tests were in the same vicinity (ex. 2801.8kbps) so it could not be dismissed as an anomaly. The lower end of the scores were around 1913.5kbps. These are all respectable scores and inline with the statement that the initial HSDPA networks deployments support 3.6 Mbit/s peak with phase one deployments to eventually reach achieve peak data rates of 14.4 Mbit/s. Who says internet access on cell phones is slow!? Now, it's all well and good that the phone can attain that high bandwidth and it certainly makes streaming videos off of YouTube or at&t's Cellular Video service to your cell phone work smoothly, but at some point, you just want a full size screen and keyboard for your internet access. The A707 doesn't come with a USB cable, so I utilized its built-in Bluetooth. To me, the Bluetooth is actually nicer since I can leave myphone in my pocket or in my belt click and still connect your laptop to it. Plus, I can connect my laptop and PocketPC to it simultaneously which is nice too. However, it does drain the battery faster. To use the phone for internet access via Bluetooth, you need to pair it to your laptop (or other Bluetooth enabled device). So, enable Bluetooth in the phone settings. I won't provide my own instructions for this as at&t has a nice tutorial online. Then you need to pair your phone and laptop together. Again, at&t provides vendor specific instructions for this. at&t has made a simple client called at&t Communication Manager which allows you to easily connect with the phone. Setup instructions are provided on the download page. The only thing I had to do special was manually select the GSM device (see Tools -> Settings... -> GSM -> Device Selection and select the Bluetooth Modem that was setup for me when I did the Bluetooth pairing). Once the Communication Manager finds your device, you simply click on the "Connect" button and you're in business. My laptop is a few years old, so I believe it's built in Bluetooth is version 1, not version 2 which significantly limits it's bandwidth potential (see Wikipedia entry on Bluetooth). By accessing the internet via my cell phone via Bluetooth, I got speeds varying from around 274kbps to 347kbps. These results are significantly reduced from the cell phone alone, though still tolerable for common internet tasks (reading email, viewing typical web pages, etc). The results for my laptop are comparable to the results I saw on my Dell Axim x51v as well. I had to do a little more manual configuration to get the Axim connected to the internet through the phone, but once I got it working, I got results such as: Just for comparison, the bandwidth I got at a local WiFi hotspot was around 1Mbps: So the conclusion is that if WiFi is available, it's still the faster option (at least for me without a USB connection nor Bluetooth 2.0 speeds), but having the ability to have broadband speed internet access ANYWHERE I go (in the city) is certainly a convenience! And possibly it's more secure if you're in a public hotpost with packet sniffers lurking around. I'd be interested to here if anyone has similar experience but using Bluetooth 2.0 instead. Is it faster? Is a USB connection faster? *Note: I also verified my laptop speed results with Speedtest.net which has a really nice interface. However, since it's Flash based, it doesn't run in the cell phone browser.

Update - December 19, 2007:

I have replaced my laptop and am now running Red Hat Enterprise Linux on my new one. Therefore, I could no longer use the at&t Communications Manager to make a connection. Fortunately, I found these instructions for How to use a Bluetooth phone as [a] modem in Linux which were very helpful.