Program: CWE-22
Project: CVE-2019-10765
Buggy source:
<html>
<head>
    <style>
        * {
            box-sizing:border-box;
        }

        body {
            font-family: Helvetica;
            background: #64b5f6;
            -webkit-font-smoothing: antialiased;
            background-size: 100% auto;
        }

        .logo { display: block }

        @media only screen and (orientation: portrait) {
            body {
                background-size: auto 100%;
            }
        }

        header {
            text-align:center;
            margin-top: 4em;
        }

        /*h1, h3 { font-weight: 300; }*/

        h1 {
            color:          white;
            font-weight:    bold;
            text-transform: uppercase;
        }

        h3 { color: #4a89dc; }

        form {
            width:          380px;
            margin:         4em auto;
            padding:        3em 2em 2em 2em;
            background:     #fafafa;
            border:         1px solid #ebebeb;
            box-shadow:     rgba(0,0,0,0.14902) 0 1px 1px 0,rgba(0,0,0,0.09804) 0 1px 2px 0;
            border-radius:  2px;
        }

        .group {
            position: relative;
            margin-bottom: 45px;
        }

        input {
            font-size: 18px;
            padding: 10px 10px 10px 5px;
            -webkit-appearance: none;
            display: block;
            background: #fafafa;
            color: #636363;
            width: 100%;
            border: none;
            border-radius: 0;
            border-bottom: 1px solid #757575;
        }

        input:focus { outline: none; }

        /* Label */

        label {
            color: #999;
            font-size: 18px;
            font-weight: normal;
            position: absolute;
            pointer-events: none;
            left: 5px;
            top: 10px;
            transition: all 0.2s ease;
        }

        /* active */

        input:focus ~ label, input.used ~ label {
            top: -20px;
            transform: scale(.75); left: -2px;
            /* font-size: 14px; */
            color: #4a89dc;
        }

        /* Underline */

        .bar {
            position: relative;
            display: block;
            width: 100%;
        }

        .bar:before, .bar:after {
            content: '';
            height: 2px;
            width: 0;
            bottom: 1px;
            position: absolute;
            background: #4a89dc;
            transition: all 0.2s ease;
        }

        .bar:before { left: 50%; }

        .bar:after { right: 50%; }

        /* active */

        input:focus ~ .bar:before, input:focus ~ .bar:after { width: 50%; }


        /* Highlight */

        .highlight {
            position: absolute;
            height: 60%;
            width: 100px;
            top: 25%;
            left: 0;
            pointer-events: none;
            opacity: 0.5;
        }


        /* active */

        input:focus ~ .highlight {
            animation: inputHighlighter 0.3s ease;
        }


        /* Animations */

        @keyframes inputHighlighter {
            from { background: #4a89dc; }
            to 	{ width: 0; background: transparent; }
        }


        /* Button */

        .button {
            position: relative;
            display: inline-block;
            padding: 12px 24px;
            margin: .3em 0 1em 0;
            width: 100%;
            vertical-align: middle;
            color: #fff;
            font-size: 16px;
            line-height: 20px;
            -webkit-font-smoothing: antialiased;
            text-align: center;
            letter-spacing: 1px;
            background: transparent;
            border: 0;
            border-bottom: 2px solid #3160B6;
            cursor: pointer;
            transition: all 0.15s ease;
        }
        .button:focus { outline: 0; }


        /* Button modifiers */

        .buttonBlue {
            background: #2196f3;
            text-shadow: 1px 1px 0 rgba(39, 110, 204, .5);
            border-radius: 2px;
        }

        .buttonBlue:hover { background: #39a1f4; }


        /* Ripples container */
        .ripples {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            overflow: hidden;
            background: transparent;
        }

        /* Ripples circle */

        .ripplesCircle {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            opacity: 0;
            width: 0;
            height: 0;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.25);
        }

        .ripples.is-active .ripplesCircle {
            animation: ripples .4s ease-in;
        }


        /* Ripples animation */

        @keyframes ripples {
            0% { opacity: 0; }

            25% { opacity: 1; }

            100% {
                width: 200%;
                padding-bottom: 200%;
                opacity: 0;
            }
        }

        footer { text-align: center; }

        footer p {
            color: white;
            font-size: 13px;
            letter-spacing: .4px;
        }

        footer a {
            color: #eaeaea;
            text-decoration: none;
            transition: all .2s ease;
        }

        footer a:hover {
            color: white;
            text-decoration: underline;
        }

        footer img {
            width: 80px;
            transition: all .2s ease;
        }

        footer img:hover { opacity: .83; }

        footer img:focus , footer a:focus { outline: none; }

        .error {
            color:          white;
            text-align:     center;
            padding:        0.5rem 1rem;
            position:       absolute;
            background:     #ef9a9a;
            top:            10px;
            width:          400px;
            left:           calc(50% - 200px);
            border-radius: 2px;
        }
    </style>
</head>
<body>
<header>
    <h1 id="login-label">ioBroker Admin</h1>
</header>
<form action="/login" method="post">
    <div class="group">
        <input type="text" name="username" id="username"><span class="highlight"></span><span class="bar"></span>
        <label id="username-label" for="username">Name</label>
    </div>
    <div class="group">
        <input type="password" name="password" id="password"><span class="highlight"></span><span class="bar"></span>
        <label id="password-label" for="password">Password</label>
    </div>
    <input type="hidden" id="origin" name="origin" value=""/>
    <button type="submit" class="button buttonBlue" id="submit"><span id="submit-label">Submit</span>
        <div class="ripples buttonRipples"><span class="ripplesCircle"></span></div>
    </button>
</form>
<div id="error" class="error" style="display: none"></div>
<footer><a class="logo" href="http://iobroker.net/" target="_blank"><img src="data:image/png;base64,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"></a>
    <p>Discover awesome. <a href="http://iobroker.net/" target="_blank">ioBroker</a></p>
</footer>
<script>
    document.getElementById('origin').value = window.location.search.replace('&error', '');
    var userLang = navigator.language || navigator.userLanguage;
    userLang = userLang.substring(0, 2).toLowerCase();
    var systemDictionary = {
        "wrongPassword": {
            "en": "Invalid username or password",
            "de": "Name oder Kennwort sind falsch",
            "ru": "Неверные имя пользователя или пароль",
            "pt": "nome de usuário ou senha inválidos",
            "nl": "ongeldige gebruikersnaam of wachtwoord",
            "fr": "Nom d'utilisateur ou mot de passe invalide",
            "it": "Nome utente o password errati",
            "es": "usuario o contraseña invalido",
            "pl": "Nieprawidłowa nazwa użytkownika lub hasło",
            "zh-cn": "用户名或密码无效"
        },
        "enterLogin": {
            "en": "Login name",
            "de": "Loginname",
            "ru": "Имя пользователя",
            "pt": "Nome de acesso",
            "nl": "Inlog naam",
            "fr": "Identifiant",
            "it": "Nome di login",
            "es": "Nombre de inicio de sesión",
            "pl": "Nazwa użytkownika",
            "zh-cn": "登录名"
        },
        "enterPassword": {
            "en": "Password",
            "de": "Kennwort",
            "ru": "Пароль",
            "pt": "Senha",
            "nl": "Wachtwoord",
            "fr": "Mot de passe",
            "it": "Parola d'ordine",
            "es": "Contraseña",
            "pl": "Hasło",
            "zh-cn": "密码"
        },
        "login": {
            "en": "Log in",
            "de": "Log in",
            "ru": "Войти",
            "pt": "Entrar",
            "nl": "Log in",
            "fr": "S'identifier",
            "it": "Accesso",
            "es": "Iniciar sesión",
            "pl": "Zaloguj Się",
            "zh-cn": "登录"
        },
        "title": {
            "en": "Admin",
            "de": "Admin",
            "ru": "Вход в админ"
        }
    };

    if (window.location.search.indexOf('error') !== -1) {
        document.getElementById('error').innerHTML      = systemDictionary.wrongPassword[userLang]  || systemDictionary.wrongPassword.en;
        document.getElementById('error').style.display  = '';
    }
    document.getElementById('username-label').innerHTML = systemDictionary.enterLogin[userLang]     || systemDictionary.enterLogin.en;
    document.getElementById('password-label').innerHTML = systemDictionary.enterPassword[userLang]  || systemDictionary.enterPassword.en;
    document.getElementById('login-label').innerHTML    = systemDictionary.title[userLang]          || systemDictionary.title.en;
    document.getElementById('submit-label').innerHTML   = systemDictionary.login[userLang]          || systemDictionary.login.en;

    var inputs = document.getElementsByTagName('INPUT');
    if (inputs) {
        for (var i = 0; i < inputs.length; i++) {
            inputs[i].addEventListener('blur', function() {
                if (this.value) {
                    if (this.className.indexOf('used') === -1) {
                        this.className += ' used';
                    }
                } else {
                    this.className = this.className.replace(/\s?used/, '');
                }
            });
        }
        setTimeout(function () {
            if (document.getElementById('username').value) {
                document.getElementById('password').focus();
                setTimeout(function () {
                    if (!document.getElementById('username').value) {
                        document.getElementById('username').focus();
                    }
                }, 300);
            } else {
                document.getElementById('username').focus();
            }
        }, 300);
    }
    document.getElementById('username').addEventListener('keydown', function (e) {
        if (e.keyCode === 13) {
            e.preventDefault();
            setTimeout(function () {
                document.getElementById('password').focus();
            }, 100);
        }
    });
    document.getElementById('password').addEventListener('keyup', function (e) {
        if (e.keyCode === 13) {
            document.getElementById('submit').click();
        }
    });

    function animationEnd () {
        this.className = this.className.replace(/\s?is-active/, '');
    }

    var ripples = document.getElementsByClassName('ripples');
    if (ripples) {
        for (var r = 0; r < ripples.length; r++) {
            ripples[r].addEventListener('click', function (e) {
                var $parent = this.parentElement.parentElement;
                var $offset = {top: $parent.offsetTop, left: $parent.offsetLeft};
                var $circle = this.getElementsByClassName('ripplesCircle')[0];

                var x = e.pageX - $offset.left;
                var y = e.pageY - $offset.top;

                $circle.style.top   = y + 'px';
                $circle.style.left  = x + 'px';

                if (this.className.indexOf('is-active') === -1) {
                    this.className += ' is-active';
                }
            });

            ripples[r].addEventListener('webkitAnimationEnd',   animationEnd);
            ripples[r].addEventListener('mozAnimationEnd',      animationEnd);
            ripples[r].addEventListener('MSAnimationEnd',       animationEnd);
            ripples[r].addEventListener('oanimationend',        animationEnd);
            ripples[r].addEventListener('animationend',         animationEnd);
        }
    }
</script>
</body>
</html>

Fixed version (ground truth):
<html>
<head>
    <style>
        * {
            box-sizing: border-box;
        }

        body {
            font-family: Helvetica;
            background: #64b5f6;
            -webkit-font-smoothing: antialiased;
            background-size: 100% auto;
        }

        .logo { display: block }

        @media only screen and (orientation: portrait) {
            body {
                background-size: auto 100%;
            }
        }

        header {
            text-align:center;
            margin-top: 4em;
        }

        /*h1, h3 { font-weight: 300; }*/

        h1 {
            color:          white;
            font-weight:    bold;
            text-transform: uppercase;
        }

        h3 { color: #4a89dc; }

        form {
            width:          380px;
            margin:         4em auto;
            padding:        3em 2em 2em 2em;
            background:     #fafafa;
            border:         1px solid #ebebeb;
            box-shadow:     rgba(0,0,0,0.14902) 0 1px 1px 0,rgba(0,0,0,0.09804) 0 1px 2px 0;
            border-radius:  2px;
        }

        .group {
            position: relative;
            margin-bottom: 45px;
        }

        input {
            font-size: 18px;
            padding: 10px 10px 10px 5px;
            -webkit-appearance: none;
            display: block;
            background: #fafafa;
            color: #636363;
            width: 100%;
            border: none;
            border-radius: 0;
            border-bottom: 1px solid #757575;
        }

        input:focus {
            outline: none;
        }

        /* Label */

        label {
            color: #999;
            font-size: 18px;
            font-weight: normal;
            position: absolute;
            pointer-events: none;
            left: 5px;
            top: 10px;
            transition: all 0.2s ease;
        }

        /* active */
        input:focus ~ label,
        input.used ~ label {
            top: -20px;
            transform: scale(.75); left: -2px;
            /* font-size: 14px; */
            color: #4a89dc;
        }

        /* Underline */

        .bar {
            position: relative;
            display: block;
            width: 100%;
        }

        .bar:before, .bar:after {
            content: '';
            height: 2px;
            width: 0;
            bottom: 1px;
            position: absolute;
            background: #4a89dc;
            transition: all 0.2s ease;
        }

        .bar:before { left: 50%; }

        .bar:after { right: 50%; }

        /* active */

        input:focus ~ .bar:before,
        input:focus ~ .bar:after {
            width: 50%;
        }


        /* Highlight */

        .highlight {
            position: absolute;
            height: 60%;
            width: 100px;
            top: 25%;
            left: 0;
            pointer-events: none;
            opacity: 0.5;
        }


        /* active */

        input:focus ~ .highlight {
            animation: inputHighlighter 0.3s ease;
        }


        /* Animations */

        @keyframes inputHighlighter {
            from { background: #4a89dc; }
            to 	{ width: 0; background: transparent; }
        }


        /* Button */

        .button {
            position: relative;
            display: inline-block;
            padding: 12px 24px;
            margin: .3em 0 1em 0;
            width: 100%;
            vertical-align: middle;
            color: #fff;
            font-size: 16px;
            line-height: 20px;
            -webkit-font-smoothing: antialiased;
            text-align: center;
            letter-spacing: 1px;
            background: transparent;
            border: 0;
            border-bottom: 2px solid #3160B6;
            cursor: pointer;
            transition: all 0.15s ease;
        }

        .button:focus {
            outline: 0;
        }

        /* Button modifiers */
        .buttonBlue {
            background: #2196f3;
            text-shadow: 1px 1px 0 rgba(39, 110, 204, .5);
            border-radius: 2px;
        }

        .buttonBlue:hover {
            background: #39a1f4;
        }


        /* Ripples container */
        .ripples {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            overflow: hidden;
            background: transparent;
        }

        /* Ripples circle */

        .ripplesCircle {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            opacity: 0;
            width: 0;
            height: 0;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.25);
        }

        .ripples.is-active .ripplesCircle {
            animation: ripples .4s ease-in;
        }


        /* Ripples animation */

        @keyframes ripples {
            0% { opacity: 0; }

            25% { opacity: 1; }

            100% {
                width: 200%;
                padding-bottom: 200%;
                opacity: 0;
            }
        }

        footer { text-align: center; }

        footer p {
            color: white;
            font-size: 13px;
            letter-spacing: .4px;
        }

        footer a {
            color: #eaeaea;
            text-decoration: none;
            transition: all .2s ease;
        }

        footer a:hover {
            color: white;
            text-decoration: underline;
        }

        footer img {
            width: 80px;
            transition: all .2s ease;
        }

        footer img:hover { opacity: .83; }

        footer img:focus , footer a:focus { outline: none; }

        .error {
            color:          white;
            text-align:     center;
            padding:        0.5rem 1rem;
            position:       absolute;
            background:     #ef9a9a;
            top:            10px;
            width:          400px;
            left:           calc(50% - 200px);
            border-radius: 2px;
        }
    </style>
</head>
<body>
<header>
    <h1 id="login-label">ioBroker Admin</h1>
</header>
<form action="/login" method="post">
    <div class="group">
        <input type="text" name="username" id="username" class="used"><span class="highlight"></span><span class="bar"></span>
        <label id="username-label" for="username">Name</label>
    </div>
    <div class="group">
        <input type="password" name="password" id="password" class="used"><span class="highlight"></span><span class="bar"></span>
        <label id="password-label" for="password">Password</label>
    </div>
    <input type="hidden" id="origin" name="origin" value=""/>
    <button type="submit" class="button buttonBlue" id="submit"><span id="submit-label">Submit</span>
        <div class="ripples buttonRipples"><span class="ripplesCircle"></span></div>
    </button>
</form>
<div id="error" class="error" style="display: none"></div>
<footer><a class="logo" href="http://iobroker.net/" target="_blank"><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQAAAAEACAYAAABccqhmAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAScwAAEnMBjCK5BwAAABl0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMC4yMfEgaZUAACHYSURBVHhe7Z0LmB1FlcczhIisSiBzq3tmCA/dCIigZG6CUdDLdHXfhIeuCuOuiwqyGhWMMZnpqnsT4cIKKgoor2Qm6IKIuxIEFmEBl/UBopKZgQ8VBEVQw0MBeRkBA8nMnrpzIMOkApNJd1V19/l93/8L5DH1r+pTp6u6q6umEARBEARBEARBEARBEARBEARBEARBEARBEARBEC4wMtJy4Nm37DT7glvf1Nk32DW7f+DIzr6hEzpXrDmxs3/oS+X+wfNA3wJdXu4bvBr+zvfHSv1e88/U3+kbPL+zb+D0zhWDJ87uH/x0eeXgUZ2rhoK55615c7l/aLoqC0slCMIGs/sG3t25cuBM6LxXdfYP3g6d/CnouMPQQUdSFZQB5a2DBPHLZtJYOfhV+P33oi2CIExQ7r8V7tiaDmpBagSBtgiCmBTd3VNZ1HtAKZCLPS4vbz+i8Q/4J1qylAAqlcb2Xii+2xrInlK1Vp7SvXoq/hFBFJfWMO7wuTwOOvylLBSPeqEceUGt74lfh39NS5YSQHnhwmmQAJ5/sX5cPO6Fte/C7328o7p8N/xrBJF3RlpKXM5mXJwCneBW6AzDL3aKccp1AniphiH5/YJF4rQ2Xps7pdHYDv8ZQeQD1iXfCnf50yHQ79V0AK0KlABeIhbKP4DObOU9c+Gf0tsGIpuo4T10+F642/9KF+ivpKImgLGC9rvL57V6eyh3xx9FEA6jHnZx+U8QvFdPJuDHihLAGHGxAdr1ehbF3ft2N16FP5Yg3KBtQZ1BgC+HIF2rDeBJiBLAFsTFQ4zHJ5fmL2vHH08QdmgL6vsyLvtgzvqMNli3QZQAXkFcrAdd6AX1t2AxBGEGj9fe7nNxFQT1Rm1wJiBKABOVGPZ4fH0pjCtYHEGkAwTbPBaKG/SBmKwoAUxG4ia/SwZYLEEkg3o/DfP7a/VBl44oAUxeMC37PxbVD8LiCWJywLDyjdDxL4W55hYX7KQlSgDbrGFIBFe1heJNaIMgJsYuoZzOInFG80GTPrhSFyWApKTKFed38For2iGILdDdPdXj8UK4czysDyZzogSQrBgXj/m8d5H6MAltEcQmSkHcCR3/Fl3w2BAlgJTExe3gZR5aI4qOH/W8Bub5X4HA2KANGEuiBJCmxEa45ufOWNDYCS0SRcTjtRAC4nebB4h9UQIwIC7W+lwcjjaJoqA224AAOB9k/On+REUJwKC4uJBGAwXBD8SBLJR3awPBIVECMCvGxX2loP5OtEzkjkZjOy9ofrDznC4AXBMlAAviYgNMCU4rlxdOQ+tEHvCCum9qCW9SogRgUVz8ZNeKmIn2iSxTiuS74II+pL3QDosSgF3BlOCRtkgcilUgMkiLx2tLsxZ4L4gSgAPi6nWhOJH2KcwYM+ct2RGG/JdoL2pGRAnAHcFo4ApWabwWq0O4THMvPi6cWdE3WVECcEtwQ/mFP1/uiVUiXEQdrAGB9oDuAmZNlADc0+g3IrSM2Em8qojg4vxVd+GyKEoAbgqSwDNeENNZiC7BeO0YGKJl4v3+REUJwGFxuYHx+HisHmETjwv1pN/ZJb2TFSUA9wWjgZOhenR4iSVa1AXQXZg8aFsSAHTIDZ19A4909g/dpjqnOvO/s3/gnM6+oVM7Vw7VZ6+8ZQn8+QmzVw5+Qqlz5cDx8P+fhV/rzb/TN3h2edXQxeW+wevh3w7Br3+Gn/W8riyloiYAJcbFGVNGRigJmGWkBYb8Z+kuSF40kQQAHW8ddNib5/QN9UFHXjJnxcChc74+sDd0ypc9WXgyzDvzZzvOXbVmLyizCklkcefKwRWQGG6Csp4scgJQYqHsU5vJYHWJtMl751d6pQQw97w1bd2r7R+z3WiMbPe2C37u4/9qyXsCGJW4kBYMpU7+7/wv6JUSQJYoRgJojgT6KQmkiBfVvqRr+DyJcXkHi8Qp6pxBrHb2UV9iNo9OU9tx6eudG3GxQt2osOZEUvhhLLUNngPBqOaBEhdf9KP6fljd3NJare/jh+LzjIvf69oiF4JridUlksAL409Cw+bqVR90+vXqzAHWVatO6bY/lzcOjAr8SAbQDpeAntW1UcbVgzUltgXGe49UCy80DZxNcfknL5An0em2m/CjHg9GBHWYQ9+vbbNsahjqdAxWkZgMMG+cl8bJu1bExW/VmQN7VBqvxuoR41Bn/7NAHgsjgju1bZgxQew+B6NXjtUjtgZWrc2CQHhE17AZ0x1+IP7F5DB/3qVrd5x9/q1vmtM/EJZXDn6kvGJNrbNv4ItqvUC5f+g75f7B74Gu6+wbukFJ/Xfz9/oGL4Vf+zv7h74Ef6/WuWroWPj30YErb9s3jbUFW0Q9NAzq74UbwG2a9syYxBP+fPFmrBkxEeAuuTPcMe/SN2g2BMnr9608PjrN10Ldq0emdvYN7g86BjryWfArdOiBP8KvG6DDalftTVbwMzeC7ock8QPQ12ZfcOtH565ac0DlRyPpva2AtmOROAo60W90bZwVqQeeapqDtSJeltHjuYyexJukoOM/Dr/2zFqwaAesUSrAnfrL0CHX6TqrSXWuHHi6vGrwa2grFcrl/mnQrp+GjpTZESFMB25SUxysErEloLFOH994mVDzCzG5sr3SKGFVUiVLHwMlhRoZ+jz+KowIMrmoCBLYSqwKoaMUig/oGs59idvaeG0uVsMIRUwAL8C65FthRPAz/bVwWyysfRSrQYxFLRCBu+hTukZzVZDRn4GhnbSxj3yRE0ATmCr6kfgMJN91umvjqtRbrdL8uBNrQShmHqU28ZS/0DWYq4Lh/s87uuK9sQrGKXwCQPyo5/UsED/SXSNnxcU9u4RyOlaB8EPRr20oF8WFmuufbHutPiWAMahVhWFvDa5LZnaFgtHjt9F9scnUvJ+LtTBSORitW4USwOa0hcvmqLur9to5qBKPj0PrxWTGAjETLph6baZtIKfE5bXtlaVGnvBPBEoAetTQmoXiCu01dEwwYvlbKYzfiNaLxkiLF4jrdA3jlsQwXKhT01zQMxkoAbwcIy0+r9Uz8Q0JFzcXcjchxmvHaxvEIY1maPEBtOwUlABemRIXh0MHc/7NEguEQMvFQD25hQvj9usbLh5q7+opo2XnoAQwMdQeCyyUf9BeY0cE/p5tC8Wb0HLegaE/l9frGsIdibv9aPnr0bCTUAKYOOq4OEjoTu9GpBY2FWIq4AXyQ7oGcEWMxz/v4LVWtOsslAC2jubDQS5/qLvmrogF8gS0m09mVpfMgIvwsK7yLohx8UNWOT4Tp8BSAth6mqdGB/Jq3bV3RE+ww3rb0G7+gLlOn6bSbgimJX7U8xq06jyUACZHc9MRLq7UxoADgj5yCVrNF7hIY6Ou0vYlrsvaTj2UACaPSgIlHl+ujwX78rk8BK3mhhbo/DfpKmtdXNzYfkTD3G43CUEJYNsoL+yfphZ3aWPCtri4PVcPBFlU69ZW1LJYKAay+lEGJYBtRyV+GP25eWMK44+hzWyjdsaBOdd9+kralPiNqc070oASQDKoTUbgRuDel6hcPMQqjUw8kH5ZoCJLtRW0KBbKR0vvyvYabEoAybFrRcyEuHhgfJxYFxcnosVsMvruVTyqrZwlQbZ/loVLnfiib1ugBJAspSDuhFGha6tT/5rpzUQ9XjtRUymrYmH8YbSXaSgBJA/cHN4PMeLUCVQskGeivWyBd3/XPvU9G+1lHkoA6QDTw3/XxI01QR96mlUyuDgIhlMNXYWsidd+ol79oL3MQwkgJdS29IF06jN1SAJnoLtsoM62d+nuD14emREs2xXt5QJKAOnRtqDO4Abm0ENBsS4L36e8CMylevUVsSAuhtV34WgtN1ACSJe2MK5A7DizoQjcxE5Ba27TfO/vVvY8B63lCkoA6QNx/Hl9TFkQl49lYl2AY5/73p3FZb4TgRJA+jSXCzt0QGkmPheGTDWoM29cMHzzo563oa3cQQnADOoUIoil9doYMy0u73Ztb8qXwKL6QVrjNsTlV9BWLqEEYA6Ip5M2iy9LKgXiULTlHiwS/6kzbVqMiz9kZWOPyUIJwBzNPQRCcacu1kwLYvt7aMst1GIFd4ZKvf+EtnILJQCztHJ5iBcK+6sEudzgV+SeaMsdGI9jrWHDgkx9NVrKNZQAzAPx9V/j482G1NsJtOQKIy2QHe0PkWAEUuK1vdBUrqEEYJ6O6vLdYAj+tDb2TIrL+6d0r3ZnwxC/Kg7UGjUsyIxnoaXcQwnADozLk3WxZ1osqlXRkn3UYhudSaPi4qksb/CxtVACsINajAOjAAd2thbfREt2KZcXToM77yN6k+akMjNaKgSUAOzhhbXP6mLQqNQNz4VFbuq9pNagQUEC+suMBYt2QkuFgBKAPdT5AjAPf1AXiyal9tpES/aATHShzpxZieVopzBQArALxN3izePQsHhtNdqxg1orre6+WnPm9OT0SmNntFQYKAHYRQ2/bT8LUKdXWz3MxuO9oc6YUfE410t+twQlAPuUYOSpjUmDghvw+9GOecDA2eMNmZV4vq2rZw+0UygoAdgHRgEluAs/o49NY7oI7RhHnfZzj8aQOXF5GXopHJQA3ABuQt/QxqYhwQjgz1ZOEWLV2iydIZMqhXEF7RQOSgBuMLqduD4+TaktjOegHXOozQl0ZkwJhl6/Bhsto26KByUAd4CRqNU9MEqBXIZWzKE+S9SZMSYulqKVQkIJwB08Hi/UxqghsVD+EK2YoVJpbA8FPzneiDmJ59lhGdwrPUEoAbjDjAWNnWw+DISy/z7zqCU7op308QPrH/9ch1YKCyUAt4CY/M64GDUqP4i70Er6tIayR2fClPyg91i0UlgoAbiFF9Tfq4tVc6o10Er6sLB2hd5E+oL5znMzq40ZaKWwUAJwCzUE97i9w0WhX/wvWkmbkRbGxUM6E0bEReGDTUEJwD3UuhRtzJoQl381sh6gPZS7aw0YEiSfT6GVQkMJwD0Y7/2ILmaNiYv90Up6eJF8n7ZwMxp2ckNEC1ACcA91lj90wo2auDUiFsn0n43ZPD6ZheJOtFF4KAG4iReKAV3smpGBY/D8SF6lLzx9lXJ6zt9koATgJiwSp+li14Rgenwj2kgPuAvfqyvchKx++ugYlADcxOM1a5/IMy4fS/XoMLUhIgwz7ByOAHMrP2p4aKXwUAJwk+ZGIaF8ThvD6Wu4NYw70ErytIXL5mgKNSMufos2CIASgLtAvFp7DgBT9ABtJI/H46N1hZoQzG++jTYIgBKAu8Ao+XxdDJsQ4/HxaCN5WBBbewPgcbkEbRAAJQB38Xl8nDaGDQhulGegjeSBTnixrlATMvqxQwagBOAupWqtrIthE2JcXoU2kgcSwE91hZpQB6+1og0CoATgLs3vAkJh6UGguA1tJA8ML9bqC01df0ILBEIJwG0gZu8eF8NGBH30cfW9DtpIkIULp0F2eV5XaNpioTC740kGoATgNh4X1+hiOX2J4VSODPOCuq8vMH3BvGYV2iAQSgBuwyJxhi6WTaijK9571EWCtNt8sBH21tAGgVACcBu4aS3SxbIJsah+ENpIDtZVq+oKM6FWHh+NNgiEEoDb+IF8ty6WjSiS70MbyVEKxL9oCzOgUhC/E20QCCUAt7G6ajYQn0AbyeFbHNK0V+v7oA0CoQTgNmrXal0smxALpEQbyeFx+TldYSb0hlBORxsEQgnAbWYtWLSDx+18OOdH4jS0kRylMP6CrrC0xbhYr84hQBsEQgnAfbzQ1iah4jy0kBwsFGfpC0tZXDyVzsKGbEMJwH3g5vVHbUynr+RPDGah7NcUZEL3owViDJQA3IdxeYcmntMXl5eiheSAH3zRZgWZEBd3oQViDJQA3Adid0gb0ykLbtZXooXkgB9q6egjcTtaIMZACcB9IH6tfDwH0/XvoYXk8CKxWleYAa1BC8QYKAG4D8Supa9nRfJnZ1ICcAtKAO4DsWsrASR/PawlAJhHoQViDJQA3Afi19IUQF6NFpID5hXf0hWWthgXv0ILxBgoAbgPdMQ1uphOW+k8AwjFN3SFpS3G5X1ogRgDJQD3gdHr7bqYNqDL0EJyeFyeqykodcEI4FG0QIyBEoD7wM3rt7qYTlvQZ5LfQRtGAF/WFZa2oDJPd5s49jhjUAJwHxiKP6qL6bQF5fajheSAbHayrrDUxcXGPSqNV6MNAqEE4DiNxnZw07SzhV4kkt8aHLJKr64wE+qoLt0NbRAIJQC32aOyeGddLBsRFyeijeTwQ/FRbWEG1MZrc9EGgVACcJv26tJ9dLFsQn5U+wzaSA6fx0foCjMhn4vD0QaBUAJwGy+MuS6WjSiQH0IbyaG25dIWZkAw/fg02iAQSgBuw7j8iC6WjYjXQrSRHKyr9x+1hZnR6WiDQCgBuI21h+YgFi07AG0kB6s0XuuFdrY4ghFA8p83ZhxKAG4DfeWbulg2IT/q8dBGssAPf2J8YSYECeBOtEAglADcBkYAP9fFctpiXDw7Ja11M9aWNnKxvlxeOA1tEAAlAIdprgGwdrO8F10kD/zwq3WFGhEX+6MNAqAE4C4d1eW7aWPYgGAE8AO0kTw+l1/VFWpEUQqvNjIMJQB3KXFxuDaGjUh8A20kj3odpy80fbFQnok2CIASgLt4gTxJF8MmBCOAOtpIHq8qIl2hJgQJ4Ca0QQCUANzF5lQZyn4/2kieXReImbpCTUh9Fbhvd+NVaKXwUAJwlhaI1Ud0MWxCftSzH/pIhRaPi6d0BZuQH4gD0UfhoQTgJq3VurVvAGD+v37WgrN3QCvpAAXdvHnBZsS4jNFG4aEE4CZw9/+ULnZNiPH4DrSRHlDBlbrCDSn57Y4zCiUAN4EYvWxczJoTl/+FNtLDC+NPags3IPUcYOa8JTuilUJDCcA91CG2EKOP6WLXhFgQJ38s+HjaeM9cXeGmVIrEoWil0FACcA8WyoN1MWtMvDf5rwDHox4yeKF4VmvAjM5HK4WGEoB7QGyePi5Wzam5dd7indFKutj60KEpLh5Ua63RSmGhBOAc6g3ZXdqYNSAYfaT/APAFWCDP1JkwJRb1HoRWCgslALfwo/p+ulg1JRaksBPwlvAi+T6dCXOKz0YrhYUSgFuwSJyij1VDSmMbsC3RwWutas6hNWJCXD44pdLYHu0UEkoALjGihv9WDgFBDbeHcnc0YwYvFLdpjBhTKSj22wBKAO7AovpBuhg1Ji5/CzZaRt0YwgtrVk4K2iTxHbRSSCgBuAOzdG7mC2Jc9qEVc1jd9liJi/VeUPfRTuGgBOAG0yuLd4YO+DdtjBoSlH8k2jHH6HoAuW68GbMSy9FO4aAE4AbQ+RbpY9OYnjP2/n88LJJXaQyZE5dri7pXICUAB2g0toME8GttbJoSFzeiG/PAHfjjWlMm1RV/EO0UCkoA9lEPorUxaVCsS/SiHfOU5i9rt/o6sCkxAFbMPgF1AEoA9mFc/EAfk+bEqrVZaMcOMAy3tj/Ai0rjKCTHoQRgFz+qvU0biybFxe1oxx4lLj6jNWdSXPwE7RQGSgB2gZj7H20smlTgwEPw1jDusD8NABVsFEAJwB4w7ZwHsnJM3iaJYevD/xdgobhBb9KcWChvUUsy0VLuoQRgD7jhfV8Xg0bF5Rq0Yx9m8yjkMUp1S2THoARgh9ZIBrrYMy3GexehJfu0vid+ne3VUErg4e5yub8Q6wIoAVhAvfcP5a262DMpuNE9l9oJwJMF5uAX6swaF4+XoKVcQwnAPE6sewFBArgCLbmD9f3QNulJtT4BbeUWSgBmmVldMoNZPPBjrBzdF3OkBTLTnTrDpgU+LkFTuYUSgFng7n+eLtZMC6a59zm7JR7jteN1ps1LDHuBiNBWLqEEYA6Ip3kelxv0sWZWLBACbbkHqzReCyafHG/ahmAUcK8f9bwGreUOSgBmmLVg0Q7ujGzlM+2VpSW05iYsjK1uGDpWpVCcg7ZyByUAM0AcfWF8XNlTimf/J4U/X+4JRp/XV8C4hllUq6K1XEEJIH08Xnu7x4UTQ3/QMHjZH625jcfjSzUVsCMu71dPcNFabqAEkC7N6SwX92hjyoa4vBatuU8piDvBtOW10psEc7gr87ZMmBJAqqg3Wt/SxZIttXXJd6G3bADZ0/7XUmMVxD1oLRdQAkgPmMI6seDnRXH5Y7SWHZz4XnqMWCifU9s3o73MQwkgHVi07AD1tF0XQ9aU1VfakLncGgVw+eCMYNmuaC/TUAJInrYFdca4+L02dmyJy5vBWjanr6NHidv+bvqlgrndQPsRjX9Ai5mFEkCy7NvdeBV0/ht1MWNTfiQDtJhNoMNdoauYVUViddZPGKYEkCgtLIy/ro0Vi4K+cwP6yy7tlfo+UJnnxlfOvsSX0WImoQSQHDDM/pw+RmxKbCxxORstZhuojBMfUmymQC5Gi5mDEkAy4BN/p6apTXFxMVrMPurhCjT0E9qKWpUYZpE4Bm1mCkoA2w7j8kiIAVdWrb4oxsXTxk/7TRsYZi3RVda6uNhQCsUH0GZmoASwbfhcHA4x+XdtTFgWJIBT0GZ+KC/snwYNbvcYpS2ouUbAxgGL2wAlgMnDDhHzoZM9q4sF21KvIWcetWRHtJov1CsNqKR7862m1FAwO8eMUQKYHBCD72ahm51fyQ/ku9FqPoFOdpGu4k5ITQci8W9o1WkoAWw96hxJuMM6+EZqVDAKvRKt5pfmaqtQ/EXXAI5omIWxRLvOQglg62BR7wkwyrN/gM0WJdbl7sHflmBh7cP6RnBIkTx3SvfqqWjZOSgBTJBGY7sSF1/UXmOHxCJ5AjouBC0w3L5G1xCO6eoZCxbthJ6dghLAK6OWfHtcXqa5rk4JpiU/zPrK1K1m9ExB+ZiuQVwSC+WvPF57A9p2BkoAL8+MipgJ125Ad02dEpd/dTG+jKDev2sbxTExSFSlrvgwtO0ElAC2jB/1BND5/6y7ls6J1xai7WLCQnGJtmFcExcbfS5Oc+W5ACUADTCMhmu1zMXVfTrB0P974LowB9pq2aOyeGdoiPt0DeSiwOuPXXhaSwngpajToGA4fb3umrkp8YB6I4b2i00rr82Fi+fksky9xBNeID+E9q1ACWATXiTfB0P+R/XXykFxscHn8hC0TyigU31W21gui8vLbGVxSgAvntfn1OadE5NoYBWITYy0lELxXX2DuSzxFxb0Hmt61+GCJwAVK+oB8p82vx6uS1w3pbvb2fUlVlHv3JkjxzBttbj4sR/V98OqpE5n/9Dlus5oQ50rB65BW6lT4rW9oK2/r70Gjgti+948nlGRKCW+dC9oLAf3DpiIxPNwkc/a/eDaLlid9Gg0tpu7as2b56wYOK7cP3ge3IV/Anq83Dc0rOukyWhwpNw3+ASU8VMoawXoY7MvuPUt3avTfzOibg7Qxl/I1rOiTYKpytMs6j0Aq0O8HKVAHKoelOgaMgtS3zqAemfOM/5ZZ8tbVvzUO6D/tneUVw5+EDptbU7f0FnQaS+FTnsDdNhbOvsG7oLRw1rozA939g09pQR//gj82f2gu5p/p3/o/+Dfrobf/1rnioFl5VXNn3Xw2y74pT9lxOxUp7lZZyg+DR3oYV1bZ0NimAW1bqwSMRG8MF6sb8zsCIJ2rReJT6ggxmoRE6XS2L6Ni2OgDTPzinjLEsuxVsTW4PH4XH2DZktwB/u9F4hPWBgRZA51HLcfio9Cp/mNri2zJ/HNvB1LZ47u1VNZKK/UN2z21FyeGsiTvKDuYw0JpIPXWtVn2NBGD+jaLouCxH8Djf62kdEvusTNugbOqiAwnoU6XayOT8NqFpbS/LiT8fjr0PGf1rVVdiVudfVL0syBCz5+oW/ojIuL22Gqs4Qd1tuG1c09zU1hAnkC1H1I2yaZF0xfaJSXLKzS25afeaFOzVeIN5RC+bE8rhFvJvGo91iPy2shmTu7Ldc2i4u1fkXuidUmkqSta/kezQdquobPk9QrUC5+7EViaXu1vg9WP3OUwviNpSBerBIbDPHz2+lfEBcPqTpj9Yk0YF29/wiN/YfNGj/Har5ODMU3S1we19EV7+3k7jHgiVVrs8DrMXCX/3o+Xt9thaDzt2Y4WWcKtYNK4QJsjOCO+hcIuO97QfyFtijubgvq+5p82lwuL5zWMT/eW52lwHh8KiSn6+C/M7xQZxtFnd88ajoAgXeP9oIUUc15tbgL/vtataGpeqUGifJoUKiWoKo9DHYJ5fRKpbF9d3f31AbcscdK/Z76M/V3OqrLd2Nd8q3Ncxy4+Ffo5DH87HPgv6+Bjv5rSL7rNyu/qOLij2rkg2FJmEQ9GIS7YT7fDqSpZgcW616i0TX2jh7a4qrEb9SNCMORsMHuh9d2geDN1ToBUgakXmHSqz43UIuFYCTw39oLRSIlLJgG/W/re+LXYfgRTtC9empevh0guasSl/9By3sdxufiMzAlyOynxCRHxcUwxFYdQow+7HEdxmsLPLVxp+5CkkhbKRjy/40F4igMLyILqAUzLKvbi5HcERf3gPbHsCKyROs74teVQvfPhiM5Ki6vnX64ge3diDQZaYELuWT03bfmIpNIm0mdLCSWF+7AzjzTFsZz4OL+bvOLTSKNEZf3l4L4nRg2RJ6YsaCxE+Pi29oLTyJxebnamQjDhcgr6lCJ5gc1uiAgFVFPskgeC6FBr/iKgjpM0ufyKk0wkIokLq934bBXwhJeNT6aZelgSVJCUutExMdpx15iSnulUVJLPNVqL32wkHKkYcblf7LDGoXZg5GYIDASOJhx8UtN0JByIbVZp4jwchPE5qjdbprfE9BDwjzpSRYIQR/xEBNmZrUxg4XiLBguZvIwSlJTapek8+m7fWLS+FHP65trB7jYqAkwkpsaLvH4crVvIV5Ggtg24C7yFo+r7wooEbgrMQyJ+hq16hMvG0Eki/oyDKYG34Ffac8BVwSjMxilXUEdnzBGidf2YqP739MzAmsS66HzX+xH9f3wshCEWdQDJi+IT4LpwYP6ICUlLRbKP0PyPXVGsGRXvAwEYRf1iqkU1j8Ad6UfQZDSgqJ09FMvkh+atWDRDtjsBOEe7dWl+0Ai+DIMTx/SBDFpKwRTrIdBX6NhPpE9Ko3tWVSreoG8CIL5yfHBTdqSxDoY5l/ic3G4WpiFrUkQ2WWPSuPVXhi/Rz20Aj2uD/wCi4unmmv0uTxSnfOAzUYQ+UPd1SAZcLXSEO52d4IK+MygWee7S6E4B9phPi3TJQpLR3XpbjDPPQY6xEXwa35PPeZiLXT2b/lcHufPl3ti9QmCGEOLOp3X5/E/q4dfMBf+GegZbYdyWOobCtCa5mlNPD4aOzx9e08QW4s6tls9BffC2gd9Lk6DhHAl6A4XEoPq6F7zyHB5Fdzhv6g6O6vKt9KQniDSBhKD2s6qLZLvgg74kVIQL1N3XBhmXwFzbLUe4U74ffUa7WnonFvxDYNQm2Y8A//uEdW54d/eqJIO/P55MGdfzgJ5LAzjD1F39fLCfnpKTxBOMzLS0t3dPbW5K/JhvW3qTHv1pdxYtR22fA+1T+IuoZze3b16qvo3+K8JgiAIgiAIgiAIgiAIgiAIgiAIgiAIgiCITDBlyv8DBGlniQq1Wq8AAAAASUVORK5CYII="></a>
    <p>Discover awesome. <a href="http://iobroker.net/" target="_blank">ioBroker</a></p>
</footer>
<script>
    document.getElementById('origin').value = window.location.search.replace('&error', '');
    var userLang = navigator.language || navigator.userLanguage;
    userLang = userLang.substring(0, 2).toLowerCase();
    var systemDictionary = {
        "wrongPassword": {
            "en": "Invalid username or password",
            "de": "Name oder Kennwort sind falsch",
            "ru": "Неверные имя пользователя или пароль",
            "pt": "nome de usuário ou senha inválidos",
            "nl": "ongeldige gebruikersnaam of wachtwoord",
            "fr": "Nom d'utilisateur ou mot de passe invalide",
            "it": "Nome utente o password errati",
            "es": "usuario o contraseña invalido",
            "pl": "Nieprawidłowa nazwa użytkownika lub hasło",
            "zh-cn": "用户名或密码无效"
        },
        "enterLogin": {
            "en": "Login name",
            "de": "Loginname",
            "ru": "Имя пользователя",
            "pt": "Nome de acesso",
            "nl": "Inlog naam",
            "fr": "Identifiant",
            "it": "Nome di login",
            "es": "Nombre de inicio de sesión",
            "pl": "Nazwa użytkownika",
            "zh-cn": "登录名"
        },
        "enterPassword": {
            "en": "Password",
            "de": "Kennwort",
            "ru": "Пароль",
            "pt": "Senha",
            "nl": "Wachtwoord",
            "fr": "Mot de passe",
            "it": "Parola d'ordine",
            "es": "Contraseña",
            "pl": "Hasło",
            "zh-cn": "密码"
        },
        "login": {
            "en": "Log in",
            "de": "Log in",
            "ru": "Войти",
            "pt": "Entrar",
            "nl": "Log in",
            "fr": "S'identifier",
            "it": "Accesso",
            "es": "Iniciar sesión",
            "pl": "Zaloguj Się",
            "zh-cn": "登录"
        },
        "title": {
            "en": "Admin",
            "de": "Admin",
            "ru": "Вход в админ"
        }
    };

    if (window.location.search.indexOf('error') !== -1) {
        document.getElementById('error').innerHTML      = systemDictionary.wrongPassword[userLang]  || systemDictionary.wrongPassword.en;
        document.getElementById('error').style.display  = '';
    }
    document.getElementById('username-label').innerHTML = systemDictionary.enterLogin[userLang]     || systemDictionary.enterLogin.en;
    document.getElementById('password-label').innerHTML = systemDictionary.enterPassword[userLang]  || systemDictionary.enterPassword.en;
    document.getElementById('login-label').innerHTML    = systemDictionary.title[userLang]          || systemDictionary.title.en;
    document.getElementById('submit-label').innerHTML   = systemDictionary.login[userLang]          || systemDictionary.login.en;

    var inputs = document.getElementsByTagName('INPUT');
    if (inputs) {
        /*for (var i = 0; i < inputs.length; i++) {
            inputs[i].addEventListener('blur', function() {
                if (this.value) {
                    if (this.className.indexOf('used') === -1) {
                        this.className += ' used';
                    }
                } else {
                    this.className = this.className.replace(/\s?used/, '');
                }
            });
        }*/
        setTimeout(function () {
            if (document.getElementById('username').value) {
                document.getElementById('password').focus();
                setTimeout(function () {
                    if (!document.getElementById('username').value) {
                        document.getElementById('username').focus();
                    }
                }, 300);
            } else {
                document.getElementById('username').focus();
            }
        }, 300);
    }

    document.getElementById('username').addEventListener('keydown', function (e) {
        if (e.keyCode === 13) {
            e.preventDefault();
            setTimeout(function () {
                document.getElementById('password').focus();
            }, 100);
        }
    });
    document.getElementById('password').addEventListener('keyup', function (e) {
        if (e.keyCode === 13) {
            document.getElementById('submit').click();
        }
    });

    function animationEnd () {
        this.className = this.className.replace(/\s?is-active/, '');
    }

    var ripples = document.getElementsByClassName('ripples');
    if (ripples) {
        for (var r = 0; r < ripples.length; r++) {
            ripples[r].addEventListener('click', function (e) {
                var $parent = this.parentElement.parentElement;
                var $offset = {top: $parent.offsetTop, left: $parent.offsetLeft};
                var $circle = this.getElementsByClassName('ripplesCircle')[0];

                var x = e.pageX - $offset.left;
                var y = e.pageY - $offset.top;

                $circle.style.top   = y + 'px';
                $circle.style.left  = x + 'px';

                if (this.className.indexOf('is-active') === -1) {
                    this.className += ' is-active';
                }
            });

            ripples[r].addEventListener('webkitAnimationEnd',   animationEnd);
            ripples[r].addEventListener('mozAnimationEnd',      animationEnd);
            ripples[r].addEventListener('MSAnimationEnd',       animationEnd);
            ripples[r].addEventListener('oanimationend',        animationEnd);
            ripples[r].addEventListener('animationend',         animationEnd);
        }
    }
</script>
</body>
</html>