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.

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.

 

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.

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;
  }
}

 

NIH Awards NITRC Phase II Contract to TCG

The National Institutes of Health (NIH) has awarded TCG a four-year contract to continue its support of the award winning Neuroimaging Informatics Tools and Resources Clearinghouse (NITRC), a user-friendly collaboration environment for the neuroinformatics community. This support will allow NIH to enhance and expand NITRC’s scientific scope and add new types of resources. To read the full press release, click here.

Elegant Code's Wonderful Blog Series on JavaScript

Up until this point, JavaScript was something I held my nose and used to get dynamic and Ajax interactions working on my websites.  jQuery made it more tollerable with its mysterious "$" syntax and its ability to zip through the DOM tree and manipulate CSS.  But over at Elegant Code, Jan Van Ryswyck has done an impressive job putting together 12 posts on JavaScript that are short yet very instructive and interesting.  I suggest it for any developer who wants to understand a bit of the magic and possibly improve their perception of JavaScript:

1. Functions
2. Objects
3. Prototypes
4. Enforcing New on Constructor Functions
5. Hoisting
6. Automatic Semicolon Insertion
7. Static Properties and Methods
8. Namespaces
9. Reusing Methods of Other Objects
10. The Module Pattern
11. Functional Initialization
12. Function Hoisting

Thanks Mr. Ryswyck!

TCG’s Dr. Robert Buccigrossi Awarded ACM Senior Membership

TCG’s Chief Technology Officer, Dr. Robert "Butch" Buccigrossi, has been awarded the Senior Member Grade by the Association for Computing Machinery (ACM). ACM, the world’s largest educational and scientific computing society with over 92,000 members, delivers resources that advance computing as a science and a profession. Congratulations to Butch! To read the full press release, click here.

Print envelopes via a web site using ASP.NET and C#

I was recently asked if it was possible to add a print feature to a web site.  But not the normal "print this page" link you see all the time on the web, this was printing address pulled from a database onto standard envelopes. 

I mentally worked though a few possibilities with HTML and CSS, but decided that they might be too fragile.  Plus when you print a HTML page, many browsers will put a header and footer on the printout by default. You can, of course, turn off headers and footers in the print setup options of your browser...but it's a bad idea to push that kind of responsibility onto your users if you can avoid it.   Any good solution should be as simple as possible and certainly shouldn't ask the users to do something they have never had to do on any other web site.

I decided it would be simplest to create a PDF on the server side and send that to the user for printing.   A PDF will print the same way every time.  It will print the same in Firefox, IE, and Chrome.   You can specify the page size of a PDF, which is important when you are printing onto envelopes.  If you specify the PDF as a Landscape document, It's even easy to rotate text.   Best of all, I won't have to worry that some strange CSS quirk will push the address halfway off the page when Chrome silently updates to a new version.   I will admit that not everyone has a PDF reader installed, but in this particular case, I could count on that being present for everyone using the site.

Since this was a simple task, I thought that one of the open source PDF libraries would work fine.  The site needed to work with .NET on Windows, so I checked out a few options and settled on PDF Sharp.  Below you will find the proof of concept code that I put together.  When the real solution is put together the addresses will be pulled from a database and each envelope will be printed in a loop.  For the demo code though, this is sufficient to show that the approach works.

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using PdfSharp;
using PdfSharp.Drawing;
using PdfSharp.Pdf;
using PdfSharp.Pdf.IO;
using PdfSharp.Drawing.Layout;

public partial class envelope_test : System.Web.UI.Page
{
    protected PdfPage getNewPage()
    {
        PdfPage page = new PdfPage();
        XUnit pdfWidth = new XUnit(4.125, XGraphicsUnit.Inch);
        XUnit pdfHeight = new XUnit(9.5, XGraphicsUnit.Inch);
        page.Height = pdfHeight;
        page.Width = pdfWidth;
        page.Orientation = PageOrientation.Landscape;
        return page;
    }

