vbatts/quay
Archived
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Merge pull request #1346 from coreos-inc/newlogin

Browse source 
New login screen UI
This commit is contained in:
josephschorr 2016-04-11 19:52:59 -04:00
commit 3a635798f4
24 changed files with 394 additions and 212 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
external_libraries.py
View file

@ -19,7 +19,7 @@ EXTERNAL_JS = [
EXTERNAL_CSS = [
'netdna.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.css',
'netdna.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css',
'fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,700',
'fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700',
's3.amazonaws.com/cdn.core-os.net/icons/core-icons.css'
]

8
static/css/directives/ui/recovery-form.css Normal file
View file

@ -0,0 +1,8 @@
.recovery-form-element h4 {
text-align: center;
margin-bottom: 20px;
}
.recovery-form-element input {
margin-bottom: 10px;
}

80
static/css/directives/ui/signin-form.css Normal file
View file

@ -0,0 +1,80 @@
.signin-form-element h4 {
text-align: center;
margin-bottom: 30px;
font-size: 25px;
}
.signin-form-element input {
font-size: 14px;
padding: 18px;
padding-top: 4px;
padding-bottom: 4px;
margin-bottom: 10px;
}
.signin-form-element .or-bar {
overflow: hidden;
text-align: center;
font-size: 16px;
color: #CCC8C8;
text-transform: uppercase;
margin-top: 10px;
margin-bottom: 20px;
}
/* Based on: http://jsfiddle.net/Puigcerber/vLwDf/1/ */
.signin-form-element .or-bar:before,
.signin-form-element .or-bar:after {
background-color: #ccc;
content: "";
display: inline-block;
height: 1px;
position: relative;
vertical-align: middle;
width: 50%;
}
.signin-form-element .or-bar:before {
right: 0.5em;
margin-left: -50%;
}
.signin-form-element .or-bar:after {
left: 0.5em;
margin-right: -50%;
}
.signin-form-element .external-logins {
text-align: center;
}
.signin-form-element .external-login-button {
display: inline-block;
padding: 6px;
margin-left: 15px;
margin-right: 15px;
}
.signin-form-element .external-login-button a {
color: #40B4E5;
}
.signin-form-element .external-login-button .login-text {
margin-top: 6px;
display: block;
font-size: 14px;
}
.signin-form-element .external-logins.smaller .external-login-button .login-text .prefix {
display: none;
}
.signin-form-element .external-logins.larger .external-login-button .login-text .suffix {
font-weight: 700;
}
.signin-form-element .external-login-button i.fa {
font-size: 46px;
width: auto !important;
}

18
static/css/directives/ui/signup-form.css
View file

@ -1,17 +1,13 @@
.signup-form-element {
position: relative;
.signup-form-element h4 {
text-align: center;
margin-bottom: 20px;
}
.signup-form-element .co-alert {
color: black;
.signup-form-element label {
font-weight: 600;
}
.signup-form-element .single-sign-on a {
font-size: 24px;
}
.signup-form-element .single-sign-on .external-login-button i.fa,
.signup-form-element .single-sign-on .external-login-button img {
width: 30px;
font-size: 24px;
.signup-form-element input {
margin-bottom: 10px;
}

97
static/css/directives/ui/user-setup.css Normal file
View file

@ -0,0 +1,97 @@
.user-setup-element {
text-align: center;
}
.user-setup-element .user-setup-element-view {
max-width: 420px;
width: 100%;
text-align: left;
display: inline-block;
}
.user-setup-element .setup-logo-container {
background-color: white;
display: block;
padding: 10px;
margin-bottom: 20px;
text-align: center;
}
.user-setup-element .user-setup-content {
background-color: rgba(247, 247, 247, 0.27);
padding: 34px;
padding-top: 20px;
padding-bottom: 20px;
border: 1px solid #eee;
}
.modal-body .user-setup-element .setup-logo-container {
margin-top: 20px;
margin-bottom: 0px;
}
.modal-body .user-setup-element .user-setup-content {
background: transparent;
border: 0px;
padding: 0px;
}
.user-setup-element .user-setup-content .pane-container-container {
overflow: hidden;
}
.user-setup-element .user-setup-content .pane-container {
white-space: nowrap;
width: 100%;
position: relative;
left: -100%;
transition: left 350ms ease-in-out;
}
.user-setup-element .user-setup-content .pane-container.signin {
left: -100%;
}
.user-setup-element .user-setup-content .pane-container.createAccount {
left: 0%;
}
.user-setup-element .user-setup-content .pane-container.forgotPassword {
left: -200%;
}
.user-setup-element .user-setup-content .pane-container .content-pane {
white-space: normal;
display: inline-block;
width: 100%;
vertical-align: middle;
padding: 6px;
}
.user-setup-element .setup-logo-container img {
max-height: 50px;
}
.user-setup-element .user-footer-links {
margin-top: 18px;
margin-bottom: 10px;
font-size: 16px;
text-align: center;
}
.user-setup-element .user-footer-links a {
display: inline-block;
text-decoration: none !important;
}
.user-setup-element .user-footer-links a:after {
content: "\2022";
color: #ccc;
padding: 0 5px 0 9px;
text-decoration: none !important;
}
.user-setup-element .user-footer-links a:last-child:after {
content: "";
}

13
static/css/quay.css
View file

@ -1171,10 +1171,6 @@ form input.ng-valid.ng-dirty,
border-top: 4px solid #ccc;
}
.form-signup input {
margin: 12px;
margin-left: 0px;
}
.signin-buttons {
text-align: center;
@ -3070,15 +3066,6 @@ p.editable:hover i {
margin-top: 10px;
}
.form-signin input {
margin-bottom: 20px;
}
.form-signin {
text-align: center;
margin-bottom: 20px;
}
.social-alternate {
color: #777;
font-size: 3em;

6
static/directives/external-login-button.html
View file

@ -4,10 +4,10 @@
ng-disabled="signingIn">
<img ng-src="{{ providerInfo.icon().url }}" ng-if="providerInfo.icon().url">
<i class="fa" ng-class="providerInfo.icon().icon" ng-if="providerInfo.icon().icon"></i>
<span ng-if="action != 'attach'">
Sign In with {{ providerInfo.title() }}
<span class="login-text" ng-if="action != 'attach'" style="vertical-align: middle">
<span class="prefix">Sign in with </span><span class="suffix">{{ providerInfo.title() }}</span>
</span>
<span ng-if="action == 'attach'">
<span class="login-text" ng-if="action == 'attach'" style="vertical-align: middle">
Attach to {{ providerInfo.title() }}
</span>
</a>

24
static/directives/recovery-form.html Normal file
View file

@ -0,0 +1,24 @@
<div class="recovery-form-element">
<h4 ng-show="!sendingRecovery && !sent">Please enter the e-mail address for your account to recover it</h4>
<div style="text-align: center" ng-show="sendingRecovery">
<div class="cor-loader-inline"></div>
</div>
<div ng-show="!sendingRecovery">
<div class="co-alert co-alert-success" ng-show="sent.status == 'sent'">
Account recovery email was sent to {{ recovery.email }}.
</div>
<div class="co-alert co-alert-danger" ng-show="invalidRecovery">{{ errorMessage }}</div>
<div class="co-alert co-alert-info" ng-show="sent.status == 'org'">
The e-mail address <code>{{ sent.orgemail }}</code> is assigned to organization <code>{{ sent.orgname }}</code>.
To access that organization, an admin user must be used.
<br><br>
An e-mail has been sent to
<code>{{ sent.orgemail }}</code> with the full list of admin users.
</div>
<form class="form-signin" ng-submit="sendRecovery()" ng-show="!sent">
<input type="text" class="form-control" placeholder="Email" ng-model="recovery.email">
<button class="btn btn-primary btn-block" type="submit">Send Recovery Email</button>
</form>
</div>
</div>

52
static/directives/signin-form.html
View file

@ -1,35 +1,41 @@
<div class="signin-form-element" style="position: relative">
<span class="cor-loader" ng-show="signingIn"></span>
<form class="form-signin" ng-submit="signin();">
<form class="form-signin" ng-submit="signin();" ng-show="!signingIn">
<div quay-show="Features.DIRECT_LOGIN">
<input type="text" class="form-control input-lg" name="username"
placeholder="Username or E-mail Address" ng-model="user.username" autofocus>
<input type="password" class="form-control input-lg" name="password"
placeholder="Password" ng-model="user.password">
<h4 quay-show="!Features.DIRECT_LOGIN && EXTERNAL_LOGINS.length > 2">
Login via service
</h4>
<div class="external-logins" quay-show="EXTERNAL_LOGINS.length" ng-class="EXTERNAL_LOGINS.length > 2 ? 'smaller': 'larger'">
<div class="external-login-button" provider="{{ provider.id }}" redirect-url="redirectUrl"
sign-in-started="markStarted()" ng-repeat="provider in EXTERNAL_LOGINS" is-link="true"></div>
</div>
<div class="or-bar" quay-show="Features.DIRECT_LOGIN && EXTERNAL_LOGINS.length">or</div>
<span class="cor-loader" ng-show="signingIn"></span>
<div class="co-alert co-alert-danger" ng-show="invalidCredentials">
{{ invalidCredentialsMessage || 'Invalid username or password.' }}
</div>
<div class="co-alert co-alert-danger" ng-show="needsEmailVerification">
You must verify your email address before you can sign in.
</div>
<div class="co-alert co-alert-warning" ng-show="tryAgainSoon > 0">
Too many attempts have been made to login. Please try again in {{ tryAgainSoon }} second<span ng-if="tryAgainSoon != 1">s</span>.
</div>
<span ng-show="tryAgainSoon == 0">
<button class="btn btn-lg btn-primary btn-block" type="submit" quay-show="Features.DIRECT_LOGIN">Sign In</button>
<div quay-show="Features.DIRECT_LOGIN">
<input type="text" class="form-control" name="username"
placeholder="Username or E-mail Address" ng-model="user.username"
ng-disabled="tryAgainSoon > 0 || signingIn" autofocus>
<span class="social-alternate" quay-show="EXTERNAL_LOGINS.length && Features.DIRECT_LOGIN">
<i class="fa fa-circle"></i>
<span class="inner-text">OR</span>
</span>
<input type="password" class="form-control" name="password"
ng-disabled="tryAgainSoon > 0 || signingIn"
placeholder="Password" ng-model="user.password">
</div>
<div class="external-login-button" provider="{{ provider.id }}" redirect-url="redirectUrl"
sign-in-started="markStarted()" ng-repeat="provider in EXTERNAL_LOGINS"></div>
</span>
<button class="btn btn-primary btn-block" type="submit" quay-show="Features.DIRECT_LOGIN" ng-disabled="tryAgainSoon > 0">
Sign in to <span class="registry-name"></span>
</button>
</form>
<div class="co-alert co-alert-danger" ng-show="invalidCredentials">
{{ invalidCredentialsMessage || 'Invalid username or password.' }}
</div>
<div class="co-alert co-alert-danger" ng-show="needsEmailVerification">
You must verify your email address before you can sign in.
</div>
</div>

63
static/directives/signup-form.html
View file

@ -1,39 +1,32 @@
<div class="signup-form-element">
<div quay-show="singleSigninUrl" class="single-sign-on">
<div class="external-login-button" provider="{{ EXTERNAL_LOGINS[0].id }}"></div>
</div>
<h4 ng-show="!registering && !awaitingConfirmation">
Create new account
</h4>
<div quay-show="Features.USER_CREATION && Config.AUTHENTICATION_TYPE == 'Database' && !singleSigninUrl">
<form class="form-signup" name="signupForm" ng-submit="register()" ng-show="!awaitingConfirmation && !registering">
<div quay-show="Features.DIRECT_LOGIN">
<input type="text" class="form-control" placeholder="Create a username" name="username" ng-model="newUser.username" autofocus required ng-pattern="/^[a-z0-9_]{4,30}$/">
<input type="email" class="form-control" placeholder="Email address" ng-model="newUser.email" required>
<input type="password" class="form-control" placeholder="Create a password" ng-model="newUser.password" required
ng-pattern="/^.{8,}$/">
<input type="password" class="form-control" placeholder="Verify your password" ng-model="newUser.repeatPassword"
match="newUser.password" required
ng-pattern="/^.{8,}$/">
</div>
<div class="form-group signin-buttons">
<button id="signupButton"
class="btn btn-primary btn-block landing-signup-button" ng-disabled="signupForm.$invalid" type="submit"
analytics-on analytics-event="register"
quay-show="Features.DIRECT_LOGIN">
<span quay-show="Features.BILLING">Sign Up for Free!</span>
<span quay-show="!Features.BILLING">Sign Up</span>
</button>
<span class="social-alternate" quay-show="Features.DIRECT_LOGIN && EXTERNAL_LOGINS.length">
<i class="fa fa-circle"></i>
<span class="inner-text">OR</span>
</span>
<div class="external-login-button" provider="{{ provider.id }}" ng-repeat="provider in EXTERNAL_LOGINS"></div>
</div>
</form>
<div class="cor-loader" ng-show="registering"></div>
<div class="co-alert co-alert-info"
ng-show="awaitingConfirmation && hideRegisteredMessage != 'true'">
Thank you for registering! We have sent you an activation email.
You must <b>verify your email address</b> before you can continue.
</div>
<form class="form-signup" name="signupForm" ng-submit="register()" ng-show="!awaitingConfirmation && !registering">
<label for="username">Username:</label>
<input type="text" class="form-control" placeholder="Requested username" name="username" ng-model="newUser.username" autofocus required ng-pattern="/^[a-z0-9_]{4,30}$/">
<label for="email">E-mail address:</label>
<input type="email" class="form-control" placeholder="Your email address" name="email" ng-model="newUser.email" required>
<label for="password">Password:</label>
<input type="password" class="form-control" placeholder="Create a password" name="password" ng-model="newUser.password" required
ng-pattern="/^.{8,}$/">
<input type="password" class="form-control" placeholder="Verify your password" ng-model="newUser.repeatPassword"
match="newUser.password" required
ng-pattern="/^.{8,}$/">
<button id="signupButton"
class="btn btn-primary btn-block landing-signup-button" ng-disabled="signupForm.$invalid" type="submit"
analytics-on analytics-event="register">
<span quay-show="Features.BILLING">Create Free Account</span>
<span quay-show="!Features.BILLING">Create Account</span>
</button>
</form>
<div class="cor-loader" ng-show="registering"></div>
<div class="co-alert co-alert-info" ng-show="awaitingConfirmation && hideRegisteredMessage != 'true'">
Thank you for registering! We have sent you an activation email.
You must <b>verify your email address</b> before you can continue.
</div>
</div>

84
static/directives/user-setup.html
View file

@ -1,64 +1,38 @@
<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 id="signinToggle" class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" data-target="#collapseSignin">
Sign In
</a>
</h4>
</div>
<div id="collapseSignin" class="panel-collapse collapse" ng-class="hasSignedIn() ? 'in' : 'out'">
<div class="panel-body">
<div class="signin-form" signed-in="signedIn()" sign-in-started="signInStarted()" redirect-url="redirectUrl" invite-code="inviteCode"></div>
</div>
</div>
<div class="user-setup-element-view">
<div class="setup-logo-container" ng-show="hideLogo != 'true'">
<img src="{{ Config.getEnterpriseLogo(true) }}">
</div>
<div class="panel panel-default"
quay-show="Features.USER_CREATION && Config.AUTHENTICATION_TYPE == 'Database' && Features.DIRECT_LOGIN">
<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" ng-class="hasSignedIn() ? 'out' : 'in'">
<div class="panel-body">
<div class="signup-form" user-registered="handleUserRegistered(username)" invite-code="inviteCode"></div>
</div>
</div>
</div>
<div class="panel panel-default"
quay-show="Features.MAILING && Config.AUTHENTICATION_TYPE == 'Database' && Features.DIRECT_LOGIN">
<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 style="text-align: center" ng-show="sendingRecovery">
<div class="cor-loader-inline"></div>
</div>
<div class="panel-body" ng-show="!sendingRecovery">
<form class="form-signin" ng-submit="sendRecovery()" ng-show="!sent">
<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="co-alert co-alert-danger" ng-show="invalidRecovery">{{errorMessage}}</div>
<div class="co-alert co-alert-info" ng-show="sent.status == 'org'">
The e-mail address <code>{{ sent.orgemail }}</code> is assigned to organization <code>{{ sent.orgname }}</code>.
To access that organization, an admin user must be used.
<br><br>
An e-mail has been sent to
<code>{{ sent.orgemail }}</code> with the full list of admin users.
<div class="user-setup-content">
<div class="pane-container-container">
<div class="pane-container" ng-class="currentView">
<!-- Create Account -->
<div class="content-pane">
<div class="signup-form" user-registered="handleUserRegistered(username)" invite-code="inviteCode"></div>
</div>
<!-- Sign in -->
<div class="content-pane">
<div class="signin-form" signed-in="signedIn()" sign-in-started="signInStarted()" redirect-url="redirectUrl" invite-code="inviteCode"></div>
</div>
<!-- Recover Account -->
<div class="content-pane">
<div class="recovery-form"></div>
</div>
<div class="co-alert co-alert-success" ng-show="sent.status == 'sent'">Account recovery email was sent.</div>
</div>
</div>
</div>
<div class="user-footer-links">
<a ng-click="setView('createAccount')"
quay-show="Features.USER_CREATION && Config.AUTHENTICATION_TYPE == 'Database' && Features.DIRECT_LOGIN"
ng-if="currentView != 'createAccount'">Create Account</a>
<a ng-click="setView('signin')" ng-if="currentView != 'signin'">Sign In</a>
<a ng-click="setView('forgotPassword')"
quay-show="Features.MAILING && Config.AUTHENTICATION_TYPE == 'Database' && Features.DIRECT_LOGIN"
ng-if="currentView != 'forgotPassword'">Forgot Password?</a>
</div>
</div>
</div>

1
static/img/quay-horizontal-color.svg Normal file
View file

@ -0,0 +1 @@
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 348.09 97.57"><defs><style>.cls-1{fill:#003764;}.cls-2{fill:#40b4e5;}</style></defs><title>quay</title><path class="cls-1" d="M179.31,95.32a20.89,20.89,0,0,1-5.09,1.61,36.5,36.5,0,0,1-7.24.65q-11.15,0-18.82-5.14A31.66,31.66,0,0,1,136.73,79,29.79,29.79,0,0,1,126.6,74.9a27.88,27.88,0,0,1-7.78-7.56,35.26,35.26,0,0,1-4.94-10.67,49.31,49.31,0,0,1-1.72-13.46,46.86,46.86,0,0,1,2.3-15.28A31.62,31.62,0,0,1,121,16.67a27.84,27.84,0,0,1,10-7,35.81,35.81,0,0,1,25.85,0,27.57,27.57,0,0,1,10,7A32.21,32.21,0,0,1,173.34,28a46.52,46.52,0,0,1,2.31,15.17q0,14.16-6,23.27a28.08,28.08,0,0,1-16.19,12,12.93,12.93,0,0,0,6.65,5.09A26.38,26.38,0,0,0,168.8,85a22.8,22.8,0,0,0,4.24-.38,23.47,23.47,0,0,0,3.49-.91Zm-51-52.1q0,11.26,4.19,17.48a13.5,13.5,0,0,0,22.74,0q4.18-6.22,4.18-17.48,0-10.51-4.19-16.41a13.9,13.9,0,0,0-22.74,0Q128.36,32.7,128.36,43.21Z"/><path class="cls-1" d="M182.72,8.56h15.87V47.7q0,10.3,3.11,14.37t9,4.07q5.9,0,9.11-4.08t3.21-14.37V8.54h15.23V46.08q0,17.59-7,25.63t-20.54,8q-13.62,0-20.81-8t-7.19-25.63V8.56Z"/><path class="cls-1" d="M280.33,61.83H259L254.7,78.46H238.61L260.47,8.53h19l21.9,69.92H284.62ZM277.1,49.5l-1.61-6.43q-1.5-5.25-2.9-11.15T269.8,20.54h-0.43q-1.28,5.58-2.62,11.42t-2.84,11.1L262.2,49.5H277.1Z"/><path class="cls-1" d="M311.21,53.56l-21.14-45H307l6.23,16.08q1.5,4,2.84,7.67T318.93,40h0.43q1.5-4.07,2.95-7.78t2.95-7.67l6.32-16.09h16.52L327,53.56V78.44H311.22V53.56Z"/><polygon class="cls-2" points="75.13 0 95.99 44.12 75.13 88.23 57.38 88.23 78.23 44.12 57.38 0 75.13 0"/><polygon class="cls-1" points="57.38 88.23 36.52 44.12 57.38 0 75.13 0 54.28 44.12 75.13 88.23 57.38 88.23"/><polygon class="cls-2" points="47.99 19.85 38.61 0 20.86 0 39.12 38.63 47.99 19.85"/><polygon class="cls-2" points="39.12 49.6 20.86 88.23 38.61 88.23 47.99 68.38 39.12 49.6"/><polygon class="cls-1" points="20.86 88.23 0 44.12 20.86 0 38.61 0 17.75 44.12 38.61 88.23 20.86 88.23"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 1.9 KiB

8
static/js/app.js
View file

@ -274,7 +274,13 @@ quayApp.run(['$location', '$rootScope', 'Restangular', 'UserService', 'PlanServi
if (!current.$$route) { return; }
$rootScope.pageClass = current.$$route.pageClass || '';
var pageClass = current.$$route.pageClass || '';
if (typeof pageClass != 'string') {
pageClass = pageClass(Features);
}
$rootScope.pageClass = pageClass;
$rootScope.newLayout = !!current.$$route.newLayout;
$rootScope.fixFooter = !!current.$$route.fixFooter;

10
static/js/directives/ui/header-bar.js
View file

@ -160,15 +160,7 @@ angular.module('quay').directive('headerBar', function () {
};
$scope.getEnterpriseLogo = function() {
if (!Config.ENTERPRISE_LOGO_URL) {
if (Features.BILLING) {
return '/static/img/quay-horizontal-whiteblue-nobackground.svg';
} else {
return '/static/img/QuayEnterprise_horizontal_color.svg'
}
}
return Config.ENTERPRISE_LOGO_URL;
return Config.getEnterpriseLogo(false);
};
$scope.toggleSearch = function() {

35
static/js/directives/ui/recovery-form.js Normal file
View file

@ -0,0 +1,35 @@
/**
* An element which displays a box for the user to recover their account.
*/
angular.module('quay').directive('recoveryForm', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/recovery-form.html',
replace: false,
transclude: true,
restrict: 'C',
scope: {
},
controller: function($scope, $location, $timeout, ApiService, KeyService, UserService, Config, Features) {
$scope.Config = Config;
$scope.Features = Features;
$scope.sendRecovery = function() {
$scope.sendingRecovery = true;
ApiService.requestRecoveryEmail($scope.recovery).then(function(resp) {
$scope.invalidRecovery = false;
$scope.errorMessage = '';
$scope.sent = resp;
$scope.sendingRecovery = false;
}, function(resp) {
$scope.invalidRecovery = true;
$scope.errorMessage = ApiService.getErrorMessage(resp, 'Cannot send recovery email');
$scope.sent = null;
$scope.sendingRecovery = false;
});
};
}
};
return directiveDefinitionObject;
});

3
static/js/directives/ui/signup-form.js
View file

@ -18,8 +18,7 @@ angular.module('quay').directive('signupForm', function () {
$scope.awaitingConfirmation = false;
$scope.registering = false;
$scope.EXTERNAL_LOGINS = ExternalLoginService.EXTERNAL_LOGINS;
$scope.singleSigninUrl = ExternalLoginService.getSingleSigninUrl();
$scope.Config = Config;
$scope.register = function() {
UIService.hidePopover('#signupButton');

30
static/js/directives/ui/user-setup.js
View file

@ -10,9 +10,10 @@ angular.module('quay').directive('userSetup', function () {
restrict: 'C',
scope: {
'redirectUrl': '=redirectUrl',
'inviteCode': '=inviteCode',
'hideLogo': '@hideLogo',
'signInStarted': '&signInStarted',
'signedIn': '&signedIn',
'userRegistered': '&userRegistered'
@ -20,30 +21,23 @@ angular.module('quay').directive('userSetup', function () {
controller: function($scope, $location, $timeout, ApiService, KeyService, UserService, Config, Features) {
$scope.Config = Config;
$scope.Features = Features;
$scope.currentView = 'createAccount';
$scope.sendRecovery = function() {
$scope.sendingRecovery = true;
var hasSignedIn = function() {
return UserService.hasEverLoggedIn() || Config.AUTHENTICATION_TYPE != 'Database';
};
ApiService.requestRecoveryEmail($scope.recovery).then(function(resp) {
$scope.invalidRecovery = false;
$scope.errorMessage = '';
$scope.sent = resp;
$scope.sendingRecovery = false;
}, function(resp) {
$scope.invalidRecovery = true;
$scope.errorMessage = ApiService.getErrorMessage(resp, 'Cannot send recovery email');
$scope.sent = null;
$scope.sendingRecovery = false;
});
if (hasSignedIn()) {
$scope.currentView = 'signin';
}
$scope.setView = function(view) {
$scope.currentView = view;
};
$scope.handleUserRegistered = function(username) {
$scope.userRegistered({'username': username});
};
$scope.hasSignedIn = function() {
return UserService.hasEverLoggedIn() || Config.AUTHENTICATION_TYPE != 'Database';
};
}
};
return directiveDefinitionObject;

13
static/js/pages/landing.js
View file

@ -4,7 +4,9 @@
*/
angular.module('quayPages').config(['pages', function(pages) {
pages.create('landing', 'landing.html', LandingCtrl, {
'pageClass': 'landing-page'
'pageClass': function(Features) {
return Features.BILLING ? 'landing-page' : '';
}
});
}]);
@ -20,7 +22,6 @@
UserService.updateUserIn($scope, function(user) {
if (!user.anonymous) {
$location.path('/repository');
return;
}
});
@ -81,13 +82,5 @@
}
});
};
$scope.getEnterpriseLogo = function() {
if (!Config.ENTERPRISE_LOGO_URL) {
return '/static/img/QuayEnterprise_horizontal_color.svg';
}
return Config.ENTERPRISE_LOGO_URL;
};
}
})();

2
static/js/pages/signin.js
View file

@ -4,7 +4,7 @@
*/
angular.module('quayPages').config(['pages', function(pages) {
pages.create('signin', 'signin.html', SignInCtrl, {
'title': 'Sign In'
'title': 'Sign In',
});
}]);

18
static/js/services/features-config.js
View file

@ -35,7 +35,7 @@ angular.module('quay').factory('Features', [function() {
/**
* Application configuration.
*/
angular.module('quay').factory('Config', [function() {
angular.module('quay').factory('Config', ['Features', function(Features) {
if (!window.__config) {
return {};
}
@ -71,5 +71,21 @@ angular.module('quay').factory('Config', [function() {
return value;
};
config.getEnterpriseLogo = function(forWhiteBackground) {
if (!config.ENTERPRISE_LOGO_URL) {
if (Features.BILLING) {
if (forWhiteBackground) {
return '/static/img/quay-horizontal-color.svg';
} else {
return '/static/img/quay-horizontal-whiteblue-nobackground.svg';
}
} else {
return '/static/img/QuayEnterprise_horizontal_color.svg';
}
}
return config.ENTERPRISE_LOGO_URL;
};
return config;
}]);

23
static/partials/landing-login.html
View file

@ -1,18 +1,7 @@
<div class="jumbotron landing">
<div class="landing-background landing"></div>
<div class="landing-content">
<div class="cor-container">
<div class="row messages">
<div class="col-md-7">
<span class="enterprise-logo">
<img ng-src="{{ getEnterpriseLogo() }}">
</span>
</div> <!-- col -->
<div class="col-md-4 col-md-offset-1">
<div class="signup-form"></div>
</div> <!-- col -->
</div> <!-- row -->
</div> <!-- cor-container -->
<div class="cor-container signin-container">
<div class="row">
<div class="col-sm-4 col-sm-offset-4">
<div class="user-setup" redirect-url="redirectUrl"></div>
</div>
</div>
</div> <!-- jumbotron -->
</div>

6
static/partials/plans.html
View file

@ -610,15 +610,13 @@
</div>
<!-- Modal message dialog -->
<div class="co-dialog modal fade" id="signinModal">
<div class="modal fade" id="signinModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<div class="user-setup" signed-in="signedIn()" redirect-url="'/plans/'"></div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->

6
static/partials/repo-list.html
View file

@ -17,12 +17,8 @@
<div class="co-main-content-panel" ng-if="!loading && user.anonymous && !user.beforeload">
<!-- The user is not logged in -->
<div class="cor-container signin-container row">
<!-- Sign In -->
<div class="col-sm-6 col-sm-offset-3">
<div class="empty-primary-msg">You must be signed in to view repositories.</div>
<div class="user-setup" redirect-url="redirectUrl"></div>
</div>
<div class="user-setup" redirect-url="redirectUrl"></div>
</div>
</div>

4
static/partials/signin.html
View file

@ -1,7 +1,5 @@
<div class="cor-container signin-container">
<div class="row">
<div class="col-sm-6 col-sm-offset-3">
<div class="user-setup" redirect-url="redirectUrl"></div>
</div>
<div class="user-setup" redirect-url="redirectUrl"></div>
</div>
</div>