prepare email template

EnvelopeGenerator.Common/Entities/EmailTemplate.vb

@@ -23,65 +23,67 @@ Public Class EmailTemplate
     End Sub
 
     Private Sub InitSubjectTemplates()
-        _DocumentReceivedSubjectTemplate = "Dokument erhalten: '<DOCUMENT_TITLE>'"
+        _DocumentReceivedSubjectTemplate = "Dokument erhalten: '[DOCUMENT_TITLE]'"
-        _DocumentSignedSubjectTemplate = "Dokument unterschrieben: '<DOCUMENT_TITLE>'"
+        _DocumentSignedSubjectTemplate = "Dokument unterschrieben: '[DOCUMENT_TITLE]'"
-        _DocumentDeletedSubjectTemplate = "Vorgang zurückgezogen: '<DOCUMENT_TITLE>'"
+        _DocumentDeletedSubjectTemplate = "Vorgang zurückgezogen: '[DOCUMENT_TITLE]'"
-        _DocumentCompletedSubjectTemplate = "Vorgang abgeschlossen: '<DOCUMENT_TITLE>'"
+        _DocumentCompletedSubjectTemplate = "Vorgang abgeschlossen: '[DOCUMENT_TITLE]'"
     End Sub
 
     Private Sub InitBodyTemplates()
         _DocumentReceivedBodyTemplate = New List(Of String) From {
-            "Guten Tag <NAME_RECEIVER>,",
+            "Guten Tag [NAME_RECEIVER],",
             "",
-            "<NAME_SENDER> hat Ihnen ein Dokument zum <SIGNATURE_TYPE> gesendet.",
+            "[NAME_SENDER] hat Ihnen ein Dokument zum [SIGNATURE_TYPE] gesendet.",
             "",
-            "Über den folgenden Link können Sie das Dokument einsehen: <a href=""<LINK_TO_DOCUMENT>""><LINK_TO_DOCUMENT_TEXT></a>",
+            "Über den folgenden Link können Sie das Dokument einsehen: <a href=""[LINK_TO_DOCUMENT]"">[LINK_TO_DOCUMENT_TEXT]</a>",
             "",
-            "<MESSAGE>",
+            "[MESSAGE]",
             "",
             "Mit freundlichen Grüßen",
-            "<NAME_PORTAL>"
+            "[NAME_PORTAL]"
         }
 
+        '_DocumentReceivedBodyTemplate = Common.My.Resources.email_de.Split(vbNewLine).ToList()
+
         _DocumentSignedBodyTemplate = New List(Of String) From {
-            "Guten Tag <NAME_RECEIVER>",
+            "Guten Tag [NAME_RECEIVER]",
             "",
-            "hiermit bestätigen wir Ihnen die erfolgreiche Signatur für den Vorgang <DOCUMENT_TITLE>.",
+            "hiermit bestätigen wir Ihnen die erfolgreiche Signatur für den Vorgang [DOCUMENT_TITLE].",
             "",
             "Mit freundlichen Grüßen",
-            "<NAME_PORTAL>"
+            "[NAME_PORTAL]"
         }
 
         _DocumentDeletedBodyTemplate = New List(Of String) From {
-            "Guten Tag <NAME_RECEIVER>",
+            "Guten Tag [NAME_RECEIVER]",
             "",
-            "Der User <NAME_SENDER> hat den Umschlag <DOCUMENT_TITLE> gelöscht.",
+            "Der User [NAME_SENDER] hat den Umschlag [DOCUMENT_TITLE] gelöscht.",
             "",
             "Mit freundlichen Grüßen",
-            "<NAME_PORTAL>"
+            "[NAME_PORTAL]"
         }
 
         _DocumentCompletedBodyTemplate = New List(Of String) From {
-            "Guten Tag <NAME_RECEIVER>",
+            "Guten Tag [NAME_RECEIVER]",
             "",
-            "Der Signaturvorgang <DOCUMENT_TITLE> wurde erfolgreich abgeschlossen.",
+            "Der Signaturvorgang [DOCUMENT_TITLE] wurde erfolgreich abgeschlossen.",
             "Sie erhalten das Dokument mit einem detaillierten Ergebnisbericht als Anhang zu dieser Email.",
             "",
             "Vielen Dank für die Nutzung von",
-            "<NAME_PORTAL>"
+            "[NAME_PORTAL]"
         }
     End Sub
 
     Private Sub InitDictionary(pEmailData As EmailData)
         _replaceDictionary = New Dictionary(Of String, String) From {
-            {"<NAME_RECEIVER>", pEmailData.ReceiverName},
+            {"[NAME_RECEIVER]", pEmailData.ReceiverName},
-            {"<NAME_SENDER>", pEmailData.SenderName},
+            {"[NAME_SENDER]", pEmailData.SenderName},
-            {"<NAME_PORTAL>", DbConfig.ExternalProgramName},
+            {"[NAME_PORTAL]", DbConfig.ExternalProgramName},
-            {"<SIGNATURE_TYPE>", "signieren"},
+            {"[SIGNATURE_TYPE]", "signieren"},
-            {"<LINK_TO_DOCUMENT>", pEmailData.SignatureLink},
+            {"[LINK_TO_DOCUMENT]", pEmailData.SignatureLink},
-            {"<LINK_TO_DOCUMENT_TEXT>", $"{pEmailData.SignatureLink.Truncate(40)}.."},
+            {"[LINK_TO_DOCUMENT_TEXT]", $"{pEmailData.SignatureLink.Truncate(40)}.."},
-            {"<DOCUMENT_TITLE>", pEmailData.EnvelopeTitle},
+            {"[DOCUMENT_TITLE]", pEmailData.EnvelopeTitle},
-            {"<MESSAGE>", pEmailData.Message}
+            {"[MESSAGE]", pEmailData.Message}
         }
     End Sub
 