    protected void Page_Load(object sender, EventArgs e)
    {
        Response.Clear();
        Response.ContentType = System.Net.Mime.MediaTypeNames.Application.Pdf;
        PdfDocument document = new PdfDocument();
        PdfPage page = getNewPage();
        document.AddPage(page);       
        XGraphics gfx = XGraphics.FromPdfPage(page);

        // Create a font
        XFont font = new XFont("Verdana", 12);
        // Draw the text
        double x = page.Width.Point / 3;
        double y = page.Height.Point / 2;
        gfx.DrawString(@"Al Crowley", font, XBrushes.Black, new XPoint(x,y));
        gfx.DrawString(@"1 Oak Ave.", font, XBrushes.Black, new XPoint(x, y + 12 * 1.5));
        gfx.DrawString(@"Marmora, NJ 08223", font, XBrushes.Black, new  XPoint(x, y + 12 * 3));

        page = getNewPage();
        document.AddPage(page);
        gfx = XGraphics.FromPdfPage(page);

        gfx.DrawString(@"Joe Smith", font, XBrushes.Black, new XPoint(x, y));
        gfx.DrawString(@"1 Fairview Drive", font, XBrushes.Black, new XPoint(x, y + 12 * 1.5));
        gfx.DrawString(@"Marmora, NJ 08223", font, XBrushes.Black, new XPoint(x, y + 12 * 3));

        System.IO.MemoryStream ms = new System.IO.MemoryStream();
        document.Save(ms);

        Response.Clear();
        Response.ContentType = "application/pdf";
        Response.Cache.SetCacheability(HttpCacheability.NoCache);
        Response.BinaryWrite(ms.ToArray());
        Response.Flush();
        ms.Close();
        Response.End();

        // For testing purposes, also save the file locally
        document.Save(@"c:\temp\env.pdf");
    }
}

Telecommuting is great for productivity (but possibly bad for families?)

As I have been saying for 17 years, the benefits of a telecommuting workforce are both numerous and obvious. Now there is significant scientific evidence. I'm not sure that there is only one study showing the effectiveness of telecommuting, as this Slate article implies, but it is certainly the largest study I've heard about.

As I said when TCG won the Metropolitan Council of Governments Commuter Connections award for Telecommuting, any company that doesn't allow telecommuting is headed by an idiot.

That said, another study from the Journal of Business and Psychology seems to show that people who work from home are more tired. Why? Because they don't really like spending time with their families, and doing so on a daily basis makes them more aware of and prone to engaging in conflict over their time spent working.

My reading? Families have to be as prepared for the parent/spouse to telework as the parent/spouse is. There has to be a location physically separated from the minute-to-minute needs of the family (no offices in the kitchen, basically) and there have to be separation rituals from the family when it's time for "work" to be done.

I, for example, have my home office in the basement, in what I believe is the smallest (usable, excluding the laundry "room," for example) room in the house. This is perfect for me, as I am rather messy and any space I had available would fill with the detritus of work - papers, cables, random bits of fluff, and the like. Because it is in the basement, and therefore out of the sight of my kids, they tend to forget I am here and go on with their lives. I hear them stomping around or riding their various riding toys, but I generally can't even hear them crying. The soundproofing is working very nicely. And when I leave to "go work" I make sure they know where I am going, and that I can't talk to them while I'm there, but that I'll be back soon to have lunch/snack with them.

My wife, of course, is very understanding, since I have been telecommuting since we met. There's no expectation that I'll be out of the house. So the stress level doesn't increase at all if I'm home. That said, there is some increased stress if I'm NOT home. It's difficult for her to plan when I say I'm going to come home right away but there's one more thing for me to do. When I'm working from home, if I say I'm going to come upstairs right away, it's much easier to do so, knowing I can always go back to work later (after dinner, after the kids are asleep, or just lying in bed doing remote desktop from the ipad).

My suspicion is that once today's kids grow up with telecommuting parents, they will be able to approach their own telecommuting adulthoods much better, with less strife just from the fact of being home.

Or, at least, we can hope.