Permalink
Browse files

Adding $http connectivity example to the project

1 parent 490e94d commit c8584f44872389543da3eb89c3581bb1d6bf9ca5 @sauliuz sauliuz committed Aug 30, 2015
View
@@ -4,12 +4,16 @@
var mostPopularListingsApp = angular.module('mostPopularListingsApp',['ngRoute',
'mostPopularListingsApp.home','mostPopularListingsApp.about','mostPopularListingsApp.login']);
-mostPopularListingsApp.config(function($routeProvider, $locationProvider) {
+mostPopularListingsApp.config(function($routeProvider, $locationProvider, $httpProvider) {
// Declaration of the default route if neither of the controllers
// is supporting the request path
$routeProvider.otherwise({ redirectTo: '/'});
+ // Settings for http communications
+ $httpProvider.defaults.useXDomain = true;
+ delete $httpProvider.defaults.headers.common['X-Requested-With'];
+
// disabling # in Angular urls
// $locationProvider.html5Mode({
// enabled: true,
@@ -16,18 +16,55 @@ angular.module('mostPopularListingsApp.login', ['ngRoute'])
}])
// Controller definition for this module
-.controller('LoginController', ['$scope', function($scope) {
+.controller('LoginController', function($scope,$http,$timeout) {
- // Just a housekeeping.
- // In the init method we are declaring all the
- // neccesarry settings and assignments to be run once
- // controller is invoked
- init();
+ // Global variables for this controller
+ var responseStatus = '';
+ var userIp = 'not yet retrieved';
- function init(){
-
- };
+ // Just a housekeeping.
+ // In the init method we are declaring all the
+ // neccesarry settings and assignments to be run once
+ // controller is invoked
+ init();
- this.message = "Login Time!";
+ function init(){};
-}]);
+ // Get requestors IP address from httpbin.org
+ function loadUserIp(){
+
+ // Before serving login page we are doing example http request
+ // to web API to verify if login service is up and running.
+ // Using httpbin.org as mock in this case - it returns requestors IP address
+
+ return $http.get('http://httpbin.org/ip').
+ then(function(response) {
+ // this callback will be called asynchronously
+ // when the response is available
+ responseStatus = response.status;
+ userIp = response.data.origin;
+ console.log(userIp);
+ console.log(JSON.stringify(response.data));
+
+ // assigning userIp to scope
+ return $scope.userip = userIp;
+
+ }, function(errorResponse) {
+ // called asynchronously if an error occurs
+ // or server returns response with an error status.
+ responseStatus = errorResponse.status;
+ console.log(JSON.stringify(errorresponse));
+
+ // assigning userIp to scope
+ return $scope.userip = userIp;
+ });
+
+ };
+
+ this.message = "Login Time!";
+
+ // // Adding small delay for IP address to be populated before loading the view
+ var filterTextTimeout = $timeout(function() {
+ loadUserIp();
+ }, 500); // delay 500 ms
+});
@@ -1,2 +1,4 @@
-<div>AngularJS starter application</div>
-<div>This is About View</div>
+<div class="center">
+ <div>AngularJS starter application</div>
+ <div>This is About View</div>
+</div>
@@ -1,2 +1,4 @@
-<div>AngularJS starter application</div>
-<div>This is Home View</div>
+<div class="center">
+ <div>AngularJS starter application</div>
+ <div>This is Home View</div>
+</div>
@@ -1,2 +1,17 @@
-<div>AngularJS starter application</div>
-<div>This is Login View</div>
+<div class="center">
+ <div>AngularJS starter application</div>
+ <div>This is Login View</div>
+ <div>You are logging in from this IP: <strong>{{userip}}</strong></div>
+ <br />
+ <form action="#" method="post">
+ Please Enter:<br /><br />
+ <div>
+ <label for="name">E-mail:</label>
+ <input type="text" id="name" />
+ </div>
+ <div>
+ <label for="mail">Password:</label>
+ <input type="email" id="mail" />
+ </div>
+ </form>
+</div>
@@ -1,9 +1,15 @@
/* app css stylesheet */
+body {
+ font-family: Helvetica;
+ font-size: 14px;
+}
+
.menu {
+ margin: 0 auto;
+ width:350px;
list-style: none;
border-bottom: 0.1em solid black;
- margin-bottom: 2em;
padding: 0 0 0.5em;
}
@@ -28,3 +34,18 @@
content: "";
padding: 0;
}
+.center{
+ margin: 0 auto;
+ width:350px;
+ padding-top: 6px;
+}
+
+form {
+margin: 0 auto;
+width:220px;
+}
+
+input{
+ float: right;
+ height: 10px;
+}
@@ -15,15 +15,13 @@ describe('LoginController Tests :', function() {
beforeEach(inject(function($controller,$rootScope){
scope = $rootScope.$new(); // initializa child of global $rootScope
controller = $controller("LoginController", {$scope: scope}); // Controller expects $scope
-
}));
-
it('should be defined', inject(function() {
expect(controller).toBeDefined();
}));
- it('should have property next defined', inject(function() {
+ it('should have property message defined', inject(function() {
expect(controller.message).toEqual("Login Time!");
}));
});

0 comments on commit c8584f4

Please sign in to comment.