Demostrate Angularjs $http.post timeout defect.

<!DOCTYPE html>
<html>

  <head>
    <script data-require="angular.js@*" data-semver="1.2.0-rc3-nonmin" src="http://code.angularjs.org/1.2.0-rc.3/angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body data-ng-app="MyApiModule" data-ng-controller="MyApiCtrl">
    <h1>$http.post timeout issue</h1>
    
    <div>
      <input type="button" data-ng-click="getData('fast', false)" value="Get Fast Data" />
      <hr />
      <input type="button" data-ng-click="getData('slow', false)" value="Get Slow Data (takes 5 seconds)" />
      <hr />
      <input type="button" data-ng-click="getData('slow', true)" value="Get Slow Data with 2 second timeout" />
      <hr />
      <input type="button" data-ng-click="getData('error', false)" value="Get with error" />
    </div>
    <h3>Response</h3>
    <p data-ng-bind="response"></p>
  </body>

</html>

// Code goes here

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

myModule.controller('MyApiCtrl', ['$scope', '$log', '$http',
    function ($scope, $log, $http) {
        $scope.getData = function (apiType, bShortTimeout) {
            var data = { data: 'some data' };
            var url = (apiType === 'fast') ? 'http://www.apxproto.com/api/myApi.ashx' : (apiType === 'slow') ? 'http://www.apxproto.com/api/myApiSlow.ashx' : 'http://www.apxproto.com/api/myApiError.ashx';
            var timeout = (bShortTimeout) ? 2000 : 20000;
            $scope.response = '';
            $log.info('Calling Url: ' + url + '. Timeout: ' + timeout)
            $http.post(url, data, { timeout: timeout }).
                success(function (data, status, headers, config) {
                    $log.info('data: ' + data + '.\nstatus: ' + status + '. \nheaders: ' + headers() + '. \nconfig: ' + config);
                    $scope.response = data;
                }).
                error(function (data, status) {
                    $log.error('data: ' + data + '.\nstatus: ' + status);
                    $scope.response = (status === 0) ? 'Timeout!' : 'Error!';
                });

        };
    }
]);

/* Styles go here */