Friday, January 12, 2018

Isomorphic SmartClient with TypeScript

Short version: Check out the Isomorphic SmartClient TypeScript type defnition library on GitHub.

Longer version (how I get here):
I started out programming thick-client Windows applications for enterprises. The demand for that has significantly decreased over the last 10 years as web technologies have improved immensely. So now I'm an enterprise web application developer. But, coming from a thick-client background, I don't much care for slow, full page refresh applications. And, coming from an Object Oriented Programming background, I don't much care for JavaScript as it lets me make all kinds of mistakes which I do consistently. What to do?

With my first attempt at a single page application (SPA) in 2008-ish, I chose to use GWT and with it the Isomorphic SmartGWT library which contains a ton of widgets that all work together nicely. I learned a lot with that project including Java, GWT, the Isomorphic SmartClient/GWT library, the Net Beans IDE etc. and it worked. Maintaining that application, however, was difficult because I only worked on it once in a while and every time I came back to it, I spent hours updating my environment: Visual Studio, NetBeans, browsers, libraries, GWT etc. and usually at least one of those things would cause my application or development environment to break. So before I could even get to the fixes/enhancements I had planned for the day, I spent hours fixing bugs introduced (or exposed) by the environment updates and then of course testing those fixes.

While I really liked programming in Java compared to JavaScript, the GWT environment seemed unstable to me. It started off with browser plug-ins for debugging which were always behind the browser versions, much of the time it didn't even work with Google's own browser, Chrome, so I was using Firefox sometimes and Chrome other times. The compiler was really slow (with good reason) which slowed down my development cycle. Debugging in the IDE was great when it worked but then it changed to what they called 'Super Dev Mode' which was really just debugging in the browser with map files. I know that Google has many applications using GWT so I know it's a good system... just maybe not for a guy who programs mostly with Microsoft stuff and who's not using it everyday to keep everything up-to-date.

So, for my next attempt at a SPA, I decided to bite the bullet and use JavaScript so that I could still use the Isomorphic SmartClient library (the JavaScript version) and not worry about maintaining multiple IDEs, web servers, plug-ins etc. I could do everything with Visual Studio and IIS. Also, my client probably would not have accepted introducing Java into the house. This worked well also. All I had to do was maintain a bunch of JavaScript instead of Java and only one IDE. Debugging is done in the browser, just like with GWT, just no map files.