EnvelopeGenerator.Common/EnvelopeGenerator.Common.vbproj

@@ -270,6 +270,7 @@
     <Content Include="Images\circle.svg">
       <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
     </Content>
+    <EmbeddedResource Include="Templates\email_de.html" />
   </ItemGroup>
   <ItemGroup />
   <Import Project="$(MSBuildToolsPath)\Microsoft.VisualBasic.targets" />

EnvelopeGenerator.Common/Helpers.vb

@@ -1,6 +1,5 @@
 Imports System.Drawing
 Imports System.IO
-Imports System.Threading
 Imports DevExpress.Utils.Svg
 Imports EnvelopeGenerator.Common.Constants
 

EnvelopeGenerator.Common/My Project/Resources.Designer.vb

@@ -59,5 +59,21 @@ Namespace My.Resources
                 resourceCulture = value
             End Set
         End Property
+        
+        '''<summary>
+        '''  Sucht eine lokalisierte Zeichenfolge, die &lt;html dir=&quot;ltr&quot; xmlns=&quot;http://www.w3.org/1999/xhtml&quot; xmlns:o=&quot;urn:schemas-microsoft-com:office:office&quot; lang=&quot;und&quot; style=&quot;padding:0;Margin:0&quot;&gt;
+        '''&lt;head&gt;
+        '''    &lt;meta http-equiv=&quot;Content-Security-Policy&quot; content=&quot;script-src &apos;none&apos;; connect-src &apos;none&apos;; object-src &apos;none&apos;; form-action &apos;none&apos;;&quot;&gt;
+        '''    &lt;meta charset=&quot;UTF-8&quot;&gt;
+        '''    &lt;meta content=&quot;width=device-width, initial-scale=1&quot; name=&quot;viewport&quot;&gt;
+        '''    &lt;meta name=&quot;x-apple-disable-message-reformatting&quot;&gt;
+        '''    &lt;meta http-equiv=&quot;X-UA-Compatible&quot; content=&quot;IE=edge&quot;&gt;
+        '''    &lt;meta cont [Rest der Zeichenfolge wurde abgeschnitten]&quot;; ähnelt.
+        '''</summary>
+        Friend ReadOnly Property email_de() As String
+            Get
+                Return ResourceManager.GetString("email_de", resourceCulture)
+            End Get
+        End Property
     End Module
 End Namespace

EnvelopeGenerator.Common/My Project/Resources.resx

@@ -46,7 +46,7 @@
     
     mimetype: application/x-microsoft.net.object.binary.base64
     value   : The object must be serialized with 
-            : System.Serialization.Formatters.Binary.BinaryFormatter
+            : System.Runtime.Serialization.Formatters.Binary.BinaryFormatter
             : and then encoded with base64 encoding.
     
     mimetype: application/x-microsoft.net.object.soap.base64
