Behind the Curtain at TCG

Telework Exchange to Host Complimentary Webcast

The Telework Exchange, an Alexandria-based public-private partnership focused on demonstrating the tangible value of telework and serving the emerging educational and communication requirements of the Federal teleworker community has announced that it will host a complimentary Webcast titled "Turn the Key on Telework: Telework Pilot to Enterprise-Wide Program" on February 23, from 1:00-2:00 p.m. EST. The webcast will focus on how to build and expand on an agency/organization’s telework pilot program, and implement a robust telework strategy throughout the enterprise. Panelists will discuss requirements to address when making the move towards large-scale execution and adoption of telework across the enterprise. Additionally, panelists will detail technology requirements, challenges, and changes when progressing towards an enterprise program, including how to leverage Telework Week 2012 as a strategic component for agencies’ telework programs. For more information and to register click here.

NGMA 2012 Annual Conference Registration Now Open

The National Grants Management Association (NGMA) has announced that registration is now open for NGMA's 33rd Annual Training Conference. The conference will be held April 22-25, 2012 at the Crowne Plaza Old Town in Alexandria, VA. This event is a "must attend" conference for grants management professionals and practitioners. For more information about the conference and to register click here. TCG is proud to support NGMA as a Director Level Corporate Alliance Sponsor.

TCG Customer Recognized as Excellence.Gov Award Finalist

The American Council for Technology and Industry Advisory Council (ACT-IAC) has announced that the Department of the Treasury’s Budget Formulation and Execution Manager (BFEM) program is a finalist for the 2012 Excellence.Gov Awards in the Excellence in Enterprise Efficiencies category. TCG supports the BFEM program with a range of services, including program management, business analysis, program implementation, systems architecture and development, and operations and maintenance. To read the full press release, click here.

 

My Southwest Flight Hit a Light Pole, but They Really Impressed Me...

My wife and I happened to be on today's flight #792 from Los Angeles to Denver that hit a light pole. (Since we were taxiing, most of us had our phones turned on, and I was able to get some pictures...)

We had arrived 20 minutes early to Denver, were taxiing, and the pilot just told us that our gate was occupied and that we were pulling to the side to wait. Suddenly there was a "bang" but it felt more like being in a car as it drove on gravel or bumped into a trash can. Everyone on the plane was OK, and seemed more amused (shocked and relieved) than frightened. Firetrucks quickly arrived, and the staff was very cordial.

By the time they bused us back to the terminal (about 30-60 minutes since they moved us 25 at a time), they had already reassigned a plane for flight 792 (the original 792 was stopping off in Denver before continuing to Philadelphia), and got most of us to connecting flights immediately.

That's what was so impressive: the Denver Airport and Southwest personnel appeared to follow emergency protocols wonderfully AND the personnel inside the terminal must have gone through a logistical nightmare to ensure smooth continuity of service.  By the time I got home, Southwest's Assistant Manager of "Proactive Customer Service Communications" had emailed me:

Greetings from Southwest Airlines:                                

I regret the unexpected disruption after your flight arrived at Denver this morning, and I’m sorry for any subsequent inconveniences to your plans.  Along with my apologies, I want to thank you for your patience and cooperation while our Inflight and Ground Crews made arrangements to take you to the terminal.  In addition, we would like you to know that we are working closely with the appropriate federal agencies regarding this overall situation.

We would like you to have much better memories the next time you travel with us.  In this spirit, I’m sending a LUV Voucher* (separately, but to the same e-mail address) as a humble gesture of goodwill that we invite you to apply toward a future Southwest reservation.  We hope you will allow us another opportunity to make up for this flight experience and you can be sure we are looking forward to seeing you again soon.

                                                               Sincerely,

                                                                 Adrienne Yurdyga

What's also amazing to me is that while taxiing at an airport is an intricate interplay between pilots and traffic control, there wasn't finger pointing.  Southwest took responsibility, quickly rectified things, and apologized.  If their intent was to make me a loyal customer (and share my experience with others), it worked.  I hope to learn from their example of customer service: there is wisdom in fixing things instead of laying blame.

TCG Executive Team Wins 2012 SmartCXO Award

TCG's executive management team has been named one of the best senior leadership teams in Washington, DC, by the 2012 SmartCXO Awards. The awards are sponsored by SmartCEO magazine. Hats off to our team—they truly deserve this recognition! To read the full press release, click here.

Telework Exchange Announces Spring 2012 Town Hall Meeting

The Telework Exchange--a public-private partnership focused on eliminating telework gridlock--has announced that its Spring 2012 Town Hall Meeting will be held Wednesday, May 2, 2012 at the D.C. Convention Center.

The spring program will focus on the fundamentals that empower a successful workforce—regardless of where they are located, and will consist of two tracks addressing telework technology and management methods that support a mobile workforce. GSA Administrator Martha Johnson will deliver the morning keynote address.

The Fall 2011 Town Hall Meeting was the largest Town Hall Meeting to date, with more than 900 attendees and 115 Federal agencies represented.

