Friday, May 23, 2014

A visual representation of seeding before manually bootstrapping AngularJS



If you're just here for the demo, here you go: http://embed.plnkr.co/vBb2c3/preview

The Problem

As a developer using AngularJS, sometimes you'll want to seed data into some data source (local storage), or make some async calls to a server before your AngularJS application actually loads.  There are good reasons to avoid this at all costs, except when you're trying to replicate an existing user experience.

Take the case of local storage. Sometimes when you deploy a new version of your AngularJS application, you want to see how it works with existing user data. That is, you don't want to assume your user has no data. Ideally you're writing perfect code and you're handling all the null cases correctly, but we don't want to assume that with production data, right?

This process is critical because you don't want your application to incorrectly handle, corrupt, or delete any user data stored in these source, but how do we test this experience without writing hard coded config structures (which are actually data) directly into our Angular application. We want to separate these concerns and bring seeding outside of the Angular application so that we can accurately replicate the user experience when we actually bootstrap the application.

The Solution

To accomplish this, we're going to remove the ng-app attribute from our index.html. By doing so, we ensure that the application is not bootstrapped until we actually want it to be.

Since this is a complex topic, I've created a visualization that I think shows the AngularJS manual initialization process pretty well. Keep in mind I've added in UI-Router and several wait functions so that your eyes have a chance to see each step in action. As a visual learner, this helped me to understand the process from start to finish.

You can see the example Plnkr here: http://embed.plnkr.co/vBb2c3/preview

PS. This all came about while diagnosing an issue for the ng-inspector extension/plugin. Check that excellent project our here: http://ng-inspector.org/

Happy seeding and bootstrapping!

Saturday, January 25, 2014

How to type the Dogecoin symbol on a Mac? (Ð, Icelandic capital letter Eth)

Summary

Hello Shibes,

To type the Dogecoin symbol on a Mac (Ð, an Icelanding uppercase letter called ) is way harder than it should be, but can be done using a combination of Mac's built in text replacement and a Chrome Extension called Popchrom.

The first thing you'll need to do is choose a phrase that you want to type which will be replaced by the Doge symbol. I chose $D$ because you can hold down shift throughout the combination and it isn't likely to conflict with anything else. Feel free to choose whatever you like.

Instructions to set up OSX's text replacement to show Ð:

  1. Go to Settings > Language & Region.
  2. Click Keyboard Preferences button at the bottom of the screen.
  3. Click the "Text" tab of the Window that pops up.
  4. Click the plus (+) sign to add a new replacement.
  5. In the "Replace" column, type $D$ or the phrase you chose above.
  6. In the "With" column, copy and paste this:     Ð
  7. Close out. This should take care of basic apps like TextEdit and others. You just need to type $D$ or your phrase, then hit space, it should replace it, although it can be a little slow. :)
  8. NOTE (UPDATE): For older OSX versions, you must enable text replacement on a per application basis. This is dumb, so instead, run this command in termina to enable it in all apps that support apple text replacement, then restart your apps and it should work:
     defaults write -g WebAutomaticTextReplacementEnabled -bool true
Warning: some apps do not follow the built in Apple method of doing text replacements. This is a pain, but usually you can make it work. Word, for example, has their own text replacement that I am not going to cover here.

Instructions to set up Google Chrome's text replacement to show Ð:

Since Chrome unfortunately does not listen to the Apple way of doing text replacement, and does not have its own text replacement built in, we're forced to install a Chrome Extension called Popchrom. It is a little finicky so make sure to follow all the instructions carefully.
  1. Close all your Chrome tabs.
  2. Install Popchrom from here: https://chrome.google.com/webstore/detail/popchrom/iinhokidgfoomcighckbjmlcndbjmomp?hl=en
  3. Once installed, go to Tools > Extensions
  4. Scroll down until you see Popchrome, click Options.
  5. Once in the Popchrom options, you can delete all the default replacements.
  6. Create a new replacement with
    (or your chosen phrase)
    as the abbreviation and Ð as the Expand to...
  7. Click save.
  8. Voila. Now you should be able to use your phrase in text boxes in Chrome, press Ctrl + Space on any website and it will be replaced when you hit space afterwards. 
  9. Note that this will not work in other extensions or in the Chrome search box, only in website text fields so that you can post in /r/dogecoin :)  I'd love to see proper text replacement in Chrome (or if someone could implement the Apple method)!

wow. So keyboard. Much typing.

Thursday, October 24, 2013

Fixing xcrun: error: invalid active developer path (/usr/bin), missing xcrun at: /usr/bin/usr/bin/xcrun in OSX 10.9 Mavericks


When using git for the first time in OSX Mavericks you may run into a problem where you get the following error:

xcrun: error: invalid active developer path (/usr/bin), missing xcrun at: /usr/bin/usr/bin/xcrun

