Modify example project template.

Conflicts:
	example_project/provider_app/templates/base.html
	example_project/provider_app/templates/login.html
	example_project/provider_app/templates/oidc_provider/authorize.html
	example_project/provider_app/templates/oidc_provider/error.html
This commit is contained in:
Ignacio 2016-04-16 17:53:28 -03:00
parent af3a0c0581
commit fa4c95e97d
7 changed files with 109 additions and 129 deletions

View file

@ -1,6 +1,6 @@
# Example Project # Example Project
![Example Project](http://s12.postimg.org/e4uwlsi0d/Screenshot_from_2016_02_02_13_15_26.png) ![Example Project](http://i.imgur.com/IK3OZjx.png)
Run your own OIDC provider in a second. This is a Django app with all the necessary things to work with `django-oidc-provider` package. Run your own OIDC provider in a second. This is a Django app with all the necessary things to work with `django-oidc-provider` package.

View file

@ -1,22 +1,15 @@
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,800);
html {
font-size: 16px;
}
body { body {
font-family: 'Open Sans', sans-serif; background-color: #536dfe;
font-weight: 400; display: flex;
height: auto; min-height: 100vh;
padding-top: 10px; flex-direction: column;
} }
.ui.huge.header { #main-container {
font-size: 46px; flex: 1 0 auto;
font-weight: 800; padding-top: 40px;
} }
.ui.segment { footer {
font-size: 18px; padding-top: 0px !important;
font-weight: 300;
} }

View file

@ -6,42 +6,46 @@
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<title>OIDC Provider Example</title> <title>OpenID Provider Example</title>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.6/semantic.min.css"> <link rel="stylesheet" href="http://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.6/css/materialize.min.css">
<link rel="stylesheet" type="text/css" href="{% static 'css/custom.css' %}"> <link rel="stylesheet" type="text/css" href="{% static 'css/custom.css' %}">
</head> </head>
<div class="ui page grid fixed large blue inverted menu">
<a href="{% url 'home' %}" class=" item">django-oidc-provider</a>
<div class="right menu">
{% if user.is_authenticated %}
<a href="#" class="item">{{ user.email }}</a>
{% if user.is_superuser %}
<a href="{% url 'admin:index' %}" class="item">Admin</a>
{% endif %}
<a href="{% url 'logout' %}" class="item"><i class="remove icon"></i></a>
{% else %}
<a href="{% url 'login' %}" class="item">Login</a>
{% endif %}
</div>
</div>
{% block content %}{% endblock %} <div class="navbar-fixed">
<nav class="white">
<div class="ui stackable page grid"> <div class="nav-wrapper">
<div class="column"> <a href="{% url 'home' %}" class="brand-logo center black-text">OpenID Provider</a>
<div class="ui right aligned secondary segment"> <ul id="nav-mobile" class="right hide-on-med-and-down">
View the project <a href="https://github.com/juanifioren/django-oidc-provider" target="_BLANK">on Github</a>. Example by <a href="https://github.com/juanifioren" target="_BLANK">Juan Ignacio Fiorentino</a>. {% if user.is_authenticated %}
{% if user.is_superuser %}
<li><a href="{% url 'admin:index' %}" class="black-text">{% trans 'Admin' %}</a></li>
{% endif %}
<li><a href="{% url 'logout' %}" class="black-text">X</a></li>
{% else %}
<li><a href="{% url 'login' %}" class="black-text"><i class="material-icons left">input</i> {% trans 'Login' %}</a></li>
{% endif %}
</ul>
</div> </div>
</div> </nav>
</div> </div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <div id="main-container" class="container">
<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.6/semantic.min.js"></script> {% block content %}{% endblock %}
</div>
<footer class="page-footer white">
<div class="footer-copyright">
<div class="container black-text"><a href="https://www.linkedin.com/in/juanifioren" target="_BLANK">Created by Juan Ignacio Fiorentino</a><a class="right" href="https://github.com/juanifioren/django-oidc-provider" target="_BLANK">View on Github</a></div>
</div>
</footer>
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.6/js/materialize.min.js"></script>
</body> </body>
</html> </html>

View file

