Skip to content

Instantly share code, notes, and snippets.

@sgmeyer

sgmeyer/login.html

Last active January 30, 2017 22:03
Show Gist options
  • Save sgmeyer/524292715e639ed5956d467a8cc79eb8 to your computer and use it in GitHub Desktop.
Save sgmeyer/524292715e639ed5956d467a8cc79eb8 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
login.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Sign In with Auth0</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<style>
body,html{padding:0;margin:0}.table{display:table;position:absolute;height:100%;width:100%;background:linear-gradient(rgba(255,255,255,.3),rgba(255,255,255,0));background-color:#e8ebef}.cell{display:table-cell;vertical-align:middle}.content{padding:25px 0;margin-left:auto;margin-right:auto;width:280px}
</style>
</head>
<body>
<div class="table">
<div class="cell">
<div class="content">
<!-- WIDGET -->
<div id="widget-container"></div>
</div>
</div>
</div>
<!--[if IE 8]>
<script src="//cdnjs.cloudflare.com/ajax/libs/ie8/0.2.5/ie8.js"></script>
<![endif]-->
<!--[if lte IE 9]>
<script src="https://cdn.auth0.com/js/base64.js"></script>
<script src="https://cdn.auth0.com/js/es5-shim.min.js"></script>
<![endif]-->
<script src="https://cdn.auth0.com/js/lock/10.3/lock.min.js"></script>
<script src="//cdn.auth0.com/w2/auth0-7.5.0.min.js"></script>
<script>
// Decode utf8 characters properly
var config = JSON.parse(decodeURIComponent(escape(window.atob('@@config@@'))));
var connection = config.connection;
var prompt = config.prompt;
var initializationOptions = {
assetsUrl: config.assetsUrl,
cdn: config.cdn
};
var auth0 = new Auth0({
domain: config.auth0Domain,
clientID: config.clientID,
callbackURL: config.callbackURL,
responseType: config.callbackOnLocationHash ? 'token' : 'code'
});
auth0.getSSOData(true, function(err,sso) {
if (!err && sso.sso === true && sso.lastUsedConnection) {
connection = sso.lastUsedConnection;
} else {
console.log("Connection: " + JSON.stringify(sso));
var lock = new Auth0Lock(config.clientID, config.auth0Domain, initializationOptions);
lock.show({
// icon: '{YOUR_LOGO_URL}',
callbackURL: config.callbackURL,
responseType: config.callbackOnLocationHash ? 'token' : 'code',
dict: config.dict,
connections: connection ? [connection] : null,
rememberLastLogin: !prompt,
container: 'widget-container',
authParams: config.internalOptions
});
}
});
</script>
</body>
</html>
Raw
new-lock.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Sign In with Auth0</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
<body>
<!--[if IE 8]>
<script src="//cdnjs.cloudflare.com/ajax/libs/ie8/0.2.5/ie8.js"></script>
<![endif]-->
<!--[if lte IE 9]>
<script src="https://cdn.auth0.com/js/base64.js"></script>
<script src="https://cdn.auth0.com/js/es5-shim.min.js"></script>
<![endif]-->
<script src="//cdn.auth0.com/js/lock/10.9/lock.min.js"></script>
<script src="//cdn.auth0.com/js/auth0/8.2.0/auth0.min.js"></script>
<script>
// Decode utf8 characters properly
var config = JSON.parse(decodeURIComponent(escape(window.atob('@@config@@'))));
config.extraParams = config.extraParams || {};
var connection = config.connection;
var prompt = config.prompt;
var languageDictionary;
var language;
if (config.dict && config.dict.signin && config.dict.signin.title) {
languageDictionary = { title: config.dict.signin.title };
} else if (typeof config.dict === 'string') {
language = config.dict;
}
var loginHint = config.extraParams.login_hint;
var webAuth = new auth0.WebAuth({
domain: config.auth0Domain,
clientID: config.clientID,
callbackURL: config.callbackURL
});
webAuth.renewAuth({
audience: config.auidence,
scope: 'read:users',
redirectUri: config.callbackURL,
usePostMessage: false
}, function (err, authResult) {
var lock = new Auth0Lock(config.clientID, config.auth0Domain, {
auth: {
redirectUrl: config.callbackURL,
responseType: config.callbackOnLocationHash ? 'token' : 'code',
params: config.internalOptions
},
assetsUrl: config.assetsUrl,
allowedConnections: connection ? [connection] : null,
rememberLastLogin: !prompt,
language: language,
languageDictionary: languageDictionary,
theme: {
//logo: 'YOUR LOGO HERE',
//primaryColor: 'green'
},
prefill: loginHint ? { email: loginHint, username: loginHint } : null,
closable: false,
// uncomment if you want small buttons for social providers
// socialButtonStyle: 'small'
});
lock.show();
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment