Listening to the Aloha Editor "aloha-smart-content-changed" Event?

Accoriding to the Aloha Editor docs you can listen for the "aloha-smart-content-changed" event for help in, say, saving the data to whatever persistence mechanism you are using. Here is an example of what I am trying to do:

<html>
  <head>
    <title>Aloha Event Testing</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script src="http://cdn.aloha-editor.org/current/lib/aloha.js" data-aloha-plugins="common/format, common/list, common/link, common/highlighteditables"></script>
    <link href="http://cdn.aloha-editor.org/current/css/aloha.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">
      Aloha.ready( function() {
        var $ = Aloha.jQuery;
        $('.editable').aloha();
      });
      $(document).ready(function() {
        $('.editable').bind('aloha-smart-content-changed', function() {
          console.log('Aloha smart event handled.');
        });
      });
    </script>
  </head>
  <body>
    <div class="editable"></div>
  </body>
</html>

But the handler never fires. Would anyone that has worked with Aloha know how to properly listen for the event?

Solution

Wow, the documenation on this was quite poor. But i think i got it to work. It looks like you bind the event handlers inside the Aloha.ready() method and to the Aloha object itself.

Aloha.ready( function() {
        var $ = Aloha.jQuery;
        $('.editable').aloha();

    Aloha.bind('aloha-smart-content-changed', function(event, editable) {
          console.log('Aloha smart event handled.');
        });        
});

Found a little bit more info about it here and this is where i found an example of an event being bound.

Also tested this in jsfiddle here

Hope that helps