@ -4,46 +4,21 @@
{% block content %} {% block content %}
<div class="ui stackable page grid"> <div class="row">
<div class="row"> <div class="col s12 m10 offset-m1">
<div class="center aligned column"> <div class="card hoverable">
<i class="thumbs outline up massive icon"></i> <div class="card-content">
<h1 class="ui huge header">Congratulations! It works. <div class="sub header">... what's next?</div></h1> <h1 class="center-align flow-text indigo-text text-lighten-1">Example of an OpenID Connect 1.0 Provider. Built with the <a href="https://www.djangoproject.com/" target="_BLANK"><u>Django Framework</u></a> and <a href="https://github.com/juanifioren/django-oidc-provider" target="_BLANK"><u>django-oidc-provider</u></a> package.</h1>
</div> <p class="flow-text">Start by creating your clients <a href="{% url 'admin:index' %}oidc_provider/client/">here</a>.</p>
</div> <p class="flow-text">Also check that you've created at least one server key, do it <a href="{% url 'admin:index' %}oidc_provider/rsakey/">here</a>.</p>
<div class="row"> <div class="collection with-header">
<div class="column"> <div class="collection-header"><h4>Server Endpoints</h4></div>
<div class="ui segments"> <a href="{% url 'oidc_provider:provider_info' %}" class="collection-item indigo-text text-lighten-1">{% url 'oidc_provider:provider_info' %}</a>
<div class="ui segment"> <a href="{% url 'oidc_provider:jwks' %}" class="collection-item indigo-text text-lighten-1">{% url 'oidc_provider:jwks' %}</a>
<p>Now that you are an OpenID Connect Provider, start by creating your clients <a href="{% url 'admin:index' %}oidc_provider/client/" target="_BLANK">here</a>.</p> <a href="{% url 'oidc_provider:authorize' %}" class="collection-item indigo-text text-lighten-1">{% url 'oidc_provider:authorize' %}</a>
<p>Also check that you've created at least one server key, do it <a href="{% url 'admin:index' %}oidc_provider/rsakey/" target="_BLANK">here</a>.</p> <a href="{% url 'oidc_provider:token' %}" class="collection-item indigo-text text-lighten-1">{% url 'oidc_provider:token' %}</a>
<h2 class="ui header">Server Endpoints</h2> <a href="{% url 'oidc_provider:userinfo' %}" class="collection-item indigo-text text-lighten-1">{% url 'oidc_provider:userinfo' %}</a>
<div class="ui list"> <a href="{% url 'oidc_provider:logout' %}" class="collection-item indigo-text text-lighten-1">{% url 'oidc_provider:logout' %}</a>
<div class="item">
<a href="{% url 'oidc_provider:provider_info' %}" class="header">{% url 'oidc_provider:provider_info' %}</a>
<div class="description">The configuration information of the provider. <a href="http://openid.net/specs/openid-connect-discovery-1_0.html#ProviderConfig" target="_BLANK">Read more</a>.</div>
</div>
<div class="item">
<a href="{% url 'oidc_provider:jwks' %}" class="header">{% url 'oidc_provider:jwks' %}</a>
<div class="description">JavaScript Object Notation (JSON) data structure that represents a cryptographic key.</div>
</div>
<div class="item">
<a href="{% url 'oidc_provider:authorize' %}" class="header">{% url 'oidc_provider:authorize' %}</a>
<div class="description">This endpoint performs Authentication of the End-User. <a href="http://openid.net/specs/openid-connect-core-1_0.html#AuthorizationEndpoint" target="_BLANK">Read more</a>.</div>
</div>
<div class="item">
<a href="{% url 'oidc_provider:token' %}" class="header">{% url 'oidc_provider:token' %}</a>
<div class="description">Used to obtain an Access Token, an ID Token, and optionally a Refresh Token. <a href="http://openid.net/specs/openid-connect-core-1_0.html#TokenEndpoint" target="_BLANK">Read more</a>.</div>
</div>
<div class="item">
<a href="{% url 'oidc_provider:userinfo' %}" class="header">{% url 'oidc_provider:userinfo' %}</a>
<div class="description">OAuth 2.0 Protected Resource that returns Claims about the authenticated End-User. <a href="http://openid.net/specs/openid-connect-core-1_0.html#UserInfo" target="_BLANK">Read more</a>.</div>
</div>
<div class="item">
<a href="{% url 'oidc_provider:logout' %}" class="header">{% url 'oidc_provider:logout' %}</a>
<div class="description">Used to notify the OP that the End-User has logged out of the site. <a href="http://openid.net/specs/openid-connect-session-1_0.html#RPLogout" target="_BLANK">Read more</a>.</div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>

