Edit client mock-up.

pull/59/head
Michael Jett 2012-04-16 15:09:06 -04:00
parent c4edd7111e
commit ed304fa391
1 changed files with 282 additions and 0 deletions

View File

@ -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>&nbsp;</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>&copy; Company 2012</p>
</footer>
</div>
</div>
</body>
</html>