SHA256
Обновить UI кошелька и регистрацию
This commit is contained in:
@@ -14,7 +14,7 @@ import {
|
||||
PASSWORD_WORDS_COUNT,
|
||||
} from '../services/password-words.js';
|
||||
import { openRegistrationFaq } from './registration-faq-view.js';
|
||||
import { defaultServerHttp, defaultServerLogin } from '../deploy-config.js';
|
||||
import { defaultServerHttp } from '../deploy-config.js';
|
||||
|
||||
export const pageMeta = { id: 'register-view', title: 'Зарегистрироваться', showAppChrome: false };
|
||||
|
||||
@@ -125,9 +125,7 @@ export function render({ navigate }) {
|
||||
serverNotice.className = 'card stack';
|
||||
serverNotice.innerHTML = `
|
||||
<p class="field-label">Первый сервер SHiNE</p>
|
||||
<p class="meta-muted">Сейчас вашим первым и основным сервером будет серверный аккаунт <strong>${state.entrySettings.shineServerLogin || defaultServerLogin}</strong>.</p>
|
||||
<p class="meta-muted">Текущий адрес этого сервера: <strong>${state.entrySettings.shineServerHttp || defaultServerHttp}</strong>.</p>
|
||||
<p class="meta-muted">Это первый сервер, на который вам будут писать и звонить после регистрации. Позже его можно будет сменить, а в будущем использовать и несколько серверов сразу.</p>
|
||||
<p class="meta-muted">При регистрации адресом вашего первого сервера будет: <strong>${state.entrySettings.shineServerHttp || defaultServerHttp}</strong>.</p>
|
||||
`;
|
||||
|
||||
const faqCard = document.createElement('div');
|
||||
@@ -351,10 +349,12 @@ export function render({ navigate }) {
|
||||
state.registrationDraft.preGeneratedKeyBundle = null;
|
||||
}
|
||||
|
||||
renderSecurityConfirmStage();
|
||||
startGenerationStage();
|
||||
});
|
||||
|
||||
function renderInputStage() {
|
||||
serverNotice.style.display = '';
|
||||
faqCard.style.display = '';
|
||||
form.innerHTML = `
|
||||
<label class="stack"><span class="field-label">Логин</span></label>
|
||||
<label class="stack registration-password-single"><span class="field-label">Пароль</span></label>
|
||||
@@ -363,19 +363,26 @@ export function render({ navigate }) {
|
||||
passwordField = form.children[1];
|
||||
loginField.append(loginInput);
|
||||
passwordField.append(passwordInput);
|
||||
form.append(passwordModeToggle, wordsSection, passwordLengthText, serverNotice, checkButton, statusText, faqCard, formError);
|
||||
form.append(passwordModeToggle, passwordLengthText, wordsSection, statusText, checkButton, formError);
|
||||
actions.innerHTML = '';
|
||||
actions.append(backButton, nextButton);
|
||||
updatePasswordModeVisibility();
|
||||
syncDraftState();
|
||||
}
|
||||
|
||||
function renderSecurityConfirmStage() {
|
||||
async function startGenerationStage() {
|
||||
serverNotice.style.display = 'none';
|
||||
faqCard.style.display = 'none';
|
||||
const runId = ++generationRunId;
|
||||
form.innerHTML = '';
|
||||
|
||||
const info = document.createElement('p');
|
||||
info.className = 'auth-copy';
|
||||
info.textContent = 'Для повышения безопасности мы генерируем секрет из вашего логина и пароля с помощью Argon2id.';
|
||||
const title = document.createElement('p');
|
||||
title.className = 'auth-copy';
|
||||
title.textContent = 'Для повышения безопасности мы генерируем секрет из вашего логина и пароля с помощью Argon2id.';
|
||||
|
||||
const subtitle = document.createElement('p');
|
||||
subtitle.className = 'meta-muted';
|
||||
subtitle.textContent = 'Процесс запускается сразу: из этого секрета будут вычислены recovery key, root key, blockchain key и client key.';
|
||||
|
||||
const details = document.createElement('p');
|
||||
details.className = 'meta-muted';
|
||||
@@ -383,45 +390,11 @@ export function render({ navigate }) {
|
||||
|
||||
const details2 = document.createElement('p');
|
||||
details2.className = 'meta-muted';
|
||||
details2.textContent = 'Из этого секрета строятся recovery key, root key, blockchain key и client key. Это может занять некоторое время.';
|
||||
details2.textContent = 'Замедление нужно специально: оно усложняет подбор пароля и повышает цену атак на видеокартах и GPU.';
|
||||
|
||||
const details3 = document.createElement('p');
|
||||
details3.className = 'meta-muted';
|
||||
details3.textContent = 'Замедление нужно специально: оно усложняет подбор пароля и повышает цену атак на видеокартах и GPU.';
|
||||
|
||||
const details4 = document.createElement('p');
|
||||
details4.className = 'meta-muted';
|
||||
details4.textContent = `Длина вашего текущего пароля: ${getCurrentPassword().length} символов.`;
|
||||
|
||||
form.append(info, details, details2, details3, details4);
|
||||
|
||||
const back2 = document.createElement('button');
|
||||
back2.className = 'ghost-btn';
|
||||
back2.type = 'button';
|
||||
back2.textContent = 'Назад';
|
||||
back2.addEventListener('click', renderInputStage);
|
||||
|
||||
const ok = document.createElement('button');
|
||||
ok.className = 'primary-btn';
|
||||
ok.type = 'button';
|
||||
ok.textContent = 'Окей';
|
||||
ok.addEventListener('click', startGenerationStage);
|
||||
|
||||
actions.innerHTML = '';
|
||||
actions.append(back2, ok);
|
||||
}
|
||||
|
||||
async function startGenerationStage() {
|
||||
const runId = ++generationRunId;
|
||||
form.innerHTML = '';
|
||||
|
||||
const title = document.createElement('p');
|
||||
title.className = 'auth-copy';
|
||||
title.textContent = 'Генерация ключей...';
|
||||
|
||||
const subtitle = document.createElement('p');
|
||||
subtitle.className = 'meta-muted';
|
||||
subtitle.textContent = 'Генерируется секрет из вашего пароля, из которого будут вычислены все ключи.';
|
||||
details3.textContent = `Длина вашего текущего пароля: ${getCurrentPassword().length} символов.`;
|
||||
|
||||
const progressWrap = document.createElement('div');
|
||||
progressWrap.className = 'registration-progress';
|
||||
@@ -438,7 +411,7 @@ export function render({ navigate }) {
|
||||
genError.className = 'status-line is-unavailable';
|
||||
genError.style.display = 'none';
|
||||
|
||||
form.append(title, subtitle, progressWrap, progressText, genError);
|
||||
form.append(title, subtitle, details, details2, details3, progressWrap, progressText, genError);
|
||||
|
||||
const cancelBtn = document.createElement('button');
|
||||
cancelBtn.className = 'ghost-btn';
|
||||
@@ -446,7 +419,7 @@ export function render({ navigate }) {
|
||||
cancelBtn.textContent = 'Отмена';
|
||||
cancelBtn.addEventListener('click', () => {
|
||||
generationRunId += 1;
|
||||
renderSecurityConfirmStage();
|
||||
renderInputStage();
|
||||
});
|
||||
actions.innerHTML = '';
|
||||
actions.append(cancelBtn);
|
||||
@@ -477,7 +450,7 @@ export function render({ navigate }) {
|
||||
} catch (error) {
|
||||
if (runId !== generationRunId) return;
|
||||
if (String(error?.message || '') === 'DERIVE_CANCELLED') {
|
||||
renderSecurityConfirmStage();
|
||||
renderInputStage();
|
||||
return;
|
||||
}
|
||||
genError.textContent = `Ошибка генерации ключей: ${error?.message || 'неизвестная ошибка'}`;
|
||||
@@ -491,7 +464,7 @@ export function render({ navigate }) {
|
||||
goBack.className = 'ghost-btn';
|
||||
goBack.type = 'button';
|
||||
goBack.textContent = 'Назад';
|
||||
goBack.addEventListener('click', renderSecurityConfirmStage);
|
||||
goBack.addEventListener('click', renderInputStage);
|
||||
actions.innerHTML = '';
|
||||
actions.append(goBack, retry);
|
||||
}
|
||||
@@ -505,6 +478,8 @@ export function render({ navigate }) {
|
||||
leftAction: { label: '←', onClick: () => navigate('start-view') },
|
||||
}),
|
||||
form,
|
||||
serverNotice,
|
||||
faqCard,
|
||||
actions,
|
||||
);
|
||||
|
||||
|
||||
Reference in New Issue
Block a user