Skip to content

Commit

Permalink
Merge pull request #35 from esune/beautify-qr
Browse files Browse the repository at this point in the history
Updates to QR page
  • Loading branch information
esune authored Jan 27, 2020
2 parents 183c3fc + 451456f commit ef21708
Show file tree
Hide file tree
Showing 6 changed files with 126 additions and 38 deletions.
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ To start the demo run the following commands from within the `docker` folder:
Once you have the service running, a presentation request configuration must be configured on the service. You can configure this through either browsing to the swagger interface [here](http://localhost:5000) or running the following curl command with a valid request body

```
curl -X POST "http://localhost:5000/api/vc-configs" -H "accept: application/json" -H "X-Api-Key: test" -H "Content-Type: application/json-patch+json" -d "{ \"id\": \"test-request-config\", \"subject_identifier\": \"email\", \"configuration\": { \"name\": \"Basic Proof\", \"version\": \"1.0\", \"requested_attributes\": [ { \"name\": \"email\", \"restrictions\": [] }, { \"name\": \"first_name\", \"restrictions\": [] }, { \"name\": \"last_name\", \"restrictions\": [] } ], \"requested_predicates\": [] }}"
curl -X POST "http://localhost:5000/api/vc-configs" -H "accept: application/json" -H "X-Api-Key: controller-api-key" -H "Content-Type: application/json-patch+json" -d "{ \"id\": \"test-request-config\", \"subject_identifier\": \"email\", \"configuration\": { \"name\": \"Basic Proof\", \"version\": \"1.0\", \"requested_attributes\": [ { \"name\": \"email\", \"restrictions\": [] }, { \"name\": \"first_name\", \"restrictions\": [] }, { \"name\": \"last_name\", \"restrictions\": [] } ], \"requested_predicates\": [] }}"
```

> The API is protected with an APIKey which defaults to `Test` in the demo
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@
using Microsoft.AspNetCore.Mvc.ViewFeatures;
using Microsoft.AspNetCore.Routing;
using Microsoft.Extensions.DependencyInjection;
using VCAuthn.Models;

namespace VCAuthn.IdentityServer.Endpoints
{
Expand All @@ -21,11 +22,14 @@ public class AuthorizationViewModel
public string ResolutionUrl { get; }
public int Interval { get; }

public AuthorizationViewModel(string challenge, string pollUrl, string resolutionUrl)
public PresentationRequest PresentationRequest { get; }

public AuthorizationViewModel(string challenge, string pollUrl, string resolutionUrl, PresentationRequest presentationRequest = null)
{
Challenge = challenge;
PollUrl = pollUrl;
ResolutionUrl = resolutionUrl;
PresentationRequest = presentationRequest;
Interval = 2000;
}
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -165,7 +165,7 @@ public async Task<IEndpointResult> ProcessAsync(HttpContext context)
{
PresentationRequestId = presentationRequestId,
PresentationRecordId = presentationRecordId,
PresentationRequest = presentationRequest.Request.ExtractIndyPresentationPequest().ToJson(),
PresentationRequest = presentationRequest.Request.ExtractIndyPresentationRequest().ToJson(),
RequestParameters = values.AllKeys.ToDictionary(t => t, t => values[t])
});

Expand All @@ -182,7 +182,9 @@ public async Task<IEndpointResult> ProcessAsync(HttpContext context)
new AuthorizationViewModel(
shortUrl,
$"{_options.PublicOrigin}/{IdentityConstants.ChallengePollUri}?{IdentityConstants.ChallengeIdQueryParameterName}={presentationRequestId}",
$"{_options.PublicOrigin}/{IdentityConstants.AuthorizeCallbackUri}?{IdentityConstants.ChallengeIdQueryParameterName}={presentationRequestId}"));
$"{_options.PublicOrigin}/{IdentityConstants.AuthorizeCallbackUri}?{IdentityConstants.ChallengeIdQueryParameterName}={presentationRequestId}",
presentationRequest.Request.ExtractIndyPresentationRequest()
));
}

