Switch to using a common directive for user setup (sign in, sign up, recover account) everywhere
This commit is contained in:
parent
abe6db334d
commit
9dbbd33afc
6 changed files with 105 additions and 87 deletions
53
static/directives/user-setup.html
Normal file
53
static/directives/user-setup.html
Normal file
|
@ -0,0 +1,53 @@
|
||||||
|
<div class="user-setup-element">
|
||||||
|
<div class="panel-group" id="accordion">
|
||||||
|
<div class="panel panel-default">
|
||||||
|
<div class="panel-heading">
|
||||||
|
<h4 class="panel-title accordion-title">
|
||||||
|
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" data-target="#collapseSignin">
|
||||||
|
Sign In
|
||||||
|
</a>
|
||||||
|
</h4>
|
||||||
|
</div>
|
||||||
|
<div id="collapseSignin" class="panel-collapse collapse in">
|
||||||
|
<div class="panel-body">
|
||||||
|
<div class="signin-form" signed-in="signedIn()" sign-in-started="signInStarted()" redirect-url="redirectUrl"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="panel panel-default">
|
||||||
|
<div class="panel-heading">
|
||||||
|
<h6 class="panel-title accordion-title">
|
||||||
|
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" data-target="#collapseRegister">
|
||||||
|
Create Account
|
||||||
|
</a>
|
||||||
|
</h6>
|
||||||
|
</div>
|
||||||
|
<div id="collapseRegister" class="panel-collapse collapse out">
|
||||||
|
<div class="panel-body">
|
||||||
|
<div class="signup-form"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="panel panel-default">
|
||||||
|
<div class="panel-heading">
|
||||||
|
<h6 class="panel-title accordion-title">
|
||||||
|
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" data-target="#collapseForgot">
|
||||||
|
Forgot Password
|
||||||
|
</a>
|
||||||
|
</h6>
|
||||||
|
</div>
|
||||||
|
<div id="collapseForgot" class="panel-collapse collapse out">
|
||||||
|
<div class="panel-body">
|
||||||
|
<form class="form-signin" ng-submit="sendRecovery();">
|
||||||
|
<input type="text" class="form-control input-lg" placeholder="Email" ng-model="recovery.email">
|
||||||
|
<button class="btn btn-lg btn-primary btn-block" type="submit">Send Recovery Email</button>
|
||||||
|
</form>
|
||||||
|
|
||||||
|
<div class="alert alert-danger" ng-show="invalidEmail">Unable to locate account.</div>
|
||||||
|
|
||||||
|
<div class="alert alert-success" ng-show="sent">Account recovery email was sent.</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
|
@ -202,6 +202,11 @@ quayApp = angular.module('quay', ['ngRoute', 'restangular', 'angularMoment', 'an
|
||||||
var planId = planService.getAndResetNotedPlan();
|
var planId = planService.getAndResetNotedPlan();
|
||||||
if (!planId) { return; }
|
if (!planId) { return; }
|
||||||
|
|
||||||
|
UserService.load(function() {
|
||||||
|
if (UserService.currentUser().anonymous) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
planService.isBusinessPlan(planId, function(bus) {
|
planService.isBusinessPlan(planId, function(bus) {
|
||||||
if (bus) {
|
if (bus) {
|
||||||
document.location = '/organizations/new/?plan=' + planId;
|
document.location = '/organizations/new/?plan=' + planId;
|
||||||
|
@ -209,6 +214,7 @@ quayApp = angular.module('quay', ['ngRoute', 'restangular', 'angularMoment', 'an
|
||||||
document.location = '/user?plan=' + planId;
|
document.location = '/user?plan=' + planId;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
planService.getAndResetNotedPlan = function() {
|
planService.getAndResetNotedPlan = function() {
|
||||||
|
@ -632,6 +638,35 @@ quayApp.directive('repoCircle', function () {
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
quayApp.directive('userSetup', function () {
|
||||||
|
var directiveDefinitionObject = {
|
||||||
|
priority: 0,
|
||||||
|
templateUrl: '/static/directives/user-setup.html',
|
||||||
|
replace: false,
|
||||||
|
transclude: true,
|
||||||
|
restrict: 'C',
|
||||||
|
scope: {
|
||||||
|
'redirectUrl': '=redirectUrl',
|
||||||
|
'signInStarted': '&signInStarted',
|
||||||
|
'signedIn': '&signedIn'
|
||||||
|
},
|
||||||
|
controller: function($scope, $location, $timeout, Restangular, KeyService, UserService) {
|
||||||
|
$scope.sendRecovery = function() {
|
||||||
|
var signinPost = Restangular.one('recovery');
|
||||||
|
signinPost.customPOST($scope.recovery).then(function() {
|
||||||
|
$scope.invalidEmail = false;
|
||||||
|
$scope.sent = true;
|
||||||
|
}, function(result) {
|
||||||
|
$scope.invalidEmail = true;
|
||||||
|
$scope.sent = false;
|
||||||
|
});
|
||||||
|
};
|
||||||
|
}
|
||||||
|
};
|
||||||
|
return directiveDefinitionObject;
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
quayApp.directive('signinForm', function () {
|
quayApp.directive('signinForm', function () {
|
||||||
var directiveDefinitionObject = {
|
var directiveDefinitionObject = {
|
||||||
priority: 0,
|
priority: 0,
|
||||||
|
|
|
@ -16,16 +16,6 @@ $.fn.clipboardCopy = function() {
|
||||||
};
|
};
|
||||||
|
|
||||||
function SigninCtrl($scope, $location, $timeout, Restangular, KeyService, UserService) {
|
function SigninCtrl($scope, $location, $timeout, Restangular, KeyService, UserService) {
|
||||||
$scope.sendRecovery = function() {
|
|
||||||
var signinPost = Restangular.one('recovery');
|
|
||||||
signinPost.customPOST($scope.recovery).then(function() {
|
|
||||||
$scope.invalidEmail = false;
|
|
||||||
$scope.sent = true;
|
|
||||||
}, function(result) {
|
|
||||||
$scope.invalidEmail = true;
|
|
||||||
$scope.sent = false;
|
|
||||||
});
|
|
||||||
};
|
|
||||||
};
|
};
|
||||||
|
|
||||||
function PlansCtrl($scope, $location, UserService, PlanService) {
|
function PlansCtrl($scope, $location, UserService, PlanService) {
|
||||||
|
@ -41,7 +31,10 @@ function PlansCtrl($scope, $location, UserService, PlanService) {
|
||||||
$scope.signedIn = function() {
|
$scope.signedIn = function() {
|
||||||
$('#signinModal').modal('hide');
|
$('#signinModal').modal('hide');
|
||||||
PlanService.handleNotedPlan();
|
PlanService.handleNotedPlan();
|
||||||
|
};
|
||||||
|
|
||||||
|
$scope.cancelNotedPlan = function() {
|
||||||
|
PlanService.notePlan('');
|
||||||
};
|
};
|
||||||
|
|
||||||
$scope.buyNow = function(plan) {
|
$scope.buyNow = function(plan) {
|
||||||
|
|
|
@ -32,24 +32,15 @@
|
||||||
<div class="row" ng-show="!user || user.anonymous">
|
<div class="row" ng-show="!user || user.anonymous">
|
||||||
<div class="col-md-10 col-md-offset-1 page-description">
|
<div class="col-md-10 col-md-offset-1 page-description">
|
||||||
In order to create a new organization, <b>you must first be signed in</b> as the
|
In order to create a new organization, <b>you must first be signed in</b> as the
|
||||||
user that <b>will become an admin</b> for the organization. Please sign-in if
|
user that <b>will become an admin</b> for the organization.
|
||||||
you already have an account, or <a href="/">sign up</a> on the landing
|
|
||||||
page to create a new account.
|
|
||||||
</div>
|
</div>
|
||||||
<div class="col-sm-6 col-sm-offset-3">
|
<div class="col-sm-6 col-sm-offset-3">
|
||||||
<div class="step-container" >
|
<div class="step-container" >
|
||||||
<div class="panel panel-default">
|
<div class="user-setup" redirect-url="'/organizations/new'" sign-in-started="signinStarted()"
|
||||||
<div class="panel-heading">
|
|
||||||
<h4 class="panel-title">Sign In</h4>
|
|
||||||
</div>
|
|
||||||
<div class="panel-body">
|
|
||||||
<div class="signin-form" redirect-url="'/organizations/new'" sign-in-started="signinStarted()"
|
|
||||||
signed-in="signedIn()"></div>
|
signed-in="signedIn()"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Step 2 -->
|
<!-- Step 2 -->
|
||||||
<div class="row" ng-show="user && !user.anonymous && !created">
|
<div class="row" ng-show="user && !user.anonymous && !created">
|
||||||
|
|
|
@ -78,15 +78,11 @@
|
||||||
<div class="modal fade" id="signinModal">
|
<div class="modal fade" id="signinModal">
|
||||||
<div class="modal-dialog">
|
<div class="modal-dialog">
|
||||||
<div class="modal-content">
|
<div class="modal-content">
|
||||||
<div class="modal-header">
|
|
||||||
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
|
||||||
<h4 class="modal-title">Please Sign In</h4>
|
|
||||||
</div>
|
|
||||||
<div class="modal-body">
|
<div class="modal-body">
|
||||||
<div class="signin-form" signed-in="signedIn()" redirect-url="'/plans/'"></div>
|
<div class="user-setup" signed-in="signedIn()" redirect-url="'/plans/'"></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-footer">
|
<div class="modal-footer">
|
||||||
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
|
<button type="button" class="btn btn-default" data-dismiss="modal" ng-click="cancelNotedPlan()">Close</button>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- /.modal-content -->
|
</div><!-- /.modal-content -->
|
||||||
</div><!-- /.modal-dialog -->
|
</div><!-- /.modal-dialog -->
|
||||||
|
|
|
@ -1,57 +1,7 @@
|
||||||
<div class="container signin-container">
|
<div class="container signin-container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-sm-6 col-sm-offset-3">
|
<div class="col-sm-6 col-sm-offset-3">
|
||||||
<div class="panel-group" id="accordion">
|
<div class="user-setup"></div>
|
||||||
<div class="panel panel-default">
|
|
||||||
<div class="panel-heading">
|
|
||||||
<h4 class="panel-title accordion-title">
|
|
||||||
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" data-target="#collapseSignin">
|
|
||||||
Sign In
|
|
||||||
</a>
|
|
||||||
</h4>
|
|
||||||
</div>
|
|
||||||
<div id="collapseSignin" class="panel-collapse collapse in">
|
|
||||||
<div class="panel-body">
|
|
||||||
<div class="signin-form"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="panel panel-default">
|
|
||||||
<div class="panel-heading">
|
|
||||||
<h6 class="panel-title accordion-title">
|
|
||||||
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" data-target="#collapseRegister">
|
|
||||||
Create Account
|
|
||||||
</a>
|
|
||||||
</h4>
|
|
||||||
</div>
|
|
||||||
<div id="collapseRegister" class="panel-collapse collapse out">
|
|
||||||
<div class="panel-body">
|
|
||||||
<div class="signup-form"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="panel panel-default">
|
|
||||||
<div class="panel-heading">
|
|
||||||
<h6 class="panel-title accordion-title">
|
|
||||||
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" data-target="#collapseForgot">
|
|
||||||
Forgot Password
|
|
||||||
</a>
|
|
||||||
</h4>
|
|
||||||
</div>
|
|
||||||
<div id="collapseForgot" class="panel-collapse collapse out">
|
|
||||||
<div class="panel-body">
|
|
||||||
<form class="form-signin" ng-submit="sendRecovery();">
|
|
||||||
<input type="text" class="form-control input-lg" placeholder="Email" ng-model="recovery.email">
|
|
||||||
<button class="btn btn-lg btn-primary btn-block" type="submit">Send Recovery Email</button>
|
|
||||||
</form>
|
|
||||||
|
|
||||||
<div class="alert alert-danger" ng-show="invalidEmail">Unable to locate account.</div>
|
|
||||||
|
|
||||||
<div class="alert alert-success" ng-show="sent">Account recovery email was sent.</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
Reference in a new issue