//
  If the image state is 'loaded', then the image selector is a
  button which opens the image. Otherwise, the image selector
  is a button which loads the image.

button.btn.btn-default.btn-xs.qi-nav-btn.qi-vol-btn(
  ng-click='openImage()'
  ng-show="image.state == 'loaded'"
)
  .glyphicon.glyphicon-eye-open

button.btn.btn-default.btn-xs.qi-nav-btn.qi-vol-btn(
  ng-click='image.load()'
  ng-hide="image.state == 'loaded'"
  ng-disabled="image.state == 'loading'"
  qi-spin="image.state == 'loading'"
)
  .glyphicon.glyphicon-download

//
  If the image state is 'loaded', then the image selector is a
  button which opens the image. Otherwise, the image selector
  is a button which loads the image.

button.btn.btn-default.btn-xs.qi-nav-btn.qi-vol-btn(
  ng-click='openImage()'
  ng-show="image.isLoaded()"
)
  .glyphicon.glyphicon-eye-open

button.btn.btn-default.btn-xs.qi-nav-btn.qi-vol-btn(
  ng-click='image.load()'
  ng-hide="image.isLoaded()"
  ng-disabled="image.isLoading()"
  qi-spin="image.isLoading()"
)
  .glyphicon.glyphicon-download

Call image functions for state.
Call image functions for state.