Registration is complimentary to government employees (industry rates apply) and Town Hall Meeting attendees are eligible to receive continuing professional education credits.

For more information and to register, click here.

Firefox 4 Saved My Android

As a side project I have been working on an HTML5 app designed to permit real-time playing of board and card games on multiple devices (PC, iPhone, Android, etc.).  This led to some interesting research about touch events and getting click events to work quickly on mobile devices.  So I was really excited to get an Archos 80 G9 to do some testing.

The Archos is speedy and responsive, so I was looking forward to lightening-fast piece manipulation, especially since my wife's iPad 1 worked rather well.  I was shocked, however, to find that the brower's animations and touch response was painfully sluggish.  As it turns out, the iPad's touchmove polling (46 moves/sec in the test) is significantly faster than the Android default browser's polling (14 moves/sec). My app and sites like Google Maps just seemed intollerable.  The Dolphin browser suffered similar issues.

I was furious!  Why would some software architect out there choose to cause a whole class of applications to languish in sluggish stuppor due to an inane choice of polling frequency?  Fortunately I found this comparison of Android browsers that portrayed Firefox as a clear winner in performance. At least on the Archos, Firefox polls touchmove events much more frequently, resulting in a nice touch-based HTML5 app experience.

Since I had actually started researching how to return the device, I can say without exhageration that Firefox 4 saved my Android.

Faster Random Numbers in JavaScript

There is a non-deterministic cellular automaton simulation that I have coded in a few in different languages on everything from a Commodore Vic-20 to an Android phone.  It's basically a grid populated by various colors that change states based on some random probabilities.  Ok, that explanation didn't sound as simple as I hoped, let's try again:  It's basically a screen full of squares that shift colors in a random fashion. I like to code it because it is pretty to look at. 

The important thing is that for each frame in the simulation I need to generate a random number between 0 and 3 for each colored block.  The more colored blocks you can pack on the screen, the better the light show looks.  With too many blocks the computer slows down and that doesn't look good at all.  My latest implementation was in HTML5 and JavaScript.  Since the program needs a lot of random input, I was curious about how quickly JavaScript could pump out a series of random numbers.  It turned out to be more than fast enough and my program is actually limited by the display code.

Even though the random number generation wasn't my bottleneck, I was interested in seeing if I could generated the randomness I needed more quickly.  You see, I have a special case.  I only need 2 bits of randomness to get my number between 0 and 3.   The typical JavaScript example for this would look like:

r = Math.floor(Math.random() * 4);

My first thought was that I'm generating a lot of random bits, packing them into a floating point number, then doing a floating point multiplication, then throwing most of the result away.  There has to be a better way.  First I needed a benchmark to compare my experiments against:

    var iterations = 1000000;
    function basicRand() {
        var r = 0;
        for (var i = iterations; i > 0; i--) {
            r = Math.floor(Math.random() * 4);
        }
    }

I used Firefox to profile the script and found that it ran in 85 ms.  As I said, more than fast enough for my real purpose, but I was curious.

Experiment #1 was to see if I could speed things up by forgoing the floating point math and converting the random number to a string and extracting the random digits.  Sure that's a lot of work, but I could get a lot of significant random digits out of a single random number....and doing this is easy in JavaScript so it was worth a try:

    var digitString = "";
    function fasterRand() {
        var r = 0;
        var digit = 0;
        for (var i = iterations; i > 0; i--) {
            digit = 9;
            // throw out any 8s and 9s because they will skew the distribution
            while (digit > 7) { 
                if (digitString == "") {  
                  // we were out of digits, create a new random number and convert to a string
                  digitString = Math.random().toString().substr(2,12);
                 }
                 digit = parseInt(digitString.substr(0, 1)); // grab the first digit
                 digitString = digitString.substr(1);        // shift the first digit out of the string
             }
             r = digit % 4; // do a mod 4 so the result is in the 0-3 range
         }
     }

This function was clearly misnamed because it took 258ms to generate the 1 million random numbers.  That is about 3 times slower than the standard approach! In retrospect, I think I should have known that all the string manipulation would suck up a lot of cycles.

I did have another idea that involved shifting the random bits around and using bitwise & to get the bits unpacked.  Reading some documentation I found that JavaScript is a little funny about giving you access to the underlying bits of your variables.  No matter the original type of a variable, the bitwise operators will be converted to 32 bit signed integers.  Even still, that means that a randomly generated integer should have 32 accessible bits of randomness.  My next try was this:

    function shiftRand() {
        var r = 0;
        var raw = 0;
        var maxint = Math.pow(2, 32);
        for (var i = iterations; i > 0; i--) {
            raw = parseInt(Math.random() * maxint);
            for (var j = 0; j < 15; j++) {
                r = raw & 3;
                raw = raw >> 2;
                i--;
            }
        }
    }