@@ -60,6 +60,7 @@
             : and then encoded with base64 encoding.
     -->
   <xsd:schema id="root" xmlns="" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:msdata="urn:schemas-microsoft-com:xml-msdata">
+    <xsd:import namespace="http://www.w3.org/XML/1998/namespace" />
     <xsd:element name="root" msdata:IsDataSet="true">
       <xsd:complexType>
         <xsd:choice maxOccurs="unbounded">
@@ -68,9 +69,10 @@
               <xsd:sequence>
                 <xsd:element name="value" type="xsd:string" minOccurs="0" />
               </xsd:sequence>
-              <xsd:attribute name="name" type="xsd:string" />
+              <xsd:attribute name="name" use="required" type="xsd:string" />
               <xsd:attribute name="type" type="xsd:string" />
               <xsd:attribute name="mimetype" type="xsd:string" />
+              <xsd:attribute ref="xml:space" />
             </xsd:complexType>
           </xsd:element>
           <xsd:element name="assembly">
@@ -85,9 +87,10 @@
                 <xsd:element name="value" type="xsd:string" minOccurs="0" msdata:Ordinal="1" />
                 <xsd:element name="comment" type="xsd:string" minOccurs="0" msdata:Ordinal="2" />
               </xsd:sequence>
-              <xsd:attribute name="name" type="xsd:string" msdata:Ordinal="1" />
+              <xsd:attribute name="name" type="xsd:string" use="required" msdata:Ordinal="1" />
               <xsd:attribute name="type" type="xsd:string" msdata:Ordinal="3" />
               <xsd:attribute name="mimetype" type="xsd:string" msdata:Ordinal="4" />
+              <xsd:attribute ref="xml:space" />
             </xsd:complexType>
           </xsd:element>
           <xsd:element name="resheader">
@@ -109,9 +112,13 @@
     <value>2.0</value>
   </resheader>
   <resheader name="reader">
-    <value>System.Resources.ResXResourceReader, System.Windows.Forms, Version=2.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089</value>
+    <value>System.Resources.ResXResourceReader, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089</value>
   </resheader>
   <resheader name="writer">
-    <value>System.Resources.ResXResourceWriter, System.Windows.Forms, Version=2.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089</value>
+    <value>System.Resources.ResXResourceWriter, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089</value>
   </resheader>
+  <assembly alias="System.Windows.Forms" name="System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089" />
+  <data name="email_de" type="System.Resources.ResXFileRef, System.Windows.Forms">
+    <value>..\Templates\email_de.html;System.String, mscorlib, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089;utf-8</value>
+  </data>
 </root>

EnvelopeGenerator.Common/Templates/email_de.html

