Skip to content

Commit 3b871d3

Browse files
committed
Updating the sample app with latest code, fixes to text and links.
1 parent 2e1b3fd commit 3b871d3

File tree

13 files changed

+88
-37
lines changed

13 files changed

+88
-37
lines changed

app/api/clickwrap.py

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ def insurance_renewal():
2424
}
2525

2626
try:
27-
clickwrap_ = Clickwrap.get(clickwrap_args, session)
27+
clickwrap_ = Clickwrap.create(clickwrap_args, session)
2828
except ApiException as exc:
2929
return process_error(exc)
3030
return jsonify(clickwrap=clickwrap_)

app/clickwrap.py

Lines changed: 64 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,73 @@
1-
from app.ds_config import CLICKWRAP_ID
1+
import base64
2+
from os import path
3+
4+
from app.ds_config import (
5+
TPL_PATH,
6+
CLICKWRAP_BASE_HOST,
7+
CLICKWRAP_BASE_URI
8+
)
9+
from app.ds_client import DsClient
10+
211

312
class Clickwrap: # pylint: disable=too-few-public-methods
413
@staticmethod
5-
def get(args, session):
6-
"""Gets a clickwrap and account data
14+
def create(args, session):
15+
"""Creates a clickwrap for an account
16+
Parameters:
17+
args (dict): Parameters for the clickwrap.
718
Returns:
8-
JSON structure of the clickwrap.
19+
JSON structure of the created clickwrap.
920
"""
21+
terms_name = args.get('terms_name')
22+
file_name = 'terms-renewal.docx'
1023
account_id = session.get('account_id')
1124

12-
clickwrap = {
13-
'accountId': account_id,
14-
'clickwrapId': CLICKWRAP_ID
25+
with open(path.join(TPL_PATH, file_name), 'rb') as binary_file:
26+
binary_file_data = binary_file.read()
27+
base64_encoded_data = base64.b64encode(binary_file_data)
28+
base64_terms = base64_encoded_data.decode('utf-8')
29+
30+
# Construct clickwrap JSON body
31+
body = {
32+
'displaySettings': {
33+
'consentButtonText': 'I Agree',
34+
'displayName': args.get('display_name'),
35+
'downloadable': True,
36+
'format': 'modal',
37+
'hasAccept': True,
38+
'mustRead': True,
39+
'requireAccept': True,
40+
'size': 'medium',
41+
'documentDisplay': 'document',
42+
},
43+
'documents': [
44+
{
45+
'documentBase64': base64_terms,
46+
'documentName': terms_name,
47+
'fileExtension': file_name[file_name.rfind('.')+1:],
48+
'order': 0
49+
}
50+
],
51+
'name': terms_name,
52+
'requireReacceptance': True
1553
}
1654

17-
return clickwrap
55+
# Make a POST call to the clickwraps endpoint to create a clickwrap for an account
56+
ds_client = DsClient.get_configured_instance(
57+
session.get('access_token'),
58+
CLICKWRAP_BASE_HOST
59+
)
60+
61+
uri = f"{CLICKWRAP_BASE_URI}/{account_id}/clickwraps"
62+
response = ds_client.call_api(
63+
uri, 'POST', body=body, response_type='object'
64+
)
65+
66+
clickwrap_id = response[0].get('clickwrapId')
67+
68+
# Make a PUT call to the clickwraps endpoint to activate created clickwrap
69+
uri = f"{CLICKWRAP_BASE_URI}/{account_id}/clickwraps/{clickwrap_id}/versions/1"
70+
response_active = ds_client.call_api(
71+
uri, 'PUT', body={'status': 'active'}, response_type='object'
72+
)
73+
return response_active[0]

app/ds_config.py

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,5 +20,3 @@
2020
DS_RETURN_URL = os.environ.get('REACT_APP_DS_RETURN_URL')
2121
DS_AUTH_SERVER = os.environ.get('DS_AUTH_SERVER')
2222
DS_DEMO_SERVER = os.environ.get('REACT_APP_DS_DEMO_SERVER')
23-
24-
CLICKWRAP_ID = os.environ.get('CLICKWRAP_ID')

public/index.html

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,13 @@
11
<!DOCTYPE html>
22
<html lang="en">
33
<head>
4+
<!-- Google Tag Manager -->
5+
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
6+
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
7+
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
8+
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
9+
})(window,document,'script','dataLayer','GTM-WPK6FN5');</script>
10+
<!-- End Google Tag Manager -->
411
<meta charset="utf-8" />
512
<link rel="icon" href="favicon.ico" />
613
<meta name="viewport" content="width=device-width, initial-scale=1" />

public/locales/en/About.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,9 +11,9 @@
1111
"DeveloperCenter": "Developer Center",
1212
"DeveloperCenterLink": "https://developers.docusign.com",
1313
"APICodeExamples": "DocuSign eSignature API Code Examples",
14-
"APICodeExamplesLink": "https://developers.docusign.com/esign-rest-api/code-examples",
14+
"APICodeExamplesLink": "https://developers.docusign.com/docs/esign-rest-api/how-to/",
1515
"ESignatureDocumentation": "DocuSign eSignature API Documentation",
16-
"ESignatureDocumentationLink": " https://developers.docusign.com/esign-rest-api/reference",
16+
"ESignatureDocumentationLink": " https://developers.docusign.com/docs/esign-rest-api/reference/",
1717
"DeveloperCommunity": "Developer Community",
1818
"DeveloperCommunityLink": "http://stackoverflow.com/questions/tagged/docusignapi",
1919
"AboutDocuSign": "<h3>About DocuSign</h3><ul><li>More than <strong>400 million users</strong> in <strong>188 countries</strong></li><li>More than 300,000 companies</li><li>More than 300,000 new unique users join The DocuSign Global Trust Network every day</li><li>More than 64% of documents are completed within one hour</li> <li>DocuSign is available in <strong>43 languages</strong></li></ul>",

public/locales/en/BuyNewInsurance.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -93,7 +93,7 @@
9393
},
9494
"ApiDecription": {
9595
"SeeMore": "- See behind the scenes",
96-
"CodeFlow": "<h3>This sample features:</h3><ul><li>Update recipient information<li>Create envelope from HTML import<li>Fill tab data<li>Embedded signing (recipient view)<li>Request payment</li><li>Formula field</li></ul><p><strong>Note</strong>: This scenario uses <a href=\"https://www.docusign.com/products/payments\">DocuSign Payments</a>. To complete the transaction, you will need to set up a <a href=\"https://support.docusign.com/en/guides/managing-payment-gateways\">payment gateway</a> on your account. </p><h3>Code flow:</h3><h5>Step 1</h5><p>When the form is submitted, we use the <a href=\"https://developers.docusign.com/esign-rest-api/reference/Envelopes/Envelopes/create\">Envelopes: create</a> method to send the signature request with the corresponding form information. The envelope we construct contains a <code>document</code> object, a <code>recipient</code> object of type <code>signer</code>, and <code>tabs,</code> which contain the form fields information. Since we are using embedded signing, we must also set the <code>clientUserId</code> property on the recipient.</p><p>We place the tabs on the document by specifying a <code>SignHereTab</code> element and a <code>PaymentTab</code> element as part of the <code>signer</code> element. The tab elements are positioned using <em>x/y</em> coordinates on the <code>document</code>.</p><p>The <code>PaymentTab</code> serves two purposes. It is used both to display the amount due in the document and to instruct DocuSign to proceed to collect payments after the document is signed.</p><p>Lastly, we include the status \"sent\" in the request so that the envelope is sent for signing. The eSignature REST API request is sent to the following endpoint:</p><pre>POST /v2.1/accounts/{accountId}/envelopes</pre><h5>Step 2</h5><p>To enable embedded signing of the envelope inside our application, we next use the <a href=\"https://developers.docusign.com/esign-rest-api/reference/Envelopes/EnvelopeViews/createRecipient\">EnvelopeViews: createRecipient</a> method to generate a signing URL for the recipient. For this to work, the <code>clientUserId</code> property must be set on the recipient when the envelope is sent during step 1 above.</p><p>Once the envelope is sent, we save the envelope ID and recipient information to our session. Then, we retrieve the envelope ID and recipient info from our session and create the recipient view by generating the URL and displaying the recipient view in a full-width and full-height iframe inside our page.</p><p>To create the recipient view of the envelope, we send an API request to:</p><pre>POST /v2.1/accounts/{accountId}/envelopes/{envelopeId}/views/recipient</pre>"
96+
"CodeFlow": "<h3>This sample features:</h3><ul><li>Update recipient information<li>Create envelope from HTML import<li>Fill tab data<li>Embedded signing (recipient view)<li>Request payment</li><li>Formula field</li></ul><p><strong>Note</strong>: This scenario uses <a target=\"_blank\" href=\"https://www.docusign.com/products/payments\">DocuSign Payments</a>. To complete the transaction, you will need to set up a <a target=\"_blank\" href=\"https://support.docusign.com/en/guides/managing-payment-gateways\">payment gateway</a> on your account. </p><h3>Code flow:</h3><h5>Step 1</h5><p>When the form is submitted, we use the <a target=\"_blank\" href=\"https://developers.docusign.com/docs/esign-rest-api/reference/Envelopes/Envelopes/create\">Envelopes: create</a> method to send the signature request with the corresponding form information. The envelope we construct contains a <code>document</code> object, a <code>recipient</code> object of type <code>signer</code>, and <code>tabs,</code> which contain the form fields information. Since we are using embedded signing, we must also set the <code>clientUserId</code> property on the recipient.</p><p>We place the tabs on the document by specifying a <code>SignHereTab</code> element and a <code>PaymentTab</code> element as part of the <code>signer</code> element. The tab elements are positioned using <em>x/y</em> coordinates on the <code>document</code>.</p><p>The <code>PaymentTab</code> serves two purposes. It is used both to display the amount due in the document and to instruct DocuSign to proceed to collect payments after the document is signed.</p><p>Lastly, we include the status \"sent\" in the request so that the envelope is sent for signing. The eSignature REST API request is sent to the following endpoint:</p><pre>POST /v2.1/accounts/{accountId}/envelopes</pre><h5>Step 2</h5><p>To enable embedded signing of the envelope inside our application, we next use the <a target=\"_blank\" href=\"https://developers.docusign.com/docs/esign-rest-api/reference/Envelopes/EnvelopeViews/createRecipient\">EnvelopeViews: createRecipient</a> method to generate a signing URL for the recipient. For this to work, the <code>clientUserId</code> property must be set on the recipient when the envelope is sent during step 1 above.</p><p>Once the envelope is sent, we save the envelope ID and recipient information to our session. Then, we retrieve the envelope ID and recipient info from our session and create the recipient view by generating the URL and displaying the recipient view in a full-width and full-height iframe inside our page.</p><p>To create the recipient view of the envelope, we send an API request to:</p><pre>POST /v2.1/accounts/{accountId}/envelopes/{envelopeId}/views/recipient</pre>"
9797
},
9898
"SubmitInfo": "By submitting the form, you confirm payment for this activity. The system will transfer you to the payment form after signing."
9999
}

public/locales/en/Modal.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
{
2-
"HelpMeToDecide": "<a href='https://developers.docusign.com/esign-rest-api/guides/authentication' target='_blank' rel='noopener noreferrer'>Learn more about authentication options with DocuSign</a>",
2+
"HelpMeToDecide": "<a href='https://developers.docusign.com/platform/auth/' target='_blank' rel='noopener noreferrer'>Learn more about authentication options with DocuSign</a>",
33
"Warning": "If you don't have a DocuSign developer account (demo) You can <a href='https://go.docusign.com/o/sandbox/' target='_blank' rel='noopener noreferrer'>get one for free!</a>",
44
"ValidateMessage": "Please choose one of the two authentications options",
55
"ModalTitle": "Log in with DocuSign",

public/locales/en/SubmitClaim.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -101,6 +101,6 @@
101101
},
102102
"ApiDecription": {
103103
"SeeMore": "- See behind the scenes",
104-
"CodeFlow": "<h3>This sample features:</h3><ul><li>Update recipient information</li><li>Create envelope from HTML Import</li><li>Fill tab data</li><li>Embedded signing (recipient view)</li<li>Optional tab</li><li>Attachment tab></ul><h3>Code flow:</h3><h5>Step 1</h5><p>When the form is submitted, we use the <a href='https://developers.docusign.com/esign-rest-api/reference/Envelopes/Envelopes/create'>Envelopes: create</a> method to send the signature request with the corresponding form information. The envelope we construct contains various data: specifically, a <code>document</code> object, a <code>recipient</code> object with the type <code>signer</code>, and <code>tabs</code> objects, which contain form field information. Since we are using embedded signing, we must also set the <code>clientUserId</code> property on the recipient.</p><p>We place the tabs on the document by specifying a <code>SignHereTab</code> element and an <code>InitialTab</code> element as part of the <code>signer</code> element. The tab elements are positioned using <em>x/y</em> coordinates on the <code>document</code>.</p><p>Last, we include the status \"sent\" in the request so that the envelope is sent for signing.</p><p>The eSignature REST API request is sent to the following endpoint:</p><pre>POST /v2.1/accounts/{accountId}/envelopes</pre><h5>Step 2</h5><p>To enable embedded signing of the envelope inside our application, we next use the <a href='https://developers.docusign.com/esign-rest-api/reference/Envelopes/EnvelopeViews/createRecipient'>EnvelopeViews: createRecipient</a> method to generate a signing URL for the recipient. For this to work, the <code>clientUserId</code> property must be set on the recipient when the envelope is sent during step 1 above.</p><p>Once the envelope is sent, we save the envelope ID and recipient information to our session. Then, we retrieve the envelope ID and recipient info from our session and create the recipient view by generating the URL and displaying the recipient view in a full-width and full-height iframe inside our page.</p><p>To create the recipient view of the envelope, we send an API request to:</p><pre>POST /v2.1/accounts/{accountId}/envelopes/{envelopeId}/views/recipient</pre>"
104+
"CodeFlow": "<h3>This sample features:</h3><ul><li>Update recipient information</li><li>Create envelope from HTML Import</li><li>Fill tab data</li><li>Embedded signing (recipient view)</li<li>Optional tab</li><li>Attachment tab></ul><h3>Code flow:</h3><h5>Step 1</h5><p>When the form is submitted, we use the <a target=\"_blank\" href='https://developers.docusign.com/docs/esign-rest-api/reference/Envelopes/Envelopes/create'>Envelopes: create</a> method to send the signature request with the corresponding form information. The envelope we construct contains various data: specifically, a <code>document</code> object, a <code>recipient</code> object with the type <code>signer</code>, and <code>tabs</code> objects, which contain form field information. Since we are using embedded signing, we must also set the <code>clientUserId</code> property on the recipient.</p><p>We place the tabs on the document by specifying a <code>SignHereTab</code> element and an <code>InitialTab</code> element as part of the <code>signer</code> element. The tab elements are positioned using <em>x/y</em> coordinates on the <code>document</code>.</p><p>Last, we include the status \"sent\" in the request so that the envelope is sent for signing.</p><p>The eSignature REST API request is sent to the following endpoint:</p><pre>POST /v2.1/accounts/{accountId}/envelopes</pre><h5>Step 2</h5><p>To enable embedded signing of the envelope inside our application, we next use the <a target=\"_blank\" href='https://developers.docusign.com/docs/esign-rest-api/reference/Envelopes/EnvelopeViews/createRecipient'>EnvelopeViews: createRecipient</a> method to generate a signing URL for the recipient. For this to work, the <code>clientUserId</code> property must be set on the recipient when the envelope is sent during step 1 above.</p><p>Once the envelope is sent, we save the envelope ID and recipient information to our session. Then, we retrieve the envelope ID and recipient info from our session and create the recipient view by generating the URL and displaying the recipient view in a full-width and full-height iframe inside our page.</p><p>To create the recipient view of the envelope, we send an API request to:</p><pre>POST /v2.1/accounts/{accountId}/envelopes/{envelopeId}/views/recipient</pre>"
105105
}
106106
}

src/components/SigningComplete.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -119,7 +119,7 @@ export const SigningComplete = () => {
119119

120120
<p>
121121
<a
122-
href="https://developers.docusign.com/esign-rest-api/guides/concepts/embedding"
122+
href="https://developers.docusign.com/docs/esign-rest-api/esign101/concepts/embedding/"
123123
target="_blank"
124124
rel="noopener noreferrer"
125125
>

src/pages/about/index.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@ export const About = () => {
4242
<p><strong>{t("APICodeExamples")}</strong><br></br>
4343
<a
4444
target="_blank"
45-
href="https://developers.docusign.com/esign-rest-api/code-examples"
45+
href="https://developers.docusign.com/docs/esign-rest-api/how-to/"
4646
rel="noopener noreferrer"
4747
>
4848
{t("APICodeExamplesLink")}
@@ -51,7 +51,7 @@ export const About = () => {
5151
<p><strong>{t("ESignatureDocumentation")}</strong><br></br>
5252
<a
5353
target="_blank"
54-
href="https://developers.docusign.com/esign-rest-api/reference"
54+
href="https://developers.docusign.com/docs/esign-rest-api/reference/"
5555
rel="noopener noreferrer"
5656
>
5757
{t("ESignatureDocumentationLink")}

0 commit comments

Comments
 (0)