sandeepneerarambham/index.html Secret

## index.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" />
  <!--[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://code.jquery.com/jquery-3.2.1.min.js"></script>
  <script src='https://www.google.com/recaptcha/api.js'></script>
  <script src="https://cdn.auth0.com/js/lock/10.18/lock.min.js"></script>
  <style>
    .container {
      position: absolute;
      width: 200px;
      height: 200px;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      margin: auto;
    }

    .item {
      width: 100px;
      height: 100px;
      position: absolute;
    }

    .item-1 {
      background-color: #FA5667;
      top: 0;
      left: 0;
      z-index: 1;
      animation: item-1_move 1.8s cubic-bezier(.6,.01,.4,1) infinite;
    }

    .item-2 {
      background-color: #7A45E5;
      top: 0;
      right: 0;
      animation: item-2_move 1.8s cubic-bezier(.6,.01,.4,1) infinite;
    }

    .item-3 {
      background-color: #1B91F7;
      bottom: 0;
      right: 0;
      z-index: 1;
      animation: item-3_move 1.8s cubic-bezier(.6,.01,.4,1) infinite;
    }

    .item-4 {
      background-color: #FAC24C;
      bottom: 0;
      left: 0;
      animation: item-4_move 1.8s cubic-bezier(.6,.01,.4,1) infinite;
    }

    @keyframes item-1_move {
      0%, 100% {transform: translate(0, 0)}
      25% {transform: translate(0, 100px)}
      50% {transform: translate(100px, 100px)}
      75% {transform: translate(100px, 0)}
    }

    @keyframes item-2_move {
      0%, 100% {transform: translate(0, 0)}
      25% {transform: translate(-100px, 0)}
      50% {transform: translate(-100px, 100px)}
      75% {transform: translate(0, 100px)}
    }

    @keyframes item-3_move {
      0%, 100% {transform: translate(0, 0)}
      25% {transform: translate(0, -100px)}
      50% {transform: translate(-100px, -100px)}
      75% {transform: translate(-100px, 0)}
    }

    @keyframes item-4_move {
      0%, 100% {transform: translate(0, 0)}
      25% {transform: translate(100px, 0)}
      50% {transform: translate(100px, -100px)}
      75% {transform: translate(0, -100px)}
    }
    .disabled {
      opacity: 0.65 !important;
      cursor: not-allowed !important;
    }
  </style>
  <script>
    $(document).ready(function(){
      $("#mycontainer").hide();
      var removeLoading = function() {
        // In a production application you would remove the loading class when your
        // application is initialized and ready to go.  Here we just artificially wait
        // 5 seconds before removing the class.
        setTimeout(function() {
          //html.className = html.className.replace(/loading/, '');
          $("#container").hide();
          $("#mycontainer").show();
        }, 5000);
      };
      removeLoading();
    });
  </script>

</head>
<body>
  <div class="container">
    <div class="item item-1"></div>
    <div class="item item-2"></div>
    <div class="item item-3"></div>
    <div class="item item-4"></div>
  </div>
  <div id="mycontainer"></div>
  <script>
     // ReCaptcha
    function addCaptcha() {
      grecaptcha.render('re-captcha', {
            'sitekey' : '6LeC1y0UAAAAAOQ0JxUWt3X_iUxp2-9bJ6FCTr7D',
            'callback' : verifyCallback,
            'theme' : 'dark'
          });
    }

    function verifyCallback() {
      var buttonCollection = document.getElementsByTagName('button');
      for (var i = 0 ; i < buttonCollection.length; i++) {
        buttonCollection[i].classList.remove("disabled");
        buttonCollection[i].disabled = false;
      }
    }
    function capdisable() {
      var buttonCollection = document.getElementsByTagName('button');
        for (var i = 0 ; i < buttonCollection.length; i++)  {
          buttonCollection[i].classList.add("disabled");
          buttonCollection[i].disabled = "disabled";
        }
    }

    $(document).ready(function () {
    // 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 lock = new Auth0Lock(config.clientID, config.auth0Domain, {
        container: "mycontainer",
        auth: {
          redirectUrl: config.callbackURL,
          responseType: (config.internalOptions || {}).response_type ||
            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'
    });
    function createCaptchaCallback() {
      var buttonList = $('#mycontainer').find('.auth0-lock-alternative');
      //Re-captcha custom button
      var recaptchaDiv = $('<div id="re-captcha" style="transform:scale(0.87);-webkit-transform:scale(0.87);transform-origin:0 0;-webkit-transform-origin:0 0;"></div>');
      buttonList.append(
        recaptchaDiv
      );
      addCaptcha();
    }
    lock.on('signin ready', function() {
      createCaptchaCallback();
    });
    lock.show();
  });
  $(window).on('load', function (e) {
    console.log('window loaded');
    setTimeout(capdisable, 3000);
  });
  </script>