@@ -0,0 +1,450 @@
+<html dir="ltr" xmlns="http://www.w3.org/1999/xhtml" xmlns:o="urn:schemas-microsoft-com:office:office" lang="und" style="padding:0;Margin:0">
+<head>
+    <meta http-equiv="Content-Security-Policy" content="script-src 'none'; connect-src 'none'; object-src 'none'; form-action 'none';">
+    <meta charset="UTF-8">
+    <meta content="width=device-width, initial-scale=1" name="viewport">
+    <meta name="x-apple-disable-message-reformatting">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta content="telephone=no" name="format-detection">
+    <title>Trigger newsletter 3 </title>
+    <!--[if (mso 16)]>
+    <style type="text/css">
+    a {text-decoration: none;}
+    </style>
+    <![endif]-->
+    <!--[if gte mso 9]><style>sup { font-size: 100% !important; }</style><![endif]-->
+    <!--[if gte mso 9]>
+    <xml>
+        <o:OfficeDocumentSettings>
+        <o:AllowPNG></o:AllowPNG>
+        <o:PixelsPerInch>96</o:PixelsPerInch>
+        </o:OfficeDocumentSettings>
+    </xml>
+    <![endif]-->
+    <!--[if !mso]><!-- -->
+    <link href="https://fonts.googleapis.com/css?family=Lato:400,400i,700,700i" rel="stylesheet"><!--<![endif]-->
+    <style type="text/css">
+        #outlook a {
+            padding: 0;
+        }
+
+        .ExternalClass {
+            width: 100%;
+        }
+
+            .ExternalClass,
+            .ExternalClass p,
+            .ExternalClass span,
+            .ExternalClass font,
+            .ExternalClass td,
+            .ExternalClass div {
+                line-height: 100%;
+            }
+
+        .es-button {
+            mso-style-priority: 100 !important;
+            text-decoration: none !important;
+        }
+
+        a[x-apple-data-detectors] {
+            color: inherit !important;
+            text-decoration: none !important;
+            font-size: inherit !important;
+            font-family: inherit !important;
+            font-weight: inherit !important;
+            line-height: inherit !important;
+        }
+
+        .es-desk-hidden {
+            display: none;
+            float: left;
+            overflow: hidden;
+            width: 0;
+            max-height: 0;
+            line-height: 0;
+            mso-hide: all;
+        }
+
+        @media only screen and (max-width:600px) {
+            p, ul li, ol li, a {
+                line-height: 150% !important
+            }
+
+            h1, h2, h3, h1 a, h2 a, h3 a {
+                line-height: 120% !important
+            }
+
+            h1 {
+                font-size: 30px !important;
+                text-align: center
+            }
+
+            h2 {
+                font-size: 26px !important;
+                text-align: left
+            }
+
+            h3 {
+                font-size: 20px !important;
+                text-align: left
+            }
+
+            h1 a {
+                text-align: center
+            }
+
+            .es-header-body h1 a, .es-content-body h1 a, .es-footer-body h1 a {
+                font-size: 30px !important
+            }
+
+            h2 a {
+                text-align: left
+            }
+
+            .es-header-body h2 a, .es-content-body h2 a, .es-footer-body h2 a {
+                font-size: 20px !important
+            }
+
+            h3 a {
+                text-align: left
+            }
+
+            .es-header-body h3 a, .es-content-body h3 a, .es-footer-body h3 a {
+                font-size: 20px !important
+            }
+
+            .es-menu td a {
+                font-size: 16px !important
+            }
+
+            .es-header-body p, .es-header-body ul li, .es-header-body ol li, .es-header-body a {
+                font-size: 16px !important
+            }
+
+            .es-content-body p, .es-content-body ul li, .es-content-body ol li, .es-content-body a {
+                font-size: 17px !important
+            }
+
+            .es-footer-body p, .es-footer-body ul li, .es-footer-body ol li, .es-footer-body a {
+                font-size: 17px !important
+            }
+
+            .es-infoblock p, .es-infoblock ul li, .es-infoblock ol li, .es-infoblock a {
+                font-size: 12px !important
+            }
+
+            *[class="gmail-fix"] {
+                display: none !important
+            }
+
+            .es-m-txt-c, .es-m-txt-c h1, .es-m-txt-c h2, .es-m-txt-c h3 {
+                text-align: center !important
+            }
+
+            .es-m-txt-r, .es-m-txt-r h1, .es-m-txt-r h2, .es-m-txt-r h3 {
+                text-align: right !important
+            }
+
+            .es-m-txt-l, .es-m-txt-l h1, .es-m-txt-l h2, .es-m-txt-l h3 {
+                text-align: left !important
+            }
+
+                .es-m-txt-r img, .es-m-txt-c img, .es-m-txt-l img {
+                    display: inline !important
+                }
+
+            .es-button-border {
+                display: inline-block !important
+            }
+
+            a.es-button, button.es-button {
+                font-size: 14px !important;
+                display: inline-block !important;
+                padding: 15px 25px 15px 25px !important
+            }
+
+            .es-btn-fw {
+                border-width: 10px 0px !important;
+                text-align: center !important
+            }
+
+            .es-adaptive table, .es-btn-fw, .es-btn-fw-brdr, .es-left, .es-right {
+                width: 100% !important
+            }
+
+            .es-content table, .es-header table, .es-footer table, .es-content, .es-footer, .es-header {
+                width: 100% !important;
+                max-width: 600px !important
+            }
+
+            .es-adapt-td {
+                display: block !important;
+                width: 100% !important
+            }
+
+            .adapt-img {
+                width: 100% !important;
+                height: auto !important
+            }
+
+            .es-m-p0 {
+                padding: 0px !important
+            }
+
+            .es-m-p0r {
+                padding-right: 0px !important
+            }
+
+            .es-m-p0l {
+                padding-left: 0px !important
+            }
+
+            .es-m-p0t {
+                padding-top: 0px !important
+            }
+
+            .es-m-p0b {
+                padding-bottom: 0 !important
+            }
+
+            .es-m-p20b {
+                padding-bottom: 20px !important
+            }
+
+            .es-mobile-hidden, .es-hidden {
+                display: none !important
+            }
+
+            tr.es-desk-hidden, td.es-desk-hidden, table.es-desk-hidden {
+                width: auto !important;
+                overflow: visible !important;
+                float: none !important;
+                max-height: inherit !important;
+                line-height: inherit !important
+            }
+
+            tr.es-desk-hidden {
+                display: table-row !important
+            }
+
+            table.es-desk-hidden {
+                display: table !important
+            }
+
+            td.es-desk-menu-hidden {
+                display: table-cell !important
+            }
+
+            .es-menu td {
+                width: 1% !important
+            }
+
+            table.es-table-not-adapt, .esd-block-html table {
+                width: auto !important
+            }
+
+            table.es-social {
+                display: inline-block !important
+            }
+
+                table.es-social td {
+                    display: inline-block !important
+                }
+
+            .es-desk-hidden {
+                display: table-row !important;
+                width: auto !important;
+                overflow: visible !important;
+                max-height: inherit !important
+            }
+        }
+
+        @media screen and (max-width:384px) {
+            .mail-message-content {
+                width: 414px !important
+            }
+        }
+    </style>
+    <body style="width:100%;font-family:helvetica, 'helvetica neue', arial, verdana, sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;padding:0;Margin:0">
+        <div dir="ltr" class="es-wrapper-color" lang="und" style="background-color:#F1F1F1">
+            <!--[if gte mso 9]>
+                <v:background xmlns:v="urn:schemas-microsoft-com:vml" fill="t">
+                    <v:fill type="tile" color="#f1f1f1"></v:fill>
+                </v:background>
+            <![endif]-->
+            <table class="es-wrapper" width="100%" cellspacing="0" cellpadding="0" role="none" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;padding:0;Margin:0;width:100%;height:100%;background-repeat:repeat;background-position:center top;background-color:#F1F1F1">
+                <tbody>
+                    <tr style="border-collapse:collapse">
+                        <td valign="top" style="padding:0;Margin:0">
+                            <table class="es-header" cellspacing="0" cellpadding="0" align="center" role="none" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;table-layout:fixed !important;width:100%;background-color:transparent;background-repeat:repeat;background-position:center top">
+                                <tbody>
+                                    <tr style="border-collapse:collapse">
+                                        <td align="center" style="padding:0;Margin:0">
+                                            <table class="es-header-body" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;background-color:transparent;width:600px" cellspacing="0" cellpadding="0" align="center" role="none">
+                                                <tbody>
+                                                    <tr style="border-collapse:collapse">
+                                                        <td align="left" style="Margin:0;padding-top:30px;padding-bottom:30px;padding-left:40px;padding-right:40px">
+                                                            <!--[if mso]><table style="width:520px" cellpadding="0"
+                                                            cellspacing="0"><tr><td style="width:250px" valign="top"><![endif]-->
+                                                            <table class="es-left" cellspacing="0" cellpadding="0" align="left" role="none" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;float:left">
+                                                                <tbody>
+                                                                    <tr style="border-collapse:collapse">
+                                                                        <td class="es-m-p20b" align="left" style="padding:0;Margin:0;width:250px">
+                                                                            <table width="100%" cellspacing="0" cellpadding="0" role="presentation" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px">
+                                                                                <tbody>
+                                                                                    <tr style="border-collapse:collapse">
+                                                                                        <td align="left" style="padding:0;Margin:0;font-size:0"><a href="https://viewstripo.email" target="_blank" style="-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;text-decoration:underline;color:#FFFFFF;font-size:14px"><img src="https://tlr.stripocdn.email/content/guids/CABINET_85e4431b39e3c4492fca561009cef9b5/images/92961521447916451.png" alt="" style="display:block;border:0;outline:none;text-decoration:none;-ms-interpolation-mode:bicubic" width="57"></a></td>
+                                                                                    </tr>
+                                                                                </tbody>
+                                                                            </table>
+                                                                        </td>
+                                                                    </tr>
+                                                                </tbody>
+                                                            </table><!--[if mso]></td><td style="width:20px"></td><td style="width:250px" valign="top"><![endif]-->
+                                                            <table class="es-right" cellspacing="0" cellpadding="0" align="right" role="none" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;float:right">
+                                                                <tbody>
+                                                                    <tr style="border-collapse:collapse">
+                                                                        <td align="left" style="padding:0;Margin:0;width:250px">
+                                                                            <table width="100%" cellspacing="0" cellpadding="0" role="presentation" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px">
+                                                                                <tbody>
+                                                                                    <tr style="border-collapse:collapse">
+                                                                                        <td class="es-infoblock es-m-txt-c" align="right" style="padding:0;Margin:0;line-height:14px;font-size:12px;color:#CCCCCC"><p style="Margin:0;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-family:arial, 'helvetica\ neue', helvetica, sans-serif;line-height:14px;color:#CCCCCC;font-size:12px">Put your preheader text here</p></td>
+                                                                                    </tr>
+                                                                                </tbody>
+                                                                            </table>
+                                                                        </td>
+                                                                    </tr>
+                                                                </tbody>
+                                                            </table><!--[if mso]></td></tr></table><![endif]-->
+                                                        </td>
+                                                    </tr>
+                                                </tbody>
+                                            </table>
+                                        </td>
+                                    </tr>
+                                </tbody>
+                            </table>
+                            <table class="es-content" cellspacing="0" cellpadding="0" align="center" role="none" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;table-layout:fixed !important;width:100%">
+                                <tbody>
+                                    <tr style="border-collapse:collapse">
+                                        <td align="center" style="padding:0;Margin:0">
+                                            <table class="es-content-body" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;background-color:#FFFFFF;border-top:1px solid #dddddd;border-right:1px solid #dddddd;border-left:1px solid #dddddd;width:600px;border-bottom:1px solid #dddddd" cellspacing="0" cellpadding="0" bgcolor="#ffffff" align="center" role="none">
+                                                <tbody>
+                                                    <tr style="border-collapse:collapse">
+                                                        <td align="left" style="padding:0;Margin:0;padding-top:40px;padding-left:40px;padding-right:40px">
+                                                            <table width="100%" cellspacing="0" cellpadding="0" role="none" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px">
+                                                                <tbody>
+                                                                    <tr style="border-collapse:collapse">
+                                                                        <td valign="top" align="center" style="padding:0;Margin:0;width:518px">
+                                                                            <table width="100%" cellspacing="0" cellpadding="0" role="presentation" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px">
+                                                                                <tbody>
+                                                                                    <tr style="border-collapse:collapse">
+                                                                                        <td align="left" style="padding:0;Margin:0;padding-top:5px;padding-bottom:15px"><h2 style="Margin:0;line-height:24px;mso-line-height-rule:exactly;font-family:lato, 'helvetica neue', helvetica, arial, sans-serif;font-size:20px;font-style:normal;font-weight:bold;color:#333333">[MAIL_SUBJECT]</h2></td>
+                                                                                    </tr>
+                                                                                    <tr style="border-collapse:collapse">
+                                                                                        <td align="left" style="padding:0;Margin:0;padding-bottom:10px"><p style="Margin:0;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-family:helvetica, 'helvetica neue', arial, verdana, sans-serif;line-height:23px;color:#555555;font-size:15px"><strong></strong><strong>Guten Tag [NAME_RECEIVER],</strong><strong></strong></p></td>
+                                                                                    </tr>
+                                                                                    <tr style="border-collapse:collapse">
+                                                                                        <td align="left" style="padding:0;Margin:0;padding-top:10px;padding-bottom:10px"><p style="Margin:0;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-family:helvetica, 'helvetica neue', arial, verdana, sans-serif;line-height:23px;color:#555555;font-size:15px">[NAME_SENDER] hat Ihnen ein Dokument zum [SIGNATURE_TYPE] gesendet. Über den folgenden Link können Sie das Dokument einsehen:</p><p style="Margin:0;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-family:helvetica, 'helvetica neue', arial, verdana, sans-serif;line-height:23px;color:#555555;font-size:15px">[LINK_TO_DOCUMENT]<br></p><p style="Margin:0;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-family:helvetica, 'helvetica neue', arial, verdana, sans-serif;line-height:23px;color:#555555;font-size:15px">MESSAGE<br></p></td>
+                                                                                    </tr>
+                                                                                    <tr style="border-collapse:collapse">
+                                                                                        <td align="left" style="padding:0;Margin:0;padding-top:10px;padding-bottom:10px"><p style="Margin:0;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-family:helvetica, 'helvetica neue', arial, verdana, sans-serif;line-height:23px;color:#555555;font-size:15px">Mit freundlichen Grüßen,</p></td>
+                                                                                    </tr>
+                                                                                </tbody>
+                                                                            </table>
+                                                                        </td>
+                                                                    </tr>
+                                                                </tbody>
+                                                            </table>
+                                                        </td>
+                                                    </tr>
+                                                    <tr style="border-collapse:collapse">
+                                                        <td align="left" style="Margin:0;padding-top:10px;padding-bottom:40px;padding-left:40px;padding-right:40px">
+                                                            <!--[if mso]><table style="width:518px" cellpadding="0"
+                                                            cellspacing="0"><tr><td style="width:39px" valign="top"><![endif]-->
+                                                            <table class="es-left" cellspacing="0" cellpadding="0" align="left" role="none" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;float:left">
+                                                                <tbody>
+                                                                    <tr style="border-collapse:collapse">
+                                                                        <td class="es-m-p0r es-m-p20b" valign="top" align="center" style="padding:0;Margin:0;width:39px">
+                                                                            <table width="100%" cellspacing="0" cellpadding="0" role="presentation" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px">
+                                                                                <tbody>
+                                                                                    <tr style="border-collapse:collapse">
+                                                                                        <td align="left" style="padding:0;Margin:0;font-size:0"><img src="https://tlr.stripocdn.email/content/guids/CABINET_85e4431b39e3c4492fca561009cef9b5/images/29241521207598269.jpg" alt="" style="display:block;border:0;outline:none;text-decoration:none;-ms-interpolation-mode:bicubic" width="39"></td>
+                                                                                    </tr>
+                                                                                </tbody>
+                                                                            </table>
+                                                                        </td>
+                                                                    </tr>
+                                                                </tbody>
+                                                            </table><!--[if mso]></td><td style="width:20px"></td><td style="width:459px" valign="top"><![endif]-->
+                                                            <table cellspacing="0" cellpadding="0" align="right" role="none" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px">
+                                                                <tbody>
+                                                                    <tr style="border-collapse:collapse">
+                                                                        <td align="left" style="padding:0;Margin:0;width:459px">
+                                                                            <table width="100%" cellspacing="0" cellpadding="0" role="presentation" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px">
+                                                                                <tbody>
+                                                                                    <tr style="border-collapse:collapse">
+                                                                                        <td align="left" style="padding:0;Margin:0;padding-top:10px"><p style="Margin:0;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-family:helvetica, 'helvetica neue', arial, verdana, sans-serif;line-height:21px;color:#222222;font-size:14px"><strong>[NAME_PORTAL]</strong><br></p></td>
+                                                                                    </tr>
+                                                                                </tbody>
+                                                                            </table>
+                                                                        </td>
+                                                                    </tr>
+                                                                </tbody>
+                                                            </table><!--[if mso]></td></tr></table><![endif]-->
+                                                        </td>
+                                                    </tr>
+                                                </tbody>
+                                            </table>
+                                        </td>
+                                    </tr>
+                                </tbody>
+                            </table>
+                            <table class="es-footer" cellspacing="0" cellpadding="0" align="center" role="none" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;table-layout:fixed !important;width:100%;background-color:transparent;background-repeat:repeat;background-position:center top">
+                                <tbody>
+                                    <tr style="border-collapse:collapse">
+                                        <td align="center" style="padding:0;Margin:0">
+                                            <table class="es-footer-body" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;background-color:transparent;width:600px" cellspacing="0" cellpadding="0" align="center" role="none">
+                                                <tbody>
+                                                    <tr style="border-collapse:collapse">
+                                                        <td align="left" style="Margin:0;padding-top:40px;padding-bottom:40px;padding-left:40px;padding-right:40px">
+                                                            <table width="100%" cellspacing="0" cellpadding="0" role="none" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px">
+                                                                <tbody>
+                                                                    <tr style="border-collapse:collapse">
+                                                                        <td valign="top" align="center" style="padding:0;Margin:0;width:520px">
+                                                                            <table width="100%" cellspacing="0" cellpadding="0" role="presentation" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px">
+                                                                                <tbody>
+                                                                                    <tr style="border-collapse:collapse">
+                                                                                        <td align="left" style="padding:0;Margin:0;padding-bottom:10px"><p style="Margin:0;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-family:helvetica, 'helvetica neue', arial, verdana, sans-serif;line-height:18px;color:#666666;font-size:12px">Company Address</p></td>
+                                                                                    </tr>
+                                                                                    <tr style="border-collapse:collapse">
+                                                                                        <td align="left" style="padding:0;Margin:0;padding-bottom:10px"><p style="Margin:0;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-family:helvetica, 'helvetica neue', arial, verdana, sans-serif;line-height:18px;color:#666666;font-size:12px">This email was sent to you from Company Email Address</p></td>
+                                                                                    </tr>
+                                                                                    <tr style="border-collapse:collapse">
+                                                                                        <td align="left" style="padding:0;Margin:0;padding-bottom:10px"><p style="Margin:0;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-family:helvetica, 'helvetica neue', arial, verdana, sans-serif;line-height:18px;color:#666666;font-size:12px"><a target="_blank" href="https://viewstripo.email/" style="-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;text-decoration:underline;color:#666666;font-size:12px">Preferences</a> | <a target="_blank" href="https://viewstripo.email/" style="-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;text-decoration:underline;color:#666666;font-size:12px">Browser</a> | <a target="_blank" href="https://viewstripo.email/" style="-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;text-decoration:underline;color:#666666;font-size:12px">Forward</a> | <a target="_blank" class="unsubscribe" style="-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;text-decoration:underline;color:#666666;font-size:12px" href="">Unsubscribe</a></p></td>
+                                                                                    </tr>
+                                                                                    <tr style="border-collapse:collapse">
+                                                                                        <td align="left" style="padding:0;Margin:0"><p style="Margin:0;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-family:helvetica, 'helvetica neue', arial, verdana, sans-serif;line-height:18px;color:#666666;font-size:12px">Copyright © 2015-2018 <strong>Company Name</strong>, All Rights Reserved.<br></p></td>
+                                                                                    </tr>
+                                                                                </tbody>
+                                                                            </table>
+                                                                        </td>
+                                                                    </tr>
+                                                                </tbody>
+                                                            </table>
+                                                        </td>
+                                                    </tr>
+                                                </tbody>
+                                            </table>
+                                        </td>
+                                    </tr>
+                                </tbody>
+                            </table>
+                        </td>
+                    </tr>
+                </tbody>
+            </table>
+        </div>
+
+    </body>
+</html>

