meetbot/sample_login_page.html

## sample_login_page.html
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
        <title>Account Link</title>
        <link href="/bootstrap/css/bootstrap.min.css" type="text/css" rel="stylesheet"/>
        <script src="/js/jquery.js"></script>
        <script src="/js/common_functions.js"></script>
    </head>
    <body>
        <div class="wrapper">
            <div class="container-fluid page-body">
                <div class="page-header">
                    <h1>Link Meetbot account</h1>
                </div>
                <div class="panel">
                    <div class="panel-body">
                        <div class="row">
                            <label>User name:</label>
                            <input class="pull-right" type="text" id="username"/>
                        </div>
                        <div class="row" style="margin-top:10px;">
                            <label>Password:</label>
                            <input class="pull-right" type="password" id="password"/>
                        </div>
                        <div class="row" style="margin-top:10px;">
                            <button onclick="account_link();" class="btn btn-success pull-right">Submit</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <script>
            function validateParams() {
                var username = $('#username').val();
                var password = $('#password').val();
                return username != '' && password != '';
            }
            function account_link() {
                var redirect_uri = '<?php echo $redirect_uri;?>';
                if (!validateParams()) {
                    alert('Please input user name and password');
                    return;
                }
                // Substitude this ajax call with the operation needed to account verify codes for your system.
                $.ajax({
                    type: "POST",
                    url: '/users/account-verify/<?php echo $page_id?>',
                    data: {
                        'username': $('#username').val(),
                        'password': $('#password').val()
                    },
                    success: function (data) {
                        if (data.result) {
                            // If the account is correct, redirect the location to the redirect_uri parameter with authorization_code appended.
                            var authorization_code = data.data.authorization_code;
                            var url = redirect_uri + '&authorization_code=' + authorization_code;
                            console.log('succ!');
                            console.log(url);
                            window.location.href = url;
                        } else {
                            // If the account is not correct, simply redirect the location to redirect_uri parameter.
                            console.log('fail!');
                            window.location.href = redirect_uri;
                        }
                    },
                    dataType: 'json'
                });
            }
        </script>
    </body>
    <style>
        .page-body {
            max-width: 300px;
            text-align: center;
        }
    </style>
</html>
	<html>
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
	<title>Account Link</title>
	<link href="/bootstrap/css/bootstrap.min.css" type="text/css" rel="stylesheet"/>
	<script src="/js/jquery.js"></script>
	<script src="/js/common_functions.js"></script>
	</head>
	<body>
	<div class="wrapper">
	<div class="container-fluid page-body">
	<div class="page-header">
	<h1>Link Meetbot account</h1>
	</div>
	<div class="panel">
	<div class="panel-body">
	<div class="row">
	<label>User name:</label>
	<input class="pull-right" type="text" id="username"/>
	</div>
	<div class="row" style="margin-top:10px;">
	<label>Password:</label>
	<input class="pull-right" type="password" id="password"/>
	</div>
	<div class="row" style="margin-top:10px;">
	<button onclick="account_link();" class="btn btn-success pull-right">Submit</button>
	</div>
	</div>
	</div>
	</div>
	</div>
	<script>
	function validateParams() {
	var username = $('#username').val();
	var password = $('#password').val();
	return username != '' && password != '';
	}
	function account_link() {
	var redirect_uri = '<?php echo $redirect_uri;?>';
	if (!validateParams()) {
	alert('Please input user name and password');
	return;
	}
	// Substitude this ajax call with the operation needed to account verify codes for your system.
	$.ajax({
	type: "POST",
	url: '/users/account-verify/<?php echo $page_id?>',
	data: {
	'username': $('#username').val(),
	'password': $('#password').val()
	},
	success: function (data) {
	if (data.result) {
	// If the account is correct, redirect the location to the redirect_uri parameter with authorization_code appended.
	var authorization_code = data.data.authorization_code;
	var url = redirect_uri + '&authorization_code=' + authorization_code;
	console.log('succ!');
	console.log(url);
	window.location.href = url;
	} else {
	// If the account is not correct, simply redirect the location to redirect_uri parameter.
	console.log('fail!');
	window.location.href = redirect_uri;
	}
	},
	dataType: 'json'
	});
	}
	</script>
	</body>
	<style>
	.page-body {
	max-width: 300px;
	text-align: center;
	}
	</style>
	</html>