I love Aurelia - Data binding always just works

Today, I needed to add a Twitter Bootstrap Tooltip to my Aurelia app. Easy enough, just create a custom attribute to handle the javascript registering and unregistering, then add the data- attributes to make it all work.

Except, this tooltip contains the password rules, and I want to use it in several places on my app. I don't want to create another custom attribute, I just want to bind the title to a value from my viewmodel.

So I write:

<input type="password" value.bind="password" bootstrap-tooltip 
       data-container="body" data-html="true" data-placement="bottom" data-toggle="tooltip" 
       title.bind="passwordRules">

and, of course, it just works. That's what I love about the syntax of Aurelia. They don't have to think of every use-case, they built the right abstraction in the first place.

FYI, if you get here looking for how to do the custom attribute, here's that code (thanks to Jeremy Danyow):

import {inject} from 'aurelia-framework';
import $ from 'jquery';
import 'bootstrap';

@inject(Element)
export class BootstrapTooltipCustomAttribute {
  constructor(element) {
    this.element = element;
  }

  bind() {
    $(this.element).tooltip();
  }

  unbind() {
    ${this.element).tooltip('destroy');
  }
}

Getting started with MediatR and Unity

I've been able to put off figuring our how to properly manage the WebApi controllers in this new project because everything has been in "just make it work" mode, and I was not happy with any of the patterns I had used before. I've been reading about MediatR for a while now, and yesterday I had the chance to try and use it to manage the controller actions.

Short story, it worked almost right away. That was cool. However, MediatR requires a bit more "inside knowledge" type of configuration than do a lot of packages that I have used in the past. In this case, I had to figure out how to set up my Unity containers so that MediatR would be happy with them. Thankfully, there is code on the site that configures a Unity container, but it didn't work for me. This is the code currently in the MediatR samples (here):

    container.RegisterTypes(
        AllClasses.FromAssemblies(GetType().Assembly),
        WithMappings.FromAllInterfaces,
        GetName,
        GetLifetimeManager);

When I used this, I got an error at startup telling me that I was attempting to override and existing mapping to System.Web.Http.Controllers.IHttpController, moving it from one controller class in my project to another. Clearly, I had to tweak the registration. In the end, this is what I came up with:

    container.RegisterTypes(
        MediatRType()
        WithMappings.FromAllInterfaces,
        GetName,
        GetLifetimeManager);

and

    private IEnumerable MediatrTypes()
        {
            var _t = GetType().Assembly.DefinedTypes;
            var types = _t.Where(f => !f.IsInterface && f.GetInterfaces().Any(x => x.IsGenericType && (x.GetGenericTypeDefinition() == typeof(INotificationHandler<>) || x.GetGenericTypeDefinition() == typeof(IAsyncNotificationHandler<>) || x.GetGenericTypeDefinition() == typeof(IRequestHandler<,>) || x.GetGenericTypeDefinition() == typeof(IAsyncRequestHandler<,>) || x.GetGenericTypeDefinition() == typeof(IRequest<>))));
            return types;
        }

I'm thinking I should issue a pull request; I think this is a better mechanism.

Aurelia - sharing some code

As I mentioned in my previous post, I'm getting ready to put some code out on GitHub. This is a first for me, so I'm sure I missed a couple of things. But my first repository is now up, a wrapper around the bootstrap-switch component. You can install it via jspm.

Let me know what I haven't configured correctly.

Cleaning up jspm forks in my Aurelia project

These are just some notes so that the next time I need this, I will know where to look. And if they happen to help anyone else, all the better.

A couple of nights ago I grabbed the latest and then did a jspm update on my site. Everything ran great until the end, when I suddenly found myself with 7 forks. Now, you have to know, this project has been perfect for weeks now. The last time this happened, I threw up my hands and just grabbed the latest package.json and config.js from the github repository. Today, I decided it was time to man up and figure out what was happening. Here is what I learned.

Some time ago, for reasons that may no longer exist, I added specific dependencies on aurelia-pal, aurelia-templating and aurelia-depenency-injection to my project. (I will learn later today if I still need those). Because I had specific dependencies on those projects, as they upgraded, I eventually fell behind. To be honest, I'm not sure why I fell behind, but a couple of days ago, the update ended up installing both the newest versions needed by the framework and the specific version I had added to my config.js.

The solution was simply to update the hard-coded dependencies in config,js. In my case, I deleted them, since I'm not even sure I need the direct reference.

So, what I learned is that the forks come from config.js. Maybe those who are more familiar with jspm already knew this, but I didn't.

And for now, I do. Until I learn more. Then I might just update this post.