private PresentationRequestMessage BuildPresentationRequest(CreatePresentationResponse response, WalletPublicDid acapyPublicDid)
Expand Down
4 changes: 2 additions & 2 deletions oidc-controller/src/VCAuthn/Utils/PresentationRequestUtils.cs
Original file line number Diff line number Diff line change
Expand Up @@ -56,15 +56,15 @@ public static List<PresentationAttachment> GeneratePresentationAttachments(this
/// is identified by <c>"@id": "libindy-request-presentation-0"</c>, as specified in the Aries RFC 0037.
/// <see cref="https://github.com/hyperledger/aries-rfcs/tree/master/features/0037-present-proof#request-presentation"/>
/// </summary>
public static PresentationRequest ExtractIndyPresentationPequest(this List<PresentationAttachment> presentationAttachments)
public static PresentationRequest ExtractIndyPresentationRequest(this List<PresentationAttachment> presentationAttachments)
{
PresentationRequest presentationRequest = null;

presentationAttachments.ForEach(delegate(PresentationAttachment attachment)
{
if (attachment.Id.Equals("libindy-request-presentation-0"))
{
// found first indy presentation attachment, deserialize it so thatit can be returned
// found first indy presentation attachment, deserialize it so that it can be returned
presentationRequest = attachment.Data["base64"].toPresentationRequestObject();
}
});
Expand Down
3 changes: 2 additions & 1 deletion oidc-controller/src/VCAuthn/VCAuthn.csproj
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
</PropertyGroup>

<ItemGroup>
<PackageReference Include="IdentityServer4" Version="2.5.1" />
<PackageReference Include="IdentityServer4" Version="2.5.4" />
<PackageReference Include="IdentityServer4.EntityFramework" Version="2.5.1" />
<PackageReference Include="Microsoft.AspNetCore.App" />
<PackageReference Include="Microsoft.AspNetCore.Razor.Design" Version="2.2.0" PrivateAssets="All" />
Expand All @@ -15,6 +15,7 @@
<PackageReference Include="Swashbuckle.AspNetCore.Swagger" Version="4.0.1" />
<PackageReference Include="Swashbuckle.AspNetCore.SwaggerGen" Version="4.0.1" />
<PackageReference Include="Swashbuckle.AspNetCore.SwaggerUi" Version="4.0.1" />
<PackageReference Include="QRCoder" Version="1.3.6" />
</ItemGroup>

<ItemGroup>
Expand Down
143 changes: 112 additions & 31 deletions oidc-controller/src/VCAuthn/Views/Authorize/Authorize.cshtml
Original file line number Diff line number Diff line change
Expand Up @@ -4,54 +4,97 @@
var txtUri = $"{Model.Challenge}";
var qrUri = $"https://chart.googleapis.com/chart?cht=qr&chs=300x300&chld=L|0&chl={Uri.EscapeDataString(Model.Challenge)}";
}
<span>
<input id="pollInterval" value="@Model.Interval" style="display: none" />
<input id="pollUrl" value="@Model.PollUrl" style="display: none" />
<input id="resolutionUrl" value="@Model.ResolutionUrl" style="display: none" />

<div class="container">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="704.094" height="441" viewBox="0 0 704.094 441">
<g id="Symbol_3_9" data-name="Symbol 3 – 9" transform="translate(-158.5 -31)">
<g id="Group_28" data-name="Group 28" transform="translate(-1 -8)">
<g id="Group_26" data-name="Group 26" transform="translate(112)">
<g id="iphone_6:7_black" data-name="iphone 6:7 black" transform="translate(2333.094 909) rotate(90)">
<rect id="Rectangle_1" data-name="Rectangle 1" width="325" height="703.094" rx="58" transform="translate(-808 1582)" fill="#fff" stroke="#707070" stroke-width="1"/>
<rect id="IMG_4428" width="301.671" height="536.572" rx="4" stroke-width="1" fill="#fff" stroke="#707070" transform="translate(-795.933 1663.25)"/>
</g>
</g>
</g>
</g>
<image id="frame" width="288" height="288" transform="translate(209.5 76)" xlink:href="@qrUri"/>
</svg>
<a href="@txtUri">@txtUri</a>
<div>
<!-- These fields are used by the script at the bottom of the page -->
<input id="pollInterval" value="@Model.Interval" style="display: none" />
<input id="pollUrl" value="@Model.PollUrl" style="display: none" />
<input id="resolutionUrl" value="@Model.ResolutionUrl" style="display: none" />
</div>
</span>

<button class="back" onclick="history.back(-1)">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="fff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-left"><line x1="19" y1="12" x2="5" y2="12"></line><polyline points="12 19 5 12 12 5"></polyline></svg>
</button>

<div class="content">

<div class="introduction">
<h2>
Please scan the QR code to initiate the <strong>Verifiable Credential</strong> exchange
</h2>
</div>

<div class="qr-code-display">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 700 400">
<image id="frame" width="300" height="300" transform="translate(209.5 76)" xlink:href="@qrUri"/>
</svg>
<span>
<a class="qr-url" href="@txtUri">@txtUri</a>
</span>
</div>

<div class="presentation-restrictions">
<p>
The credential must meet the following requirements:
</p>

<div class="requested-claims">
@{
foreach (var item in Model.PresentationRequest.RequestedAttributes)
{
<div class="claim-group">
<span class="claim-name">Claim Name:</span> <span class="claim-value">@item.Value.Name</span>
<br/>
<span class="claim-restrictions-title">Claim restrictions:</span>
<ul class="claim-restriction-list">
@{
foreach (var restriction in item.Value.Restrictions) {
if (!String.IsNullOrEmpty(@restriction.IssuerDid)) {
@:<li class="restriction-item">Issuer DID: <span class="claim-value">@restriction.IssuerDid</span></li>
}
if (!String.IsNullOrEmpty(@restriction.SchemaId)) {
@:<li class="restriction-item">Schema Id: <span class="claim-value">@restriction.SchemaId</span></li>
}
if (!String.IsNullOrEmpty(@restriction.SchemaIssuerDid)) {
@:<li class="restriction-item">Schema Issuer DID: <span class="claim-value">@restriction.SchemaIssuerDid</span></li>
}
if (!String.IsNullOrEmpty(@restriction.SchemaName)) {
@:<li class="restriction-item">Schema Name: <span class="claim-value">@restriction.SchemaName</span></li>
}
if (!String.IsNullOrEmpty(@restriction.SchemaVersion)) {
@:<li class="restriction-item">Schema Version: <span class="claim-value">@restriction.SchemaVersion</span></li>
}
if (!String.IsNullOrEmpty(@restriction.CredentialDefinitionId)) {
@:<li class="restriction-item">Credential Definition Id: <span class="claim-value">@restriction.CredentialDefinitionId</span></li>
}
}
}
</ul>
</div>
}
}
</div>
</div>

</div>

<style>
* {
box-sizing: border-box;
}
body {
background: #333132;
padding: 0;
background: #fff;
padding: 5px;
margin: 0;
border:0;
height: 100vh;
}
.container {
.content {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding-top: 12px;
height: 100vh;
width: 100vw;
padding: 12px;
background-color: slategrey;
border: 1px solid navy;
border-radius: 15px;
}
.back {
Expand All @@ -63,6 +106,44 @@
width: 64px;
height: 64px;
}
.introduction {
text-align: center;
}
.claim-value {
font-style: italic;
font-weight: lighter;
}
.claim-restriction-list {
list-style: upper-roman;
}
.claim-group:nth-child(n+2) {
border-top: 1px black dotted;
}
.requested-claims {
background-color: ghostwhite;
padding: 5px;
}
.qr-code-display {
display: flex;
flex-direction: column;
align-items: center;
word-break: break-all;
overflow-wrap: break-word;
}
.qr-url {
color: navy;
}
.presentation-restrictions {
margin-top: 50px;
}
</style>

<script type="text/javascript">
Expand Down

0 comments on commit ef21708

Please sign in to comment.