CINXE.COM
Login - PadBoss
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Login - PadBoss</title> <link href="https://fonts.googleapis.com/css?family=Montserrat&display=swap" rel="stylesheet"> <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.4.1/css/all.css" integrity="sha384-5sAR7xN1Nv6T6+dT2mhtzEpVJvfS3NScPQTrOxhwjIuvcA67KV2R5Jz6kr4abQsz" crossorigin="anonymous"> <link href="/Content/css?v=n09W4cdnguY6PUeHc_tifaYGLfbeKb6oXswyQS7ICLg1" rel="stylesheet"/> <link href="/bundles/jqxstyles?v=kmxNwwEIPtDOufYpaGnIKAI1o9wmoYdUqwFp_Bs_l241" rel="stylesheet"/> <script src="/bundles/jquery?v=Lp-BEuVrQL7HcgxjxFRkK7Ql2NMo4l4Y4TXrg6rWQ7I1"></script> <script src="/bundles/bootstrap?v=D3l8LrL8StwsPQWYTH57v2x16BqFq3ZatzmwZ1Odo-c1"></script> <script src="/bundles/angular?v=a_qmyaePUAtRj5pDZpOIbkCKC3b-DdUqIh993rmEXQQ1"></script> <script src="/bundles/jqxscripts?v=KMoClRq-yNC9MQzOfyiuaX2hFqp174q84rndkIoVTRg1"></script> <script src="/bundles/additions?v=XSQl-liC4wApfYGXs5jWZYB_nKaifpq-nVWeyRVSF1E1"></script> <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> <script src="https://kit.fontawesome.com/dbeb62ed48.js" crossorigin="anonymous"></script> <style> body { background-color: inherit; font-family: 'Montserrat'; /*margin-top:26px;*/ } #hdr { background-color: #234765; flex-grow: 0; padding-top: 6px; z-index: 3; } .hdr_underscore { width: 100%; height: 5px; /*background-color: #4abed3;*/ background: rgb(175, 65, 116); /* Old browsers */ background: -moz-linear-gradient(top, rgba(175, 65, 116,1) 1%, rgba(175, 65, 116,1) 51%, rgba(0,0,0,1) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(175, 65, 116,1) 1%,rgba(175, 65, 116,1) 51%,rgba(0,0,0,1) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(175, 65, 116,1) 1%,rgba(175, 65, 116,1) 51%,rgba(0,0,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#af4174', endColorstr='#000000',GradientType=0 ); /* IE6-9 */ } header { background-color: #57514d; height: 64px; } body, html { padding: 0px; } .navbar-inverse { background-color: #57514d; border-color: #080808; } .navbar-inverse .navbar-brand, .navbar-inverse .navbar-nav > li > a { color: #fff; } .navbar-inverse .navbar-brand:hover, .navbar-inverse .navbar-nav > li > a:hover { color: #fed136; } .navbar { padding: 0px 13px 4px 13px; /*padding-left: 13px;*/ } .navbar-dark .navbar-nav .nav-link { color: rgba(255, 255, 255, 0.7); } .navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus { color: rgba(255, 255, 255, 0.9) !important; } </style> </head> <body ng-app="PadBossApp" ng-controller="PadBossController"> <div id="alertWrapper"></div> <script> var PadBossApp = angular.module('PadBossApp', []); PadBossApp.controller('PadBossController', function ($scope, $rootScope) { //$rootScope.MainMenu = ; function displayNotification(Title, Message, Template, autoClose, autoCloseDelay) { //Valid templates are: success, info, warning, error toastr.options = { "closeButton": true, "debug": false, "newestOnTop": true, "progressBar": true, "positionClass": "toast-top-right", "preventDuplicates": false, "onclick": null, "showDuration": "300", "hideDuration": "1000", "timeOut": autoCloseDelay, "extendedTimeOut": "1000", "showEasing": "swing", "hideEasing": "linear", "showMethod": "fadeIn", "hideMethod": "fadeOut" } switch (Template.toUpperCase()) { case "SUCCESS": toastr.success(Message); break; case "INFO": toastr.info(Message); break; case "WARNING": toastr.warning(Message); break; case "ERROR": toastr.error(Message); break; } }; //$("html").css("display", "none"); //function CheckSession() //{ //} //try { // if (sessionStorage.getItem("UserId") != null && sessionStorage.getItem("UserId") != -1) { // window.location.href = '/Invoices'; // } else { // $("html").show(); // } //} catch (e) { // $("html").show(); //} $scope.UserDetails = {"EmailAddress":"","Password":""}; $(document).keypress(function (e) { if (e.which == 13) { $scope.signin(); } }); $(document).on("click", "#ForgotPassword", function () { $("#loginPanel").hide("slide", { direction: "left" }, 100, function () { $("#passwordResetPanel").show("slide", {direction: "right"}, 100); }); }); $(document).on("click", "#LoginInstead", function () { $scope.$apply($scope.UserDetails.Password = ""); $("#passwordResetPanel").hide("slide", { direction: "right" }, 100, function () { $("#loginPanel").show("slide", {direction: "left"}, 100); }); }); $scope.signin = function(){ if ($scope.UserDetails.EmailAddress != "" && $scope.UserDetails.Password != "") { $(".loginIcon").addClass("spinner-loader"); $.ajax({ url: "/API/Login", type: "POST", data: angular.toJson($scope.UserDetails), contentType: "application/json", success: function (response) { response = JSON.parse(response); if (response.Success == true) { displayNotification("SUCCESS!", "You have successfully logged in", "success", false, 2500); sessionStorage.setItem("UserId", response.Data.UserId); window.location.href = response.Data.RedirectUri; } else { displayNotification("FAILURE!", "There was a problem logging you in", "error", false, 2500); $("#shaker").effect( "shake" ); //$(".failedLogin").slideDown(400, function() {setTimeout('$(".failedLogin").slideUp(200);', 5000);}); } } }); } } $scope.resetPassword = function () { if ($scope.UserDetails.EmailAddress != "") { $(".loginIcon").addClass("spinner-loader"); $scope.UserDetails.Password = new Date().getTimezoneOffset(); $.ajax({ url: "/API/PasswordResetRequest", type: "POST", data: angular.toJson($scope.UserDetails), contentType: "application/json", success: function (response) { response = JSON.parse(response); if (response.Success == true) { displayNotification("SUCCESS!", "An email has been sent to you", "success", false, 2500); $("#LoginInstead").click(); } else { displayNotification("FAILURE!", response.Message, "error", false, 2500); $("#shaker").effect( "shake" ); //$(".failedLogin").slideDown(400, function() {setTimeout('$(".failedLogin").slideUp(200);', 5000);}); } } }); } } $scope.getTimezone = function() { offset = new Date().getTimezoneOffset(); formatted = -(offset / 60); return formatted; } ; }); </script> <div id="hdr"> <nav class="navbar navbar-expand-lg navbar-dark bg-company-colour"> <a class="navbar-brand" href="/"> <span> <img src="/Content/images/Logo-DarkBG.png" height="32px" /> </span> </a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarSupportedContent"> <ul class="navbar-nav mr-auto"> </ul> </div> </nav> <div class="hdr_underscore"></div> </div> <div> <style> html { background: url(/content/images/propertybg.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.myBackground.jpg', sizingMethod='scale'); -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='myBackground.jpg', sizingMethod='scale')"; } .vertical-center { margin: 0; position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .loginPnl { width: 400px; height: 560px; margin: 0 auto; border: 1px solid #ccc; background: rgb(255, 255, 255); /* Fallback for older browsers without RGBA-support */ background: rgba(255, 255, 255, 0.85); border-radius: 20px; -webkit-box-shadow: 0px 0px 92px 41px rgba(0,0,0,0.75); -moz-box-shadow: 0px 0px 92px 41px rgba(0,0,0,0.75); box-shadow: 0px 0px 92px 41px rgba(0,0,0,0.75); position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center; } .loginPnl input { width: 100%; max-width: 100%; height: 36px; border: 1px solid #ccc; border-radius: 8px; text-align: center; margin-bottom: 12px; } .loginPnl a { text-align: right; font-size: 12px; } .loginPnl .btn { width: 100%; text-align: center; margin-bottom: 12px; } </style> <div class="loginPnl" id="shaker"> <div style="width:100%;text-align:center;margin-top:50px;margin-bottom:30px;"> <img src="/Content/images/Logo-LightBG-ImgOver.png" style="width:300px;padding: 30px 0px 70px 0px;" /> </div> <div id="loginPanel" style="width:80%;margin:0 auto;"> <input type="email" id="UserName" placeholder="Email Address" ng-model="UserDetails.EmailAddress" /> <input type="password" id="Password" placeholder="Password" ng-model="UserDetails.Password" /> <a href="#" id="signin" class="btn btn-primary" ng-click="signin()">LOGIN</a> <div style="width:100%; text-align:right;"> <a href="#" id="ForgotPassword">Forgot Password</a><br /> </div> </div> <div id="passwordResetPanel" style="width:80%;margin:0 auto;display:none;position:relative;top:-60px;"> <div style="font-size:1.9rem;padding-bottom:24px;">Reset your password</div> <div style="padding-bottom:0px;">Please enter your email address.</div> <div style="padding-bottom:18px;">We will send you an email to reset your password.</div> <input type="email" id="prEmail" placeholder="Email Address" ng-model="UserDetails.EmailAddress" /> <a href="#" id="signin" class="btn btn-primary" ng-click="resetPassword()">SEND EMAIL</a> <div style="width:100%; text-align:right;"> <a href="#" id="LoginInstead">Login Instead</a><br /> </div> </div> </div> <script> </script> </div> <script type="text/javascript" id="zsiqchat">var $zoho = $zoho || {}; $zoho.salesiq = $zoho.salesiq || { widgetcode: "a98f35a445f3bc75ac16b48dd828cab12fb09464ff3febda5670474fd0f4f6a34426b9d272a365e7387fd3999642ddd5", values: {}, ready: function () { } }; var d = document; s = d.createElement("script"); s.type = "text/javascript"; s.id = "zsiqscript"; s.defer = true; s.src = "https://salesiq.zoho.eu/widget"; t = d.getElementsByTagName("script")[0]; t.parentNode.insertBefore(s, t);</script> <script type="text/javascript"> onload = function () { if (performance.getEntriesByType("navigation")[0].type == "back_forward") { console.log('Reloading'); window.location.reload(); } } </script> </body > </html >