Переключить 2 дел с анимацией

Question

У меня два <div>это то, что пользователи переключаются между ними с checkbox, если флажок установлен, первый <div> открыт. если checkbox не проверено, второй <div> должно быть показано.

Дело в том, что это должно происходить в анимации, и, в частности, анимация закрытия должна происходить первой, и только когда это будет сделано, анимация открытия должна начаться

вот идея без анимации: http://jsfiddle.net/HB7LU/11597/

<div ng-controller="Ctrl">
    <div class="first" ng-show="first"></div>
    <p><input type="checkbox" ng-model="first" />First open</p>
    <div class="second" ng-show="!first"></div>
</div>


var myApp = angular.module('myApp',[]);

myApp.controller('Ctrl',['$scope' ,function($scope) {
    $scope.first = true;
}])