Firebase basic login
5 fichiers modifiés avec 19 ajouts et 4 suppressions
+ 3
- 0
.gitignore
@@ -3,3 +3,6 @@ dist |
||
| 3 | 3 |
.tmp |
| 4 | 4 |
.sass-cache |
| 5 | 5 |
bower_components |
| 6 |
+ |
|
| 7 |
+.DS_Store |
|
| 8 |
+app/.DS_Store |
+ 2
- 1
app/index.html
@@ -9,7 +9,8 @@ |
||
| 9 | 9 |
<!-- build:css(.) styles/vendor.css --> |
| 10 | 10 |
<!-- bower:css --> |
| 11 | 11 |
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css" /> |
| 12 |
- <link rel="stylesheet" href="bower_components/ladda/dist/ladda.min.css" /> |
|
| 12 |
+ |
|
| 13 |
+ <link rel="stylesheet" href="bower_components/ladda/dist/ladda-themeless.min.css"> |
|
| 13 | 14 |
<!-- endbower --> |
| 14 | 15 |
<!-- endbuild --> |
| 15 | 16 |
<!-- build:css(.tmp) styles/main.css --> |
+ 1
- 0
app/scripts/app.js
@@ -17,6 +17,7 @@ angular |
||
| 17 | 17 |
'ngSanitize', |
| 18 | 18 |
'ngTouch', |
| 19 | 19 |
'firebase', |
| 20 |
+ 'angular-ladda', |
|
| 20 | 21 |
'domainManagerApp.main', |
| 21 | 22 |
'domainManagerApp.signin', |
| 22 | 23 |
'domainManagerApp.domains' |
+ 12
- 2
app/scripts/controllers/signin.js
@@ -7,13 +7,16 @@ |
||
| 7 | 7 |
* # MainCtrl |
| 8 | 8 |
* Controller of the domainManagerApp |
| 9 | 9 |
*/ |
| 10 |
- angular.module('domainManagerApp.signin', ['firebase'])
|
|
| 11 |
- .controller('SignInController', ['$scope', '$firebaseAuth', function ($scope, $firebaseAuth) {
|
|
| 10 |
+ angular.module('domainManagerApp.signin', ['firebase', 'angular-ladda'])
|
|
| 11 |
+ .controller('SignInController', ['$scope', '$firebaseAuth', '$timeout', function ($scope, $firebaseAuth, $timeout) {
|
|
| 12 | 12 |
|
| 13 |
+ $scope.loading = false; |
|
| 13 | 14 |
var firebaseObj = new Firebase("https://j1x-cpanel.firebaseio.com");
|
| 14 | 15 |
$scope.authObj = $firebaseAuth(firebaseObj); |
| 15 | 16 |
|
| 17 |
+ |
|
| 16 | 18 |
$scope.SignIn = function(event) {
|
| 19 |
+ $scope.loading = true; |
|
| 17 | 20 |
event.preventDefault(); // To prevent form refresh |
| 18 | 21 |
var username = $scope.user.email; |
| 19 | 22 |
var password = $scope.user.password; |
@@ -23,8 +26,15 @@ |
||
| 23 | 26 |
password: password |
| 24 | 27 |
}).then(function(authData) {
|
| 25 | 28 |
console.log("Logged in as:", authData.uid);
|
| 29 |
+ $timeout(function() {
|
|
| 30 |
+ $scope.loading = false; // stop loading |
|
| 31 |
+ }, 1000); |
|
| 26 | 32 |
}).catch(function(error) {
|
| 27 | 33 |
console.error("Authentication failed:", error);
|
| 34 |
+ $timeout(function() {
|
|
| 35 |
+ $scope.loading = false; // stop loading |
|
| 36 |
+ }, 1000); |
|
| 28 | 37 |
}); |
| 29 | 38 |
} |
| 39 |
+ |
|
| 30 | 40 |
}]); |
+ 1
- 1
app/views/signin.html
@@ -7,7 +7,7 @@ |
||
| 7 | 7 |
<h2 class="form-title">Login</h2> |
| 8 | 8 |
<input ng-model="user.email" type="email" class="form-control" placeholder="Email address" required="" autofocus=""> |
| 9 | 9 |
<input ng-model="user.password" type="password" class="form-control" placeholder="Password" required=""> |
| 10 |
- <button type="button" ng-click="SignIn($event)" class="btn btn-lg btn-primary btn-block">SignIn</button> |
|
| 10 |
+ <button ng-click="SignIn($event)" ng-disabled="!user.email || !user.password || loading" class="btn btn-lg btn-primary btn-block ladda-button" ladda="{{loading}}" data-style="slide-up"> SignIn</button>
|
|
| 11 | 11 |
</form> |
| 12 | 12 |
|
| 13 | 13 |
</div> |