Edit client mock-up.
parent
c4edd7111e
commit
ed304fa391
|
@ -0,0 +1,282 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>OpenID Connect</title>
|
||||||
|
<meta name="description" content="">
|
||||||
|
<meta name="author" content="">
|
||||||
|
|
||||||
|
<!-- Le javascript -->
|
||||||
|
<script src="http://code.jquery.com/jquery-1.7.min.js"></script>
|
||||||
|
<script src="../bootstrap/js/bootstrap-modal.js"></script>
|
||||||
|
<script src="../bootstrap/js/bootstrap-alerts.js"></script>
|
||||||
|
<script src="../bootstrap/js/bootstrap-twipsy.js"></script>
|
||||||
|
<script src="../bootstrap/js/bootstrap-popover.js"></script>
|
||||||
|
<script src="../bootstrap/js/bootstrap-dropdown.js"></script>
|
||||||
|
<script src="../bootstrap/js/bootstrap-scrollspy.js"></script>
|
||||||
|
<script src="../bootstrap/js/bootstrap-tabs.js"></script>
|
||||||
|
<script src="../bootstrap/js/bootstrap-buttons.js"></script>
|
||||||
|
<script src="../js/tmpl.js"></script>
|
||||||
|
|
||||||
|
<script>$(function () {
|
||||||
|
|
||||||
|
var ExampleOpenIdClient = {
|
||||||
|
name:"A name",
|
||||||
|
redirectURL:"http://myURL.domain",
|
||||||
|
grantType:["my grant type 1", "my grant type 2"],
|
||||||
|
scope:["scope 1", "scope 2"],
|
||||||
|
authority:"my authority",
|
||||||
|
description:"my description",
|
||||||
|
refreshTokens:false
|
||||||
|
};
|
||||||
|
|
||||||
|
console.log(tmpl('client_tmpl', ExampleOpenIdClient));
|
||||||
|
|
||||||
|
$('#client-table').append(tmpl('client_tmpl', ExampleOpenIdClient));
|
||||||
|
|
||||||
|
})</script>
|
||||||
|
|
||||||
|
<!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
|
||||||
|
<!--[if lt IE 9]>
|
||||||
|
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
|
||||||
|
<![endif]-->
|
||||||
|
|
||||||
|
<!-- Le styles -->
|
||||||
|
<link href="../bootstrap/bootstrap.css" rel="stylesheet">
|
||||||
|
<style type="text/css">
|
||||||
|
body {
|
||||||
|
padding-top: 60px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1,label {
|
||||||
|
text-shadow: 1px 1px 1px #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo {
|
||||||
|
background: url("../images/openid_small.png") no-repeat left center;
|
||||||
|
padding-left: 30px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<!-- Le fav and touch icons -->
|
||||||
|
<link rel="shortcut icon" href="images/favicon.ico">
|
||||||
|
<link rel="apple-touch-icon" href="images/apple-touch-icon.png">
|
||||||
|
<link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png">
|
||||||
|
<link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="topbar">
|
||||||
|
<div class="topbar-inner">
|
||||||
|
<div class="container-fluid">
|
||||||
|
<a class="brand" href="#"><span class="logo">OpenID Connect Server</span></a>
|
||||||
|
<ul class="nav">
|
||||||
|
<li class="active"><a href="#">Home</a></li>
|
||||||
|
<li><a href="#about">About</a></li>
|
||||||
|
<li><a href="#about">Statistics</a></li>
|
||||||
|
<li><a href="#contact">Contact</a></li>
|
||||||
|
</ul>
|
||||||
|
<p class="pull-right">Logged in as <a href="#">username</a></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="container-fluid">
|
||||||
|
<div class="sidebar">
|
||||||
|
<div class="well">
|
||||||
|
<h5>Administrative</h5>
|
||||||
|
<ul>
|
||||||
|
<li><a href="#">Manage Clients</a></li>
|
||||||
|
<li><a href="#">White Lists</a></li>
|
||||||
|
<li><a href="#">Black Lists</a></li>
|
||||||
|
</ul>
|
||||||
|
<h5>Personal</h5>
|
||||||
|
<ul>
|
||||||
|
<li><a href="#">Manage Sites</a></li>
|
||||||
|
<li><a href="#">Manage Active Tokens</a></li>
|
||||||
|
<li><a href="#">Profile</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="content">
|
||||||
|
<div class="">
|
||||||
|
<ul class="breadcrumb">
|
||||||
|
<li><a href="#">Home</a> <span class="divider">/</span></li>
|
||||||
|
<li class="active"><a href="#">Manage Clients</a><span class="divider">/</span></li>
|
||||||
|
Edit Client
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
|
||||||
|
<h1>Edit Client</h1>
|
||||||
|
|
||||||
|
<div id="edit-client-form">
|
||||||
|
<div>
|
||||||
|
|
||||||
|
<form>
|
||||||
|
<fieldset>
|
||||||
|
<legend>OpenID Client</legend>
|
||||||
|
</fieldset>
|
||||||
|
<div class="clearfix">
|
||||||
|
<label for="xlInput">Client Name</label>
|
||||||
|
|
||||||
|
<div class="input">
|
||||||
|
<input type="text" size="30" name="xlInput" id="xlInput" class="xlarge">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="clearfix">
|
||||||
|
<label for="prependedInput">Redirect Url</label>
|
||||||
|
|
||||||
|
<div class="input">
|
||||||
|
<div class="input-prepend">
|
||||||
|
<span class="add-on">http://</span>
|
||||||
|
<input type="text" size="16" name="prependedInput" id="prependedInput"
|
||||||
|
class="medium">
|
||||||
|
</div>
|
||||||
|
<span class="help-block">Url to be redirected</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="clearfix">
|
||||||
|
<label id="optionsCheckboxes">Grant Types:</label>
|
||||||
|
|
||||||
|
<div class="input">
|
||||||
|
<ul class="inputs-list">
|
||||||
|
<li>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" value="option1" name="optionsCheckboxes">
|
||||||
|
<span>Grant Type Blah</span>
|
||||||
|
</label>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" value="option2" name="optionsCheckboxes">
|
||||||
|
<span>Grant Type Blah</span>
|
||||||
|
</label>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" value="option2" name="optionsCheckboxes">
|
||||||
|
<span>Grant Type Blah</span>
|
||||||
|
</label>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<span class="help-block">
|
||||||
|
<strong>Note:</strong> Grant type help text.
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="clearfix">
|
||||||
|
<label for="textarea2">Scope</label>
|
||||||
|
|
||||||
|
<div class="input">
|
||||||
|
<textarea rows="3" name="textarea2" id="textarea2" class="xlarge">email,first
|
||||||
|
name</textarea>
|
||||||
|
<span class="help-block">
|
||||||
|
Please enter scopes separated by commas
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="clearfix">
|
||||||
|
<label id="authorities">Authorities:</label>
|
||||||
|
|
||||||
|
<div class="input">
|
||||||
|
<ul class="inputs-list">
|
||||||
|
<li>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" name="optionsCheckboxes" value="option1">
|
||||||
|
<span>Authority Type Blah</span>
|
||||||
|
</label>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" name="optionsCheckboxes" value="option2">
|
||||||
|
<span>Authority Type Blah</span>
|
||||||
|
</label>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" name="optionsCheckboxes" value="option2">
|
||||||
|
<span>Authority Type Blah</span>
|
||||||
|
</label>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<span class="help-block">
|
||||||
|
<strong>Note:</strong> Authority type help text.
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="clearfix">
|
||||||
|
<label for="appendedInput">Access Token Timeout</label>
|
||||||
|
|
||||||
|
<div class="input">
|
||||||
|
<div class="input-append">
|
||||||
|
<input type="text" size="16" name="appendedInput" id="appendedInput" class="mini">
|
||||||
|
<label class="add-on">seconds</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="clearfix">
|
||||||
|
<label for="form-description">Description</label>
|
||||||
|
|
||||||
|
<div class="input">
|
||||||
|
<input type="text" size="30" name="form-description" id="form-description"
|
||||||
|
class="xlarge">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="clearfix">
|
||||||
|
<label id="form-allow-tokens">Allow refresh tokens?</label>
|
||||||
|
|
||||||
|
<div class="input">
|
||||||
|
<ul class="inputs-list">
|
||||||
|
<li>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" value="option1" name="form-allow-tokens">
|
||||||
|
<span> </span>
|
||||||
|
</label>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<span class="help-block">
|
||||||
|
<strong>Note:</strong> Labels surround all the options for much larger click areas and a more usable form.
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="clearfix">
|
||||||
|
<label for="appendedInput">Refresh Token Timeout</label>
|
||||||
|
|
||||||
|
<div class="input">
|
||||||
|
<div class="input-append">
|
||||||
|
<input type="text" size="16" name="appendedInput" id="refresh-token-timout"
|
||||||
|
class="mini">
|
||||||
|
<label class="add-on">seconds</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
<div class="modal-footer">
|
||||||
|
<a href="#" class="btn primary">Save</a>
|
||||||
|
<a href="#" class="btn secondary">Cancel</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<p>© Company 2012</p>
|
||||||
|
</footer>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
Loading…
Reference in New Issue