From fa44b82493a3f17e546da1c19dbaf83ec3d2d7f4 Mon Sep 17 00:00:00 2001 From: Developer 02 Date: Sat, 30 Nov 2024 01:56:02 +0100 Subject: [PATCH] =?UTF-8?q?feat(EnvelopeLocked):=20Timer=20mit=20CSS-Konfi?= =?UTF-8?q?guration=20und=20Javascript-Ereignis=20hinzugef=C3=BCgt.=20=20-?= =?UTF-8?q?=20Ablauf=20=C3=BCber=20Home-Controller-Ansichtsdaten=20hinzuge?= =?UTF-8?q?f=C3=BCgt?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Configurations/CodeGeneratorConfig.cs | 2 +- .../DTOs/Messaging/SmsResponse.cs | 2 ++ .../Services/CodeGenerator.cs | 2 +- .../Services/GTXMessagingService.cs | 9 +++-- .../Controllers/HomeController.cs | 6 ++-- .../EnvelopeGenerator.Web.csproj | 2 +- .../Views/Home/EnvelopeLocked.cshtml | 34 ++++++++++++++++++- EnvelopeGenerator.Web/appsettings.json | 3 +- EnvelopeGenerator.Web/wwwroot/css/site.css | 23 ++++++++++++- .../wwwroot/css/site.min.css | 2 +- .../wwwroot/js/event-binder.js | 26 +++++++++++++- .../wwwroot/js/event-binder.min.js | 2 +- 12 files changed, 99 insertions(+), 14 deletions(-) diff --git a/EnvelopeGenerator.Application/Configurations/CodeGeneratorConfig.cs b/EnvelopeGenerator.Application/Configurations/CodeGeneratorConfig.cs index d321401e..b44c989a 100644 --- a/EnvelopeGenerator.Application/Configurations/CodeGeneratorConfig.cs +++ b/EnvelopeGenerator.Application/Configurations/CodeGeneratorConfig.cs @@ -2,6 +2,6 @@ { public class CodeGeneratorConfig { - public string CharPool { get; init; } = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789"; + public string CharPool { get; init; } = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz01234567890123456789012345678901234567890123456789"; } } \ No newline at end of file diff --git a/EnvelopeGenerator.Application/DTOs/Messaging/SmsResponse.cs b/EnvelopeGenerator.Application/DTOs/Messaging/SmsResponse.cs index 57528863..96b67515 100644 --- a/EnvelopeGenerator.Application/DTOs/Messaging/SmsResponse.cs +++ b/EnvelopeGenerator.Application/DTOs/Messaging/SmsResponse.cs @@ -4,6 +4,8 @@ { public required bool Ok { get; init; } + public DateTime? Expiration { get; set; } + public DateTime? AllowedAt { get; set; } public TimeSpan AllowedAfter => Allowed ? TimeSpan.Zero : AllowedAt!.Value - DateTime.Now; diff --git a/EnvelopeGenerator.Application/Services/CodeGenerator.cs b/EnvelopeGenerator.Application/Services/CodeGenerator.cs index c09eaf34..7b3f4b3c 100644 --- a/EnvelopeGenerator.Application/Services/CodeGenerator.cs +++ b/EnvelopeGenerator.Application/Services/CodeGenerator.cs @@ -11,7 +11,7 @@ namespace EnvelopeGenerator.Application.Services public static CodeGenerator Static => LazyStatic.Value; - private readonly string _charPool = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789"; + private readonly string _charPool; public CodeGenerator(IOptions options) { diff --git a/EnvelopeGenerator.Application/Services/GTXMessagingService.cs b/EnvelopeGenerator.Application/Services/GTXMessagingService.cs index 3670795b..be2c1cc9 100644 --- a/EnvelopeGenerator.Application/Services/GTXMessagingService.cs +++ b/EnvelopeGenerator.Application/Services/GTXMessagingService.cs @@ -61,10 +61,13 @@ namespace EnvelopeGenerator.Application.Services code = _codeGen.GenerateCode(_smsParams.CodeLength); await _cache.SetStringAsync(code_key, code, _codeCacheOptions); + + var expiration = DateTime.Now + _smsParams.CodeCacheValidityPeriod; + await _cache.SetDateTimeAsync(code_expiration_key, expiration, _codeCacheOptions); - await _cache.SetDateTimeAsync(code_expiration_key, DateTime.Now + _smsParams.CodeCacheValidityPeriod, _codeCacheOptions); - - return await SendSmsAsync(recipient: recipient, message: code); + var res = await SendSmsAsync(recipient: recipient, message: code); + res.Expiration = expiration; + return res; } else { diff --git a/EnvelopeGenerator.Web/Controllers/HomeController.cs b/EnvelopeGenerator.Web/Controllers/HomeController.cs index 07320bfc..d221bad0 100644 --- a/EnvelopeGenerator.Web/Controllers/HomeController.cs +++ b/EnvelopeGenerator.Web/Controllers/HomeController.cs @@ -191,8 +191,10 @@ namespace EnvelopeGenerator.Web.Controllers if (er_secret.HasPhoneNumber) { var res = await _msgService.SendSmsCodeAsync(er_secret.PhoneNumber!, envelopeReceiverId: envelopeReceiverId); - if(res.Ok) - return View("EnvelopeLocked").WithData("ViaSms", true); + if (res.Ok) + return View("EnvelopeLocked").WithData("ViaSms", true).WithData("Expiration", res.Expiration); + else if (!res.Allowed) + return View("EnvelopeLocked").WithData("ViaSms", true).WithData("Expiration", res.AllowedAt); else { var res_json = JsonConvert.SerializeObject(res); diff --git a/EnvelopeGenerator.Web/EnvelopeGenerator.Web.csproj b/EnvelopeGenerator.Web/EnvelopeGenerator.Web.csproj index 2d02d4fe..a1f2b5f2 100644 --- a/EnvelopeGenerator.Web/EnvelopeGenerator.Web.csproj +++ b/EnvelopeGenerator.Web/EnvelopeGenerator.Web.csproj @@ -47,7 +47,7 @@ - + diff --git a/EnvelopeGenerator.Web/Views/Home/EnvelopeLocked.cshtml b/EnvelopeGenerator.Web/Views/Home/EnvelopeLocked.cshtml index 2444bc7b..335b2441 100644 --- a/EnvelopeGenerator.Web/Views/Home/EnvelopeLocked.cshtml +++ b/EnvelopeGenerator.Web/Views/Home/EnvelopeLocked.cshtml @@ -1,4 +1,5 @@ @using EnvelopeGenerator.Application.DTOs.EnvelopeReceiver; +@using Newtonsoft.Json @{ var nonce = _accessor.HttpContext?.Items["csp-nonce"] as string; var logo = _logoOpt.Value; @@ -6,6 +7,7 @@ var userCulture = ViewData["UserCulture"] as Culture; bool viaSms = ViewData["ViaSms"] is bool _viaSms && _viaSms; var accessCodeName = viaSms ? "smsCode" : "accessCode"; + DateTime? expiration = ViewData["Expiration"] is DateTime _expiration ? _expiration : null; }
@@ -35,6 +37,10 @@ login + @if (expiration is not null) + { + + }
@@ -52,4 +58,30 @@

@_localizer[viaSms ? WebKey.LockedSmsTfaFooterBody : WebKey.LockedFooterBody]

- \ No newline at end of file + + \ No newline at end of file diff --git a/EnvelopeGenerator.Web/appsettings.json b/EnvelopeGenerator.Web/appsettings.json index 28b5a7d9..19d64dd2 100644 --- a/EnvelopeGenerator.Web/appsettings.json +++ b/EnvelopeGenerator.Web/appsettings.json @@ -135,6 +135,7 @@ "Headers": {}, "QueryParams": { "from": "signFlow" - } + }, + "CodeCacheValidityPeriod": "00:10:00" } } \ No newline at end of file diff --git a/EnvelopeGenerator.Web/wwwroot/css/site.css b/EnvelopeGenerator.Web/wwwroot/css/site.css index 0e01b728..07ebcce9 100644 --- a/EnvelopeGenerator.Web/wwwroot/css/site.css +++ b/EnvelopeGenerator.Web/wwwroot/css/site.css @@ -402,14 +402,17 @@ footer#page-footer { .access-code-form-floating { display: flex; - justify-content: start; + justify-content: space-between; flex-direction: row; + align-items: center; } .access-code-form-floating button { align-content: center; border-bottom-left-radius: 0; border-top-left-radius: 0; + margin:0; + height: 100%; } .access-code-form-floating input { @@ -427,6 +430,24 @@ footer#page-footer { height: 2.5rem; } +#sms-timer { + height: 3rem; + display: flex; + align-items: center; + font-family: 'Arial', sans-serif; + font-weight: bold; + color: #ffffff; + background-color: #007bff; + margin: 0 0 0 2rem; + border-radius: 8px; + text-align: center; +} + + #sms-timer:hover { + background-color: #0056b3; + cursor: pointer; + } + /*.flag-dropdown button { height: 100%; }*/ diff --git a/EnvelopeGenerator.Web/wwwroot/css/site.min.css b/EnvelopeGenerator.Web/wwwroot/css/site.min.css index c235c4d3..4adc28ba 100644 --- a/EnvelopeGenerator.Web/wwwroot/css/site.min.css +++ b/EnvelopeGenerator.Web/wwwroot/css/site.min.css @@ -1 +1 @@ -.navbar-toggler{border:0}.material-symbols-outlined{align-content:center}.btn-group{margin-right:10vw;margin-bottom:10vh}.btn_refresh,.btn_reject,.btn_complete{height:2.5rem}.btn_complete .icon,.btn_reject .icon,.btn_refresh .icon{width:1.1rem}.btn_complete span,.btn_reject span,.btn_refresh span{vertical-align:middle}.button-finish{color:#fff;background-color:#0d6efd;border-color:#0d6efd}.button-finish:hover{color:#fff;background-color:#0b5ed7;border-color:#0a58ca}.button-finish:focus{box-shadow:0 0 0 .25rem rgba(49,132,253,.5)}.button-finish:active{color:#fff;background-color:#0a58ca;border-color:#0a53be;box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}.button-finish:disabled{color:#fff;background-color:#0d6efd;border-color:#0d6efd}.button-reject{color:#fff;background-color:#dc3545;border-color:#dc3545}.button-reject:hover{color:#fff;background-color:#bb2d3b;border-color:#b02a37}.button-reject:focus{box-shadow:0 0 0 .25rem rgba(225,83,97,.5)}.button-reject:active{color:#fff;background-color:#b02a37;border-color:#a52834;box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}.button-reject:disabled{color:#fff;background-color:#dc3545;border-color:#dc3545}.button-reset{color:#fff;background-color:#6c757d;border-color:#6c757d}.button-reset:hover{color:#fff;background-color:#5c636a;border-color:#565e64}.button-reset:focus{box-shadow:0 0 0 .25rem rgba(130,138,145,.5)}.button-reset:active{color:#fff;background-color:#565e64;border-color:#51585e;box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}.button-reset:disabled{color:#fff;background-color:#6c757d;border-color:#6c757d}body{background:#f8fcfc;display:flex;flex-direction:column;height:100vh;margin:0}main{display:flex;margin:0 0 .5vh 0}.home-description{text-align:justify;font-family:Consolas,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New;font-weight:500;font-size:.95em;letter-spacing:-1px;word-spacing:-2px}.envelope-view{display:flex;flex-direction:column;width:100vw;height:95.9vh}#app{background:#808080;width:100vw;height:100%;flex-grow:1;border-width:0}footer{height:4vh;min-height:1.5rem;background-color:#001f61;border-radius:10px 10px 0 0;color:#fff;font-family:'Muli';padding:.5vh 0;position:fixed;bottom:0;width:100%;z-index:998;border-width:0;font-size:clamp(.58rem,1.5vw,1rem);display:flex;flex-direction:row;justify-content:space-around;align-items:center}footer *{margin-left:clamp(.5rem,2vw,1rem)}footer a{color:#ff7500;text-decoration:none}footer .dropdown-toggle,footer .flag-dropdown,footer li{margin:0;padding:0;border-width:0}footer .dropdown-menu a{padding:.25rem 1rem .25rem 1rem;margin-left:0;user-select:none}.page{margin-top:3rem;background:#fff;border-radius:.313rem;box-shadow:rgba(9,30,66,.25) 0 .25rem .5rem -.125rem,rgba(9,30,66,.08) 0 0 0 .063rem;max-width:40rem}.page section{max-width:30rem;margin:0 auto}.page header .icon{display:inline-block;border-radius:6.25rem;padding:.938rem;margin-bottom:2rem}.page header .icon.admin{background-color:#331904;color:#fecba1}.page header .icon.locked{background-color:#ffa407;color:#000}.page header .icon.locked.sms-tfa{background-color:#ff7207;color:#000}.page header .icon.signed{background-color:#146c43;color:#fff}.page header .icon.rejected{background-color:#e4d8d5;color:#fff}.page header .icon.expired{background-color:rgba(228,216,213,.5);color:#fff}.page .form{max-width:30rem;margin:2rem auto;display:flex;gap:1rem}#form-access-code>.input,#form-admin-password>.input{flex-grow:1}#page-admin header .icon{background-color:#331904;color:#fecba1}.envelope{display:block;border:.063rem solid #eee;margin-bottom:1rem;padding:.5rem}footer#page-footer{color:#333;max-width:40rem;margin-top:1rem;font-size:.85rem}footer#page-footer a,footer#page-footer a:link,footer#page-footer a:hover,footer#page-footer a:visited,footer#page-footer a:focus{color:#444}.sender-card{background-color:transparent;border:0}.sender-card .row{height:7vh}.sender-card img{height:7vh;background-color:#d1cfcf;border-radius:3.125rem}.navbar .container{display:flex;padding:0;margin:0}.navbar-toggler{padding:0;margin:0;width:4rem;left:0}.envelope-message{position:absolute;display:flex;width:calc(100% - 8rem);align-items:center;justify-content:start;margin-left:4rem}.envelope-message .icon{margin-right:.5rem}.envelope-message .message{font-family:'Roboto',sans-serif;font-size:16px;font-weight:550}.logo{width:9rem;position:absolute;right:0;margin-right:2rem}.none-display{display:none}.dropdown-flag img,.img-flag{width:30%;height:70%}.dropdown-flag{height:75%;width:75%}.increase-dropdown-height{min-height:25rem}.dropdown-flag .select2-container{width:100%!important;max-width:11.25rem}.lang-item{font-size:.85rem}#langDropdownMenuButton{min-width:4vw}.highlight{font-weight:700;font-size:.85rem}.signature-process-title,.signature-process-name{font-size:1.125rem}.mail-link{color:#000;text-decoration:none}.mail-link:hover{text-decoration:underline}#flex-action-panel{z-index:1050}#form-access-code{justify-content:space-evenly}.access-code-form-floating{display:flex;justify-content:start;flex-direction:row}.access-code-form-floating button{align-content:center;border-bottom-left-radius:0;border-top-left-radius:0}.access-code-form-floating input{align-content:center;border-bottom-right-radius:0;border-top-right-radius:0;border-right-width:0;width:7rem}#access-code-error-message{justify-content:center;align-content:center;margin:1.5rem 7rem 0 7rem;height:2.5rem}.header-1{align-items:center;justify-content:space-between;margin-top:0;padding-top:0}.header-1 .text{text-align:center;margin-left:1.5vw;margin-top:0;padding-top:0}.no-receiver-explanation{padding:2.5rem}.ajs-message.ajs-custom{margin:0 0 0 0;padding:0 0 0 0;width:50rem}.ajs-message.ajs-custom .alert{display:flex;flex-direction:row}.ajs-message.ajs-custom span{margin:0 1rem 0 0}.ajs-message.ajs-custom p{margin:0;padding:0}@media(max-height:850px){.navbar .container{display:flex;padding:0;margin:0}.navbar-toggler{padding:0;margin:0;width:4rem;left:0}.envelope-message{width:calc(100% - 4rem - 9rem)}.envelope-message .message{font-size:14px;font-weight:550}.logo{width:9rem;position:absolute;right:0}.card-text,.card-text{font-size:.6rem;margin:0;padding:0}.highlight{font-weight:700;font-size:.5rem}.signature-process-title,.signature-process-name{font-size:.7rem}}@media(max-width:767px){.navbar{flex-direction:column;align-items:flex-start}.navbar-brand{font-size:.5rem;text-align:center;overflow:hidden;text-overflow:ellipsis}.envelope-message{width:calc(100% - 4rem - 4.5rem);margin-left:3rem}.envelope-message .message{font-size:12px;font-weight:550}.envelope-message .icon{margin-right:.1rem;font-size:1rem}.logo{width:5rem;right:0;margin-right:1rem}.btn_group{position:fixed;flex-direction:row;bottom:.5rem;right:.5rem}.img-fluid{width:1.2rem;height:100%;display:none}.page{margin-top:1rem;max-width:90%;padding:.5rem}.page section{max-width:90%}#form-access-code{margin-left:0}}@media(max-width:1024px){#flex-action-panel,.btn-desktop{display:none}}@media(max-height:600px){.collapse{height:4rem}} \ No newline at end of file +.navbar-toggler{border:0}.material-symbols-outlined{align-content:center}.btn-group{margin-right:10vw;margin-bottom:10vh}.btn_refresh,.btn_reject,.btn_complete{height:2.5rem}.btn_complete .icon,.btn_reject .icon,.btn_refresh .icon{width:1.1rem}.btn_complete span,.btn_reject span,.btn_refresh span{vertical-align:middle}.button-finish{color:#fff;background-color:#0d6efd;border-color:#0d6efd}.button-finish:hover{color:#fff;background-color:#0b5ed7;border-color:#0a58ca}.button-finish:focus{box-shadow:0 0 0 .25rem rgba(49,132,253,.5)}.button-finish:active{color:#fff;background-color:#0a58ca;border-color:#0a53be;box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}.button-finish:disabled{color:#fff;background-color:#0d6efd;border-color:#0d6efd}.button-reject{color:#fff;background-color:#dc3545;border-color:#dc3545}.button-reject:hover{color:#fff;background-color:#bb2d3b;border-color:#b02a37}.button-reject:focus{box-shadow:0 0 0 .25rem rgba(225,83,97,.5)}.button-reject:active{color:#fff;background-color:#b02a37;border-color:#a52834;box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}.button-reject:disabled{color:#fff;background-color:#dc3545;border-color:#dc3545}.button-reset{color:#fff;background-color:#6c757d;border-color:#6c757d}.button-reset:hover{color:#fff;background-color:#5c636a;border-color:#565e64}.button-reset:focus{box-shadow:0 0 0 .25rem rgba(130,138,145,.5)}.button-reset:active{color:#fff;background-color:#565e64;border-color:#51585e;box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}.button-reset:disabled{color:#fff;background-color:#6c757d;border-color:#6c757d}body{background:#f8fcfc;display:flex;flex-direction:column;height:100vh;margin:0}main{display:flex;margin:0 0 .5vh 0}.home-description{text-align:justify;font-family:Consolas,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New;font-weight:500;font-size:.95em;letter-spacing:-1px;word-spacing:-2px}.envelope-view{display:flex;flex-direction:column;width:100vw;height:95.9vh}#app{background:#808080;width:100vw;height:100%;flex-grow:1;border-width:0}footer{height:4vh;min-height:1.5rem;background-color:#001f61;border-radius:10px 10px 0 0;color:#fff;font-family:'Muli';padding:.5vh 0;position:fixed;bottom:0;width:100%;z-index:998;border-width:0;font-size:clamp(.58rem,1.5vw,1rem);display:flex;flex-direction:row;justify-content:space-around;align-items:center}footer *{margin-left:clamp(.5rem,2vw,1rem)}footer a{color:#ff7500;text-decoration:none}footer .dropdown-toggle,footer .flag-dropdown,footer li{margin:0;padding:0;border-width:0}footer .dropdown-menu a{padding:.25rem 1rem .25rem 1rem;margin-left:0;user-select:none}.page{margin-top:3rem;background:#fff;border-radius:.313rem;box-shadow:rgba(9,30,66,.25) 0 .25rem .5rem -.125rem,rgba(9,30,66,.08) 0 0 0 .063rem;max-width:40rem}.page section{max-width:30rem;margin:0 auto}.page header .icon{display:inline-block;border-radius:6.25rem;padding:.938rem;margin-bottom:2rem}.page header .icon.admin{background-color:#331904;color:#fecba1}.page header .icon.locked{background-color:#ffa407;color:#000}.page header .icon.locked.sms-tfa{background-color:#ff7207;color:#000}.page header .icon.signed{background-color:#146c43;color:#fff}.page header .icon.rejected{background-color:#e4d8d5;color:#fff}.page header .icon.expired{background-color:rgba(228,216,213,.5);color:#fff}.page .form{max-width:30rem;margin:2rem auto;display:flex;gap:1rem}#form-access-code>.input,#form-admin-password>.input{flex-grow:1}#page-admin header .icon{background-color:#331904;color:#fecba1}.envelope{display:block;border:.063rem solid #eee;margin-bottom:1rem;padding:.5rem}footer#page-footer{color:#333;max-width:40rem;margin-top:1rem;font-size:.85rem}footer#page-footer a,footer#page-footer a:link,footer#page-footer a:hover,footer#page-footer a:visited,footer#page-footer a:focus{color:#444}.sender-card{background-color:transparent;border:0}.sender-card .row{height:7vh}.sender-card img{height:7vh;background-color:#d1cfcf;border-radius:3.125rem}.navbar .container{display:flex;padding:0;margin:0}.navbar-toggler{padding:0;margin:0;width:4rem;left:0}.envelope-message{position:absolute;display:flex;width:calc(100% - 8rem);align-items:center;justify-content:start;margin-left:4rem}.envelope-message .icon{margin-right:.5rem}.envelope-message .message{font-family:'Roboto',sans-serif;font-size:16px;font-weight:550}.logo{width:9rem;position:absolute;right:0;margin-right:2rem}.none-display{display:none}.dropdown-flag img,.img-flag{width:30%;height:70%}.dropdown-flag{height:75%;width:75%}.increase-dropdown-height{min-height:25rem}.dropdown-flag .select2-container{width:100%!important;max-width:11.25rem}.lang-item{font-size:.85rem}#langDropdownMenuButton{min-width:4vw}.highlight{font-weight:700;font-size:.85rem}.signature-process-title,.signature-process-name{font-size:1.125rem}.mail-link{color:#000;text-decoration:none}.mail-link:hover{text-decoration:underline}#flex-action-panel{z-index:1050}#form-access-code{justify-content:space-evenly}.access-code-form-floating{display:flex;justify-content:space-between;flex-direction:row;align-items:center}.access-code-form-floating button{align-content:center;border-bottom-left-radius:0;border-top-left-radius:0;margin:0;height:100%}.access-code-form-floating input{align-content:center;border-bottom-right-radius:0;border-top-right-radius:0;border-right-width:0;width:7rem}#access-code-error-message{justify-content:center;align-content:center;margin:1.5rem 7rem 0 7rem;height:2.5rem}#sms-timer{height:3rem;display:flex;align-items:center;font-family:'Arial',sans-serif;font-weight:bold;color:#fff;background-color:#007bff;margin:0 0 0 2rem;border-radius:8px;text-align:center}#sms-timer:hover{background-color:#0056b3;cursor:pointer}.header-1{align-items:center;justify-content:space-between;margin-top:0;padding-top:0}.header-1 .text{text-align:center;margin-left:1.5vw;margin-top:0;padding-top:0}.no-receiver-explanation{padding:2.5rem}.ajs-message.ajs-custom{margin:0 0 0 0;padding:0 0 0 0;width:50rem}.ajs-message.ajs-custom .alert{display:flex;flex-direction:row}.ajs-message.ajs-custom span{margin:0 1rem 0 0}.ajs-message.ajs-custom p{margin:0;padding:0}@media(max-height:850px){.navbar .container{display:flex;padding:0;margin:0}.navbar-toggler{padding:0;margin:0;width:4rem;left:0}.envelope-message{width:calc(100% - 4rem - 9rem)}.envelope-message .message{font-size:14px;font-weight:550}.logo{width:9rem;position:absolute;right:0}.card-text,.card-text{font-size:.6rem;margin:0;padding:0}.highlight{font-weight:700;font-size:.5rem}.signature-process-title,.signature-process-name{font-size:.7rem}}@media(max-width:767px){.navbar{flex-direction:column;align-items:flex-start}.navbar-brand{font-size:.5rem;text-align:center;overflow:hidden;text-overflow:ellipsis}.envelope-message{width:calc(100% - 4rem - 4.5rem);margin-left:3rem}.envelope-message .message{font-size:12px;font-weight:550}.envelope-message .icon{margin-right:.1rem;font-size:1rem}.logo{width:5rem;right:0;margin-right:1rem}.btn_group{position:fixed;flex-direction:row;bottom:.5rem;right:.5rem}.img-fluid{width:1.2rem;height:100%;display:none}.page{margin-top:1rem;max-width:90%;padding:.5rem}.page section{max-width:90%}#form-access-code{margin-left:0}}@media(max-width:1024px){#flex-action-panel,.btn-desktop{display:none}}@media(max-height:600px){.collapse{height:4rem}} \ No newline at end of file diff --git a/EnvelopeGenerator.Web/wwwroot/js/event-binder.js b/EnvelopeGenerator.Web/wwwroot/js/event-binder.js index d36137ed..04c1a5c9 100644 --- a/EnvelopeGenerator.Web/wwwroot/js/event-binder.js +++ b/EnvelopeGenerator.Web/wwwroot/js/event-binder.js @@ -11,7 +11,7 @@ document.querySelectorAll('.email-input').forEach(input => { document.addEventListener('DOMContentLoaded', function () { var dropdownItems = document.querySelectorAll('.culture-dropdown-item'); dropdownItems.forEach(function (item) { - item.addEventListener('click', async function(event) { + item.addEventListener('click', async function (event) { event.preventDefault(); var language = this.getAttribute('data-language'); var flagCode = this.getAttribute('data-flag'); @@ -21,6 +21,30 @@ document.addEventListener('DOMContentLoaded', function () { }); }); +const setTimer = (elementId, expirationTime) => { + const element = document.getElementById(elementId); + + const interval = setInterval(function () { + var now = new Date(); + + var diffInMillis = expirationTime - now; + + if (diffInMillis <= 0) { + element.textContent = "00:00"; + clearInterval(interval); + } + + var minutes = Math.floor(diffInMillis / 1000 / 60); + var seconds = Math.floor((diffInMillis / 1000) % 60); + + var formattedMinutes = minutes.toString().padStart(2, '0'); + var formattedSeconds = seconds.toString().padStart(2, '0'); + + var remainingTime = `${formattedMinutes}:${formattedSeconds}`; + element.textContent = remainingTime; + }, 1000); +} + const bsNotify = (message, options) => alertify.notify( ``, 'custom', diff --git a/EnvelopeGenerator.Web/wwwroot/js/event-binder.min.js b/EnvelopeGenerator.Web/wwwroot/js/event-binder.min.js index 30f6d827..d56f9789 100644 --- a/EnvelopeGenerator.Web/wwwroot/js/event-binder.min.js +++ b/EnvelopeGenerator.Web/wwwroot/js/event-binder.min.js @@ -1 +1 @@ -document.querySelectorAll(".email-input").forEach(n=>{n.addEventListener("input",function(){/^\S+@\S+\.\S+$/.test(this.value)?this.classList.remove("is-invalid"):this.classList.add("is-invalid")})});document.addEventListener("DOMContentLoaded",function(){var n=document.querySelectorAll(".culture-dropdown-item");n.forEach(function(n){n.addEventListener("click",async function(n){n.preventDefault();var t=this.getAttribute("data-language"),i=this.getAttribute("data-flag");document.getElementById("selectedFlag").className="fi "+i+" me-2";await setLanguage(t)})})});const bsNotify=(n,t)=>alertify.notify(``,"custom",t?.delay??5);class Comp{static ActPanel=class{static __Root;static get Root(){Comp.ActPanel.__Root??=document.getElementById("flex-action-panel");return Comp.ActPanel.__Root}static get Elements(){return[...Comp.ActPanel.Root.children]}static get IsHided(){return Comp.ActPanel.Root.style.display=="none"}static set Display(n){Comp.ActPanel.Root.style.display=n;Comp.ActPanel.Elements.forEach(t=>t.style.display=n)}static Toggle(){Comp.ActPanel.Display=Comp.ActPanel.IsHided?"":"none"}};static SignatureProgress=class{static __SignatureCount;static get SignatureCount(){this.__SignatureCount=parseInt(document.getElementById("signature-count").innerText);return this.__SignatureCount}static __SignedCountSpan;static get SignedCountSpan(){this.__SignedCountSpan??=document.getElementById("signed-count");return Comp.SignatureProgress.__SignedCountSpan}static __signedCount=0;static get SignedCount(){return this.__signedCount}static set SignedCount(n){this.__signedCount=n;const t=(n/this.SignatureCount)*100;this.SignedCountBar.style.setProperty("--progress-width",t+"%");this.SignedCountSpan.innerText=n.toString()}static __SignedCountBar;static get SignedCountBar(){this.__SignedCountBar??=document.getElementById("signed-count-bar");return this.__SignedCountBar}};static __ShareBackdrop;static get ShareBackdrop(){return Comp.__ShareBackdrop??=new bootstrap.Modal(document.getElementById("shareBackdrop")),this.__ShareBackdrop}} \ No newline at end of file +document.querySelectorAll(".email-input").forEach(n=>{n.addEventListener("input",function(){/^\S+@\S+\.\S+$/.test(this.value)?this.classList.remove("is-invalid"):this.classList.add("is-invalid")})});document.addEventListener("DOMContentLoaded",function(){var n=document.querySelectorAll(".culture-dropdown-item");n.forEach(function(n){n.addEventListener("click",async function(n){n.preventDefault();var t=this.getAttribute("data-language"),i=this.getAttribute("data-flag");document.getElementById("selectedFlag").className="fi "+i+" me-2";await setLanguage(t)})})});const setTimer=(n,t)=>{const i=document.getElementById(n),r=setInterval(function(){var u=new Date,n=t-u;n<=0&&(i.textContent="00:00",clearInterval(r));var f=Math.floor(n/6e4),e=Math.floor(n/1e3%60),o=f.toString().padStart(2,"0"),s=e.toString().padStart(2,"0"),h=`${o}:${s}`;i.textContent=h},1e3)},bsNotify=(n,t)=>alertify.notify(``,"custom",t?.delay??5);class Comp{static ActPanel=class{static __Root;static get Root(){Comp.ActPanel.__Root??=document.getElementById("flex-action-panel");return Comp.ActPanel.__Root}static get Elements(){return[...Comp.ActPanel.Root.children]}static get IsHided(){return Comp.ActPanel.Root.style.display=="none"}static set Display(n){Comp.ActPanel.Root.style.display=n;Comp.ActPanel.Elements.forEach(t=>t.style.display=n)}static Toggle(){Comp.ActPanel.Display=Comp.ActPanel.IsHided?"":"none"}};static SignatureProgress=class{static __SignatureCount;static get SignatureCount(){this.__SignatureCount=parseInt(document.getElementById("signature-count").innerText);return this.__SignatureCount}static __SignedCountSpan;static get SignedCountSpan(){this.__SignedCountSpan??=document.getElementById("signed-count");return Comp.SignatureProgress.__SignedCountSpan}static __signedCount=0;static get SignedCount(){return this.__signedCount}static set SignedCount(n){this.__signedCount=n;const t=(n/this.SignatureCount)*100;this.SignedCountBar.style.setProperty("--progress-width",t+"%");this.SignedCountSpan.innerText=n.toString()}static __SignedCountBar;static get SignedCountBar(){this.__SignedCountBar??=document.getElementById("signed-count-bar");return this.__SignedCountBar}};static __ShareBackdrop;static get ShareBackdrop(){return Comp.__ShareBackdrop??=new bootstrap.Modal(document.getElementById("shareBackdrop")),this.__ShareBackdrop}} \ No newline at end of file