SHA256
UI: адаптация шапки «Связи», кнопка поиска каналов, локальный тестовый вход
- Связи: верхняя панель не выходит за границы экрана — кнопки назад/Найти/«?» не обрезаются на узких устройствах; заголовок сокращается вместо сдвига кнопок. - Каналы: emoji-иконка поиска заменена на контурную кнопку-лупу в стиле панели (подсказка «Найти канал»); окно поиска без изменений. - Локальный тестовый вход: на localhost/127.0.0.1/::1 — кнопка демо-входа (сеанс local-tester, автономные локальные состояния ЛС/каналов/профиля, без сервера и пароля); на shineup.me и тестовых доменах кнопка отсутствует. - Заметки на ручную проверку добавлены в Dev_Docs/Pending_Features. - VERSION: client 1.2.262. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Pixel
@@ -14,7 +14,6 @@ import {
|
||||
PASSWORD_WORDS_COUNT,
|
||||
} from '../services/password-words.js';
|
||||
import { openRegistrationFaq } from './registration-faq-view.js';
|
||||
import { defaultServerHttp } from '../deploy-config.js';
|
||||
|
||||
export const pageMeta = { id: 'register-view', title: 'Зарегистрироваться', showAppChrome: false };
|
||||
|
||||
@@ -53,21 +52,18 @@ function createWordsLayout({ words, onInput }) {
|
||||
hint.textContent =
|
||||
'Здесь можно ввести любые слова на любых языках. Мы не проверяем орфографию. Можно заполнить все 12 полей или только часть. В конце всё склеивается в один пароль длиной до 256 символов.';
|
||||
|
||||
const preview = document.createElement('p');
|
||||
preview.className = 'status-line';
|
||||
|
||||
section.append(grid, hint);
|
||||
return { section, inputs, preview };
|
||||
return { section, inputs };
|
||||
}
|
||||
|
||||
export function render({ navigate }) {
|
||||
const screen = document.createElement('section');
|
||||
screen.className = 'stack';
|
||||
screen.className = 'stack registration-screen';
|
||||
|
||||
clearAuthMessages();
|
||||
|
||||
const form = document.createElement('div');
|
||||
form.className = 'card stack';
|
||||
form.className = 'card stack registration-form';
|
||||
|
||||
let passwordMode = String(state.registrationDraft.passwordMode || 'single') === 'words' ? 'words' : 'single';
|
||||
let passwordWords = normalizePasswordWords(state.registrationDraft.passwordWords);
|
||||
@@ -95,7 +91,6 @@ export function render({ navigate }) {
|
||||
const {
|
||||
section: wordsSection,
|
||||
inputs: wordInputs,
|
||||
preview: wordsPreview,
|
||||
} = createWordsLayout({
|
||||
words: passwordWords,
|
||||
onInput: (index, value) => {
|
||||
@@ -118,53 +113,22 @@ export function render({ navigate }) {
|
||||
passwordModeToggle.append(passwordModeCheckbox, passwordModeLabel);
|
||||
|
||||
const statusText = document.createElement('p');
|
||||
statusText.className = 'meta-muted';
|
||||
statusText.textContent = 'Проверка логина: не выполнена';
|
||||
|
||||
const serverNotice = document.createElement('div');
|
||||
serverNotice.className = 'card stack';
|
||||
serverNotice.innerHTML = `
|
||||
<p class="field-label">Первый сервер SHiNE</p>
|
||||
<p class="meta-muted">При регистрации адресом вашего первого сервера будет: <strong>${state.entrySettings.shineServerHttp || defaultServerHttp}</strong>.</p>
|
||||
`;
|
||||
|
||||
const faqCard = document.createElement('div');
|
||||
faqCard.className = 'card stack registration-faq-card';
|
||||
|
||||
const faqTitle = document.createElement('p');
|
||||
faqTitle.className = 'field-label';
|
||||
faqTitle.textContent = 'Частые вопросы перед регистрацией';
|
||||
|
||||
const faqText = document.createElement('p');
|
||||
faqText.className = 'meta-muted';
|
||||
faqText.textContent = 'Если хотите подробнее понять схему деривации, ключи, первый сервер и формат 12 слов, откройте отдельный экран с вопросами.';
|
||||
statusText.className = 'status-line registration-login-status';
|
||||
statusText.style.display = 'none';
|
||||
|
||||
const faqButton = document.createElement('button');
|
||||
faqButton.className = 'ghost-btn';
|
||||
faqButton.className = 'registration-faq-link';
|
||||
faqButton.type = 'button';
|
||||
faqButton.textContent = 'Частые вопросы';
|
||||
faqButton.textContent = 'Вопросы о регистрации';
|
||||
faqButton.addEventListener('click', () => openRegistrationFaq(navigate, 'key-derivation'));
|
||||
|
||||
faqCard.append(faqTitle, faqText, faqButton);
|
||||
|
||||
const formError = document.createElement('p');
|
||||
formError.className = 'status-line is-unavailable';
|
||||
formError.style.display = 'none';
|
||||
|
||||
const checkButton = document.createElement('button');
|
||||
checkButton.className = 'ghost-btn';
|
||||
checkButton.type = 'button';
|
||||
checkButton.textContent = 'Проверить логин';
|
||||
|
||||
const actions = document.createElement('div');
|
||||
actions.className = 'auth-footer-actions';
|
||||
|
||||
const backButton = document.createElement('button');
|
||||
backButton.className = 'ghost-btn';
|
||||
backButton.type = 'button';
|
||||
backButton.textContent = 'Назад';
|
||||
backButton.addEventListener('click', () => navigate('start-view'));
|
||||
|
||||
const nextButton = document.createElement('button');
|
||||
nextButton.className = 'primary-btn';
|
||||
nextButton.type = 'button';
|
||||
@@ -172,10 +136,12 @@ export function render({ navigate }) {
|
||||
|
||||
let passwordField = null;
|
||||
const passwordLengthText = document.createElement('p');
|
||||
passwordLengthText.className = 'status-line';
|
||||
passwordLengthText.className = 'password-length-hint';
|
||||
let lastCheckedLogin = '';
|
||||
let lastCheckedFree = false;
|
||||
let lastCheckedClassName = '';
|
||||
let loginCheckTimer = null;
|
||||
let loginCheckRunId = 0;
|
||||
let generationRunId = 0;
|
||||
|
||||
function getCurrentPassword() {
|
||||
@@ -185,7 +151,6 @@ export function render({ navigate }) {
|
||||
function updateWordsPreview() {
|
||||
const password = getCurrentPassword();
|
||||
const text = `Итоговая длина пароля: ${password.length} символов.`;
|
||||
wordsPreview.textContent = text;
|
||||
passwordLengthText.textContent = text;
|
||||
}
|
||||
|
||||
@@ -207,7 +172,8 @@ export function render({ navigate }) {
|
||||
async function runAvailabilityCheck() {
|
||||
const login = loginInput.value.trim();
|
||||
if (!login) {
|
||||
statusText.textContent = 'Введите логин';
|
||||
statusText.textContent = '';
|
||||
statusText.style.display = 'none';
|
||||
formError.style.display = 'none';
|
||||
return false;
|
||||
}
|
||||
@@ -229,12 +195,15 @@ export function render({ navigate }) {
|
||||
statusText.textContent = 'Логин нельзя использовать для обычной регистрации ❌';
|
||||
statusText.className = 'status-line is-unavailable';
|
||||
}
|
||||
statusText.style.display = '';
|
||||
formError.style.display = 'none';
|
||||
return lastCheckedFree && lastCheckedClassName === 'free';
|
||||
}
|
||||
|
||||
checkButton.disabled = true;
|
||||
checkButton.textContent = 'Проверка...';
|
||||
const runId = ++loginCheckRunId;
|
||||
statusText.className = 'status-line registration-login-status';
|
||||
statusText.textContent = 'Проверяем логин...';
|
||||
statusText.style.display = '';
|
||||
try {
|
||||
const check = await checkLoginExistsOnSolana({
|
||||
login,
|
||||
@@ -255,6 +224,7 @@ export function render({ navigate }) {
|
||||
precheckWarning = formatSolanaErrorDetails(precheckError);
|
||||
}
|
||||
}
|
||||
if (runId !== loginCheckRunId) return false;
|
||||
lastCheckedLogin = login;
|
||||
lastCheckedFree = isFree;
|
||||
lastCheckedClassName = className;
|
||||
@@ -276,25 +246,31 @@ export function render({ navigate }) {
|
||||
statusText.textContent = 'Логин нельзя использовать для обычной регистрации ❌';
|
||||
statusText.className = 'status-line is-unavailable';
|
||||
}
|
||||
statusText.style.display = '';
|
||||
formError.style.display = 'none';
|
||||
return isFree && className === 'free';
|
||||
} catch (error) {
|
||||
if (runId !== loginCheckRunId) return false;
|
||||
const base = toUserMessage(error, 'Не удалось проверить логин');
|
||||
const details = formatSolanaErrorDetails(error);
|
||||
statusText.textContent = `${base}. Детали: ${details}`;
|
||||
statusText.className = 'status-line is-unavailable';
|
||||
statusText.style.display = '';
|
||||
return false;
|
||||
} finally {
|
||||
checkButton.disabled = false;
|
||||
checkButton.textContent = 'Проверить логин';
|
||||
}
|
||||
}
|
||||
|
||||
checkButton.addEventListener('click', runAvailabilityCheck);
|
||||
|
||||
loginInput.addEventListener('input', () => {
|
||||
syncDraftState();
|
||||
lastCheckedLogin = '';
|
||||
loginCheckRunId += 1;
|
||||
if (loginCheckTimer) window.clearTimeout(loginCheckTimer);
|
||||
statusText.textContent = '';
|
||||
statusText.style.display = 'none';
|
||||
if (!loginInput.value.trim()) return;
|
||||
loginCheckTimer = window.setTimeout(() => {
|
||||
runAvailabilityCheck();
|
||||
}, 450);
|
||||
});
|
||||
|
||||
passwordInput.addEventListener('input', () => {
|
||||
@@ -353,8 +329,6 @@ export function render({ navigate }) {
|
||||
});
|
||||
|
||||
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>
|
||||
@@ -362,17 +336,15 @@ export function render({ navigate }) {
|
||||
const loginField = form.children[0];
|
||||
passwordField = form.children[1];
|
||||
loginField.append(loginInput);
|
||||
passwordField.append(passwordInput);
|
||||
form.append(passwordModeToggle, passwordLengthText, wordsSection, statusText, checkButton, formError);
|
||||
passwordField.append(passwordInput, passwordLengthText);
|
||||
form.append(passwordModeToggle, wordsSection, statusText, formError);
|
||||
actions.innerHTML = '';
|
||||
actions.append(backButton, nextButton);
|
||||
actions.append(nextButton);
|
||||
updatePasswordModeVisibility();
|
||||
syncDraftState();
|
||||
}
|
||||
|
||||
async function startGenerationStage() {
|
||||
serverNotice.style.display = 'none';
|
||||
faqCard.style.display = 'none';
|
||||
const runId = ++generationRunId;
|
||||
form.innerHTML = '';
|
||||
|
||||
@@ -478,8 +450,7 @@ export function render({ navigate }) {
|
||||
leftAction: { label: '←', onClick: () => navigate('start-view') },
|
||||
}),
|
||||
form,
|
||||
serverNotice,
|
||||
faqCard,
|
||||
faqButton,
|
||||
actions,
|
||||
);
|
||||
|
||||
|
||||
Reference in New Issue
Block a user