But then the application started to get more complicated and maintaining the JavaScript was troublesome. It's no fun to refactor JavaScript because you never know what you're going to break... until you test of course. Yes, there are ways of maintaining OOP-like JavaScript (that's what the SmartClient library does) but that was beyond my pain threshold. So, I looked for alternatives like TypeScript, CoffeeScript etc. that wouldn't require a new IDE. I settled on TypeScript because:
  1. It was created by Microsoft, fully supported in Visual Studio and I work in a Microsoft shop so I knew there wouldn't be any backlash.
  2. It's really gaining in popularity (a la Angular).
  3. There are already a bunch of type definition libraries available for JavsScript libraries like JQuery which makes it really easy to use existing JavaScript libraries.
Unfortunately, there was no type definition library for SmartClient, by far the largest JavaScript library I was using and the face of my application.... bummer. I proceeded anyway figuring I could convert everything except the SmartClient stuff to TypeScript. Since JavaScript is TypeScript, the SmartClient JavaScript still works, it's just not typed and thus still prone to JavaScript errors (of which I had many). I had actually considered TypeScript at the beginning of the project but decided not to go that route because there were no type definitions for SmartClient, figuring someone would build one and then I would switch over. Well, that never happened.

Fortunately I had recently gained a lot of experience with code generation and Isomorphic published an XML file for their documentation that had all the information necessary to build TypeScript typedef libary. I just had to build a code generator to read the file and build the library. It took a while and required some help from Isomorphic to fix up the XML file but it worked. You can find the library on my GitHub page at The library has been working well for me and my client such that we now have a good sized single page application written in C# on the back-end and TypeScript on the client. It has proven to be much easier to maintain and more robust than the JavaScript version.

Now that TypeScript is becoming more mainstream, Isomorphic has announced that they will begin supporting TypeScript in their next version ( which is of course what I was hoping for all along. Everybody wins!

What is an Enterprise Application?

When I tell people who are not in the I.T. industry that I develop enterprise applications, I am typically facing a gentle nod and a blank stare. Sometimes I get the same reaction from people who ARE in the I.T. world. I think Enterprise Application is one of those terms that people think they should know... but don't.

So, I thought I'd share what I mean by Enterprise Application. Of course, it will differ than other people's definitions because we all work in different places with different technologies etc.

According to Wikipedia:
Enterprise software, also known as enterprise application software (EAS), is computer software used to satisfy the needs of an organization rather than individual users. Such organizations would include businesses, schools, interest-based user groups, clubs, charities, or governments.[1] Enterprise software is an integral part of a (computer-based) information system.
Ok, but what does that really mean? Let's start with the word "enterprise". No, it's not the starship on a 5 year mission. An enterprise is a large organization... like a big company or government agency. We (almost) all know what an application is. It's the term we used before it got shortened to 'app' (also known as a program or software). So, an enterprise application is an app for a company or government agency (or department, office, bureau, ministry etc.) or some other type of large organization.

How is that different from any other kind of application? It is unique in at least two ways:
  1. It is not meant for general public use. It belongs to the organization to help them do their business, whatever that is, and is specific to that organization - either because it was specifically developed for the organization or it is an off-the-shelf product that has been configured for the organization.
  2. It is typically used to get data into and out of a database. So, it is not usually for creating images (like Photoshop) nor connecting drivers to people who need a ride (Uber, Lyft) nor is it used for creating complicated documents (Word, PowerPoint, Excel, although reports are typically involved). 
Large organizations typically need to keep track of all kinds of data, usually with databases. Sometimes it is very general stuff that many organizations use; such as contracts, invoices, bills, checks, employee records etc. For these applications, there are often commercial off-the-shelf  (COTS) systems that can handle it. Examples include accounting, ERP (Enterprise Resource Planning), and HR software.

Another common case is the need for something very specific to the organization. For example, a government agency that regulates pesticides may have a database of different pesticides and companies that produce pesticides etc. Since this is so specialized, there are probably no off-the-shelf systems to keep track of it. A custom developed enterprise application for this agency would facilitate the data entry and reporting on this data to meet business and/or regulatory requirements.

Other common properties of enterprise software include:

  • Security - It should use the enterprises default authentication mechanism (but doesn't always).
  • Density - May have more dense (more stuff per square inch of screen space) and look busy. Consumer applications try to not look too dense because it scares people off. In an enterprise, the users are typically forced to use the application even if it looks scary. What's more important is that it uses the screen efficiently.
  • Maintainability - Should be easily maintainable by the I.T. department.
  • User load - Probably doesn't need to handle a high user load like GMail although certainly some applications in very large organizations will face a high load.
  • Style - In consumer applications, arguably, form is more important than function because it has to sell. So, a lot of work goes into making a consumer application look good. For an enterprise application, function is much more important. That doesn't mean an enterprise application HAS to be ugly. I certainly try to make them look good... but I'm no artist.
  • Predictable network - An enterprise should have a reliable LAN and an enterprise application will probably take advantage of that. Usually it doesn't need to work over a dial-up connection or cell phone so there may not be as much effort put into network efficiency. Although I certainly try to make my application efficient. I assume that someday they will have to work over a public network subject to slowness and outages.

I build Enterprise Applications and I make them network efficient, good looking, maintainable and scale-able, just in case they become very successful and end up with millions of users.

Tuesday, August 20, 2013

Easy way to enable, disable & hide jQuery UI tabs

While searching on how to hide a jQuery UI tab, I found that a lot of other people were also looking for ways to easily enable, disable, show and hide tabs using the jQuery UI tabs control. Unfortunately, the built-in way to do it is cumbersome at best (although I know it helps keep the code small). So, I created this small plug-in to make it easier. To use it, just copy the text to a file (I name jquery-ui-tab-utils.js) and reference it in your code.

Scroll to the bottom if you just want to see it work.

 * jQuery-ui-tab-utils.js - Utilities to help with the jquery UI tab control
 * Date: 08/20/2013
 * @author Kyle White -
 * @version 0.1
 * Built for and tested with jQuery UI 1.9.2
 * License: Use at your own risk and feel free to use this however you want.
 * USAGE: 
 * $('MyTabSelector').disableTab(0);        // Disables the first tab
 * $('MyTabSelector').disableTab(1, true);  // Disables & hides the second tab
 * $('MyTabSelector').enableTab(1);         // Enables & shows the second tab
 * For the hide option to work, you need to define the following css
 *   li.ui-state-default.ui-state-hidden[role=tab]:not(.ui-tabs-active) {
 *     display: none;
 *   }
(function ($) {
    $.fn.disableTab = function (tabIndex, hide) {
        // Get the array of disabled tabs, if any
        var disabledTabs = this.tabs("option""disabled");
        if ($.isArray(disabledTabs)) {
            var pos = $.inArray(tabIndex, disabledTabs);
            if (pos < 0) {
        else {
            disabledTabs = [tabIndex];
        this.tabs("option""disabled", disabledTabs);
        if (hide === true) {
            $(this).find('li:eq(' + tabIndex + ')').addClass('ui-state-hidden');
        // Enable chaining
        return this;
    $.fn.enableTab = function (tabIndex) {
        // Remove the ui-state-hidden class if it exists
        $(this).find('li:eq(' + tabIndex + ')').removeClass('ui-state-hidden');
        // Use the built-in enable function
        this.tabs("enable", tabIndex);
        // Enable chaining
        return this;
    }; })(jQuery);
If you have suggestions on making it better (or making it work for use-cases I haven't tested), please let me know. Here's an embedded JSFiddle to demonstrate how it works:

Tuesday, June 7, 2011

QuickBooks Payroll Service Alert - endless reminders

The Problem
I do manual payroll... no service... no tax table download... all manual (I created a little Access application to help with the calculations). Anyway, after upgrading to QuickBooks Pro 2011 from my old QB Pro 2006, every time I went to Pay Employees, I got this annoying dialog. If I clicked Remind Me Later, it went away and let me do the payroll but it just came back again the next time. I could not figure out how to make it go away permanently.

I had to call Intuit anyway to register the product (dumb that you have to do that) and it took about 30 minutes and about 5 transfers but they helped me get rid of the pop-up. The problem was that way back in 2006 when I originally purchased Pro 2006, apparently I had signed up for the service for 2 days (a trial?) but ended up doing it manually. Well, the company file remembered that I had service and when I upgraded to 2011, it could not comprehend that perhaps I had been doing it manually for the last 5 years and so it figured I needed to reactivate, verify or be reminded endlessly.

The solution
It is pretty easy once you know what to do. Go to Help>QuickBooks Help. Do a search for 'manual payroll', somewhere in the one of the first articles will be a link titled manual payroll calculations. Follow the directions (just a couple clicks) and voilĂ ! You should get the following:

There is probably a more direct way to get to that option but I do not know where it is. If you do, please comment and I will update the post. Have fun doing your payroll manually! I know I do.

Thursday, June 2, 2011

QuickBooks on Windows 7 - Why 2 icons when running?

I finally decided to upgrade my QuickBooks to a version that is 'officially' supported on Windows 7. I bought QuickBooks Pro 2011. Don't get me started on the registration process... maybe another article.

This issue
For now, I was disappointed by the fact that this version, which is officially supported on Windows 7, does not behave on the Taskbar as well as the 2006 version (which is not officially supported) that I had to manually install (see old post). Unlike every other program that I currently have a Taskbar shortcut for, when I open QuickBooks from the Taskbar icon, it creates another icon to let me know that it is running. It is supposed to use the same icon and thus save space on the Taskbar but it doesn't.

The Fix
The fix is pretty easy. If you look at the properties of the shortcut, it points to an executable file QBW32Pro.exe. But if you look in the Task Manager when QB is running, you will see that the file QBW32.exe is actually running. So, presumably, when QBW32Pro.exe is launched, it does something and eventually launches QBW32.exe. What that something is, I don't know. But, knowing QuickBooks, it is probably something I don't care about. Possibilites: looking to see if an instance is already running, checking to see if there are multiple versions of the program installed or possibly just a way of enforcing the particular version. So, I just browsed to the folder where the QBW32.exe lives (C:\Program Files\Intuit\QuickBooks 2011 for me) and created a TaskBar shortcut for that file and removed the one for QBW32Pro.exe. It works fine. Whatever QBW32Pro.exe is doing before it launches QBW32.exe doesn't seem to be necessary on my machine. Your results may vary.

Saturday, May 21, 2011

Capacitive touch console in the Chevy Volt

Capacitive touch doesn't make sense in a car.
The other day I test drove a Volt. The exterior is nice, the interior is nice. The only thing I really disliked was the center control panel because of the capacitive touch sensor 'buttons'. To me this makes no sense in a car. The whole point of this technology is for use in things like touch screens and smart phones where the display changes. With these interfaces, the action resulting from touching a particular spot on the sensor depends on the state of the display at the time. In this case you are viewing the display and can easily determine the state and thus you have a good idea what the 'touch' is going to do (launch an application, open the keyboard, type a letter etc.)
In a traditional car control panel, the interface is made of buttons, knobs, sliders etc. all of which have very good tactile feedback and a certain level of resistance. I.e. you can feel the control without activating it. Typically, once you have had your car for a while, you have a good general idea of how it is laid out and you can reach for a control without taking your eyes off the road. Or, you can make a quick glance to pick a target and reach while your eyes go back to the road. If you 'miss', you won't necessarily activate anything, you can feel that your hand is in the wrong spot and can navigate by touch. While you are driving, it is easy to miss because everything is shaking (not saying the the Volt isn't smooth but it is moving). I have the same issue with my smartphone navigation system when it is mounted in the car. I need to the grab the phone with my thumb and pinky so that my hand is not moving relative to the device. In the Volt, you cannot 'grab' the center console.
In a traditional car, when your hand gets to the correct control, you just apply a little more pressure in the appropriate manner (push, twist, slide) to activate the control you want. In the Volt, if you 'miss', you have probably activated something you did not intend. Now you may have to deactivate whatever it is you messed up and find the right control to do what you want. If you try to do this by touch, you may inadvertently make more incorrect choices. Most likely you will have to take your eyes off the road to find and touch the correct control. This is an obvious safety concern. It is like trying to dial your phone while driving, it can be done but it is generally not a good idea (and illegal in some places?).
On touch screens, a touch sensor makes economical sense too because instead of having a bunch of different controls which might not cover every situation, you can have a single 'all-in-one' control that can be reconfigured on the fly. Again, this works because you can see the display before you make your decision. In the Volt, there are a set number of controls anyway and their positions never change. So why use this technology? It isn't necessary. It would be much simpler to just have buttons with actual tactile feedback so that you do not accidentally tap the wrong thing. What is the advantage? Weight reduction? Cost reduction? I can't imagine that a set of 'regular' controls would add more than a half a pound and/or a few dollars and probably would have saved on the R&D. It seems to be a solution for problem that does not exist (although it is probably easier to clean, I'll give it that).
Volt engineers: You did a great job with styling, aerodynamics, power management, requirements (I think the 40 mile electric range was a good compromise) and a bunch of other stuff, but I really question the thinking on this interface, please reconsider for future models. 

Friday, December 24, 2010

First post on the Cr-48

On Wednesday I was surprised to receive a package from UPS with no return address other than UPS. Since I did all my Christmas shopping online this year, at first I thought that maybe I ordered something and forgot about it (it happens)..... and that was sort of true. About a week earlier I had learned about the Google Cr-48 pilot program and I immediately applied. I told Google that I am mainly a Windows developer but that I would use the Cr-48 for everything I could and that I'd let my kid play with it. I guess they thought I was a good candidate to test their new web-only computing paradigm; and I am certainly willing to give it a shot, even though I am accustomed to having a powerful computer in front of me most of the time. If you still don't know what I'm talking about and you want to, click here.

Who cares? Why do people write about unboxing a product? As long as it is reasonably packaged and arrives in good condition it doesn't matter to me. That said, it came in a cool box.... and since it was free I don't feel ripped off for paying for fancy packaging.

I was so excited to check this thing out and brag to my fellow geeks that I posted on Facebook about it using my regular computer at home. For those who don't know me, I rarely do anything on Facebook, I only have an account because everyone else does and sometimes it's the only way to keep up with family news. But anyway, the point is that I instinctively went to my 'regular' computer instead of using the Cr48... it is a hard habit to break since I have my 'regular' computer all set up and customized the way I like it so I can do things fast and with little effort. There is not much customization in Chrome OS (besides the theme) which makes it very simple but only if you like to do things the Chrome way.

The Machine - plain and simple.... nice.
I like the black grippy texture... similar to my ThinkPad. I also like the lack of markings.... of ANY kind (except on the keys of course). No 'Intel inside', no 'Designed for OS whatever', no 'super duper hyper-gizmo enabled', not even an FCC sticker (is that legal? never mind, I found it. It's under the battery) or even a marking of what it is. For all I know it's really a Cr47 and already obsolete. The whole machine is geared toward simplicity from the lack of external connections to the lack of a caps lock and function keys. There are no switches, the power button is the upper-right key. There are no adjustments to be made. There's not even a latch for the lid. Even a caveman could figure this out (no offence to cavemen, I liked the show). Katie (my daughter) took to it in seconds (granted she's a lot smarter than a caveman but still.... pretty cool).

Hardware - hope you like wireless
All wired up and no place to go :-(
Now, I know that Google's main point in this pilot program is to get feedback on Chrome OS (i.e. the software) but even perfect software (which doesn't exist) will be perceived as unusable unless it is running on suitable hardware. Having worked in the wireless industry for over 10 years I have come to learn that if you have the option of using a wire (instead of a radio) ... USE THE WIRE. It is always going to be more reliable, secure, easier to set up and faster compared to wireless (of a similar generation of technology). How many times did you ask 'can you hear me now?' before wireless phones? It drives me nuts that people spend good money buying a wireless keyboard (and batteries) that always sits within a few feet of the computer. Anyway, the point is: there is no Ethernet connection on this thing. You MUST use either Verizon's 3G  or Wi-Fi (it'll do 802.11n) to get connected to the Internet and it is useless without a connection to the Internet (which is the point, I understand this). I do have wi-fi and I can get onto Verizon's 3G network but the speed and reliability would be much better if I could just plug in my Ethernet cable, which is already ready to go, sitting helplessly right next to the Cr48 on my desk. Note: The post was delayed by a couple hours because my wi-fi stopped working at my office and I had a heckuvatime fixing my wireless router. I had to do it using a computer with an Ethernet connection to the router. There's no way I could fix an existing or setup a new router without an Ethernet connection. I understand the simplicity/cost vs. functionality trade-off but IMHO, an Ethernet connection is just too important and not that expensive to be left out of a computer who's sole purpose in life is to connect to the Internet.

More Hardware - hope you don't need any peripherals
Here are the external connections:
  • Power - duh, no nuclear batteries yet, but it is very efficient since it does not do much.
  • External monitor - it does work sort of (Ctl+Full Screen) but I tried it with two different monitors and it behaved differently, with a big monitor, it switched over completely. With a smaller monitor it displayed on both using the resolution of the external monitor. To get it back to normal, disconnect the external monitor and hit Ctl+Full Screen again.
  • Audio out - works fine. Is it a dual audio-out/mic in? I don't know but there is no dedicated mic. in.
  • SD card - I don't have any SD cards to test with and I'm not sure what you'd do with it anyway.
  • One USB port, yep, just one. I use it for my mouse because I think that's all that the OS can really handle, it doesn't do printing or scanning. It can be used to charge your phone but it doesn't seem to do anything if I plug a thumb drive into it. There is a basic interface for files (for when you download from or upload to a website) but it doesn't seem to recognize anything from the USB port
Other stuff
  • Built-in microphone - I've been told I sound like I'm in a tunnel.
  • Webcam - See my test video here.
  • Tracpad - I've read and been told it is very similar to Mac Books. It recognizes two fingers at a time which I've gotten used to with my Android phone.
  • Keyboard - it's a little different, there's no cap locks key, no function keys, no windows or apple key and no delete key (but Alt-Backspace works for delete). It has some other keys instead: Back, Forward, Refresh, Full-screen, Search (which is really new tab), Next window and dedicated brightness and volume keys.... and the power button is a key. So, it looks like Google has hardware-ized some of the buttons in the browser. I'm not sure if that's a good idea or not yet. Since my hand is almost always on the mouse or tracpad anyway, I just use the browser buttons. The Next Window key seems to be not very useful right now but I can see the potential. If you're familiar with having multiple desktops, then you can see the use of the Next Window key. Currently you can only have one desktop which is used by the Chrome browser and (multiple) limited terminal windows  (Ctl+Alt+T) which are not really meant to be used by the average user.
So, this device is not meant to connect to any other device, it is meant to connect you to the Internet, that's it.

Secret stuff
I found a hidden card slot (or maybe SIM card) under the battery. I don't know what it's for but I'm tempted to put something in it. There's also a weird very small hole right next to the power connector. I have no idea what that's for.

Software - Do you use Chrome? Yes? then you already know.
There's a little more to it than that, but not much. When you open a new tab, you will see your bookmarks toolbar (which is automatically synced if you use Chrome elsewhere with a Google account), your installed 'applications', and an icon for the Web Store. The idea is that instead of installing big applications like Microsoft Office onto your computer which takes up hard drive space, uses a lot of memory, needs to be updated periodically and is generally a hassle to maintain, we now use web apps. Web apps are fancy web pages that let you do a whole lot more than just view some static content like documents and pictures. The web is now able to deliver full-blown interactive applications that run right in your browser. You don't need a Cr-48 for this, you can use Chrome or any other browser to experience these things right now like Gmail, Google maps, and all kinds of silly Flash games. Google just feels that the time is right (or getting close) that we can ditch the slow bootup times, viruses, failing hard drives, backup problems, installation hassles etc. and just visit web sites where we are guaranteed to always get the latest and greatest version of an application and have our data stored securely in .... here it comes ......the Cloud. Ooooooo fancy. Not really, the cloud is just servers (computers maintained by professionals that you will never actually see) on the Internet. So, if your data and your applications are all on the Internet, then you don't need an expensive computer to store that stuff. You just need a very cheap computer that's good at one thing.... connecting you to the Internet. That's what the Cr-48 is. This has been tried before and failed. The difference now is that web is better, the Internet is more widely available and Google is behind the effort. These are three distinctions that might just make it fly.

Fit for a kid
When I let Katie play with it, she immediately found You Tube in the new tab page and did a search for Puff the Magic Dragon. From there she found endless videos to keep her happy until bedtime. She has a 'real' computer with a real keyboard and a real monitor in her room. She could just as easily watch Puff there but she prefers the Cr-48. Why? I'm still not sure, but I think it's the speed and simplicity. She doesn't need Dad to login, or launch the browser program. Also, the thing boots in a time-span appropriate to a kid's attention span (about 10 seconds from a cold start, instant from sleeping). Sometimes when we turn on her real computer (which is pretty new), she's bored and leaves the room before we even get the desktop showing.

Although Katie thinks it's hers, I will keep using the Cr-48 for whatever I can find to do with it. I just won't be using it to develop Windows programs, configure my routers, printing, loading camera pictures or anything else that requires a specialized program or a connection to anything other than the Internet. This is an experiment in computing and I'm glad to be a part of it.