title: Programmatically closing a Durandal modal
body: <p>I'm new to Durandal, so I might be taking the wrong approach to my problem.</p>
  
  <p>I want to show a modal popup with a message of 'logging in...please wait' when the user has clicked the login button. I want to close the modal popup once the response is received. My attempted approach is to call a custom modal popup using Durandal's app.showModal and a view with no buttons, from the login view model. This shows the modal popup I'm after, but I haven't been able to figure out how to close the popup once the server response is received. All the examples I've seen have a button on the modal popup view that closes the popup.</p>
  
  <p>Is this possible? If not, is there a better approach that will show the user something is happening and also stop the user from trying to use any other button on the view?</p>
  
  <p>Here's the view model code for the login view (with extraneous code removed):</p>
  
  <pre><code>define(['services/appsecurity', 'durandal/plugins/router', 'services/utils', 'services/errorhandler', 'durandal/app', 'viewmodels/controls/activityindicator'],
  function (appsecurity, router, utils, errorhandler, app, activityIndicator) {
  
      var username = ko.observable().extend({ required: true }),
          password = ko.observable().extend({ required: true, minLength: 6 }),
          rememberMe = ko.observable(),
          returnUrl = ko.observable(),
          isRedirect = ko.observable(false),
  
      var viewmodel = {
          username: username,
          password: password,
          rememberMe: rememberMe,
          returnUrl: returnUrl,
          isRedirect: isRedirect,
          appsecurity: appsecurity,
  
          login: function() {
  
              var credential = new appsecurity.credential(this.username(), this.password(), this.rememberMe() || false),
                  self = this;
  
              activityIndicator.message = 'Logging in...please wait';
              app.showModal(activityIndicator);
  
              appsecurity.login(credential, self.returnUrl())
                  .fail(self.handlevalidationerrors)
                  .always(function() { activityIndicator.close(); });
          }};
  
      return viewmodel;
  });
  </code></pre>
  
  <p>The <code>appsecurity.login</code> function is the ajax post call. The view model for the custom modal is:</p>
  
  <pre><code>define(function () {
  
  var activityIndicator = function (message, title, options) {
      this.message = message;
      this.title = title || activityIndicator.defaultTitle;
      this.options = options || activityIndicator.defaultOptions;
  
      this.close = function() {
          this.modal.close();
      };
  };
  
  return activityIndicator;
  });
  </code></pre>
  
  <p>When running this, I get an error on <code>.always(function() { activityIndicator.close(); });</code> of <code>close</code> is undefined.</p>