Skip to content

Commit 2f95e5e

Browse files
emmas-yotiemmas-yoti
committed
SDK-495: Updating django demo project to new demo style
1 parent 9b846c0 commit 2f95e5e

File tree

8 files changed

+191
-404
lines changed

8 files changed

+191
-404
lines changed

‎examples/yoti_example_django/.env.example‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
1-
YOTI_APPLICATION_ID=yourApplicationId
1+
YOTI_SCENARIO_ID=yourScenarioId
22
YOTI_CLIENT_SDK_ID=yourClientSdkId
33
YOTI_KEY_FILE_PATH=yourKeyFilePath

‎examples/yoti_example_django/Dockerfile‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
11
FROM python:3.7-slim
2-
ARG YOTI_APPLICATION_ID
2+
ARG YOTI_SCENARIO_ID
33
ARG YOTI_CLIENT_SDK_ID
44
ARG YOTI_KEY_FILE_PATH
5-
RUN if [ "$YOTI_APPLICATION_ID" = "yourApplicationId" ] ; then echo YOTI_APPLICATION_ID not set; exit 1; else echo YOTI_APPLICATION_ID is $YOTI_APPLICATION_ID ; fi
5+
RUN if [ "$YOTI_SCENARIO_ID" = "yourScenarioId" ] ; then echo YOTI_SCENARIO_ID not set; exit 1; else echo YOTI_SCENARIO_ID is $YOTI_SCENARIO_ID ; fi
66
RUN if [ "$YOTI_CLIENT_SDK_ID" = "yourClientSdkId" ] ; then echo YOTI_CLIENT_SDK_ID not set; exit 1; else echo YOTI_CLIENT_SDK_ID is $YOTI_CLIENT_SDK_ID ; fi
77
RUN if [ "$YOTI_KEY_FILE_PATH" = "yourKeyFilePath" ] ; then echo YOTI_KEY_FILE_PATH not set; exit 1; else echo YOTI_KEY_FILE_PATH is $YOTI_KEY_FILE_PATH ; fi
88
ADD . /code
99
WORKDIR /code
1010
RUN pip install --no-cache-dir -r requirements.txt
11-
ENV YOTI_APPLICATION_ID $YOTI_APPLICATION_ID
11+
ENV YOTI_SCENARIO_ID $YOTI_SCENARIO_ID
1212
ENV YOTI_CLIENT_SDK_ID $YOTI_CLIENT_SDK_ID
1313
ENV YOTI_KEY_FILE_PATH $YOTI_KEY_FILE_PATH
1414

‎examples/yoti_example_django/app_settings.py‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
from os import environ
22

3-
YOTI_APPLICATION_ID = environ.get('YOTI_APPLICATION_ID')
3+
YOTI_SCENARIO_ID = environ.get('YOTI_SCENARIO_ID')
44
YOTI_CLIENT_SDK_ID = environ.get('YOTI_CLIENT_SDK_ID')
55
YOTI_KEY_FILE_PATH = environ.get('YOTI_KEY_FILE_PATH')

‎examples/yoti_example_django/docker-compose.yml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ services:
44
build:
55
context: ./
66
args:
7-
YOTI_APPLICATION_ID: "${YOTI_APPLICATION_ID}"
7+
YOTI_SCENARIO_ID: "${YOTI_SCENARIO_ID}"
88
YOTI_CLIENT_SDK_ID: "${YOTI_CLIENT_SDK_ID}"
99
YOTI_KEY_FILE_PATH: "${YOTI_KEY_FILE_PATH}"
1010
ports:

‎examples/yoti_example_django/yoti_example/templates/attribute_snippet.html‎

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
{% if prop.value %}
2+
<div class="yoti-attribute-list-item">
3+
<div class="yoti-attribute-name">
4+
<div class="yoti-attribute-name-cell">
5+
<i class="{{ icon }}"></i>
6+
<span class="yoti-attribute-name-cell-text">{{ name }}</span>
7+
</div>
8+
</div>
9+
10+
<div class="yoti-attribute-value">
11+
<div class="yoti-attribute-value-text">
12+
{% if prop.name == "document_images" %}
13+
{% for image in prop.value %}
14+
<img src="{image.value.base64_content() }" />
15+
{% endfor %}
16+
{% elif prop.name == "structured_postal_address" %}
17+
<table>
18+
{% for key, value in prop.value.items %}
19+
<tr>
20+
<td>{{ key }}</td>
21+
<td>{{ value }}</td>
22+
</tr>
23+
{% endfor %}
24+
</table>
25+
{% else %}
26+
{{ prevalue }}
27+
{{ prop.value }}
28+
{% endif %}
29+
</div>
30+
</div>
31+
<div class="yoti-attribute-anchors-layout">
32+
<div class="yoti-attribute-anchors-head -s-v">S / V</div>
33+
<div class="yoti-attribute-anchors-head -value">Value</div>
34+
<div class="yoti-attribute-anchors-head -subtype">Sub type</div>
35+
{% for source in prop.sources %}
36+
<div class="yoti-attribute-anchors -s-v">Source</div>
37+
<div class="yoti-attribute-anchors -value">{{ source.value }}</div>
38+
<div class="yoti-attribute-anchors -subtype">{{ source.subtype }}</div>
39+
{% endfor %}
40+
{% for verifier in prop.verifiers %}
41+
<div class="yoti-attribute-anchors -s-v">Verifier</div>
42+
<div class="yoti-attribute-anchors -value">{{ verifier.value }}</div>
43+
<div class="yoti-attribute-anchors -subtype">{{ verifier.subtype }}</div>
44+
{% endfor %}
45+
</div>
46+
</div>
47+
{% endif %}