View file

@ -1,28 +1,38 @@
{% extends 'base.html' %} {% extends 'base.html' %}
{% load i18n %}
{% block content %} {% block content %}
<div class="ui page grid"> <div class="row">
<div class="row"> <div class="col s12 m8 offset-m2 l6 offset-l3">
<div class="six wide centered column"> <div class="card hoverable">
{% if form.errors %} <div class="card-content">
<div class="ui negative message"> <div class="row">
<p>Your username and password didn't match. Please try again.</p> {% if form.errors %}
<h5 class="red-text text-darken-1 flow-text center-align">Your username and password didn't match. Please try again.</h5>
{% endif %}
<form class="col s12" method="post" action="{% url 'login' %}">
{% csrf_token %}
<input type="hidden" name="next" value="{{ next }}">
<div class="row">
<div class="input-field col s12">
<i class="material-icons prefix">account_circle</i>
<input id="username" name="username" type="text" class="validate">
<label for="username">{% trans 'Username' %}</label>
</div>
</div>
<div class="row">
<div class="input-field col s12">
<i class="material-icons prefix">lock</i>
<input id="password" name="password" type="password" class="validate">
<label for="password">{% trans 'Password' %}</label>
</div>
</div>
<input class="waves-effect waves-light btn-large right green" type="submit" value="{% trans 'Enter' %}" />
</form>
</div>
</div> </div>
{% endif %}
<form class="ui form segment" method="post" action="{% url 'login' %}">
{% csrf_token %}
<input type="hidden" name="next" value="{{ next }}">
<div class="field">
<label>Username</label>
<input type="text" name="username">
</div>
<div class="field">
<label>Password</label>
<input type="password" name="password">
</div>
<input class="ui submit big primary fluid button" type="submit" value="Enter" />
</form>
</div> </div>
</div> </div>
</div> </div>

View file

@ -2,25 +2,24 @@
{% block content %} {% block content %}
<div class="ui page grid"> <div class="row">
<div class="nine wide centered column"> <div class="col s12 m8 offset-m2 l6 offset-l3">
<div class="ui segment"> <h4 class="grey-text text-lighten-3">Request for Permission</h4>
<h1 class="ui dividing header">Request for Permission</h1> <div class="card hoverable">
<p>Client <i>{{ client.name }}</i> would like to access this information of you.</p> <div class="card-content">
<form method="post" action="{% url 'oidc_provider:authorize' %}"> <p class="flow-text">Client <i>{{ client.name }}</i> would like to access this information of you.</p>
{% csrf_token %} <form method="post" action="{% url 'oidc_provider:authorize' %}">
{{ hidden_inputs }} {% csrf_token %}
<div class="ui bulleted list"> {{ hidden_inputs }}
{% for scope in params.scope %} <ul class="collection">
<div class="item">{{ scope | capfirst }}</div> {% for scope in params.scope %}
{% endfor %} <li class="collection-item">{{ scope | capfirst }}</li>
</div> {% endfor %}
<div class="ui fluid large buttons"> </ul>
<input class="ui button" type="submit" value="Cancel" /> <input class="waves-effect waves-light btn grey" type="submit" value="Cancel" />
<div class="or"></div> <input name="allow" class="waves-effect waves-light btn green right" type="submit" value="Authorize" />
<input name="allow" class="positive ui button" type="submit" value="Authorize" /> </form>
</div> </div>
</form>
</div> </div>
</div> </div>
</div> </div>

View file

@ -2,12 +2,11 @@
{% block content %} {% block content %}
<div class="ui page grid"> <div class="row">
<div class="nine wide centered column"> <div class="col s12 m8 offset-m2 l6 offset-l3">
<div class="ui icon negative large message"> <div class="card hoverable">
<i class="meh icon"></i> <div class="card-content">
<div class="content"> <h4 class="center-align red-text text-lighten-1">{{ error }}</h4>
<div class="header">{{ error }}</div>
<p>{{ description }}</p> <p>{{ description }}</p>
</div> </div>
</div> </div>