EnvelopeGenerator.Web/wwwroot/js/annotation.js

@@ -102,7 +102,7 @@
         return frameAnnotation
     }
 
-    async createAnnotationFrameBlob(receiverName, receiverSignature, width, height) {
+    async createAnnotationFrameBlob(receiverName, receiverSignature, timestamp, width, height) {
         const canvas = document.createElement('canvas')
         const scale = 4
         const fontSize = 10
@@ -120,7 +120,7 @@
         // This also should make the lines and text less blurry
         ctx.textRendering = "geometricPrecision"
 
-        const date = new Date()
+        const date = timestamp
         const dateString = date.toLocaleString('de-DE')
 
         const signatureLength = 100 * scale

EnvelopeGenerator.Web/wwwroot/js/app.js

@@ -113,7 +113,7 @@ class App {
     }
 
     handleAnnotationsLoad(loadedAnnotations) {
-        console.log('annotations loaded', loadedAnnotations.toJS())
+        console.debug('annotations loaded', loadedAnnotations.toJS())
     }
 
     handleAnnotationsChange() { }
@@ -129,10 +129,12 @@ class App {
             const top = annotation.boundingBox.top - 20
             const width = 150
             const height = 75
+            const timestamp = new Date()
 
             const imageUrl = await this.Annotation.createAnnotationFrameBlob(
                 this.currentReceiver.name,
                 this.currentReceiver.signature,
+                timestamp,
                 width,
                 height
             )