‎examples/yoti_example_django/yoti_example/templates/index.html‎

Lines changed: 72 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,83 @@
11
<!DOCTYPE html>
2-
<html lang="en">
2+
<html class="yoti-html">
3+
34
<head>
4-
<!-- Your header content -->
5-
<script src="https://sdk.yoti.com/clients/browser.2.2.0.js"></script>
6-
<meta charset="UTF-8">
7-
<title>Index</title>
5+
<meta charset="utf-8" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
7+
<title>Yoti client example</title>
8+
<link rel="stylesheet" type="text/css" href="/static/index.css" />
9+
<link href="https://fonts.googleapis.com/css?family=Roboto:400,700" rel="stylesheet" />
810
</head>
911

10-
<body>
11-
<!-- Your website content -->
12+
<body class="yoti-body">
13+
14+
<main>
15+
<section class="yoti-top-section">
16+
<div class="yoti-logo-section">
17+
<img
18+
class="yoti-logo-image"
19+
src="/static/assets/logo.png"
20+
srcset="/static/assets/[email protected] 2x"
21+
alt="Yoti"/>
22+
</div>
23+
24+
<h1 class="yoti-top-header">We now accept Yoti</h1>
25+
26+
<div class="yoti-sdk-integration-section">
27+
<div id="yoti-share-button"></div>
28+
</div>
29+
30+
<div class="yoti-login-or-separator">or</div>
31+
32+
<div class="yoti-login-dialog">
33+
<h2 class="yoti-login-dialog-header">Login with your email:</h2>
34+
35+
<input class="yoti-input" type="text" placeholder="Name"/>
1236

13-
<!-- This span will create the Yoti button -->
14-
<span data-yoti-application-id="{{app_id}}">
15-
Log in with Yoti
16-
</span>
37+
<input class="yoti-input" type="text" placeholder="Email address"/>
1738

18-
<!-- This script snippet will also be required in your HTML body -->
19-
<script>
20-
_ybg.init()
39+
<div class="yoti-login-actions">
40+
<span class="yoti-login-forgot-button">forgot password?</span>
2141

42+
<button class="yoti-login-button">login</button>
43+
</div>
44+
</div>
45+
</section>
2246

47+
<section class="yoti-sponsor-app-section">
48+
<h3 class="yoti-sponsor-app-header">The Yoti app is free to download and use:</h3>
49+
50+
<div class="yoti-store-buttons-section">
51+
<a href="https://itunes.apple.com/us/app/yoti/id983980808?ls=1&mt=8" class="yoti-app-button-link">
52+
<img
53+
src="/static/assets/app-store-badge.png"
54+
srcset="/static/assets/[email protected] 2x"
55+
alt="Download on the App Store"/>
56+
</a>
57+
58+
<a href="https://play.google.com/store/apps/details?id=com.yoti.mobile.android.live" class="yoti-app-button-link">
59+
<img
60+
src="/static/assets/google-play-badge.png"
61+
srcset="/static/assets/[email protected] 2x"
62+
alt="get it on Google Play"/>
63+
</a>
64+
</div>
65+
</section>
66+
</main>
67+
68+
<script src="https://www.yoti.com/share/client/"></script>
69+
<script>
70+
window.Yoti.Share.init({
71+
"elements": [{
72+
"domId": "yoti-share-button",
73+
"scenarioId": "{{scenario_id}}",
74+
"button": {
75+
"label": "Use Yoti"
76+
}
77+
}]
78+
});
2379
</script>
80+
2481
</body>
82+
2583
</html>

0 commit comments

Comments
 (0)