</body>
</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" />
	<!--[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://code.jquery.com/jquery-3.2.1.min.js"></script>
	<script src='https://www.google.com/recaptcha/api.js'></script>
	<script src="https://cdn.auth0.com/js/lock/10.18/lock.min.js"></script>
	<style>
	.container {
	position: absolute;
	width: 200px;
	height: 200px;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	}

	.item {
	width: 100px;
	height: 100px;
	position: absolute;
	}

	.item-1 {
	background-color: #FA5667;
	top: 0;
	left: 0;
	z-index: 1;
	animation: item-1_move 1.8s cubic-bezier(.6,.01,.4,1) infinite;
	}

	.item-2 {
	background-color: #7A45E5;
	top: 0;
	right: 0;
	animation: item-2_move 1.8s cubic-bezier(.6,.01,.4,1) infinite;
	}

	.item-3 {
	background-color: #1B91F7;
	bottom: 0;
	right: 0;
	z-index: 1;
	animation: item-3_move 1.8s cubic-bezier(.6,.01,.4,1) infinite;
	}

	.item-4 {
	background-color: #FAC24C;
	bottom: 0;
	left: 0;
	animation: item-4_move 1.8s cubic-bezier(.6,.01,.4,1) infinite;
	}

	@keyframes item-1_move {
	0%, 100% {transform: translate(0, 0)}
	25% {transform: translate(0, 100px)}
	50% {transform: translate(100px, 100px)}
	75% {transform: translate(100px, 0)}
	}

	@keyframes item-2_move {
	0%, 100% {transform: translate(0, 0)}
	25% {transform: translate(-100px, 0)}
	50% {transform: translate(-100px, 100px)}
	75% {transform: translate(0, 100px)}
	}

	@keyframes item-3_move {
	0%, 100% {transform: translate(0, 0)}
	25% {transform: translate(0, -100px)}
	50% {transform: translate(-100px, -100px)}
	75% {transform: translate(-100px, 0)}
	}

	@keyframes item-4_move {
	0%, 100% {transform: translate(0, 0)}
	25% {transform: translate(100px, 0)}
	50% {transform: translate(100px, -100px)}
	75% {transform: translate(0, -100px)}
	}
	.disabled {
	opacity: 0.65 !important;
	cursor: not-allowed !important;
	}
	</style>
	<script>
	$(document).ready(function(){
	$("#mycontainer").hide();
	var removeLoading = function() {
	// In a production application you would remove the loading class when your
	// application is initialized and ready to go. Here we just artificially wait
	// 5 seconds before removing the class.
	setTimeout(function() {
	//html.className = html.className.replace(/loading/, '');
	$("#container").hide();
	$("#mycontainer").show();
	}, 5000);
	};
	removeLoading();
	});
	</script>

	</head>
	<body>
	<div class="container">
	<div class="item item-1"></div>
	<div class="item item-2"></div>
	<div class="item item-3"></div>
	<div class="item item-4"></div>
	</div>
	<div id="mycontainer"></div>
	<script>
	// ReCaptcha
	function addCaptcha() {
	grecaptcha.render('re-captcha', {
	'sitekey' : '6LeC1y0UAAAAAOQ0JxUWt3X_iUxp2-9bJ6FCTr7D',
	'callback' : verifyCallback,
	'theme' : 'dark'
	});
	}

	function verifyCallback() {
	var buttonCollection = document.getElementsByTagName('button');
	for (var i = 0 ; i < buttonCollection.length; i++) {
	buttonCollection[i].classList.remove("disabled");
	buttonCollection[i].disabled = false;
	}
	}
	function capdisable() {
	var buttonCollection = document.getElementsByTagName('button');
	for (var i = 0 ; i < buttonCollection.length; i++) {
	buttonCollection[i].classList.add("disabled");
	buttonCollection[i].disabled = "disabled";
	}
	}

	$(document).ready(function () {
	// 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 lock = new Auth0Lock(config.clientID, config.auth0Domain, {
	container: "mycontainer",
	auth: {
	redirectUrl: config.callbackURL,
	responseType: (config.internalOptions \|\| {}).response_type \|\|
	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'
	});
	function createCaptchaCallback() {
	var buttonList = $('#mycontainer').find('.auth0-lock-alternative');
	//Re-captcha custom button
	var recaptchaDiv = $('<div id="re-captcha" style="transform:scale(0.87);-webkit-transform:scale(0.87);transform-origin:0 0;-webkit-transform-origin:0 0;"></div>');
	buttonList.append(
	recaptchaDiv
	);
	addCaptcha();
	}
	lock.on('signin ready', function() {
	createCaptchaCallback();
	});
	lock.show();
	});
	$(window).on('load', function (e) {
	console.log('window loaded');
	setTimeout(capdisable, 3000);
	});
	</script>
	</body>
	</html>