This error indicates can be fixed by running the following commands:

sudo xcode-select --install

This will force the Xcode command line tools to be reinstalled. Now we just run the following command to point xcrun to the correct path for the reinstalled tools:

sudo xcode-select -switch /

Credit to people in this homebrew issue thread for identifying this fix:

Wednesday, January 9, 2013

ConnectWise bug: Inactive contact checkbox unchecks itself on save

Edit: According to support, ConnectWise is aware of this and will be rolling out a fix in version 2013.1. Until then, see Holly's workaround in the comments.


The Scenario


In ConnectWise, you want to inactivate a contact. This contact has at least one ticket associated with it.



The Bug


  1. You check the checkbox that says "Inactive".
  2. Immediately you get a popup asking if you want to reassign the tickets to a new user, you decide not to and just click the Update button.
  3. Immediately you are back at the Contact screen and you should see the problem. The inactive checkbox has been unchecked!

  4. Now here is the part that is even more confusing. Even though this checkbox is unchecked, the contact has actually been inactivated and saved. This is a problem because if you simply surf away from this screen without clicking the save button, then everything works very well, but, in the event that you make the mistake of hitting the save button, then the contact magically becomes active again.

The Fix

This should be a very simple fix for ConnectWise to resolve. All they need to do is ensure that the checkbox remains checked after the ticket reassignment popup is presented. For all I know this may have been fixed already. I am on ConnectWise version 20.12.1 (13220).


Monday, October 22, 2012

Improvements needed in ConnectWise Configurations Page

A Rant


ConnectWise is powerful, there's no doubt there. It is even more powerful when it integrates with Labtech. Unfortunately, the user interfaces of both programs leave so much to be desired that it is really hard to be efficient on a daily basis.

The problem is that ConnectWise configurations are, after two years, still very immature from a usability standpoint.

A technician may work on hundreds of tickets each day. In theory, having computer information attached to that ticket would actually make that technician much more efficient. If you've been to a ConnectWise sales session, you know that this is the pitch you're given.

Unfortunately, in my opinion, ConnectWise still misses the mark in this area. Managing a computer from ConnectWise actually takes longer than clicking into Labtech and searching for the computer by the same name.

The Problem


I'll try to demonstrate this by counting the number of clicks it takes to manage a server via RDP. For the purposes of this demonstration I'll assume the technician already has the ticket opened.

  1. See that little "view" link? That's click #1.
  2. Now we get a bunch of information, which although potentially useful, mainly just takes up space. I am really just interested in the "Manage" button which will bring up the computer screen in Labtech. That's click #2.
  3. Ready for things to get a bit ridiculous? We're about to have three clicks all in one step. Here we are clicking Redirectors > Network redirectors > Remote Desktop. Ok, so now we're at a whopping 6 clicks to just get a remote connection screen up.
Understandably, 6 clicks is small in the big scheme of things and may seem nitpick-y, but multiply that by thousands of tickets.  

I respect the power of ConnectWise, but am always floored by the shear volume of self congratulation at their user events.  They have a ton of work to do in the usability area and really haven't made any investments in this area in over two years.

A short term solution


Here is a mock up of a theoretical UI that would make me much more efficient as a technician.:











Tuesday, October 16, 2012

Node.js Applications as a Windows Service

Normally I try not to repost stories, but this came in so handy that I have to share it.

I was working on a getting Node.js to play nice with MongoDB. This is my first time working with Mongo so I cloned MongoClikker in an effort to bring a little gui to this text-based party. I eventually realized I wanted MongoClikker to be running at all times on my dev box (which is running Windows). Rather than having a command prompt at all times, I was able to use the instructions on Tatham Oddie's post to make MongoClikker run as a service thanks to the help of NSSM.

I was able to make this work using the following commands:

nssm.exe install mongoclikker "C:\Program Files\nodejs\node.exe" "C:\code\mongoclikker\app.js"
net start mongoclikker

So far it is working wonders!


Sunday, October 7, 2012

Nginx, Comet, and Symfony2. Fun times.


What have I done?

I've officially found a brand new config that I am testing out. This time it is ngninx with the http push module to accomplish Comet pushes without the need for a full Bayeux implementation, php-fpm using a unix sock, and Symfony2 for the MVC legwork. I am looking at setting up HAProxy on the front end to do load balancing if possible in the future.

So far it has been very painless with a few caveats. I'll be interested to see how the performance of the server can handle the repeated requests. At this point I have the push module running on static html pages. I will be curious to see if php is able to take the requests as fast as I can throw them down the open connection.  Initially I'll be connecting to just MySQL dbs and maybe a SQL database occasionally. At some point I'd like to see if I can integrate with Amazon RDS. I am pretty psyched and can think of so many projects this combo could be used for.