Much better!  This generated the million random numbers in just 12 ms!  That is about 7 times faster than the standard implementation.  If I was using this for scientific research I would want to do some analysis of the code to make sure that my results are just as random as the standard implementation.  Since this is really just a toy application, I also don't mind if I loose a little of the randomness. 

Your mileage may vary:  the more random bits you actually need the less the speedup will be.  I did some quick tests and found that if if you need 16 bits of randomness it is still faster to break down the 32 bit random integer than to create two unique randoms, but it's something close to 1.25 times faster.  Still better, but not nearly so dramatic.

A real JavaScript ninja can probably wring out a faster implementation, but I am quite happy with my 7 fold improvement.  If you have any suggestions for faster generation of random numbers, let me know in the comments!

Three Ways to Handle Orientation Change on Your Mobile Web Site

Most of the projects that I have worked on used a desktop web browser for a front end.  The nice thing about desktop computers is that people don't go around flipping monitors onto their sides.  Another nice thing is that users either keep their browser windows full screen or they are smart enough to know how to re-size it to fit your web site nicely.  Developing for mobile platforms is a bit more complicated.

The first problem is that a user can rotate their device.  The second is that users can't exactly re-size your browser window in the traditional sense.  Sure, they can zoom in and out, but that doesn't change the aspect ratio of your site.  To make things worse, a mobile site needs to be viewable on a wide range of device sizes.  Everything from a 240x320 Blackberry to a 1024x768 iPad is fair game for your test team.

After a bit of research and experimentation I've found three ways that you can handle rotation and content layout.  Surely there are more systems to deal with the problem, but these have covered all my needs so far.

#1 Fluid Layout

This is probably the simplest and most familiar to traditional web developers.  It does require some advanced planning though.  When you are starting on your design, arrange your content into blocks and set them all floating left.  As your screen size and shape changes, the mobile browser will display your content as best it can.  If you planned well and your content is amenable to this technique, this can look good.

#2 Provide Alternate CSS for Portrate and Landscape

Similar to #1, this requires some planning.  Keep your design modular and use CSS to lay everything out, but design two (or more) sets of css layouts.  You can wrap your css layout in @meda selectors like this:

One layout for portrait and one for landscape.  You then wrap each CSS layout in media selectors like this:

@media screen and (orientation:portrait) { … }
@media screen and (orientation:landscape) { … }

If your design needs to be tweaked for different resolutions, you can even do that with a media tag like:

@media (min-width:500px) and (max-width:900px) { … }

#3 onorientationchange JavaScript

Finally, if you want to modify your layout, or do anything else, using JavaScript when the orientation changes you can bind to the onorientationchange hook:

window.onorientationchange = function() {
  switch (window.orientation) {
    case 0:
	// run your JavaScript for portrait mode here
        break; 
       
    case 90:
	// run your JavaScript for landscape mode with the screen turned left
        break;
   
    case -90: 
	// run your JavaScript for landscape mode with the screen turned left
        break;
  }
}

 

Audio Effects for HTML5 Based Mobile Apps

I've been experimenting a bit with HTML5 mobile applications.  One of the funny little corners I've found is how to reliably use audio effects across platforms.  The HTML5 spec includes an <audio> tag.  Unfortunately I found it to be a little quirky, especially on some Android 2.x devices that I tested.

If you aren't concerned with every mobile device and you know that it is well supported on your target platforms, the <audio> tag might be the easiest way to create sounds.  Here is an example:

<audio id="sound_click" src="audio/click.wav" preload="auto"></audio>
<script>
    //do this when you want to play the click.wav sound:
    document.getElementById('sound_click').play();
</script>

For me, this worked out perfectly for the iOS devices I tested with and also in the Chrome browser I use during development.  On my Android 2.3 device, it was very laggy and I couldn't get it to work the way I wanted.

There are some open source libraries that can help you in your cross-platform quest.  I looked at jPlayer for a bit.  It works on the devices I tested on.  Under the hood jPlayer uses the HTML5 audio tag with a Flash player fallback.   It is a great solution if you are doing a pure web app and don't have any access to the native layer.

I am using PhoneGap Build to package my HTML5 code as a native app on Android.  That gives me another option.  I can use PhoneGap's audio API for the cross platform audio goodness that I want.  It did take a little research to get all the pieces in just right.  The trick I was missing in my first go round was specifying the path to the audio resource properly.  It turns out that you need to prepend "/android_asset/www/" to the relative path for your audio file.  In the end my audio code looked like this:

var my_media = null;
function playClick() {
    if (onAndroid && onPhoneGap) {
        if (my_media == null) {
            my_media = new Media("/android_asset/www/audio/click.wav",
                                                function () { console.log("playAudio():Audio Success"); },
                                                function (err) { console.log("playAudio():Audio Error: " + err); console.log(err); console.log(err.toString()); });
        }
    my_media.play();
    } else {
        document.getElementById('sound_click').play();
    }
}

This lets me use the regular HTML5 audio tag when my application isn't running as a native app and the PhoneGap media API when I'm on android.