reset.pug 4.11 KB
Newer Older
Rosanny Sihombing's avatar
Rosanny Sihombing committed
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
doctype html
html(lang="en")
  head
    title= "Reset Password"
    meta(charset="UTF-8")
    meta(name="viewport", content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no")
    link(rel="stylesheet", type="text/css", href="https://transfer.hft-stuttgart.de/css/bootstrap/bootstrap.css")
    link(rel="stylesheet", href="https://use.fontawesome.com/releases/v5.8.2/css/all.css", integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay", crossorigin="anonymous")
    style.
        .collapse {
            display: none;
        }
        .collapse.in {
            display: block;
        }
        .collapsing {
            position: relative;
            height: 0;
            overflow: hidden;
            -webkit-transition-timing-function: ease;
            -o-transition-timing-function: ease;
            transition-timing-function: ease;
            -webkit-transition-duration: .35s;
            -o-transition-duration: .35s;
            transition-duration: .35s;
            -webkit-transition-property: height,visibility;
            -o-transition-property: height,visibility;
            transition-property: height,visibility;
        }
  body
    div(class="container-fluid")
        div(class="row")
            div(class="col-sm-9")
                h2 Reset Password
                if successes
                    for success in successes
                        div.alert.alert-success.alert-dismissible #{ success }
                            a(class="close", href="#", data-dismiss="alert", aria-label="close") ×
                if errors
                    for error, i in errors
                        div.alert.alert-danger.alert-dismissible.fade.show #{ error }
                            a(class="close", href="#", data-dismiss="alert", aria-label="close") ×
                form#forgotForm(method="POST")
                    div(class="form-group row")
                        label(for="newPwd") New Password
                        input#inputNewPwd(name="inputNewPwd", type="password", class="form-control", placeholder="New Password" required)
                        span#recommendation
                        label(for="confirmPwd") Confirm Password
                        input#inputConfirm(name="inputConfirm", type="password", class="form-control", placeholder="Confirm Password" required)
                        span#message                 
                    input#updateBtn(type="submit", class="btn btn-primary", value="Update Password" disabled)

    // jQuery
    script(src="https://code.jquery.com/jquery-3.3.1.min.js")
    script(src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js", integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1", crossorigin="anonymous")
    // Bootstrap
    script(src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous")
    // M4_LAB
59
    script(src="/account/js/generalFunction.js")
60
61
    script(src="/js/headfoot.js")
    script.
Wolfgang Knopki's avatar
Wolfgang Knopki committed
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
        $('#inputNewPwd, #inputConfirm').on('keyup', function () {
            var isBest = false;
            var isMatch = false;

            // password best practice
            if ($('#inputNewPwd').val().length < 8) {
                $('#recommendation').html('Must be at least 8 characters').css('color', 'red');
                isBest = false;
            } else {
                $('#recommendation').html('').css('color', 'red');
                isBest = true;
            }
            // match or not?
            if ($('#inputNewPwd').val() == $('#inputConfirm').val()) {
                $('#message').html('Matching').css('color', 'green');
                isMatch = true;
            } else {
                $('#message').html('Not Matching').css('color', 'red');
                isMatch = false;
            }
    
        // enable/disable update button
        if (isBest && isMatch) {
            $('#updateBtn').prop('disabled', false);
        } else {
            $('#updateBtn').prop('disabled', true);
        }
    });