{% extends "base.html" %} {% block title %}Nowe haslo - Norda Biznes Partner{% endblock %} {% block container_class %}container-narrow{% endblock %} {% block extra_css %} {% endblock %} {% block content %}

Ustaw nowe haslo

Wprowadz nowe haslo do swojego konta

  • Minimum 8 znakow
  • Wielka litera
  • Mala litera
  • Cyfra

Powrot do logowania

{% endblock %} {% block extra_js %} // Password toggle function function togglePassword(inputId, button) { const input = document.getElementById(inputId); const eyeOpen = button.querySelector('.eye-open'); const eyeClosed = button.querySelector('.eye-closed'); if (input.type === 'password') { input.type = 'text'; eyeOpen.style.display = 'none'; eyeClosed.style.display = 'block'; } else { input.type = 'password'; eyeOpen.style.display = 'block'; eyeClosed.style.display = 'none'; } } function showToast(message, type = 'info', duration = 4000) { const container = document.getElementById('toastContainer'); const icons = { error: '✕', info: 'ℹ' }; const toast = document.createElement('div'); toast.className = `toast ${type}`; toast.innerHTML = `${icons[type]||'ℹ'}${message}`; container.appendChild(toast); setTimeout(() => { toast.style.animation = 'toastOut 0.3s ease forwards'; setTimeout(() => toast.remove(), 300); }, duration); } const passwordInput = document.getElementById('password'); const passwordConfirm = document.getElementById('password_confirm'); const strengthBar = document.getElementById('strengthBar'); const submitBtn = document.getElementById('submitBtn'); passwordInput.addEventListener('input', function() { const password = this.value; let strength = 0; let validCount = 0; const hasLength = password.length >= 8; const hasUpper = /[A-Z]/.test(password); const hasLower = /[a-z]/.test(password); const hasDigit = /\d/.test(password); updateRequirement('req-length', hasLength); updateRequirement('req-upper', hasUpper); updateRequirement('req-lower', hasLower); updateRequirement('req-digit', hasDigit); if (hasLength) { strength++; validCount++; } if (hasUpper) { strength++; validCount++; } if (hasLower) { strength++; validCount++; } if (hasDigit) { strength++; validCount++; } strengthBar.className = 'password-strength-bar'; if (strength === 1 || strength === 2) { strengthBar.classList.add('weak'); } else if (strength === 3) { strengthBar.classList.add('medium'); } else if (strength === 4) { strengthBar.classList.add('strong'); } checkFormValidity(); }); passwordConfirm.addEventListener('input', checkFormValidity); function updateRequirement(id, valid) { const el = document.getElementById(id); if (valid) { el.classList.add('valid'); } else { el.classList.remove('valid'); } } const matchIndicator = document.getElementById('matchIndicator'); const matchIcon = document.getElementById('matchIcon'); const matchText = document.getElementById('matchText'); function checkFormValidity() { const password = passwordInput.value; const confirm = passwordConfirm.value; const hasLength = password.length >= 8; const hasUpper = /[A-Z]/.test(password); const hasLower = /[a-z]/.test(password); const hasDigit = /\d/.test(password); const passwordsMatch = password === confirm && confirm.length > 0; // Show match indicator only when user started typing confirmation if (confirm.length > 0) { matchIndicator.style.display = 'flex'; if (passwordsMatch) { matchIndicator.className = 'match-indicator match'; matchIcon.textContent = '\u2713'; matchText.textContent = 'Hasła są identyczne'; } else { matchIndicator.className = 'match-indicator mismatch'; matchIcon.textContent = '\u2717'; matchText.textContent = 'Hasła nie są identyczne'; } } else { matchIndicator.style.display = 'none'; } submitBtn.disabled = !(hasLength && hasUpper && hasLower && hasDigit && passwordsMatch); } document.querySelector('form').addEventListener('submit', function(e) { const password = passwordInput.value; const confirm = passwordConfirm.value; if (password !== confirm) { passwordConfirm.classList.add('error'); e.preventDefault(); showToast('Hasła nie są identyczne', 'error'); } }); {% endblock %}